/* ═══════════════════════════════════════════════
   CDC LAM by AIVORIQ — style.css
   White-dominant + black + Atelier accent
   Distinct from Vallès ATM: more contrast,
   sharper lines, big hero numbers, sticky pills
   ═══════════════════════════════════════════════ */

/* ── ANTIQUE LEGACY ── */
@font-face{font-family:'Antique Legacy';src:url('../fonts/Antique-Legacy-Thin/AntiqueLegacy-Thin.woff2')format('woff2');font-weight:100;font-display:swap}
@font-face{font-family:'Antique Legacy';src:url('../fonts/Antique-Legacy-Light/AntiqueLegacy-Light.woff2')format('woff2');font-weight:300;font-display:swap}
@font-face{font-family:'Antique Legacy';src:url('../fonts/Antique-Legacy-Light-Italic/AntiqueLegacy-LightItalic.woff2')format('woff2');font-weight:300;font-style:italic;font-display:swap}
@font-face{font-family:'Antique Legacy';src:url('../fonts/Antique-Legacy-Regular/AntiqueLegacy-Regular.woff2')format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Antique Legacy';src:url('../fonts/Antique-Legacy-Italic/AntiqueLegacy-Italic.woff2')format('woff2');font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:'Antique Legacy';src:url('../fonts/Antique-Legacy-Medium/AntiqueLegacy-Medium.woff2')format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'Antique Legacy';src:url('../fonts/Antique-Legacy-Bold/AntiqueLegacy-Bold.woff2')format('woff2');font-weight:700;font-display:swap}

/* ── THEINHARDT MONO ── */
@font-face{font-family:'Theinhardt Mono';src:url('../fonts/Theinhardt-Mono-Regular/TheinhardtMono-Regular.woff2')format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Theinhardt Mono';src:url('../fonts/Theinhardt-Mono-Medium/TheinhardtMono-Medium.woff2')format('woff2');font-weight:500;font-display:swap}

/* ═══════════════════════════════════════════════
   VARIABLES
   ═══════════════════════════════════════════════ */
:root {
  --at:  #C16950;
  --iv:  #FCF9EE;
  --mn:  #757A82;
  --lq:  #E5E3DD;
  --wh:  #FFFFFF;
  --bk:  #000000;
  --dk:  #0A0A0A;
  --gr:  #F4F2EC;
  --f:   'Antique Legacy', Arial, sans-serif;
  --m:   'Theinhardt Mono', 'Courier New', monospace;
  --ease: cubic-bezier(.25,.46,.45,.94);
  --spring: cubic-bezier(.16,1,.3,1);
}

/* ═══════════════════════════════════════════════
   RESET
   ═══════════════════════════════════════════════ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:var(--f);
  background:var(--wh);
  color:var(--bk);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  font-weight:300;
  line-height:1.6;
}
img{display:block;max-width:100%}
a{text-decoration:none;color:inherit}
video{display:block;width:100%}
h1,h2,h3,h4,h5{font-family:var(--f);font-weight:300;line-height:1.15}

.container{max-width:1240px;margin:0 auto;padding:0 32px}
.section{padding:96px 0}

/* ═══════════════════════════════════════════════
   NAV — sticky, blanco, con CTA atelier pill
   Diferenciador: mega-menú visible al hover
   ═══════════════════════════════════════════════ */
.nav{
  position:fixed;
  top:0;left:0;right:0;
  z-index:200;
  height:76px;
  background:rgba(255,255,255,.96);
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
  border-bottom:1px solid rgba(0,0,0,.06);
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 36px;
  transition:box-shadow .3s;
}
.nav.scrolled{box-shadow:0 4px 24px rgba(0,0,0,.06)}

.nav-logo{display:flex;align-items:center;gap:10px;flex-shrink:0}
.nav-mark{display:grid;grid-template-columns:1fr 1fr;gap:3px}
.nav-mark span{display:block;width:7px;height:7px;background:var(--at)}

.nav-brand{
  display:flex;
  flex-direction:column;
  gap:1px;
  line-height:1;
}
.nav-brand strong{
  font-family:var(--f);
  font-weight:500;
  font-size:16px;
  letter-spacing:2px;
  color:var(--bk);
  text-transform:uppercase;
}
.nav-brand small{
  font-family:var(--m);
  font-size:8px;
  letter-spacing:1.5px;
  color:var(--at);
}

/* Links centro */
.nav-links{
  display:flex;
  align-items:center;
  gap:36px;
  list-style:none;
}
.nav-links > li{position:relative}
.nav-links > li > a{
  font-size:13px;
  font-weight:500;
  letter-spacing:.5px;
  color:rgba(0,0,0,.65);
  text-transform:uppercase;
  transition:color .2s;
  padding:8px 8px;
  display:inline-block;
}
.nav-links > li > a:hover,
.nav-links > li > a.active{color:var(--at)}

/* Dropdown */
.nav-drop{
  position:absolute;
  top:100%;
  left:50%;
  transform:translateX(-50%) translateY(-6px);
  background:var(--wh);
  border:1px solid rgba(0,0,0,.06);
  box-shadow:0 12px 40px rgba(0,0,0,.08);
  min-width:240px;
  padding:14px 0 8px;
  list-style:none;
  opacity:0;
  pointer-events:none;
  transition:opacity .25s,transform .25s var(--spring);
  border-top:2px solid var(--at);
}
.nav-links > li:hover .nav-drop{
  opacity:1;
  pointer-events:all;
  transform:translateX(-50%) translateY(0);
}
.nav-drop li a{
  display:block;
  padding:11px 22px;
  font-size:13px;
  font-weight:400;
  color:rgba(0,0,0,.6);
  transition:background .15s,color .15s;
  text-transform:none;
  letter-spacing:0;
}
.nav-drop li a:hover{background:var(--gr);color:var(--at)}

/* CTA derecha */
.nav-cta{
  background:var(--at);
  color:var(--wh)!important;
  font-family:var(--m)!important;
  font-size:11px!important;
  font-weight:700!important;
  letter-spacing:1.5px;
  text-transform:uppercase;
  padding:14px 36px;
  transition:background .2s,color .2s;
  white-space:nowrap;
  flex-shrink:0;
}
.nav-cta:hover{background:var(--bk);color:var(--wh)!important}

.nav-burger{display:none;flex-direction:column;gap:5px;cursor:pointer;background:none;border:none}
.nav-burger span{display:block;width:24px;height:2px;background:var(--bk);transition:.3s}

/* ═══════════════════════════════════════════════
   HERO — full width blanco, número gigante decorativo
   Diferenciador: imagen a la derecha + big numero rotado
   ═══════════════════════════════════════════════ */
.hero{
  min-height:100vh;
  padding-top:76px;
  background:var(--bk);            /* fallback mientras carga el vídeo */
  position:relative;
  overflow:hidden;
  display:flex;
  align-items:center;
}

/* Vídeo de portada a pantalla completa */
.hero-video{
  position:absolute;
  inset:0;
  z-index:0;
  overflow:hidden;
}
.hero-video video{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
/* Velo oscuro sobre el vídeo — subir/bajar este alpha para
   más o menos negro sobre la portada (antes era .95) */
.hero-video::after{
  content:'';
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.72);
  pointer-events:none;
}

.hero-grid{
  width:100%;
  max-width:1080px;
  margin:0 auto;
  padding:60px 32px;
  display:grid;
  grid-template-columns:1fr;
  gap:0;
  align-items:center;
  justify-items:center;
  text-align:center;
  position:relative;
  z-index:2;
}

/* "01" gigante en el fondo — REEMPLAZADO por firulete decorativo */
.hero-deco{
  position:absolute;
  right:-60px;
  bottom:-60px;
  width:clamp(280px,32vw,460px);
  height:clamp(280px,32vw,460px);
  pointer-events:none;
  user-select:none;
  z-index:1;
  opacity:.55;
}
.hero-deco--left{
  right:auto;
  bottom:auto;
  left:-80px;
  top:-80px;
  width:clamp(180px,20vw,300px);
  height:clamp(180px,20vw,300px);
  opacity:.28;
}
.hero-deco svg{width:100%;height:100%;display:block}
.hero-deco svg .ring{fill:none;stroke:var(--at);stroke-width:.75;opacity:.35}
.hero-deco svg .dot{fill:var(--at);opacity:.65}
.hero-deco svg .arc{fill:none;stroke:var(--iv);stroke-width:.75;opacity:.08}
.hero-deco svg .square{fill:var(--at);opacity:.85}
.hero-deco svg .square-bk{fill:var(--iv);opacity:.18}
.hero-deco svg .line{stroke:var(--at);stroke-width:1;opacity:.45}
.hero-deco--spin svg{animation:spin 100s linear infinite}
.hero-deco--spin-slow svg{animation:spin 200s linear infinite reverse}

/* Puntos flotantes */
.hero-dots{position:absolute;inset:0;pointer-events:none;z-index:1}
.hero-dot{
  position:absolute;
  width:3px;height:3px;
  background:var(--at);
  border-radius:50%;
  opacity:.4;
  animation:pulse-dot 4s ease-in-out infinite;
}
.hero-dot--lg{
  width:5px;height:5px;
  opacity:.25;
  animation-duration:6s;
}
@keyframes pulse-dot{
  0%,100%{opacity:.15;transform:scale(1)}
  50%{opacity:.5;transform:scale(1.5)}
}

/* Glow central y patrón de fondo */
.hero::before{
  content:'';
  position:absolute;
  inset:0;
  background:
    radial-gradient(ellipse 55% 45% at 50% 52%, rgba(193,105,80,.07) 0%, transparent 65%),
    radial-gradient(ellipse 80% 60% at 85% 80%, rgba(193,105,80,.05) 0%, transparent 55%),
    radial-gradient(ellipse 50% 40% at 10% 15%, rgba(193,105,80,.04) 0%, transparent 50%);
  pointer-events:none;
  z-index:1;   /* sobre el vídeo, bajo las decos */
}
.hero::after{
  content:'';
  position:absolute;
  inset:0;
  background-image:radial-gradient(circle, rgba(252,249,238,.028) 1px, transparent 1px);
  background-size:44px 44px;
  pointer-events:none;
  z-index:1;
}

.hero-eyebrow{
  font-family:var(--m);
  font-size:11px;
  letter-spacing:3px;
  text-transform:uppercase;
  color:var(--at);
  margin-bottom:24px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
}
.hero-eyebrow::before{
  content:'';
  display:block;
  width:36px;
  height:1px;
  background:var(--at);
}

.hero-title{
  font-size:clamp(28px,3.6vw,52px);
  font-weight:300;
  line-height:1.1;
  letter-spacing:-1.5px;
  margin-bottom:32px;
  color:var(--iv);
}
.hero-title em{
  font-style:italic;
  font-weight:300;
  color:var(--at);
}

.hero-desc{
  font-size:17px;
  font-weight:300;
  color:rgba(252,249,238,.5);
  line-height:1.7;
  max-width:480px;
  margin:0 auto 40px;
}

.hero-actions{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}
.hero .btn--out{color:var(--iv);border-color:rgba(252,249,238,.3)}
.hero .btn--out:hover{background:var(--iv);color:var(--bk);border-color:var(--iv)}

.hero-img{
  position:relative;
  aspect-ratio:4/5;
  overflow:hidden;
}
.hero-img img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .8s var(--ease);
}
.hero-img:hover img{transform:scale(1.04)}

/* Pequeño card flotante sobre la imagen */
.hero-card{
  position:absolute;
  bottom:24px;
  left:24px;
  background:var(--wh);
  padding:18px 22px;
  display:flex;
  align-items:center;
  gap:14px;
  box-shadow:0 8px 24px rgba(0,0,0,.08);
}
.hero-card-mark{
  width:36px;height:36px;
  background:var(--at);
  display:flex;
  align-items:center;
  justify-content:center;
}
.hero-card-mark::after{
  content:'';
  width:14px;height:14px;
  background:var(--bk);
  clip-path:polygon(50% 0%,100% 50%,50% 100%,0% 50%);
}
.hero-card-text{display:flex;flex-direction:column;line-height:1.3}
.hero-card-text strong{font-size:13px;font-weight:500;color:var(--bk)}
.hero-card-text small{font-family:var(--m);font-size:9px;letter-spacing:1.5px;color:var(--at);text-transform:uppercase}

/* ═══════════════════════════════════════════════
   BOTONES
   ═══════════════════════════════════════════════ */
.btn{
  display:inline-flex;
  align-items:center;
  gap:12px;
  font-family:var(--m);
  font-size:11px;
  letter-spacing:1.5px;
  text-transform:uppercase;
  padding:16px 30px;
  cursor:pointer;
  border:none;
  transition:all .25s var(--ease);
}
.btn-arr{
  display:inline-block;
  width:18px;height:1px;
  background:currentColor;
  position:relative;
  transition:width .25s var(--spring);
}
.btn-arr::after{
  content:'';
  position:absolute;
  right:0;top:50%;
  transform:translateY(-50%) rotate(45deg);
  width:7px;height:7px;
  border-right:1px solid currentColor;
  border-top:1px solid currentColor;
}
.btn:hover .btn-arr{width:26px}

.btn--bk{background:var(--bk);color:var(--wh)}
.btn--bk:hover{background:var(--at);color:var(--bk)}
.btn--at{background:var(--at);color:var(--bk)}
.btn--at:hover{background:var(--bk);color:var(--wh)}
.btn--out{background:transparent;color:var(--bk);border:1.5px solid var(--bk)}
.btn--out:hover{background:var(--bk);color:var(--wh)}
.btn--out-l{background:transparent;color:var(--wh);border:1.5px solid rgba(255,255,255,.35)}
.btn--out-l:hover{background:var(--wh);color:var(--bk);border-color:var(--wh)}
.btn--wh{background:var(--wh);color:var(--bk)}
.btn--wh:hover{background:var(--at);color:var(--bk)}

/* ═══════════════════════════════════════════════
   SECTION HEADER
   ═══════════════════════════════════════════════ */
.sec-head{margin-bottom:64px;display:grid;grid-template-columns:1fr auto;gap:32px;align-items:end}
.sec-head-text{max-width:720px}
.sec-eyebrow{
  font-family:var(--m);
  font-size:11px;
  letter-spacing:3px;
  text-transform:uppercase;
  color:var(--at);
  margin-bottom:16px;
  display:inline-flex;
  align-items:center;
  gap:12px;
}
.sec-eyebrow::before{content:'';display:block;width:28px;height:1px;background:var(--at)}
.sec-title{
  font-size:clamp(28px,4vw,52px);
  font-weight:300;
  letter-spacing:-1px;
  line-height:1.08;
  margin-bottom:18px;
}
.sec-title em{font-style:italic;color:var(--at)}
.sec-desc{
  font-size:16px;
  font-weight:300;
  color:rgba(0,0,0,.55);
  line-height:1.7;
  max-width:560px;
}

/* En sección oscura */
.section--dark{background:var(--dk);color:var(--iv)}
.section--dark .sec-title{color:var(--iv)}
.section--dark .sec-desc{color:rgba(252,249,238,.55)}
.section--gr{background:var(--gr)}
.section--wh{background:var(--wh)}

/* DIVIDERS — franjas delgadas para separar secciones */
.divider{
  height:48px;
  position:relative;
}
.divider--gr{background:var(--gr)}
.divider--wh{background:var(--wh)}
.divider--lq{background:var(--lq)}

/* Divider con línea decorativa Atelier */
.divider--line{
  height:80px;
  background:var(--wh);
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  position:relative;
}
.divider--line::before,
.divider--line::after{
  content:'';
  display:block;
  width:48px;
  height:1px;
  background:var(--at);
}
.divider--line span{
  display:block;
  width:8px;
  height:8px;
  background:var(--at);
  transform:rotate(45deg);
}
.divider--line-gr{background:var(--gr)}
.divider--line-lq{background:var(--lq)}

/* ═══════════════════════════════════════════════
   PRODUCTOS GRID — 5 cards estilo masonry-light
   Hover: imagen escala, overlay con flecha
   ═══════════════════════════════════════════════ */
.productos-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  grid-template-rows:auto auto;
  gap:16px;
}

