/* ============================================================
   7030 Tech Advisors — design tokens + components
   Brand: electric blue #055CFA · slate #39424A (from logo)
   ============================================================ */

/* ---------- Type scale (fluid) ---------- */
:root{
  --text-xs:clamp(0.75rem,0.7rem + 0.25vw,0.85rem);
  --text-sm:clamp(0.875rem,0.82rem + 0.28vw,0.98rem);
  --text-base:clamp(1rem,0.96rem + 0.22vw,1.1rem);
  --text-lg:clamp(1.125rem,1.02rem + 0.55vw,1.4rem);
  --text-xl:clamp(1.5rem,1.2rem + 1.25vw,2.25rem);
  --text-2xl:clamp(2.1rem,1.4rem + 2.6vw,3.6rem);
  --text-3xl:clamp(2.6rem,1.2rem + 4.4vw,5rem);

  /* spacing (4px base) */
  --space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.25rem;
  --space-6:1.5rem;--space-8:2rem;--space-10:2.5rem;--space-12:3rem;--space-16:4rem;
  --space-20:5rem;--space-24:6rem;--space-32:8rem;

  /* radius */
  --radius-sm:.375rem;--radius-md:.625rem;--radius-lg:1rem;--radius-xl:1.5rem;--radius-full:9999px;

  --transition-interactive:180ms cubic-bezier(0.16,1,0.3,1);
  --ease-out:cubic-bezier(0.16,1,0.3,1);

  --content-narrow:640px;--content-default:1080px;--content-wide:1240px;

  --font-body:'Satoshi','Inter','Helvetica Neue',system-ui,sans-serif;
  --font-display:'Clash Grotesk','Satoshi','Inter',system-ui,sans-serif;
}

/* ---------- LIGHT (default) ---------- */
:root,[data-theme='light']{
  --color-bg:#f5f7fa;
  --color-surface:#ffffff;
  --color-surface-2:#eef2f7;
  --color-surface-offset:#e7ecf3;
  --color-border:#d6dde6;
  --color-divider:#e3e8ef;

  --color-text:#141a22;
  --color-text-muted:#54606f;
  --color-text-faint:#8b97a6;
  --color-text-inverse:#f7fafc;

  --color-primary:#0a52e0;          /* electric blue, contrast-tuned */
  --color-primary-strong:#055cfa;   /* brand blue for graphics */
  --color-primary-hover:#0842b5;
  --color-primary-soft:#e5edfe;

  --color-slate:#39424a;            /* brand slate */
  --color-ink:#1c2530;

  --shadow-sm:0 1px 2px rgba(20,40,70,.06);
  --shadow-md:0 8px 24px rgba(20,40,70,.09);
  --shadow-lg:0 24px 60px rgba(20,40,70,.14);
  --shadow-glow:0 20px 60px rgba(10,82,224,.18);

  --grid-line:rgba(20,40,70,.05);
  --header-bg:rgba(245,247,250,.72);
  --logo-invert:0;
}

/* ---------- DARK ---------- */
[data-theme='dark']{
  --color-bg:#0c0f14;
  --color-surface:#12161d;
  --color-surface-2:#171c25;
  --color-surface-offset:#1c2230;
  --color-border:#262d39;
  --color-divider:#20262f;

  --color-text:#e6ebf2;
  --color-text-muted:#98a3b3;
  --color-text-faint:#69748;
  --color-text-faint:#697488;
  --color-text-inverse:#0c0f14;

  --color-primary:#4d86ff;
  --color-primary-strong:#3b78ff;
  --color-primary-hover:#6f9dff;
  --color-primary-soft:#16233f;

  --color-slate:#8793a1;
  --color-ink:#e6ebf2;

  --shadow-sm:0 1px 2px rgba(0,0,0,.4);
  --shadow-md:0 8px 24px rgba(0,0,0,.5);
  --shadow-lg:0 24px 60px rgba(0,0,0,.6);
  --shadow-glow:0 20px 70px rgba(61,120,255,.28);

  --grid-line:rgba(140,170,220,.06);
  --header-bg:rgba(12,15,20,.72);
  --logo-invert:0;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme]){
    --color-bg:#0c0f14;--color-surface:#12161d;--color-surface-2:#171c25;--color-surface-offset:#1c2230;
    --color-border:#262d39;--color-divider:#20262f;--color-text:#e6ebf2;--color-text-muted:#98a3b3;
    --color-text-faint:#697488;--color-text-inverse:#0c0f14;--color-primary:#4d86ff;--color-primary-strong:#3b78ff;
    --color-primary-hover:#6f9dff;--color-primary-soft:#16233f;--color-slate:#8793a1;--color-ink:#e6ebf2;
    --header-bg:rgba(12,15,20,.72);--grid-line:rgba(140,170,220,.06);
    --shadow-glow:0 20px 70px rgba(61,120,255,.28);
  }
}

