/* ====================================================================
   Multi-page additions — page transitions, sub-page heroes, auditor
   Palette inherited from styles.css (cyan + navy, from theadseagle.com)
==================================================================== */

/* ---------- Page transition curtains (per-page variants) ---------- */
/* Base = OPEN/hidden state. .is-cover = full-screen COVER state.
   Each page sets a t-* class to choose its own transition geometry. */
.curtain{position:fixed;inset:0;z-index:9500;background:var(--bg-2);display:grid;place-items:center;pointer-events:none;
  will-change:transform,clip-path,opacity;transition:transform .68s var(--ease),clip-path .72s var(--ease),opacity .55s var(--ease)}
.curtain.is-cover{pointer-events:auto}
.curtain__logo{display:flex;align-items:center;gap:.7rem;font-family:'Space Grotesk';font-weight:700;letter-spacing:.25em;font-size:.95rem;opacity:.92}
.curtain__logo img{width:34px;height:34px;animation:floaty 3s ease-in-out infinite}

/* wipe up (home) */
.curtain.t-wipeup{transform:translateY(-100%)}
.curtain.t-wipeup.is-cover{transform:translateY(0)}
/* slide from right (services) */
.curtain.t-slideR{transform:translateX(100%)}
.curtain.t-slideR.is-cover{transform:translateX(0)}
/* slide from left (results) */
.curtain.t-slideL{transform:translateX(-100%)}
.curtain.t-slideL.is-cover{transform:translateX(0)}
/* iris reveal (about) */
.curtain.t-iris{clip-path:circle(0% at 50% 50%)}
.curtain.t-iris.is-cover{clip-path:circle(150% at 50% 50%)}
/* fade (audit) */
.curtain.t-fade{opacity:0;visibility:hidden}
.curtain.t-fade.is-cover{opacity:1;visibility:visible}
/* zoom (contact / let's talk) */
.curtain.t-zoom{opacity:0;transform:scale(1.18);visibility:hidden}
.curtain.t-zoom.is-cover{opacity:1;transform:scale(1);visibility:visible}

@media (prefers-reduced-motion:reduce){.curtain{display:none}}

/* active nav link */
.nav__links a.active{color:var(--text)}
.nav__links a.active:not(.nav__cta)::after{width:100%}

/* ---------- Sub-page hero ---------- */
.page-hero{max-width:var(--container);margin:0 auto;padding:clamp(8rem,16vw,12rem) clamp(1.2rem,4vw,2rem) clamp(3rem,6vw,5rem);text-align:center}
.page-hero__eyebrow{display:inline-flex;align-items:center;gap:.6rem;padding:.5rem 1rem;border:1px solid var(--stroke);border-radius:100px;background:var(--surface);font-size:.8rem;letter-spacing:.2em;text-transform:uppercase;color:var(--brand);margin-bottom:1.6rem;backdrop-filter:blur(8px)}
.page-hero__title{font-family:'Sora';font-weight:800;font-size:clamp(2.4rem,7vw,5rem);line-height:1;letter-spacing:-.03em}
.page-hero__lead{margin:1.6rem auto 0;color:var(--muted);font-size:clamp(1.05rem,2vw,1.25rem);max-width:640px}
.crumbs{display:flex;justify-content:center;gap:.5rem;color:var(--muted);font-size:.82rem;margin-bottom:1.4rem;font-family:'Space Grotesk'}
.crumbs a{color:var(--brand)}

/* ---------- Detailed service rows ---------- */
.svc-row{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center;margin-bottom:4rem}
.svc-row:nth-child(even) .svc-row__visual{order:-1}
.svc-row__visual{aspect-ratio:4/3;border-radius:var(--r);background:var(--grad-soft);border:1px solid var(--stroke);display:grid;place-items:center;position:relative;overflow:hidden;transform-style:preserve-3d}
.svc-row__visual .glyph{font-size:clamp(3rem,8vw,6rem);filter:drop-shadow(0 10px 30px rgba(71,210,239,.4));animation:floaty 6s ease-in-out infinite}
@keyframes floaty{50%{transform:translateY(-14px)}}
.svc-row h3{font-size:clamp(1.5rem,3vw,2.2rem);font-family:'Sora';font-weight:700;margin-bottom:1rem}
.svc-row p{color:var(--muted);margin-bottom:1.4rem}
.svc-row ul{list-style:none;display:grid;gap:.6rem}
.svc-row li{display:flex;gap:.7rem;color:var(--text);font-size:.95rem}
.svc-row li::before{content:"\2726";color:var(--brand)}
@media (max-width:820px){.svc-row{grid-template-columns:1fr;gap:1.5rem}.svc-row:nth-child(even) .svc-row__visual{order:0}}