.producto{
  position:relative;
  overflow:hidden;
  background:var(--bk);
  cursor:pointer;
  aspect-ratio:4/5;
  display:block;
}
.producto:nth-child(1){grid-column:span 2;grid-row:span 2;aspect-ratio:auto}
.producto:nth-child(1) .producto-title{font-size:30px}

.producto-img{
  width:100%;height:100%;
  object-fit:cover;
  display:block;
  transition:transform .6s var(--ease),filter .4s;
  filter:brightness(.85);
}
.producto:hover .producto-img{transform:scale(1.06);filter:brightness(.65)}

.producto-overlay{
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  padding:24px;
  z-index:2;
  background:linear-gradient(to bottom,transparent 30%,rgba(0,0,0,.7) 100%);
}

.producto-num{
  font-family:var(--m);
  font-size:11px;
  letter-spacing:2px;
  color:var(--at);
  align-self:flex-start;
  padding:5px 10px;
  border:1px solid rgba(252,249,238,.3);
}

.producto-bottom{display:flex;align-items:flex-end;justify-content:space-between;gap:14px}

.producto-title{
  font-size:22px;
  font-weight:400;
  color:var(--wh);
  line-height:1.15;
  letter-spacing:-.3px;
  max-width:260px;
}

.producto-arrow{
  width:42px;height:42px;
  background:var(--at);
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  transform:translateX(8px);
  opacity:0;
  transition:all .35s var(--spring);
}
.producto:hover .producto-arrow{transform:translateX(0);opacity:1}
.producto-arrow::after{
  content:'';
  width:8px;height:8px;
  border-right:1.5px solid var(--bk);
  border-top:1.5px solid var(--bk);
  transform:rotate(45deg);
  margin-right:4px;
}

