/* ManziNetworks Media site styles
   Layout: left-aligned single column on deep indigo, taken from the media kit. The hero is a live TV playing the real format demos; proof and platforms follow, contact closes. */
:root{
  color-scheme:dark;
  --ground:#0B0A1E;     /* night indigo */
  --raised:#151338;     /* panels */
  --line:#2C2860;       /* hairlines */
  --text:#F2F1FB;
  --muted:#A5A2D0;
  --amber:#FFC21A;      /* media-kit headline yellow: the one accent */
  --orange:#FF6B1A;     /* media-kit orange, data marks only */
  --violet:#4B3BFF;     /* glow only */
  --on-amber:#1A1300;
  --display:"Archivo","Arial Narrow",Arial,sans-serif;
  --body:"Hanken Grotesk","Helvetica Neue",Arial,sans-serif;
  --s1:.5rem;--s2:1rem;--s3:1.5rem;--s4:2.5rem;--s5:4rem;--s6:7rem;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{overflow-x:clip}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{background:var(--ground);color:var(--text);font-family:var(--body);font-size:1.0625rem;line-height:1.6;-webkit-font-smoothing:antialiased}
.wrap{max-width:78rem;margin-inline:auto;padding-inline:clamp(16px,4vw,48px)}
a{color:inherit}
:focus-visible{outline:2px solid var(--amber);outline-offset:3px;border-radius:4px}
h1,h2,h3{font-family:var(--display);font-weight:800;font-stretch:118%;line-height:.98;margin:0;text-wrap:balance;letter-spacing:-.015em}
p{margin:0}
.lede{color:var(--muted);max-width:40rem}
.btn{display:inline-block;background:var(--amber);color:var(--on-amber);font:600 1rem var(--body);padding:.85rem 1.5rem;border:0;border-radius:999px;text-decoration:none;cursor:pointer}
.btn:hover{background:#FFD24D}
.quiet{color:var(--text);text-underline-offset:.3em;text-decoration-color:var(--amber)}

/* Header */
.top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--s2) var(--s4);padding-block:var(--s3)}
.mark{font-family:var(--display);font-weight:800;font-stretch:112%;font-size:1.35rem;text-decoration:none;letter-spacing:-.01em}
.mark{display:block;line-height:0}
.mark-svg{height:2.1rem;width:auto;display:block}
.foot-brand{display:flex;flex-direction:column;gap:var(--s2)}
.foot-svg{width:12rem;height:auto;display:block}
.top nav{display:flex;flex-wrap:wrap;gap:var(--s1) var(--s3);align-items:center;font-size:.95rem}
.top nav a{text-decoration:none;color:var(--muted)}
.top nav a:hover{color:var(--text)}
.top nav a.btn{color:var(--on-amber);padding:.55rem 1.1rem;font-size:.95rem}

/* Hero */
.hero{position:relative;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:var(--s5);align-items:center;padding-block:var(--s4) var(--s5)}
.hero::before{content:"";position:absolute;inset:-6rem -20vw auto auto;width:70vw;height:42rem;max-width:100vw;pointer-events:none;z-index:-1;
  background:radial-gradient(closest-side,rgba(75,59,255,.55),transparent),radial-gradient(28rem 18rem at 30% 80%,rgba(255,107,26,.18),transparent 70%)}
