/* ============ TOKENS ============ */
:root {
  /* Brand family palette */
  --navy-950:#061528; --navy-900:#0B2545; --navy-800:#13315C; --navy-700:#1D4276;
  --navy-600:#2A568F; --navy-500:#3A6EA5; --navy-400:#6189B5; --navy-300:#8DA9C4;
  --navy-200:#B9CADC; --navy-100:#DCE5EE; --navy-50:#F4F6F9;
  /* WorkVault sibling accent: amber */
  --violet:#E8A33D; --violet-600:#C9851F; --violet-700:#B9761A; --violet-300:#F0BC6E; --violet-100:#FCEDD4;
  --accent-ink:#3A2708;
  --slate-600:#475569; --slate-500:#64748B; --slate-400:#94A3B8; --slate-300:#CBD5E1; --slate-200:#E4E8EE;

  /* Type scale */
  --text-xs: clamp(0.75rem,0.7rem + 0.25vw,0.875rem);
  --text-sm: clamp(0.875rem,0.8rem + 0.35vw,1rem);
  --text-base: clamp(1rem,0.95rem + 0.25vw,1.125rem);
  --text-lg: clamp(1.125rem,1rem + 0.75vw,1.5rem);
  --text-xl: clamp(1.5rem,1.2rem + 1.25vw,2.25rem);
  --text-2xl: clamp(2rem,1.2rem + 2.5vw,3.5rem);
  --text-3xl: clamp(2.5rem,1rem + 4vw,4.75rem);

  /* Spacing */
  --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;

  --radius-md:.5rem; --radius-lg:.85rem; --radius-xl:1.25rem; --radius-full:9999px;
  --font-display:'IBM Plex Sans','Segoe UI',sans-serif;
  --font-body:'Inter',-apple-system,sans-serif;
  --font-mono:'IBM Plex Mono',monospace;
  --transition:200ms cubic-bezier(.16,1,.3,1);
  --content:1200px;
}

/* Dark (default) */
[data-theme="dark"] {
  --bg:var(--navy-950); --bg-2:#08182b; --surface:#0F2947; --surface-2:#13315C;
  --border:rgba(137,169,196,.16); --border-strong:rgba(137,169,196,.28);
  --text:#EAF1F8; --text-muted:#9FB4CC; --text-faint:#6C82A0;
  --header-bg:rgba(6,21,40,.72);
}
/* Light */
[data-theme="light"] {
  --bg:var(--navy-50); --bg-2:#fff; --surface:#fff; --surface-2:#fff;
  --border:var(--slate-200); --border-strong:var(--slate-300);
  --text:var(--navy-900); --text-muted:var(--slate-600); --text-faint:var(--slate-400);
  --header-bg:rgba(244,246,249,.82);
}