/* ═══════════════════════════════════════════════
   FORMACIÓN — dos cards lado a lado, con tags
   ═══════════════════════════════════════════════ */
.formacion-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:24px;
}

.curso{
  background:var(--wh);
  border:1px solid rgba(0,0,0,.08);
  overflow:hidden;
  display:flex;
  flex-direction:column;
  transition:transform .3s var(--spring),border-color .3s;
}
.curso:hover{transform:translateY(-6px);border-color:var(--at)}

.curso-img{
  width:100%;
  aspect-ratio:4/3;
  object-fit:cover;
}

.curso-body{
  padding:32px 32px 36px;
  flex:1;
  display:flex;
  flex-direction:column;
}

.curso-meta{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:12px;
}
.curso-tag{
  font-family:var(--m);
  font-size:10px;
  letter-spacing:1.5px;
  text-transform:uppercase;
  color:var(--at);
  padding:4px 10px;
  border:1px solid rgba(193,105,80,.3);
}
.curso-duration{
  font-family:var(--m);
  font-size:11px;
  color:rgba(0,0,0,.4);
  letter-spacing:.5px;
}

.curso-title{
  font-size:28px;
  font-weight:300;
  letter-spacing:-.5px;
  line-height:1.15;
  margin-bottom:14px;
  color:var(--bk);
}
.curso-title strong{font-weight:500;color:var(--at)}