.hero{isolation:isolate}
.hero h1{font-size:clamp(2.9rem,7.2vw,6.4rem)}
.hero .lede{color:var(--text);font-size:clamp(1.05rem,1.5vw,1.25rem);margin-top:var(--s3);max-width:32rem}
.hero-actions{display:flex;flex-wrap:wrap;gap:var(--s3);align-items:center;margin-top:var(--s4)}
.tv{margin:0;display:flex;flex-direction:column;align-items:center;gap:0;min-width:0}
.bezel{width:100%;max-width:100%;aspect-ratio:16/9;background:#05040E;border-radius:14px;padding:8px;box-shadow:0 0 0 1px var(--line),0 50px 100px -40px rgba(75,59,255,.9)}
.bezel video,.bezel img{display:block;width:100%;height:100%;object-fit:cover;border-radius:6px;background:#05040E}
.stand{width:26%;height:12px;background:linear-gradient(#05040E,#14123A);border-radius:0 0 10px 10px}
.reel{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem;width:100%;margin-top:var(--s2);font-size:.9rem;color:var(--muted)}
.reel strong{color:var(--text);font-weight:600}
.dots{display:flex;gap:.4rem}
.dots button{width:2.25rem;height:1.75rem;padding:0;border:0;background:none;cursor:pointer;display:flex;align-items:center}
.dots button::before{content:"";display:block;width:100%;height:3px;border-radius:2px;background:var(--line)}
.dots button[aria-pressed="true"]::before{background:var(--amber)}

/* Proof row */
.proof{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s3);border-top:1px solid var(--line);padding-top:var(--s3)}
.proof div{display:flex;flex-direction:column;gap:.25rem;min-width:0}
.proof b{font-family:var(--display);font-weight:800;font-stretch:112%;font-size:clamp(2rem,4.4vw,3.4rem);line-height:1;color:var(--amber);font-variant-numeric:tabular-nums}
.proof span{color:var(--muted);font-size:.95rem}

/* Sections */
section{padding-block:var(--s6) 0}
.head{display:flex;flex-direction:column;gap:var(--s2);margin-bottom:var(--s5)}
.head h2{font-size:clamp(2.2rem,5.2vw,4.4rem);max-width:18ch}

/* Screens */
.screens{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s4)}
.screen{display:flex;flex-direction:column;gap:var(--s2);border-top:2px solid var(--amber);padding-top:var(--s3);min-width:0}
.screen h3{font-size:clamp(2.2rem,4vw,3.2rem)}
.screen .full{font-weight:600}
.screen p{color:var(--muted)}
.screen ul{list-style:none;margin:var(--s1) 0 0;padding:0;display:flex;flex-direction:column;gap:.35rem;font-size:.95rem}
.screen li::before{content:"";display:inline-block;width:.45rem;height:.45rem;border-radius:50%;background:var(--orange);margin-right:.6rem;vertical-align:.12em}
.screen .where{font-size:.85rem;color:var(--muted);margin-top:var(--s2)}

/* Why TV */
.why{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s4)}
.why div{display:flex;flex-direction:column;gap:var(--s1);min-width:0}
.why h3{font-family:var(--body);font-weight:600;font-stretch:100%;font-size:1.25rem;line-height:1.3;letter-spacing:0}
.why p{color:var(--muted)}
.market{margin-top:var(--s4);padding:var(--s3);border:1px solid var(--line);border-radius:16px;display:flex;flex-wrap:wrap;gap:var(--s2) var(--s5);align-items:baseline}
.market b{font-family:var(--display);font-stretch:112%;font-size:clamp(1.6rem,3vw,2.2rem);color:var(--text)}
.market p{color:var(--muted);font-size:.95rem;max-width:22rem}
.market small{flex-basis:100%;color:var(--muted);font-size:.8rem}

/* Formats */
.formats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s4) var(--s3)}
.format{display:flex;flex-direction:column;gap:.75rem;min-width:0}
.thumb{position:relative;aspect-ratio:16/9;max-width:100%;border-radius:10px;overflow:hidden;background:var(--raised);border:1px solid var(--line);padding:0;cursor:pointer;width:100%}
.thumb img,.thumb video{display:block;width:100%;height:100%;object-fit:cover}
.thumb .play{position:absolute;left:.75rem;bottom:.75rem;background:rgba(11,10,30,.8);color:var(--text);font-size:.8rem;padding:.25rem .6rem;border-radius:999px}
.format h3{font-family:var(--body);font-weight:600;font-stretch:100%;font-size:1.15rem;letter-spacing:0;line-height:1.3}
.format p{color:var(--muted);font-size:.95rem}
.diagram{aspect-ratio:16/9;max-width:100%;border-radius:10px;border:1px solid var(--line);background:var(--raised);display:flex;flex-direction:column;justify-content:center;gap:.6rem;padding:1rem}
.timeline{display:flex;height:2.2rem;gap:3px;font-size:.72rem;font-weight:600}
.timeline span{display:flex;align-items:center;justify-content:center;border-radius:4px;background:var(--line);color:var(--muted);min-width:0;overflow:hidden;white-space:nowrap}
.timeline .ad{background:var(--amber);color:var(--on-amber)}
.diagram small{color:var(--muted);font-size:.8rem}
.qr{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:.75rem;height:100%}
.qr .show{height:100%;border-radius:6px;background:linear-gradient(135deg,#2B2770,#151338)}
.qr .code{width:3.6rem;height:3.6rem;border-radius:4px;background:
  conic-gradient(from 90deg at 30% 30%,var(--text) 25%,transparent 0) 0 0/1.2rem 1.2rem,var(--raised);border:4px solid var(--text)}

/* Platforms */
.platforms{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.6rem}
.platforms li{border:1px solid var(--line);border-radius:999px;padding:.55rem 1.1rem;font-family:var(--display);font-weight:600;font-stretch:105%;font-size:clamp(1rem,1.6vw,1.2rem)}
.platforms li.more{border-style:dashed;color:var(--muted);font-family:var(--body);font-weight:500;font-size:.95rem}

/* Results */
.results{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:var(--s5);align-items:start}
.tablebox{overflow-x:auto;min-width:0}
table{border-collapse:collapse;width:100%;min-width:34rem;font-variant-numeric:tabular-nums}
th,td{text-align:left;padding:.85rem .75rem;border-bottom:1px solid var(--line)}
th{font-weight:500;color:var(--muted);font-size:.9rem}
td.n,th.n{text-align:right}
td:first-child{font-weight:600}
td.c{color:var(--amber);font-weight:600;text-align:right}
caption{text-align:left;color:var(--muted);font-size:.85rem;caption-side:bottom;padding-top:.75rem}
.plan{display:flex;flex-direction:column;gap:var(--s3);min-width:0}
.plan h3{font-family:var(--body);font-weight:600;font-stretch:100%;font-size:1.15rem;letter-spacing:0}
.bar{display:flex;height:2.6rem;border-radius:8px;overflow:hidden;font-size:.85rem;font-weight:600;margin-top:.6rem}
.bar span{display:flex;align-items:center;padding-inline:.6rem;white-space:nowrap;overflow:hidden;min-width:0}
.bar .a{background:var(--amber);color:var(--on-amber)}
.bar .b{background:var(--orange);color:var(--on-amber)}
.bar .c{background:var(--line);color:var(--text)}

/* Digital & models */
.digital{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:var(--s5);align-items:start}
.svc{display:flex;flex-direction:column}
.svc div{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr);gap:var(--s2);padding-block:var(--s3);border-top:1px solid var(--line)}
.svc h3{font-family:var(--display);font-stretch:108%;font-size:1.35rem;line-height:1.15}
.svc p{color:var(--muted);font-size:.95rem}
.calc{background:var(--raised);border:1px solid var(--line);border-radius:16px;padding:var(--s3);display:flex;flex-direction:column;gap:var(--s3);min-width:0}
.calc h3{font-size:1.6rem;font-stretch:110%}
.seg{display:flex;gap:.4rem;flex-wrap:wrap}
.seg button{flex:1;background:none;border:1px solid var(--line);color:var(--muted);border-radius:999px;padding:.5rem .9rem;font:600 .95rem var(--body);cursor:pointer}
.seg button[aria-pressed="true"]{background:var(--amber);border-color:var(--amber);color:var(--on-amber)}
.model-desc{color:var(--muted);font-size:.95rem}
.field{display:flex;flex-direction:column;gap:.4rem;min-width:0}
.field label,.field legend{font-size:.9rem;color:var(--muted);padding:0}
input,select,textarea{font:inherit;color:var(--text);background:var(--ground);border:1px solid var(--line);border-radius:8px;padding:.7rem .85rem;width:100%;min-width:0}
input:focus,select:focus,textarea:focus{border-color:var(--amber);outline:none}
.result{border-top:1px solid var(--line);padding-top:var(--s3);display:flex;flex-direction:column;gap:.25rem}
.result output{font-family:var(--display);font-weight:800;font-stretch:112%;font-size:clamp(2rem,4.6vw,3rem);line-height:1;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.note{font-size:.85rem;color:var(--muted)}

/* Overview */
.overview{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s3)}
.ov{display:flex;flex-direction:column;gap:.75rem;text-decoration:none;border-top:2px solid var(--amber);padding-top:var(--s3);min-width:0}
.ov h3{font-size:clamp(1.5rem,2.4vw,2rem);line-height:1.05}
.ov p{color:var(--muted);font-size:.95rem}
.ov span{margin-top:auto;font-weight:600;text-decoration:underline;text-decoration-color:var(--amber);text-underline-offset:.3em}
.ov:hover h3{color:var(--amber)}
/* Models */
.mlist{display:flex;flex-direction:column;min-width:0}
.model{display:grid;grid-template-columns:7rem minmax(0,1fr);gap:var(--s3);padding-block:var(--s3);border-top:1px solid var(--line)}
.model h3{font-size:clamp(2rem,3.4vw,2.8rem);color:var(--amber)}
.model div{display:flex;flex-direction:column;gap:.6rem;min-width:0}
.mfull{font-weight:600}
.model dl{display:grid;grid-template-columns:6rem minmax(0,1fr);gap:.35rem var(--s2);margin:.4rem 0 0;font-size:.95rem}
.model dt{color:var(--muted)}
.model dd{margin:0}
/* Pre-roll */
.pre{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:var(--s5);align-items:center}
.pre-text{display:flex;flex-direction:column;gap:var(--s3);min-width:0}
.pre-text h2{font-size:clamp(2.2rem,5.2vw,4.4rem)}
.tvdefs{margin:0;display:flex;flex-direction:column}
.tvdefs div{display:grid;grid-template-columns:8rem minmax(0,1fr);gap:var(--s2);padding-block:var(--s2);border-top:1px solid var(--line)}
.tvdefs dt{font-weight:600;color:var(--amber)}
.tvdefs dd{margin:0;color:var(--muted)}
.mock{margin:0;display:flex;flex-direction:column;gap:var(--s2);min-width:0}
.mock-screen{aspect-ratio:16/9;max-width:100%;border-radius:14px;border:1px solid var(--line);display:flex;flex-direction:column;justify-content:space-between;padding:clamp(1rem,3vw,1.75rem);
  background:radial-gradient(26rem 16rem at 80% 10%,rgba(75,59,255,.7),transparent 70%),radial-gradient(20rem 14rem at 10% 100%,rgba(255,107,26,.35),transparent 70%),var(--raised)}
.mock-ad{font-family:var(--display);font-weight:800;font-stretch:115%;font-size:clamp(1.5rem,3.4vw,2.6rem);line-height:1;max-width:10ch}
.mock-bottom{display:flex;flex-direction:column;gap:.6rem}
.mock-track{height:3px;background:rgba(242,241,251,.25);border-radius:2px}
.mock-track span{display:block;height:100%;width:33%;background:var(--amber);border-radius:2px}
.mock-row{display:flex;justify-content:space-between;align-items:center;gap:.5rem;font-size:.85rem;font-variant-numeric:tabular-nums}
.adtag{display:flex;gap:.6rem;align-items:center;color:var(--muted)}
.adtag b{background:var(--amber);color:var(--on-amber);font-weight:600;padding:.05rem .45rem;border-radius:4px;font-size:.75rem}
.mock-skip{background:rgba(11,10,30,.75);border:1px solid rgba(242,241,251,.4);border-radius:6px;padding:.45rem .9rem}
/* Process */
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--s3);counter-reset:s}
.steps li{counter-increment:s;display:flex;flex-direction:column;gap:.6rem;border-top:1px solid var(--line);padding-top:var(--s2);min-width:0}
.steps li::before{content:counter(s);font-family:var(--display);font-weight:800;font-size:2.2rem;line-height:1;color:var(--amber)}
.steps h3{font-family:var(--body);font-weight:600;font-stretch:100%;font-size:1.1rem;letter-spacing:0;line-height:1.3}
.steps p{color:var(--muted);font-size:.95rem}

