:root{
  --espresso: #1E1210;
  --espresso-2: #2E1B17;
  --cream: #F7F2E9;
  --cream-2: #EEE4D2;
  --brass: #B08D57;
  --brass-light: #D2B27E;
  /* Colores reales de marca */
  --vero-red: #C82419;
  --vero-black: #2B2A2B;
  --divina-blue: #006AAF;
  --divina-blue-light: #3E96D6;
  --line: #DCCFB6;
  --ink-soft: #6b5847;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{animation-duration:0.001ms !important; transition-duration:0.001ms !important;}
}
body{
  background:var(--cream);
  color:var(--espresso);
  font-family:'Work Sans', sans-serif;
  font-weight:400;
  line-height:1.6;
  overflow-x:hidden;
}
.eyebrow{
  font-family:'IBM Plex Mono', monospace;
  font-size:0.72rem;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--brass);
  display:flex;
  align-items:center;
  gap:0.6em;
}
a{color:inherit; text-decoration:none;}
a:focus-visible, button:focus-visible{
  outline:2px solid var(--brass);
  outline-offset:3px;
}
img{max-width:100%; display:block;}

/* NAV */
header{
  position:sticky; top:0; z-index:50;
  background:#ffffff;
  border-bottom:1px solid rgba(0,0,0,0.08);
}
nav{
  max-width:1180px; margin:0 auto;
  display:flex; align-items:center; justify-content:space-between;
  padding:1.5rem 1.5rem;
}
.brand-group{ display:flex; align-items:center; gap:1.1rem; flex-wrap:wrap; }
.brand{
  font-family:'Poppins', sans-serif;
  font-weight:800;
  font-size:1.1rem;
  color:var(--espresso);
  letter-spacing:0.01em;
  text-transform:uppercase;
}
.brand span{color:var(--brass);}
.brand-page-logo-wrap{
  display:flex; align-items:center; gap:0.5rem;
  line-height:0;
}
.brand-page-logo{
  height:72px; width:auto; max-width:90px;
  object-fit:contain; display:block;
}
.brand-page-logo.round{
  height:64px; width:64px; max-width:64px;
  border-radius:50%; object-fit:cover;
}
@media (max-width:560px){
  .brand-page-logo-wrap{display:none;}
}
.navlinks{
  display:flex; align-items:center; gap:2.6rem;
  font-size:0.85rem;
  letter-spacing:0.03em;
}
.nav-logo-link{
  display:flex; align-items:flex-start; justify-content:center;
  width:92px; height:92px;
  transition:transform 0.25s ease;
}
.nav-logo-link:hover{ transform:translateY(-2px); }
.navlinks a.nav-logo-link{ opacity:1; }
.nav-logo-stack{ flex-direction:column; align-items:center; justify-content:flex-start; gap:4px; }
.nav-logo-caption{
  font-family:'Poppins', sans-serif; font-weight:700;
  font-size:0.62rem; letter-spacing:0.02em; text-transform:uppercase;
  text-align:center; line-height:1.1; white-space:nowrap; color:inherit;
}
.nav-logo{
  width:64px; height:64px; object-fit:contain; display:block;
}
.nav-logo.round{
  border-radius:50%; object-fit:cover;
}
.navlinks a{
  color:var(--espresso);
  opacity:0.75;
  position:relative;
  padding:0.2rem 0;
  transition:opacity 0.25s ease;
}
.navlinks a:hover{opacity:1;}
.navlinks a::after{
  content:""; position:absolute; left:0; bottom:-3px;
  width:0; height:1px; background:var(--brass-light);
  transition:width 0.3s ease;
}
.navlinks a:hover::after{width:100%;}
.navlinks a.active::after{width:100%;}
.nav-toggle{display:none;}