.curso-desc{
  font-size:15px;
  font-weight:300;
  color:rgba(0,0,0,.55);
  line-height:1.7;
  margin-bottom:28px;
  flex:1;
}

/* ═══════════════════════════════════════════════
   "SOMOS DIFERENTES" — 5 pasos en línea
   Diferenciador: barra horizontal con números grandes
   ═══════════════════════════════════════════════ */
.pasos-strip{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  border-top:1px solid rgba(252,249,238,.1);
  border-bottom:1px solid rgba(252,249,238,.1);
}
.paso{
  padding:48px 28px;
  border-right:1px solid rgba(252,249,238,.1);
  text-align:center;
  transition:background .25s;
  position:relative;
}
.paso:last-child{border-right:none}
.paso:hover{background:rgba(252,249,238,.04)}
.paso-num{
  font-family:var(--m);
  font-size:11px;
  letter-spacing:2px;
  color:var(--at);
  margin-bottom:24px;
  display:block;
}
.paso-name{
  font-size:24px;
  font-weight:300;
  color:var(--iv);
  letter-spacing:-.3px;
}

/* ═══════════════════════════════════════════════
   QUIENES SOMOS — split: texto izquierda, imagen derecha
   ═══════════════════════════════════════════════ */
.quienes-block{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:64px;
  align-items:center;
}
.quienes-text h2{
  font-size:clamp(28px,3.8vw,46px);
  font-weight:300;
  letter-spacing:-.5px;
  line-height:1.12;
  margin-bottom:24px;
}
.quienes-text h2 em{font-style:italic;color:var(--at)}
.quienes-text p{
  font-size:16px;
  font-weight:300;
  color:rgba(0,0,0,.6);
  line-height:1.85;
  margin-bottom:18px;
}
.quienes-img-wrap{
  position:relative;
  aspect-ratio:1/1;
}
.quienes-img-wrap img{
  width:100%;height:100%;
  object-fit:cover;
}
/* Línea decorativa Atelier */
.quienes-img-wrap::after{
  content:'';
  position:absolute;
  bottom:-20px;
  right:-20px;
  width:100px;
  height:100px;
  background:var(--at);
  z-index:-1;
}

/* ═══════════════════════════════════════════════
   NUEVA ERA — split text + image
   ═══════════════════════════════════════════════ */
.nueva-era-block{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:80px;
  align-items:center;
}
.nueva-era-img{
  position:relative;
  aspect-ratio:4/3;
  overflow:hidden;
}
.nueva-era-img img{
  width:100%;height:100%;
  object-fit:cover;
  transition:transform .8s var(--ease);
}
.nueva-era-img:hover img{transform:scale(1.04)}

/* ═══════════════════════════════════════════════
   LOGOS STRIP — partners/marcas
   ═══════════════════════════════════════════════ */
/* logos carousel — infinite autoscroll */
.logos-strip{
  width:100%;
  overflow:hidden;
  border-top:1px solid rgba(0,0,0,.07);
  border-bottom:1px solid rgba(0,0,0,.07);
  margin-top:64px;
  -webkit-mask:linear-gradient(to right,transparent 0%,black 12%,black 88%,transparent 100%);
  mask:linear-gradient(to right,transparent 0%,black 12%,black 88%,transparent 100%);
}
.logos-track{
  display:inline-flex;
  align-items:center;
  white-space:nowrap;
  will-change:transform;
  animation:logos-scroll 30s linear infinite;
}
.logos-strip:hover .logos-track{animation-play-state:paused}
@keyframes logos-scroll{
  from{transform:translateX(0)}
  to{transform:translateX(-50%)}
}
.logos-item{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:28px 52px;
  flex-shrink:0;
  filter:grayscale(100%) opacity(.4);
  transition:filter .3s;
}
.logos-item:hover{filter:grayscale(0%) opacity(1)}
.logos-item img{
  height:32px;
  width:auto;
  max-width:120px;
  object-fit:contain;
  display:block;
}
@media(prefers-reduced-motion:reduce){
  .logos-track{animation:none}
}

/* ═══════════════════════════════════════════════
   DEJA DE RECIBIR EXCUSAS — 4 columns
   ═══════════════════════════════════════════════ */
.excusas-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:0;
  border-top:1px solid rgba(0,0,0,.08);
  margin-top:56px;
}
.excusa-item{
  padding:40px 32px;
  border-right:1px solid rgba(0,0,0,.08);
  position:relative;
  transition:background .25s;
}
.excusa-item:last-child{border-right:none}
.excusa-item:hover{background:var(--gr)}
.excusa-num{
  font-family:var(--m);
  font-size:10px;
  letter-spacing:2px;
  color:var(--at);
  display:block;
  margin-bottom:20px;
}
.excusa-item h3{
  font-size:21px;
  font-weight:300;
  letter-spacing:-.3px;
  line-height:1.2;
  margin-bottom:16px;
  color:var(--bk);
}
.excusa-item p{
  font-size:15px;
  font-weight:300;
  color:rgba(0,0,0,.5);
  line-height:1.75;
}
.excusa-link{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-family:var(--m);
  font-size:10px;
  letter-spacing:1.5px;
  text-transform:uppercase;
  color:var(--at);
  text-decoration:none;
  margin-top:20px;
  transition:gap .2s;
}
.excusa-link:hover{gap:14px}
.excusa-link::after{
  content:'→';
  font-size:13px;
}

/* ═══════════════════════════════════════════════
   ¿AÚN TIENES DUDAS? — testimonios + video
   ═══════════════════════════════════════════════ */
