/*
Theme Name: AdsAtPlay v2
Theme URI: https://adsatplay.com
Author: AdsAtPlay
Author URI: https://adsatplay.com
Description: Five-page "Signal & Ink" redesign for AdsAtPlay — a data-obsessed digital marketing agency. Home, Services, Who We Are, Results and Contact, with a light/dark theme toggle, a video hero, and pinned scrollytelling. Calendly booking and Customizer-editable contact info.
Version: 2.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: adsatplay
*/

/* =========================================================
   WordPress core accessibility helpers
   ========================================================= */
.screen-reader-text{
  border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);
  height:1px;width:1px;overflow:hidden;position:absolute!important;
  word-wrap:normal!important;margin:-1px;padding:0;
}
.screen-reader-text:focus{
  background:#fff;color:#171308;display:block;height:auto;width:auto;
  clip:auto;clip-path:none;font-size:14px;font-weight:700;
  padding:14px 22px;position:fixed;top:8px;left:8px;z-index:100000;
  text-decoration:none;border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,.25);
}

/* ============================================================
   ADSATPLAY — Design System
   Direction: "Signal & Ink" — a deep-navy, data-driven canvas
   with a single coral signal color. Editorial display serif
   meets a clean geometric body face and a mono data accent.
   ============================================================ */

:root{
  /* ---- ink (dark canvas) ---- */
  --ink-950:#05070d;
  --ink-900:#0a0f1c;
  --ink-850:#0d1424;
  --ink-800:#121a2e;
  --ink-700:#1a2440;
  --ink-600:#263252;
  --ink-line: rgba(244,241,234,.12);
  --ink-line-strong: rgba(244,241,234,.22);

  /* ---- paper (light canvas) ---- */
  --paper:#f4efe4;
  --paper-dim:#ece4d3;
  --paper-ink:#171308;
  --paper-line: rgba(23,19,8,.12);

  /* ---- neutrals ---- */
  --white:#ffffff;
  --off-white:#f5f2ea;
  --mute-on-dark: rgba(245,242,234,.62);
  --mute-on-dark-soft: rgba(245,242,234,.4);
  --mute-on-paper: rgba(23,19,8,.62);

  /* ---- brand ---- */
  --coral:#e96c6d;
  --coral-bright:#ff8d84;
  --coral-deep:#c14f52;
  --coral-ink:#3a1414;
  --blue:#5772ac;
  --blue-bright:#8ea3d6;
  --blue-deep:#334878;
  /* fixed text-on-brand color — brand hues don't shift between themes, so
     neither should the color that sits on top of them */
  --on-coral:#1a0d0d;

  /* ---- surfaces that don't cleanly map to the ink/paper scale ---- */
  --surface-scrim: rgba(10,15,28,.86);
  --surface-glass: rgba(18,26,46,.7);
  --dot-rgb: 245,242,234;

  /* ---- fonts ---- */
  --font-display:'Fraunces', ui-serif, Georgia, serif;
  --font-body:'Manrope', -apple-system, sans-serif;
  --font-mono:'JetBrains Mono', ui-monospace, monospace;

  /* ---- scale ---- */
  --container: 1240px;
  --container-narrow: 860px;
  --radius-sm: 8px;
  --radius-md: 16px;
  --radius-lg: 28px;
  --radius-pill: 999px;

  --ease: cubic-bezier(.16,.8,.24,1);
  --ease-out: cubic-bezier(.22,1,.36,1);
}

/* ============================================================
   LIGHT THEME
   The whole design system is built on the --ink-*/--paper*/
   --off-white/--mute-on-* tokens rather than hardcoded color, so a
   theme swap is a re-pointing of those same roles rather than a
   parallel stylesheet. --ink-950…--ink-600 keep their relative
   order (950 = boldest canvas tone, 600 = lightest accent) so
   anything built from *contrast between* ink steps (watermark
   numerals, card-on-section layering) still reads correctly.
   --paper/--paper-ink swap roles entirely: on paper it's the warm
   light card-within-a-dark-page; here it becomes the ink-toned
   card-within-a-light-page, so the "alternate tone" rhythm of the
   page is preserved either way.
   ============================================================ */
