/* Novatrade — landing styles. Tokens from HANDOFF §3. */
:root{
  --bg:#F5F2EA;--surface:#FFFFFF;--surface2:#E8E1CF;--ink:#1A1F1B;--muted:#3D453E;--soft:#5E665C;--line:#DDD5C1;
  --accent:#1F4D2B;--label:#8A7A3A;--btn:#1F4D2B;--btnInk:#F5F2EA;--chip:#E8E1CF;--input:#F5F2EA;--inputLine:#D6CFBB;--deep:#12301B;
  --green:#12301B;--gold:#C9A227;--gold2:#E8D48A;--cream:#F5F2EA;
  --ease:cubic-bezier(.16,1,.3,1);--ease-draw:cubic-bezier(.65,0,.35,1);
  --gutter:clamp(20px,5vw,64px);
  --sans:'Outfit','Noto Sans SC',system-ui,sans-serif;--serif:'Newsreader','Noto Sans SC',Georgia,serif;--mono:'IBM Plex Mono','Noto Sans SC',ui-monospace,monospace;
  color-scheme:light;
}
:root[data-theme=dark]{
  --bg:#0C1710;--surface:#14241A;--surface2:#101E15;--ink:#EEF0EA;--muted:#BAC5B9;--soft:#8D9A8C;--line:rgba(238,240,234,.12);
  --accent:#E8D48A;--label:#C9A227;--btn:#C9A227;--btnInk:#12301B;--chip:#1C3324;--input:#0F1C14;--inputLine:rgba(238,240,234,.18);--deep:#08120B;
  color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:72px}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden;transition:background .5s,color .5s}
img,video,canvas,svg{display:block;max-width:100%}
picture{display:contents} /* AVIF/WebP wrapper: layout is driven by the <img> inside */
a{color:inherit;text-decoration:none}
a:hover{color:var(--gold)}
h1,h2,h3,p{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
button,input,textarea{font:inherit}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:4px}
.skip{position:fixed;left:16px;top:-60px;z-index:200;background:var(--gold);color:var(--green);padding:10px 16px;border-radius:999px;font-weight:500;transition:top .2s}
.skip:focus{top:12px;color:var(--green)}

/* Type */
.kicker{font-family:var(--mono);font-size:12px;letter-spacing:.14em;color:var(--label);text-transform:uppercase}
.kicker-gold{color:var(--gold2);letter-spacing:.16em}
.em{font-family:var(--serif);font-style:italic;font-weight:400;color:var(--accent)}
.h1{font-weight:600;font-size:clamp(40px,7.4vw,108px);letter-spacing:-.035em;line-height:1;text-wrap:balance;display:flex;flex-direction:column}
.h1 .em,.reach .em,.process .em,.svc .em{color:var(--gold2)}
.h2{font-weight:500;font-size:clamp(34px,4.4vw,62px);letter-spacing:-.03em;line-height:1.04;text-wrap:balance}
.h2-xl{font-size:clamp(38px,5.4vw,80px);line-height:1;letter-spacing:-.035em;max-width:980px}
.h2-lg{font-size:clamp(40px,5vw,72px);line-height:1;letter-spacing:-.035em}
.h2-md{font-size:clamp(36px,4.5vw,60px);line-height:1.05}
.h3{font-weight:600;font-size:clamp(30px,3.6vw,52px);letter-spacing:-.03em;line-height:1.02}
.lead{font-size:18px;line-height:1.6;color:var(--muted);text-wrap:pretty}
.lead-dark{color:#C9D3C9}
.mono{font-family:var(--mono);letter-spacing:.08em}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;font-weight:500;font-size:16px;border-radius:999px;padding:13px 28px;cursor:pointer;border:none;transition:background .3s,color .3s,border-color .3s,opacity .3s;text-align:center}
.btn-cream{background:var(--cream);color:var(--green)}
.btn-cream:hover{background:var(--gold2);color:var(--green)}
.btn-ghost{color:var(--cream);border:1.5px solid rgba(245,242,234,.6)}
.btn-ghost:hover{border-color:var(--gold2);color:var(--gold2)}
.btn-solid{background:var(--btn);color:var(--btnInk);align-self:flex-start}
.btn-solid:hover{opacity:.88;color:var(--btnInk)}
.icon-btn{width:40px;height:40px;border-radius:50%;border:1px solid rgba(245,242,234,.3);background:transparent;color:var(--cream);cursor:pointer;display:flex;align-items:center;justify-content:center;flex:none;transition:border-color .3s}
.icon-btn:hover{border-color:var(--gold2)}