/* Contact */
.contact{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--s5);align-items:start}
.contact h2{font-size:clamp(2.4rem,5.6vw,4.6rem)}
.card{margin-top:var(--s4);background:var(--raised);border:1px solid var(--line);border-radius:16px;padding:var(--s3);display:flex;flex-direction:column;gap:var(--s2)}
.card .who b{display:block;font-size:1.2rem}
.card .who span{color:var(--orange);font-size:.95rem}
.line{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.5rem;border-top:1px solid var(--line);padding-top:.75rem}
.line a{text-decoration:none;font-weight:500;overflow-wrap:anywhere}
.copy{background:none;border:1px solid var(--line);color:var(--muted);border-radius:999px;padding:.3rem .8rem;font:500 .85rem var(--body);cursor:pointer}
.copy:hover{color:var(--text);border-color:var(--muted)}
.addr{color:var(--muted);font-size:.9rem}
form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s3)}
.span{grid-column:1/-1}
fieldset{border:0;margin:0;padding:0}
.checks{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.4rem}
.checks label{display:flex;align-items:center;gap:.5rem;border:1px solid var(--line);border-radius:999px;padding:.4rem .9rem;color:var(--text);font-size:.95rem;cursor:pointer}
.checks input{width:auto;accent-color:var(--amber)}
.err{color:var(--amber);font-size:.9rem}
.brief{background:var(--raised);border:1px solid var(--line);border-radius:16px;padding:var(--s3);display:flex;flex-direction:column;gap:var(--s2)}
.brief pre{margin:0;white-space:pre-wrap;overflow-wrap:anywhere;font:inherit;font-size:.95rem}
.brief-actions{display:flex;flex-wrap:wrap;gap:var(--s2);align-items:center}

