/* ===========================================================
   She Leads AI — FY2027 site system
   One stylesheet for the whole page family. Edit here, the
   family updates. Locked 2026-05-29.
   =========================================================== */

:root{
  /* Ink family — the one dark, blue-black, three values */
  --ink:#1A1A2E;        /* the deep field */
  --ink-2:#26263F;      /* the lift, one step up */
  --ink-3:#363654;      /* a second, lighter step */
  --ink-foot:#141422;   /* deepest, footers */

  /* Coral */
  --coral:#FB746C;       /* surfaces, emphasis */
  --coral-deep:#EF5B54;  /* the one action, all buttons */

  /* Neutrals + accent */
  --cream:#F7F7F4;
  --white:#FFFFFF;
  --gold:#F2C14E;        /* hairlines, AI Academy sub-brand */

  /* hairlines + tints, ink-based */
  --ink-08:rgba(26,26,46,.08);
  --ink-12:rgba(26,26,46,.12);
  --ink-50:rgba(26,26,46,.5);
  --cream-55:rgba(247,247,244,.55);
  --cream-82:rgba(247,247,244,.82);

  --display:'League Spartan',sans-serif;
  --body:'Montserrat',sans-serif;
  --didone:'Bodoni Moda',serif;

  --r-sm:2px; --r-md:6px; --r-lg:8px;
  --s1:0 2px 8px rgba(26,26,46,.08);
  --s2:0 14px 36px rgba(26,26,46,.16);
  --s-dark:0 16px 44px rgba(0,0,0,.34);
  --ease:cubic-bezier(.2,.6,.2,1);
  --maxw:1200px;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{font-family:var(--body);background:var(--cream);color:var(--ink);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;}
img{max-width:100%;display:block;}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 40px;}

/* ---- type ---- */
.display{font-family:var(--display);font-weight:500;letter-spacing:-.015em;line-height:1.04;}
.hero-h{font-family:var(--display);font-weight:500;font-size:clamp(44px,6vw,82px);line-height:1.02;letter-spacing:-.02em;}
.hero-h em,.display em{font-family:var(--didone);font-style:italic;font-weight:400;}
h1,h2,h3{font-family:var(--display);font-weight:500;letter-spacing:-.01em;line-height:1.08;}
h2{font-size:clamp(30px,4vw,48px);}
h3{font-size:21px;}
.gold-rule{width:54px;height:2px;background:var(--gold);}
.gold-rule.center{margin-left:auto;margin-right:auto;}
.kicker{font-family:var(--didone);font-style:italic;font-weight:400;font-size:19px;color:var(--coral-deep);}
.lede{font-size:19px;line-height:1.6;}
em.accent{font-family:var(--didone);font-style:italic;font-weight:700;color:var(--coral);}

/* ---- wordmark — the org name set as TYPE (not the SVG logo) ----
   LOCKED 2026-05-31. Usage: <span class="wm wm--coral">She Leads <span class="l">AI</span></span>
   "AI" carries the Bodoni italic in coral; "She Leads" stays League Spartan.
   On an ink field She/Leads reverse to cream and AI stays coral.
   The coral AI is the one named exception to script-always-ink (wordmark only).
   Modifiers: .wm--coral (coral AI) · .wm--hair (gold hairline under). */
.wm{font-family:var(--display);font-weight:600;letter-spacing:-.02em;white-space:nowrap;}
.wm .l{font-family:var(--didone);font-style:italic;font-weight:700;letter-spacing:0;padding:0 .02em;}
.wm--coral .l{color:var(--coral-deep);}
.wm--hair{display:inline-flex;flex-direction:column;}
.wm--hair::after{content:"";display:block;height:1px;background:var(--gold);margin-top:.1em;width:100%;}
.ink .wm{color:var(--cream);}
.ink .wm--coral .l{color:var(--coral);}

