/* A & E Atelier · sitio.css
   Estudio de bodas: fondo blanco, tinta cálida, un acento vino.
   Reglas de rendimiento: sin blur, sin backdrop-filter, sin capas fijas
   a pantalla completa, sin animaciones infinitas ni ligadas al scroll.
   Solo se anima transform y opacity. */

@font-face{font-family:"Bodoni Moda";src:url(fuentes/bodoni-moda.woff2?v=164d226a) format("woff2");font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:"Bodoni Moda";src:url(fuentes/bodoni-moda-italica.woff2?v=34f9d170) format("woff2");font-style:italic;font-weight:400;font-display:swap}
@font-face{font-family:"Figtree";src:url(fuentes/figtree.woff2?v=318dbf73) format("woff2");font-style:normal;font-weight:400 600;font-display:swap}

:root{
  --blanco:#FFFFFF;
  --banda:#F6F5F3;
  --tinta:#1E1C1A;
  --tinta-2:#5F5953;
  --linea:#E5E1DB;
  --linea-fuerte:#CFC9C1;
  --vino:#6E2337;
  --vino-suave:#EFE3E6;
  --serif:"Bodoni Moda","Bodoni 72",Didot,"Noto Serif",Georgia,serif;
  --sans:"Figtree",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --ancho:1180px;
  --margen:clamp(16px,4.2vw,40px);
  --salida:cubic-bezier(.16,1,.3,1);
  color-scheme:light;
  scrollbar-color:var(--linea-fuerte) var(--blanco);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
section[tabindex="-1"]:focus,main[tabindex="-1"]:focus{outline:0}
body{margin:0;background:var(--blanco);color:var(--tinta);font:400 1rem/1.6 var(--sans);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-tap-highlight-color:transparent}
img,svg{display:block;max-width:100%}
img{height:auto}
p,h1,h2,h3,ul,ol,figure{margin:0}
ul,ol{padding:0}
::selection{background:var(--vino-suave);color:var(--tinta)}
:focus-visible{outline:1.5px solid var(--tinta);outline-offset:4px}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:.24em}
[hidden]{display:none!important}
.sr{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

.saltar{position:absolute;left:12px;top:-60px;z-index:30;padding:12px 16px;background:var(--tinta);color:var(--blanco);font:600 .8rem/1 var(--sans);text-decoration:none;transition:transform .2s var(--salida)}
.saltar:focus{transform:translateY(72px)}

/* ---------- Cabecera ---------- */
.cabecera{border-bottom:1px solid var(--linea)}
.cabecera-in{max-width:var(--ancho);margin:0 auto;padding:22px var(--margen) 6px;display:grid;justify-items:center;gap:10px}
.marca{display:block;line-height:0;border-radius:2px}
.marca img{width:auto;height:52px}
.nav{display:flex;justify-content:center;gap:0 clamp(18px,3vw,34px);font:500 .72rem/1 var(--sans);letter-spacing:.16em;text-transform:uppercase}
.nav a{display:inline-flex;align-items:center;min-height:44px;color:var(--tinta-2);text-decoration:none;transition:color .2s ease}
.nav .ancho{display:none}

/* ---------- Botones ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.65rem;min-height:50px;padding:0 1.5rem;border:1px solid var(--tinta);border-radius:0;font:600 .78rem/1.1 var(--sans);letter-spacing:.15em;text-transform:uppercase;text-align:center;text-decoration:none;cursor:pointer;transition:transform .16s var(--salida),background-color .2s ease,border-color .2s ease,color .2s ease}
.btn:active{transform:scale(.97)}
.btn svg{width:16px;height:16px;flex:none}
.btn-negro{background:var(--tinta);color:var(--blanco)}
.btn-linea{background:transparent;color:var(--tinta)}
.btn-blanco{background:var(--blanco);color:var(--tinta);border-color:var(--blanco)}

/* ---------- Portada ---------- */
.portada{max-width:var(--ancho);margin:0 auto;padding:clamp(40px,7.5vw,76px) var(--margen) 0;text-align:center}
h1{max-width:17ch;margin:0 auto;font:400 clamp(2.35rem,8.4vw,5.2rem)/1.03 var(--serif);letter-spacing:-.012em;text-wrap:balance}
h1 em,h2 em{font-style:italic}
.portada .sub{max-width:44ch;margin:20px auto 0;font-size:1.06rem;line-height:1.6;color:var(--tinta-2);text-wrap:pretty}
.acciones{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:28px}
.acciones .btn{flex:1 1 250px;max-width:340px}
.promo{margin:24px auto 0;font:500 .84rem/1.55 var(--sans);letter-spacing:.03em;color:var(--tinta-2);text-wrap:pretty}
.promo b{font-weight:600;color:var(--vino)}
.reloj{display:block;min-height:1.55em;font-variant-numeric:tabular-nums}
@media (max-width:759px){.promo{text-wrap:balance}}
.reloj b{color:var(--tinta);font-weight:600;white-space:nowrap}

/* ---------- Muro de estilos ---------- */
.muro{padding:clamp(36px,6vw,64px) 0 clamp(56px,8vw,96px)}
.fila-teles{display:flex;gap:18px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;padding:12px max(var(--margen),calc(50% - 125px)) 4px}
.fila-teles::-webkit-scrollbar{display:none}
.pieza{flex:0 0 250px;scroll-snap-align:center}
.tel{overflow:hidden;aspect-ratio:390/844;border:5px solid #141312;border-radius:32px;background:#141312;box-shadow:0 0 0 1px rgba(20,19,18,.08),0 28px 44px -32px rgba(30,28,26,.6)}
.tel img{width:100%;height:100%;object-fit:cover}
.pieza figcaption{margin-top:16px;text-align:center;font:600 .7rem/1.3 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--tinta-2)}
.muro-nota{max-width:46ch;margin:22px auto 0;padding:0 var(--margen);text-align:center;font-size:.94rem;color:var(--tinta-2);text-wrap:balance}
.muro-nota a{color:var(--tinta)}
@media (prefers-reduced-motion:no-preference){
  .muro .pieza{animation:subir .7s var(--salida) both}
  .muro .pieza:nth-child(2){animation-delay:.08s}
  .muro .pieza:nth-child(3){animation-delay:.16s}
}
@keyframes subir{from{opacity:0;transform:translateY(32px)}}

/* ---------- Secciones ---------- */
.banda{background:var(--banda);border-block:1px solid var(--linea)}
.seccion{max-width:var(--ancho);margin:0 auto;padding:clamp(60px,9vw,108px) var(--margen)}
h2{font:400 clamp(2rem,6.2vw,3.4rem)/1.06 var(--serif);letter-spacing:-.01em;text-wrap:balance}
.centro{text-align:center}
.lead{max-width:56ch;margin:16px auto 0;font-size:1.04rem;line-height:1.6;color:var(--tinta-2);text-wrap:pretty}
.izq .lead{margin-left:0}

/* ---------- Planes ---------- */
.planes{margin-top:clamp(34px,5vw,52px);list-style:none;border-top:1px solid var(--tinta)}
.plan{display:grid;gap:18px;padding:30px 0 32px;border-bottom:1px solid var(--linea-fuerte)}
.plan h3{font:400 clamp(2.05rem,5vw,2.5rem)/1 var(--serif);letter-spacing:-.005em}
.distintivo{display:inline-block;margin-top:12px;font:600 .7rem/1 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--vino)}
.precio{display:flex;flex-wrap:wrap;align-items:baseline;gap:.25rem .75rem;margin-top:14px}
.precio .ahora{display:inline-flex;align-items:flex-start;font:400 2.3rem/1 var(--serif);font-variant-numeric:lining-nums}
.precio .signo{margin:.12em .06em 0 0;font-size:.52em;line-height:1}
.precio .mxn{font:600 .72rem/1 var(--sans);letter-spacing:.16em;color:var(--tinta-2)}
.precio s{font-size:.95rem;color:var(--tinta-2);text-decoration-thickness:1px}
.plan .desc{font-size:1.02rem;line-height:1.55;color:var(--tinta);text-wrap:pretty}
.plan ul{display:grid;gap:9px;margin-top:16px;list-style:none}
.plan li{display:grid;grid-template-columns:15px 1fr;gap:10px;font-size:.96rem;line-height:1.45;color:var(--tinta-2)}
.plan li::before{content:"";width:5px;height:5px;margin-top:.58em;border-radius:50%;background:var(--tinta)}
.botones{display:flex;flex-wrap:wrap;gap:10px}
.botones .btn{flex:1 1 140px;min-height:48px;padding:0 1.2rem;font-size:.74rem}
.comparar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 28px;margin-top:28px}
.comparar p{font-size:.95rem;color:var(--tinta-2)}