/* HEADER ICONS — contacto, redes, idioma */
.header-icons{
  display:flex; align-items:center; gap:0.85rem;
  margin-left:1.6rem;
  padding-left:1.6rem;
  border-left:1px solid rgba(0,0,0,0.12);
}
.header-icons a{
  display:flex; align-items:center; justify-content:center;
  width:34px; height:34px; border-radius:50%;
  color:#fff; opacity:1;
  transition:transform 0.2s ease, box-shadow 0.2s ease;
}
.header-icons a:hover{ transform:translateY(-2px); box-shadow:0 6px 14px rgba(0,0,0,0.2); }
.header-icons svg{width:17px; height:17px;}
.header-icons a.ic-whatsapp{ background:#25D366; }
.header-icons a.ic-instagram{
  background:radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
}

.lang-switch{position:relative;}
.lang-switch summary{
  list-style:none; cursor:pointer;
  display:flex; align-items:center; gap:0.3rem;
  opacity:0.55; transition:opacity 0.2s ease;
  font-family:'IBM Plex Mono', monospace;
  font-size:0.68rem; letter-spacing:0.05em;
  color:var(--espresso);
}
.lang-switch summary::-webkit-details-marker{display:none;}
.lang-switch summary::marker{content:"";}
.lang-switch:hover summary, .lang-switch[open] summary{opacity:1;}
.lang-switch svg{width:15px; height:15px;}
.lang-menu{
  position:absolute; top:calc(100% + 10px); right:0;
  background:rgba(20,14,12,0.98);
  border:1px solid rgba(255,255,255,0.14);
  border-radius:6px;
  padding:0.35rem;
  min-width:150px;
  z-index:60;
  box-shadow:0 10px 26px rgba(0,0,0,0.35);
}
.lang-menu a{
  display:flex; justify-content:space-between; gap:0.5rem;
  padding:0.4rem 0.6rem;
  font-size:0.78rem;
  color:var(--cream-2);
  opacity:0.8;
  border-radius:3px;
}
.lang-menu a:hover{background:rgba(255,255,255,0.08); opacity:1;}
.lang-menu a.active{color:var(--brass-light); opacity:1;}
.lang-menu a.soon{opacity:0.35; cursor:default; pointer-events:none;}
.lang-menu a.soon:hover{background:none;}
.lang-menu small{font-family:'Work Sans', sans-serif; opacity:0.6; font-size:0.68rem;}
@media (max-width:820px){
  .header-icons{
    margin-left:0; padding-left:0; border-left:none;
    margin-top:1.2rem; padding-top:1.4rem;
    border-top:1px solid rgba(255,255,255,0.15);
  }
  .lang-menu{ position:static; margin-top:0.6rem; box-shadow:none; }
}

/* HERO */
.hero{
  position:relative;
  background:
    radial-gradient(ellipse at 85% 0%, rgba(140,44,52,0.3), transparent 60%),
    linear-gradient(155deg, rgba(24,14,12,0.93) 0%, rgba(35,20,17,0.90) 50%, rgba(30,17,15,0.86) 100%),
    url('assets/planta/hero-bg.jpg');
  background-size: cover, cover, cover;
  background-position: center, center, center 38%;
  background-repeat: no-repeat;
  color:var(--cream);
  padding:7rem 1.5rem 6rem;
  overflow:hidden;
}
.hero-grid{
  max-width:1180px; margin:0 auto; position:relative;
}
.hero-inner{position:relative; max-width:720px; margin:0 auto; text-align:center;}
.hero .eyebrow{margin-bottom:1.6rem; justify-content:center;}
h1.hero-title{
  font-family:'Fraunces', serif;
  font-weight:500;
  font-size:clamp(2.6rem, 5.2vw, 4rem);
  line-height:1.04;
  letter-spacing:-0.01em;
  text-shadow:0 2px 24px rgba(0,0,0,0.35);
}
h1.hero-title em{
  font-style:italic;
  font-weight:400;
  color:var(--brass-light);
  display:block;
  font-size:0.56em;
  margin-top:0.6rem;
}
.hero-sub{
  max-width:480px; margin:1.8rem auto 0;
  color:var(--cream-2);
  font-size:1.05rem;
  font-weight:300;
}
.hero-tags-wrap{
  margin-top:2.4rem;
  overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg, transparent, black 10%, black 90%, transparent);
  mask-image:linear-gradient(90deg, transparent, black 10%, black 90%, transparent);
}
.hero-tags{
  display:flex; gap:0.9rem;
  width:max-content;
  animation:hero-tags-scroll 26s linear infinite;
}
@keyframes hero-tags-scroll{
  from{ transform:translateX(0); }
  to{ transform:translateX(-50%); }
}
.tag{
  font-family:'IBM Plex Mono', monospace;
  font-size:0.7rem;
  letter-spacing:0.06em;
  border:1px solid rgba(210,178,126,0.4);
  color:var(--brass-light);
  padding:0.4rem 0.85rem;
  border-radius:2px;
  background:rgba(20,12,10,0.35);
  white-space:nowrap;
  flex-shrink:0;
}
.hero-loc{
  margin-top:1.6rem;
  font-family:'IBM Plex Mono', monospace;
  font-size:0.72rem;
  letter-spacing:0.05em;
  color:var(--cream-2);
  opacity:0.7;
}