/* ============ BASE ============ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;scroll-behavior:smooth;scroll-padding-top:5rem;}
body{min-height:100dvh;line-height:1.6;font-family:var(--font-body);font-size:var(--text-base);color:var(--text);background:var(--bg);transition:background var(--transition),color var(--transition);overflow-x:hidden;}
img,svg{display:block;max-width:100%;height:auto;}
a{color:inherit;text-decoration:none;}
h1,h2,h3{font-family:var(--font-display);line-height:1.1;text-wrap:balance;letter-spacing:-.02em;}
p{text-wrap:pretty;max-width:60ch;}
ul[role=list]{list-style:none;}
:focus-visible{outline:2px solid var(--violet);outline-offset:3px;border-radius:var(--radius-md);}
::selection{background:rgba(232,163,61,.35);}
.wrap{max-width:var(--content);margin-inline:auto;padding-inline:clamp(1.25rem,4vw,3rem);}

/* ============ BUTTONS ============ */
.btn{display:inline-flex;align-items:center;gap:.5rem;font-family:var(--font-body);font-weight:600;font-size:var(--text-sm);border-radius:var(--radius-md);padding:.65rem 1.25rem;border:1.5px solid transparent;transition:transform var(--transition),background var(--transition),border-color var(--transition),box-shadow var(--transition);white-space:nowrap;}
.btn-lg{padding:.85rem 1.6rem;font-size:var(--text-base);}
.btn-accent{background:var(--violet);color:var(--accent-ink);box-shadow:0 6px 20px rgba(232,163,61,.35);}
.btn-accent:hover{background:var(--violet-600);color:#fff;transform:translateY(-2px);box-shadow:0 10px 28px rgba(232,163,61,.45);}
.btn-ghost{background:transparent;color:var(--text);border-color:var(--border-strong);}
.btn-ghost:hover{border-color:var(--violet);color:var(--violet);transform:translateY(-2px);}
.icon-btn{display:grid;place-items:center;width:40px;height:40px;border-radius:var(--radius-md);color:var(--text-muted);border:1.5px solid var(--border);background:transparent;}
.icon-btn:hover{color:var(--violet);border-color:var(--violet);}

/* ============ HEADER ============ */
.site-header{position:sticky;top:0;z-index:50;background:var(--header-bg);backdrop-filter:blur(14px);border-bottom:1px solid var(--border);transition:background var(--transition),border-color var(--transition);}
.header-inner{display:flex;align-items:center;gap:var(--space-8);padding-block:.85rem;}
.brand{display:flex;align-items:center;gap:.7rem;color:var(--text);flex:none;}
.brand-mark{width:38px;height:38px;color:var(--text);flex:none;}
.brand-text{display:flex;flex-direction:column;line-height:1;}
.brand-name{font-family:var(--font-display);font-weight:700;font-size:1.15rem;letter-spacing:-.01em;}
.brand-sub{font-family:var(--font-mono);font-size:.6rem;letter-spacing:.34em;color:var(--text-faint);margin-top:3px;}
.nav{display:flex;gap:var(--space-6);margin-left:auto;font-family:var(--font-body);font-size:var(--text-sm);font-weight:500;}
.nav a{color:var(--text-muted);position:relative;padding-block:.3rem;}
.nav a:hover{color:var(--text);}
.nav a::after{content:"";position:absolute;left:0;bottom:0;width:0;height:2px;background:var(--violet);transition:width var(--transition);}
.nav a:hover::after{width:100%;}
.header-actions{display:flex;align-items:center;gap:var(--space-3);}

/* ============ HERO ============ */
.hero{position:relative;padding-block:clamp(3rem,7vw,6rem) clamp(4rem,9vw,7rem);overflow:hidden;}
.hero::before{content:"";position:absolute;inset:0;background:radial-gradient(1000px 600px at 78% 40%,rgba(232,163,61,.18),transparent 60%);pointer-events:none;}
[data-theme="light"] .hero::before{background:radial-gradient(1000px 600px at 78% 40%,rgba(232,163,61,.12),transparent 60%);}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2rem,4vw,4rem);align-items:center;position:relative;}
.eyebrow{font-family:var(--font-mono);font-size:var(--text-xs);font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--violet-300);margin-bottom:var(--space-5);}
[data-theme="light"] .eyebrow{color:var(--violet-700);}
.hero h1{font-size:var(--text-3xl);font-weight:700;}
.hero h1 .accent{color:var(--violet);}
[data-theme="light"] .hero h1 .accent{color:var(--violet-700);}
.rule{display:block;width:64px;height:4px;border-radius:9999px;background:var(--violet);margin:var(--space-6) 0;}
.lede{font-size:var(--text-lg);color:var(--text-muted);max-width:34ch;}
.hero-cta{display:flex;flex-wrap:wrap;gap:var(--space-4);margin-top:var(--space-8);}
.trust-row{display:flex;gap:var(--space-8);margin-top:var(--space-12);flex-wrap:wrap;}
.trust-row li{display:flex;flex-direction:column;}
.trust-row strong{font-family:var(--font-display);font-size:var(--text-lg);font-weight:700;}
.trust-row span{font-size:var(--text-xs);color:var(--text-faint);letter-spacing:.04em;}
.hero-visual{position:relative;}
.hero-visual img{border-radius:var(--radius-xl);width:100%;filter:drop-shadow(0 30px 60px rgba(0,0,0,.5));}
[data-theme="light"] .hero-visual img{filter:drop-shadow(0 24px 48px rgba(11,37,69,.28));}

/* ============ SECTIONS ============ */
.section{padding-block:clamp(3.5rem,8vw,7rem);}
.section-alt{background:var(--bg-2);border-block:1px solid var(--border);}
.sec-num{font-family:var(--font-mono);font-size:var(--text-xs);font-weight:500;letter-spacing:.14em;color:var(--violet-300);margin-bottom:var(--space-3);}
[data-theme="light"] .sec-num{color:var(--violet-700);}
.section-head{max-width:640px;margin-bottom:var(--space-16);}
.section-head h2,.split-copy h2,.about-band h2,.contact-inner h2{font-size:var(--text-2xl);font-weight:700;margin-bottom:var(--space-4);}
.sec-intro{font-size:var(--text-lg);color:var(--text-muted);}