:root[data-theme="light"]{
  --ink-950:#fdfcf8;
  --ink-900:#f7f2e6;
  --ink-850:#efe8d8;
  --ink-800:#e6dcc6;
  --ink-700:#d8c9a8;
  --ink-600:#c3ae83;
  --ink-line: rgba(23,19,8,.12);
  --ink-line-strong: rgba(23,19,8,.22);

  --paper:#141d2c;
  --paper-dim:#0f1622;
  --paper-ink:#f5f2ea;
  --paper-line: rgba(245,242,234,.14);

  --off-white:#171308;
  --mute-on-dark: rgba(23,19,8,.64);
  --mute-on-dark-soft: rgba(23,19,8,.42);
  --mute-on-paper: rgba(245,242,234,.66);

  --surface-scrim: rgba(247,242,230,.86);
  --surface-glass: rgba(255,255,255,.6);
  --dot-rgb: 23,19,8;
}

/* honor the OS-level preference for a visitor who hasn't chosen yet */
@media (prefers-color-scheme: light){
  :root:not([data-theme="dark"]):not([data-theme="light"]){
    --ink-950:#fdfcf8; --ink-900:#f7f2e6; --ink-850:#efe8d8; --ink-800:#e6dcc6;
    --ink-700:#d8c9a8; --ink-600:#c3ae83;
    --ink-line: rgba(23,19,8,.12); --ink-line-strong: rgba(23,19,8,.22);
    --paper:#141d2c; --paper-dim:#0f1622; --paper-ink:#f5f2ea; --paper-line: rgba(245,242,234,.14);
    --off-white:#171308; --mute-on-dark: rgba(23,19,8,.64); --mute-on-dark-soft: rgba(23,19,8,.42);
    --mute-on-paper: rgba(245,242,234,.66);
    --surface-scrim: rgba(247,242,230,.86); --surface-glass: rgba(255,255,255,.6); --dot-rgb: 23,19,8;
  }
}

/* ============================================================
   RESET
   ============================================================ */
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;background:var(--ink-900);color:var(--off-white);font-family:var(--font-body);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden;transition:background .4s var(--ease), color .4s var(--ease);}
img{display:block;max-width:100%;}
a{color:inherit;text-decoration:none;}
ul{list-style:none;margin:0;padding:0;}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer;}
h1,h2,h3,h4,p,figure{margin:0;}
::selection{background:var(--coral);color:var(--on-coral);}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;}
}

/* ============================================================
   TYPOGRAPHY
   ============================================================ */
h1,h2,h3,.font-display{font-family:var(--font-display);font-weight:600;letter-spacing:-.01em;text-wrap:balance;}
.eyebrow{
  font-family:var(--font-mono);
  font-size:12.5px;
  letter-spacing:.14em;
  text-transform:uppercase;
  display:inline-flex;
  align-items:center;
  gap:10px;
  color:var(--coral);
  font-weight:500;
}
.eyebrow::before{content:'';width:22px;height:1px;background:var(--coral);display:inline-block;}
.eyebrow.on-paper{color:var(--coral-deep);}

h1{font-size:clamp(2.6rem, 5.4vw, 5rem);line-height:1.02;}
h2{font-size:clamp(2rem, 3.6vw, 3.1rem);line-height:1.08;}
h3{font-size:clamp(1.3rem, 1.9vw, 1.65rem);line-height:1.25;}
.lede{font-size:clamp(1.05rem,1.4vw,1.3rem);line-height:1.55;color:var(--mute-on-dark);font-weight:400;}
.on-paper .lede, .section-paper .lede{color:var(--mute-on-paper);}

.hl{color:var(--coral);font-style:italic;}
.hl-blue{color:var(--blue-bright);font-style:italic;}

/* ============================================================
   LAYOUT
   ============================================================ */
