@font-face{font-family:Manrope;src:url(../assets/fonts/manrope-400.ttf);font-weight:400;font-display:swap}
@font-face{font-family:Manrope;src:url(../assets/fonts/manrope-600.ttf);font-weight:600;font-display:swap}
@font-face{font-family:Manrope;src:url(../assets/fonts/manrope-800.ttf);font-weight:800;font-display:swap}

:root{
  --green:#96c322;--green-hi:#b4e03a;--green-dim:#5c7a14;
  --ink:#1d201c;--deep:#111310;--night:#0b0c0a;
  --paper:#f1f2ec;--paper-2:#e4e7dc;--muted:#7c8276;--line:rgba(255,255,255,.12);--line-dark:#d2d5ca;
  --serif:'Instrument Serif',Georgia,serif;
  --ease:cubic-bezier(.22,1,.36,1);--ease-io:cubic-bezier(.76,0,.24,1);
  --gut:clamp(20px,5vw,80px);
}
*{box-sizing:border-box}
html{overflow-x:clip;background:var(--deep);-webkit-text-size-adjust:100%}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
body{margin:0;font-family:Manrope,system-ui,sans-serif;color:var(--paper);background:var(--deep);font-synthesis:none;-webkit-font-smoothing:antialiased;overflow-x:clip}
body.light{background:var(--paper);color:var(--ink)}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3,p{margin:0}
em{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:-.01em}
:focus-visible{outline:2px solid var(--green);outline-offset:4px}
.skip{position:fixed;left:12px;top:-60px;z-index:200;background:var(--green);color:var(--ink);padding:12px 16px;font-weight:800}
.skip:focus{top:12px}
.eyebrow{font-size:11px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:var(--green);display:inline-flex;align-items:center;gap:10px}
.eyebrow:before{content:'';width:22px;height:1px;background:currentColor}
.wrap{padding-left:var(--gut);padding-right:var(--gut);max-width:1600px;margin:0 auto}