/* Loader (first visit per session only — see inline script) */
.loader{display:none}
.nt-loading .loader{position:fixed;inset:0;z-index:100;background:var(--green);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px}
.loader-grain{overflow:visible}
.loader .g{transform-origin:32px 32px;animation:grainIn 1.1s var(--ease) both}
.loader .l{stroke-dasharray:1;stroke-dashoffset:1;animation:draw .7s .8s var(--ease-draw) both}
.loader-word{font:600 32px var(--sans);letter-spacing:-.03em;color:var(--cream);animation:wordIn .8s 1s var(--ease) both}
.loader.out{animation:fadeOut .6s ease-in-out both}
@keyframes grainIn{0%{transform:rotate(-200deg) scale(0);opacity:0}75%{transform:rotate(8deg) scale(1.06);opacity:1}100%{transform:none;opacity:1}}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes wordIn{from{opacity:0;transform:translateY(12px);letter-spacing:.1em}to{opacity:1;transform:none;letter-spacing:-.03em}}
@keyframes fadeOut{to{opacity:0;transform:scale(1.04);visibility:hidden}}

/* Header */
.hdr{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px clamp(16px,4vw,56px);padding-top:max(18px,env(safe-area-inset-top));color:var(--cream);transition:background .4s,backdrop-filter .4s,padding .4s}
.hdr.solid{background:rgba(10,26,15,.78);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);padding-top:12px;padding-bottom:12px}
.hdr a:hover{color:var(--gold2)}
.brand{display:flex;align-items:center;gap:10px;flex:none;min-height:44px}
.brand-word{font-weight:600;font-size:23px;letter-spacing:-.03em;font-family:'Outfit',sans-serif}
.nav{display:flex;gap:26px;font-size:15px;white-space:nowrap;justify-content:center}
.hdr-actions{display:flex;align-items:center;gap:10px;flex:none}
.langs{display:flex;border:1px solid rgba(245,242,234,.3);border-radius:999px;padding:3px}
.langs a{font:500 12px var(--mono);letter-spacing:.06em;border-radius:999px;padding:7px 11px;color:var(--cream);transition:background .3s,color .3s}
.langs a.on{background:var(--cream);color:var(--green)}
.theme-btn .i-sun{display:none}
[data-theme=dark] .theme-btn .i-sun{display:block}
[data-theme=dark] .theme-btn .i-moon{display:none}
.hdr-cta{font-weight:500;font-size:14px;background:var(--gold);color:var(--green);border-radius:999px;padding:11px 20px;white-space:nowrap}
.hdr .hdr-cta:hover{background:var(--gold2);color:var(--green)}
.menu-btn{display:none;border:none;background:var(--gold);color:var(--green)}
.menu{position:absolute;top:100%;right:clamp(16px,4vw,56px);left:auto;margin-top:8px;min-width:240px;background:rgba(10,26,15,.94);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1px solid rgba(245,242,234,.14);border-radius:12px;padding:12px;display:flex;flex-direction:column;font-size:16px}
.menu[hidden]{display:none}
.menu a{padding:12px 14px;border-radius:8px;min-height:44px}
.menu a:hover{background:rgba(245,242,234,.06)}
.menu .menu-cta{margin-top:6px;border-radius:999px;background:var(--gold);color:var(--green);font-weight:500;text-align:center}
.hdr .menu .menu-cta:hover{background:var(--gold2);color:var(--green)}
@media (max-width:1179px){.nav{display:none}.menu-btn{display:flex}}
@media (min-width:1180px){.menu{display:none!important}}
@media (max-width:759px){.hdr-cta{display:none}}
@media (max-width:639px){.hdr-actions{gap:6px}.langs a{padding:7px 8px}}
@media (max-width:419px){.brand-word{display:none}}

