:root{
  --black:#0D0D0D;
  --red:#C71F2D;
  --white:#FFFFFF;
  --offwhite:#F6F6F4;
  --grey1:#D9D9D6;
  --grey2:#8D8D8D;
  --grey3:#4B4B4B;
  --panel:#141414;
  --maxw:1160px;
  --ease:cubic-bezier(.16,1,.3,1);
  --hh:74px;
}

*{box-sizing:border-box;margin:0;padding:0}
html{
  scroll-behavior:smooth;
  scroll-padding-top:var(--hh);
}
body{
  background:var(--black);
  color:var(--offwhite);
  font-family:'Inter',system-ui,-apple-system,sans-serif;
  font-size:17px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}

h1,h2,h3,h4,.section-title{
  font-family:'Archivo','Inter',sans-serif;
  font-weight:800;
  line-height:1.04;
  letter-spacing:-.02em;
  overflow-wrap:break-word;
}

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px}

.skip{position:absolute;left:-9999px;top:0;background:var(--red);color:#fff;padding:10px 16px;z-index:100}
.skip:focus{left:12px;top:12px}

.btn{
  display:inline-block;font-family:'Archivo',sans-serif;font-weight:700;
  font-size:.95rem;letter-spacing:.01em;padding:14px 26px;border-radius:2px;
  transition:transform .25s var(--ease),background .25s var(--ease),color .25s var(--ease),border-color .25s var(--ease);
  border:1.5px solid transparent;cursor:pointer;
}
.btn-primary{background:var(--red);color:#fff}
.btn-primary:hover{transform:translateY(-2px);background:#e02534}
.btn-ghost{border-color:var(--grey3);color:var(--offwhite)}
.btn-ghost:hover{border-color:var(--white);transform:translateY(-2px)}
.btn-small{padding:9px 18px;font-size:.85rem}

/* Header */
.site-header{
  position:fixed;top:0;left:0;right:0;z-index:50;
  background:rgba(13,13,13,.8);
  backdrop-filter:saturate(160%) blur(12px);
  border-bottom:1px solid rgba(255,255,255,.07);
}
.nav{display:flex;align-items:center;justify-content:space-between;height:var(--hh)}
.brand-logo{height:23px;width:auto}
.nav-links{display:flex;align-items:center;gap:32px}
.nav-links a{font-size:.92rem;color:var(--grey1);font-weight:500;transition:color .2s}
.nav-links a:hover{color:var(--white)}
.nav-cta{
  color:#fff!important;background:var(--red);border:1.5px solid var(--red);
  padding:9px 20px;border-radius:2px;font-family:'Archivo';font-weight:700;white-space:nowrap;
  box-shadow:0 6px 20px -8px rgba(199,31,45,.8);
  transition:background .2s,border-color .2s,transform .2s,box-shadow .2s;
}
.nav-cta:hover,.nav-cta:focus-visible{
  background:#e02534;border-color:#e02534;transform:translateY(-1px);
  box-shadow:0 8px 24px -6px rgba(199,31,45,.9);outline:none;
}

/* Hero */
.hero{padding:118px 0 0;position:relative}
.hero::after{
  content:"";position:absolute;inset:0;
  background:radial-gradient(circle at 82% 14%,rgba(199,31,45,.22),transparent 55%);
  pointer-events:none;
}
.eyebrow{
  font-family:'Archivo';font-weight:800;font-size:1rem;letter-spacing:.22em;
  text-transform:uppercase;color:var(--red);margin-bottom:22px;
}
.hero h1{font-size:clamp(2.4rem,8vw,5.4rem);max-width:15ch;font-weight:900}
.hero h1 .accent{color:var(--red)}
.lede{font-size:clamp(1.05rem,2vw,1.35rem);color:var(--grey1);max-width:46ch;margin:26px 0 0;line-height:1.5}
.lede strong{color:var(--offwhite);font-weight:600}
.hero-cta{display:flex;gap:14px;margin-top:34px;flex-wrap:wrap}
.waveform{
  display:flex;align-items:flex-end;gap:4px;height:120px;margin:64px 0 0;
  opacity:.85;width:100%;overflow:hidden;
}
.waveform span{
  flex:1 1 0;min-width:0;background:var(--grey3);border-radius:1px;
  animation:wave 1.4s ease-in-out infinite;
}
.waveform span:nth-child(4n){background:var(--red)}
.waveform span:nth-child(2n){animation-delay:.2s}
.waveform span:nth-child(3n){animation-delay:.45s}
.waveform span:nth-child(5n){animation-delay:.7s}
.waveform span:nth-child(7n){animation-delay:.95s}
@keyframes wave{0%,100%{height:14%}50%{height:88%}}
@media(prefers-reduced-motion:reduce){.waveform span{animation:none;height:46%}}

/* shared section headings */
.section-eyebrow{
  font-family:'Archivo';font-weight:700;font-size:.76rem;letter-spacing:.2em;
  text-transform:uppercase;color:var(--red);margin-bottom:14px;
}
.section-title{font-size:clamp(1.9rem,4.4vw,3rem);margin-bottom:36px}
.shows .section-title{margin-bottom:14px}
.shows-caption{
  font-style:italic;color:var(--grey2);font-size:.98rem;
  max-width:62ch;margin:0 0 36px;
}

/* (panel padding + border-top now lives in the deck rule below) */

/* Shows */
.flagship{
  position:relative;background:var(--panel);
  border:1px solid rgba(255,255,255,.08);border-radius:4px;
  padding:30px 28px;margin-bottom:26px;
}
.flagship::before{
  content:"";position:absolute;left:0;top:0;width:100%;height:3px;
  background:var(--red);opacity:.9;border-radius:4px 4px 0 0;
}
.flagship-head{display:flex;flex-direction:column;gap:8px;margin-bottom:20px}
.flagship-head .status{align-self:flex-start}
.flagship h3{font-size:1.7rem;margin-top:2px}
.cap-player{
  border-radius:6px;overflow:hidden;
  border:1px solid rgba(255,255,255,.08);background:#0a0a0a;
}
.cap-player iframe{display:block;width:100%;height:520px;border:0}
.flagship-links{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.shows-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:22px}
.show{
  position:relative;background:var(--panel);
  border:1px solid rgba(255,255,255,.08);border-radius:4px;
  padding:30px 28px;display:flex;flex-direction:column;gap:12px;
  transition:transform .3s var(--ease),border-color .3s var(--ease);
}
.show::before{
  content:"";position:absolute;left:0;top:0;width:100%;height:3px;
  background:var(--red);opacity:.9;border-radius:4px 4px 0 0;
}
.show:hover{transform:translateY(-4px);border-color:var(--red)}
.show h3{font-size:1.45rem;margin-top:4px}
.show-host{
  font-family:'Archivo';font-weight:600;font-size:.82rem;
  letter-spacing:.06em;text-transform:uppercase;color:var(--grey2);
}
.show-desc{color:var(--grey1);font-size:.96rem;line-height:1.55}
.show-links{display:flex;gap:10px;flex-wrap:wrap;margin-top:auto;padding-top:12px}
.status{
  display:inline-block;align-self:flex-start;font-family:'Archivo';font-weight:700;
  font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;padding:5px 11px;border-radius:2px;
}
.status-live{background:rgba(199,31,45,.16);color:#f4717b;border:1px solid rgba(199,31,45,.45)}
.status-prod{background:rgba(214,180,80,.12);color:#d6b450;border:1px solid rgba(214,180,80,.35)}
.status-concept{background:rgba(255,255,255,.05);color:var(--grey2);border:1px solid rgba(255,255,255,.12)}

/* Select (dedicated section) */
.select-lede{
  font-size:1.2rem;color:var(--offwhite);max-width:62ch;line-height:1.5;
}
.select-ticks{max-width:62ch;margin-top:22px}
.select-doctrine{
  margin-top:28px;font-family:'Archivo';font-weight:800;color:var(--white);
  font-size:1.1rem;border-left:3px solid var(--red);padding-left:16px;
  max-width:62ch;
}

/* Build your own callout (inside Shows) */
.build-callout{
  position:relative;background:var(--panel);
  border:1px solid rgba(255,255,255,.08);border-radius:4px;
  padding:32px 30px;margin-top:36px;
}
.build-callout::before{
  content:"";position:absolute;left:0;top:0;width:100%;height:3px;
  background:var(--red);opacity:.9;border-radius:4px 4px 0 0;
}
.build-eyebrow{
  font-family:'Archivo';font-weight:800;font-size:.72rem;letter-spacing:.22em;
  text-transform:uppercase;color:var(--red);
}
.build-callout h3{font-size:1.45rem;margin:6px 0 12px}
.build-callout p{color:var(--grey1);max-width:62ch;line-height:1.55}
.build-cta{display:flex;gap:14px;flex-wrap:wrap;margin-top:18px;align-items:center}

.ticks{list-style:none;margin-top:22px}
.ticks li{position:relative;padding:11px 0 11px 30px;border-bottom:1px solid rgba(255,255,255,.08);font-size:.98rem}
.ticks li:last-child{border-bottom:0}
.ticks li::before{
  content:"";position:absolute;left:0;top:16px;width:14px;height:8px;
  border-left:2.5px solid var(--red);border-bottom:2.5px solid var(--red);transform:rotate(-45deg);
}

/* How we work */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.step{
  background:var(--panel);border:1px solid rgba(255,255,255,.07);
  padding:32px 24px;border-radius:4px;
  transition:transform .3s var(--ease),border-color .3s var(--ease);
}
.step:hover{transform:translateY(-5px);border-color:var(--red)}
.step-no{font-family:'Archivo';font-weight:900;font-size:.95rem;color:var(--red);letter-spacing:.1em}
.step h3{font-size:1.4rem;margin:12px 0 10px}
.step p{color:var(--grey2);font-size:.95rem;line-height:1.5}
.stack-line{
  margin-top:34px;color:var(--grey2);font-size:.92rem;
  border-left:2px solid var(--red);padding-left:18px;max-width:78ch;
}

/* Founder (banner-strip) */
/* founder uses the standard panel padding now */
.founder-grid{display:grid;grid-template-columns:260px 1fr;gap:56px;align-items:start}
.founder-side{display:flex;flex-direction:column;gap:24px}
.founder-portrait{
  width:210px;height:210px;border-radius:50%;overflow:hidden;
  border:2px solid rgba(199,31,45,.55);
  box-shadow:0 8px 24px -10px rgba(0,0,0,.7);
}
.founder-portrait img{
  width:100%;height:100%;display:block;
  object-fit:cover;object-position:50% 32%;        /* new photo is pre-cropped tight, only a slight upward bias needed */
}
.founder-id .section-eyebrow{margin-bottom:8px}
.founder-name{
  font-family:'Archivo','Inter',sans-serif;font-weight:800;
  font-size:clamp(1.6rem,2.6vw,2.1rem);line-height:1.05;letter-spacing:-.02em;
  margin:0;
}
.founder-role{
  font-family:'Archivo';font-weight:600;font-size:.82rem;
  letter-spacing:.06em;text-transform:uppercase;color:var(--grey2);
  margin-top:8px;
}
.founder-body p{color:var(--grey1);font-size:.98rem;line-height:1.55;margin-bottom:12px;max-width:64ch}
.founder-body p:last-child{margin-bottom:0}
.founder-body strong{color:var(--offwhite);font-weight:600}
.founder-body .founder-doctrine{color:var(--white);font-weight:700}
.founder-bridge{
  margin-top:6px!important;font-family:'Archivo';font-weight:700;
  color:var(--white)!important;font-size:1rem;
}
.founder-body .founder-credits{
  margin-top:14px;color:var(--grey2);font-size:.82rem;
  border-left:2px solid var(--red);padding-left:14px;
  max-width:none;white-space:nowrap;         /* full column, no wrap, fits on one line */
}

/* Audience cards grid (used inside How section) */
.work-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.work-grid.two-col{grid-template-columns:1fr 1fr;gap:24px;margin-top:14px}
@supports (grid-template-rows: subgrid){
  .work-grid.two-col{grid-template-rows:auto auto auto 1fr auto}
  .work-grid.two-col > .work-card{
    display:grid;grid-template-rows:subgrid;grid-row:span 5;gap:12px;
  }
}
.how-audiences-eyebrow{
  margin-top:48px;font-family:'Archivo';font-weight:800;font-size:.78rem;
  letter-spacing:.22em;text-transform:uppercase;color:var(--red);
}
.work-card{
  position:relative;background:var(--panel);
  border:1px solid rgba(255,255,255,.08);border-radius:4px;
  padding:30px 26px;display:flex;flex-direction:column;gap:12px;
  transition:transform .3s var(--ease),border-color .3s var(--ease);
}
.work-card::before{
  content:"";position:absolute;left:0;top:0;width:100%;height:3px;
  background:var(--red);opacity:.9;border-radius:4px 4px 0 0;
}
.work-card:hover{transform:translateY(-4px);border-color:var(--red)}
.work-eyebrow{
  font-family:'Archivo';font-weight:800;font-size:.72rem;letter-spacing:.22em;
  text-transform:uppercase;color:var(--red);
}
.work-card h3{font-size:1.35rem;line-height:1.15;margin-top:2px}
.work-body{color:var(--grey1);font-size:.96rem;line-height:1.5}
.work-card .ticks{margin-top:8px}
.work-card .ticks li{font-size:.93rem;padding:9px 0 9px 28px}
.work-card .ticks li::before{top:14px}
.work-card .btn{margin-top:auto;align-self:flex-start}
.refer-link{
  display:inline-block;margin-top:10px;color:var(--grey2);font-size:.86rem;
  border-bottom:1px solid rgba(199,31,45,.5);padding-bottom:1px;align-self:flex-start;
  transform:translateY(4px);                /* slight drop to settle beneath the button baseline */
}
.refer-link:hover{color:var(--white);border-bottom-color:var(--red)}

/* Contact */
.contact{text-align:center}
.contact .section-title{margin-bottom:16px}
.contact-lede{color:var(--grey1);max-width:52ch;margin:0 auto 32px;font-size:1.1rem}
.contact-cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.contact-fallback{margin-top:22px;color:var(--grey2);font-size:.92rem}
.contact-fallback a{color:var(--grey1);border-bottom:1px solid var(--red)}
.contact-fallback a:hover{color:var(--white)}

/* Footer */
.site-footer{background:#080808;border-top:1px solid rgba(255,255,255,.07);padding:62px 0 46px}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.3fr;gap:36px;align-items:start}
.footer-brand{
  font-family:'Archivo',sans-serif;font-weight:800;letter-spacing:.18em;
  color:var(--offwhite);font-size:.95rem;line-height:1;margin:0 0 12px;
}
.footer-tag{color:var(--grey2);font-size:.93rem;max-width:30ch;margin:0}
.footer-nav,.footer-meta{display:flex;flex-direction:column;gap:11px}
.footer-nav a,.footer-meta a{color:var(--grey1);font-size:.93rem}
.footer-nav a:hover,.footer-meta a:hover{color:var(--white)}
.footer-legal{color:var(--grey2);font-size:.86rem;line-height:1.7}
.footer-legal strong{color:var(--grey1)}
.footer-legal .copy{margin-top:14px;color:var(--grey3)}

@media(max-width:900px){
  .nav-links{gap:18px}
  .nav-links a:not(.nav-cta){display:none}
  .shows-grid{grid-template-columns:1fr 1fr}
  .work-grid,.work-grid.two-col{grid-template-columns:1fr;gap:18px}
  .steps{grid-template-columns:1fr 1fr}
  .founder-grid{grid-template-columns:1fr;gap:22px;justify-items:start}
  .founder-portrait{width:130px;height:130px}
  .founder-body{min-width:0;width:100%}
  .founder-body p{max-width:none}
  .founder-body .founder-credits{white-space:normal;font-size:.78rem;line-height:1.5}
  .footer-grid{grid-template-columns:1fr 1fr;gap:30px}
}
@media(max-width:560px){
  body{font-size:16px}
  .wrap{padding:0 18px}
  .nav{height:62px}
  .brand-logo{height:19px}
  .nav-cta{padding:8px 13px;font-size:.82rem}
  .hero h1{font-size:clamp(2rem,9vw,2.7rem)}
  .lede{font-size:1.05rem}
  .waveform{height:78px;margin-top:44px;gap:2px}
  .shows-grid,.steps{grid-template-columns:1fr}
  .flagship{padding:24px 20px}
  .cap-player iframe{height:440px}
  .half{padding:28px}
  .footer-grid{grid-template-columns:1fr;gap:26px}
}

/* ---- Vertical section deck: content-sized panels, tight rhythm ---- */
.deck{display:block}
.deck>.panel{
  padding:64px 0;
  border-top:1px solid rgba(255,255,255,.07);
}
.deck>.panel>.wrap{width:100%}
.deck>.panel#hero{
  border-top:0;
  padding:calc(var(--hh) + 56px) 0 72px;        /* generous hero opening, clears fixed header */
}
.deck>.panel.contact{padding-bottom:0}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
}
@media(max-width:560px){
  :root{--hh:62px}
  .deck>.panel{padding:44px 0}
  .deck>.panel#hero{padding:calc(var(--hh) + 36px) 0 48px}
  .deck>.panel.contact{padding-bottom:0}
}