/* BRAND HUB — 4 clickable company logos */
.brand-hub{
  display:flex; justify-content:center; flex-wrap:wrap;
  gap:0.6rem;
  margin-top:3rem;
}
.brand-card{
  display:flex; flex-direction:column; align-items:center; gap:0.8rem;
  width:150px;
  padding:1.8rem 1rem 1.3rem;
  border-radius:20px;
  background: radial-gradient(ellipse 100px 92px at 50% 40%, rgba(247,242,233,0.9) 0%, rgba(247,242,233,0.32) 55%, transparent 78%);
  transition:transform 0.25s ease;
}
.brand-card:hover{
  transform:translateY(-4px);
}
.brand-card.tint-vero{
  background: radial-gradient(ellipse 100px 92px at 50% 40%, rgba(255,224,216,0.9) 0%, rgba(200,36,25,0.16) 55%, transparent 78%);
}
.brand-card.tint-dp{
  background: radial-gradient(ellipse 100px 92px at 50% 40%, rgba(212,234,250,0.9) 0%, rgba(0,106,175,0.16) 55%, transparent 78%);
}
.brand-card.tint-warm{
  background: radial-gradient(ellipse 100px 92px at 50% 40%, rgba(247,235,212,0.9) 0%, rgba(176,141,87,0.18) 55%, transparent 78%);
}
.brand-card img{
  height:48px; width:auto; max-width:100%;
  object-fit:contain;
}
.brand-card span{
  font-family:'IBM Plex Mono', monospace;
  font-size:0.68rem;
  letter-spacing:0.04em;
  text-transform:uppercase;
  color:var(--cream-2);
  text-align:center;
  line-height:1.3;
}

/* INTRO */
.intro{
  max-width:760px; margin:0 auto;
  padding:5.5rem 1.5rem 4rem;
  text-align:center;
}
.intro p{
  font-size:1.15rem;
  font-weight:300;
  color:var(--espresso);
}
.intro p strong{font-weight:600; color:var(--vero-red);}

/* SUB-PAGE HERO (company pages) */
.page-hero{
  padding:4.5rem 1.5rem 3.5rem;
  border-bottom:1px solid var(--line);
  background:var(--cream-2);
}
.page-hero-inner{
  max-width:1080px; margin:0 auto;
  display:flex; align-items:center; gap:1.6rem; flex-wrap:wrap;
}
.page-hero-inner img{height:64px; width:auto;}
.page-hero-inner img.round{width:64px; border-radius:50%; object-fit:cover;}
.page-hero-text h1{
  font-family:'Fraunces', serif;
  font-weight:500;
  font-size:clamp(1.9rem, 3.6vw, 2.7rem);
}
.page-hero-text p{
  margin-top:0.5rem; color:var(--ink-soft); font-size:1rem; max-width:52ch;
}
.breadcrumb{
  font-family:'IBM Plex Mono', monospace;
  font-size:0.7rem; letter-spacing:0.05em;
  color:var(--ink-soft);
  max-width:1080px; margin:0 auto 1.2rem;
  padding:0 1.5rem;
}
.breadcrumb a{color:var(--brass); }
.breadcrumb a:hover{text-decoration:underline;}