.wrap{max-width:var(--container);margin:0 auto;padding:0 32px;}
.wrap-narrow{max-width:var(--container-narrow);margin:0 auto;padding:0 32px;}
.section{position:relative;padding:120px 0;}
.section-tight{padding:80px 0;}
@media (max-width:780px){
  .section{padding:80px 0;}
  .section-tight{padding:56px 0;}
  .wrap,.wrap-narrow{padding:0 22px;}
}
.section-dark{background:var(--ink-900);}
.section-raised{background:var(--ink-850);}
.section-paper{background:var(--paper);color:var(--paper-ink);}
.section-paper .mute{color:var(--mute-on-paper);}
.mute{color:var(--mute-on-dark);}

.grain{position:absolute;inset:0;pointer-events:none;opacity:.05;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* diagonal seam between stacked sections */
.seam-down{clip-path:polygon(0 0,100% 0,100% calc(100% - 48px),0 100%);margin-bottom:-1px;}
.seam-up{clip-path:polygon(0 48px,100% 0,100% 100%,0 100%);margin-top:-1px;}
@media (max-width:780px){.seam-down{clip-path:polygon(0 0,100% 0,100% calc(100% - 22px),0 100%);}.seam-up{clip-path:polygon(0 22px,100% 0,100% 100%,0 100%);}}

/* ============================================================
   BUTTONS
   ============================================================ */
.btn{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--font-body);font-weight:700;font-size:15px;
  padding:16px 30px;border-radius:var(--radius-pill);
  transition:transform .35s var(--ease), box-shadow .35s var(--ease), background .35s var(--ease), color .35s var(--ease);
  white-space:nowrap;
}
.btn-coral{background:linear-gradient(135deg,var(--coral-bright),var(--coral-deep));color:var(--on-coral);box-shadow:0 14px 30px -12px rgba(233,108,109,.55);}
.btn-coral:hover{transform:translateY(-2px) scale(1.02);box-shadow:0 18px 38px -10px rgba(233,108,109,.7);}
.btn-outline{border:1.5px solid var(--ink-line-strong);color:var(--off-white);}
.btn-outline:hover{border-color:var(--coral);color:var(--coral);transform:translateY(-2px);}
.btn-ghost{color:var(--off-white);padding:16px 6px;}
.btn-ghost::after{content:'→';margin-left:4px;transition:transform .3s var(--ease);}
.btn-ghost:hover::after{transform:translateX(6px);}
.section-paper .btn-outline{border-color:var(--paper-line);color:var(--paper-ink);}
.section-paper .btn-outline:hover{border-color:var(--coral-deep);color:var(--coral-deep);}
.section-paper .btn-ghost{color:var(--paper-ink);}
.btn-sm{padding:11px 20px;font-size:13.5px;}

/* ============================================================
   NAV
   ============================================================ */
.site-header{
  position:fixed;top:0;left:0;right:0;z-index:100;
  padding:22px 0;transition:padding .4s var(--ease), background .4s var(--ease), border-color .4s var(--ease);
  border-bottom:1px solid transparent;
}
.site-header.is-scrolled{
  padding:14px 0;background:var(--surface-scrim);backdrop-filter:blur(14px);
  border-bottom:1px solid var(--ink-line);
}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;}
.brand{display:flex;align-items:center;gap:11px;}
.brand img{height:30px;width:auto;}
.brand-word{font-family:var(--font-mono);font-size:14px;letter-spacing:.06em;color:var(--off-white);}

.nav-links{display:flex;align-items:center;gap:6px;}
.nav-links a{
  padding:10px 16px;border-radius:var(--radius-pill);font-size:14.5px;font-weight:600;
  color:var(--mute-on-dark);transition:color .25s var(--ease), background .25s var(--ease);
}
.nav-links a:hover{color:var(--off-white);background:rgba(245,242,234,.06);}
.nav-links a.active{color:var(--ink-950);background:var(--off-white);}

