/* PubliCode · Sistema de tarjetas 0.2.6
   Esqueleto común + cinco direcciones de arte (data-estilo). Las variables de color y tipografía
   llegan de cada tarjeta en :root. Unidades en rem; retícula de 4 px. */

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--fondo);color:var(--tinta);font:400 1rem/1.55 var(--f-texto),system-ui,sans-serif;-webkit-font-smoothing:antialiased;padding-bottom:calc(5.75rem + env(safe-area-inset-bottom))}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
h1,h2,h3,p,ul,ol,dl,dd,figure{margin:0}
ul,ol{padding:0;list-style:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
:focus-visible{outline:3px solid var(--acento);outline-offset:3px;border-radius:6px}
.solo-lector{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Lienzo: columna de teléfono; en pantallas anchas flota sobre la portada desenfocada */
.lienzo{position:relative;max-width:30rem;margin:0 auto;background:var(--fondo);min-height:100vh;overflow:hidden}
@media (min-width:36rem){
  body{background:var(--fondo-escritorio,#0d0d0d)}
  body::before{content:"";position:fixed;inset:-4rem;background:var(--portada) center/cover;filter:blur(48px) saturate(1.1);opacity:.55;z-index:-1}
  .lienzo{margin:2.5rem auto;border-radius:2rem;box-shadow:0 2.5rem 6rem rgba(0,0,0,.45);min-height:auto}
}

/* ——— Portada ——— */
.portada{position:relative;aspect-ratio:3/2;overflow:hidden;background:var(--superficie)}
.portada img{width:100%;height:100%;object-fit:cover;animation:acercar 1.6s cubic-bezier(.2,.7,.2,1) both}
.portada::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.28) 0,rgba(0,0,0,0) 30%,rgba(0,0,0,0) 62%,var(--velo,rgba(0,0,0,.35)) 100%);pointer-events:none}
@keyframes acercar{from{transform:scale(1.07)}to{transform:none}}
.chip-demo{position:absolute;z-index:2;white-space:nowrap;top:max(.875rem,env(safe-area-inset-top));left:.875rem;display:inline-flex;align-items:center;gap:.4rem;padding:.4rem .7rem;border-radius:99px;background:rgba(10,10,10,.55);color:#fff;font:600 .75rem/1 var(--f-texto),sans-serif;letter-spacing:.02em;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.chip-demo::before{content:"";width:.45rem;height:.45rem;border-radius:50%;background:#FFC24A}
.boton-flotante{position:absolute;z-index:2;top:max(.625rem,env(safe-area-inset-top));right:.625rem;width:2.75rem;height:2.75rem;border-radius:50%;display:grid;place-items:center;background:rgba(10,10,10,.55);color:#fff;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.boton-flotante svg{width:1.25rem;height:1.25rem}

/* ——— Identidad ——— */
.identidad{position:relative;z-index:1;padding:0 1.25rem}
.sello{width:4.75rem;height:4.75rem;margin-top:-2.375rem;display:grid;place-items:center;background:var(--acento);color:var(--sobre-acento);border:4px solid var(--fondo);border-radius:1.25rem;box-shadow:0 .5rem 1.5rem rgba(0,0,0,.18)}
.sello svg{width:2.4rem;height:2.4rem}
.nombre{margin-top:1rem;font-family:var(--f-display),serif;font-weight:var(--peso-display,700);font-size:var(--tam-nombre,3.25rem);line-height:var(--interlinea-nombre,.95);letter-spacing:var(--tracking-nombre,-.02em);text-wrap:balance}
.nombre span{display:block}
.nombre span:nth-child(2){color:var(--acento-nombre,var(--tinta))}
.giro{margin-top:.625rem;color:var(--suave);font-size:.9375rem;font-weight:600;letter-spacing:.01em}
.estado{margin-top:.875rem;display:inline-flex;align-items:center;gap:.5rem;padding:.375rem .75rem;border-radius:99px;background:var(--superficie);border:1px solid var(--linea);font-size:.875rem;font-weight:600}
.estado::before{content:"";width:.5rem;height:.5rem;border-radius:50%;background:var(--color-estado,#9aa0a6)}
.estado[data-abierto="si"]{--color-estado:#22A45D}
.estado[data-abierto="no"]{--color-estado:#D64545}

/* ——— Acciones rápidas ——— */
.acciones{display:grid;grid-template-columns:repeat(var(--n-acciones,4),1fr);gap:.625rem;padding:1.5rem 1.25rem .5rem}
.accion{display:flex;flex-direction:column;align-items:center;gap:.5rem;text-decoration:none;font-size:.8125rem;font-weight:600;color:var(--tinta)}
.accion .ico{width:100%;max-width:4rem;aspect-ratio:1;display:grid;place-items:center;border-radius:var(--radio-boton,1.125rem);background:var(--superficie);border:1px solid var(--linea);transition:transform .15s ease}
.accion .ico svg{width:1.5rem;height:1.5rem}
.accion--principal .ico{background:var(--acento);border-color:var(--acento);color:var(--sobre-acento)}
.accion:active .ico{transform:scale(.94)}

/* ——— Cuerpo ——— */
.frase{padding:1.25rem 1.25rem 0;font-size:1.0625rem;line-height:1.6}
.datos{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;margin:1.5rem 1.25rem 0}
.dato{padding:.875rem .75rem;background:var(--superficie);border:1px solid var(--linea);border-radius:var(--radio,1rem)}
.dato strong{display:block;font-family:var(--f-display),serif;font-weight:var(--peso-display,700);font-size:1.375rem;line-height:1.05;color:var(--acento-dato,var(--tinta))}
.dato span{display:block;margin-top:.375rem;font-size:.75rem;line-height:1.35;color:var(--suave)}

.seccion{padding:2.5rem 1.25rem 0}
.titulo{display:flex;align-items:baseline;gap:.625rem;margin-bottom:1rem;font-family:var(--f-display),serif;font-weight:var(--peso-display,700);font-size:1.75rem;line-height:1.1}
.titulo small{font:600 .75rem/1 var(--f-mono,var(--f-texto)),monospace;letter-spacing:.08em;color:var(--suave)}

.promo{position:relative;margin:2rem 1.25rem 0;padding:1.25rem 1.25rem 1.25rem 1.5rem;border-radius:var(--radio,1rem);background:var(--acento);color:var(--sobre-acento);overflow:hidden}
.promo::before,.promo::after{content:"";position:absolute;top:50%;width:1.25rem;height:1.25rem;margin-top:-.625rem;border-radius:50%;background:var(--fondo)}
.promo::before{left:-.625rem}.promo::after{right:-.625rem}
.promo small{display:block;font-size:.75rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;opacity:.85}
.promo strong{display:block;margin-top:.375rem;font-family:var(--f-display),serif;font-weight:var(--peso-display,700);font-size:1.5rem;line-height:1.1}
.promo p{margin-top:.375rem;font-size:.9375rem;line-height:1.45}
.promo em{display:inline-block;margin-top:.75rem;padding-top:.625rem;border-top:1px dashed currentColor;font-style:normal;font-size:.8125rem;font-weight:600;opacity:.9}

.servicios li{display:grid;grid-template-columns:1fr auto;gap:.125rem 1rem;padding:1rem 0;border-top:1px solid var(--linea)}
.servicios li:last-child{border-bottom:1px solid var(--linea)}
.servicios h3{font-size:1.0625rem;font-weight:600;line-height:1.3}
.servicios .precio{font-weight:600;white-space:nowrap;color:var(--acento-precio,var(--tinta))}
.servicios p{grid-column:1/-1;color:var(--suave);font-size:.9375rem;line-height:1.45}

.galeria{display:flex;gap:.75rem;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 1.25rem 1rem;margin:0 -1.25rem;scrollbar-width:none}
.galeria::-webkit-scrollbar{display:none}
.galeria figure{flex:0 0 72%;scroll-snap-align:center;border-radius:var(--radio-foto,1.25rem);overflow:hidden;background:var(--superficie)}
.galeria img{width:100%;aspect-ratio:4/5;object-fit:cover}
.banda{margin-top:2.5rem}
.banda img{width:100%;aspect-ratio:15/7;object-fit:cover}

.horario li{display:flex;justify-content:space-between;gap:1rem;padding:.75rem 0;border-top:1px solid var(--linea);font-size:.9375rem}
.horario li:last-child{border-bottom:1px solid var(--linea)}
.horario li span:last-child{font-variant-numeric:tabular-nums;color:var(--suave)}
.horario li[aria-current="true"]{font-weight:600}
.horario li[aria-current="true"] span:last-child{color:var(--tinta)}
.horario li[aria-current="true"] span:first-child::after{content:" · hoy";color:var(--acento-texto,var(--acento));font-weight:600}

.pagos{display:flex;flex-wrap:wrap;gap:.5rem}
.pagos li{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem .875rem;border-radius:99px;background:var(--superficie);border:1px solid var(--linea);font-size:.875rem;font-weight:600}
.pagos svg{width:1.125rem;height:1.125rem}
.nota{margin-top:1rem;color:var(--suave);font-size:.9375rem;line-height:1.5}

.ubicacion{border-radius:var(--radio,1rem);overflow:hidden;background:var(--superficie);border:1px solid var(--linea)}
.mapa{position:relative;height:8.5rem;background-color:var(--mapa-fondo,var(--fondo));background-image:linear-gradient(28deg,transparent 46%,var(--mapa-calle,var(--linea)) 46%,var(--mapa-calle,var(--linea)) 54%,transparent 54%),linear-gradient(118deg,transparent 47%,var(--mapa-calle,var(--linea)) 47%,var(--mapa-calle,var(--linea)) 53%,transparent 53%),repeating-linear-gradient(0deg,transparent 0 22px,var(--linea) 22px 23px),repeating-linear-gradient(90deg,transparent 0 22px,var(--linea) 22px 23px);background-size:100% 100%,100% 100%,auto,auto}
.mapa .pin{position:absolute;left:50%;top:50%;width:2.75rem;height:2.75rem;margin:-2.75rem 0 0 -1.375rem;display:grid;place-items:center;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:var(--acento);color:var(--sobre-acento);box-shadow:0 .5rem 1rem rgba(0,0,0,.25)}
.mapa .pin svg{width:1.25rem;height:1.25rem;transform:rotate(45deg)}
.ubicacion address{padding:1rem 1rem .25rem;font-style:normal;font-weight:600;line-height:1.4}
.ubicacion p{padding:0 1rem;color:var(--suave);font-size:.875rem}
.boton{display:flex;align-items:center;justify-content:center;gap:.5rem;min-height:3rem;padding:.75rem 1rem;border-radius:var(--radio-boton,1.125rem);background:var(--superficie);border:1px solid var(--linea);font-weight:600;text-decoration:none;font-size:.9375rem}
.boton svg{width:1.25rem;height:1.25rem}
.boton--acento{background:var(--acento);border-color:var(--acento);color:var(--sobre-acento)}
.ubicacion .boton{margin:1rem}

.redes{display:flex;flex-wrap:wrap;gap:.5rem}
.redes .boton{flex:1 1 9rem}

.compartir{display:grid;justify-items:center;gap:1rem;padding:1.5rem;border-radius:var(--radio,1rem);background:var(--superficie);border:1px solid var(--linea);text-align:center}
.compartir .qr{width:min(13.75rem,70vw);height:auto;border-radius:.75rem}
.compartir p{color:var(--suave);font-size:.9375rem;max-width:20rem}
.compartir .fila{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;width:100%}

.pie{padding:2.5rem 1.25rem 1.5rem;text-align:center;color:var(--suave);font-size:.8125rem;line-height:1.6}
.pie a{font-weight:600;color:var(--tinta);display:inline-block;padding:.4rem .15rem}
.pie .aviso{margin-top:.5rem}

/* ——— Barra fija (aparece al pasar las acciones) ——— */
.barra{position:fixed;inset:auto 0 0;z-index:10;display:flex;justify-content:center;padding:.625rem max(.75rem,env(safe-area-inset-left)) calc(.625rem + env(safe-area-inset-bottom));background:color-mix(in srgb,var(--fondo) 86%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-top:1px solid var(--linea);transform:translateY(110%);transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.barra.visible{transform:none}
.barra .fila{display:flex;gap:.5rem;width:100%;max-width:28.5rem}
.barra .boton{min-height:3.125rem}
.barra .boton--acento{flex:1;white-space:nowrap}
@media (max-width:24.5rem){.barra .largo{display:none}}
.barra .boton:not(.boton--acento){width:3.125rem;padding:0}
@media (min-width:36rem){.barra{left:50%;right:auto;width:30rem;margin-left:-15rem;border-radius:1.25rem 1.25rem 0 0}}

/* Aviso emergente de las acciones de ejemplo */
.toast{position:fixed;left:50%;bottom:calc(6.25rem + env(safe-area-inset-bottom));z-index:20;width:min(22rem,calc(100vw - 2rem));transform:translate(-50%,1rem);opacity:0;pointer-events:none;padding:.875rem 1rem;border-radius:1rem;background:#111;color:#fff;font-size:.875rem;line-height:1.45;box-shadow:0 1rem 2.5rem rgba(0,0,0,.35);transition:opacity .25s,transform .25s}
.toast.visible{opacity:1;transform:translate(-50%,0)}

/* Aparición al desplazarse */
.revelar{opacity:0;transform:translateY(1rem);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}
.revelar.visible{opacity:1;transform:none}
.sin-js .revelar{opacity:1;transform:none}
.nombre span{animation:subir .9s cubic-bezier(.2,.7,.2,1) both}
.nombre span:nth-child(2){animation-delay:.12s}
@keyframes subir{from{opacity:0;transform:translateY(.4em)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.revelar{opacity:1;transform:none}}

/* ════════ Direcciones de arte ════════ */

/* 1 · TALLER — Electro Ríos: industrial, carbón y amarillo de señalización */
[data-estilo="taller"]{--peso-display:800;--tam-nombre:4.5rem;--interlinea-nombre:.84;--tracking-nombre:0;--radio:.375rem;--radio-boton:.5rem;--radio-foto:.375rem;--acento-dato:var(--acento);--velo:rgba(18,20,23,.9);--f-mono:'Archivo'}
[data-estilo="taller"] .portada{aspect-ratio:4/3;clip-path:polygon(0 0,100% 0,100% 88%,0 100%)}
[data-estilo="taller"] .portada img{filter:contrast(1.08) saturate(.85)}
[data-estilo="taller"] .sello{border-radius:.5rem;margin-top:-3rem;transform:rotate(-4deg)}
[data-estilo="taller"] .nombre{text-transform:uppercase}
[data-estilo="taller"] .nombre span:nth-child(2){color:var(--acento)}
[data-estilo="taller"] .giro{text-transform:uppercase;letter-spacing:.16em;font-size:.8125rem}
[data-estilo="taller"] .franja{height:.5rem;margin:2rem 0 0;background:repeating-linear-gradient(-45deg,var(--acento) 0 12px,transparent 12px 24px)}
[data-estilo="taller"] .titulo{text-transform:uppercase;font-size:2.125rem;letter-spacing:.01em}
[data-estilo="taller"] .titulo small{color:var(--acento)}
[data-estilo="taller"] .promo{background:var(--superficie);color:var(--tinta);border:2px solid var(--acento)}
[data-estilo="taller"] .promo strong{text-transform:uppercase;font-size:1.875rem;color:var(--acento)}
[data-estilo="taller"] .servicios h3{font-family:var(--f-display);font-weight:800;text-transform:uppercase;font-size:1.375rem;letter-spacing:.01em}
[data-estilo="taller"] .servicios .precio{color:var(--acento);font-family:var(--f-display);font-size:1.375rem}
[data-estilo="taller"] .galeria figure{flex-basis:80%}

/* 2 · EDITORIAL — Pastelería Alba: carta de pastelería, crema y frambuesa */
[data-estilo="editorial"]{--peso-display:600;--tam-nombre:3.6rem;--interlinea-nombre:.98;--tracking-nombre:-.025em;--radio:1.25rem;--radio-boton:99px;--acento-nombre:var(--acento);--velo:rgba(58,38,32,.25);--fondo-escritorio:#E9DFD1}
[data-estilo="editorial"] .portada{margin:.75rem .75rem 0;border-radius:1.75rem 1.75rem 0 0;-webkit-mask:radial-gradient(circle at 50% 100%,transparent .6rem,#000 .65rem) bottom/1.6rem 100% repeat-x;mask:radial-gradient(circle at 50% 100%,transparent .6rem,#000 .65rem) bottom/1.6rem 100% repeat-x;aspect-ratio:4/3.4}
[data-estilo="editorial"] .chip-demo{left:1.625rem;top:1.625rem}
[data-estilo="editorial"] .boton-flotante{right:1.375rem;top:1.375rem}
[data-estilo="editorial"] .sello{border-radius:50%;box-shadow:0 0 0 2px var(--acento),0 .5rem 1.5rem rgba(0,0,0,.15);border-width:5px;margin-top:-1.5rem}
[data-estilo="editorial"] .nombre span:nth-child(2){font-style:italic;font-weight:400}
[data-estilo="editorial"] .giro{font-family:var(--f-display);font-style:italic;font-weight:400;font-size:1.125rem;color:var(--suave)}
[data-estilo="editorial"] .datos{gap:0;background:var(--superficie);border:1px solid var(--linea);border-radius:var(--radio)}
[data-estilo="editorial"] .dato{border:0;background:none;border-radius:0}
[data-estilo="editorial"] .dato+.dato{border-left:1px solid var(--linea)}
[data-estilo="editorial"] .dato strong{color:var(--acento);font-style:italic;font-weight:400}
[data-estilo="editorial"] .titulo{font-style:italic;font-weight:400;font-size:2rem}
[data-estilo="editorial"] .titulo::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,var(--oro),transparent);align-self:center}
[data-estilo="editorial"] .titulo small{display:none}
[data-estilo="editorial"] .servicios li{grid-template-columns:auto 1fr auto;border:0;padding:.875rem 0}
[data-estilo="editorial"] .servicios li:last-child{border:0}
[data-estilo="editorial"] .servicios li::after{content:"";grid-row:1;grid-column:2;align-self:end;margin-bottom:.4rem;border-bottom:2px dotted var(--linea)}
[data-estilo="editorial"] .servicios h3{font-family:var(--f-display);font-weight:600;font-size:1.1875rem}
[data-estilo="editorial"] .servicios .precio{grid-column:3;font-family:var(--f-display);font-style:italic;font-weight:400;font-size:1.125rem;color:var(--acento)}
[data-estilo="editorial"] .servicios p{grid-column:1/-1}
[data-estilo="editorial"] .galeria figure{border-radius:999px 999px 1.25rem 1.25rem;flex-basis:62%}
[data-estilo="editorial"] .promo{background:var(--tinta);color:var(--fondo)}
[data-estilo="editorial"] .promo strong{font-style:italic;font-weight:400;font-size:1.75rem}

/* 3 · BOTÁNICA — Estudio Malva: calma, arco, malva y salvia */
[data-estilo="botanica"]{--peso-display:500;--tam-nombre:3.9rem;--interlinea-nombre:.92;--tracking-nombre:-.02em;--radio:1.5rem;--radio-boton:99px;--radio-foto:1.5rem;--acento-nombre:var(--acento);--velo:rgba(0,0,0,0);--fondo-escritorio:#E4D6D2}
[data-estilo="botanica"] .portada{margin:1rem 1.25rem 0;aspect-ratio:1/1.08;border-radius:999px 999px 1.5rem 1.5rem}
[data-estilo="botanica"] .portada::after{background:linear-gradient(180deg,rgba(0,0,0,.22),transparent 26%)}
[data-estilo="botanica"] .chip-demo{left:50%;transform:translateX(-50%);top:auto;bottom:1rem}
[data-estilo="botanica"] .boton-flotante{top:auto;bottom:.75rem;right:.75rem}
[data-estilo="botanica"] .identidad{text-align:center}
[data-estilo="botanica"] .sello{margin:-2.375rem auto 0;border-radius:50%;background:var(--salvia);color:var(--sobre-salvia,#fff)}
[data-estilo="botanica"] .nombre{font-style:italic}
[data-estilo="botanica"] .nombre span:nth-child(1){font-style:normal;font-weight:600;font-size:.42em;letter-spacing:.32em;text-transform:uppercase;font-family:var(--f-texto);color:var(--suave);margin-bottom:.35em}
[data-estilo="botanica"] .giro{letter-spacing:.06em}
[data-estilo="botanica"] .frase{text-align:center;font-family:var(--f-display);font-style:italic;font-size:1.375rem;line-height:1.35}
[data-estilo="botanica"] .dato{text-align:center}
[data-estilo="botanica"] .dato strong{font-style:italic;color:var(--acento)}
[data-estilo="botanica"] .titulo{justify-content:center;font-style:italic;font-weight:500;font-size:2.25rem}
[data-estilo="botanica"] .titulo small{display:none}
[data-estilo="botanica"] .titulo::before,[data-estilo="botanica"] .titulo::after{content:"";width:1.75rem;height:1px;background:var(--salvia);align-self:center}
[data-estilo="botanica"] .servicios li{background:var(--superficie);border:1px solid var(--linea);border-radius:1.25rem;padding:1rem 1.125rem;margin-bottom:.625rem}
[data-estilo="botanica"] .servicios li:last-child{border:1px solid var(--linea)}
[data-estilo="botanica"] .servicios h3{font-family:var(--f-display);font-style:italic;font-weight:500;font-size:1.375rem}
[data-estilo="botanica"] .servicios .precio{color:var(--acento)}
[data-estilo="botanica"] .promo{background:var(--salvia);color:var(--sobre-salvia,#fff);text-align:center}
[data-estilo="botanica"] .promo{--sobre-acento:var(--sobre-salvia,#fff)}
[data-estilo="botanica"] .promo strong{font-style:italic;font-weight:500;font-size:1.875rem}
[data-estilo="botanica"] .pagos{justify-content:center}
[data-estilo="botanica"] .nota{text-align:center}

/* 4 · CLÁSICA — Navaja Fina: barbería de oficio, tinta, hueso y cobre */
[data-estilo="clasica"]{--peso-display:400;--tam-nombre:4rem;--interlinea-nombre:.92;--tracking-nombre:-.01em;--radio:.75rem;--radio-boton:.75rem;--radio-foto:.75rem;--acento-nombre:var(--acento);--acento-precio:var(--acento);--velo:rgba(20,17,16,.95)}
[data-estilo="clasica"] .portada{aspect-ratio:4/4.4}
[data-estilo="clasica"] .portada::before{content:"";position:absolute;z-index:1;top:0;bottom:0;left:0;width:.625rem;background:repeating-linear-gradient(-55deg,var(--tinta) 0 9px,var(--vino) 9px 18px,var(--tinta) 18px 27px,#2b5f8a 27px 36px)}
[data-estilo="clasica"] .chip-demo{left:1.375rem}
[data-estilo="clasica"] .identidad{margin-top:-7.5rem}
[data-estilo="clasica"] .sello{margin-top:0;border-radius:50%;background:transparent;color:var(--acento);border:1.5px solid var(--acento);box-shadow:inset 0 0 0 4px var(--fondo),inset 0 0 0 5px var(--acento);width:4.25rem;height:4.25rem}
[data-estilo="clasica"] .sello svg{width:1.9rem;height:1.9rem}
[data-estilo="clasica"] .nombre span:nth-child(2){font-style:italic}
[data-estilo="clasica"] .giro{text-transform:uppercase;letter-spacing:.24em;font-size:.75rem;color:var(--acento)}
[data-estilo="clasica"] .titulo{font-size:2.125rem}
[data-estilo="clasica"] .titulo small{color:var(--acento);font-family:var(--f-display);font-style:italic;font-size:1rem;letter-spacing:0}
[data-estilo="clasica"] .servicios li{grid-template-columns:auto 1fr auto;border-color:var(--linea)}
[data-estilo="clasica"] .servicios li::after{content:"";grid-row:1;grid-column:2;align-self:end;margin-bottom:.45rem;border-bottom:1px dotted var(--suave);opacity:.5}
[data-estilo="clasica"] .servicios h3{font-family:var(--f-display);font-weight:400;font-size:1.3125rem}
[data-estilo="clasica"] .servicios .precio{grid-column:3;font-family:var(--f-display);font-size:1.3125rem}
[data-estilo="clasica"] .promo{background:transparent;color:var(--tinta);border:1px solid var(--acento)}
[data-estilo="clasica"] .promo::before,[data-estilo="clasica"] .promo::after{border:1px solid var(--acento)}
[data-estilo="clasica"] .promo small{color:var(--acento)}
[data-estilo="clasica"] .promo strong{font-style:italic;font-size:1.875rem}
[data-estilo="clasica"] .dato strong{color:var(--acento)}

/* 5 · VOLCÁN — Mudanzas Volcán: Popocatépetl, terracota y cielo de altura */
[data-estilo="volcan"]{--peso-display:800;--tam-nombre:3.75rem;--interlinea-nombre:.9;--tracking-nombre:-.045em;--radio:1.125rem;--radio-boton:1rem;--acento-nombre:var(--acento);--acento-dato:var(--acento);--velo:rgba(0,0,0,0);--fondo-escritorio:#1F2A33}
[data-estilo="volcan"] .portada{aspect-ratio:4/3.5}
[data-estilo="volcan"] .silueta{position:absolute;z-index:1;left:0;right:0;bottom:-1px;width:100%;height:auto;color:var(--fondo)}
[data-estilo="volcan"] .sello{border-radius:1rem;margin-top:-2rem}
[data-estilo="volcan"] .titulo{font-size:1.875rem;letter-spacing:-.03em}
[data-estilo="volcan"] .titulo small{color:var(--acento)}
[data-estilo="volcan"] .dato{background:var(--tinta);border-color:var(--tinta);color:#fff}
[data-estilo="volcan"] .dato strong{color:var(--dato-fuerte,#F2A27E)}
[data-estilo="volcan"] .dato span{color:var(--dato-suave,#C9D2DA)}
[data-estilo="volcan"] .servicios li{grid-template-columns:2.25rem 1fr auto}
[data-estilo="volcan"] .servicios li::before{content:counter(svc,decimal-leading-zero);counter-increment:svc;grid-row:1/3;font-weight:800;color:var(--acento);font-size:.875rem;padding-top:.2rem}
[data-estilo="volcan"] .servicios{counter-reset:svc}
[data-estilo="volcan"] .servicios p{grid-column:2/-1}
[data-estilo="botanica"] .promo small,[data-estilo="botanica"] .promo em{opacity:1}
