/* EyeOT Site Standard v4 — loads first on every page.
   Layer order: base (defaults) < page (page CSS) < unlayered (shared components, always win). */
@layer base, page;
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800&family=Inter+Tight:wght@600;700;800&display=swap");

:root{
  --navy:#092652; --ink:#0D1F35;
  --red:#F53332; --red-600:#E0282A; --red-700:#C81E1E; --red-on-navy:#FF8078;
  --text:#092652; --body:#45627F; --slate:#526D89;
  --on-navy-body:#C8D7E8; --on-navy-eyebrow:#9DB8DD;
  --ground:#EEF5FB; --white:#FFFFFF; --soft:#F7FBFF; --line:rgba(9,38,82,.11);
  --r-sm:8px; --r-md:14px; --r-lg:20px; --r-pill:999px;
  --sh-1:0 10px 26px rgba(9,38,82,.08); --sh-2:0 18px 42px rgba(9,38,82,.12); --sh-3:0 30px 75px rgba(9,38,82,.16);
  --t-color:180ms ease; --t-move:250ms ease;
  --container:1240px; --section:104px; --section-sm:72px;
  --bp-lg:1180px; --bp-nav:980px; --bp-md:720px; --bp-sm:420px;
}

@layer base{
  *{box-sizing:border-box}
  html{scroll-behavior:smooth}
  body{margin:0;font-family:Inter,Arial,sans-serif;font-weight:400;color:var(--text)}
  p{color:inherit}
  a{color:inherit}
  a:hover{color:var(--red-700)}
}

/* ---------- Shared components (unlayered) ---------- */

/* Focus */
:focus-visible{outline:3px solid var(--red);outline-offset:3px}

/* Container */
.shell,.wrap,.section-wrap{width:min(var(--container),calc(100% - 48px));margin-left:auto;margin-right:auto}
@media(max-width:720px){.shell,.wrap,.section-wrap{width:min(var(--container),calc(100% - 30px))}}

/* Headings */
h1{font-size:88px!important;font-weight:600!important;line-height:.97!important;letter-spacing:-.04em!important;text-wrap:balance}
@media(max-width:1180px){h1{font-size:clamp(40px,7vw,88px)!important}}
@media(max-width:720px){h1{font-size:40px!important;line-height:1.05!important;letter-spacing:-.035em!important}}
main section h2:not(.h2-sm):not(:is(.copy h2,.form-body h2,.review-copy h2,.faq-side h2,.next-inner h2,.mid-cta h2)){font-size:clamp(38px,4.4vw,62px);font-weight:800;line-height:1.04;letter-spacing:-.045em}
.h2-sm,.form-body h2,.review-copy h2,.faq-side h2,.next-inner h2,.mid-cta h2,.faq-intro h2,.closing h2,.cta-box h2,.research-head h2,.planner-copy h2{font-size:clamp(30px,3.2vw,44px)!important;font-weight:800;line-height:1.06;letter-spacing:-.04em}
.h3,.pain-copy h3,.routine-copy h3,.detail-copy h3,.flow-card h3{font-size:clamp(30px,3.2vw,46px);font-weight:800;line-height:1.06;letter-spacing:-.04em}
.h4,.who-card h3,.cap h3,.spotlight h3{font-size:22px;font-weight:700;line-height:1.25;letter-spacing:-.02em}
.accent,h1 .accent,h2 .accent,h3 .accent{color:var(--red)}
.lede{color:var(--body)}

/* Eyebrow — 12/800/.2em, slate, never red */
.eyebrow,.section-eyebrow,.stack-eyebrow,.proof-eyebrow{font-size:12px;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:var(--slate)}
.eyebrow:before,.eyebrow:after{content:none!important}

/* Label — replaces every kicker class */
.label,.panel-kicker,.arch-kicker,.split-kicker,.form-kicker,.step-label,.trust-label,.mega-label,.placeholder-label,.flow-eyebrow,.number{font-size:11px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--slate)}
.label-accent,.pain-num{font-size:11px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--red-700)}