.dudas-block{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:0;
  min-height:540px;
}
.dudas-left{
  padding:64px 56px 64px 0;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:40px;
}
.dudas-right{
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--gr);
  padding:48px 40px;
}
.dudas-video-wrap{
  width:100%;
  position:relative;
  aspect-ratio:16/9;
  border-radius:4px;
  overflow:hidden;
  box-shadow:0 8px 40px rgba(0,0,0,.18);
}
.dudas-video-wrap iframe,
.dudas-video-wrap video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border:none;
  display:block;
}
.testimonio-card{
  display:flex;
  flex-direction:column;
  gap:16px;
  padding:28px;
  background:var(--gr);
  border-left:3px solid var(--at);
  transition:background .2s;
}
.testimonio-card:hover{background:var(--lq)}
.testimonio-quote{
  font-size:16px;
  font-weight:300;
  line-height:1.75;
  color:rgba(0,0,0,.75);
  font-style:italic;
}
.testimonio-quote::before{
  content:'"';
  font-size:40px;
  line-height:.6;
  color:var(--at);
  display:block;
  margin-bottom:10px;
  font-style:normal;
}
.testimonio-author{
  display:flex;
  align-items:center;
  gap:14px;
}
.testimonio-author-img{
  width:44px;height:44px;
  border-radius:50%;
  overflow:hidden;
  flex-shrink:0;
  background:var(--lq);
}
.testimonio-author-img img{width:100%;height:100%;object-fit:cover;object-position:top}
.testimonio-author-info strong{
  display:block;
  font-size:14px;
  font-weight:500;
  color:var(--bk);
}
.testimonio-author-info span{
  font-family:var(--m);
  font-size:10px;
  letter-spacing:1.5px;
  text-transform:uppercase;
  color:var(--mn);
}

@media(max-width:1024px){
  .nueva-era-block{grid-template-columns:1fr;gap:40px}
  .logos-item{padding:24px 32px}
  .excusas-grid{grid-template-columns:repeat(2,1fr)}
  .excusa-item:nth-child(2){border-right:none}
  .excusa-item:nth-child(3){border-top:1px solid rgba(0,0,0,.08)}
  .excusa-item:nth-child(4){border-top:1px solid rgba(0,0,0,.08);border-right:none}
  .dudas-block{grid-template-columns:1fr}
  .dudas-left{padding:48px 0}
  .dudas-right{min-height:340px}
}
@media(max-width:680px){
  .logos-item{padding:20px 24px}
  .excusas-grid{grid-template-columns:1fr}
  .excusa-item{border-right:none;border-top:1px solid rgba(0,0,0,.08)}
  .excusa-item:first-child{border-top:none}
}

/* ═══════════════════════════════════════════════
   EQUIPO — team member cards
   ═══════════════════════════════════════════════ */
.team-grid{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:24px;
  margin-top:48px;
}
.team-card{
  display:flex;
  flex-direction:column;
  gap:0;
}
.team-card-img{
  aspect-ratio:3/4;
  overflow:hidden;
  background:var(--lq);
}
.team-card-img img{
  width:100%;height:100%;
  object-fit:cover;
  object-position:top center;
  filter:grayscale(15%);
  transition:transform .6s var(--ease),filter .4s;
}
.team-card:hover .team-card-img img{transform:scale(1.04);filter:grayscale(0%)}
.team-card-info{
  padding:18px 0 0;
  border-top:2px solid var(--at);
  margin-top:16px;
}
.team-card-name{
  font-size:17px;
  font-weight:400;
  letter-spacing:-.2px;
  color:var(--bk);
  line-height:1.2;
}
.team-card-role{
  font-family:var(--m);
  font-size:10px;
  letter-spacing:1.5px;
  text-transform:uppercase;
  color:var(--at);
  margin-top:6px;
}

/* ═══════════════════════════════════════════════
   QUÉ OFRECEMOS — 4 feature columns
   ═══════════════════════════════════════════════ */
.ofrece-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:0;
  border-top:1px solid rgba(0,0,0,.08);
  margin-top:48px;
}
.ofrece-item{
  padding:40px 32px;
  border-right:1px solid rgba(0,0,0,.08);
  position:relative;
}
.ofrece-item:last-child{border-right:none}
.ofrece-num{
  font-family:var(--m);
  font-size:10px;
  letter-spacing:2px;
  color:var(--at);
  display:block;
  margin-bottom:24px;
}
.ofrece-item h3{
  font-size:22px;
  font-weight:300;
  letter-spacing:-.3px;
  line-height:1.2;
  margin-bottom:16px;
  color:var(--bk);
}
.ofrece-item p{
  font-size:15px;
  font-weight:300;
  color:rgba(0,0,0,.55);
  line-height:1.75;
}

/* licencia sanitaria */
.licencia-badge{
  display:inline-flex;
  align-items:center;
  gap:10px;
  background:var(--gr);
  border-left:3px solid var(--at);
  padding:12px 20px;
  margin-top:28px;
  font-family:var(--m);
  font-size:11px;
  letter-spacing:1.5px;
  text-transform:uppercase;
  color:rgba(0,0,0,.6);
}

@media(max-width:1024px){
  .team-grid{grid-template-columns:repeat(3,1fr)}
  .ofrece-grid{grid-template-columns:repeat(2,1fr)}
  .ofrece-item:nth-child(2){border-right:none}
  .ofrece-item:nth-child(3){border-top:1px solid rgba(0,0,0,.08)}
  .ofrece-item:nth-child(4){border-top:1px solid rgba(0,0,0,.08);border-right:none}
}
@media(max-width:680px){
  .team-grid{grid-template-columns:repeat(2,1fr)}
  .ofrece-grid{grid-template-columns:1fr}
  .ofrece-item{border-right:none;border-top:1px solid rgba(0,0,0,.08)}
  .ofrece-item:first-child{border-top:none}
}

/* ═══════════════════════════════════════════════
   TECNOLOGIA — 3 cards verticales
   ═══════════════════════════════════════════════ */