/* ============================================================
   Layout primitives
   ============================================================ */
.container{width:100%;max-width:var(--content-wide);margin-inline:auto;padding-inline:clamp(1.25rem,4vw,2.5rem)}
.section{padding-block:clamp(var(--space-16),9vw,var(--space-32))}
.section--tight{padding-block:clamp(var(--space-12),6vw,var(--space-20))}
.eyebrow{
  display:inline-flex;align-items:center;gap:var(--space-2);
  font-size:var(--text-xs);font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:var(--color-primary);
}
.eyebrow::before{content:"";width:1.75rem;height:1px;background:currentColor;opacity:.6}
h1,h2,h3{font-family:var(--font-display);letter-spacing:-0.02em;font-weight:600}
.h-section{font-size:var(--text-xl);margin-block:var(--space-4) var(--space-5);color:var(--color-text)}
.lead{font-size:var(--text-lg);color:var(--color-text-muted);line-height:1.55;max-width:56ch}
.muted{color:var(--color-text-muted)}

/* ============================================================
   Buttons
   ============================================================ */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);
  font-size:var(--text-sm);font-weight:600;line-height:1;
  padding:.85rem 1.4rem;border-radius:var(--radius-md);
  min-height:44px;white-space:nowrap;text-decoration:none;
}
.btn svg{width:1.05em;height:1.05em}
.btn--primary{background:var(--color-primary);color:#fff;box-shadow:var(--shadow-sm)}
.btn--primary:hover{background:var(--color-primary-hover);transform:translateY(-2px);box-shadow:var(--shadow-md)}
.btn--primary:active{transform:translateY(0);box-shadow:var(--shadow-sm)}
.btn--ghost{background:transparent;color:var(--color-text);border:1px solid var(--color-border)}
.btn--ghost:hover{border-color:var(--color-primary);color:var(--color-primary);transform:translateY(-2px)}
.btn--ghost:active{transform:translateY(0)}
.btn--lg{padding:1rem 1.7rem;font-size:var(--text-base)}

/* ============================================================
   Header
   ============================================================ */
.header{
  position:sticky;top:0;z-index:60;
  background:var(--header-bg);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid transparent;
  transition:border-color var(--transition-interactive),box-shadow var(--transition-interactive),background var(--transition-interactive);
}
.header--scrolled{border-bottom-color:var(--color-divider);box-shadow:var(--shadow-sm)}
.header__inner{display:flex;align-items:center;justify-content:space-between;gap:var(--space-6);height:4.75rem}
.brand{display:flex;align-items:center;gap:var(--space-3);text-decoration:none;color:var(--color-text)}
.brand__logo{height:34px;width:auto}
.brand__mark{height:34px;width:34px;flex:none}
.brand__name{display:flex;flex-direction:column;font-family:var(--font-display);font-weight:600;font-size:1.05rem;letter-spacing:-0.01em;line-height:1.05}
.brand__word{white-space:nowrap}
.brand__name b{font-weight:600;color:var(--color-primary)}
.brand__sub{display:block;font-family:var(--font-body);font-size:.6rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--color-text-faint);margin-top:4px}