.nav-right{display:flex;align-items:center;gap:14px;}
.nav-toggle{display:none;flex-direction:column;gap:5px;padding:8px;}
.nav-toggle span{width:22px;height:2px;background:var(--off-white);border-radius:2px;transition:transform .3s var(--ease), opacity .3s var(--ease);}

.mobile-menu{
  position:fixed;inset:0;z-index:99;background:var(--ink-950);
  display:flex;flex-direction:column;justify-content:center;padding:32px;
  transform:translateY(-100%);transition:transform .5s var(--ease);
}
.mobile-menu.is-open{transform:translateY(0);}
.mobile-menu a{font-family:var(--font-display);font-size:2.1rem;padding:14px 0;border-bottom:1px solid var(--ink-line);}
.mobile-menu .btn{margin-top:20px;align-self:flex-start;}

@media (max-width:900px){
  .nav-links{display:none;}
  .nav-toggle{display:flex;}
  .nav-right .btn{display:none;}
}

/* ============================================================
   HERO (canvas network background)
   ============================================================ */
.hero{position:relative;padding:200px 0 90px;overflow:hidden;background:radial-gradient(120% 90% at 15% 0%,var(--ink-700),var(--ink-900) 60%);}
.hero-canvas{position:absolute;inset:0;width:100%;height:100%;opacity:.65;}
.hero-inner{position:relative;z-index:2;display:grid;grid-template-columns:1.15fr .85fr;gap:60px;align-items:end;}
.hero-copy{max-width:640px;}
.hero-copy h1{margin:22px 0 26px;}
.hero-copy .lede{max-width:480px;margin-bottom:38px;}
.hero-ctas{display:flex;align-items:center;gap:22px;flex-wrap:wrap;}
.hero-aside{position:relative;}
.hero-badge{
  background:var(--surface-glass);border:1px solid var(--ink-line);backdrop-filter:blur(10px);
  border-radius:var(--radius-md);padding:26px;display:flex;flex-direction:column;gap:18px;
}
.hero-badge .row{display:flex;justify-content:space-between;align-items:baseline;padding-top:14px;border-top:1px solid var(--ink-line);}
.hero-badge .row:first-child{border-top:none;padding-top:0;}
.hero-badge b{font-family:var(--font-display);font-size:1.6rem;color:var(--coral);}
.hero-badge span{font-family:var(--font-mono);font-size:11.5px;letter-spacing:.06em;color:var(--mute-on-dark);text-transform:uppercase;text-align:right;}

@media (max-width:980px){
  .hero{padding:150px 0 70px;}
  .hero-inner{grid-template-columns:1fr;}
  .hero-aside{max-width:420px;}
}

/* stat rail beneath hero */
.stat-rail{position:relative;z-index:2;margin-top:70px;padding-top:44px;border-top:1px solid var(--ink-line);
  display:grid;grid-template-columns:repeat(4,1fr);gap:24px;}
.stat-rail .stat b{display:block;font-family:var(--font-display);font-size:clamp(1.7rem,2.6vw,2.4rem);color:var(--off-white);}
.stat-rail .stat span{font-family:var(--font-mono);font-size:11.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--mute-on-dark);}
@media (max-width:780px){.stat-rail{grid-template-columns:repeat(2,1fr);row-gap:30px;}}

/* ============================================================
   TRUST / LOGO BAR
   ============================================================ */
.trust-bar{padding:34px 0;border-bottom:1px solid var(--ink-line);}
.trust-bar .wrap{display:flex;align-items:center;gap:40px;flex-wrap:wrap;justify-content:space-between;}
.trust-bar .trust-label{font-family:var(--font-mono);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--mute-on-dark-soft);white-space:nowrap;}
.trust-marks{display:flex;gap:34px;flex-wrap:wrap;align-items:center;}
.trust-marks .mark{font-family:var(--font-display);font-style:italic;font-size:1.1rem;color:var(--mute-on-dark);}

/* ============================================================
   SECTION HEAD
   ============================================================ */