.tech-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1px;
  background:rgba(0,0,0,.08);
}
.tech-item{
  background:var(--wh);
  padding:48px 36px 52px;
  transition:background .25s;
}
.tech-item:hover{background:var(--gr)}
.tech-num{
  font-family:var(--m);
  font-size:36px;
  font-weight:400;
  color:var(--at);
  margin-bottom:24px;
  display:block;
  letter-spacing:-1px;
}
.tech-title{
  font-size:22px;
  font-weight:400;
  color:var(--bk);
  margin-bottom:14px;
}
.tech-desc{
  font-size:14px;
  font-weight:300;
  color:rgba(0,0,0,.55);
  line-height:1.75;
}

/* ═══════════════════════════════════════════════
   CTA STRIP — banda Atelier completa
   ═══════════════════════════════════════════════ */
.cta-strip{
  background:var(--at);
  padding:80px 32px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:32px;
  flex-wrap:wrap;
}
.cta-strip h2{
  font-size:clamp(26px,3.5vw,42px);
  font-weight:300;
  color:var(--bk);
  letter-spacing:-.5px;
  line-height:1.1;
  max-width:560px;
}
.cta-strip h2 strong{font-weight:500}

/* ═══════════════════════════════════════════════
   CONTACTO — split: info izquierda atelier + form derecha
   ═══════════════════════════════════════════════ */
.contacto-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:48px;
  align-items:start;
}
.contacto-info{
  background:var(--gr);
  padding:48px 40px;
}
.contacto-info-item{
  padding:24px 0;
  border-bottom:1px solid rgba(0,0,0,.08);
}
.contacto-info-item:first-child{padding-top:0}
.contacto-info-item:last-child{border-bottom:none}
.contacto-info-label{
  font-family:var(--m);
  font-size:10px;
  letter-spacing:2px;
  text-transform:uppercase;
  color:var(--at);
  margin-bottom:8px;
  display:block;
}
.contacto-info-val{
  font-size:17px;
  font-weight:400;
  color:var(--bk);
  line-height:1.5;
}
.contacto-info-val a{color:var(--bk);transition:color .2s}
.contacto-info-val a:hover{color:var(--at)}

/* Form */
.contacto-form{padding-top:8px}
.ff{margin-bottom:22px}
.ff label{
  display:block;
  font-family:var(--m);
  font-size:10px;
  letter-spacing:2px;
  text-transform:uppercase;
  color:rgba(0,0,0,.4);
  margin-bottom:8px;
}
.ff input,.ff textarea,.ff select{
  width:100%;
  border:none;
  border-bottom:1.5px solid rgba(0,0,0,.15);
  background:transparent;
  padding:12px 0;
  font-family:var(--f);
  font-size:16px;
  font-weight:300;
  color:var(--bk);
  outline:none;
  transition:border-color .2s;
  border-radius:0;
  -webkit-appearance:none;
}
.ff input:focus,.ff textarea:focus,.ff select:focus{border-color:var(--at)}
.ff textarea{min-height:110px;resize:none}
.ff-2{display:grid;grid-template-columns:1fr 1fr;gap:0 28px}
.ff-check{display:flex;align-items:flex-start;gap:10px;margin-bottom:24px}
.ff-check input{width:auto;margin-top:3px;accent-color:var(--at);cursor:pointer}
.ff-check label{font-size:12px;color:rgba(0,0,0,.45);line-height:1.6;cursor:pointer}
.ff-check label a{color:var(--at)}

/* Mapa */
.mapa-iframe{
  width:100%;
  height:240px;
  border:none;
  display:block;
  filter:grayscale(20%);
  margin-top:32px;
}

/* ═══════════════════════════════════════════════
   FOOTER — negro, 4 columnas
   ═══════════════════════════════════════════════ */
