/* GreenSpace Wellness · coming soon
   Built on the GreenSpace Herbs brand system v2.0 (brand-kit/03-color/tokens.css).
   Only brand tokens are used; deviations are marked "DEVIATION" with the reason. */

/* ─── Fonts (self-hosted) ─────────────────────────────────────────────── */
/* ⚠️ Neuhade licence is unverified (brand kit §3.6). Confirm a web licence from
   Sron Studio before launch, or swap --gsh-font-display to a licensed face. */
@font-face{font-family:'Neuhade';src:url('../fonts/neuhade-light.woff2') format('woff2');font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:'Poppins';src:url('../fonts/poppins-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Poppins';src:url('../fonts/poppins-500.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Poppins';src:url('../fonts/poppins-600.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'IBM Plex Mono';src:url('../fonts/ibm-plex-mono-500.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}

/* ─── Brand tokens (subset of tokens.css v2.0) ────────────────────────── */
:root{
  --gsh-forest:#0b3d24; --gsh-forest-deep:#072a18; --gsh-forest-soft:#1f6b45;
  --gsh-gold:#c2912f; --gsh-gold-bright:#d9a23c; --gsh-gold-soft:#e3bf70;
  --gsh-cream:#fbf5ea; --gsh-cream-2:#f6ecda; --gsh-cream-3:#fffaf0; --gsh-paper:#fffdf8;
  --gsh-ink:#21342a; --gsh-muted:#6a7670;
  --gsh-gold-text:#8a6a24;
  /* DEVIATION: 11px mono labels sit on the warmer mid-ground where #8a6a24 measures 4.38:1.
     One step darker in the same hue keeps them above WCAG AA 4.5:1. */
  --gsw-label:#7a5d1e; --gsh-prose-2:#4a5a50; --gsh-lead:#3c4a40; --gsh-on-forest:#fdfaf3;
  --gsh-error:#8a3218;

  --gsh-font-display:'Neuhade','Segoe UI',system-ui,-apple-system,sans-serif;
  --gsh-font-body:'Poppins',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --gsh-font-mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace;

  --gsh-line:rgba(194,145,47,.30); --gsh-line-soft:rgba(194,145,47,.18); --gsh-line-field:rgba(201,151,57,.34);
  --gsh-control-rest:0 9px 20px rgba(18,32,22,.15),0 2px 5px rgba(18,32,22,.07);
  --gsh-control-hover:0 15px 30px rgba(18,32,22,.2),0 3px 8px rgba(18,32,22,.09);
  --gsh-float-rest:0 14px 28px rgba(18,32,22,.16),0 3px 8px rgba(18,32,22,.08);
  --gsh-shadow-lg:0 40px 100px rgba(20,30,18,.16);
  --gsh-grad-green-pill:linear-gradient(115deg,#155c36,#0a3a20 55%,#062315);
  --gsh-grad-gold-rule:linear-gradient(90deg,#e3b969,#a8761f);
  --gsh-grad-page-ground:radial-gradient(circle at 82% 6%,rgba(194,145,47,.10),transparent 30%),radial-gradient(circle at 6% 78%,rgba(31,107,69,.06),transparent 34%),linear-gradient(180deg,#fffaf0 0%,#f7eedf 50%,#fffaf0 100%);

  --gsh-ease-brand:cubic-bezier(.2,.7,.3,1); --gsh-ease-reveal:cubic-bezier(.22,.61,.36,1);
  --gsh-ease-slide:cubic-bezier(.25,.6,.3,1); --gsh-ease-enter:cubic-bezier(.16,.84,.32,1);
}

/* ─── Base ─────────────────────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;min-height:100vh;min-height:100svh;background:var(--gsh-grad-page-ground);background-color:var(--gsh-cream-3);color:var(--gsh-ink);font:400 16px/1.62 var(--gsh-font-body);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
img,svg{display:block;max-width:100%}
a{color:inherit}
:focus-visible{outline:2px solid var(--gsh-gold);outline-offset:3px}
.visually-hidden{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
[hidden]{display:none!important}

/* ─── Frame ────────────────────────────────────────────────────────────── */
.wrap{width:min(1200px,calc(100% - 56px));margin:0 auto}
.page{min-height:100vh;min-height:100svh;display:grid;grid-template-rows:auto 1fr auto;grid-template-columns:minmax(0,1fr)}
.hero .wrap>*{min-width:0}

/* ─── Header · interim lockup ──────────────────────────────────────────── */
/* Follows the brand dual-lockup pattern (mark │ gold divider │ sub-brand).
   Interim until a GreenSpace Wellness mark exists. */
.site-header{padding:30px 0 0}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px}
.lockup{display:flex;align-items:center;gap:14px;min-height:48px;text-decoration:none;color:var(--gsh-forest-deep)}
.lockup img{height:50px;width:auto}
.lockup-divider{width:1px;height:34px;background:linear-gradient(180deg,rgba(194,145,47,0),var(--gsh-gold) 30%,var(--gsh-gold) 70%,rgba(194,145,47,0))}
.lockup-name{font:300 26px/1 var(--gsh-font-display);letter-spacing:-.005em;transform:translateY(-1px)}
.status{display:inline-flex;align-items:center;gap:10px;margin:0;font:500 11px/1 var(--gsh-font-mono);letter-spacing:.22em;text-transform:uppercase;color:var(--gsw-label)}
.pulse{position:relative;width:7px;height:7px;border-radius:50%;background:var(--gsh-gold)}
.pulse::after{content:"";position:absolute;inset:-5px;border-radius:50%;border:1px solid var(--gsh-gold);opacity:0}

/* ─── Hero ─────────────────────────────────────────────────────────────── */
.hero{display:flex;align-items:center;padding:56px 0 64px}
.hero .wrap{display:grid;grid-template-columns:1.04fr .96fr;align-items:center;gap:56px}
.kicker{display:flex;align-items:center;gap:14px;margin:0 0 26px;font:500 11px/1 var(--gsh-font-mono);letter-spacing:.26em;text-transform:uppercase;color:var(--gsw-label)}
.kicker::before{content:"";width:36px;height:1px;background:var(--gsh-grad-gold-rule)}
/* DEVIATION: hero-h1 token caps at 46px (built for dense B2B pages). A single-statement
   launch page needs the h2 register pushed further; weight, tracking and case follow the system. */
h1{margin:0;max-width:14ch;font:300 clamp(46px,5.9vw,80px)/1.02 var(--gsh-font-display);letter-spacing:-.018em;color:var(--gsh-forest-deep);text-wrap:balance}
.hero h1 .line{white-space:nowrap}
@media (max-width:400px){.hero h1 .line{white-space:normal}}
.lead{margin:28px 0 0;max-width:44ch;font-size:17px;line-height:1.78;color:var(--gsh-lead);text-wrap:pretty}

/* ─── Waitlist form ────────────────────────────────────────────────────── */
.waitlist{margin-top:40px;max-width:520px}
.field-row{display:flex;align-items:center;gap:6px;padding:6px;background:var(--gsh-paper);border:1px solid var(--gsh-line-field);border-radius:999px;box-shadow:0 14px 34px rgba(34,25,10,.06);transition:border-color .22s var(--gsh-ease-brand),box-shadow .22s var(--gsh-ease-brand)}
.field-row:focus-within{border-color:var(--gsh-gold);box-shadow:0 0 0 4px rgba(194,145,47,.13),0 14px 34px rgba(34,25,10,.06)}
.field-row input[type=email]{flex:1;min-width:0;height:48px;padding:0 8px 0 20px;border:0;background:transparent;color:var(--gsh-ink);font:400 15px/1 var(--gsh-font-body);border-radius:999px}
.field-row input[type=email]::placeholder{color:#5f6b64}
.field-row input[type=email]:focus{outline:none}
.hp{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}

/* Button v3 · btn-green. Submit carries no arrow badge (brand §7.6). */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 26px;border:0;border-radius:999px;cursor:pointer;white-space:nowrap;font:600 13.5px/1 var(--gsh-font-body);letter-spacing:.01em;text-decoration:none;background-size:165% 100%;background-position:0% 50%;box-shadow:var(--gsh-control-rest);transition:transform .26s var(--gsh-ease-brand),box-shadow .26s var(--gsh-ease-brand),background-position .5s var(--gsh-ease-slide),opacity .18s}
.btn-green{background-image:var(--gsh-grad-green-pill);color:var(--gsh-on-forest)}
.btn:hover{transform:translateY(-2px);background-position:98% 50%;box-shadow:var(--gsh-control-hover)}
.btn:active{transform:translateY(-1px);box-shadow:var(--gsh-control-rest)}
.btn:disabled{opacity:.4;cursor:not-allowed;transform:none}
[aria-busy="true"] .btn:disabled{opacity:.86;cursor:progress}
.btn .spinner{width:14px;height:14px;border-radius:50%;border:1.5px solid rgba(253,250,243,.35);border-top-color:var(--gsh-on-forest);animation:spin .8s linear infinite}

.form-note{text-wrap:pretty;display:flex;align-items:flex-start;gap:10px;margin:16px 0 0 22px;font-size:13px;line-height:1.55;color:var(--gsh-prose-2)}
.form-note svg{flex:none;margin-top:2px;width:16px;height:16px;fill:none;stroke:var(--gsh-forest-soft);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.form-msg{margin:14px 0 0 22px;font-size:14px;line-height:1.5}
.form-msg.is-error{color:var(--gsh-error)}
.form-msg.is-info{color:var(--gsh-gold-text)}

.success{display:flex;gap:18px;align-items:flex-start;padding:22px 0 0;border-top:1px solid var(--gsh-line)}
.success-mark{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,#124f2e,#072a18);box-shadow:var(--gsh-control-rest)}
.success-mark svg{width:20px;height:20px;fill:none;stroke:var(--gsh-on-forest);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.success .success-title{margin:2px 0 6px;font:300 30px/1.1 var(--gsh-font-display);letter-spacing:-.005em;color:var(--gsh-forest-deep)}
.success p{margin:0;color:var(--gsh-prose-2);font-size:15px}
.success:focus{outline:none}

/* ─── Specimen illustration ────────────────────────────────────────────── */
.art{position:relative;justify-self:end;width:min(100%,520px)}
.specimen{width:100%;height:auto;overflow:visible}
.specimen .orb{fill:url(#orb);stroke:var(--gsh-line);stroke-width:1}
.specimen .ring{fill:none;stroke-width:1}
.specimen .ring-outer{stroke:rgba(194,145,47,.26)}
.specimen .ring-inner{stroke:rgba(194,145,47,.24);stroke-dasharray:1.5 7}
.specimen .comet{fill:var(--gsh-gold)}
.specimen .orbit{transform-box:view-box;transform-origin:260px 260px}
.specimen .soil{fill:none;stroke:url(#rule);stroke-width:1.5;stroke-linecap:round}
.specimen .soil-wash{fill:rgba(194,145,47,.06)}
.specimen .draw{fill:none;stroke:var(--gsh-forest-deep);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.specimen .stem{stroke-width:2.2}
.specimen .vein{stroke-width:1.1;stroke:var(--gsh-forest)}
.specimen .vein.fine{stroke-width:.9;opacity:.7}
.specimen .root{stroke:var(--gsh-forest-soft);stroke-width:1.4;opacity:.85}
.specimen .root.fine{stroke-width:1;opacity:.6}
.specimen .leaf-fill{fill:rgba(130,160,83,.16)}
.specimen .leaf-1 .leaf-fill,.specimen .leaf-3 .leaf-fill{fill:rgba(130,160,83,.24)}
.specimen .bud{fill:var(--gsh-gold)}
.specimen .bud-halo{fill:none;stroke:var(--gsh-gold);stroke-width:1;opacity:.5}
.specimen .plant,.specimen .leaf{transform-box:view-box}
.specimen .plant{transform-origin:260px 392px}
.specimen .leaf-0{transform-origin:262px 338px}
.specimen .leaf-1{transform-origin:259px 282px}
.specimen .leaf-2{transform-origin:258px 218px}
.specimen .leaf-3{transform-origin:261px 164px}
.specimen .leaf-4{transform-origin:263px 160px}
/* neutral ground shadow — never tinted (brand §6.1) */
.art::after{content:"";position:absolute;left:24%;right:24%;bottom:-6%;height:26px;border-radius:50%;background:radial-gradient(closest-side,rgba(20,30,18,.14),transparent);filter:blur(2px)}

/* ─── Footer ───────────────────────────────────────────────────────────── */
.site-footer .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px 32px;flex-wrap:wrap;padding:22px 0 28px;border-top:1px solid var(--gsh-line-soft);font-size:13px;color:var(--gsh-prose-2)}
.site-footer p{margin:0}
.site-footer a{display:inline-flex;align-items:center;gap:6px;min-height:44px;text-decoration:none;color:var(--gsh-forest);font-weight:500;background:linear-gradient(var(--gsh-gold),var(--gsh-gold)) 0 calc(50% + 11px)/0 1px no-repeat;transition:background-size .3s var(--gsh-ease-brand)}
.site-footer a:hover{background-size:100% 1px}
.site-footer a svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* ─── Motion (gated: html.anim is set only when reduced motion is NOT requested) ─ */
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes fade{from{opacity:0}to{opacity:1}}
@keyframes draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes unfurl{from{opacity:0;transform:scale(.25) rotate(-8deg)}to{opacity:1;transform:none}}
@keyframes fill-in{from{opacity:0}to{opacity:1}}
@keyframes pop{0%{opacity:0;transform:scale(0)}70%{opacity:1;transform:scale(1.25)}100%{opacity:1;transform:scale(1)}}
@keyframes orbit{to{transform:rotate(360deg)}}
@keyframes sway{0%,100%{transform:rotate(-.9deg)}50%{transform:rotate(.9deg)}}
@keyframes pulse{0%{opacity:.6;transform:scale(.6)}100%{opacity:0;transform:scale(1.9)}}
@keyframes halo{0%,100%{opacity:.12;transform:scale(.8)}50%{opacity:.55;transform:scale(1.3)}}

html.anim .reveal{opacity:0;animation:rise .8s var(--gsh-ease-enter) forwards}
html.anim .reveal-1{animation-delay:.05s} html.anim .reveal-2{animation-delay:.16s}
html.anim .reveal-3{animation-delay:.3s} html.anim .reveal-4{animation-delay:.42s}
html.anim .reveal-5{animation-delay:.54s}
html.anim .art{opacity:0;animation:fade .9s var(--gsh-ease-reveal) .1s forwards}
html.anim .specimen .ring-outer{stroke-dasharray:1;stroke-dashoffset:1;animation:draw 1.6s var(--gsh-ease-reveal) .2s forwards}
html.anim .specimen .soil{stroke-dasharray:1;stroke-dashoffset:1;animation:draw .9s var(--gsh-ease-reveal) .5s forwards}
html.anim .specimen .draw{stroke-dasharray:1;stroke-dashoffset:1}
html.anim .specimen .roots .draw{animation:draw 1.1s var(--gsh-ease-reveal) .9s forwards}
html.anim .specimen .roots .fine{animation-delay:1.25s}
html.anim .specimen .stem{animation:draw 1.3s var(--gsh-ease-reveal) 1.1s forwards}
html.anim .specimen .leaf{opacity:0;animation:unfurl .9s var(--gsh-ease-enter) forwards}
html.anim .specimen .leaf .draw{animation:draw .9s var(--gsh-ease-reveal) forwards}
html.anim .specimen .leaf .leaf-fill{opacity:0;animation:fill-in .8s ease forwards}
html.anim .specimen .leaf-0,html.anim .specimen .leaf-0 .draw{animation-delay:1.55s} html.anim .specimen .leaf-0 .leaf-fill{animation-delay:2.1s}
html.anim .specimen .leaf-1,html.anim .specimen .leaf-1 .draw{animation-delay:1.8s}  html.anim .specimen .leaf-1 .leaf-fill{animation-delay:2.35s}
html.anim .specimen .leaf-2,html.anim .specimen .leaf-2 .draw{animation-delay:2.05s} html.anim .specimen .leaf-2 .leaf-fill{animation-delay:2.6s}
html.anim .specimen .leaf-3,html.anim .specimen .leaf-3 .draw{animation-delay:2.3s}  html.anim .specimen .leaf-3 .leaf-fill{animation-delay:2.85s}
html.anim .specimen .leaf-4,html.anim .specimen .leaf-4 .draw{animation-delay:2.4s}  html.anim .specimen .leaf-4 .leaf-fill{animation-delay:2.95s}
html.anim .specimen .bud{opacity:0;transform-box:fill-box;transform-origin:center;animation:pop .6s var(--gsh-ease-brand) 2.9s forwards}
html.anim .specimen .bud-halo{opacity:0;transform-box:fill-box;transform-origin:center;animation:halo 2.4s ease-in-out 3.4s infinite}
html.anim .specimen .plant{animation:sway 8s ease-in-out 3.6s infinite}
html.anim .specimen .orbit{animation:orbit 26s linear infinite}
html.anim .specimen .comet{opacity:0;animation:fade .6s ease 1.6s forwards}
html.anim .pulse::after{animation:pulse 2.4s ease-out infinite}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .btn:hover{transform:none}
}

/* ─── Responsive (brand breakpoints 1080 / 880 / 680) ─────────────────── */
@media (max-width:1080px){
  .hero .wrap{grid-template-columns:1fr .82fr;gap:36px}
}
@media (max-width:880px){
  .hero{padding:40px 0 56px}
  .hero .wrap{grid-template-columns:1fr;gap:48px}
  .art{justify-self:center;width:min(78%,420px)}
}
@media (max-width:680px){
  .wrap{width:min(100% - 34px,1200px)}
  .site-header{padding-top:22px}
  .lockup{gap:11px}
  .lockup img{height:40px}
  .lockup-divider{height:28px}
  .lockup-name{font-size:22px}
  .status{display:none}
  .hero{padding:36px 0 48px}
  .kicker{margin-bottom:20px}
  .lead{font-size:16px;line-height:1.72;margin-top:22px}
  .waitlist{margin-top:32px}
  .art{width:min(88%,360px)}
  .site-footer .wrap{flex-direction:column;align-items:flex-start;gap:4px;padding:18px 0 22px}
}
@media (max-width:480px){
  .field-row{flex-direction:column;align-items:stretch;gap:10px;padding:0;background:transparent;border:0;box-shadow:none;border-radius:0}
  .field-row:focus-within{box-shadow:none}
  .field-row input[type=email]{flex:none;height:54px;padding:0 22px;background:var(--gsh-paper);border:1px solid var(--gsh-line-field);box-shadow:0 10px 26px rgba(34,25,10,.05)}
  .field-row input[type=email]:focus{border-color:var(--gsh-gold);box-shadow:0 0 0 4px rgba(194,145,47,.13)}
  .btn{min-height:52px;width:100%}
  .form-note,.form-msg{margin-left:4px}
}