/* Cards */
.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:var(--space-6);}
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-8);transition:transform var(--transition),border-color var(--transition),box-shadow var(--transition);}
.card:hover{transform:translateY(-4px);border-color:var(--violet);box-shadow:0 16px 40px rgba(232,163,61,.16);}
.card-icon{display:grid;place-items:center;width:48px;height:48px;border-radius:var(--radius-md);background:rgba(232,163,61,.16);color:var(--violet-700);margin-bottom:var(--space-5);}
[data-theme="dark"] .card-icon{color:var(--violet-300);}
.card-icon svg{width:26px;height:26px;}
.card h3{font-size:var(--text-lg);font-weight:600;margin-bottom:var(--space-3);}
.card p{color:var(--text-muted);font-size:var(--text-sm);}

/* Split */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,5rem);align-items:center;}
.split-copy p{color:var(--text-muted);margin-bottom:var(--space-6);}
.check-list{display:grid;gap:var(--space-3);margin-bottom:var(--space-8);}
.check-list li{position:relative;padding-left:var(--space-8);color:var(--text);font-size:var(--text-base);}
.check-list li::before{content:"";position:absolute;left:0;top:.35em;width:18px;height:18px;border-radius:9999px;background:var(--violet);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/12px no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/12px no-repeat;}
.split-panel{background:linear-gradient(150deg,var(--surface),var(--surface-2));border:1px solid var(--border);border-radius:var(--radius-xl);padding:var(--space-8);}
.stat-block{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-6);}
.stat{padding:var(--space-5);border-radius:var(--radius-lg);background:rgba(232,163,61,.08);border:1px solid var(--border);}
.stat strong{display:block;font-family:var(--font-display);font-size:var(--text-2xl);font-weight:700;color:var(--violet);line-height:1;}
[data-theme="light"] .stat strong{color:var(--violet-700);}
.stat strong span{font-size:1rem;margin-left:2px;}
.stat-label{font-size:var(--text-xs);color:var(--text-muted);display:block;margin-top:var(--space-3);}

/* About */
.about-band{background:linear-gradient(135deg,var(--navy-800),var(--navy-900));border-radius:var(--radius-xl);padding:clamp(2.5rem,5vw,4rem);color:#EAF1F8;}
.about-band .sec-num{color:var(--violet-300);}
.about-band h2{color:#fff;}
.about-band .sec-intro{color:var(--navy-200);}

/* Contact */
.section-contact{text-align:center;}
.contact-inner{max-width:640px;margin-inline:auto;}
.contact-inner p{color:var(--text-muted);margin:var(--space-4) auto var(--space-8);}
.contact-form{display:flex;gap:var(--space-3);flex-wrap:wrap;justify-content:center;}
.contact-form input{flex:1 1 260px;max-width:340px;padding:.85rem 1.1rem;border-radius:var(--radius-md);border:1.5px solid var(--border-strong);background:var(--surface);color:var(--text);font-size:var(--text-base);}
.contact-form input:focus-visible{border-color:var(--violet);outline:none;}
.form-note{color:var(--violet-300);font-weight:600;margin-top:var(--space-5);}
[data-theme="light"] .form-note{color:var(--violet-700);}

/* ============ FOOTER ============ */
.site-footer{border-top:1px solid var(--border);padding-block:var(--space-12);}
.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:var(--space-6);flex-wrap:wrap;}
.footer-brand{display:flex;align-items:center;gap:.7rem;color:var(--text);}
.footer-brand .brand-mark{width:34px;height:34px;}
.footer-meta{font-size:var(--text-xs);color:var(--text-faint);text-align:right;line-height:1.7;}

/* ============ REVEAL ANIMATION ============ */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1);}
.reveal.in{opacity:1;transform:none;}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none;}html{scroll-behavior:auto;}}

/* ============ RESPONSIVE ============ */
@media (max-width:900px){
  .hero-grid{grid-template-columns:1fr;}
  .hero-visual{order:-1;}
  .split{grid-template-columns:1fr;}
  .nav{display:none;}
}
@media (max-width:560px){
  .stat-block{grid-template-columns:1fr;}
  .trust-row{gap:var(--space-6);}
  .footer-inner{flex-direction:column;align-items:flex-start;}
  .footer-meta{text-align:left;}
  .brand-sub{display:none;}
}
