/* ===== De La Selva — design tokens ===== */
:root {
  --cream: #f6f1ea;
  --cream-card: #fffdf9;
  --cream-soft: #efe6d8;
  --cream-text: #f5f2ec;
  --cream-bright: #fdfcf9;
  --ivory: #f4f1e9;
  --ivory-warm: #fbf9f4;
  --green-ink: #0c2611;
  --green-deep: #234f2b;
  --green-mid: #2c6e35;
  --green-bright: #3f9d2c;
  --green-lime: #4faa2a;
  --green-soft: #7bc043;
  --orange: #ff5c00;
  --orange-hover: #ff6a12;
  --orange-link: #ff7a00;
  --amber: #f5a623;
  --amber-soft: #fbad2e;
  --amber-glow: #ff9a2e;
  --text-body: #4b5a48;
  --ink: #2e2a24;
  --font-serif: 'Recoleta', serif;
  --font-sans: 'Hanken Grotesk', sans-serif;
}

@font-face { font-family: 'Recoleta'; src: url('/assets/fonts/Recoleta-Light.woff2') format('woff2'); font-weight: 300; font-display: swap; }
@font-face { font-family: 'Recoleta'; src: url('/assets/fonts/Recoleta-Regular.woff2') format('woff2'); font-weight: 400; font-display: swap; }
@font-face { font-family: 'Recoleta'; src: url('/assets/fonts/Recoleta-Medium.woff2') format('woff2'); font-weight: 500; font-display: swap; }
@font-face { font-family: 'Recoleta'; src: url('/assets/fonts/Recoleta-SemiBold.woff2') format('woff2'); font-weight: 600; font-display: swap; }
@font-face { font-family: 'Recoleta'; src: url('/assets/fonts/Recoleta-Bold.woff2') format('woff2'); font-weight: 700; font-display: swap; }

* { box-sizing: border-box; margin: 0; padding: 0; }
html { height: 100%; }
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior: contain; }
.lenis.lenis-stopped { overflow: hidden; }
body { min-height: 100%; background: var(--cream); font-family: var(--font-sans); -webkit-font-smoothing: antialiased; }
img { max-width: 100%; }

/* Escala proporcional en pantallas grandes: vista Full HD ampliada */
@media (min-width: 2450px) { body { zoom: 1.32; } }
@media (min-width: 3000px) { body { zoom: 1.7; } }

/* ===== Scroll reveal (driven by GSAP ScrollTrigger) ===== */
.sr { opacity: 0; transform: translateY(32px); transition: opacity .95s cubic-bezier(.2,.7,.25,1), transform .95s cubic-bezier(.2,.7,.25,1); }
.sr.sr-in { opacity: 1; transform: none; }
.sr2 { transition-delay: .12s; }
.sr3 { transition-delay: .24s; }
.sr4 { transition-delay: .36s; }

/* ===== Header / menu button ===== */
/* Logo swap: blanco por defecto, oscuro sobre secciones con data-light-header (ver main.js) */
.logo-swap img { transition: opacity .4s ease; }
.logo-swap .lsd { opacity: 0; }
html.logo-on-light header[data-header] .lsw { opacity: 0; }
html.logo-on-light header[data-header] .lsd { opacity: 1; }
.menu-btn { transition: background .4s ease, border-color .4s ease, box-shadow .4s ease; overflow: hidden; }
.menu-btn:hover { background: rgba(12,38,17,0.92); border-color: rgba(255,255,255,0.4); box-shadow: 0 10px 30px rgba(0,0,0,0.25); }
/* Selector de idioma ES/EN (ver lang-toggle.js) */
.lang-btn { transition: background .4s ease, border-color .4s ease, box-shadow .4s ease, transform .3s ease; }
.lang-btn:hover { background: rgba(12,38,17,0.92); border-color: rgba(255,255,255,0.4); box-shadow: 0 10px 30px rgba(0,0,0,0.25); }
.lang-btn .lang-txt { transition: transform .22s ease, opacity .22s ease; }
.lang-btn.lang-flip .lang-txt { transform: rotateX(90deg); opacity: 0; }
.menu-btn .ml { transition: width .45s cubic-bezier(.65,0,.35,1); }
.menu-btn:hover .ml1 { width: 70% !important; }
.menu-btn:hover .ml3 { width: 100% !important; }
.menu-btn .mtx { transition: letter-spacing .4s ease; }
.menu-btn:hover .mtx { letter-spacing: 3px; }

/* ===== Fullscreen menu ===== */
.menu-link:hover .menu-label { color: var(--orange-link) !important; }
.menu-link:hover .menu-num { color: var(--orange-link) !important; }
.menu-link:hover { transform: translateX(14px); }
.menu-social:hover { transform: translateY(-3px) scale(1.12); }

/* ===== Footer ===== */
.f-link { transition: color .2s ease; }
.f-link:hover { color: var(--orange-link) !important; }
.f-social span { transition: color .2s ease; }
.f-social:hover span { color: var(--orange-link) !important; }
.footer-logo { opacity: 0; transform: translateY(-96px); transition: opacity 1.5s cubic-bezier(.2,.75,.25,1), transform 1.5s cubic-bezier(.2,.75,.25,1); }
.footer-in .footer-logo { opacity: 1; transform: translateY(0); }