/* NUESTRA PLANTA — real photo gallery */
.planta-gallery-wrap{
  max-width:1080px; margin:3.6rem auto 0;
  padding:0 1.5rem;
}
.planta-gallery-head{
  margin-bottom:1.3rem;
}
.planta-gallery-head h3{
  font-family:'Fraunces', serif;
  font-style:italic;
  font-weight:500;
  font-size:1.3rem;
  color:var(--espresso-2);
}
.planta-gallery-head p{
  font-size:0.88rem;
  color:var(--ink-soft);
  margin-top:0.4rem;
  max-width:48ch;
}
.planta-grid{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:0.85rem;
}
.planta-item{
  position:relative;
  overflow:hidden;
  border-radius:4px;
  border:1px solid var(--line);
  background:var(--cream-2);
}
.planta-item.span-3{grid-column:1/-1;}
.planta-item img, .planta-item video{
  width:100%; height:100%;
  object-fit:cover; display:block;
  transition:transform 0.5s ease;
}
.planta-item:hover img, .planta-item:hover video{transform:scale(1.04);}
.planta-item.wide{aspect-ratio:21/9;}
.planta-item.tall{aspect-ratio:3/4;}
.planta-item .play-badge{
  position:absolute; top:0.6rem; right:0.6rem;
  font-family:'IBM Plex Mono', monospace; font-size:0.6rem;
  letter-spacing:0.05em; text-transform:uppercase;
  color:#fff; background:rgba(20,12,10,0.6);
  padding:0.25rem 0.5rem; border-radius:3px;
}
.planta-item figcaption{
  position:absolute; left:0; right:0; bottom:0;
  padding:0.65rem 0.85rem 0.55rem;
  font-family:'IBM Plex Mono', monospace;
  font-size:0.64rem;
  letter-spacing:0.03em;
  color:#fff;
  background:linear-gradient(0deg, rgba(20,12,10,0.85), transparent);
}
@media (max-width:700px){
  .planta-grid{grid-template-columns:repeat(2, 1fr);}
}
@media (max-width:480px){
  .planta-grid{grid-template-columns:1fr;}
  .planta-item.wide{aspect-ratio:16/10;}
}

/* SECTION SHELL */
.unit{
  padding:5.5rem 1.5rem;
}
.unit + .unit{border-top:1px solid var(--line);}
.unit-inner{
  max-width:1080px; margin:0 auto;
  display:grid;
  grid-template-columns:0.85fr 1.15fr;
  gap:3.5rem;
  align-items:start;
}
.unit.reverse .unit-inner{grid-template-columns:1.15fr 0.85fr;}
.unit.reverse .unit-media{order:2;}
.unit-label h2{
  font-family:'Fraunces', serif;
  font-weight:500;
  font-size:clamp(1.9rem, 3.2vw, 2.5rem);
  line-height:1.15;
}
.unit-desc{
  font-size:1.02rem;
  color:#4a3b2e;
  margin-top:1.3rem;
  max-width:34ch;
}
.unit-media{
  border:1px solid var(--line);
  border-radius:4px;
  padding:2.2rem;
  background:var(--cream-2);
}
.svc-list{list-style:none;}
.svc-list li{
  display:flex; gap:0.9rem;
  padding:0.95rem 0;
  border-bottom:1px solid var(--line);
  font-size:0.96rem;
}
.svc-list li:last-child{border-bottom:none;}
.svc-num{
  font-family:'IBM Plex Mono', monospace;
  font-size:0.72rem;
  color:var(--brass);
  padding-top:0.15rem;
  min-width:1.4em;
}
.presence-box{
  margin-top:1.6rem;
  padding-top:1.4rem;
  border-top:1px dashed var(--line);
}
.presence-box .eyebrow{margin-bottom:0.6rem;}
.presence-list{
  display:flex; flex-wrap:wrap; gap:0.5rem;
}
.presence-list span{
  font-size:0.8rem;
  background:var(--cream);
  border:1px solid var(--line);
  padding:0.3rem 0.7rem;
  border-radius:2px;
  color:var(--espresso-2);
}
.soon-box{
  margin-top:1.6rem; padding-top:1.4rem;
  border-top:1px dashed var(--line);
}
.soon-box p{font-size:0.92rem; font-style:italic; color:var(--ink-soft);}