.nav{display:flex;align-items:center;gap:var(--space-2)}
.nav__links{display:flex;align-items:center;gap:var(--space-1);list-style:none}
.nav__link{
  text-decoration:none;color:var(--color-text-muted);font-size:var(--text-sm);font-weight:500;
  padding:.5rem .8rem;border-radius:var(--radius-sm);
}
.nav__link:hover{color:var(--color-text);background:var(--color-surface-2)}
.header__actions{display:flex;align-items:center;gap:var(--space-3)}
.icon-btn{
  display:inline-grid;place-items:center;width:42px;height:42px;border-radius:var(--radius-md);
  color:var(--color-text-muted);border:1px solid var(--color-border);background:var(--color-surface);
}
.icon-btn:hover{color:var(--color-primary);border-color:var(--color-primary)}
.header .btn--primary{padding:.7rem 1.15rem}

.menu-toggle{display:none}

/* Mobile menu */
.mobile-menu{
  position:fixed;inset:4.75rem 0 auto 0;z-index:55;
  background:var(--color-surface);border-bottom:1px solid var(--color-divider);
  box-shadow:var(--shadow-lg);
  padding:var(--space-4) clamp(1.25rem,4vw,2.5rem) var(--space-8);
  display:flex;flex-direction:column;gap:var(--space-1);
  clip-path:inset(0 0 100% 0);transition:clip-path .35s var(--ease-out);
  visibility:hidden;
}
.mobile-menu.open{clip-path:inset(0 0 0 0);visibility:visible}
.mobile-menu a{
  text-decoration:none;color:var(--color-text);font-family:var(--font-display);font-size:var(--text-lg);
  padding:var(--space-3) 0;border-bottom:1px solid var(--color-divider);
}
.mobile-menu .btn{margin-top:var(--space-4)}

/* ============================================================
   Backgrounds / grid accents
   ============================================================ */
