:root{
  --ivory:#F7F2E8; --orange:#E97832; --green:#285B45; --dark:#101713; --ink:#1b2620;
  --head:'Montserrat',system-ui,sans-serif; --body:'Lato',system-ui,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:auto}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
body{background:var(--dark);color:var(--ivory);font-family:var(--body);line-height:1.65;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
:focus-visible{outline:2px solid var(--orange);outline-offset:3px}

.site-header{position:fixed;inset:0 0 auto 0;z-index:50;display:flex;justify-content:space-between;align-items:center;padding:18px 5vw;mix-blend-mode:difference;color:#fff}
.brand{font-family:var(--head);font-weight:700;font-size:1.1rem;text-decoration:none}
.nav{display:flex;gap:1.8rem}
.nav a{text-decoration:none;font-weight:700;font-size:.9rem}
.nav a:hover{text-decoration:underline;text-underline-offset:6px}
.nav-toggle{display:none;background:none;border:0;width:36px;height:36px;cursor:pointer}
.nav-toggle span{display:block;height:2px;background:#fff;margin:6px 0;transition:transform .25s}
@media(max-width:800px){
  .nav-toggle{display:block;position:relative;z-index:60}
  .nav{position:fixed;inset:0;background:var(--dark);flex-direction:column;justify-content:center;align-items:center;gap:1.6rem;transform:translateY(-100%);transition:transform .35s}
  .nav a{font-size:1.5rem;color:var(--ivory)}
  .nav.open{transform:none}
  .nav-toggle.open span:first-child{transform:translateY(4px) rotate(45deg)}
  .nav-toggle.open span:last-child{transform:translateY(-4px) rotate(-45deg)}
}

/* stage */
.stage{position:relative;height:100vh;height:100svh;overflow:hidden;background:radial-gradient(ellipse at 50% 45%,#1b2b22,var(--dark) 70%)}
.stage-hero,.stage-end{position:absolute;left:0;right:0;top:11%;text-align:center;padding:0 6vw}
.stage h1,.stage h2{font-family:var(--head);font-weight:700;font-size:clamp(1.6rem,4.2vw,3.2rem);line-height:1.15;max-width:22ch;margin:0 auto}
.stage-hero p,.stage-end p{margin-top:.9rem;opacity:.7}
.js .stage-end{opacity:0}
.env{position:absolute;left:50%;top:34%;width:300px;height:220px;margin-left:-150px}
.env>*{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.l-back{z-index:0}.docs{z-index:2}.l-front{z-index:4}.l-flap{z-index:5}
.docs{inset:auto;left:50%;top:65%;width:0;height:0}
.doc{position:absolute;width:120px;height:150px;left:-60px;top:-75px;background:var(--ivory);border-radius:4px;padding:12px;color:var(--ink);box-shadow:0 6px 18px rgba(0,0,0,.35)}
.doc b{display:block;font-family:var(--head);font-size:.72rem;margin-bottom:10px;color:var(--green)}
.doc i{display:block;height:5px;border-radius:3px;background:#cfd6cc;margin-bottom:8px}
.doc i:nth-of-type(2){width:80%}.doc i:nth-of-type(3){width:55%}
.seal-glow{opacity:0;filter:drop-shadow(0 0 8px #E97832)}
.shield{position:absolute;left:50%;bottom:4%;width:150px;height:180px;margin-left:-75px;overflow:visible}
.tick{stroke-dasharray:60;stroke-dashoffset:60}
.rm .stage-end{opacity:1}.rm .stage-hero{display:none}
.rm .tick{stroke-dashoffset:0}
@media(max-width:480px){.env{transform:scale(.8)}}

/* sections */
.section{padding:clamp(4rem,10vw,9rem) 5vw}
.section.light{background:var(--ivory);color:var(--ink)}
.section.dark{background:var(--dark)}
.section.green{background:var(--green)}
.wrap{max-width:1100px;margin:0 auto}
.two{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,6vw,5rem);align-items:center}
.two.top{align-items:start}
@media(max-width:800px){.two{grid-template-columns:1fr}}
h2{font-family:var(--head);font-weight:700;font-size:clamp(1.8rem,3.6vw,2.7rem);line-height:1.15;margin-bottom:1.2rem}
.section p{max-width:60ch;margin-bottom:1rem}
.ph{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:6px}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.5rem;margin-top:2rem}
.card .ph{aspect-ratio:1;margin-bottom:1rem}
.card h3{font-family:var(--head);font-weight:600;font-size:1.1rem;margin-bottom:.3rem}
.card p{opacity:.7;font-size:.95rem}
.js .reveal{opacity:0;transform:translateY(30px)}

.steps{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;margin-top:2.5rem;position:relative}
.steps::before{content:"";position:absolute;left:0;right:0;top:19px;height:2px;background:var(--green);transform-origin:0 50%;transform:scaleX(var(--p,1))}
.steps li{position:relative}
.steps span{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--orange);color:var(--dark);font-family:var(--head);font-weight:700;margin-bottom:1rem;position:relative}
.steps h3{font-family:var(--head);font-weight:600;margin-bottom:.3rem}
.steps p{font-size:.95rem;opacity:.8}
@media(max-width:800px){.steps{grid-template-columns:1fr 1fr}.steps::before{display:none}}

.why{list-style:none}
.why li{padding:1.1rem 0;border-top:1px solid rgba(247,242,232,.18)}
.why li:last-child{border-bottom:1px solid rgba(247,242,232,.18)}
.why h3{font-family:var(--head);font-weight:600;font-size:1.1rem}
.why p{opacity:.7;margin:.2rem 0 0}

.glass-shield{width:min(260px,70%);justify-self:center;overflow:visible}

.form{display:grid;gap:1rem}
.form label{display:grid;gap:.35rem;font-weight:700;font-size:.9rem}
.form input,.form textarea{font:inherit;font-weight:400;padding:.8rem 1rem;border:1px solid #b9c0b6;border-radius:4px;background:#fff;color:var(--ink)}
.form button{font:inherit;font-family:var(--head);font-weight:700;padding:.9rem 1.5rem;border:0;border-radius:4px;background:var(--orange);color:var(--dark);cursor:pointer;justify-self:start}
.form button:hover{background:var(--green);color:var(--ivory)}
.hp{position:absolute!important;left:-9999px}
.note{font-weight:700}.note.ok{color:var(--green)}.note.err{color:#a3321f}

.site-footer{background:var(--dark);padding:2rem 5vw;text-align:center;font-size:.85rem;opacity:.7}
.plain{padding:8rem 5vw 4rem;max-width:760px;margin:0 auto}