footer{margin-top:var(--s6);border-top:1px solid var(--line);padding-block:var(--s4);display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--s2);color:var(--muted);font-size:.9rem}

@media (max-width:900px){
  .hero,.results,.digital,.contact,.pre{grid-template-columns:minmax(0,1fr)}
  .overview{grid-template-columns:repeat(2,minmax(0,1fr))}
  .screens,.why,.formats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .proof{grid-template-columns:repeat(2,minmax(0,1fr))}
  .steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  section{padding-block:var(--s5) 0}
}
@media (max-width:560px){
  .screens,.why,.formats,.steps,form{grid-template-columns:minmax(0,1fr)}
  .svc div{grid-template-columns:minmax(0,1fr);gap:.4rem}
  .overview{grid-template-columns:minmax(0,1fr)}
  .model{grid-template-columns:minmax(0,1fr);gap:.5rem}
  .tvdefs div{grid-template-columns:minmax(0,1fr);gap:.3rem}
}

.foot-links{display:flex;flex-direction:column;gap:.5rem;align-items:flex-end;text-align:right}
.foot-links a{color:var(--text);text-decoration-color:var(--amber);text-underline-offset:.3em}
@media (max-width:560px){.foot-links{align-items:flex-start;text-align:left}}

/* Video cards (Learn with Manzi) */
.vgrid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s4) var(--s3)}
.vcard{display:flex;flex-direction:column;gap:.7rem;min-width:0}
.vcard[hidden]{display:none}
.vthumb{position:relative;display:block;width:100%;aspect-ratio:16/9;max-width:100%;border:0;padding:0;border-radius:12px;overflow:hidden;background:var(--raised);cursor:pointer}
.vthumb img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .3s ease}
.vthumb:hover img{transform:scale(1.03)}
.vthumb .play{position:absolute;left:50%;top:50%;width:3.6rem;height:3.6rem;margin:-1.8rem 0 0 -1.8rem;border-radius:50%;background:rgba(11,10,30,.78);display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 1px rgba(242,241,251,.25)}
.vthumb .play::before{content:"";margin-left:.25rem;border-style:solid;border-width:.6rem 0 .6rem 1rem;border-color:transparent transparent transparent var(--amber)}
.vthumb:hover .play{background:var(--amber)}
.vthumb:hover .play::before{border-left-color:var(--on-amber)}
.vframe{width:100%;aspect-ratio:16/9;max-width:100%;border:0;border-radius:12px;background:#000;display:block}
.vcat{font-size:.85rem;color:var(--amber);font-weight:600}
.vcard h2{font-family:var(--body);font-weight:600;font-stretch:100%;font-size:1.1rem;line-height:1.35;letter-spacing:0}
.vcard h2 a{text-decoration:none}
.vcard h2 a:hover{text-decoration:underline;text-decoration-color:var(--amber);text-underline-offset:.25em}
@media (max-width:900px){.vgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.vgrid{grid-template-columns:minmax(0,1fr)}}
@media (prefers-reduced-motion:reduce){.vthumb img{transition:none}}
.learn-more{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:var(--s3);margin-top:var(--s4)}
.vcard h3.vt{font-family:var(--body);font-weight:600;font-stretch:100%;font-size:1.1rem;line-height:1.35;letter-spacing:0}

/* ===== v2: shared header menu, footer, new homepage sections, pages ===== */
.top nav a[aria-current="page"]{color:var(--text)}
.dd{position:relative}
.dd-btn{background:none;border:0;padding:0;color:var(--muted);font:inherit;cursor:pointer;display:inline-flex;align-items:center;gap:.4rem}
.dd-btn:hover,.dd-btn[aria-expanded="true"],.dd-btn[data-current]{color:var(--text)}
.caret{width:0;height:0;border-left:.3rem solid transparent;border-right:.3rem solid transparent;border-top:.36rem solid currentColor;transition:transform .15s}
.dd.open .caret{transform:rotate(180deg)}
.dd-menu{position:absolute;top:calc(100% + .6rem);left:-.75rem;z-index:30;min-width:15rem;background:var(--raised);border:1px solid var(--line);border-radius:12px;padding:.4rem;display:none;flex-direction:column;box-shadow:0 20px 40px -20px rgba(0,0,0,.8)}
.dd-menu::before{content:"";position:absolute;left:0;right:0;top:-.7rem;height:.7rem}
.dd-menu a{display:flex;flex-direction:column;gap:.1rem;padding:.6rem .8rem;border-radius:8px;color:var(--text)!important;text-decoration:none;font-weight:600}
.dd-menu a small{font-weight:400;color:var(--muted);font-size:.82rem}
.dd-menu a:hover,.dd-menu a:focus-visible,.dd-menu a[aria-current="page"]{background:var(--line)}
.dd.open .dd-menu,.dd:focus-within .dd-menu{display:flex}
@media (hover:hover){.dd:hover .dd-menu{display:flex}}
@media (prefers-reduced-motion:reduce){.caret{transition:none}}

.site-foot{display:grid;grid-template-columns:minmax(0,4fr) repeat(3,minmax(0,3fr));gap:var(--s4) var(--s3);align-items:start}
.site-foot h2{font-family:var(--body);font-stretch:100%;font-weight:600;font-size:.95rem;letter-spacing:0;color:var(--text);margin-bottom:.6rem}
.site-foot address{font-style:normal;line-height:1.6}
.site-foot p{margin-top:.5rem;line-height:1.5}
.site-foot a{color:var(--text);text-decoration:none}
.site-foot a:hover{text-decoration:underline;text-decoration-color:var(--amber);text-underline-offset:.25em}
.f-logo{width:11rem;height:auto;display:block;margin-bottom:var(--s2)}
.f-bottom{grid-column:1/-1;display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--s2);border-top:1px solid var(--line);padding-top:var(--s3)}
.f-links{display:flex;flex-wrap:wrap;gap:.4rem var(--s3)}
.social{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.5rem}
.social a{display:inline-block;border:1px solid var(--line);border-radius:999px;padding:.35rem .85rem;font-size:.9rem}
.social a:hover{border-color:var(--amber);text-decoration:none}
@media (max-width:900px){.site-foot{grid-template-columns:repeat(2,minmax(0,1fr))}.f-brand{grid-column:1/-1}}
@media (max-width:560px){.site-foot{grid-template-columns:minmax(0,1fr)}}