.section-head{max-width:680px;margin-bottom:64px;}
.section-head h2{margin-top:18px;}
.section-head.center{margin-left:auto;margin-right:auto;text-align:center;}

/* ============================================================
   CARDS — services
   ============================================================ */
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;background:var(--ink-line);border:1px solid var(--ink-line);border-radius:var(--radius-lg);overflow:hidden;}
.svc-card{background:var(--ink-900);padding:38px 32px;transition:background .35s var(--ease);position:relative;}
.svc-card:hover{background:var(--ink-850);}
.svc-num{font-family:var(--font-mono);font-size:12px;color:var(--coral);letter-spacing:.06em;}
.svc-card h3{margin:20px 0 12px;}
.svc-card p{color:var(--mute-on-dark);font-size:15px;}
.svc-card .btn-ghost{margin-top:18px;font-size:14px;}
@media (max-width:900px){.svc-grid{grid-template-columns:1fr;}}

/* ============================================================
   PROCESS
   ============================================================ */
.process-list{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;}
.process-step{position:relative;padding-top:26px;border-top:2px solid var(--ink-line-strong);}
.process-step .p-num{font-family:var(--font-display);font-size:2.6rem;font-style:italic;color:var(--blue-bright);opacity:.85;}
.process-step h3{margin:14px 0 10px;}
.process-step p{color:var(--mute-on-dark);font-size:14.5px;}
@media (max-width:900px){.process-list{grid-template-columns:repeat(2,1fr);}}
@media (max-width:560px){.process-list{grid-template-columns:1fr;}}

/* ============================================================
   CASE / RESULT cards
   ============================================================ */
.case-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;}
.case-card{background:var(--ink-850);border:1px solid var(--ink-line);border-radius:var(--radius-md);padding:34px 30px;}
.case-card .eyebrow{margin-bottom:16px;}
.case-metrics{display:flex;gap:28px;margin-top:22px;}
.case-metrics div b{display:block;font-family:var(--font-display);font-size:1.9rem;color:var(--coral);}
.case-metrics div span{font-family:var(--font-mono);font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--mute-on-dark);}
@media (max-width:980px){.case-grid{grid-template-columns:1fr;}}

/* ============================================================
   TESTIMONIALS (pull-quote)
   ============================================================ */
.quote-wall{display:grid;grid-template-columns:repeat(2,1fr);gap:2px;background:var(--paper-line);border:1px solid var(--paper-line);border-radius:var(--radius-lg);overflow:hidden;}
.quote-card{background:var(--paper);padding:44px 40px;position:relative;}
.quote-mark{position:absolute;top:18px;left:34px;font-family:var(--font-display);font-size:5rem;color:var(--coral);opacity:.25;line-height:1;}
.quote-card p.q{font-family:var(--font-display);font-size:1.35rem;line-height:1.4;font-style:italic;position:relative;z-index:1;margin-bottom:22px;}
.quote-person{display:flex;align-items:center;gap:14px;}
.quote-avatar{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--font-mono);font-weight:600;font-size:13px;color:var(--white);}
.quote-avatar.sarah{background:linear-gradient(135deg,var(--coral),var(--coral-deep));}
.quote-avatar.malik{background:linear-gradient(135deg,var(--blue),var(--blue-deep));}
.quote-person b{display:block;font-size:14.5px;}
.quote-person span{font-size:13px;color:var(--mute-on-paper);}
@media (max-width:780px){.quote-wall{grid-template-columns:1fr;}}

/* ============================================================
   CTA BAND
   ============================================================ */
.cta-band{background:linear-gradient(120deg,var(--ink-700),var(--ink-900));border:1px solid var(--ink-line);border-radius:var(--radius-lg);padding:64px;display:flex;align-items:center;justify-content:space-between;gap:40px;position:relative;overflow:hidden;}
.cta-band::before{content:'';position:absolute;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(233,108,109,.25),transparent 70%);top:-160px;right:-120px;}
.cta-band h2{max-width:520px;position:relative;z-index:1;}
.cta-band .btn{position:relative;z-index:1;flex-shrink:0;}
@media (max-width:780px){.cta-band{flex-direction:column;align-items:flex-start;padding:40px 30px;}}

