:root { --forest:#0b4b2e; --deep:#073a24; --leaf:#2c7a48; --yellow:#f5c626; --orange:#ef6b2d; --cream:#f5f2e9; --paper:#fffdf8; --ink:#183128; --muted:#68766f; --line:rgba(11,75,46,.15); --shadow:0 28px 70px rgba(21,58,42,.14); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; overflow-x:hidden; background:var(--cream); color:var(--ink); font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
img { display:block; max-width:100%; }
button,select { font:inherit; cursor:pointer; }
.section { width:min(100% - 48px,1360px); margin:0 auto; }

#site-header { position:fixed; inset:0 0 auto; z-index:100; border-bottom:1px solid transparent; transition:background .25s,border-color .25s,box-shadow .25s; }
#site-header.scrolled { border-color:rgba(11,75,46,.08); background:rgba(255,253,248,.96); box-shadow:0 8px 30px rgba(11,75,46,.08); backdrop-filter:blur(16px); }
.nav-shell { display:flex; align-items:center; justify-content:space-between; width:min(100% - 48px,1360px); height:98px; margin:auto; }
.brand { position:relative; z-index:3; width:152px; padding:8px 12px; border-radius:13px; background:rgba(255,255,255,.96); box-shadow:0 8px 24px rgba(4,39,23,.12); }
.logo { width:100%; }
#navbar-menu { display:flex; align-items:center; gap:25px; }
#navbar-menu > a:not(.cta-link) { position:relative; color:#fff; font-size:12px; font-weight:800; }
#navbar-menu > a:not(.cta-link)::after { position:absolute; right:0; bottom:-11px; left:0; height:2px; transform:scaleX(0); transform-origin:left; background:var(--yellow); content:""; transition:transform .2s; }
#navbar-menu > a:hover::after,#navbar-menu > a.active::after { transform:scaleX(1); }
#site-header.scrolled #navbar-menu > a:not(.cta-link) { color:var(--forest); }
#language-select { padding:10px 30px 10px 13px; border:1px solid rgba(255,255,255,.45); border-radius:999px; outline:none; background:rgba(4,39,23,.18); color:#fff; font-size:11px; font-weight:800; }
#language-select option { color:var(--ink); }
#site-header.scrolled #language-select { border-color:var(--line); background:#fff; color:var(--forest); }
.cta-button { display:inline-flex; align-items:center; gap:11px; padding:14px 17px; border-radius:999px; background:#fff; color:var(--forest); font-size:10px; font-weight:900; transition:transform .18s,background .18s; }
.cta-button:hover { transform:translateY(-2px); background:var(--yellow); }
#site-header.scrolled .cta-button { background:var(--forest); color:#fff; }
#navbar-toggle,#navbar-close { display:none; }

.hero { position:relative; display:flex; align-items:flex-end; min-height:800px; height:100vh; overflow:hidden; background:var(--deep); color:#fff; }
.hero-image,.hero-overlay { position:absolute; inset:0; width:100%; height:100%; }
.hero-image { object-fit:cover; animation:heroReveal 1.2s ease both; }
.hero-overlay { background:linear-gradient(90deg,rgba(4,39,23,.9),rgba(4,39,23,.56) 50%,rgba(4,39,23,.12)),linear-gradient(0deg,rgba(4,39,23,.58),transparent 45%); }
.hero-content { position:relative; z-index:1; width:min(100% - 48px,1360px); margin:auto; padding:190px 0 120px; }
.eyebrow { display:flex; align-items:center; gap:12px; margin:0 0 24px; color:var(--leaf); font-size:11px; font-weight:900; letter-spacing:.19em; }
.eyebrow::before { width:34px; height:2px; background:currentColor; content:""; }
.eyebrow.light { color:#e4efaa; }
.hero h1 { max-width:1050px; margin:0; font-size:clamp(67px,8vw,122px); line-height:.89; letter-spacing:-.067em; text-wrap:balance; }
.hero-content > p:not(.eyebrow) { max-width:760px; margin:33px 0 0; color:rgba(255,255,255,.82); font-size:clamp(16px,1.35vw,19px); line-height:1.7; }
.hero-actions { display:flex; flex-wrap:wrap; gap:14px; margin-top:40px; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:27px; min-height:58px; padding:0 27px; border-radius:999px; font-size:13px; font-weight:900; transition:transform .18s,background .18s,color .18s; }
.button:hover { transform:translateY(-2px); }
.button-yellow { background:var(--yellow); color:var(--forest); }
.button-outline { border:1px solid rgba(255,255,255,.48); color:#fff; }
.button-outline:hover { background:#fff; color:var(--forest); }
.button-white { background:#fff; color:var(--orange); }
.hero-values { position:absolute; right:max(24px,calc((100vw - 1360px)/2)); bottom:47px; z-index:1; display:flex; gap:22px; color:rgba(255,255,255,.68); font-size:10px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }
.hero-values span { padding-left:13px; border-left:2px solid var(--yellow); }

.intro { padding:145px 0 125px; }
.intro-copy { display:grid; grid-template-columns:.55fr 1.35fr .7fr; align-items:end; gap:40px; margin-bottom:70px; }
.section-title { margin:0; color:var(--forest); font-size:clamp(48px,5.2vw,76px); line-height:.96; letter-spacing:-.057em; }
.intro-copy > p:last-child,.catalog-heading > p,.companies-heading > p { margin:0; color:var(--muted); font-size:16px; line-height:1.75; }
.product-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.product-card { position:relative; min-height:550px; overflow:hidden; border-radius:34px; background:var(--forest); color:#fff; box-shadow:var(--shadow); }
.product-card::after { position:absolute; inset:0; background:linear-gradient(0deg,rgba(4,39,23,.92),rgba(4,39,23,0) 68%); content:""; }
.product-card img { width:100%; height:100%; object-fit:cover; transition:transform .55s ease; }
.product-card:hover img { transform:scale(1.04); }
.product-card > div { position:absolute; right:30px; bottom:30px; left:30px; z-index:1; }
.product-card span { color:var(--yellow); font-size:11px; font-weight:900; letter-spacing:.15em; }
.product-card h3 { margin:8px 0 9px; font-size:39px; letter-spacing:-.045em; }
.product-card p { margin:0; color:rgba(255,255,255,.72); font-size:13px; line-height:1.6; }

.catalog-section { padding:125px 0 145px; overflow:hidden; background:var(--forest); color:#fff; }
.catalog-heading { display:grid; grid-template-columns:1.2fr .6fr; align-items:end; gap:80px; margin-bottom:54px; }
.catalog-heading .section-title { color:#fff; font-size:clamp(65px,7.4vw,104px); }
.catalog-heading > p { color:rgba(255,255,255,.65); }
.slider { position:relative; width:min(100% - 48px,1360px); height:min(70vw,720px); min-height:560px; margin:auto; overflow:hidden; border-radius:42px; background:var(--deep); box-shadow:0 35px 80px rgba(2,30,17,.25); }
.slides { display:flex; width:100%; height:100%; transition:transform .58s cubic-bezier(.22,.61,.36,1); }
.slides img { flex:0 0 100%; width:100%; height:100%; object-fit:cover; }
.slider::after { position:absolute; inset:45% 0 0; background:linear-gradient(0deg,rgba(4,39,23,.76),transparent); content:""; pointer-events:none; }
.slider-btn { position:absolute; top:50%; z-index:3; display:grid; place-items:center; width:58px; height:58px; transform:translateY(-50%); border:1px solid rgba(255,255,255,.45); border-radius:50%; background:rgba(4,39,23,.36); color:#fff; font-size:25px; backdrop-filter:blur(8px); transition:background .18s,transform .18s; }
.slider-btn:hover { transform:translateY(-50%) scale(1.05); background:var(--yellow); color:var(--forest); }
.slider-btn.left { left:28px; }
.slider-btn.right { right:28px; }
.slider-caption { position:absolute; right:45px; bottom:40px; left:45px; z-index:2; display:flex; align-items:flex-end; justify-content:space-between; gap:30px; }
.slider-caption span { color:var(--yellow); font-size:10px; font-weight:900; letter-spacing:.18em; text-transform:uppercase; }
.slider-caption strong { max-width:480px; font-size:clamp(28px,3vw,45px); line-height:1; text-align:right; letter-spacing:-.04em; }
.no-images-message { text-align:center; color:#fff; }

.commitment { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:90px; padding:145px 0; }
.commitment-image { position:relative; min-height:680px; overflow:hidden; border-radius:42px; box-shadow:var(--shadow); }
.commitment-image img { width:100%; height:100%; object-fit:cover; }
.commitment-image span { position:absolute; right:22px; bottom:22px; left:22px; padding:17px 21px; border-radius:999px; background:rgba(255,255,255,.9); color:var(--forest); font-size:9px; font-weight:900; letter-spacing:.15em; text-align:center; backdrop-filter:blur(10px); }
.commitment-copy > p:not(.eyebrow) { margin:30px 0 0; color:var(--muted); font-size:17px; line-height:1.75; }
.commitment-points { margin-top:42px; border-top:1px solid var(--line); }
.commitment-points span { display:flex; align-items:center; gap:18px; padding:19px 0; border-bottom:1px solid var(--line); color:var(--forest); font-weight:800; }
.commitment-points b { color:var(--orange); font-size:10px; letter-spacing:.12em; }

.companies { padding:130px 0 145px; background:var(--deep); color:#fff; }
.companies-heading { display:grid; grid-template-columns:.5fr 1fr .65fr; align-items:end; gap:40px; margin-bottom:65px; }
.companies-heading .section-title { color:#fff; }
.companies-heading > p { color:rgba(255,255,255,.62); }
.company-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.company-card { padding:38px; border:1px solid rgba(255,255,255,.14); border-radius:31px; background:rgba(255,255,255,.045); transition:transform .2s,background .2s; }
.company-card:hover { transform:translateY(-5px); background:rgba(255,255,255,.08); }
.company-card > span { color:var(--yellow); font-size:10px; font-weight:900; letter-spacing:.16em; }
.company-logo { display:grid; place-items:center; height:190px; margin:28px 0; padding:30px; border-radius:24px; background:#fff; }
.company-logo img { max-width:200px; max-height:125px; }
.company-card h3 { margin:0 0 12px; font-size:27px; letter-spacing:-.035em; }
.company-card p { margin:0; color:rgba(255,255,255,.58); font-size:14px; line-height:1.65; }
.contact-strip { background:var(--orange); color:#fff; }
.contact-strip-inner { display:grid; grid-template-columns:1fr auto; align-items:center; gap:50px; padding:90px 0; }
.contact-strip h2 { max-width:900px; margin:0; font-size:clamp(47px,5.3vw,76px); line-height:.96; letter-spacing:-.057em; }

.footer_social_icon { padding:35px 24px; background:#f0ede3; }
.footer_social_icon ul { display:flex; justify-content:center; gap:11px; margin:0; padding:0; list-style:none; }
.footer_social_icon a { display:grid; place-items:center; width:45px; height:45px; border:1px solid var(--line); border-radius:50%; background:#fff; color:var(--forest); font-size:11px; font-weight:900; text-transform:uppercase; transition:background .18s,color .18s; }
.footer_social_icon a:hover { background:var(--forest); color:#fff; }
footer { padding:80px max(24px,calc((100vw - 1360px)/2)) 24px; background:#052f1d; color:#fff; }
.footer-main { display:grid; grid-template-columns:1.6fr 1fr 1fr; gap:72px; padding-bottom:65px; }
.footer-brand img { width:155px; margin-bottom:25px; padding:8px 12px; border-radius:12px; background:#fff; }
.footer-brand p { max-width:410px; color:rgba(255,255,255,.61); font-size:14px; line-height:1.7; }
.footer-main > div:not(.footer-brand) { display:flex; flex-direction:column; align-items:flex-start; gap:13px; }
.footer-main h3 { margin:4px 0 10px; color:#dceca2; font-size:10px; letter-spacing:.17em; text-transform:uppercase; }
.footer-main a,.footer-main > div > p { margin:0; color:rgba(255,255,255,.72); font-size:13px; }
.footer-bottom { display:flex; justify-content:space-between; gap:20px; padding-top:24px; border-top:1px solid rgba(255,255,255,.13); color:rgba(255,255,255,.5); font-size:11px; }
.footer-bottom p { margin:0; }
.whatsapp-float { position:fixed; right:24px; bottom:22px; z-index:90; display:flex; align-items:center; gap:12px; padding:8px 8px 8px 17px; border:1px solid rgba(255,255,255,.5); border-radius:999px; background:var(--forest); color:#fff; box-shadow:0 12px 30px rgba(5,58,34,.23); font-size:11px; font-weight:900; }
.whatsapp-float strong { display:grid; place-items:center; width:34px; height:34px; border-radius:50%; background:var(--yellow); color:var(--forest); }
.reveal { opacity:0; transform:translateY(24px); transition:opacity .7s,transform .7s; }
.reveal.visible { opacity:1; transform:none; }
@keyframes heroReveal { from { transform:scale(1.05); opacity:.65; } to { transform:scale(1); opacity:1; } }
@media (min-width:901px) { #navbar-menu { transform:none !important; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { animation-duration:.01ms !important; transition-duration:.01ms !important; } .reveal { opacity:1; transform:none; } }

@media (max-width:1180px) {
  #navbar-menu { gap:18px; }
  #navbar-menu > a:not(.cta-link) { font-size:11px; }
  .cta-link { display:none; }
  .intro-copy { grid-template-columns:.5fr 1.5fr; }
  .intro-copy > p:last-child { grid-column:2; }
  .companies-heading { grid-template-columns:.5fr 1.5fr; }
  .companies-heading > p { grid-column:2; }
}
@media (max-width:900px) {
  .nav-shell { width:calc(100% - 34px); height:82px; }
  .brand { width:132px; padding:7px 10px; }
  #navbar-toggle { position:relative; z-index:3; display:flex; flex-direction:column; justify-content:center; gap:5px; width:43px; height:43px; padding:0 11px; border:1px solid rgba(255,255,255,.45); border-radius:50%; background:rgba(4,39,23,.18); }
  #navbar-toggle span { width:100%; height:2px; background:#fff; }
  #site-header.scrolled #navbar-toggle { border-color:var(--line); background:#fff; }
  #site-header.scrolled #navbar-toggle span { background:var(--forest); }
  #navbar-menu { position:fixed; inset:0; display:flex; flex-direction:column; justify-content:center; align-items:flex-start; gap:22px; transform:translateY(-100%); padding:80px 34px; background:var(--deep); transition:transform .3s; }
  #navbar-menu > a:not(.cta-link),#site-header.scrolled #navbar-menu > a:not(.cta-link) { color:#fff; font-size:30px; letter-spacing:-.04em; }
  #navbar-menu > a::after { display:none; }
  #navbar-close { position:absolute; top:23px; right:23px; display:grid; place-items:center; width:46px; height:46px; border:1px solid rgba(255,255,255,.3); border-radius:50%; background:transparent; color:#fff; font-size:29px; }
  #language-select { width:170px; }
  .cta-link { display:block; }
  .cta-button { background:var(--yellow); }
  .hero { min-height:740px; height:92vh; }
  .hero-content { width:calc(100% - 34px); padding-bottom:105px; }
  .hero-values { right:17px; left:17px; justify-content:center; }
  .section { width:calc(100% - 34px); }
  .intro { padding:100px 0; }
  .intro-copy,.catalog-heading,.companies-heading { grid-template-columns:1fr; gap:26px; }
  .intro-copy > p:last-child,.companies-heading > p { grid-column:auto; }
  .product-cards { grid-template-columns:1fr; }
  .product-card { min-height:530px; }
  .catalog-section { padding:100px 0; }
  .slider { width:calc(100% - 34px); min-height:500px; height:72vw; border-radius:32px; }
  .commitment { grid-template-columns:1fr; gap:55px; padding:100px 0; }
  .commitment-image { min-height:600px; }
  .companies { padding:100px 0; }
  .company-grid { grid-template-columns:1fr; }
  .contact-strip-inner { grid-template-columns:1fr; align-items:start; padding:75px 0; }
  .footer-main { grid-template-columns:1fr 1fr; }
  .footer-brand { grid-column:1/-1; }
}
@media (max-width:560px) {
  .hero h1 { font-size:clamp(56px,16vw,76px); }
  .hero-content > p:not(.eyebrow) { font-size:15px; line-height:1.58; }
  .hero-actions { flex-direction:column; align-items:stretch; }
  .button { width:100%; }
  .hero-values { display:none; }
  .section-title,.contact-strip h2 { font-size:44px; }
  .product-card { min-height:470px; }
  .slider { min-height:420px; height:105vw; }
  .slider-btn { width:47px; height:47px; }
  .slider-btn.left { left:14px; }
  .slider-btn.right { right:14px; }
  .slider-caption { right:22px; bottom:24px; left:22px; flex-direction:column; align-items:flex-start; }
  .slider-caption strong { font-size:28px; text-align:left; }
  .commitment-image { min-height:480px; border-radius:30px; }
  .company-card { padding:28px; }
  .footer-main { grid-template-columns:1fr; }
  .footer-brand { grid-column:auto; }
  .footer-bottom { flex-direction:column; }
  .whatsapp-float { padding:7px; }
  .whatsapp-float span { display:none; }
}