/* ---------- Header ---------- */
.hdr{position:fixed;inset:0 0 auto;z-index:50;display:flex;align-items:center;gap:28px;padding:18px var(--gut);transition:transform .5s var(--ease),background-color .4s ease,backdrop-filter .4s}
.hdr.scrolled{background:rgba(17,19,16,.88);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
body.light .hdr.scrolled{background:rgba(241,242,236,.8)}
.hdr.hide{transform:translateY(-110%)}
.brand{display:flex;align-items:center;gap:12px;font-weight:800;letter-spacing:.2em;font-size:13px}
.brand-mark{width:40px;height:40px}
.brand small{display:block;font-weight:600;letter-spacing:.24em;font-size:9px;opacity:.6;margin-top:3px}
.nav{margin-left:auto;display:flex;gap:6px;align-items:center}
.nav a{font-size:13px;font-weight:600;padding:10px 14px;position:relative;opacity:.82;transition:opacity .2s}
.nav a:hover,.nav a[aria-current]{opacity:1}
.nav a:after{content:'';position:absolute;left:14px;right:14px;bottom:4px;height:1px;background:var(--green);transform:scaleX(0);transform-origin:right;transition:transform .45s var(--ease)}
.nav a:hover:after,.nav a[aria-current]:after{transform:scaleX(1);transform-origin:left}
.menu-btn{display:none}

/* ---------- Buttons ---------- */
.btn{--bg:var(--green);--fg:#141a07;position:relative;display:inline-flex;align-items:center;gap:16px;padding:0 10px 0 24px;height:56px;border-radius:999px;background:var(--bg);color:var(--fg);font-weight:800;font-size:14px;border:0;cursor:pointer;overflow:hidden;isolation:isolate;transition:transform .5s var(--ease)}
.btn:before{content:'';position:absolute;inset:0;background:var(--green-hi);border-radius:inherit;transform:translateY(101%);transition:transform .55s var(--ease);z-index:-1}
.btn:hover:before{transform:none}
.btn .ic{width:38px;height:38px;border-radius:50%;background:var(--fg);color:var(--bg);display:grid;place-items:center;overflow:hidden;position:relative}
.btn .ic svg{transition:transform .5s var(--ease)}
.btn .ic svg+svg{position:absolute;transform:translateX(-160%)}
.btn:hover .ic svg:first-child{transform:translateX(160%)}
.btn:hover .ic svg+svg{transform:none}
.btn:active{transform:scale(.97)}
.btn.ghost{--bg:transparent;--fg:currentColor;border:1px solid rgba(255,255,255,.28);padding:0 24px}
.btn.ghost:before{background:rgba(255,255,255,.08)}
body.light .btn.ghost{border-color:rgba(0,0,0,.2)}
body.light .btn.ghost:before{background:rgba(0,0,0,.05)}
.btn.dark{--bg:var(--ink);--fg:var(--paper)}
.btn.dark:before{background:#000}
.nav .btn{height:44px;font-size:13px;margin-left:10px;padding-left:18px;opacity:1}
.nav .btn:after{display:none}
.nav .btn .ic{width:30px;height:30px}

/* ---------- Page transition ---------- */
.curtain{position:fixed;inset:0;z-index:120;pointer-events:none;display:grid}
.curtain i{grid-area:1/1;background:var(--green);transform:scaleY(0);transform-origin:bottom}
.curtain i+i{background:var(--night)}
.curtain .cm{grid-area:1/1;place-self:center;width:90px;opacity:0;z-index:2}

/* ---------- Footer ---------- */
.ftr{background:var(--night);color:var(--paper);padding:110px var(--gut) 30px;position:relative;overflow:hidden}
.ftr-big{font-size:clamp(48px,9vw,150px);line-height:.95;font-weight:600;letter-spacing:-.05em}
.ftr-big em{color:var(--green)}
.ftr-row{display:flex;flex-wrap:wrap;gap:40px;justify-content:space-between;align-items:end;margin-top:50px}
.ftr-cols{display:flex;gap:70px;flex-wrap:wrap;font-size:14px;line-height:2;color:#b9beb2}
.ftr-cols b{display:block;color:var(--paper);font-size:11px;letter-spacing:.18em;text-transform:uppercase;margin-bottom:10px}
.ftr-cols a:hover{color:var(--green)}
.ftr-base{border-top:1px solid var(--line);margin-top:80px;padding-top:22px;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;font-size:12px;color:#7d8378}

/* ---------- Utility reveal ---------- */
.split-line{display:block;overflow:hidden;padding-bottom:.08em;margin-bottom:-.08em}
.split-line>span{display:inline-block;will-change:transform}
.noise{position:fixed;inset:0;z-index:90;pointer-events:none;opacity:.05;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter=%27url(%23n)%27/%3E%3C/svg%3E")}
@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-5%,3%)}40%{transform:translate(4%,-6%)}60%{transform:translate(-3%,5%)}80%{transform:translate(6%,2%)}100%{transform:translate(0,0)}}
.cursor{position:fixed;left:0;top:0;width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:50%;background:var(--green);z-index:110;pointer-events:none;mix-blend-mode:difference;transition:width .35s var(--ease),height .35s var(--ease),margin .35s var(--ease)}
.cursor.big{width:84px;height:84px;margin:-42px 0 0 -42px;mix-blend-mode:normal;background:rgba(150,195,34,.92);display:grid;place-items:center}
.cursor span{font-size:11px;font-weight:800;color:#141a07;letter-spacing:.08em;opacity:0;transition:opacity .2s}
.cursor.big span{opacity:1}
@media (hover:none),(pointer:coarse){.cursor{display:none}}

.proto-note{font-size:11px;color:var(--muted);line-height:1.6}

/* ---------- Mobile nav ---------- */
@media (max-width:900px){
  .nav{position:fixed;inset:0;flex-direction:column;align-items:flex-start;justify-content:center;gap:4px;padding:0 var(--gut);background:var(--night);color:var(--paper);clip-path:circle(0 at calc(100% - 44px) 40px);transition:clip-path .8s var(--ease-io);margin:0}
  .nav.open{clip-path:circle(150% at calc(100% - 44px) 40px)}
  .nav a{font-size:34px;font-weight:600;letter-spacing:-.03em;padding:8px 0;opacity:1}
  .nav a:after{left:0;right:0}
  .nav .btn{margin:24px 0 0;font-size:15px;height:56px}
  .menu-btn{display:grid;place-items:center;margin-left:auto;width:48px;height:48px;border-radius:50%;border:1px solid rgba(255,255,255,.25);background:transparent;cursor:pointer;z-index:2;position:relative}
  body.light .menu-btn{border-color:rgba(0,0,0,.2)}
  .menu-btn i{display:block;width:18px;height:1.5px;background:currentColor;transition:transform .4s var(--ease)}
  .menu-btn i+i{margin-top:-10px;transform:translateY(6px)}
  .menu-btn[aria-expanded=true]{color:var(--paper);border-color:rgba(255,255,255,.25)}
  .menu-btn[aria-expanded=true] i{transform:rotate(45deg)}
  .menu-btn[aria-expanded=true] i+i{transform:rotate(-45deg)}
  .brand{z-index:2;position:relative}
  .nav-open .brand{color:var(--paper)}
  .ftr{padding-top:70px}
  .ftr-cols{gap:36px}
}
@media (prefers-reduced-motion:reduce){.noise{animation:none}*{scroll-behavior:auto!important}}