/* ============================================================
   FOOTER
   ============================================================ */
footer{background:var(--ink-950);padding:80px 0 30px;border-top:1px solid var(--ink-line);}
.f-top{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:40px;padding-bottom:50px;border-bottom:1px solid var(--ink-line);}
.f-brand p{color:var(--mute-on-dark);font-size:14.5px;margin-top:18px;max-width:280px;}
.f-col h4{font-family:var(--font-mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--mute-on-dark-soft);margin-bottom:18px;}
.f-col ul li{margin-bottom:12px;}
.f-col a{color:var(--off-white);font-size:14.5px;transition:color .25s var(--ease);}
.f-col a:hover{color:var(--coral);}
.f-bottom{display:flex;justify-content:space-between;align-items:center;padding-top:26px;flex-wrap:wrap;gap:14px;}
.f-bottom p{color:var(--mute-on-dark-soft);font-size:13px;}
.f-social{display:flex;gap:12px;}
.f-social a{width:36px;height:36px;border-radius:50%;border:1px solid var(--ink-line);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;transition:border-color .25s var(--ease), color .25s var(--ease);}
.f-social a:hover{border-color:var(--coral);color:var(--coral);}
@media (max-width:900px){.f-top{grid-template-columns:1fr 1fr;}}
@media (max-width:560px){.f-top{grid-template-columns:1fr;}}

/* ============================================================
   REVEAL ON SCROLL
   ============================================================ */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .8s var(--ease-out), transform .8s var(--ease-out);}
.reveal.is-visible{opacity:1;transform:translateY(0);}
.reveal-stagger > *{opacity:0;transform:translateY(26px);transition:opacity .7s var(--ease-out), transform .7s var(--ease-out);}
.reveal-stagger.is-visible > *{opacity:1;transform:translateY(0);}
.reveal-stagger.is-visible > *:nth-child(1){transition-delay:.02s;}
.reveal-stagger.is-visible > *:nth-child(2){transition-delay:.10s;}
.reveal-stagger.is-visible > *:nth-child(3){transition-delay:.18s;}
.reveal-stagger.is-visible > *:nth-child(4){transition-delay:.26s;}
.reveal-stagger.is-visible > *:nth-child(5){transition-delay:.34s;}
.reveal-stagger.is-visible > *:nth-child(6){transition-delay:.42s;}

/* ============================================================
   PAGE HEADER (interior pages)
   ============================================================ */
.page-hero{position:relative;padding:170px 0 90px;background:radial-gradient(120% 90% at 85% 0%,var(--ink-700),var(--ink-900) 60%);overflow:hidden;}
.page-hero .eyebrow{margin-bottom:20px;}
.page-hero h1{max-width:820px;}
.page-hero .lede{max-width:600px;margin-top:22px;}
@media (max-width:780px){.page-hero{padding:130px 0 60px;}}

/* watermark numerals */
.watermark{position:absolute;font-family:var(--font-display);font-style:italic;font-weight:300;color:var(--ink-700);z-index:0;pointer-events:none;user-select:none;}

/* ============================================================
   UTILITIES
   ============================================================ */
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:start;}
@media (max-width:900px){.grid-2{grid-template-columns:1fr;gap:40px;}}
.pill-tag{font-family:var(--font-mono);font-size:11.5px;letter-spacing:.05em;text-transform:uppercase;border:1px solid var(--ink-line-strong);border-radius:var(--radius-pill);padding:7px 14px;display:inline-block;}
.divider{height:1px;background:var(--ink-line);border:none;margin:0;}

/* ============================================================
   THEME TOGGLE
   ============================================================ */