.footer{background:var(--dk);color:var(--iv);padding:64px 0 0}
.footer-grid{
  display:grid;
  grid-template-columns:1.4fr 1fr 1fr 1fr;
  gap:48px;
  padding-bottom:40px;
  border-bottom:1px solid rgba(255,255,255,.07);
}
.footer-logo-row{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.footer-name{font-family:var(--f);font-weight:500;font-size:18px;letter-spacing:2px;text-transform:uppercase;color:var(--iv)}
.footer-tagline{font-size:14px;font-weight:300;color:rgba(252,249,238,.4);line-height:1.7;max-width:320px}
.footer-byline{font-family:var(--m);font-size:9px;letter-spacing:2px;color:var(--at);text-transform:uppercase;margin-top:14px;display:block}

.footer-col h5{
  font-family:var(--m);
  font-size:10px;
  letter-spacing:2.5px;
  text-transform:uppercase;
  color:var(--at);
  margin-bottom:20px;
}
.footer-col a,.footer-col p{
  display:block;
  font-size:14px;
  font-weight:300;
  color:rgba(252,249,238,.45);
  line-height:2.1;
  transition:color .2s;
}
.footer-col a:hover{color:var(--iv)}

.footer-social{
  display:flex;
  gap:10px;
  margin-top:8px;
}
.footer-social a{
  width:36px;height:36px;
  border:1px solid rgba(252,249,238,.15);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-family:var(--m);
  font-size:10px;
  letter-spacing:.5px;
  transition:all .2s;
  line-height:1;
}
.footer-social a:hover{background:var(--at);color:var(--bk);border-color:var(--at)}

.footer-bottom{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:20px 0;
  flex-wrap:wrap;
  gap:10px;
}
.footer-copy{font-family:var(--m);font-size:10px;letter-spacing:1px;color:rgba(252,249,238,.22)}
.footer-copy a{color:rgba(252,249,238,.35);text-decoration:none;transition:color .2s}
.footer-copy a:hover{color:var(--at)}

/* ═══════════════════════════════════════════════
   PAGE HERO — para páginas internas
   Default: fondo gris claro (alterna con sección blanca siguiente)
   ═══════════════════════════════════════════════ */
.page-hero{
  padding:140px 32px 80px;
  background:
    linear-gradient(rgba(0,0,0,.95), rgba(0,0,0,.95)),
    url('../img/fondo1.jpg') center/cover no-repeat;
  position:relative;
  overflow:hidden;
  color:var(--iv);
}
.page-hero::before{
  content:'';
  position:absolute;
  inset:0;
  background:
    radial-gradient(ellipse 55% 45% at 50% 52%, rgba(193,105,80,.07) 0%, transparent 65%),
    radial-gradient(ellipse 80% 60% at 85% 80%, rgba(193,105,80,.05) 0%, transparent 55%),
    radial-gradient(ellipse 50% 40% at 10% 15%, rgba(193,105,80,.04) 0%, transparent 50%);
  pointer-events:none;
  z-index:0;
}
.page-hero::after{
  content:'';
  position:absolute;
  inset:0;
  background-image:radial-gradient(circle, rgba(252,249,238,.028) 1px, transparent 1px);
  background-size:44px 44px;
  pointer-events:none;
  z-index:0;
}

.page-hero-wrap{
  max-width:1240px;
  margin:0 auto;
  position:relative;
  z-index:2;
}

/* Firulete decorativo SVG */
.page-hero-deco{
  position:absolute;
  right:32px;
  top:50%;
  transform:translateY(-50%);
  width:clamp(180px,22vw,320px);
  height:clamp(180px,22vw,320px);
  pointer-events:none;
  user-select:none;
  z-index:1;
  opacity:.55;
}
.page-hero-deco svg{width:100%;height:100%;display:block}
.page-hero-deco svg .ring{
  fill:none;
  stroke:var(--at);
  stroke-width:1;
  opacity:.45;
}
.page-hero-deco svg .dot{fill:var(--at);opacity:.6}
.page-hero-deco svg .arc{
  fill:none;
  stroke:var(--iv);
  stroke-width:1;
  opacity:.08;
}
.page-hero-deco svg .line{
  stroke:var(--at);
  stroke-width:1.5;
  opacity:.7;
}
.page-hero-deco svg .square{fill:var(--at);opacity:.9}
.page-hero-deco svg .square-bk{fill:var(--iv);opacity:.18}
.page-hero-deco--spin svg{animation:spin 80s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.page-hero-breadcrumb{
  font-family:var(--m);
  font-size:11px;
  letter-spacing:2px;
  text-transform:uppercase;
  color:rgba(252,249,238,.5);
  margin-bottom:20px;
}
.page-hero-breadcrumb a{color:rgba(252,249,238,.4);text-decoration:none}
.page-hero-breadcrumb a:hover{color:var(--at)}
.page-hero-title{
  font-size:clamp(36px,5.5vw,72px);
  font-weight:300;
  letter-spacing:-1.5px;
  line-height:1;
  max-width:880px;
  color:var(--iv);
}
.page-hero-title em{font-style:italic;color:var(--at)}
.page-hero-desc{
  font-size:17px;
  font-weight:300;
  color:rgba(252,249,238,.55);
  max-width:600px;
  line-height:1.7;
  margin-top:20px;
}

/* ═══════════════════════════════════════════════
   PRODUCTO DETAIL — split con imagen + texto
   ═══════════════════════════════════════════════ */
.detail-block{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:80px;
  align-items:center;
}
.detail-block.reverse .detail-text{order:2}
.detail-block.reverse .detail-img{order:1}
.detail-text h2{
  font-size:clamp(26px,3.5vw,42px);
  font-weight:300;
  letter-spacing:-.5px;
  line-height:1.1;
  margin-bottom:20px;
}
.detail-text h2 em{font-style:italic;color:var(--at)}
.detail-text p{
  font-size:16px;
  font-weight:300;
  color:rgba(0,0,0,.6);
  line-height:1.85;
  margin-bottom:18px;
}
.detail-img{
  position:relative;
  aspect-ratio:4/5;
  overflow:hidden;
}
.detail-img img{width:100%;height:100%;object-fit:cover;display:block}

/* Lista de características */
.detail-features{
  list-style:none;
  margin-top:24px;
  margin-bottom:32px;
}
.detail-features li{
  padding:14px 0;
  border-bottom:1px solid rgba(0,0,0,.08);
  font-size:15px;
  font-weight:300;
  color:rgba(0,0,0,.7);
  display:flex;
  align-items:center;
  gap:14px;
}
.detail-features li::before{
  content:'';
  display:block;
  width:6px;height:6px;
  background:var(--at);
  flex-shrink:0;
}

/* ═══════════════════════════════════════════════
   TIPOS DE PRODUCTO — grid de tarjetas
   ═══════════════════════════════════════════════ */
.types-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:1px;
  background:rgba(0,0,0,.07);
  margin-top:16px;
}
.type-item{
  background:var(--wh);
  padding:36px 40px;
  transition:background .25s;
}
.type-item:hover{background:var(--gr)}
.type-item-num{
  font-family:var(--m);
  font-size:11px;
  letter-spacing:2px;
  color:var(--at);
  margin-bottom:14px;
  display:block;
}
.type-item h3{
  font-size:20px;
  font-weight:400;
  letter-spacing:-.3px;
  margin-bottom:12px;
  color:var(--bk);
}
.type-item p{
  font-size:14px;
  font-weight:300;
  color:rgba(0,0,0,.55);
  line-height:1.75;
}

/* ═══════════════════════════════════════════════
   VENTAJAS / INCONVENIENTES
   ═══════════════════════════════════════════════ */
.pros-cons{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:24px;
}
.pros-cons-col{padding:40px 40px 44px}
.pros-cons-col--pro{background:var(--gr)}
.pros-cons-col--con{background:var(--wh);border:1px solid rgba(0,0,0,.07)}
.pros-cons-col h3{
  font-size:13px;
  font-family:var(--m);
  letter-spacing:2px;
  text-transform:uppercase;
  margin-bottom:28px;
}
.pros-cons-col--pro h3{color:var(--at)}
.pros-cons-col--con h3{color:rgba(0,0,0,.35)}
.pros-cons-col ul{list-style:none}
.pros-cons-col ul li{
  padding:13px 0;
  border-bottom:1px solid rgba(0,0,0,.07);
  font-size:15px;
  font-weight:300;
  color:rgba(0,0,0,.7);
  display:flex;
  align-items:flex-start;
  gap:12px;
  line-height:1.55;
}
.pros-cons-col ul li:last-child{border-bottom:none}
.pros-cons-col ul li::before{
  content:'';
  display:block;
  width:6px;height:6px;
  border-radius:50%;
  flex-shrink:0;
  margin-top:6px;
}
.pros-cons-col--pro ul li::before{background:var(--at)}
.pros-cons-col--con ul li::before{background:rgba(0,0,0,.18)}

@media(max-width:680px){
  .types-grid{grid-template-columns:1fr}
  .pros-cons{grid-template-columns:1fr}
  .pros-cons-col{padding:28px 24px}
}

/* ═══════════════════════════════════════════════
   GALERÍA DE FOTOS — grid tipo masonry-light
   ═══════════════════════════════════════════════ */
.gallery-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  grid-auto-rows:220px;
  gap:4px;
}
.gallery-item{overflow:hidden;background:var(--bk)}
.gallery-item:first-child{grid-column:span 2;grid-row:span 2}
.gallery-item img{
  width:100%;height:100%;
  object-fit:cover;
  display:block;
  transition:transform .6s var(--ease),filter .4s;
  filter:brightness(.88);
}
.gallery-item:hover img{transform:scale(1.05);filter:brightness(1)}