/* ===== Buttons ===== */
.btn-orange { transition: transform .25s ease, box-shadow .25s ease, background .25s ease; }
.btn-orange:hover { transform: translateY(-2px); box-shadow: 0 18px 48px rgba(255,92,0,0.55); background: var(--orange-hover) !important; }
.cta-btn:hover { transform: translateY(-3px) scale(1.04) !important; box-shadow: 0 18px 50px rgba(255,92,0,0.58) !important; background: var(--orange-hover) !important; }

/* ================= RESPONSIVE COMPARTIDO ================= */

/* Tablet */
@media (max-width: 1180px) {
  footer[data-footer] { padding: 80px 40px 36px !important; }
}

/* Móvil */
@media (max-width: 768px) {
  html, body { overflow-x: hidden; }

  /* --- Header global --- */
  header[data-header] { padding: 14px 18px !important; }
  .lang-btn { width: 40px !important; height: 40px !important; font-size: 11px !important; }
  header[data-header][data-logo="corp"] img { height: 26px !important; }
  header[data-header][data-logo="sac"] img { height: 64px !important; }
  header[data-header][data-logo="bo"] img { height: 56px !important; }
  .menu-btn { padding: 11px 16px !important; gap: 11px !important; }
  .menu-btn .mtx { font-size: 13px !important; }

  /* --- Footer --- */
  footer[data-footer] { padding: 64px 22px 30px !important; }
  footer[data-footer] > div:first-child { flex-direction: column !important; align-items: stretch !important; gap: 34px !important; }
  .footer-logo { width: 200px !important; align-self: center !important; }
  footer[data-footer] div.sr { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 34px 20px !important; }
  footer[data-footer] div.sr > div:nth-child(3) { grid-column: 1 / -1 !important; padding-top: 30px !important; border-top: 1px solid rgba(238,240,232,0.14) !important; }
  footer[data-footer] div.sr > div > span:first-child { font-size: 11px !important; letter-spacing: 2px !important; margin-bottom: 20px !important; }
  footer[data-footer] .f-link { font-size: 15px !important; margin-bottom: 16px !important; }
  footer[data-footer] div.sr > div:nth-child(1),
  footer[data-footer] div.sr > div:nth-child(2) { align-items: center !important; text-align: center !important; }
  footer[data-footer] .f-social { gap: 12px !important; margin-bottom: 16px !important; }
  footer[data-footer] .f-social img,
  footer[data-footer] div.sr > div:nth-child(3) > div img { width: 22px !important; height: 22px !important; }
  footer[data-footer] div.sr > div:nth-child(3) > div { gap: 12px !important; margin-bottom: 28px !important; }
  footer[data-footer] .btn-orange { align-self: stretch !important; width: 100% !important; padding: 17px 24px !important; }
  footer[data-footer] > div:last-child { margin-top: 40px !important; }
  footer[data-footer] > div:last-child > div { margin-bottom: 24px !important; }
  footer[data-footer] > div:last-child span { display: block !important; text-align: center !important; font-size: 10px !important; line-height: 1.6 !important; letter-spacing: 0.8px !important; }

  /* --- Menú fullscreen --- */
  #menu-overlay > div:nth-child(2) { padding: 14px 18px !important; }
  #menu-overlay[data-logo="corp"] > div:nth-child(2) img { height: 26px !important; }
  #menu-overlay[data-logo="sac"] > div:nth-child(2) img { height: 64px !important; }
  #menu-overlay[data-logo="bo"] > div:nth-child(2) img { height: 56px !important; }
  #menu-overlay > div:last-child { flex-direction: column !important; gap: 16px !important; padding: 10px 22px 24px !important; }
  #menu-overlay nav { flex: 0 0 auto !important; max-width: 100% !important; margin-bottom: 52px !important; }
  #menu-overlay nav a { padding: 12px 2px !important; gap: 16px !important; }
  #menu-overlay nav .menu-label { font-size: 24px !important; }
  #menu-overlay > div:last-child > div:last-child { flex: 0 0 auto !important; }
  #menu-overlay > div:last-child > div:last-child a[style*="space-between"] { padding: 13px 2px !important; }
  #menu-overlay > div:last-child > div:last-child .menu-label { font-size: 18px !important; }
  #menu-overlay > div:last-child > div:last-child > p { display: none !important; }
  #menu-overlay > div:last-child > div:last-child > a.btn-orange { padding: 14px 30px !important; font-size: 14px !important; margin-top: 16px !important; }
  #menu-overlay > div:last-child > div:last-child > div:last-child { flex-direction: row !important; align-items: center !important; justify-content: flex-end !important; gap: 20px !important; margin-top: 22px !important; }
  #menu-overlay .menu-social img { width: 30px !important; height: 30px !important; }
  #menu-overlay > img { width: 230px !important; left: -40px !important; bottom: 0 !important; top: auto !important; }
  .menu-link:hover { transform: none !important; }
}