/* ---------- Cada familia ---------- */
.familias{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(36px,6vw,64px);align-items:center}
.puntos{display:grid;gap:22px;margin-top:30px;list-style:none;border-top:1px solid var(--linea-fuerte);padding-top:26px}
.puntos li{display:grid;gap:6px}
.puntos h3{font:400 1.45rem/1.15 var(--serif)}
.puntos p{font-size:.98rem;line-height:1.6;color:var(--tinta-2);text-wrap:pretty}
.flecha{display:inline-flex;align-items:center;gap:.6rem;min-height:44px;margin-top:26px;font:600 1rem/1.2 var(--sans);text-decoration:none;border-bottom:1px solid var(--tinta)}
.flecha svg{width:18px;height:18px;transition:transform .25s var(--salida)}
.par-teles{display:grid;justify-items:center;gap:30px}
.par-teles .pieza{flex:none;width:250px}
.par-teles .detalle{width:min(300px,100%)}
.recorte{overflow:hidden;border-radius:16px;background:#1F1C18;box-shadow:0 0 0 1px rgba(20,19,18,.08),0 28px 44px -32px rgba(30,28,26,.6)}
.recorte img{width:100%}
.familias .nota{margin-top:18px;text-align:center;font-size:.86rem;color:var(--tinta-2)}

/* ---------- Muestrarios ---------- */
.muestrarios{max-width:860px;margin:clamp(30px,5vw,48px) auto 0;list-style:none;border-top:1px solid var(--tinta)}
.muestrarios a{display:grid;grid-template-columns:1fr auto;align-items:center;gap:4px 16px;padding:20px 0;border-bottom:1px solid var(--linea-fuerte);text-decoration:none}
.muestrarios .nombre{font:400 1.65rem/1.15 var(--serif)}
.muestrarios .rasgos{grid-column:1;font-size:.92rem;line-height:1.45;color:var(--tinta-2)}
.muestrarios svg{grid-column:2;grid-row:1/span 2;width:22px;height:22px;transition:transform .25s var(--salida)}
.ficticio{max-width:60ch;margin:22px auto 0;text-align:center;font-size:.88rem;line-height:1.55;color:var(--tinta-2);text-wrap:balance}
main>.ficticio{max-width:calc(60ch + 2*var(--margen));padding:0 var(--margen)}

/* ---------- Cómo trabajamos ---------- */
.pasos{display:grid;gap:34px;margin-top:clamp(36px,5vw,56px);list-style:none}
.pasos li{display:grid;justify-items:center;gap:10px;text-align:center}
.pasos .num{font:italic 400 2.7rem/1 var(--serif);font-variation-settings:"opsz" 16;color:var(--vino)}
.pasos h3{font:600 .8rem/1.35 var(--sans);letter-spacing:.15em;text-transform:uppercase}
.pasos p{max-width:30ch;font-size:.97rem;line-height:1.55;color:var(--tinta-2);text-wrap:pretty}

/* ---------- Preguntas ---------- */
.faq{max-width:800px;margin:clamp(30px,5vw,48px) auto 0;border-top:1px solid var(--tinta)}
.faq details{border-bottom:1px solid var(--linea-fuerte)}
.faq summary{display:grid;grid-template-columns:1fr 24px;align-items:center;gap:16px;min-height:44px;padding:20px 0;cursor:pointer;list-style:none;font:400 1.3rem/1.3 var(--serif)}
.faq summary::-webkit-details-marker{display:none}
.faq summary svg{width:20px;height:20px;transition:transform .3s var(--salida)}
.faq details[open] summary svg{transform:rotate(45deg)}
.faq details p{max-width:68ch;padding:0 0 24px;font-size:1rem;line-height:1.65;color:var(--tinta-2)}

/* ---------- Adorno ---------- */
.adorno{width:120px;height:10px;margin:22px auto 0;color:var(--vino)}
.banda-tinta .adorno{color:#BFAFA6}

/* ---------- Quiénes somos ---------- */
.nosotros p{max-width:62ch;margin:18px auto 0;font-size:1.04rem;line-height:1.7;color:var(--tinta-2);text-wrap:pretty}

/* ---------- Cierre ---------- */
.banda-tinta{background:var(--tinta);color:var(--blanco)}
.banda-tinta ::selection{background:#5A4148;color:var(--blanco)}
.banda-tinta :focus-visible{outline-color:var(--blanco)}
.cierre{max-width:var(--ancho);margin:0 auto;padding:clamp(64px,10vw,120px) var(--margen);text-align:center}
.cierre .lead,.cierre .alterno{color:#D2CBC3}
.cierre .alterno a{color:var(--blanco)}
.cierre h2{font-size:clamp(2.3rem,7vw,4rem)}
.cierre .btn{margin-top:30px;min-width:min(100%,300px)}
.cierre .alterno{margin-top:20px;font-size:.92rem}

/* ---------- Pie ---------- */
.pie{padding:48px var(--margen) calc(36px + env(safe-area-inset-bottom));text-align:center;font-size:.86rem;line-height:1.6;color:var(--tinta-2)}
.pie img{width:auto;height:96px;margin:0 auto}
.pie-nav{display:flex;flex-wrap:wrap;justify-content:center;gap:0 22px;margin-top:22px;font:500 .7rem/1 var(--sans);letter-spacing:.16em;text-transform:uppercase}
.pie-nav a{display:inline-flex;align-items:center;min-height:44px;text-decoration:none;color:var(--tinta)}
.pie .contacto{margin-top:12px}
.pie .contacto a{color:var(--tinta)}
.pie .legal{margin-top:10px;font-size:.8rem}

/* ---------- Barra para cotizar (solo celular) ---------- */
.barra-cta{position:fixed;left:0;right:0;bottom:0;z-index:20;display:flex;padding:10px var(--margen) calc(10px + env(safe-area-inset-bottom));background:var(--blanco);border-top:1px solid var(--linea);transform:translateY(105%);visibility:hidden;transition:transform .35s var(--salida),visibility 0s linear .35s}
.barra-cta.ver{transform:none;visibility:visible;transition:transform .45s var(--salida),visibility 0s}
.barra-cta .btn{flex:1;min-height:48px}

/* ---------- Puntero fino ---------- */
@media (hover:hover) and (pointer:fine){
  .nav a:hover{color:var(--tinta)}
  .btn-negro:hover{background:var(--vino);border-color:var(--vino)}
  .btn-linea:hover{background:var(--tinta);color:var(--blanco)}
  .btn-blanco:hover{background:var(--vino-suave);border-color:var(--vino-suave)}
  .flecha:hover svg,.muestrarios a:hover svg{transform:translateX(5px)}
  .muestrarios a:hover .nombre{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.18em}
  .faq summary:hover{color:var(--vino)}
  .pie-nav a:hover{color:var(--vino)}
}

/* ---------- Pantallas medianas ---------- */
@media (min-width:760px){
  .nav .ancho{display:inline-flex}
  .acciones .btn{flex:0 0 auto;min-width:264px}
  .marca img{height:58px}
  .pasos{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* ---------- Escritorio ---------- */
@media (min-width:960px){
  .fila-teles{justify-content:center;gap:48px;overflow:visible;padding:12px var(--margen) 4px}
  .muro .pieza:nth-child(2){position:relative;top:-44px}
  .plan{grid-template-columns:minmax(0,.82fr) minmax(0,1.38fr) 168px;gap:48px;align-items:start;padding:36px 0 38px}
  .botones{flex-direction:column;align-self:center}
  .botones .btn{flex:none;width:100%}
  .familias{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr)}
  .par-teles{display:flex;align-items:center;justify-content:flex-end;gap:28px}
  .par-teles .pieza{width:236px}
  .par-teles .detalle{width:292px}
  .familias .nota{text-align:right;margin-top:26px}
  .pasos{grid-template-columns:repeat(4,minmax(0,1fr))}
  .barra-cta{display:none}
}

/* =====================================================================
   Páginas interiores: planes, comparar, muestrarios, aviso y 404.
   Mismo mundo: blanco, hairlines, Bodoni en grande, un solo vino.
   ===================================================================== */

.nav a[aria-current="page"]{color:var(--tinta);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.5em}

/* ---------- Selector de planes ---------- */
.planes-nav{border-bottom:1px solid var(--linea)}
.planes-nav ul{display:flex;flex-wrap:wrap;justify-content:center;gap:0 clamp(16px,3.2vw,30px);max-width:var(--ancho);margin:0 auto;padding:4px var(--margen);list-style:none}
.planes-nav a{display:inline-flex;align-items:center;min-height:44px;font:400 1.08rem/1 var(--serif);color:var(--tinta-2);text-decoration:none;transition:color .2s ease}
.planes-nav a[aria-current="page"]{color:var(--vino);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.32em}

/* ---------- Portada de plan ---------- */
.portada-plan{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(40px,6vw,72px);align-items:center;max-width:var(--ancho);margin:0 auto;padding:clamp(40px,7vw,80px) var(--margen) clamp(56px,8vw,96px)}
.portada-plan .texto{text-align:center}
.plan-titulo{display:grid;gap:12px;margin:0}
.plan-titulo .nombre{font:400 clamp(3.2rem,13vw,6rem)/.95 var(--serif);letter-spacing:-.015em}
.plan-titulo .tipo{font:italic 400 clamp(1.12rem,3.8vw,1.3rem)/1.35 var(--serif);color:var(--tinta-2);text-wrap:balance}
.portada-plan .distintivo{margin-top:16px}
.portada-plan .sub{max-width:42ch;margin:20px auto 0;font-size:1.08rem;line-height:1.6;color:var(--tinta-2);text-wrap:pretty}
.precio-grande{display:flex;flex-wrap:wrap;justify-content:center;align-items:baseline;gap:.3rem .8rem;margin-top:26px}
.precio-grande .ahora{display:inline-flex;align-items:flex-start;font:400 clamp(2.8rem,9vw,3.6rem)/1 var(--serif);font-variant-numeric:lining-nums}
.precio-grande .signo{margin:.12em .05em 0 0;font-size:.5em;line-height:1}
.precio-grande .mxn{font:600 .74rem/1 var(--sans);letter-spacing:.16em;color:var(--tinta-2)}
.precio-grande s{font-size:1rem;color:var(--tinta-2);text-decoration-thickness:1px}
.portada-plan .promo{margin-top:12px}
.portada-plan .acciones{margin-top:26px}
.muestra{justify-self:center;width:min(270px,72vw)}
.muestra > a{display:block;text-decoration:none}
.muestra figcaption{margin-top:16px;text-align:center;font:600 .7rem/1.4 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--tinta-2)}
.muestra figcaption span{display:block;margin-top:4px;font:400 .86rem/1.4 var(--sans);letter-spacing:0;text-transform:none}

/* ---------- Qué incluye ---------- */
.incluye{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(36px,5vw,64px);margin-top:clamp(30px,5vw,48px)}
.rasgos{list-style:none;border-top:1px solid var(--tinta)}
.rasgos li{display:grid;gap:6px;padding:22px 0;border-bottom:1px solid var(--linea-fuerte)}
.rasgos h3{font:400 1.5rem/1.15 var(--serif)}
.rasgos p{max-width:62ch;font-size:1rem;line-height:1.6;color:var(--tinta-2);text-wrap:pretty}
.no-hace{margin-top:26px;padding:20px 0 0;border-top:1px dashed var(--linea-fuerte)}
.no-hace h3{font:600 .76rem/1.3 var(--sans);letter-spacing:.15em;text-transform:uppercase;color:var(--tinta)}
.no-hace p{max-width:62ch;margin-top:8px;font-size:1rem;line-height:1.6;color:var(--tinta-2)}
.detalles h3{font:600 .76rem/1.3 var(--sans);letter-spacing:.15em;text-transform:uppercase}
.detalles dl{margin:14px 0 0;border-top:1px solid var(--tinta)}
.detalles div{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:12px;padding:14px 0;border-bottom:1px solid var(--linea-fuerte)}
.detalles dt{font:600 .74rem/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--tinta-2)}
.detalles dd{margin:0;font-size:.98rem;line-height:1.45;text-align:right}

/* ---------- Ideal para ---------- */
.ideal{max-width:var(--ancho);margin:0 auto;padding:clamp(60px,9vw,108px) var(--margen);text-align:center}
.ideal h2{font-size:clamp(1.9rem,5.6vw,2.8rem)}
.ideal .frase{max-width:30ch;margin:22px auto 0;font:italic 400 clamp(1.45rem,4.4vw,2.05rem)/1.3 var(--serif);text-wrap:balance}

/* ---------- Botón claro sobre la banda de tinta ---------- */
.btn-linea-claro{background:transparent;color:var(--blanco);border-color:#8E857C}
.cierre .acciones{margin-top:30px}
.cierre .acciones .btn{margin-top:0}

/* ---------- Listas de filas con flecha (otros planes, muestrarios) ---------- */
.filas{max-width:860px;margin:clamp(30px,5vw,48px) auto 0;list-style:none;border-top:1px solid var(--tinta)}
.filas a{display:grid;grid-template-columns:1fr auto;align-items:center;gap:4px 16px;padding:20px 0;border-bottom:1px solid var(--linea-fuerte);text-decoration:none}
.filas .nombre{font:400 1.65rem/1.15 var(--serif)}
.filas .nombre small{margin-left:.5rem;font:500 .95rem/1 var(--sans);color:var(--tinta-2);font-variant-numeric:lining-nums}
.filas .rasgos-linea{grid-column:1;font-size:.92rem;line-height:1.45;color:var(--tinta-2)}
.filas svg{grid-column:2;grid-row:1/span 2;width:22px;height:22px;transition:transform .25s var(--salida)}
.filas-pie{display:flex;justify-content:center;margin-top:28px}

/* ---------- Comparar ---------- */
.cabeza-pagina{max-width:var(--ancho);margin:0 auto;padding:clamp(40px,7vw,76px) var(--margen) 0;text-align:center}
.cabeza-pagina h1{max-width:20ch;font-size:clamp(2.2rem,7.4vw,4.4rem)}
.cabeza-pagina .lead{max-width:58ch}
.selector{max-width:var(--ancho);margin:clamp(30px,5vw,44px) auto 0;padding:0 var(--margen);text-align:center}
.selector p{font:600 .74rem/1.4 var(--sans);letter-spacing:.15em;text-transform:uppercase;color:var(--tinta-2)}
.selector p span{letter-spacing:.04em;text-transform:none;font-weight:500}
.chips{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:12px}
.chip{min-height:44px;padding:0 16px;border:1px solid var(--linea-fuerte);border-radius:0;background:var(--blanco);color:var(--tinta-2);font:400 1.05rem/1 var(--serif);cursor:pointer;transition:background-color .2s ease,color .2s ease,border-color .2s ease,transform .16s var(--salida)}
.chip:active{transform:scale(.97)}
.chip[aria-pressed="true"]{background:var(--tinta);border-color:var(--tinta);color:var(--blanco)}
.tabla-caja{max-width:var(--ancho);margin:clamp(24px,4vw,36px) auto 0;padding:0 var(--margen)}
.tabla-cmp{width:100%;border-collapse:collapse;table-layout:fixed;font-size:.95rem}
.tabla-cmp th,.tabla-cmp td{padding:12px 8px;border-bottom:1px solid var(--linea);text-align:center;vertical-align:middle;line-height:1.35}
.tabla-cmp thead th{position:sticky;top:0;z-index:2;background:var(--blanco);border-bottom:1px solid var(--tinta);padding:14px 8px 12px;vertical-align:bottom}
.tabla-cmp thead .rotulo{width:40%;text-align:left}
.tabla-cmp .plan-col a{display:block;font:400 clamp(1.1rem,4.6vw,1.35rem)/1.05 var(--serif);text-decoration:none}
.tabla-cmp thead th.plan-col{padding-inline:4px}
.tabla-cmp .plan-col .precio-mini{display:block;margin-top:6px;font:500 .9rem/1.2 var(--sans);font-variant-numeric:lining-nums}
.tabla-cmp .plan-col s{display:block;margin-top:2px;font-size:.78rem;color:var(--tinta-2);font-weight:400}
.tabla-cmp tbody th{text-align:left;font-weight:400;color:var(--tinta)}
.tabla-cmp .grupo th{padding:26px 0 10px;border-bottom:1px solid var(--linea-fuerte);font:italic 400 1.3rem/1.2 var(--serif);color:var(--tinta)}
.tabla-cmp .destacada{background:var(--banda)}
.tabla-cmp .si svg{width:18px;height:18px;margin:0 auto;color:var(--tinta)}
.tabla-cmp .no{color:#9A938B}
.tabla-cmp .rasgo{display:inline}
.tabla-cmp .rasgo .info{vertical-align:middle;margin:-6px 0 -4px 2px}
.nw{white-space:nowrap}
.info{display:inline-grid;place-items:center;width:28px;height:28px;margin:-6px 0;padding:0;border:0;border-radius:50%;background:transparent;color:var(--tinta-2);cursor:pointer;flex:none}
.info svg{width:17px;height:17px}
.info:active{transform:scale(.94)}
[data-off~="2"] .c2,[data-off~="3"] .c3,[data-off~="4"] .c4,[data-off~="5"] .c5,[data-off~="6"] .c6{display:none}
.def{width:min(440px,calc(100vw - 32px));max-height:calc(100dvh - 48px);margin:auto;padding:26px 24px 22px;border:1px solid var(--linea-fuerte);background:var(--blanco);color:var(--tinta);box-shadow:0 30px 60px -30px rgba(30,28,26,.45)}
.def::backdrop{background:rgba(30,28,26,.35)}
.def h2{padding-right:36px;font:400 1.45rem/1.15 var(--serif)}
.def p{margin-top:10px;font-size:.98rem;line-height:1.6;color:var(--tinta-2)}
.def p b{color:var(--tinta);font-weight:600}
.def p em{display:block;margin-top:10px;font-style:normal;color:var(--tinta)}
.def .cerrar{position:absolute;top:10px;right:10px;display:grid;place-items:center;width:44px;height:44px;border:0;background:transparent;color:var(--tinta);cursor:pointer}
.def .cerrar svg{width:20px;height:20px}
.def.abierto{position:fixed;inset:0;z-index:40;display:block;height:fit-content}
@supports not selector(:popover-open){.def:not(.abierto){display:none}}
.nota-tabla{max-width:var(--ancho);margin:18px auto 0;padding:0 var(--margen);font-size:.88rem;line-height:1.55;color:var(--tinta-2)}

/* ---------- Página de muestrarios ---------- */
.galeria-muestrarios{display:grid;grid-template-columns:minmax(0,1fr);gap:28px;max-width:var(--ancho);margin:clamp(34px,5vw,56px) auto 0;padding:0 var(--margen);list-style:none}
.galeria-muestrarios .tarjeta{display:grid;grid-template-columns:118px minmax(0,1fr);gap:18px;align-items:center;text-decoration:none}
.otros-eventos a{color:var(--tinta);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.2em}
.galeria-muestrarios .otros-eventos{margin-top:12px;padding-left:136px;font-size:.88rem;line-height:1.5;color:var(--tinta-2)}
.galeria-muestrarios .tel{border-width:4px;border-radius:20px}
.galeria-muestrarios h2{font:400 1.75rem/1.1 var(--serif)}
.galeria-muestrarios .lema{margin-top:4px;font-size:.95rem;line-height:1.4;color:var(--tinta-2)}
.galeria-muestrarios .precio-linea{margin-top:10px;font:500 .95rem/1 var(--sans);font-variant-numeric:lining-nums}
.galeria-muestrarios ul{display:grid;gap:4px;margin-top:10px;list-style:none;font-size:.88rem;color:var(--tinta-2)}
.galeria-muestrarios .abrir{display:inline-flex;align-items:center;gap:.5rem;margin-top:12px;font:600 .74rem/1 var(--sans);letter-spacing:.15em;text-transform:uppercase;border-bottom:1px solid var(--tinta);padding-bottom:4px}
.galeria-muestrarios .abrir svg{width:16px;height:16px;transition:transform .25s var(--salida)}
.enlaces-pie{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:clamp(36px,5vw,52px)}

/* ---------- Aviso de privacidad (lectura) ---------- */
main.legal{max-width:760px;margin:0 auto;padding:clamp(40px,7vw,76px) var(--margen) clamp(64px,9vw,104px)}
main.legal h1{max-width:none;margin:0;text-align:left;font-size:clamp(2.3rem,7vw,3.6rem)}
main.legal .fecha{margin-top:12px;font:500 .84rem/1.4 var(--sans);color:var(--tinta-2)}
main.legal h2{margin-top:clamp(40px,6vw,56px);padding-top:22px;border-top:1px solid var(--linea-fuerte);font-size:clamp(1.5rem,4.6vw,1.95rem);line-height:1.15}
main.legal p,main.legal li{font-size:1.02rem;line-height:1.7;color:#3D3833}
main.legal p{margin-top:14px}
main.legal ul{display:grid;gap:10px;margin-top:14px;list-style:none}
main.legal li{position:relative;padding-left:22px}
main.legal li::before{content:"";position:absolute;left:4px;top:.72em;width:5px;height:5px;border-radius:50%;background:var(--vino)}
main.legal strong{color:var(--tinta);font-weight:600}
main.legal a{color:var(--vino);overflow-wrap:anywhere}
main.legal .volver{margin-top:44px}

/* ---------- 404 ---------- */
.error{max-width:var(--ancho);margin:0 auto;padding:clamp(64px,12vw,140px) var(--margen) clamp(72px,12vw,140px);text-align:center}
.error .codigo{font:italic 400 clamp(4rem,16vw,7.5rem)/1 var(--serif);color:var(--vino)}
.error h1{margin-top:12px;font-size:clamp(2.1rem,7vw,3.6rem)}
.error .lead{max-width:46ch}
.error .acciones{margin-top:30px}

@media (hover:hover) and (pointer:fine){
  .planes-nav a:hover{color:var(--tinta)}
  .filas a:hover svg,.galeria-muestrarios .tarjeta:hover .abrir svg{transform:translateX(5px)}
  .filas a:hover .nombre,.galeria-muestrarios .tarjeta:hover h2{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.18em}
  .chip:hover{border-color:var(--tinta);color:var(--tinta)}
  .chip[aria-pressed="true"]:hover{color:var(--blanco)}
  .info:hover{color:var(--vino)}
  .btn-linea-claro:hover{background:var(--blanco);color:var(--tinta);border-color:var(--blanco)}
}

@media (min-width:760px){
  .galeria-muestrarios{grid-template-columns:repeat(2,minmax(0,1fr));gap:36px 28px}
  .tabla-cmp{font-size:1rem}
  .tabla-cmp thead .rotulo{width:30%}
}
@media (min-width:1024px){
  .tabla-cmp thead .rotulo{width:25%}
}

@media (min-width:960px){
  .portada-plan{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}
  .portada-plan .texto{text-align:left}
  .portada-plan .sub{margin-left:0}
  .precio-grande,.portada-plan .acciones{justify-content:flex-start}
  .portada-plan .promo{margin-left:0;text-align:left}
  .muestra{width:290px}
  .incluye{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);align-items:start}
  .detalles{position:sticky;top:24px}
  .galeria-muestrarios{grid-template-columns:repeat(5,minmax(0,1fr));gap:28px}
  .galeria-muestrarios .tarjeta{grid-template-columns:minmax(0,1fr);align-content:start;gap:16px}
  .galeria-muestrarios .otros-eventos{padding-left:0}
  .galeria-muestrarios .tel{border-width:5px;border-radius:28px}
}