/* Hero */
.hero{position:relative;height:100vh;height:100svh;min-height:680px;display:flex;flex-direction:column;overflow:hidden;background:var(--green);color:var(--cream)}
.hero-media{position:absolute;inset:-6% 0 0 0;height:112%;will-change:transform}
.hero-slide{position:absolute;inset:0;opacity:0;transition:opacity 1.6s ease}
.hero-slide.on{opacity:1}
.hero-slide img,.hero-slide video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
/* The video only covers its HD image once it is fully downloaded and playing. */
.hero-slide video{opacity:0;transition:opacity 1.2s ease}
.hero-slide video.ready{opacity:1}
.hero-shade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(18,48,27,.78) 0%,rgba(18,48,27,.25) 42%,rgba(18,48,27,.94) 100%)}
.seeds{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.seeds div{position:absolute;left:0;top:0;will-change:transform}
.hero-body{position:relative;z-index:2;flex:1;display:flex;flex-direction:column;justify-content:flex-end;gap:clamp(18px,3vh,28px);padding:0 var(--gutter) clamp(40px,9vh,112px);padding-bottom:max(clamp(40px,9vh,112px),env(safe-area-inset-bottom));max-width:1160px}
.hero .kicker{letter-spacing:.18em}
.hero-foot{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:28px}
.hero-p{max-width:540px;font-size:clamp(17px,1.5vw,20px);line-height:1.55;color:#DCE3DA;text-wrap:pretty}
.hero-ctas{display:flex;flex-wrap:wrap;gap:12px}
.hero-ctas .btn{flex:1 1 auto}
.hero-dots{position:absolute;z-index:2;right:var(--gutter);top:50%;display:flex;flex-direction:column;gap:6px;transform:translateY(-50%)}
.hero-dots button{width:24px;height:44px;border:none;background:none;padding:0;cursor:pointer;display:flex;align-items:center;justify-content:center}
.hero-dots button::before{content:"";width:4px;height:12px;border-radius:4px;background:rgba(245,242,234,.4);transition:all .5s}
.hero-dots button[aria-current=true]::before{height:32px;background:var(--gold2)}
@media (max-width:639px){
  .hero{min-height:560px}
  .hero-ctas{width:100%}
  .hero-dots{display:none}
}

/* Reach / globe */
.reach{position:relative;height:max(100vh,760px);background:var(--deep);color:var(--cream);overflow:hidden;transition:background .5s}
.globe{position:absolute;left:50%;top:44%;transform:translateX(-50%);width:min(125vw,1400px);max-width:none;aspect-ratio:1;cursor:grab;touch-action:pan-y}
.reach-fade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,var(--deep) 0%,rgba(0,0,0,0) 42%)}
.reach-body{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;text-align:center;gap:20px;padding:clamp(96px,14vh,140px) var(--gutter) 0;pointer-events:none}
.reach-body .lead{max-width:560px}
.legend{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:8px}
.legend li{display:flex;align-items:center;gap:10px;padding:10px 16px;border-radius:999px;background:rgba(8,18,11,.55);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(245,242,234,.14);font-size:14px}
.drag-hint{position:absolute;z-index:2;bottom:28px;left:50%;transform:translateX(-50%);font-family:var(--mono);font-size:11px;letter-spacing:.16em;color:rgba(245,242,234,.6);pointer-events:none;white-space:nowrap}
@media (max-width:639px){.globe{width:190vw;top:56%}.reach{height:max(100svh,720px)}}

