/* Reference measurements: 1440×900, 768×1024 and 390×844.
 * Layout is content-driven. Media boxes retain the reference's native ratios.
 * No section-height replicas, pin spacers or corrective negative margins.
 */
:root {
  --ink:#212529;
  --container-max: 100%;
  --content-max: calc(var(--container-max) - 24px);
  --outer: 12px;
  --type-display: min(50px, calc(23px + 2.25vw));
  --type-intro: min(60px, calc(24px + 3vw));
  --type-category: min(40px, calc(22px + 1.5vw));
  --type-heading: min(28px, calc(20.8px + .6vw));
  --type-ui: min(24px, calc(20.4px + .3vw));
  --type-stat: min(70px, calc(25px + 3.75vw));
}
@media (min-width:576px) { :root { --container-max:516px; --outer:max(12px, calc((100vw - var(--container-max)) / 2 + 12px)); } }
@media (min-width:768px) { :root { --container-max:688px; } }
@media (min-width:992px) { :root { --container-max:912px; } }
@media (min-width:1280px) { :root { --container-max:1160px; } }
@media (min-width:1400px) { :root { --container-max:1280px; } }
@media (min-width:1600px) { :root { --container-max:1500px; } }
body { background-color:#fff; background-image:radial-gradient(circle,#ebebeb 2px,transparent 2px); background-position:50%; background-size:36px 36px; background-attachment:fixed; }
.js body:not(.loaded) { overflow:hidden; scrollbar-width:none; }

.container { width:100%; max-width:var(--container-max); padding-inline:12px; }
.header-container { max-width:var(--content-max); }
.mobile-menu { background:linear-gradient(0deg,#0b9444,#07572e); border-left:1px solid rgb(0 0 0 / .175); transition:transform .3s ease-in-out; }
.menu-main,.menu-sub { transition:transform .3s ease-in-out; }
h1,h2,h3 { letter-spacing:normal; line-height:1.34; }
h1,.hero h1,.offers-intro h2,.products>h2,.partner-grid h2,
.partners .partner-grid h2,.apart>h2,.apart-copy h3,.steps h2,
.contact-intro h2,.news h2 { font-size:var(--type-display); line-height:1.34; }
.about-content h2 { font-size:var(--type-intro); line-height:1.34; }
.offer-text h3 { font-size:var(--type-category); line-height:1; }
.product-copy h3,.steps h3 { font-size:var(--type-heading); line-height:1.34; }
.section-label { font-size:var(--type-heading); line-height:1.34; font-weight:400; }
.about,.complex,.sustainable,.partners,.steps,.news { min-height:0; }

/* Hero: the subtitle uses the same wrapper / small-text scale as the reference. */
.hero { height:100vh; min-height:0; padding-top:120px; }
.hero-surface { height:100%; min-height:0; }
.hero-copy { padding:36px 12px 0; }
.hero-mark { margin-bottom:8px; }
.hero-subtitle { font-size:var(--type-ui); line-height:1.75; margin:8px 0 0; max-width:none; }
.hero-subtitle small { font-size:.875em; }
.hero-description { max-width:none; margin-top:8px; }
.hero-action { margin-top:24px; }
.hero-reveal { transform:translateY(10px); }
.hero-art { transition:filter .75s ease-in-out .3s,opacity .75s ease-in-out .3s; }
@media (min-width:768px) and (max-width:991px) {
  .hero-copy { max-width:calc(var(--content-max) + 24px); margin-inline:auto; }
}
@media (min-width:992px) {
  .hero-copy { padding-top:100px; }
  .hero-description { max-width:930px; margin-inline:auto; }
}
@media (min-width:1400px) { .hero { padding-top:124.5px; } }
@media (max-width:575px) {
  .hero-copy { padding-bottom:0; }
  .scroll-cue { display:none; }
}
@media (max-width:359px) {
  .hero { height:auto; min-height:100svh; }
  .hero-surface { height:auto; min-height:calc(100svh - 132px); }
  .hero-copy { padding-bottom:32px; }
}

/* Keep editable hero copy in its own row, above the decorative produce.
 * A growing copy row also protects shorter windows and longer editor text.
 */
.hero { height:auto; min-height:100svh; }
.hero-surface { height:auto; min-height:calc(100svh - 160px); }
.hero-copy { padding-bottom:32px; }
.hero-media { display:none; }
@media (min-width:1200px) {
  .hero-surface { display:grid; grid-template-rows:auto minmax(220px,1fr); }
  .hero-copy { grid-row:1; padding-top:clamp(36px,6vh,72px); }
  .hero-description { max-width:930px; padding-inline:24px; }
  .hero-media { display:block; grid-row:2; position:relative; min-width:0; overflow:hidden; }
  .hero-art { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center bottom; mask-image:linear-gradient(to bottom,transparent,#000 56px); }
}
@media (min-width:1400px) { .hero-surface { min-height:calc(100svh - 164.5px); } }
@media (max-width:991px) { .hero-surface { min-height:calc(100svh - 132px); } }

/* Introduction: the two pictures scale with their actual source ratios. */
.about-image img { height:auto; aspect-ratio:338 / 533; }
.about-small img { width:100%; height:auto; aspect-ratio:218 / 236; }
.about-content h2 { margin-bottom:16px; }
.about-content p+p { margin-top:16px; }
.stat>div { font-size:var(--type-stat); line-height:1.34; }
.stat p { font-size:20px; line-height:35px; font-weight:300; margin-top:0; }
@media (max-width:991px) {
  .about-image { width:calc(83.333333% - 4px + var(--outer)); max-width:none; }
  .about-small { margin:0; }
  .stats { grid-template-columns:1fr; gap:24px; }
  .stat:nth-child(odd) { text-align:left; }
}

/* Four principal categories, with the reference's offset and 8:9 media. */
.offers-grid { display:block; }
.offers-intro { padding:0; margin-bottom:24px; }
.offers-intro p { margin-top:4px; }
.offer-columns { display:grid; grid-template-columns:1fr; gap:24px; }
.offer-column { display:grid; gap:16px; padding-top:0!important; }
.offer-card { height:auto; aspect-ratio:8 / 9; }
.offer-card>img { transition:transform .2s ease-in-out; }
.offer-card:hover>img,.offer-card:focus-visible>img { transform:scale(1.2); }
.offer-card:after,.offer-card:hover:after { inset:10px; }
.offer-text { left:34px; right:34px; bottom:42px; }
.offer-text h3 { margin:0 0 8px; }
.offer-text p { font-size:16px; line-height:28px; font-weight:500; }
.offer-more { margin-top:32px; height:28px; }
.offer-more svg { width:34px; height:18px; }
@media (min-width:992px) {
  .offer-columns { grid-template-columns:1fr 1fr; gap:16px; }
}
@media (min-width:1280px) {
  .offers-grid { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:24px; align-items:start; }
  .offers-intro { grid-column:1 / span 4; position:sticky; top:24px; margin-bottom:0; }
  .offer-columns { grid-column:5 / span 8; }
  .offer-column:nth-child(2) { padding-top:112px!important; }
}
@media (min-width:1400px) { .offer-columns { grid-column:6 / span 7; } }

/* Product typography and layered art match the measured 178 / 160px sizes. */
.product-slider-wrap { max-width:var(--content-max); }
.product-art>img { object-fit:contain; background:white; }
.product-art>img.product-secondary { width:160px; height:160px; object-fit:contain; }
.product-art>img.product-secondary { transition:transform .2s ease-in-out,margin-left .2s ease-in-out; }
.card-link>span:not(.sr-only),.offer-more>span { transition:opacity .2s ease-in-out,transform .2s ease-in-out; }
.product-copy { padding-top:0; display:flex; flex-direction:column; flex:1; }
.product-copy p { font-size:16px; line-height:1.2; min-height:0; margin-bottom:16px; }
.product-copy p small { font-size:.875em; }
.product-card { min-height:0; display:flex; flex-direction:column; }
.product-art { flex-shrink:0; }
.product-copy h3 { margin-bottom:8px; }
.product-card .card-link { margin-top:auto; }
.products>h2 { margin-bottom:60px; }
@media (max-width:767px) {
  .product-slider-wrap { width:calc(100% - 24px); }
}

/* Complex and sustainability are text-led, with no reserved empty sections. */
.complex { padding:12px 0 35px; }
.complex-grid { display:block; }
.complex h2 { margin-bottom:32px; }
.complex p { margin-bottom:0; }
.complex p+p { margin-top:24px; }
.complex .cta { margin-top:65px; vertical-align:top; }
.complex figure { margin:15px calc(-1 * var(--outer) + 12px) 0 16px; }
.complex figure img { width:100%; height:auto; aspect-ratio:267 / 167; }
.complex figcaption { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
.sustainable { padding:0 0 75px; }
.sustainable .narrow { max-width:var(--container-max); }
.sustainable p { margin-top:32px; }
@media (min-width:992px) {
  .complex-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
  .complex figure { margin:0 calc(-1 * var(--outer) + 12px) 0 0; }
  .sustainable .narrow { width:50%; }
}
@media (min-width:1280px) {
  .complex { padding:10px 0 60px; }
  .sustainable { padding:10px 0 100px; }
}
@media (max-width:575px) { .complex figure { margin-right:-12px; } }
@media (min-width:1400px) {
  .complex-grid { grid-template-columns:calc((100% + 80px) * 7 / 12 - 80px) minmax(0,1fr); gap:80px; }
  .sustainable .narrow { width:746.6667px; }
}

/* Real media slots replace the old small text labels. Their height follows width. */
.partners { padding:16px 0; }
.partner-grid { display:grid; grid-template-columns:1fr; gap:24px; align-items:center; }
.partners-intro { padding-bottom:36px; }
.partner-grid h2 { margin:0; }
.partner-grid p { margin-top:8px; }
.partner-media { min-width:0; }
.partner-grid>div+div { margin-top:0; }
.partners .swiper { height:auto; max-width:100%; }
.partners .swiper-wrapper { height:auto; align-items:flex-start; }
.partners .swiper-slide { height:auto; }
.partner-column { display:flex; flex-direction:column; gap:12.5px; }
.partner-mark { width:100%; aspect-ratio:1; display:grid; place-items:center; }
.partner-mark img { width:100%; height:100%; object-fit:contain; }
.partners .slider-controls { margin-top:48px; }
@media (min-width:992px) { .partners { padding:100px 0; } }
@media (min-width:1280px) {
  .partner-grid { grid-template-columns:repeat(12,minmax(0,1fr)); gap:24px; }
  .partners-intro { grid-column:1 / span 5; }
  .partner-media { grid-column:7 / span 6; }
}
@media (min-width:1400px) {
  .partners-intro { grid-column:1 / span 6; }
  .partner-media { grid-column:8 / span 5; }
}

/* Feature panels keep their 320:237 ratio at every breakpoint. */
.apart { padding:24px 0; }
.apart>h2 { margin-bottom:48px; }
.apart-grid { grid-template-columns:1fr; }
.apart-card { height:auto; aspect-ratio:320 / 237; }
.apart-card { background:#000; }
.apart-card>img { opacity:.6; transition:transform .2s ease-in-out; }
.apart-card:after { background:none; }
.apart-card:hover>img,.apart-card:focus-visible>img { transform:scale(1.2); }
.apart-copy,.apart-card:hover .apart-copy,.apart-card:focus-visible .apart-copy { left:34px; right:34px; bottom:42px; transition:all .2s ease-in-out; }
.apart-expand { transition:opacity .2s ease-in-out,max-height .2s ease-in-out; }
.apart-expand p { font-size:16px; line-height:28px; }
@media (min-width:992px) { .apart-grid { grid-template-columns:1fr 1fr; } }

.steps { padding:16px 0; }
.steps h2 { max-width:none; }
.steps-grid { gap:112px; }
.steps li,.steps li:last-child { display:flow-root; padding:0 0 0 24px; min-height:0; margin-bottom:48px; }
.steps li p { width:100%; margin:0 0 16px; }
.steps h3 { line-height:1.75; margin:0; }
.step-number { font-size:var(--type-stat); line-height:1.34; }
.delivery-word { position:relative; display:inline-block; }
.delivery-icon { position:absolute; width:100px; height:118px; top:calc(100% - 36px); left:-28px; transform:none; margin:0; }
@media (min-width:992px) {
  .steps { padding:100px 0 16px; }
  .steps-grid { grid-template-columns:repeat(12,minmax(0,1fr)); gap:24px; }
  .steps-grid>div { grid-column:1 / span 4; }
  .steps-grid>ol { grid-column:6 / span 7; min-width:0; }
  .steps h2 { max-width:386.6667px; }
  .steps li,.steps li:last-child { padding-left:58px; margin-bottom:80px; }
  .step-number { left:10px; }
}

.contact { padding:20px 0; }
.contact-intro .leaf { height:30px; margin-bottom:4px; }
.contact-intro .leaf svg { width:58px; height:30px; }
.contact-intro p { font-size:var(--type-ui); line-height:1.2; max-width:none; }
.contact-intro p small { font-size:.875em; }
.contact-intro h2 { margin-top:4px; width:fit-content; }
.contact-grid { gap:24px; }
.form-field input,.form-field select { height:46.2px; min-height:0; font:400 12px/1.35 Montserrat,sans-serif; }
.form-field textarea { display:block; font:400 12px/1.35 Montserrat,sans-serif; }
.form-field select { appearance:none; padding-right:54px; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%2312677d' stroke-width='1.6'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 18px center; background-size:16px; }
.cta { height:50px; padding-inline:54px; }
@media (max-width:991px) {
  .form-grid { grid-template-columns:1fr; }
  .form-field.full { grid-column:auto; }
  .contact-intro p { width:fit-content; }
}
@media (min-width:992px) {
  .contact { padding:70px 0; }
  .contact-grid { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); }
  .contact-intro { grid-column:1 / span 4; }
  .contact-form { grid-column:5 / span 8; }
}
.news-detail img { height:auto; aspect-ratio:1200 / 920; }
.news-card h3 { font-size:20px; line-height:1.34; }
.news h2 { margin-bottom:48px; }

/* Reveal content only depends on its own viewport entry, never on a parent reveal. */
@media (prefers-reduced-motion:reduce) {
  .hero-reveal,.hero-art,.offer-card>img,.apart-card>img { transition:none; }
}