.grid-bg{
  position:absolute;inset:0;z-index:0;pointer-events:none;
  background-image:linear-gradient(var(--grid-line) 1px,transparent 1px),linear-gradient(90deg,var(--grid-line) 1px,transparent 1px);
  background-size:52px 52px;
  mask-image:radial-gradient(ellipse 80% 70% at 70% 20%,#000 40%,transparent 100%);
  -webkit-mask-image:radial-gradient(ellipse 80% 70% at 70% 20%,#000 40%,transparent 100%);
}
.glow{position:absolute;border-radius:var(--radius-full);filter:blur(80px);opacity:.5;pointer-events:none;z-index:0}

/* ============================================================
   Hero
   ============================================================ */
.hero{position:relative;overflow:hidden;padding-block:clamp(var(--space-16),8vw,var(--space-32)) clamp(var(--space-16),9vw,var(--space-24))}
.hero__glow-a{width:520px;height:520px;top:-160px;right:-120px;background:radial-gradient(circle,var(--color-primary-strong),transparent 70%);opacity:.22}
.hero__grid{position:relative;z-index:1;display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(var(--space-8),5vw,var(--space-20));align-items:center}
.hero__eyebrow{margin-bottom:var(--space-6)}
.hero h1{font-size:var(--text-2xl);line-height:1.04;max-width:16ch;color:var(--color-text)}
.hero h1 .accent{color:var(--color-primary)}
.hero__sub{margin-top:var(--space-6);font-size:var(--text-lg);color:var(--color-text-muted);max-width:52ch;line-height:1.5}
.hero__cta{display:flex;flex-wrap:wrap;gap:var(--space-3);margin-top:var(--space-8)}
.hero__proof{display:flex;flex-wrap:wrap;gap:var(--space-6) var(--space-8);margin-top:var(--space-12);padding-top:var(--space-8);border-top:1px solid var(--color-divider)}
.hero__proof-item{display:flex;flex-direction:column;gap:2px}
.hero__proof-item strong{font-family:var(--font-display);font-size:var(--text-lg);color:var(--color-text)}
.hero__proof-item span{font-size:var(--text-xs);color:var(--color-text-muted);letter-spacing:.02em}

/* Hero visual panel */
.hero__panel{position:relative;aspect-ratio:1/1;max-width:520px;margin-inline:auto;width:100%}
.orbit-card{
  position:absolute;background:var(--color-surface);border:1px solid var(--color-border);
  border-radius:var(--radius-lg);box-shadow:var(--shadow-md);padding:var(--space-4) var(--space-5);
  display:flex;align-items:center;gap:var(--space-3);font-size:var(--text-sm);font-weight:500;
}
.orbit-card svg{width:20px;height:20px;color:var(--color-primary);flex:none}
.orbit-card--tl svg,
.orbit-card--br svg{color:var(--color-slate)}
.orbit-card--ml svg{color:var(--color-primary-strong)}
.orbit-card--tl{top:6%;left:-4%;animation:float 6s ease-in-out infinite}
.orbit-card--br{bottom:8%;right:-6%;animation:float 7s ease-in-out infinite .8s}
.orbit-card--ml{top:34%;right:4%;bottom:auto;left:auto;animation:float 6.5s ease-in-out infinite .4s}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@media (prefers-reduced-motion:reduce){.orbit-card{animation:none!important}}

/* ============================================================
   Donut / 7030 ring (reusable SVG styling)
   ============================================================ */
.ring-70{stroke:var(--color-slate)}
.ring-30{stroke:var(--color-primary-strong)}
[data-theme='dark'] .ring-70{stroke:#4b5563}
.ring-separator{stroke-linecap:butt;stroke-width:6}
.ring-separator--hero{stroke:var(--color-bg)}
[data-theme='dark'] .ring-separator--hero{stroke:var(--color-bg)}
.ring-separator--model{stroke:var(--color-ink)}
[data-theme='dark'] .ring-separator--model{stroke:#0a0d12}

/* ============================================================
   Intro value
   ============================================================ */
.intro{background:var(--color-surface);border-block:1px solid var(--color-divider)}
.intro__grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(var(--space-8),5vw,var(--space-16));align-items:start}
.intro__body p+p{margin-top:var(--space-4)}
.intro__pull{
  font-family:var(--font-display);font-size:var(--text-lg);line-height:1.4;
  color:var(--color-text);border-left:0;padding-left:0;
}
.pill-row{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-top:var(--space-6)}
.pill{
  font-size:var(--text-xs);font-weight:600;letter-spacing:.02em;padding:.5rem .9rem;border-radius:var(--radius-full);
  background:var(--color-surface-2);color:var(--color-text-muted);border:1px solid var(--color-border);
}

/* ============================================================
   Services
   ============================================================ */
.services__grid{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--space-5);margin-top:var(--space-12)}
.svc-card{
  position:relative;background:var(--color-surface);border:1px solid var(--color-border);
  border-radius:var(--radius-lg);padding:var(--space-8);display:flex;flex-direction:column;gap:var(--space-4);
  overflow:hidden;
}
.svc-card:nth-child(1){grid-column:span 5}
.svc-card:nth-child(2){grid-column:span 7}
.svc-card:nth-child(3){grid-column:span 12;flex-direction:row;align-items:center;gap:var(--space-10);flex-wrap:wrap}
.svc-card__icon{
  width:52px;height:52px;flex:none;display:grid;place-items:center;border-radius:var(--radius-md);
  color:var(--color-primary);background:var(--color-primary-soft);
}
.svc-card__icon svg{width:26px;height:26px}
.svc-card h3{font-size:var(--text-lg);color:var(--color-text)}
.svc-card p{color:var(--color-text-muted);font-size:var(--text-base)}
.svc-card__body{display:flex;flex-direction:column;gap:var(--space-4)}
.svc-card ul{list-style:none;display:flex;flex-direction:column;gap:var(--space-2);margin-top:var(--space-2)}
.svc-card li{display:flex;gap:var(--space-2);align-items:flex-start;font-size:var(--text-sm);color:var(--color-text-muted)}
.svc-card li svg{width:16px;height:16px;color:var(--color-primary);flex:none;margin-top:.25rem}
.svc-card__num{position:absolute;top:var(--space-5);right:var(--space-6);font-family:var(--font-display);font-size:var(--text-xl);color:var(--color-divider);font-weight:600}
.svc-card:nth-child(3) .svc-card__flex{flex:1;min-width:260px;display:flex;flex-direction:column;gap:var(--space-4)}

/* ============================================================
   7030 model
   ============================================================ */
.model{background:var(--color-ink);color:var(--color-text-inverse);position:relative;overflow:hidden}
[data-theme='dark'] .model{background:#0a0d12}
.model .grid-bg{mask-image:radial-gradient(ellipse 90% 90% at 30% 30%,#000 30%,transparent 100%);--grid-line:rgba(140,170,220,.07)}
.model__inner{position:relative;z-index:1}
.model .eyebrow{color:#6f9dff}
.model h2{color:#fff}
.model__lead{color:#aeb8c6;max-width:60ch;font-size:var(--text-lg)}
.model__split{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(var(--space-8),5vw,var(--space-16));margin-top:var(--space-16);align-items:center}
.model__viz{display:grid;place-items:center;position:relative}
.model__viz-label{position:absolute;text-align:center}
.model__viz-label strong{display:block;font-family:var(--font-display);font-size:2.15rem;line-height:1;color:#fff}
.model__viz-label span{display:block;max-width:8.5rem;margin-top:.35rem;font-size:.58rem;line-height:1.25;letter-spacing:.11em;text-transform:uppercase;color:#aeb8c6}
.model__cols{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-5)}
.model-col{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.09);border-radius:var(--radius-lg);padding:var(--space-6)}
.model-col__tag{display:flex;align-items:baseline;gap:var(--space-2);margin-bottom:var(--space-3)}
.model-col__num{font-family:var(--font-display);font-size:2.6rem;font-weight:600;line-height:1}
.model-col--70 .model-col__num{color:#8793a1}
.model-col--30 .model-col__num{color:#6f9dff}
.model-col__tag span{font-size:var(--text-xs);letter-spacing:.14em;text-transform:uppercase;color:#8793a1}
.model-col h3{font-size:var(--text-lg);color:#fff;margin-bottom:var(--space-2)}
.model-col p{color:#aeb8c6;font-size:var(--text-sm)}
.model-col ul{list-style:none;display:flex;flex-direction:column;gap:var(--space-2);margin-top:var(--space-4)}
.model-col li{display:flex;gap:var(--space-2);font-size:var(--text-sm);color:#c3ccd8}
.model-col li svg{width:15px;height:15px;flex:none;margin-top:.3rem}
.model-col--70 li svg{color:#8793a1}
.model-col--30 li svg{color:#6f9dff}

/* ============================================================
   Why us
   ============================================================ */
.why__grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(var(--space-8),5vw,var(--space-16));align-items:start}
.why__points{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-6)}
.why-point{display:flex;flex-direction:column;gap:var(--space-2)}
.why-point__head{display:flex;align-items:center;gap:var(--space-3)}
.why-point__ic{width:40px;height:40px;flex:none;display:grid;place-items:center;border-radius:var(--radius-md);background:var(--color-primary-soft);color:var(--color-primary)}
.why-point__ic svg{width:20px;height:20px}
.why-point h3{font-size:var(--text-base);font-weight:600;color:var(--color-text);font-family:var(--font-body);letter-spacing:0}
.why-point p{font-size:var(--text-sm);color:var(--color-text-muted)}
.contrast-row{display:flex;flex-direction:column;gap:var(--space-3);margin-top:var(--space-2)}
.contrast{display:flex;align-items:center;gap:var(--space-3);font-size:var(--text-sm);color:var(--color-text-muted)}
.contrast .x{color:var(--color-text-faint);text-decoration:line-through;text-decoration-color:var(--color-text-faint)}
.contrast svg{width:18px;height:18px;flex:none}
.contrast .no{color:#c2410c}
[data-theme='dark'] .contrast .no{color:#f0895a}
.contrast .yes{color:var(--color-primary)}

/* ============================================================
   Engagement
   ============================================================ */
.engage__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-5);margin-top:var(--space-12);counter-reset:step}
.engage-card{
  background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);
  padding:var(--space-8);display:flex;flex-direction:column;gap:var(--space-3);position:relative;
}
.engage-card__step{font-family:var(--font-display);font-size:var(--text-sm);font-weight:600;color:var(--color-primary);letter-spacing:.04em}
.engage-card h3{font-size:var(--text-lg);color:var(--color-text)}
.engage-card p{font-size:var(--text-sm);color:var(--color-text-muted)}
.engage-card__line{height:3px;width:2.5rem;background:var(--color-primary);border-radius:var(--radius-full);margin-top:var(--space-2)}

/* ============================================================
   About
   ============================================================ */
.about{background:var(--color-surface);border-block:1px solid var(--color-divider)}
.about__grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(var(--space-8),5vw,var(--space-16));align-items:center}
.about__body p+p{margin-top:var(--space-4)}
.about__stats{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4)}
.stat{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-6)}
.stat strong{display:block;font-family:var(--font-display);font-size:var(--text-xl);color:var(--color-primary);line-height:1}
.stat span{display:block;margin-top:var(--space-2);font-size:var(--text-sm);color:var(--color-text-muted)}

/* ============================================================
   Final CTA
   ============================================================ */
.cta-final{position:relative;overflow:hidden}
.cta-final__card{
  position:relative;z-index:1;background:var(--color-ink);color:#fff;border-radius:var(--radius-xl);
  padding:clamp(var(--space-10),6vw,var(--space-24));text-align:center;overflow:hidden;
}
[data-theme='dark'] .cta-final__card{background:linear-gradient(135deg,#12161d,#0a0d12);border:1px solid var(--color-border)}
.cta-final__card .glow{width:400px;height:400px;top:-140px;left:50%;transform:translateX(-50%);background:radial-gradient(circle,var(--color-primary-strong),transparent 70%);opacity:.3}
.cta-final h2{position:relative;font-size:var(--text-2xl);color:#fff;max-width:18ch;margin-inline:auto}
.cta-final p{position:relative;color:#aeb8c6;max-width:52ch;margin:var(--space-5) auto 0;font-size:var(--text-lg)}
.cta-final .hero__cta{position:relative;justify-content:center;margin-top:var(--space-8)}

/* ============================================================
   Contact + footer
   ============================================================ */
.contact{background:var(--color-surface);border-top:1px solid var(--color-divider)}
.contact__grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(var(--space-8),5vw,var(--space-16));align-items:start}
.contact__info a{color:var(--color-primary);text-decoration:none;font-weight:500}
.contact__info a:hover{text-decoration:underline}
.contact__methods{display:flex;flex-direction:column;gap:var(--space-4);margin-top:var(--space-8)}
.contact-method{display:flex;gap:var(--space-3);align-items:flex-start}
.contact-method__ic{width:42px;height:42px;flex:none;display:grid;place-items:center;border-radius:var(--radius-md);background:var(--color-primary-soft);color:var(--color-primary)}
.contact-method__ic svg{width:20px;height:20px}
.contact-method strong{display:block;font-size:var(--text-sm);color:var(--color-text)}
.contact-method span,.contact-method a{font-size:var(--text-sm);color:var(--color-text-muted)}

.form{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:clamp(var(--space-6),3vw,var(--space-8))}
.form__row{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4)}
.field{display:flex;flex-direction:column;gap:var(--space-2);margin-bottom:var(--space-4)}
.field label{font-size:var(--text-sm);font-weight:600;color:var(--color-text)}
.field input,.field textarea{
  width:100%;padding:.8rem 1rem;border-radius:var(--radius-md);border:1px solid var(--color-border);
  background:var(--color-surface);color:var(--color-text);font-size:var(--text-base);
}
.field input:focus,.field textarea:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-soft);outline:none}
.field textarea{resize:vertical;min-height:120px}
.form__note{font-size:var(--text-xs);color:var(--color-text-faint);margin-top:var(--space-3)}
.form__success{
  display:none;align-items:center;gap:var(--space-3);padding:var(--space-4);border-radius:var(--radius-md);
  background:var(--color-primary-soft);color:var(--color-primary);font-size:var(--text-sm);font-weight:500;margin-top:var(--space-4);
}
.form__success.show{display:flex}
.form__success svg{width:20px;height:20px;flex:none}

.footer{background:var(--color-bg);border-top:1px solid var(--color-divider);padding-block:var(--space-12) var(--space-8)}
.footer__top{display:flex;justify-content:space-between;gap:var(--space-8);flex-wrap:wrap;padding-bottom:var(--space-8);border-bottom:1px solid var(--color-divider)}
.footer__brand{max-width:34ch}
.footer__brand p{font-size:var(--text-sm);color:var(--color-text-muted);margin-top:var(--space-4)}
.footer__cols{display:flex;gap:var(--space-16);flex-wrap:wrap}
.footer__col h4{font-size:var(--text-xs);letter-spacing:.12em;text-transform:uppercase;color:var(--color-text-faint);margin-bottom:var(--space-4)}
.footer__col ul{list-style:none;display:flex;flex-direction:column;gap:var(--space-2)}
.footer__col a{text-decoration:none;color:var(--color-text-muted);font-size:var(--text-sm)}
.footer__col a:hover{color:var(--color-primary)}
.footer__bottom{display:flex;justify-content:space-between;gap:var(--space-4);flex-wrap:wrap;padding-top:var(--space-6);font-size:var(--text-xs);color:var(--color-text-faint)}

/* ============================================================
   Scroll reveal (opacity + clip only — no CLS)
   ============================================================ */
.reveal{opacity:1}
@supports (animation-timeline:view()){
  @media (prefers-reduced-motion:no-preference){
    .reveal{opacity:0;animation:reveal-fade linear both;animation-timeline:view();animation-range:entry 0% entry 42%}
  }
}
@keyframes reveal-fade{to{opacity:1}}

/* ============================================================
   Responsive
   ============================================================ */
@media (max-width:960px){
  .nav__links{display:none}
  .header .btn--primary{display:none}
  .menu-toggle{display:inline-grid}
  .hero__grid{grid-template-columns:1fr;gap:var(--space-12)}
  .hero__panel{max-width:420px;order:-1}
  .intro__grid,.why__grid,.about__grid,.contact__grid,.model__split{grid-template-columns:1fr}
  .why__points{grid-template-columns:1fr}
  .services__grid{grid-template-columns:1fr}
  .svc-card:nth-child(1),.svc-card:nth-child(2),.svc-card:nth-child(3){grid-column:auto}
  .svc-card:nth-child(3){flex-direction:column;align-items:flex-start;gap:var(--space-4)}
  .engage__grid{grid-template-columns:1fr}
  .about__stats{grid-template-columns:1fr 1fr}
}
@media (max-width:560px){
  .form__row{grid-template-columns:1fr}
  .hero__proof{gap:var(--space-5) var(--space-6)}
  .model__cols{grid-template-columns:1fr}
  .footer__top{flex-direction:column}
  .hero__panel{max-width:300px}
  .orbit-card{font-size:var(--text-xs);padding:var(--space-3) var(--space-4)}
  .orbit-card--tl{left:-2%}
  .orbit-card--ml{right:-2%;left:auto}
  .orbit-card--br{right:-2%}
  .brand__mark{height:30px;width:30px}
  .brand__name{font-size:.95rem}
}