/* Channels, formats, targeting */
.channels{margin-top:var(--s5);display:flex;flex-direction:column;gap:var(--s4)}
.channels h3{font-size:clamp(1.6rem,3vw,2.2rem);font-stretch:110%}
.ch-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s3)}
.ch-grid li{border-top:1px solid var(--line);padding-top:var(--s2);display:flex;flex-direction:column;gap:.4rem;min-width:0}
.ch-grid b{font-size:1.1rem}
.ch-grid span{color:var(--muted);font-size:.95rem}
.chipset{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--s4)}
.chipset h4{margin:0 0 .75rem;font-size:1rem;font-weight:600}
.chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.5rem}
.chips li{border:1px solid var(--line);border-radius:999px;padding:.35rem .9rem;font-size:.92rem;color:var(--text)}
@media (max-width:900px){.ch-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.chipset{grid-template-columns:minmax(0,1fr)}}
@media (max-width:560px){.ch-grid{grid-template-columns:minmax(0,1fr)}}

/* Brands */
.brands{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.2rem 1.6rem;font-family:var(--display);font-weight:700;font-stretch:108%;font-size:clamp(1.25rem,2.6vw,2rem);line-height:1.4;color:var(--text)}
.brands li{display:inline-flex;align-items:center;gap:1.6rem}
.brands li:not(:last-child)::after{content:"";width:.4rem;height:.4rem;border-radius:50%;background:var(--amber);opacity:.7}
.brands-note{margin-top:var(--s3);color:var(--muted);font-size:.9rem}

/* Testimonials */
.quotes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s3)}
.quote{margin:0;background:var(--raised);border:1px solid var(--line);border-radius:16px;padding:var(--s3);display:flex;flex-direction:column;justify-content:space-between;gap:var(--s3);min-width:0}
.quote blockquote{margin:0}
.quote blockquote p{font-family:var(--display);font-weight:600;font-stretch:104%;font-size:1.3rem;line-height:1.3}
.quote blockquote p::before{content:"“";color:var(--amber)}
.quote blockquote p::after{content:"”";color:var(--amber)}
.quote figcaption{display:flex;flex-direction:column;gap:.15rem;font-size:.92rem}
.quote figcaption span{color:var(--muted)}
@media (max-width:900px){.quotes{grid-template-columns:minmax(0,1fr)}}