/* ====================================================================
   WEBSITE AUDITOR
==================================================================== */
.audit{max-width:980px;margin:0 auto;padding:0 clamp(1.2rem,4vw,2rem) 6rem}
.audit__bar{display:flex;gap:.8rem;padding:.6rem;border:1px solid var(--stroke);border-radius:100px;background:var(--surface);backdrop-filter:blur(10px);max-width:680px;margin:0 auto;box-shadow:0 20px 60px rgba(0,0,0,.4)}
.audit__bar input{flex:1;background:none;border:0;color:var(--text);font-size:1.05rem;padding:.7rem 1.2rem;font-family:inherit;min-width:0}
.audit__bar input:focus{outline:none}
.audit__bar input::placeholder{color:var(--muted)}
.audit__bar button{white-space:nowrap}
.audit__hint{text-align:center;color:var(--muted);font-size:.85rem;margin-top:1rem}

/* scanner */
.scanner{margin:3rem auto 0;max-width:520px;text-align:center;display:none}
.scanner.on{display:block}
.scanner__orb{width:170px;height:170px;margin:0 auto 1.6rem;position:relative;border-radius:50%;border:1px solid var(--stroke);display:grid;place-items:center;transform-style:preserve-3d;animation:orbspin 8s linear infinite}
.scanner__orb::before,.scanner__orb::after{content:"";position:absolute;inset:0;border-radius:50%;border:1px solid rgba(71,210,239,.4)}
.scanner__orb::before{transform:rotateX(70deg)}
.scanner__orb::after{transform:rotateY(70deg)}
.scanner__sweep{position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,rgba(71,210,239,.55),transparent 60%);animation:sweep 1.4s linear infinite;-webkit-mask:radial-gradient(transparent 40%,#000 41%);mask:radial-gradient(transparent 40%,#000 41%)}
.scanner__core{width:48px;height:48px;border-radius:50%;background:var(--grad);box-shadow:0 0 40px rgba(71,210,239,.8);animation:pulse 1.6s infinite}
.scanner__steps{font-family:'Space Grotesk';color:var(--muted);font-size:.95rem;min-height:1.4em}
@keyframes orbspin{to{transform:rotateY(360deg)}}
@keyframes sweep{to{transform:rotate(360deg)}}

/* report */
.report{margin-top:3rem;display:none;opacity:0;transform:translateY(24px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.report.show{display:block;opacity:1;transform:none}
.report__head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1.5rem;padding:2rem;border:1px solid var(--stroke);border-radius:var(--r);background:var(--surface);margin-bottom:1.4rem}
.report__site h3{font-size:1.4rem;word-break:break-all}
.report__site span{color:var(--muted);font-size:.9rem}
.gauge{--p:0;width:140px;height:140px;border-radius:50%;display:grid;place-items:center;position:relative;flex-shrink:0;background:conic-gradient(var(--gc,var(--brand)) calc(var(--p)*1%),rgba(255,255,255,.06) 0)}
.gauge::before{content:"";position:absolute;inset:10px;border-radius:50%;background:var(--bg-2)}
.gauge__num{position:relative;font-family:'Sora';font-weight:800;font-size:2.2rem;text-align:center;line-height:1}
.gauge__num small{display:block;font-size:.6rem;color:var(--muted);font-weight:600;letter-spacing:.15em;text-transform:uppercase}
.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem;margin-bottom:1.4rem}
.metric{padding:1.6rem;border:1px solid var(--stroke);border-radius:var(--r);background:var(--surface);transition:transform .4s var(--ease),border-color .4s;transform-style:preserve-3d}
.metric:hover{transform:translateY(-6px) rotateX(6deg);border-color:rgba(71,210,239,.45)}
.metric__v{font-family:'Sora';font-weight:800;font-size:1.7rem;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.metric__k{color:var(--muted);font-size:.82rem;margin-top:.3rem}
.subscores{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem;margin-bottom:1.4rem}
.sub{padding:1.4rem;border:1px solid var(--stroke);border-radius:var(--r);background:var(--surface)}
.sub__top{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:.7rem}
.sub__top b{font-size:1.3rem;font-family:'Sora'}
.sub__bar{height:8px;border-radius:8px;background:rgba(255,255,255,.07);overflow:hidden}
.sub__bar i{display:block;height:100%;width:0;border-radius:8px;background:var(--grad);transition:width 1.2s var(--ease)}
.sub__k{color:var(--muted);font-size:.82rem}
.findings{padding:2rem;border:1px solid var(--stroke);border-radius:var(--r);background:var(--surface)}
.findings h4{margin-bottom:1.2rem;font-size:1.1rem}
.finding{display:flex;gap:.9rem;padding:.8rem 0;border-top:1px solid var(--stroke);align-items:flex-start}
.finding:first-of-type{border-top:0}
.finding__ic{width:26px;height:26px;border-radius:7px;display:grid;place-items:center;flex-shrink:0;font-size:.8rem;font-weight:700}
.finding--pass .finding__ic{background:rgba(0,208,130,.15);color:#3be0a0}
.finding--warn .finding__ic{background:rgba(162,182,223,.15);color:var(--gold)}
.finding--fail .finding__ic{background:rgba(255,90,90,.15);color:#ff7a7a}
.finding__t{font-weight:600;font-size:.95rem}
.finding__d{color:var(--muted);font-size:.85rem}
.audit__err{color:#ff7a7a;text-align:center;margin-top:1.5rem;min-height:1.2em}
.audit__note{color:var(--muted);font-size:.78rem;text-align:center;margin-top:2rem;max-width:640px;margin-inline:auto;line-height:1.5}

@media (max-width:820px){.metrics,.subscores{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.audit__bar{flex-direction:column;border-radius:20px}.audit__bar button{width:100%;justify-content:center}.metrics,.subscores{grid-template-columns:1fr}}

/* ---------- Logo marks ---------- */
/* nav logo = your real eagle icon (transparent PNG cropped from main-logo.png) */
.nav__logo{height:42px;width:auto;flex:none;display:block;filter:drop-shadow(0 2px 10px rgba(71,210,239,.4))}
.nav__name{font-family:'Sora';font-weight:700;text-transform:none;letter-spacing:.01em;font-size:1.12rem}
.nav__brand{gap:.55rem}

/* ---------- Services dropdown ---------- */
.nav__drop{position:relative;display:flex;align-items:center}
.nav__drop-trig{display:inline-flex;align-items:center;gap:.3rem}
.nav__caret{transition:transform .3s var(--ease)}
.nav__drop:hover .nav__caret,.nav__drop:focus-within .nav__caret{transform:rotate(180deg)}
.nav__drop::before{content:"";position:absolute;top:100%;left:-10px;right:-10px;height:20px} /* hover bridge */
.nav__drop-menu{position:absolute;top:calc(100% + 16px);left:50%;transform:translateX(-50%) translateY(10px);min-width:255px;
  background:rgba(9,18,30,.94);backdrop-filter:blur(18px);border:1px solid var(--stroke);border-radius:16px;padding:.55rem;
  display:flex;flex-direction:column;gap:.1rem;opacity:0;visibility:hidden;pointer-events:none;
  /* transform-only transition: menu appears instantly (frame-independent), slide is a bonus */
  transition:transform .3s var(--ease);box-shadow:0 30px 70px rgba(0,0,0,.55);z-index:60}
.nav__drop:hover .nav__drop-menu,.nav__drop:focus-within .nav__drop-menu{opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(0)}
.nav__drop-menu a{padding:.7rem 1rem;border-radius:10px;color:var(--muted);font-size:.92rem;white-space:nowrap;transition:background .25s,color .25s,padding-left .25s}
.nav__drop-menu a::after{display:none!important}
.nav__drop-menu a:hover{background:rgba(71,210,239,.12);color:var(--text);padding-left:1.3rem}

/* ---------- Service detail pages ---------- */
.svc-hero-ico{width:84px;height:84px;margin:0 auto 1.4rem;display:grid;place-items:center;font-size:2.6rem;border-radius:22px;background:var(--grad-soft);border:1px solid var(--stroke)}
.svc-feature-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.2rem;margin-top:2.5rem}
.svc-feat{padding:1.6rem;border:1px solid var(--stroke);border-radius:var(--r);background:var(--surface);transition:transform .4s var(--ease),border-color .4s}
.svc-feat:hover{transform:translateY(-5px);border-color:rgba(71,210,239,.4)}
.svc-feat h4{font-size:1.05rem;margin-bottom:.4rem}
.svc-feat p{color:var(--muted);font-size:.9rem}
@media (max-width:680px){.svc-feature-grid{grid-template-columns:1fr}}

/* social buttons + contact lines (contact page) */

/* social buttons + contact lines (contact page) */
.social-row{display:flex;gap:.7rem;margin-top:.7rem}
.social-btn{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;border:1px solid var(--stroke);background:var(--surface);color:var(--text);transition:transform .3s var(--ease),border-color .3s,background .3s,color .3s}
.social-btn:hover{transform:translateY(-3px);border-color:var(--brand);background:rgba(71,210,239,.12);color:var(--brand)}
.social-btn svg{width:20px;height:20px}
.contact-line{display:flex;align-items:center;gap:.6rem;font-size:1rem;margin:.25rem 0;color:var(--muted)}
.contact-line a{color:var(--text)}
.contact-line a:hover{color:var(--brand)}
.brand-ico{width:24px;height:24px;vertical-align:middle;display:inline-block}
.footer__brand img{width:22px;height:22px;vertical-align:middle;margin-right:.2rem}

/* real raster logo on a light brand badge (dark-mode friendly) */
.brand-badge{display:inline-block;padding:1.4rem 1.8rem;border-radius:26px;background:#f3f6fb;box-shadow:0 24px 70px rgba(0,0,0,.45),inset 0 0 0 1px rgba(255,255,255,.6)}
.brand-badge img{width:min(280px,70vw);height:auto;display:block}

/* nav fits 6 items: tighten on mid widths */
@media (max-width:1040px){.nav__links{gap:1.4rem;font-size:.88rem}}

/* ---------- Proof / results gallery ---------- */
.proof-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
.proof{border:1px solid var(--stroke);border-radius:var(--r);overflow:hidden;background:var(--surface);transition:transform .5s var(--ease),border-color .4s;transform-style:preserve-3d}
.proof:hover{border-color:rgba(71,210,239,.5)}
.proof__img{position:relative;aspect-ratio:4/3;overflow:hidden;background:#0b1726}
.proof__img img{width:100%;height:100%;object-fit:cover;object-position:top center;transition:transform .6s var(--ease)}
.proof:hover .proof__img img{transform:scale(1.06)}
.proof__badge{position:absolute;left:.8rem;bottom:.8rem;display:inline-flex;gap:.45rem;align-items:baseline;padding:.45rem .85rem;border-radius:100px;background:rgba(5,12,20,.72);backdrop-filter:blur(8px);border:1px solid var(--stroke);font-family:'Space Grotesk';font-weight:700;font-size:.95rem}
.proof__badge b{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.proof__badge span{font-size:.72rem;font-weight:500;color:var(--muted)}
.proof__body{padding:1.3rem 1.4rem}
.proof__plat{font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--brand);font-family:'Space Grotesk';font-weight:600}
.proof__body h3{font-size:1.05rem;margin:.4rem 0 .35rem}
.proof__body p{color:var(--muted);font-size:.88rem}
@media (max-width:900px){.proof-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.proof-grid{grid-template-columns:1fr}}

/* nav: intermediate breakpoint so 6 items never crowd between 680–1040px */
@media (max-width:900px){.nav__links{gap:1.15rem;font-size:.85rem}}

/* home audit teaser: stack on mobile */
@media (max-width:680px){.audit-teaser{grid-template-columns:1fr!important;gap:1.6rem!important;text-align:center}.audit-teaser .cta__title,.audit-teaser .cta__lead{text-align:center!important}}

/* dropdown becomes an inline indented list inside the mobile drawer */
@media (max-width:680px){
  .nav__drop{display:block;width:100%}
  .nav__drop-trig{display:flex}
  .nav__caret{display:none}
  .nav__drop::before{display:none}
  .nav__drop-menu{position:static;transform:none;opacity:1;visibility:visible;pointer-events:auto;background:none;border:0;box-shadow:none;backdrop-filter:none;padding:.3rem 0 .3rem .9rem;min-width:0;gap:0;transition:none}
  .nav__drop-menu a{font-size:1rem;padding:.5rem 0}
  .nav__drop-menu a:hover{padding-left:0;background:none}
}

/* ---------- Service card photos ---------- */
.card__photo{margin:-2.2rem -2rem 1.3rem;aspect-ratio:16/9;overflow:hidden;border-bottom:1px solid var(--stroke);background:#0b1726}
.card__photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s var(--ease)}
.card:hover .card__photo img{transform:scale(1.06)}