/* ---- buttons — Direction B, restrained. LOCKED 2026-05-31 ----
   Solid deep-coral is the ONLY button. Secondary actions are text links.
   On dark fields the cream button (.btn--cream) is allowed. Ghost/outline killed. */
.btn{display:inline-flex;align-items:center;gap:8px;font-family:var(--display);font-weight:500;font-size:12px;letter-spacing:.2em;text-transform:uppercase;text-decoration:none;padding:15px 32px;border-radius:var(--r-sm);border:1px solid transparent;cursor:pointer;transition:box-shadow .2s var(--ease),background .2s var(--ease);}
.btn--solid{background:var(--coral-deep);color:var(--cream);box-shadow:0 1px 2px rgba(26,26,46,.12);}
.btn--solid:hover{box-shadow:0 10px 26px rgba(26,26,46,.20);}
.btn--cream{background:var(--cream);color:var(--ink);}  /* dark fields only */
.btn--cream:hover{box-shadow:0 10px 26px rgba(0,0,0,.28);}
.btn-row{display:flex;gap:16px;align-items:center;flex-wrap:wrap;}
.textlink{font-family:var(--didone);font-style:italic;font-size:18px;color:var(--coral-deep);text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:2px;}
.ink .textlink,.gather.ink .textlink{color:var(--cream);}  /* secondary link on dark */

/* ---- announcement bar — top slot, above nav. Swap copy or delete the block to hide. ---- */
.announce{background:var(--coral-deep);color:var(--cream);font-family:var(--body);font-size:14px;}
.announce-in{display:flex;align-items:center;justify-content:center;gap:14px;min-height:46px;padding:8px 40px;text-align:center;flex-wrap:wrap;}
.announce a{color:var(--cream);font-weight:600;text-decoration:none;border-bottom:1px solid var(--cream-55);padding-bottom:1px;white-space:nowrap;}
.announce a:hover{border-bottom-color:var(--cream);}

/* ---- nav ---- */
.nav{position:sticky;top:0;z-index:50;background:rgba(247,247,244,.88);backdrop-filter:blur(8px);border-bottom:1px solid var(--ink-12);}
.nav .wrap{display:flex;align-items:center;height:78px;gap:30px;}
.nav .logo{font-family:var(--display);font-weight:700;font-size:19px;color:var(--ink);letter-spacing:.005em;text-decoration:none;}
.nav .links{margin-left:auto;display:flex;gap:30px;align-items:center;}
.nav .links a:not(.btn){font-family:var(--body);font-weight:500;font-size:14.5px;color:var(--ink);text-decoration:none;}
.nav .links a:not(.btn):hover{color:var(--coral-deep);}
.nav .btn{padding:11px 22px;font-size:11px;}

/* ---- sections ---- */
section{padding:96px 0;}
.section-head{max-width:720px;margin-bottom:48px;}
.section-head .kicker{display:block;margin-bottom:10px;}

/* dark section (Ink) */
.ink{background:var(--ink);color:var(--cream);}
.ink h1,.ink h2,.ink h3{color:var(--cream);}
.ink .lede,.ink p{color:var(--cream-82);}

/* ---- hero ---- */
.hero{padding:120px 0 104px;}
.hero .gold-rule{margin-bottom:32px;}
.hero .hero-h{max-width:15ch;color:var(--ink);}
.hero .lede{margin:28px 0 40px;max-width:52ch;color:var(--ink);}
/* premium register — class="hero ink": reverse the hero type to cream so it reads on the dark field.
   Needed because .hero .hero-h / .hero .lede above out-specify .ink h1 / .ink .lede. Added 2026-05-31. */