.accent-dp .eyebrow{color:var(--divina-blue);}
.accent-dp .svc-num{color:var(--divina-blue);}
.accent-dp .unit-media{border-color:rgba(21,105,171,0.3); background:#EDF4FA;}
.accent-dp .presence-list span{border-color:rgba(21,105,171,0.35); background:#fff;}
.accent-vc .eyebrow{color:var(--vero-red);}
.accent-vc .svc-num{color:var(--vero-red);}
.accent-vc .unit-media{border-color:rgba(200,36,25,0.25); background:#FBEEEC;}
.accent-vc .soon-box p{color:var(--vero-red);}

.unit-label{position:relative;}

/* FOOTER */
footer{
  background:var(--espresso);
  color:var(--cream-2);
  padding:4rem 1.5rem 2.2rem;
}
.footer-inner{
  max-width:1080px; margin:0 auto;
  display:grid;
  grid-template-columns:1.2fr 1fr 1fr;
  gap:2.5rem;
}
.footer-brand{
  font-family:'Fraunces', serif; font-style:italic;
  font-size:1.3rem; color:var(--cream);
}
.footer-brand p{
  font-family:'Work Sans', sans-serif; font-style:normal;
  font-size:0.85rem; color:var(--cream-2); opacity:0.75;
  margin-top:0.8rem; max-width:32ch;
}
.footer-col h3{
  font-family:'IBM Plex Mono', monospace;
  font-size:0.7rem; letter-spacing:0.1em; text-transform:uppercase;
  color:var(--brass-light); margin-bottom:0.9rem;
}
.footer-col p, .footer-col li{
  font-size:0.85rem; color:var(--cream-2); opacity:0.85;
  list-style:none; margin-bottom:0.4rem;
}
.footer-col li a:hover, .footer-col p a:hover{opacity:0.8; text-decoration:underline;}
.footer-bottom{
  max-width:1080px; margin:3rem auto 0;
  padding-top:1.5rem;
  border-top:1px solid rgba(210,178,126,0.15);
  font-size:0.75rem; color:var(--cream-2); opacity:0.55;
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:0.6rem;
}

.footer-logos{
  max-width:1080px; margin:3rem auto 0;
  padding-top:2.5rem;
  border-top:1px solid rgba(210,178,126,0.15);
  display:flex; flex-wrap:wrap; gap:2.2rem;
  align-items:center;
}
.footer-logo-item{
  display:flex; align-items:center;
  opacity:0.92; transition:opacity 0.2s ease;
}
a.footer-logo-item:hover{opacity:1;}
.footer-logo-item img{
  height:44px; width:44px; object-fit:contain;
}
.footer-logo-round img{
  border-radius:50%;
  object-fit:cover;
}

@media (max-width:1180px) and (min-width:821px){
  .navlinks{ gap:1.5rem; }
  .nav-logo-link{ width:64px; height:74px; }
  .nav-logo{ width:48px; height:48px; }
  .nav-logo-caption{ font-size:0.52rem; }
  .brand-page-logo{ height:56px; max-width:72px; }
  .brand-page-logo.round{ height:48px; width:48px; max-width:48px; }
}
@media (max-width:820px){
  .navlinks{
    position:fixed; inset:0 0 0 auto; width:min(78vw,320px);
    background:var(--espresso); flex-direction:column;
    padding:6rem 2rem 2rem; gap:1.6rem;
    transform:translateX(100%); transition:transform 0.35s ease;
    z-index:55;
  }
  .navlinks.open{transform:translateX(0);}
  .navlinks a{ color:var(--cream-2); }
  .nav-logo-caption{ color:var(--cream-2); }
  .nav-toggle{
    display:block; background:none; border:none; color:var(--espresso);
    font-size:1.4rem; cursor:pointer; z-index:60;
  }
  .unit-inner{grid-template-columns:1fr !important;}
  .unit.reverse .unit-media{order:0;}
  .footer-inner{grid-template-columns:1fr; gap:2rem;}
}

/* ===== PANEL DE COTIZACIÓN — componente compartido ===== */
.quote-panel{
  max-width:820px; margin:0 auto; padding:5.5rem 1.5rem;
  border-top:1px solid var(--line);
}
.quote-panel-head{ text-align:center; max-width:56ch; margin:0 auto 2.6rem; }
.quote-panel-head .eyebrow{ justify-content:center; }
.quote-panel-head h2{
  font-family:'Fraunces', serif; font-style:italic; font-weight:500;
  font-size:1.9rem; margin-top:0.6rem;
}
.quote-panel-head p{ margin-top:0.9rem; color:var(--ink-soft, #6b5847); }

.quote-form{
  background:var(--cream-2); border:1px solid var(--line); border-radius:10px;
  padding:2rem clamp(1.2rem,4vw,2.6rem);
}
.quote-fields-grid{ display:grid; grid-template-columns:1fr 1fr; gap:1.2rem 1.4rem; }
.quote-field{ display:flex; flex-direction:column; gap:0.4rem; }
.quote-field.full{ grid-column:1/-1; }
.quote-field-label{
  font-family:'IBM Plex Mono', monospace; font-size:0.68rem;
  letter-spacing:0.05em; text-transform:uppercase; color:var(--ink-soft, #6b5847);
}
.quote-input, .quote-textarea, .quote-select{
  font-family:'Work Sans', sans-serif; font-size:0.95rem;
  border:1px solid var(--line); border-radius:6px; padding:0.7rem 0.85rem;
  background:#fff; color:var(--espresso); width:100%;
}
.quote-textarea{ min-height:110px; resize:vertical; }
.quote-input:focus, .quote-textarea:focus, .quote-select:focus{
  outline:none; border-color:var(--brass);
}

.quote-req-title{
  font-family:'IBM Plex Mono', monospace; font-size:0.72rem;
  letter-spacing:0.06em; text-transform:uppercase; color:var(--brass);
  margin:2.2rem 0 1rem; padding-top:1.8rem; border-top:1px dashed var(--line);
}
.quote-check{
  display:flex; align-items:flex-start; gap:0.65rem;
  padding:0.55rem 0; cursor:pointer;
}
.quote-check input{ margin-top:0.2rem; accent-color:var(--brass); flex-shrink:0; }
.quote-check-label{ font-size:0.92rem; color:var(--espresso); line-height:1.4; }
.quote-subfields{
  display:none;
  margin:0.3rem 0 0.6rem 1.75rem;
  padding:1rem 1.2rem;
  background:#fff; border:1px solid var(--line); border-radius:8px;
}
.quote-subfields .quote-field{ margin-bottom:0.9rem; }
.quote-subfields .quote-field:last-child{ margin-bottom:0; }
.quote-radio-row{ display:flex; flex-wrap:wrap; gap:1rem 1.6rem; }
.quote-radio-row .quote-check{ padding:0.2rem 0; }

.quote-submit{
  display:inline-flex; align-items:center; gap:0.6rem;
  margin-top:2rem;
  background:var(--brass); color:#fff; border:none;
  font-family:'IBM Plex Mono', monospace; font-size:0.8rem;
  letter-spacing:0.04em; text-transform:uppercase;
  padding:0.85rem 1.6rem; border-radius:999px;
  cursor:pointer; transition:transform 0.2s ease, box-shadow 0.2s ease;
}
.quote-submit:hover{ transform:translateY(-2px); box-shadow:0 10px 22px rgba(0,0,0,0.18); }
.quote-submit svg{ width:16px; height:16px; }

@media (max-width:640px){
  .quote-fields-grid{ grid-template-columns:1fr; }
  .quote-subfields{ margin-left:0; }
}