/* ═══════════════════════════════════════════════
   PRODUCTOS RELACIONADOS
   ═══════════════════════════════════════════════ */
.related-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
}
.related-card{
  position:relative;
  overflow:hidden;
  aspect-ratio:4/3;
  display:block;
  background:var(--bk);
}
.related-card img{
  width:100%;height:100%;
  object-fit:cover;
  transition:transform .6s var(--ease),filter .4s;
  filter:brightness(.75);
}
.related-card:hover img{transform:scale(1.06);filter:brightness(.55)}
.related-card-overlay{
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  padding:24px;
  background:linear-gradient(to top,rgba(0,0,0,.65) 0%,transparent 65%);
}
.related-card-num{
  font-family:var(--m);
  font-size:10px;
  letter-spacing:2px;
  color:var(--at);
  margin-bottom:6px;
}
.related-card-title{
  font-size:19px;
  font-weight:400;
  color:var(--wh);
  letter-spacing:-.2px;
  line-height:1.2;
}
.related-card-arrow{
  width:36px;height:36px;
  background:var(--at);
  display:flex;
  align-items:center;
  justify-content:center;
  position:absolute;
  bottom:20px;
  right:20px;
  opacity:0;
  transform:translateX(6px);
  transition:all .3s var(--spring);
}
.related-card:hover .related-card-arrow{opacity:1;transform:translateX(0)}
.related-card-arrow::after{
  content:'';
  width:7px;height:7px;
  border-right:1.5px solid var(--bk);
  border-top:1.5px solid var(--bk);
  transform:rotate(45deg);
  margin-right:3px;
}

/* page-hero con imagen de producto — solo sobreescribe el background inline */
.page-hero--img .page-hero-desc{color:rgba(252,249,238,.65)}

@media(max-width:1024px){
  .gallery-grid{grid-template-columns:repeat(3,1fr);grid-auto-rows:200px}
  .gallery-item:first-child{grid-column:span 2}
  .related-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:680px){
  .gallery-grid{grid-template-columns:repeat(2,1fr);grid-auto-rows:160px}
  .gallery-item:first-child{grid-column:span 2;grid-row:span 1}
  .related-grid{grid-template-columns:1fr}
}

/* ═══════════════════════════════════════════════
   VIDEO SECTION (autoplay)
   ═══════════════════════════════════════════════ */
.video-section{
  background:var(--dk);
  overflow:hidden;
}
.video-wrap{
  position:relative;
  width:100%;
}
.video-wrap video{
  width:100%;
  height:70vh;
  object-fit:cover;
  display:block;
}

/* ═══════════════════════════════════════════════
   REVEAL
   ═══════════════════════════════════════════════ */
.rev{opacity:0;transform:translateY(24px);transition:opacity .7s var(--spring),transform .7s var(--spring)}
.rev.in{opacity:1;transform:none}
.d1{transition-delay:.08s}
.d2{transition-delay:.16s}
.d3{transition-delay:.24s}
.d4{transition-delay:.32s}

/* ═══════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════ */
@media(max-width:1024px){
  .hero-grid{max-width:680px}
  .productos-grid{grid-template-columns:1fr 1fr}
  .producto:nth-child(1){grid-column:span 2;grid-row:span 1;aspect-ratio:16/9}
  .formacion-grid{grid-template-columns:1fr}
  .pasos-strip{grid-template-columns:repeat(2,1fr)}
  .paso{border-bottom:1px solid rgba(252,249,238,.1)}
  .paso:nth-child(odd){border-right:1px solid rgba(252,249,238,.1)}
  .paso:nth-child(even){border-right:none}
  .quienes-block,.detail-block{grid-template-columns:1fr;gap:48px}
  .detail-block.reverse .detail-text{order:1}
  .detail-block.reverse .detail-img{order:2}
  .tech-grid{grid-template-columns:1fr}
  .contacto-grid{grid-template-columns:1fr;gap:32px}
  .footer-grid{grid-template-columns:1fr 1fr;gap:36px}
  .nav-links{display:none}
}
@media(max-width:680px){
  .nav{padding:0 20px;height:64px}
  .nav-links.open{
    display:flex;flex-direction:column;
    position:fixed;top:64px;left:0;right:0;
    background:var(--wh);padding:24px;gap:18px;
    border-bottom:1px solid rgba(0,0,0,.08);
    box-shadow:0 8px 24px rgba(0,0,0,.08);
    align-items:flex-start;
  }
  .nav-links.open .nav-drop{
    position:static;
    transform:none;
    opacity:1;
    pointer-events:all;
    box-shadow:none;
    border:none;
    border-left:2px solid var(--at);
    min-width:auto;
    margin-top:6px;
    margin-left:0;
    padding:4px 0 4px 14px;
  }
  .nav-burger{display:flex}
  .container{padding:0 20px}
  .section{padding:64px 0}
  .hero{padding-top:64px}
  .hero-grid{padding:32px 20px}
  .productos-grid{grid-template-columns:1fr}
  .producto:nth-child(1){grid-column:span 1}
  .pasos-strip{grid-template-columns:1fr}
  .paso{border-right:none!important;border-bottom:1px solid rgba(252,249,238,.1)}
  .sec-head{grid-template-columns:1fr}
  .ff-2{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr;padding:0 20px 40px}
  .footer-bottom{padding:18px 20px;flex-direction:column;text-align:center}
  .cta-strip{padding:56px 20px;flex-direction:column;align-items:flex-start;text-align:left}
  .contacto-info,.contacto-form{padding:32px 24px}
}