/* Pinned horizontal sections. Base = native swipe (mobile / reduced motion). .hs-on = pinned desktop mode. */
.hs{position:relative;background:var(--bg);transition:background .5s}
.hs-sticky{overflow:hidden}
.hs-track{display:flex;gap:clamp(24px,3vw,48px);padding:clamp(80px,12vw,120px) var(--gutter);align-items:center}
.hs-intro{flex:none;width:min(84vw,520px);display:flex;flex-direction:column;gap:20px}
.hs-intro-narrow{width:min(84vw,460px)}
.swipe{display:flex;align-items:center;gap:12px;font-family:var(--mono);font-size:12px;letter-spacing:.14em;color:var(--soft)}
.hs-end{flex:none;width:8vw}
.hs-end-wide{width:30vw}
.svc{flex:none;width:min(88vw,940px);height:min(72vh,600px);border-radius:12px;overflow:hidden;position:relative;display:flex;align-items:flex-end;color:var(--cream);background:var(--green)}
.svc img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.svc::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,22,14,0) 35%,rgba(10,22,14,.88) 100%)}
.svc-body{position:relative;z-index:1;padding:clamp(24px,3.5vw,48px);display:flex;flex-direction:column;gap:12px;max-width:560px}
.svc-body p:last-child{font-size:17px;line-height:1.6;color:#DCE3DA}
.hs-on .hs-sticky{position:sticky;top:0;height:100vh;display:flex;align-items:center}
.hs-on .hs-track{flex:none;width:max-content;padding:64px var(--gutter) 0;will-change:transform}
/* Native (non-pinned) fallback */
html:not(.hs-on) .about .hs-track{overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;scroll-padding:0 var(--gutter)}
html:not(.hs-on) .about .hs-track::-webkit-scrollbar{display:none}
html:not(.hs-on) .about .hs-track>*{scroll-snap-align:start}
html:not(.hs-on) .about .hs-intro{width:min(84vw,520px)}
html:not(.hs-on) .about .hs-end{width:1px}
@media (max-width:899px){
  html:not(.hs-on) .about .svc{height:min(70svh,520px)}
}

/* Ribbon */
.ribbon{background:var(--gold);color:var(--green);overflow:hidden;padding:20px 0}
.ribbon-track{display:flex;width:max-content}
.js .ribbon-track{animation:marquee 50s linear infinite}
.ribbon-set{display:flex;gap:44px;padding-right:44px;align-items:center;font-weight:500;font-size:clamp(22px,2.6vw,34px);letter-spacing:-.01em;white-space:nowrap}
.ribbon-set li{display:flex;align-items:center;gap:14px;padding-right:30px}
.ribbon-ico{width:46px;height:46px;border-radius:50%;background:var(--green);color:var(--gold2);display:flex;align-items:center;justify-content:center;flex:none}
@keyframes marquee{to{transform:translateX(-50%)}}

/* Products carousel */
.products{background:var(--surface2);padding:clamp(80px,11vw,140px) 0;overflow:hidden;transition:background .5s}
.products-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:24px;padding:0 var(--gutter);margin-bottom:48px}
.products-intro{display:flex;flex-direction:column;gap:16px;max-width:640px}
.car-nav{display:flex;gap:10px}
.car-btn{width:52px;height:52px;border-radius:50%;border:1px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:border-color .3s,opacity .3s}
.car-btn:hover{border-color:var(--gold)}
.car-btn-solid{border:none;background:var(--btn);color:var(--btnInk)}
.car-btn-solid:hover{opacity:.85}
.car{cursor:grab;touch-action:pan-y;user-select:none;-webkit-user-select:none}
.car.dragging{cursor:grabbing}
.car-track{display:flex;gap:24px;width:max-content;padding:0 var(--gutter);will-change:transform}
.card{flex:none;width:min(80vw,clamp(290px,30vw,400px))}
.card article{height:100%;background:var(--surface);border-radius:12px;overflow:hidden;display:flex;flex-direction:column;transition:background .5s,transform .5s var(--ease)}
.card article:hover{transform:translateY(-6px)}
.card-media{position:relative;aspect-ratio:4/3;overflow:hidden;background:#D9D0B8}
.card-media img{width:100%;height:100%;object-fit:cover;pointer-events:none}
.badge{position:absolute;top:14px;left:14px;font-family:var(--mono);font-size:11px;letter-spacing:.1em;padding:6px 11px;border-radius:999px;background:rgba(18,48,27,.85);color:var(--cream)}
.badge-soon{background:var(--gold);color:var(--green)}
.card-body{padding:24px;display:flex;flex-direction:column;gap:12px;flex:1}
.card-title{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.card-title h3{font-weight:600;font-size:32px;letter-spacing:-.025em}
.card-n{font-family:var(--mono);font-size:12px;color:var(--label)}
.card-body>p{font-size:15px;line-height:1.6;color:var(--muted);text-wrap:pretty}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:auto;padding-top:8px}
.chips li{font-size:13px;padding:6px 11px;border-radius:999px;background:var(--chip);color:var(--accent)}
/* No JS / reduced motion: plain swipe list */
html:not(.car-on) .car{overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;cursor:auto;touch-action:auto}
html:not(.car-on) .car::-webkit-scrollbar{display:none}
html:not(.car-on) .card{scroll-snap-align:center}

/* Process */
.process{background:var(--deep);color:var(--cream)}
.process .hs-track{align-items:flex-start}
.steps{position:relative;display:flex;gap:clamp(56px,6vw,104px)}
.steps-line{position:absolute;left:52px;right:52px;top:51px;height:2px;background:repeating-linear-gradient(90deg,rgba(245,242,234,.22) 0 6px,transparent 6px 14px)}
.steps-route{position:absolute;left:52px;top:50px;height:4px;width:0;border-radius:4px;background:var(--gold)}
.steps-trav{position:absolute;left:44px;top:44px;transform:rotate(90deg)}
.step{flex:none;width:clamp(260px,25vw,340px);display:flex;flex-direction:column;gap:18px;position:relative}
.ring{position:relative;width:104px;height:104px;border-radius:50%;border:1.5px solid rgba(232,212,138,.6);background:var(--deep);color:var(--gold2);display:flex;align-items:center;justify-content:center;transition:background .6s,color .6s,border-color .6s,transform .6s var(--ease)}
.step.on .ring{background:var(--gold);color:var(--green);border-color:var(--gold);transform:scale(1.06)}
.ring svg *{stroke-dasharray:1}
.step.on .ring svg *{animation:drawIcon .9s var(--ease-draw) both}
.step.on .ring svg *:nth-child(2){animation-delay:.12s}
.step.on .ring svg *:nth-child(3){animation-delay:.24s}
.step.on .ring svg *:nth-child(4){animation-delay:.36s}
@keyframes drawIcon{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
.step-n{font-family:var(--mono);font-size:13px;letter-spacing:.14em;color:var(--gold2)}
.step-t{font-weight:600;font-size:clamp(24px,2.3vw,32px);letter-spacing:-.015em;line-height:1.1}
.step-d{font-size:17px;line-height:1.6;color:#C9D3C9}
/* Non-pinned: vertical timeline */
html:not(.hs-on) .process .hs-track{flex-direction:column;align-items:stretch;gap:56px}
html:not(.hs-on) .process .hs-intro{width:auto;max-width:640px}
html:not(.hs-on) .process .hs-end{display:none}
html:not(.hs-on) .steps{flex-direction:column;gap:40px}
html:not(.hs-on) .step{width:auto;display:grid;grid-template-columns:72px 1fr;column-gap:20px;row-gap:6px}
html:not(.hs-on) .step .ring{width:72px;height:72px;grid-row:1/span 3}
html:not(.hs-on) .step .ring svg{width:30px;height:30px}
html:not(.hs-on) .steps-line{left:35px;right:auto;top:36px;bottom:36px;width:2px;height:auto;background:repeating-linear-gradient(180deg,rgba(245,242,234,.22) 0 6px,transparent 6px 14px)}
html:not(.hs-on) .steps-route,html:not(.hs-on) .steps-trav{display:none}

/* Contact */
.contact{background:var(--bg);padding:clamp(80px,12vw,160px) var(--gutter);transition:background .5s}
.contact-grid{max-width:1320px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:64px}
.contact-intro{display:flex;flex-direction:column;gap:20px}
.contact-intro .lead{font-size:19px;max-width:460px}
.contact-photo{width:100%;max-width:460px;aspect-ratio:16/10;border-radius:12px;overflow:hidden;margin-top:12px;background:var(--surface2)}
.contact-photo img{width:100%;height:100%;object-fit:cover}
.contact-side{align-self:start}
.form{background:var(--surface);border-radius:12px;padding:clamp(24px,4vw,40px);display:flex;flex-direction:column;gap:20px;transition:background .5s}
.interest{border:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.interest legend{font-size:14px;font-weight:500;padding:0;margin-bottom:8px}
.pills{display:flex;flex-wrap:wrap;gap:8px}
.pill{position:relative;cursor:pointer}
.pill input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.pill span{display:inline-flex;align-items:center;min-height:44px;font-weight:500;font-size:15px;padding:10px 18px;border-radius:999px;border:1px solid var(--inputLine);color:var(--accent);transition:all .3s}
.pill input:checked+span{background:var(--btn);border-color:var(--btn);color:var(--btnInk)}
.pill input:focus-visible+span{outline:2px solid var(--gold);outline-offset:3px}
.form-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px}
.field{display:flex;flex-direction:column;gap:6px;font-size:14px;font-weight:500}
.field input,.field textarea{font-size:16px;font-weight:400;padding:14px 16px;border:1px solid var(--inputLine);border-radius:8px;background:var(--input);color:var(--ink);outline:none;transition:border-color .3s;width:100%}
.field textarea{resize:vertical;min-height:120px}
.field input:focus,.field textarea:focus{border-color:var(--gold)}
.field input[aria-invalid=true]{border-color:#B4472F}
.form-status{font-size:14px;color:var(--soft)}
.form-status.err{color:#B4472F}
[data-theme=dark] .form-status.err{color:#F08A6E}
.hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.form{position:relative}
.sent{background:var(--btn);color:var(--btnInk);border-radius:12px;padding:48px;display:flex;flex-direction:column;gap:16px}
.sent[hidden]{display:none}
.sent-t{font-weight:600;font-size:28px}

/* Footer */
.footer{background:var(--deep);color:#C9D3C9;padding:64px var(--gutter) 40px;padding-bottom:max(40px,env(safe-area-inset-bottom));transition:background .5s}
.footer-in{max-width:1320px;margin:0 auto;display:flex;flex-direction:column;gap:48px}
.footer-brand{display:flex;align-items:center;gap:12px}
.footer-brand>span{display:flex;flex-direction:column;gap:4px}
.footer-word{font-family:'Outfit',sans-serif;font-weight:600;font-size:28px;letter-spacing:-.03em;color:var(--cream);line-height:1}
.footer-tag{font-weight:500;font-size:10px;letter-spacing:.32em;color:var(--gold2)}
.footer-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;border-top:1px solid rgba(245,242,234,.15);padding-top:24px;font-size:13px}

.footer-top{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.2fr;gap:40px}
.footer-col{display:flex;flex-direction:column;gap:6px;font-size:15px}
.footer-col a{padding:6px 0;align-self:flex-start}
.footer-about{gap:18px}
.footer-about p{font-size:14px;line-height:1.6;max-width:320px}
.footer-h{font-family:var(--mono);font-size:12px;letter-spacing:.14em;color:var(--gold2);text-transform:uppercase;margin-bottom:6px}
.footer-cta{display:inline-flex;align-items:center;gap:8px;color:var(--gold2);font-weight:500}
@media (max-width:900px){.footer-top{grid-template-columns:1fr 1fr}.footer-about{grid-column:1/-1}}
@media (max-width:480px){.footer-top{grid-template-columns:1fr}}

/* ---------- Multi-page ---------- */
.nav a[aria-current=page],.menu a[aria-current=page]{color:var(--gold2)}
.nav a{position:relative}
.nav a[aria-current=page]::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;border-radius:2px;background:var(--gold)}
.link-cream,.link-accent{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-weight:500;font-size:16px;align-self:flex-start;transition:gap .3s var(--ease),color .3s}
.link-cream{color:var(--cream)}
.link-accent{color:var(--accent)}
.link-cream:hover,.link-accent:hover{gap:12px;color:var(--gold)}
.svc-body .link-cream{margin-top:4px}
.muted{color:var(--muted)}
.num{font-family:var(--mono);font-size:13px;letter-spacing:.14em;color:var(--label)}

/* Inner page hero */
.phero{position:relative;background:var(--deep);color:var(--cream);overflow:hidden;display:flex;align-items:flex-end;min-height:min(560px,70svh)}
.phero-img{min-height:min(720px,82svh)}
.phero-media{position:absolute;left:0;right:0;top:-8%;height:116%;will-change:transform}
.phero-media picture,.phero-media img{display:block;width:100%;height:100%;object-fit:cover}
.phero .seeds,.pd-hero .seeds{z-index:1}
.phero-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(18,48,27,.82) 0%,rgba(18,48,27,.45) 45%,rgba(18,48,27,.95) 100%)}
.phero-body{position:relative;z-index:2;display:flex;flex-direction:column;gap:clamp(16px,2.4vh,24px);padding:140px var(--gutter) clamp(48px,8vh,96px);max-width:1160px}
.h1-page{font-size:clamp(38px,6vw,84px);display:block}
.h1-page .em{color:var(--gold2)}
.crumbs ol{display:flex;flex-wrap:wrap;gap:6px 10px;font-family:var(--mono);font-size:12px;letter-spacing:.08em;color:rgba(245,242,234,.7);list-style:none;margin:0;padding:0}
.crumbs li+li::before{content:"/";margin-right:10px;opacity:.5}
.crumbs a{text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(245,242,234,.3)}
.crumbs a:hover{color:var(--gold2)}

/* Generic sections */
.section{background:var(--bg);padding:clamp(72px,10vw,128px) var(--gutter);transition:background .5s}
.section-alt{background:var(--surface2)}
.section>*{max-width:1320px;margin-left:auto;margin-right:auto}
.section-title{margin-bottom:clamp(32px,4vw,48px)}
.section-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:clamp(32px,4vw,48px)}
.h3-sm{font-size:clamp(24px,2.4vw,32px);font-weight:600;letter-spacing:-.02em;line-height:1.1}

/* Product grid (products page + "other products") */
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,340px),1fr));gap:24px}
.pgrid-5{grid-template-columns:repeat(auto-fill,minmax(min(100%,220px),1fr))}
.pgrid .card{width:auto}
.card-a{display:block;height:100%;color:inherit}
.card-a:hover{color:inherit}
.card-a:hover .card-more{gap:12px;color:var(--gold)}
.card-a:focus-visible{outline-offset:4px;border-radius:12px}
.card-more{display:inline-flex;align-items:center;gap:8px;color:var(--accent);font-weight:500;font-size:15px;margin-top:6px;transition:gap .3s var(--ease),color .3s}
.section-alt .card article{background:var(--surface)}
@media (max-width:640px){
  .pgrid-scroll{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin:0 calc(var(--gutter)*-1);padding:0 var(--gutter) 8px;gap:16px}
  .pgrid-scroll::-webkit-scrollbar{display:none}
  .pgrid-scroll .card{flex:none;width:78vw;scroll-snap-align:start}
}
.car-nav{align-items:center;flex-wrap:wrap}
.car-nav .link-accent{margin-right:8px}

