/* ===== layout & type ===== */
.container{width:min(100% - 2*var(--pad),1440px);margin-inline:auto}
.section{position:relative;padding:clamp(96px,12vw,180px) 0}
.section--tight{padding:clamp(64px,8vw,120px) 0}
.eyebrow{display:inline-flex;align-items:center;gap:12px;font-weight:600;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--mint)}
.eyebrow::before{content:"";width:22px;height:2px;background:var(--mint)}
.h-display{font-weight:800;letter-spacing:-.045em;line-height:.94;font-size:clamp(44px,7.2vw,124px)}
.h1{font-weight:800;letter-spacing:-.04em;line-height:.98;font-size:clamp(40px,6vw,96px)}
.h2{font-weight:800;letter-spacing:-.035em;line-height:1.02;font-size:clamp(34px,4.6vw,72px)}
.h3{font-weight:700;letter-spacing:-.02em;line-height:1.1;font-size:clamp(22px,2.2vw,32px)}
.lead{font-size:clamp(17px,1.35vw,22px);line-height:1.5;color:#DCE4DF;max-width:62ch}
.body{font-size:clamp(15px,1.1vw,18px);color:var(--grey);max-width:60ch}
.mint{color:var(--mint)}.muted{color:var(--grey)}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,96px);align-items:center}
@media (max-width:900px){.grid-2{grid-template-columns:1fr}}

/* ===== buttons ===== */
.btn{position:relative;display:inline-flex;align-items:center;gap:12px;padding:16px 26px;border-radius:999px;font-weight:700;font-size:15px;letter-spacing:-.01em;transition:transform .5s var(--ease),background .3s,color .3s,border-color .3s;will-change:transform}
.btn--primary{background:var(--mint);color:var(--green)}
.btn--primary:hover{background:#B9F5D0}
.btn--ghost{border:1px solid var(--line-2);color:var(--white);background:rgba(255,255,255,.04)}
.btn--ghost:hover{border-color:var(--mint);color:var(--mint)}
.btn .arrow{width:18px;height:18px;transition:transform .5s var(--ease)}
.btn:hover .arrow{transform:translateX(4px)}
.btn--lg{padding:20px 34px;font-size:17px}

/* ===== nav ===== */
.nav{position:fixed;inset:0 0 auto 0;z-index:100;padding:18px 0;transition:background .4s,backdrop-filter .4s,border-color .4s;border-bottom:1px solid transparent}
.nav.is-scrolled{background:rgba(7,13,10,.72);backdrop-filter:blur(14px);border-color:var(--line)}
.nav__inner{display:flex;align-items:center;justify-content:space-between;gap:24px}
.logo{display:inline-flex;align-items:center;gap:12px}
.logo__mark{font-weight:900;font-size:24px;letter-spacing:-.09em;line-height:1}
.logo__mark i{font-style:normal;color:var(--mint)}
.logo__wm{font-weight:800;font-size:13px;letter-spacing:.18em;text-transform:uppercase}
.nav__links{display:flex;gap:30px;list-style:none}
.nav__links a{font-size:14px;font-weight:500;color:var(--grey);position:relative;padding:6px 0}
.nav__links a::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;background:var(--mint);transform:scaleX(0);transform-origin:right;transition:transform .5s var(--ease)}
.nav__links a:hover{color:var(--white)}.nav__links a:hover::after{transform:scaleX(1);transform-origin:left}
.nav__cta{display:inline-flex}
.nav__burger{display:none;width:44px;height:44px;border:1px solid var(--line-2);border-radius:50%;place-items:center}
.nav__burger span{display:block;width:18px;height:2px;background:#fff;margin:2.5px 0;transition:transform .4s var(--ease),opacity .3s}
.nav__burger.is-open span:nth-child(1){transform:translateY(4.5px) rotate(45deg)}.nav__burger.is-open span:nth-child(2){opacity:0}.nav__burger.is-open span:nth-child(3){transform:translateY(-4.5px) rotate(-45deg)}
.menu{position:fixed;inset:0;z-index:90;background:var(--green);display:grid;place-items:center;clip-path:circle(0% at calc(100% - 42px) 40px);transition:clip-path .9s var(--ease-io);pointer-events:none}
.menu.is-open{clip-path:circle(150% at calc(100% - 42px) 40px);pointer-events:auto}
.menu ul{list-style:none;text-align:center;display:grid;gap:18px}
.menu a{font-weight:800;font-size:clamp(32px,8vw,56px);letter-spacing:-.04em}
@media (max-width:1000px){.nav__links,.nav__cta{display:none}.nav__burger{display:grid}}

/* ===== progress + cursor ===== */
.progress{position:fixed;left:0;top:0;height:2px;width:100%;z-index:110;background:transparent}
.progress b{display:block;height:100%;background:var(--mint);transform-origin:left;transform:scaleX(0)}
.cursor{position:fixed;left:0;top:0;width:12px;height:12px;border-radius:50%;background:var(--mint);pointer-events:none;z-index:200;transform:translate(-50%,-50%);mix-blend-mode:difference;transition:width .3s,height .3s,opacity .3s;opacity:0}
.cursor.is-active{width:56px;height:56px}
@media (hover:none){.cursor{display:none}}

/* ===== utilities ===== */
.rule{height:1px;background:var(--line)}
.grain{pointer-events:none;position:absolute;inset:0;z-index:5;opacity:.05;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='220' height='220' filter='url(%23n)'/%3E%3C/svg%3E")}
.reveal{opacity:0;transform:translateY(28px)}
.split .word{display:inline-block;overflow:hidden;vertical-align:top}
.split .word > span{display:inline-block;transform:translateY(110%);will-change:transform}
.demo-tag{display:inline-flex;align-items:center;gap:8px;font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--grey);border:1px solid var(--line);border-radius:999px;padding:6px 12px}
.demo-tag::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--mint)}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}.reveal{opacity:1;transform:none}.split .word > span{transform:none}}