/* Buttons — never move, no arrows */
.btn,.btn-primary,.btn-secondary,.cta-primary,.cta-secondary,.hero-cta a{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:12px 24px;border:2px solid transparent;border-radius:var(--r-sm);font-size:16px;font-weight:800;line-height:1.2;text-decoration:none;white-space:nowrap;transform:none!important;transition:background-color var(--t-color),color var(--t-color),border-color var(--t-color)}
.btn-sm{min-height:44px;padding:9px 18px;font-size:14px}
.btn-primary,.btn.primary,.cta-primary{background:var(--ink);border-color:var(--ink);color:#fff}
.btn-primary:hover,.btn.primary:hover,.cta-primary:hover{background:var(--red-600);border-color:var(--red-600);color:#fff}
.btn-secondary,.btn.secondary,.cta-secondary{background:transparent;border-color:var(--ink);color:var(--ink)}
.btn-secondary:hover,.btn.secondary:hover,.cta-secondary:hover{background:transparent;border-color:var(--red-700);color:var(--red-700)}
.btn:hover,.btn:active{transform:none!important}

/* Dark context */
.on-dark,.home-testimonial,.cta-band,.extend-card.dark{color:#fff}
.on-dark p,.home-testimonial p,.cta-band p,.extend-card.dark p{color:var(--on-navy-body)}
.on-dark .eyebrow,.home-testimonial .eyebrow,.cta-band .eyebrow,.extend-card.dark .eyebrow{color:var(--on-navy-eyebrow)!important}
.on-dark .accent,.on-dark h2 span,.home-testimonial h2 span,.home-testimonial .big-quote{color:var(--red-on-navy)}
.on-dark .btn-primary,.on-dark .btn.primary,.cta-band .btn{background:#fff;border-color:#fff;color:var(--ink)}
.on-dark .btn-primary:hover,.on-dark .btn.primary:hover,.cta-band .btn:hover{background:var(--red-600);border-color:var(--red-600);color:#fff}
.on-dark .btn-secondary,.on-dark .btn.secondary{border-color:#fff;color:#fff}
.on-dark .btn-secondary:hover,.on-dark .btn.secondary:hover{border-color:var(--red-on-navy);color:var(--red-on-navy)}

/* Red band — closing CTA only, once per page */
.on-red,.final-platform-cta,.closing-cta,.closing,.final-cta,section.cta,section.cta .cta-box{background:var(--red-600)!important;color:#fff}
.on-red h2,.final-platform-cta h2,.closing-cta h2,.closing h2{color:#fff}
.on-red p,.final-platform-cta p,.closing-cta p,.closing p{color:#fff}
.on-red .eyebrow,.final-platform-cta .eyebrow,.closing-cta .eyebrow,.closing-cta .section-eyebrow{color:var(--ink)!important}
.on-red h2,.final-platform-cta h2,.closing-cta h2,.closing h2,.final-cta h2,section.cta h2{color:#fff!important}
.on-red h2 span,.final-cta h2 span,.on-red .navy-highlight,.final-platform-cta h2 span,.closing-cta h2 span,.closing h2 span,section.cta h2 span{color:var(--navy)!important}
section.cta .eyebrow{color:var(--ink)!important}
section.cta p{color:#fff}
section.cta .btn{background:#fff!important;border-color:#fff!important;color:var(--ink)!important}
section.cta .btn:hover{background:var(--ink)!important;border-color:var(--ink)!important;color:#fff!important}
.on-red .btn,.on-red .btn-primary,.final-platform-cta .btn,.closing-cta .cta-primary,.closing-cta a.btn,.closing .btn{background:#fff!important;border-color:#fff!important;color:var(--ink)!important}
.on-red .btn:hover,.on-red .btn-primary:hover,.final-platform-cta .btn:hover,.closing-cta .cta-primary:hover,.closing-cta a.btn:hover,.closing .btn:hover{background:var(--ink)!important;border-color:var(--ink)!important;color:#fff!important}
.final-platform-cta:before{background:linear-gradient(180deg,rgba(224,40,42,0) 0%,rgba(224,40,42,.22) 44%,rgba(224,40,42,.68) 78%,#E0282A 100%)!important}

/* Links */
.link-arrow,.solution-link,.story-link,.routine-link a,.text-link,.case-link,.security-link{display:inline-flex;align-items:center;gap:6px;font-weight:800;text-decoration:none;color:var(--ink);transition:color var(--t-color)}
.link-arrow:after{content:"→";transition:transform var(--t-move)}
.link-arrow:hover,.solution-link:hover,.routine-link a:hover,.text-link:hover,.case-link:hover,.security-link:hover{color:var(--red-700)}
.link-arrow:hover:after{transform:translateX(4px)}
.prose a{color:var(--red-700);text-decoration:underline;text-underline-offset:3px}
.prose a:hover{color:var(--ink)}

/* Cards — only link cards lift */
.card-link,a.who-card,a.research-card{transition:transform var(--t-move),box-shadow var(--t-move),border-color var(--t-color)}
.card-link:hover,a.who-card:hover,a.research-card:hover{transform:translateY(-4px);box-shadow:var(--sh-2)}
.cap:hover,.stack-card:hover,.integration:hover,.spotlight:hover,.int-card:hover{transform:none!important;box-shadow:none!important}

/* Audience cards — shared treatment (homepage "Built around the work") */
.who-card,.audience-row{position:relative;background:rgba(255,255,255,.78);border:1px solid #c8d7e8;border-radius:16px;box-shadow:0 12px 30px rgba(11,31,67,.06)}
.who-card:before,.audience-row:before{content:"";position:absolute;left:28px;top:0;width:52px;height:3px;background:var(--red)}
a.who-card:hover,.audience-row:hover{transform:translateY(-4px);border-color:#c8d7e8;box-shadow:0 20px 45px rgba(11,31,67,.1)}

/* Bands */
.band-ground{background:var(--ground)} .band-white{background:var(--white)} .band-soft{background:var(--soft)} .band-navy{background:var(--navy);color:#fff}
.section{padding:var(--section) 0} @media(max-width:720px){.section{padding:var(--section-sm) 0}}

@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}

@media(max-width:980px){.site-nav .nav-actions{margin-left:14px}}

/* Headline typeface */
h1,h2,h3,h4,h5,h6,.h2-sm,.h3,.h4{font-family:"Inter Tight",Inter,Arial,sans-serif}

/* Industries in the nav are labels, not links (pages not built) */
.industry-grid span{color:#45627f;font-size:17px;font-weight:600;cursor:default}
@media(max-width:980px){.industry-grid span{font-size:15px}}

/* Large screens: the whole page scales in proportion above 1440px (see #fluid-scale script in each page head). Container stays 1240. */