/* About */
.about{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:var(--s5);align-items:start}
.about-main{display:flex;flex-direction:column;gap:var(--s3);min-width:0}
.about-main h2{font-size:clamp(2.2rem,5.2vw,4.4rem)}
.name-story{font-family:var(--display);font-weight:700;font-stretch:110%;font-size:clamp(1.4rem,2.6vw,2rem);line-height:1.2;max-width:24ch}
.name-story span{color:var(--amber)}
.mv{margin:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--s3)}
.mv div{border-top:2px solid var(--amber);padding-top:var(--s2)}
.mv dt{font-weight:600;margin-bottom:.4rem}
.mv dd{margin:0;color:var(--muted)}
.about-side{display:flex;flex-direction:column;gap:var(--s3);min-width:0}
.about-side h3{font-family:var(--body);font-stretch:100%;font-weight:600;font-size:1.1rem;letter-spacing:0}
.team{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.team li{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.25rem 1rem;padding-block:.85rem;border-top:1px solid var(--line)}
.team b{font-family:var(--display);font-stretch:108%;font-size:1.25rem}
.team span{color:var(--muted)}
.numbers{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s3)}
.numbers div{display:flex;flex-direction:column;gap:.15rem}
.numbers b{font-family:var(--display);font-weight:800;font-stretch:112%;font-size:clamp(1.8rem,3.4vw,2.6rem);line-height:1;color:var(--amber);font-variant-numeric:tabular-nums}
.numbers span{color:var(--muted);font-size:.92rem}
@media (max-width:900px){.about{grid-template-columns:minmax(0,1fr)}}
@media (max-width:560px){.mv{grid-template-columns:minmax(0,1fr)}}

/* FAQ */
.faq{display:flex;flex-direction:column;max-width:52rem}
.faq details{border-top:1px solid var(--line)}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:var(--s2);padding-block:1.1rem;font-weight:600;font-size:1.08rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--display);font-size:1.6rem;line-height:1;color:var(--amber);flex:none}
.faq details[open] summary::after{content:"–"}
.faq details p{color:var(--muted);padding-bottom:1.2rem;max-width:44rem}

