:root{
  --bg:#f7f7f2;
  --ink:#0e110f;
  --green:#30a56b;
  --green-dark:#1f7f51;
  --line:rgba(14,17,15,.12);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:Arial,Helvetica,sans-serif;overflow-x:hidden}
a{color:inherit;text-decoration:none}
button{font:inherit}

.intro{position:fixed;inset:0;z-index:1000;background:#f5f4f1;display:grid;place-items:center;transition:opacity .7s cubic-bezier(.2,.8,.2,1),visibility .7s}
.intro video{width:100%;height:100%;object-fit:cover;display:block}
.intro.hidden{opacity:0;visibility:hidden;pointer-events:none}
.skip{position:absolute;right:24px;bottom:24px;border:1px solid rgba(0,0,0,.18);background:rgba(255,255,255,.75);backdrop-filter:blur(10px);border-radius:999px;padding:10px 15px;font-size:11px;font-weight:800;letter-spacing:.12em;cursor:pointer}

.site{opacity:0;transition:opacity .6s ease}
.site.ready{opacity:1}
.nav{height:78px;padding:0 4vw;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);background:rgba(247,247,242,.86);backdrop-filter:blur(16px);position:sticky;top:0;z-index:20}
.brand{display:flex;align-items:center;gap:10px;font-size:20px;font-weight:950;letter-spacing:-.04em}
.brand span{width:13px;height:13px;border-radius:50%;background:var(--green);box-shadow:0 0 0 5px rgba(48,165,107,.12)}
.nav-actions{display:flex;gap:28px;font-size:12px;font-weight:900;letter-spacing:.12em}

.hero{min-height:calc(100vh - 78px);padding:6vh 4vw 7vh;display:grid;grid-template-columns:.8fr 1.2fr;align-items:center;gap:5vw}
.eyebrow{font-size:11px;font-weight:900;letter-spacing:.18em;margin:0 0 20px;color:#667069}
.eyebrow.light{color:rgba(255,255,255,.58)}
h1,h2{margin:0;font-weight:950;letter-spacing:-.075em;line-height:.86}
h1{font-size:clamp(64px,8.4vw,150px)}
h2{font-size:clamp(58px,7vw,128px)}
h1 em,h2 em{font-style:normal;color:var(--green)}
.sub{font-size:clamp(19px,1.6vw,28px);color:#646d67;margin:28px 0 34px;letter-spacing:-.025em}
.main-button{display:inline-flex;align-items:center;gap:28px;background:var(--green);color:#fff;border-radius:999px;padding:18px 24px;font-size:12px;font-weight:950;letter-spacing:.11em;transition:transform .2s ease,box-shadow .2s ease}
.main-button:hover{transform:translateY(-3px);box-shadow:0 16px 30px rgba(48,165,107,.22)}
.main-button span{font-size:18px}
.main-button.dark{background:var(--ink)}
.hero-film,.final-film,.statement-media{overflow:hidden;background:#e8eee9;position:relative}
.hero-film{border-radius:34px;aspect-ratio:4/3;box-shadow:0 28px 70px rgba(15,40,27,.11)}
.hero-film video,.final-film video,.statement-media video{width:100%;height:100%;object-fit:cover;display:block}

.statement{background:#101412;color:#fff;min-height:100vh;padding:7vw 4vw;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:6vw}
.statement-media{border-radius:34px;aspect-ratio:1/1;box-shadow:0 32px 90px rgba(0,0,0,.34)}
.statement-copy h2 em{color:#57ca8b}

.identity{min-height:95vh;padding:7vw 7vw;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:8vw;overflow:hidden}
.identity-art{display:grid;place-items:center;position:relative}
.identity-art::before{content:"";position:absolute;width:70%;aspect-ratio:1;border-radius:50%;background:rgba(48,165,107,.12);filter:blur(8px)}
.identity-art img{width:min(100%,650px);position:relative;filter:drop-shadow(0 36px 38px rgba(21,72,46,.14));transition:transform .18s ease}
.identity-copy p:last-child{max-width:520px;font-size:clamp(20px,1.7vw,30px);line-height:1.28;color:#626b66;margin:32px 0 0;letter-spacing:-.035em}

.final{min-height:100vh;background:var(--green);padding:7vw 4vw;display:grid;grid-template-columns:.82fr 1.18fr;align-items:center;gap:5vw;overflow:hidden}
.final .eyebrow{color:rgba(0,0,0,.58)}
.final h2 em{color:#fff}
.final-film{border-radius:36px;aspect-ratio:4/3;box-shadow:0 35px 90px rgba(0,0,0,.18)}

footer{min-height:120px;padding:34px 4vw;display:flex;align-items:center;justify-content:space-between;gap:24px;border-top:1px solid var(--line)}
footer p{margin:0;font-size:11px;font-weight:900;letter-spacing:.16em;color:#667069}
footer button{border:0;background:none;font-size:11px;font-weight:900;letter-spacing:.12em;cursor:pointer}

.reveal{opacity:0;transform:translateY(34px);transition:opacity .8s cubic-bezier(.2,.8,.2,1),transform .8s cubic-bezier(.2,.8,.2,1)}
.reveal.visible{opacity:1;transform:none}
.media-reveal{clip-path:inset(0 0 100% 0 round 34px);transition:clip-path 1s cubic-bezier(.16,1,.3,1),opacity .8s ease,transform .8s ease}
.media-reveal.visible{clip-path:inset(0 0 0 0 round 34px)}
.hero-copy.visible{transition-delay:.08s}
.hero-film.visible{transition-delay:.18s}

@media(max-width:950px){
  .nav{height:68px;padding:0 20px}.nav-actions{gap:18px}
  .hero,.statement,.identity,.final{grid-template-columns:1fr;min-height:auto;padding:70px 20px;gap:46px}
  .hero{padding-top:52px}.hero-film{aspect-ratio:1/1}.statement-media{order:2}.statement-copy{order:1}.identity-art{order:2}.identity-copy{order:1}.final-film{aspect-ratio:1/1}
  h1{font-size:clamp(62px,18vw,100px)}h2{font-size:clamp(54px,15vw,92px)}
  footer{padding:30px 20px;flex-wrap:wrap}.skip{right:16px;bottom:16px}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}.intro,.site,.reveal,.media-reveal{transition:none!important}.reveal{opacity:1;transform:none}.media-reveal{clip-path:none}}