/* Product detail */
.pd-hero{position:relative;overflow:hidden;background:var(--deep);color:var(--cream);padding:clamp(112px,14vh,148px) var(--gutter) clamp(56px,8vw,96px)}
.pd-grid{position:relative;z-index:2;max-width:1320px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,72px);align-items:center}
.pd-text{display:flex;flex-direction:column;gap:20px}
.pd-text .kicker{display:flex;align-items:center;gap:10px}
.pd-ico{width:36px;height:36px;border-radius:50%;background:rgba(232,212,138,.14);display:inline-flex;align-items:center;justify-content:center;color:var(--gold2)}
.badge-inline{position:static;align-self:flex-start}
.pd-note{color:var(--gold2);font-size:16px}
.pd-media{border-radius:12px;overflow:hidden;aspect-ratio:4/3;background:#1C3324}
.pd-media img{width:100%;height:100%;object-fit:cover}
.pd-cols{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.pd-block,.pd-supply{background:var(--surface);border-radius:12px;padding:clamp(24px,3vw,40px);display:flex;flex-direction:column;gap:20px;transition:background .5s}
.pd-supply{margin-top:24px}
.checks{display:flex;flex-direction:column;gap:14px}
.checks li{display:flex;gap:12px;align-items:flex-start;font-size:17px;line-height:1.5}
.checks svg{flex:none;margin-top:3px;color:var(--accent)}
.chips-lg li{font-size:15px;padding:9px 16px}
.numbered{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:20px 28px}
.numbered li{display:flex;flex-direction:column;gap:8px;font-size:16px;line-height:1.5;border-top:1px solid var(--line);padding-top:16px}
@media (max-width:900px){.pd-grid,.pd-cols{grid-template-columns:1fr}.pd-media{order:-1}}

/* Services */
.split-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:24px}
.scard{background:var(--surface);border-radius:12px;padding:clamp(24px,3vw,40px);display:flex;flex-direction:column;gap:16px;transition:background .5s}
.scard .link-accent{margin-top:auto}
.scard-img{position:relative;overflow:hidden;padding:0;color:var(--cream);min-height:440px;justify-content:flex-end;background:var(--green)}
.scard-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.scard-img::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,22,14,.1) 20%,rgba(10,22,14,.9) 100%)}
.scard-body{position:relative;z-index:1;padding:clamp(24px,3vw,40px);display:flex;flex-direction:column;gap:12px}
.scard-body p:not(.kicker){color:#DCE3DA}
.cover,.values{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:24px}
.cover li,.values li{background:var(--surface);border-radius:12px;padding:clamp(24px,3vw,32px);display:flex;flex-direction:column;gap:10px;transition:background .5s}
.cover h3,.values h3{font-size:22px;font-weight:600;letter-spacing:-.015em}
.cover p,.values p{color:var(--muted);line-height:1.6}

/* About */
.section>.story{max-width:880px}
.story-p{font-size:clamp(20px,2.1vw,27px);line-height:1.5;letter-spacing:-.01em;margin-bottom:28px;text-wrap:pretty}
.story-p:last-child{margin-bottom:0;color:var(--muted)}

/* CTA band */
.cta-band{background:var(--deep);color:var(--cream);padding:clamp(72px,10vw,128px) var(--gutter);transition:background .5s}
.cta-in{max-width:900px;margin:0 auto;display:flex;flex-direction:column;align-items:center;text-align:center;gap:20px}
.cta-in .lead{max-width:620px}
.cta-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:8px}

