@font-face{font-family:"Montserrat";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/montserrat-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Montserrat";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/montserrat-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Montserrat";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/montserrat-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Montserrat";font-style:normal;font-weight:700;font-display:swap;src:url(fonts/montserrat-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:"Montserrat";font-style:normal;font-weight:800;font-display:swap;src:url(fonts/montserrat-latin-800-normal.woff2) format("woff2")}
@font-face{font-family:"Montserrat";font-style:italic;font-weight:800;font-display:swap;src:url(fonts/montserrat-latin-800-italic.woff2) format("woff2")}

:root{
  --bg:#101010;--fg:#F2EEE3;--green:#93A97A;--green-deep:#1B1F17;
  --muted:#C9C5BB;--dim:#A9A59C;--faint:#8E8A82;
  --surface:#161616;--line:rgba(242,238,227,.14);--line-soft:rgba(242,238,227,.08);
  --wrap:1240px;--ease:cubic-bezier(.2,.8,.2,1);
  color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:96px}
body{margin:0;background:var(--bg);color:var(--fg);font-family:Montserrat,"Helvetica Neue",Arial,sans-serif;font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden;padding-bottom:env(safe-area-inset-bottom,0px)}
img,video{max-width:100%;display:block}
a{color:var(--fg)}
a:hover{color:var(--green)}
:focus-visible{outline:2px solid var(--green);outline-offset:3px}
h1,h2,h3,p{margin:0}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:10px;min-height:52px;padding:0 26px;border-radius:4px;font:700 15px/1 Montserrat,sans-serif;text-decoration:none;cursor:pointer;border:0;transition:transform .2s var(--ease),background .2s,color .2s}
.btn:hover{transform:translateY(-1px)}
.btn--light{background:var(--fg);color:var(--bg)}
.btn--light:hover{color:var(--bg);background:#fff}
.btn--green{background:var(--green);color:var(--bg)}
.btn--green:hover{color:var(--bg);background:#a5ba8d}
.btn--ghost{border:1px solid rgba(242,238,227,.3);color:var(--fg);background:transparent;font-weight:600}
.btn--ghost:hover{border-color:var(--green);color:var(--fg)}
.btn svg{flex:0 0 auto}

/* header */
.header{position:sticky;top:0;z-index:40;background:rgba(16,16,16,.9);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--line-soft);padding-top:env(safe-area-inset-top,0px)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:72px}
.nav__logo{display:flex;align-items:center;min-height:44px}
.nav__logo img{height:38px;width:auto}
.nav__right{display:flex;align-items:center;gap:32px}
.nav__links{display:flex;gap:28px;font-size:14px;font-weight:500}
.nav__links a{color:var(--muted);text-decoration:none}
.nav__links a:hover{color:var(--fg)}
.nav .btn{min-height:44px;padding:0 20px;font-size:14px}
@media (max-width:820px){.nav__links{display:none}.nav__logo img{height:30px}}

/* scroll timeline */
.scrollbar{position:relative;height:22px;border-top:1px solid var(--line-soft)}
.scrollbar__ticks{position:absolute;left:24px;right:96px;top:6px;height:8px;background:repeating-linear-gradient(90deg,rgba(242,238,227,.22) 0 1px,transparent 1px 16px)}
.scrollbar__head{position:absolute;top:0;bottom:0;left:24px;width:2px;background:var(--green);will-change:transform}
.scrollbar__head::before{content:"";position:absolute;top:0;left:-4px;width:10px;height:8px;background:var(--green);border-radius:2px 2px 5px 5px}
.scrollbar__tc{position:absolute;right:24px;top:2px;font-size:11px;font-weight:600;letter-spacing:.04em;color:var(--green);font-variant-numeric:tabular-nums}
.scrollbar__track{position:absolute;left:24px;right:96px;top:0;bottom:0}

/* hero */
.hero{padding:clamp(56px,9vw,120px) 0 40px}
.hero__grid{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:40px}
.hero h1{flex:1 1 620px;font-size:clamp(44px,7.4vw,108px);line-height:.94;font-weight:800;letter-spacing:-.035em}
.hero h1 span{display:block}
.hero h1 .accent{color:var(--green);font-style:italic}
.hero__side{flex:1 1 320px;max-width:420px;display:flex;flex-direction:column;gap:22px}
.hero__claim{font-size:20px;line-height:1.45;font-weight:700}
.hero__text{font-size:17px;color:var(--muted)}
.hero__ctas{display:flex;flex-wrap:wrap;gap:12px}

/* cut reveal (playhead wipe) */
.cut{position:relative}
.js .cut{clip-path:inset(0 100% 0 0)}
.cut::after{content:"";position:absolute;top:-6%;bottom:-6%;left:0;width:3px;background:var(--green);opacity:0;pointer-events:none}
.js .cut.is-in{animation:cutWipe 1.05s var(--ease) var(--d,0ms) forwards}
.js .cut.is-in::after{animation:cutHead 1.05s var(--ease) var(--d,0ms) forwards}
@keyframes cutWipe{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
.js .cut.is-done{clip-path:none;animation:none}
.js .cut.is-done::after{display:none}
@keyframes cutHead{0%{left:0;opacity:1}85%{opacity:1}100%{left:100%;opacity:0}}
.js .fade{opacity:0;transform:translateY(14px);transition:opacity .7s var(--ease) var(--d,0ms),transform .7s var(--ease) var(--d,0ms)}
.js .fade.is-in{opacity:1;transform:none}

/* viewer */
.viewer{border:1px solid var(--line);border-radius:8px;overflow:hidden;background:#0A0A0A}
.viewer__screen{position:relative;aspect-ratio:16/9;background:#0A0A0A}
.viewer__screen video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.viewer__bar{padding:14px 16px 16px;border-top:1px solid var(--line-soft);display:flex;flex-direction:column;gap:12px}
.viewer__controls{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.viewer__btns{display:flex;gap:8px}
.vbtn{min-width:44px;min-height:44px;padding:0 14px;background:transparent;border:1px solid rgba(242,238,227,.22);border-radius:4px;color:var(--fg);font:600 13px Montserrat,sans-serif;cursor:pointer}
.vbtn:hover{border-color:var(--green)}
.tc{font-size:13px;font-weight:600;color:var(--green);font-variant-numeric:tabular-nums;letter-spacing:.04em}
.timeline{position:relative;height:64px}
.timeline__ticks{position:absolute;left:0;right:0;top:0;height:12px;background:repeating-linear-gradient(90deg,rgba(242,238,227,.32) 0 1px,transparent 1px 2%)}
.timeline__clips{position:absolute;left:0;right:0;top:20px;height:40px}
.clip{position:absolute;top:0;height:40px;border:1px solid var(--bg);border-radius:3px;background:rgba(147,169,122,.22);color:#D6D2C8;font:600 11px Montserrat,sans-serif;text-align:left;padding:0 8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer;transition:background .25s,color .25s}
.clip:hover{background:rgba(147,169,122,.4)}
.clip.is-active{background:var(--green);color:var(--bg)}
.timeline__head{position:absolute;top:-4px;bottom:0;left:0;width:2px;margin-left:-1px;background:var(--green);pointer-events:none}
.timeline__head::before{content:"";position:absolute;top:0;left:-5px;width:12px;height:14px;background:var(--green);border-radius:2px 2px 6px 6px}

/* sections */
.section{padding:clamp(80px,10vw,140px) 0 40px}
.h2{font-size:clamp(32px,4.4vw,60px);line-height:1.02;font-weight:800;letter-spacing:-.03em}
.h3{font-size:clamp(22px,2.4vw,30px);font-weight:800;letter-spacing:-.02em;line-height:1.15}
.lead{font-size:17px;line-height:1.65;color:var(--muted)}
.split{display:flex;flex-wrap:wrap;gap:32px 80px;margin-bottom:56px}
.split .h2{flex:1 1 480px;max-width:760px}
.split .lead{flex:1 1 320px;max-width:440px;align-self:flex-end}
.label{font-size:15px;color:var(--faint)}

/* stats */
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--line);margin-top:28px}
.stat{padding:28px 24px 28px 0;border-bottom:1px solid var(--line)}
.stat__num{font-size:clamp(34px,3.6vw,54px);font-weight:800;letter-spacing:-.03em;line-height:1;font-variant-numeric:tabular-nums;white-space:nowrap}
.stat__num--green{color:var(--green)}
.stat__label{margin-top:10px;font-size:15px;color:var(--muted)}
@media (max-width:900px){.stats{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:420px){.stats{grid-template-columns:1fr}}

/* pains */
.pings{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:72px}
@media (max-width:900px){.pings{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.pings{grid-template-columns:1fr}}
.ping{display:flex;gap:14px;align-items:flex-start;padding:16px 18px;background:var(--surface);border:1px solid var(--line-soft);border-radius:10px}
.ping__icon{flex:0 0 auto;width:34px;height:34px;border-radius:8px;background:var(--green);display:grid;place-items:center}
.ping__body{flex:1 1 auto;display:flex;flex-direction:column;gap:2px;min-width:0}
.ping__meta{display:flex;justify-content:space-between;gap:8px;font-size:12px;color:var(--faint)}
.ping__text{font-size:16px;font-weight:700;line-height:1.35}
.js .ping{opacity:0;transform:translateY(-18px) scale(.97)}
.js .ping.is-in{animation:pingIn .55s var(--ease) var(--d,0ms) forwards}
@keyframes pingIn{to{opacity:1;transform:none}}

.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
@media (max-width:900px){.cards{grid-template-columns:1fr}}
.card{padding:32px 28px;background:var(--surface);border-radius:6px;display:flex;flex-direction:column;gap:14px}
.card h3{font-size:22px;font-weight:700;color:var(--muted)}
.card p{font-size:16px;line-height:1.65;color:var(--dim)}
.card--us{background:var(--green-deep);border-top:3px solid var(--green)}
.card--us h3{color:var(--fg);font-weight:800}
.card--us p{color:#D6D2C8}

/* partner */
.partner{display:flex;flex-wrap:wrap;gap:48px 80px;align-items:flex-start}
.partner__main{flex:1 1 440px;display:flex;flex-direction:column;gap:24px}
.ticks{border-top:1px solid var(--line)}
.tick{display:flex;gap:16px;padding:18px 0;border-bottom:1px solid var(--line)}
.slash{font-size:20px;font-weight:800;font-style:italic;color:var(--green);line-height:1.3}
.tick strong{display:block;font-size:18px;font-weight:700}
.tick span.d{display:block;font-size:15px;line-height:1.55;color:var(--dim);margin-top:4px}
.quote{flex:1 1 360px;margin:0;padding:clamp(28px,4vw,48px);background:var(--green-deep);border-radius:8px;border-top:3px solid var(--green);display:flex;flex-direction:column;gap:28px}
.quote blockquote{margin:0;font-size:clamp(22px,2.4vw,30px);line-height:1.3;font-weight:700;letter-spacing:-.01em}
.quote figcaption{display:flex;align-items:center;gap:14px}
.quote figcaption img{height:40px;width:auto}
.quote figcaption b{display:block;font-size:16px}
.quote figcaption small{display:block;font-size:14px;color:var(--dim)}

/* services */
.rows{border-top:1px solid var(--line)}
.row{display:flex;flex-wrap:wrap;gap:12px 48px;padding:32px 0;border-bottom:1px solid var(--line)}
.row h3{flex:1 1 280px}
.row p{flex:2 1 420px;max-width:640px;font-size:17px;line-height:1.65;color:var(--muted)}

/* process */
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:32px 24px;counter-reset:s}
@media (max-width:1000px){.steps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.steps{grid-template-columns:1fr}}
.step{display:flex;flex-direction:column;gap:14px}
.step__rule{position:relative;height:22px;border-bottom:1px solid rgba(242,238,227,.25)}
.step__rule::before{content:"";position:absolute;left:0;bottom:-1px;width:1px;height:22px;background:rgba(242,238,227,.5)}
.step__rule i{position:absolute;left:0;bottom:-1px;height:1px;width:0;background:var(--green);transition:width .7s var(--ease) var(--d,0ms)}
.step.is-in .step__rule i{width:100%}
.step__n{font-size:13px;font-weight:700;color:var(--green)}
.step h3{font-size:22px;font-weight:800}
.step p{font-size:16px;line-height:1.6;color:var(--dim)}

/* benefits */
.benefits{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:48px 40px}
@media (max-width:1000px){.benefits{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){.benefits{grid-template-columns:1fr}}
.benefit{display:flex;flex-direction:column;gap:12px}
.benefit .slash{font-size:30px;line-height:1}
.benefit h3{font-size:22px;font-weight:800}
.benefit p{font-size:16px;line-height:1.65;color:var(--dim)}

/* hits */
.hit{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 40px;padding:26px 0;border-bottom:1px solid var(--line)}
.hit__num{flex:0 0 auto;min-width:min(100%,300px);font-size:clamp(38px,5vw,68px);font-weight:800;letter-spacing:-.035em;line-height:1;font-variant-numeric:tabular-nums}
.hit__num--green{color:var(--green)}
.hit__txt{flex:1 1 260px;display:flex;flex-direction:column;gap:6px}
.hit__title{font-size:20px;font-weight:700}
.hit__brand{font-size:15px;color:var(--faint)}

/* marquee */
.marquee{margin-top:56px;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee__track{display:flex;width:max-content;animation:marquee 38s linear infinite}
.marquee:hover .marquee__track{animation-play-state:paused}
.marquee__set{display:flex;gap:0;padding-right:0;white-space:nowrap;font-size:clamp(24px,3vw,40px);font-weight:700;letter-spacing:-.01em;color:var(--muted)}
.marquee__set span{padding:0 .55em}
.marquee__set .s{color:var(--green);padding:0}
@keyframes marquee{to{transform:translateX(-50%)}}

/* faq */
.faq{display:flex;flex-wrap:wrap;gap:40px 80px}
.faq .h2{flex:1 1 300px}
.faq__list{flex:2 1 520px;border-top:1px solid var(--line)}
details{border-bottom:1px solid var(--line)}
summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:24px;min-height:44px;padding:22px 0;font-size:19px;font-weight:700}
summary::-webkit-details-marker{display:none}
summary .plus{flex:0 0 auto;font-size:26px;font-weight:400;color:var(--green);transition:transform .25s var(--ease)}
details[open] summary .plus{transform:rotate(45deg)}
details p{padding:0 0 24px;max-width:620px;font-size:16px;line-height:1.65;color:var(--dim)}

/* contact */
.contact{background:var(--surface);border-radius:8px;padding:clamp(28px,5vw,64px);display:flex;flex-wrap:wrap;gap:48px 72px}
.contact__intro{flex:1 1 320px;display:flex;flex-direction:column;gap:22px}
.contact__steps{display:flex;flex-direction:column;gap:12px;font-size:15px;color:var(--muted)}
.contact__steps div{display:flex;gap:12px;align-items:baseline}
.contact__steps b{color:var(--green);font-variant-numeric:tabular-nums}
.form{flex:1 1 400px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
@media (max-width:560px){.form{grid-template-columns:1fr}}
.field{display:flex;flex-direction:column;gap:8px;min-width:0}
.field--full{grid-column:1/-1}
.field label,.field legend{font-size:14px;font-weight:600;color:var(--muted);padding:0}
.req{color:var(--green)}
.input{min-height:48px;padding:0 14px;background:var(--bg);border:1px solid rgba(242,238,227,.22);border-radius:4px;color:var(--fg);font:500 16px Montserrat,sans-serif;width:100%;outline:none;transition:border-color .2s}
textarea.input{padding:12px 14px;line-height:1.5;resize:vertical;min-height:120px}
select.input{appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--green) 50%),linear-gradient(135deg,var(--green) 50%,transparent 50%);background-position:calc(100% - 20px) 21px,calc(100% - 15px) 21px;background-size:5px 5px;background-repeat:no-repeat;padding-right:40px}
.input:focus{border-color:var(--green)}
.field.has-error .input{border-color:#E39B7B}
.err{font-size:13px;color:#E8A98C;min-height:0}
fieldset{border:0;margin:0;padding:0;min-width:0}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.chip{position:relative}
.chip input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer;z-index:1}
.chip span{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border:1px solid rgba(242,238,227,.22);border-radius:22px;font-size:14px;font-weight:600;color:var(--muted);transition:background .2s,color .2s,border-color .2s}
.chip input:checked+span{background:var(--green);border-color:var(--green);color:var(--bg)}
.chip input:focus-visible+span{outline:2px solid var(--green);outline-offset:2px}
.field.has-error .chip span{border-color:#E39B7B}
.consent{display:flex;gap:12px;align-items:flex-start;font-size:14px;line-height:1.55;color:var(--dim)}
.consent input{flex:0 0 auto;width:20px;height:20px;margin:2px 0 0;accent-color:var(--green)}
.form__submit{grid-column:1/-1;display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.form__note{font-size:13px;color:var(--faint)}

/* floating */
.fab{position:fixed;right:20px;bottom:calc(20px + env(safe-area-inset-bottom,0px));z-index:50;border-radius:26px;box-shadow:0 10px 30px rgba(0,0,0,.5);transition:transform .3s var(--ease),opacity .3s}
.fab.is-hidden{opacity:0;transform:translateY(20px);pointer-events:none}

/* footer */
.footer{border-top:1px solid var(--line-soft);margin-top:40px}
.footer__in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px;padding:32px 24px 40px}
.footer__brand{display:flex;align-items:center;gap:14px;font-size:14px;color:var(--faint)}
.footer__brand img{height:30px;width:auto}
.footer__links{display:flex;gap:24px;font-size:14px}
.footer__links a{color:var(--dim);min-height:44px;display:inline-flex;align-items:center}

/* legal pages */
.legal{max-width:780px;margin:0 auto;padding:clamp(56px,8vw,104px) 24px 96px}
.legal h1{font-size:clamp(40px,6vw,72px);line-height:1;font-weight:800;letter-spacing:-.035em;margin-bottom:16px}
.legal .stand{font-size:14px;color:var(--faint);margin-bottom:48px}
.legal h2{font-size:20px;font-weight:800;color:var(--fg);margin:44px 0 12px}
.legal h3{font-size:17px;font-weight:700;margin:24px 0 8px}
.legal p,.legal li{font-size:16px;line-height:1.75;color:#D6D2C8}
.legal p+p{margin-top:12px}
.legal ol,.legal ul{padding-left:1.3em;margin:12px 0 0}
.legal li+li{margin-top:8px}
.legal .ph{color:var(--green)}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .js .cut,.js .fade,.js .ping{clip-path:none;opacity:1;transform:none}
  .marquee__track{animation:none;flex-wrap:wrap;width:auto}
  .marquee__set[aria-hidden]{display:none}
  .marquee__set{white-space:normal;flex-wrap:wrap}
}
@media (max-width:560px){.clip{font-size:0;padding:0}}
[hidden]{display:none!important}