.theme-toggle{
  position:relative;width:52px;height:30px;border-radius:var(--radius-pill);
  background:var(--ink-800);border:1px solid var(--ink-line-strong);
  flex-shrink:0;transition:background .35s var(--ease);
}
.theme-toggle .knob{
  position:absolute;top:2px;left:2px;width:24px;height:24px;border-radius:50%;
  background:linear-gradient(135deg,var(--coral-bright),var(--coral-deep));
  display:flex;align-items:center;justify-content:center;font-size:12px;line-height:1;
  transition:transform .35s var(--ease-out);
}
:root[data-theme="light"] .theme-toggle .knob{transform:translateX(22px);}
@media (prefers-color-scheme:light){:root:not([data-theme="dark"]):not([data-theme="light"]) .theme-toggle .knob{transform:translateX(22px);}}
.theme-toggle .knob::before{content:'🌙';}
:root[data-theme="light"] .theme-toggle .knob::before{content:'☀️';}
@media (prefers-color-scheme:light){:root:not([data-theme="dark"]):not([data-theme="light"]) .theme-toggle .knob::before{content:'☀️';}}
.mobile-menu .theme-toggle{align-self:flex-start;margin-top:26px;}

/* ============================================================
   HERO VIDEO
   ============================================================ */
.hero-video-wrap{position:absolute;inset:0;overflow:hidden;}
.hero-video-wrap video{
  position:absolute;top:50%;left:50%;min-width:100%;min-height:100%;width:auto;height:auto;
  transform:translate(-50%,-50%);object-fit:cover;
}
.hero-video-scrim{
  position:absolute;inset:0;
  background:
    linear-gradient(180deg, var(--ink-950) 0%, rgba(10,15,28,.72) 22%, rgba(10,15,28,.55) 60%, var(--ink-950) 100%),
    linear-gradient(90deg, var(--ink-950) 0%, transparent 55%);
  opacity:.94;
}
:root[data-theme="light"] .hero-video-scrim{
  background:
    linear-gradient(180deg, var(--ink-900) 0%, rgba(247,242,230,.78) 22%, rgba(247,242,230,.62) 60%, var(--ink-900) 100%),
    linear-gradient(90deg, var(--ink-900) 0%, transparent 55%);
}
@media (prefers-reduced-motion: reduce){.hero-video-wrap{display:none;}}
@media (max-width:780px){.hero-video-wrap video{opacity:.7;}}

/* ============================================================
   PINNED SCROLL-STAGE
   A tall track with a sticky viewport; each .pin-step activates
   as it crosses the viewport center. Falls back to a plain stacked
   layout (no sticky, no pinning) on small screens and under
   prefers-reduced-motion, where every step is simply visible.
   ============================================================ */
.pin-stage{position:relative;}
.pin-stage__grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:70px;align-items:start;}
.pin-stage__viewport{position:sticky;top:110px;align-self:start;}
.pin-visual{display:none;}
.pin-visual.is-active{display:block;animation:pinFade .5s var(--ease-out);}
@keyframes pinFade{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:translateY(0);}}
.pin-stage__track{display:flex;flex-direction:column;}
.pin-step{min-height:70vh;display:flex;flex-direction:column;justify-content:center;padding:40px 0;opacity:.32;transform:translateY(14px);transition:opacity .5s var(--ease-out), transform .5s var(--ease-out);}
.pin-step:first-child{padding-top:0;}
.pin-step.is-active{opacity:1;transform:translateY(0);}
.pin-step .pin-step-num{font-family:var(--font-mono);color:var(--coral);font-size:13px;letter-spacing:.08em;margin-bottom:14px;display:block;}

@media (max-width:900px){
  .pin-stage__grid{grid-template-columns:1fr;gap:0;}
  .pin-stage__viewport{position:static;top:auto;}
  .pin-stage__viewport{display:none;}
  .pin-step{min-height:0;opacity:1;transform:none;padding:22px 0;border-top:1px solid var(--ink-line);}
  .pin-step:first-child{border-top:none;padding-top:22px;}
  .pin-step .pin-visual-inline{display:block;margin-bottom:16px;}
}
@media (prefers-reduced-motion: reduce){
  .pin-stage__viewport{position:static;top:auto;display:none;}
  .pin-step{min-height:0;opacity:1;transform:none;padding:22px 0;}
  .pin-step .pin-visual-inline{display:block;margin-bottom:16px;}
}
.pin-visual-inline{display:none;}