/* Contact page */
.direct{border:1px solid var(--line);border-radius:12px;padding:24px;display:flex;flex-direction:column;gap:8px;max-width:460px}
.direct-t{font-weight:600;font-size:18px}
.direct-mail{display:inline-flex;align-items:center;gap:10px;color:var(--accent);font-weight:500;font-size:17px;min-height:44px;word-break:break-all}
.select{position:relative;display:block}
.select select{appearance:none;-webkit-appearance:none;width:100%;font:400 16px var(--sans);padding:14px 44px 14px 16px;border:1px solid var(--inputLine);border-radius:8px;background:var(--input);color:var(--ink);outline:none;cursor:pointer;transition:border-color .3s}
.select select:focus{border-color:var(--gold)}
.select::after{content:"";position:absolute;right:18px;top:50%;width:8px;height:8px;border-right:2px solid var(--soft);border-bottom:2px solid var(--soft);transform:translateY(-70%) rotate(45deg);pointer-events:none}

.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* WhatsApp */
.btn-wa{gap:10px;background:#25D366;color:#0B3B1E}
.btn-wa:hover{background:#3EE07C;color:#0B3B1E}
.wa-float{position:fixed;z-index:60;right:max(18px,env(safe-area-inset-right));bottom:max(18px,env(safe-area-inset-bottom));display:flex;align-items:center;justify-content:center;width:58px;height:58px;border-radius:50%;background:#25D366;color:#0B3B1E;box-shadow:0 10px 30px rgba(0,0,0,.28);transition:transform .3s var(--ease),background .3s}
.wa-float:hover{background:#3EE07C;color:#0B3B1E;transform:translateY(-3px)}
.wa-float:focus-visible{outline:2px solid var(--gold);outline-offset:4px}
.nt-loading .wa-float{display:none}
.footer-contact{display:inline-flex;align-items:center;gap:8px}
.direct-wa{color:#1A9E4B}
[data-theme=dark] .direct-wa{color:#3EE07C}
.direct-note{font-size:14px}

/* Image cards (services) */
.scard-img{min-height:520px}
.scard-img .checks li{font-size:16px;color:#E6EBE4}
.scard-img .checks svg{color:var(--gold2)}
.scard-img .scard-body{gap:14px}
/* Text-heavy cards: darker veil over the whole photo so every line stays readable. */
.scard-dense::after{background:linear-gradient(180deg,rgba(10,22,14,.62) 0%,rgba(10,22,14,.8) 40%,rgba(10,22,14,.95) 100%)}
.scard-dense .scard-body{text-shadow:0 1px 12px rgba(0,0,0,.35)}
.scard-img .link-cream{margin-top:4px}
.cover-card{position:relative;overflow:hidden;min-height:320px;padding:0!important;justify-content:flex-end;color:var(--cream);background:var(--green)!important}
.cover-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.cover-card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,22,14,.15) 10%,rgba(10,22,14,.92) 100%)}
.cover-card:hover img{transform:scale(1.05)}
.cover-body{position:relative;z-index:1;padding:clamp(22px,2.6vw,30px);display:flex;flex-direction:column;gap:8px}
.cover-card .num{color:var(--gold2)}
.cover-card p{color:#DCE3DA!important}

/* 404 */
.nf-links{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px 28px}

/* Reveal (only when JS is running and motion is allowed) */
@media (prefers-reduced-motion:no-preference){
  .js [data-reveal]{opacity:0;transform:translateY(32px);filter:blur(6px)}
  .js [data-reveal].in{opacity:1;transform:none;filter:none;transition:opacity 1s var(--ease),transform 1s var(--ease),filter 1s var(--ease);transition-delay:var(--d,0ms)}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .ribbon-track{animation:none}
  .hero-slide video{display:none}
}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
@media (pointer:coarse){.icon-btn{width:44px;height:44px}.langs a{padding-top:11px;padding-bottom:11px}}