.hero.ink .hero-h,.hero.ink .lede{color:var(--cream);}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center;}
.illu-slot{aspect-ratio:4/5;border-radius:var(--r-lg);background:var(--ink-08);border:1px dashed var(--ink-12);display:flex;align-items:center;justify-content:center;text-align:center;font-family:var(--didone);font-style:italic;font-size:16px;color:#8a857c;padding:24px;}

/* ---- program cards ---- */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.card{background:var(--white);border:1px solid var(--ink-12);border-radius:var(--r-lg);padding:32px 30px;box-shadow:var(--s1);transition:box-shadow .2s var(--ease),transform .2s var(--ease);display:flex;flex-direction:column;}
.card:hover{box-shadow:var(--s2);transform:translateY(-4px);}
.card .nm{font-family:var(--didone);font-style:italic;font-weight:700;font-size:18px;color:var(--coral-deep);margin-bottom:10px;}
.card h3{margin-bottom:10px;color:var(--ink);}
.card p{font-size:15px;line-height:1.6;color:var(--ink);flex:1;}
.card .more{margin-top:18px;font-family:var(--display);font-weight:500;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--coral-deep);text-decoration:none;}
.card.gold{background:var(--gold);border-color:transparent;}
.card.gold .nm,.card.gold h3,.card.gold p{color:var(--ink);}
.card.gold .more{color:var(--ink);}

/* ---- lift (on ink) ---- */
.lift{background:var(--ink-2);border-top:2px solid var(--gold);border-radius:var(--r-md);padding:30px 32px;box-shadow:var(--s-dark);}
.lift .q{font-family:var(--didone);font-style:italic;font-size:22px;line-height:1.34;color:var(--cream);}

/* ---- testimonial ---- */
.quote{font-family:var(--didone);font-style:italic;font-weight:400;font-size:clamp(26px,3.2vw,38px);line-height:1.34;max-width:24ch;border-left:3px solid var(--coral);padding-left:30px;}
.quote .who{display:block;margin-top:22px;font-family:var(--body);font-style:normal;font-weight:600;font-size:15px;}
.ink .quote{color:var(--cream);} .ink .quote .who{color:var(--cream-55);}

/* ---- stat strip ---- */
.stats{display:grid;grid-template-columns:repeat(4,1fr);}
.stat{padding:18px 24px;text-align:center;border-right:1px solid rgba(247,247,244,.1);}
.stat:last-child{border-right:none;}
.stat .big{font-family:var(--didone);font-style:italic;font-weight:700;font-size:clamp(40px,5vw,56px);line-height:1;color:var(--gold);}
.stat .lbl{font-family:var(--body);font-weight:500;font-size:14px;color:var(--cream-82);margin-top:14px;}

/* ---- closing CTA ---- */
.gather{text-align:center;}
.gather .gold-rule{margin:0 auto 28px;}
.gather h2{max-width:18ch;margin:0 auto 34px;}

/* ---- footer ---- */
.footer{background:var(--ink-foot);color:var(--cream);padding:54px 0 46px;}
.footer .wrap{display:flex;gap:20px;flex-wrap:wrap;align-items:center;}
.footer .logo{font-family:var(--display);font-weight:700;font-size:17px;color:var(--cream);}
.footer .wm{color:var(--cream);} .footer .wm--coral .l{color:var(--coral);}
.footer .cr{font-family:var(--body);font-size:13px;color:var(--cream-55);}
.footer a{color:var(--gold);text-decoration:none;}
.footer .right{margin-left:auto;font-family:var(--didone);font-style:italic;font-size:14px;color:var(--cream-55);}

/* ---- a11y + motion ---- */
a:focus-visible,.btn:focus-visible{outline:2px solid var(--gold);outline-offset:2px;box-shadow:0 0 0 4px rgba(26,26,46,.35);}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important;}}

/* ---- responsive ---- */
@media(max-width:900px){
  .hero-grid{grid-template-columns:1fr;gap:36px;}
  .illu-slot{aspect-ratio:16/10;}
  .cards{grid-template-columns:1fr;}
  .stats{grid-template-columns:repeat(2,1fr);}
  .stat:nth-child(2){border-right:none;}
  .nav .links a:not(.btn){display:none;}
  section{padding:68px 0;}
  .wrap{padding:0 24px;}
}