/* Contact form result */
.sent{background:var(--raised);border:1px solid var(--line);border-radius:16px;padding:var(--s4);display:flex;flex-direction:column;gap:var(--s2)}
.sent h3{font-size:1.8rem;font-stretch:110%}
.sent p{color:var(--muted)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.consent{font-size:.85rem;color:var(--muted)}
.consent a{color:var(--text);text-underline-offset:.2em}

/* Pages: page hero, insights, articles, policy */
.p-hero{padding-block:var(--s4) var(--s4);display:flex;flex-direction:column;gap:var(--s2)}
.p-hero h1{font-size:clamp(2.6rem,6.5vw,5rem)}
.cards{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s4) var(--s3)}
.card-a{display:flex;flex-direction:column;gap:.8rem;text-decoration:none;min-width:0}
.card-a img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:12px;display:block;max-width:100%}
.card-a .meta{font-size:.85rem;color:var(--amber);font-weight:600}
.card-a h2{font-family:var(--body);font-stretch:100%;font-weight:600;font-size:1.2rem;line-height:1.35;letter-spacing:0}
.card-a p{color:var(--muted);font-size:.95rem}
.card-a:hover h2{text-decoration:underline;text-decoration-color:var(--amber);text-underline-offset:.25em}
@media (max-width:900px){.cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.cards{grid-template-columns:minmax(0,1fr)}}
.article{max-width:46rem;margin-inline:auto;padding-block:var(--s4) 0}
.article .meta{color:var(--amber);font-weight:600;font-size:.9rem;display:flex;flex-wrap:wrap;gap:.3rem 1rem}
.article h1{font-size:clamp(2.1rem,5vw,3.6rem);margin-block:var(--s2) var(--s4)}
.article .cover{width:100%;height:auto;border-radius:14px;display:block;margin-bottom:var(--s4);max-width:100%}
.prose{font-size:1.08rem;line-height:1.75}
.prose h2{font-size:clamp(1.5rem,3vw,2rem);font-stretch:108%;margin-block:var(--s4) var(--s2);line-height:1.1}
.prose h3{font-family:var(--body);font-stretch:100%;font-weight:600;font-size:1.15rem;letter-spacing:0;margin-block:var(--s3) .4rem}
.prose p{margin-block:0 1.1rem;color:#D9D6EC}
.prose ul,.prose ol{margin:0 0 1.2rem;padding-left:1.3rem;color:#D9D6EC;display:flex;flex-direction:column;gap:.5rem}
.prose strong{color:var(--text)}
.prose figure{margin:var(--s3) 0}
.prose figure img{width:100%;height:auto;border-radius:12px;display:block}
.prose a{color:var(--text);text-decoration-color:var(--amber);text-underline-offset:.25em}
.a-end{max-width:46rem;margin:var(--s5) auto 0;display:flex;flex-direction:column;gap:var(--s3)}
.a-end .cta{margin-top:0}
.more-a{display:flex;flex-direction:column;gap:.5rem}
.more-a a{color:var(--text);text-decoration-color:var(--amber);text-underline-offset:.25em}
.policy{max-width:46rem;padding-block:var(--s4) 0}

/* ===== v3: sticky header, full logo, phone menu ===== */
html{scroll-padding-top:6.5rem}
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:40;padding-block:1rem;transition:padding .2s ease}
.top::before{content:"";position:absolute;top:0;bottom:0;left:calc(50% - 50vw);right:calc(50% - 50vw);z-index:-1;background:rgba(11,10,30,.86);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid transparent;transition:border-color .2s}
.top.scrolled{padding-block:.55rem}
.top.scrolled::before{border-bottom-color:var(--line)}
.mark{display:block;line-height:0}
.mark-logo{width:11rem;height:auto;display:block;transition:width .2s ease}
.top.scrolled .mark-logo{width:9rem}
.menu-btn{display:none;align-items:center;gap:.55rem;background:none;border:1px solid var(--line);color:var(--text);border-radius:999px;padding:.5rem 1rem;font:600 .95rem var(--body);cursor:pointer}
.menu-icon,.menu-icon::before,.menu-icon::after{display:block;width:1rem;height:2px;background:currentColor;border-radius:2px;position:relative}
.menu-icon::before,.menu-icon::after{content:"";position:absolute;left:0}
.menu-icon::before{top:-5px}.menu-icon::after{top:5px}
@media (max-width:900px){
  .top{flex-wrap:nowrap}
  .mark-logo{width:8.5rem}.top.scrolled .mark-logo{width:7.5rem}
  .menu-btn{display:inline-flex;margin-left:auto}
  .top nav{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;align-items:stretch;gap:0;background:var(--raised);border:1px solid var(--line);border-radius:14px;padding:.5rem;margin-top:.25rem;max-height:calc(100vh - 6rem);overflow:auto;box-shadow:0 30px 60px -30px rgba(0,0,0,.9)}
  .top.menu-open nav{display:flex}
  .top nav > a,.top nav .dd-btn{padding:.8rem .75rem;border-radius:8px;font-size:1rem;color:var(--text)}
  .top nav > a:hover{background:var(--line)}
  .top nav .dd-btn{width:100%;justify-content:space-between}
  .top nav .dd-menu{position:static;display:flex;box-shadow:none;border:0;background:transparent;padding:0 0 .25rem .75rem;min-width:0}
  .top nav .dd-menu::before{display:none}
  .top nav .dd .caret{display:none}
  .top nav a.btn{margin-top:.5rem;text-align:center;padding:.8rem 1rem}
}
@media (prefers-reduced-motion:reduce){.top,.mark-logo,.top::before{transition:none}}

/* ===== v3: hero with rotating headlines ===== */
.hero{grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:var(--s4);padding-block:var(--s3) var(--s4);align-items:center}
.hero-copy{display:flex;flex-direction:column;gap:var(--s3);min-width:0}
.rot{display:grid}
.slide{grid-area:1/1;display:flex;flex-direction:column;align-items:flex-start;gap:var(--s2);opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .5s ease,transform .5s ease,visibility 0s linear .5s}
.slide.is-on{opacity:1;visibility:visible;transform:none;transition:opacity .5s ease,transform .5s ease,visibility 0s}
.rh{font-family:var(--display);font-weight:800;font-stretch:118%;font-size:clamp(2.3rem,4.3vw,4.2rem);line-height:1;letter-spacing:-.015em;margin:0;text-wrap:balance;max-width:14ch}
.hero .slide .lede{color:var(--text);font-size:clamp(1rem,1.3vw,1.15rem);max-width:34rem;margin:0}
.rot-tabs{display:flex;flex-wrap:wrap;gap:.4rem}
.rot-tabs button{position:relative;overflow:hidden;background:none;border:1px solid var(--line);color:var(--muted);border-radius:999px;padding:.4rem .9rem;font:600 .85rem var(--body);cursor:pointer}
.rot-tabs button[aria-pressed="true"]{color:var(--text);border-color:var(--amber)}
.rot-tabs button::after{content:"";position:absolute;left:0;bottom:0;height:2px;width:0;background:var(--amber)}
.rot-tabs button.run::after{animation:rotfill 5s linear forwards}
@keyframes rotfill{to{width:100%}}
.hero .hero-actions{margin-top:0}
.hero-sub{color:var(--muted);font-size:.9rem;max-width:34rem}
@media (max-width:900px){.hero{grid-template-columns:minmax(0,1fr)}.rh{max-width:16ch}}
@media (prefers-reduced-motion:reduce){.slide,.slide.is-on{transition:none;transform:none}.rot-tabs button.run::after{animation:none}}

/* ===== v3: CTV 2026 panel ===== */
.why-h{margin-top:var(--s5);margin-bottom:var(--s3);font-size:clamp(1.6rem,3vw,2.2rem);font-stretch:110%}
.ctv26{margin-top:var(--s4);background:var(--raised);border:1px solid var(--line);border-radius:18px;padding:clamp(1.25rem,3vw,2.5rem);display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:var(--s4) var(--s5);align-items:start}
.ctv26-head{grid-column:1/-1;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:.5rem var(--s3)}
.ctv26-head h3{font-size:clamp(1.5rem,2.8vw,2.2rem);font-stretch:110%}
.ctv26-head p{color:var(--muted)}
.ctv26-figs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s3)}
.ctv26-figs div{display:flex;flex-direction:column;gap:.4rem;border-top:2px solid var(--amber);padding-top:var(--s2);min-width:0}
.ctv26-figs b{font-family:var(--display);font-weight:800;font-stretch:112%;font-size:clamp(2rem,3.6vw,3rem);line-height:1;color:var(--text);font-variant-numeric:tabular-nums;white-space:nowrap}
.ctv26-figs span{color:var(--muted);font-size:.92rem}
.ctv26-chart{margin:0;display:flex;flex-direction:column;gap:.8rem;min-width:0}
.ctv26-chart figcaption{font-weight:600}
.cbar{display:grid;grid-template-columns:3rem minmax(0,1fr) 6.5rem;gap:.75rem;align-items:center;font-variant-numeric:tabular-nums}
.cyear{color:var(--muted);font-size:.9rem}
.ctrack{height:1.6rem;border-radius:6px;background:rgba(242,241,251,.06);overflow:hidden;display:block}
.cfill{display:block;height:100%;border-radius:6px;background:var(--muted)}
.cbar.fc .cfill{background:repeating-linear-gradient(135deg,var(--amber) 0 10px,#E8AD12 10px 20px)}
.cval{font-weight:700;text-align:right;white-space:nowrap}
.cbar.fc .cval{color:var(--amber)}
.cnote{color:var(--muted);font-size:.85rem}
.ctv26-src{grid-column:1/-1;color:var(--muted);font-size:.78rem;border-top:1px solid var(--line);padding-top:var(--s2)}
@media (max-width:900px){.ctv26{grid-template-columns:minmax(0,1fr)}}
@media (max-width:560px){.ctv26-figs{grid-template-columns:minmax(0,1fr)}.cbar{grid-template-columns:2.6rem minmax(0,1fr) 5.6rem}}

/* ===== v3: merged sections ===== */
.plat-block{margin-top:var(--s5);display:flex;flex-direction:column;gap:var(--s2)}
.plat-block h3,.quotes-h{font-size:clamp(1.6rem,3vw,2.2rem);font-stretch:110%}
.quotes-h{margin-top:var(--s5);margin-bottom:var(--s3)}
.mk-btn{align-self:flex-start;text-decoration:none;display:inline-block}
.mk-link{color:var(--amber);font-weight:600;text-decoration:none}
.mk-link:hover{text-decoration:underline}
.t-ghost{background:none;border:1px solid var(--line);color:var(--text);border-radius:999px;padding:.8rem 1.3rem;font:600 1rem var(--body);cursor:pointer}
.t-ghost:hover{border-color:var(--muted)}
.hero .rh{font-size:clamp(2.3rem,4.3vw,4.2rem)}

/* ===== v4 ===== */
/* Header: one fixed size (no shrinking, so no flicker); only the background changes */
.top,.top.scrolled{padding-block:.9rem}
.mark-logo,.top.scrolled .mark-logo{width:10rem}
@media (max-width:900px){.mark-logo,.top.scrolled .mark-logo{width:8rem}}
.top::before{background:rgba(11,10,30,.72)}
.top.scrolled::before{background:rgba(11,10,30,.92)}

/* Headline change: fade the old one out, then the new one in */
.slide{transition:opacity .35s ease,transform .35s ease,visibility 0s linear .35s}
.slide.is-on{transition:opacity .45s ease .35s,transform .45s ease .35s,visibility 0s linear .35s}

/* CTV 2026 panel: figures across the full width, chart underneath */
.ctv26{grid-template-columns:minmax(0,1fr);gap:var(--s4)}
.ctv26-figs{gap:var(--s4)}
.ctv26-figs b{font-size:clamp(1.9rem,3vw,2.6rem)}
.ctv26-chart{max-width:44rem}
.cbar{grid-template-columns:3rem minmax(0,1fr) 7rem}
@media (max-width:700px){.ctv26-figs{grid-template-columns:minmax(0,1fr);gap:var(--s3)}}

/* About statement */
.about-statement{font-family:var(--display);font-weight:600;font-stretch:104%;font-size:clamp(1.25rem,2.2vw,1.6rem);line-height:1.35;color:var(--text);max-width:36ch;border-left:3px solid var(--amber);padding-left:var(--s3)}

/* Testimonials carousel */
.tcar{display:flex;flex-direction:column;gap:var(--s3);max-width:56rem}
.tcar-stage{display:grid}
.tq{grid-area:1/1;margin:0;display:flex;flex-direction:column;gap:var(--s3);opacity:0;visibility:hidden;transition:opacity .35s ease,visibility 0s linear .35s}
.tq.is-on{opacity:1;visibility:visible;transition:opacity .45s ease .3s,visibility 0s linear .3s}
.tq blockquote{margin:0}
.tq blockquote p{font-family:var(--display);font-weight:700;font-stretch:108%;font-size:clamp(1.5rem,3.2vw,2.5rem);line-height:1.2;text-wrap:balance}
.tq blockquote p::before{content:"“";color:var(--amber)}
.tq blockquote p::after{content:"”";color:var(--amber)}
.tq figcaption{display:flex;flex-direction:column;gap:.2rem}
.tq figcaption b{font-size:1.05rem}
.tq figcaption span{color:var(--muted)}
.tcar-nav{display:flex;gap:.25rem}
.tcar-nav button{width:2.75rem;height:1.75rem;padding:0;border:0;background:none;cursor:pointer;display:flex;align-items:center}
.tcar-nav button::before{content:"";display:block;width:100%;height:3px;border-radius:2px;background:var(--line)}
.tcar-nav button[aria-pressed="true"]::before{background:var(--amber)}
@media (prefers-reduced-motion:reduce){.tq,.tq.is-on,.slide,.slide.is-on{transition:none}}

/* Back to top */
.to-top{position:fixed;right:max(1rem,env(safe-area-inset-right,0px));bottom:calc(1rem + env(safe-area-inset-bottom,0px));z-index:50;width:3rem;height:3rem;border-radius:50%;border:1px solid var(--line);background:var(--raised);color:var(--text);display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 10px 30px -10px rgba(0,0,0,.8);opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .2s,transform .2s,visibility 0s linear .2s,background .15s}
.to-top.show{opacity:1;visibility:visible;transform:none;transition:opacity .2s,transform .2s,visibility 0s,background .15s}
.to-top:hover{background:var(--amber);color:var(--on-amber);border-color:var(--amber)}
.to-top svg{width:1.2rem;height:1.2rem}
@media (prefers-reduced-motion:reduce){.to-top,.to-top.show{transition:none}}