/* ============================================================
   PER-TEMPLATE STYLES (merged from each page's original inline
   <style> block in the static build)
   ============================================================ */

/* ---- Services ---- */
.svc-detail{position:relative;overflow:hidden;}
.svc-detail .watermark{font-size:min(28vw,320px);top:-4%;right:-2%;}
.svc-detail .grid-2{position:relative;z-index:1;}
.svc-detail .kicker-num{font-family:var(--font-mono);font-size:13px;color:var(--coral);letter-spacing:.08em;margin-bottom:14px;display:block;}
.include-list li{display:flex;gap:12px;padding:14px 0;border-bottom:1px solid var(--ink-line);font-size:15px;}
.section-paper .include-list li{border-bottom:1px solid var(--paper-line);}
.include-list li::before{content:'—';color:var(--coral);flex-shrink:0;}

/* ---- Who We Are ---- */
.about-portrait{position:relative;border-radius:var(--radius-lg);overflow:hidden;background:linear-gradient(150deg,var(--ink-700),var(--ink-900));padding:52px 40px;border:1px solid var(--ink-line);}
.about-portrait .big-quote{font-family:var(--font-display);font-style:italic;font-size:1.7rem;line-height:1.35;}
.about-portrait .attribution{margin-top:20px;font-family:var(--font-mono);font-size:12px;color:var(--mute-on-dark);letter-spacing:.04em;}

/* ---- Results ---- */
.feature-quote{padding:56px 0;border-bottom:1px solid var(--paper-line);}
.feature-quote:last-child{border-bottom:none;}
.feature-quote .quote-mark{position:static;font-size:3.5rem;opacity:.3;display:block;margin-bottom:10px;}
.feature-quote p.q{font-family:var(--font-display);font-size:clamp(1.4rem,2.4vw,2rem);font-style:italic;line-height:1.35;max-width:820px;}
.feature-quote .quote-person{margin-top:26px;}

/* ---- Contact ---- */
.contact-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:56px;align-items:start;}
@media (max-width:980px){.contact-grid{grid-template-columns:1fr;}}
.info-card{border:1px solid var(--ink-line);border-radius:var(--radius-lg);padding:36px;background:var(--ink-850);}
.info-row{display:flex;gap:16px;padding:18px 0;border-top:1px solid var(--ink-line);}
.info-row:first-child{border-top:none;padding-top:0;}
.info-row .ico{font-family:var(--font-mono);color:var(--coral);font-size:13px;padding-top:2px;}
.info-row a, .info-row span.val{font-size:15px;}
.info-row a:hover{color:var(--coral);}
.calendly-wrap{border:1px solid var(--ink-line);border-radius:var(--radius-lg);overflow:hidden;background:var(--ink-850);padding:6px;}
.calendly-inline-widget{background:transparent;}

/* ---- misc WP chrome (blog fallback templates) ---- */
.site-content{padding:170px 0 100px;}
.page-title{font-size:clamp(2rem,3.6vw,3.1rem);margin-bottom:40px;}
.entry{padding:34px 0;border-bottom:1px solid var(--ink-line);}
.entry-title a{color:var(--off-white);}
.entry-title a:hover{color:var(--coral);}
.entry-meta{font-family:var(--font-mono);font-size:12px;color:var(--mute-on-dark-soft);margin:8px 0 16px;text-transform:uppercase;letter-spacing:.05em;}
.entry-content{color:var(--mute-on-dark);line-height:1.7;}
.pagination{margin-top:40px;display:flex;justify-content:space-between;}
.pagination a{color:var(--coral);font-weight:600;}
.no-results{color:var(--mute-on-dark);}
.no-results a{color:var(--coral);font-weight:600;}