/* SITIO DE EMILY'S (maqueta navegable, Isaac 10/nov/2026: «debe de ser un sitio, no una landing»).
   Negro y dorado de su letrero de acrílico, sobre mármol. Lo arma armar.py: no se edita el sitio publicado a mano. */
:root{
  --negro:#0c0c0d; --panel:#141316; --oro:#c49a3c; --oro-c:#e6c877; --oro-o:#9c7417;
  --marmol:#f6f4f0; --crema:#f8f2e6; --papel:#ffffff; --texto:#1d1b18; --suave:#6c665c; --linea:#e7e0d2;
  --serif:'Cormorant Garamond',Georgia,serif; --rot:'Montserrat',system-ui,sans-serif; --txt:'Manrope',system-ui,sans-serif;
  --ancho:1180px; color-scheme:light;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:90px}
html,body{overflow-x:clip}
main{overflow-x:clip}
body{font-family:var(--txt);color:var(--texto);background:var(--marmol);-webkit-font-smoothing:antialiased;line-height:1.6}
/* Sin overflow-x:hidden en body: lo volvía contenedor de scroll y el menú dejaba de pegarse (Isaac, 10/nov). */
img,svg{max-width:100%}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
a{color:inherit}
.env{max-width:var(--ancho);margin:0 auto;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
.rot{font:600 12px var(--rot);letter-spacing:.32em;text-transform:uppercase}
h1,h2,h3{font-family:var(--serif);font-weight:600;letter-spacing:-.01em;text-wrap:balance;line-height:1.05}
h2{font-size:clamp(36px,5vw,58px)}
.oro{background:linear-gradient(100deg,#b8892b 0%,#f0d98f 38%,#c49a3c 62%,#e6c877 100%);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:oro 7s ease-in-out infinite}
@keyframes oro{50%{background-position:100% 0}}
.kick{display:flex;align-items:center;gap:14px;color:var(--oro-o);margin-bottom:16px}
.kick:before{content:"";width:34px;height:1px;background:currentColor}
.oscuro .kick,.acrilico .kick{color:var(--oro-c)}
.marmol{background-color:var(--marmol);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='900' height='600' viewBox='0 0 900 600'%3E%3Cg fill='none' stroke='%23a9a39a' stroke-linecap='round'%3E%3Cpath d='M-20 90 C120 60 190 150 300 130 S470 40 560 95 S760 200 930 150' stroke-width='1.2' opacity='.35'/%3E%3Cpath d='M300 130 C330 190 410 210 440 270' stroke-width='.8' opacity='.3'/%3E%3Cpath d='M-30 420 C90 380 200 460 330 430 S520 340 640 390 S820 470 940 430' stroke-width='1.4' opacity='.28'/%3E%3Cpath d='M640 390 C660 450 720 480 760 540' stroke-width='.7' opacity='.3'/%3E%3Cpath d='M120 560 C220 520 280 590 380 570' stroke-width='.9' opacity='.22'/%3E%3C/g%3E%3C/svg%3E");background-size:900px 600px}

/* MENÚ FIJO (Isaac, 10/nov: «el menú sigue sin pegarse»): como en Acon, la franja y el menú van FIJOS arriba y el
   cuerpo deja su hueco (--alto-fija, lo mide el JS). «sticky» falla en algunos Safari. Al bajar, la franja se esconde. */
.fija{position:fixed;top:0;left:0;right:0;z-index:50}
body{padding-top:var(--alto-fija,107px)}
.fija .aviso{transition:margin-top .35s cubic-bezier(.2,.7,.2,1)}
.fija.baja .aviso{margin-top:calc(-1 * var(--alto-aviso,31px))}
/* Aviso de maqueta */
.aviso{background:var(--negro);color:#d8d2c4;font:500 12px var(--rot);letter-spacing:.06em;text-align:center;padding:8px 16px}
.aviso b{color:var(--oro-c);font-weight:600}

/* Cabecera con submenú */
.cab{position:relative;background:rgba(246,244,240,.88);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid rgba(156,116,23,.18);transition:box-shadow .3s}
.fija.baja .cab{box-shadow:0 14px 30px -24px rgba(0,0,0,.45)}
.cab .env{display:flex;align-items:center;gap:24px;height:76px}
.marca{display:flex;align-items:center;gap:12px;text-decoration:none;flex:none}
.marca svg{width:44px;height:40px}
.marca b{font:700 19px var(--rot);letter-spacing:.24em}
.marca small{display:block;font:600 9.5px var(--rot);letter-spacing:.3em;color:var(--oro-o);margin-top:2px}
.nav{display:flex;align-items:center;gap:4px;margin-left:auto}
.nav>li{list-style:none;position:relative}
.nav a.n,.nav button.n{display:flex;align-items:center;gap:6px;font:600 12px var(--rot);letter-spacing:.13em;text-transform:uppercase;text-decoration:none;color:#3a362f;padding:10px 12px;border-radius:10px;position:relative}
.nav a.n:after{content:"";position:absolute;left:12px;right:calc(100% - 12px);bottom:4px;height:1px;background:var(--oro);transition:right .3s}
.nav a.n:hover:after,.nav a.n.on:after{right:12px}
.nav a.n.on{color:var(--oro-o)}
.nav .fl{width:10px;height:10px;transition:transform .25s}
.sub{position:absolute;top:calc(100% + 10px);left:50%;transform:translate(-50%,8px);width:560px;background:var(--papel);border:1px solid #efe8da;border-radius:20px;box-shadow:0 30px 60px -30px rgba(0,0,0,.4);padding:14px;display:grid;grid-template-columns:1fr 1fr;gap:6px;opacity:0;visibility:hidden;transition:.25s}
.sub:before{content:"";position:absolute;top:-12px;left:0;right:0;height:12px}
.nav li:hover .sub,.nav li:focus-within .sub{opacity:1;visibility:visible;transform:translate(-50%,0)}
.nav li:hover .fl{transform:rotate(180deg)}
.sub a{display:flex;gap:12px;align-items:center;padding:10px 12px;border-radius:12px;text-decoration:none;transition:background .2s}
.sub a:hover{background:var(--crema)}
.sub a i{width:40px;height:40px;border-radius:10px;background:var(--negro);display:grid;place-items:center;flex:none}
.sub a i svg{width:22px;height:20px}
.sub a b{display:block;font:600 17px var(--serif)}
.sub a span{font-size:12.5px;color:var(--suave);line-height:1.35}
.sub .todos{grid-column:1/-1;justify-content:center;font:600 11px var(--rot);letter-spacing:.18em;text-transform:uppercase;color:var(--oro-o);border-top:1px solid var(--linea);border-radius:0 0 10px 10px;margin-top:4px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font:600 13px var(--rot);letter-spacing:.12em;text-transform:uppercase;text-decoration:none;border-radius:999px;padding:14px 24px;transition:transform .2s,box-shadow .2s,background .2s;white-space:nowrap}
.btn svg{width:18px;height:18px;flex:none}
.btn.oro-b{background:linear-gradient(120deg,#b8892b,#e6c877 50%,#c49a3c);background-size:200% 100%;color:#1a1405;box-shadow:0 10px 30px -12px rgba(156,116,23,.7)}
.btn.oro-b:hover{transform:translateY(-2px);background-position:100% 0;box-shadow:0 16px 36px -12px rgba(156,116,23,.8)}
.btn.linea{border:1px solid rgba(230,200,119,.55);color:#f1e6c6}
.btn.linea:hover{background:rgba(230,200,119,.1)}
.btn.linea-o{border:1px solid #d8cbad;color:var(--texto)}
.btn.linea-o:hover{border-color:var(--oro);background:#fff}
.btn.negro{background:var(--negro);color:#f3ead2}
.btn.negro:hover{transform:translateY(-2px)}
.cab .btn{padding:11px 18px;font-size:12px;margin-left:8px}
.menu{display:none;margin-left:auto;width:46px;height:46px;border-radius:12px;border:1px solid var(--linea);place-items:center}
.menu svg{width:22px;height:22px;stroke:var(--texto);fill:none;stroke-width:2;stroke-linecap:round}

/* Encabezado de cada página interior */
.pg-cab{padding:64px 0 70px;position:relative;overflow:hidden}
.migas{display:flex;flex-wrap:wrap;gap:8px;font:600 11px var(--rot);letter-spacing:.14em;text-transform:uppercase;color:var(--suave);margin-bottom:22px}
.migas a{text-decoration:none}
.migas a:hover{color:var(--oro-o)}
.migas span:before{content:"/";margin-right:8px;color:#c9bfa9}
.pg-cab h1{font-size:clamp(46px,7vw,92px);max-width:900px}
.pg-cab p.lead{font-size:19px;color:#4a453d;max-width:640px;margin-top:20px}
.pg-cab .mono-fondo{position:absolute;right:-60px;top:50%;width:420px;transform:translateY(-50%);opacity:.12;pointer-events:none}

/* HÉROE de inicio */
.heroe{padding:40px 0 80px}
.acrilico{position:relative;background:linear-gradient(160deg,#1d1c20 0%,#0c0c0d 55%,#141316 100%);border-radius:28px;overflow:hidden;color:#efe8d6;box-shadow:0 50px 90px -50px rgba(0,0,0,.65)}
.acrilico:before{content:"";position:absolute;inset:14px;border:1px solid rgba(230,200,119,.5);border-radius:18px;pointer-events:none}
.acrilico .reflejo{position:absolute;inset:0;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.08) 45%,transparent 52%);background-size:300% 100%;animation:reflejo 9s ease-in-out infinite;pointer-events:none}
@keyframes reflejo{0%{background-position:120% 0}50%,100%{background-position:-40% 0}}
.heroe-in{display:grid;grid-template-columns:1.05fr .95fr;gap:40px;align-items:center;padding:72px 64px}
.heroe h1{font-size:clamp(46px,6.4vw,84px);color:#f7f0dc}
.heroe p.lead{font-size:18.5px;color:#c9c1ad;max-width:520px;margin-top:22px}
.acc{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}
.datos-h{display:flex;flex-wrap:wrap;gap:10px 26px;margin-top:38px;font:500 12px var(--rot);letter-spacing:.12em;text-transform:uppercase;color:#a99f88}
.datos-h span{display:flex;align-items:center;gap:8px}
.datos-h span:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--oro)}
/* Palabras del título que suben una por una */
.palabras .w{display:inline-block;overflow:hidden;vertical-align:bottom;padding-bottom:.08em}
.palabras .w>span{display:inline-block;transform:translateY(105%);transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.listo .palabras .w>span{transform:none}

.escena{perspective:1400px;display:grid;place-items:center;min-height:420px;position:relative}
.escena .sombra{position:absolute;bottom:40px;width:70%;height:40px;background:radial-gradient(closest-side,rgba(0,0,0,.6),transparent);filter:blur(6px)}
.tarjeta{width:min(420px,100%);aspect-ratio:9/5.2;position:relative;transform-style:preserve-3d;transition:transform 1s cubic-bezier(.2,.7,.2,1);transform:rotateX(14deg) rotateY(-18deg) rotateZ(4deg);cursor:pointer;animation:flota 6s ease-in-out infinite}
.tarjeta.vuelta{transform:rotateX(14deg) rotateY(162deg) rotateZ(-4deg)}
@keyframes flota{50%{translate:0 -10px}}
.cara{position:absolute;inset:0;border-radius:14px;backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden;box-shadow:0 30px 50px -20px rgba(0,0,0,.7)}
.cara.frente{background:linear-gradient(150deg,#1b1a1e,#08080a);display:grid;place-items:center;border:1px solid #2a282c}
.cara.frente .foil{width:58%;display:flex;flex-direction:column;align-items:center;gap:14px}
.cara.frente svg{width:62%}
.cara.frente b{font:700 clamp(14px,2.2vw,19px) var(--rot);letter-spacing:.3em}
.cara.atras{transform:rotateY(180deg);background:#fbf8f1;color:#1d1b18;padding:9%;display:flex;flex-direction:column;justify-content:space-between}
.cara.atras .n{font:600 clamp(20px,3vw,27px) var(--serif)}
.cara.atras .p{font:600 10px var(--rot);letter-spacing:.22em;color:var(--oro-o);text-transform:uppercase;margin-top:4px}
.cara.atras ul{list-style:none;font-size:12px;color:#5d574d;display:grid;gap:3px}
.cara.atras .franja{position:absolute;right:0;top:0;bottom:0;width:16%;background:linear-gradient(180deg,#b8892b,#e6c877,#b8892b)}
.brillo{position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,rgba(255,240,200,.28) 47%,transparent 58%);background-size:250% 100%;animation:brillo 4.5s ease-in-out infinite;mix-blend-mode:screen}
@keyframes brillo{0%{background-position:120% 0}60%,100%{background-position:-60% 0}}
.pista{position:absolute;bottom:6px;font:600 11px var(--rot);letter-spacing:.2em;text-transform:uppercase;color:#8c836f}
/* El monograma se dibuja solo */
.dibuja path{stroke-dasharray:2400;stroke-dashoffset:2400;animation:traza 2.6s cubic-bezier(.6,.1,.2,1) forwards}
.dibuja path:nth-child(2){animation-delay:.25s}.dibuja path:nth-child(3){animation-delay:.4s}.dibuja path:nth-child(4){animation-delay:.6s}.dibuja path:nth-child(5){animation-delay:.75s}.dibuja path:nth-child(6){animation-delay:.9s}
.dibuja .corazon{opacity:0;animation:aparece .6s 1.8s forwards}
@keyframes traza{to{stroke-dashoffset:0}}
@keyframes aparece{to{opacity:1}}

.franja-c{display:grid;grid-template-columns:repeat(4,1fr);margin-top:-34px;position:relative;z-index:2;background:var(--papel);border-radius:20px;box-shadow:0 30px 60px -40px rgba(0,0,0,.35);overflow:hidden}
.franja-c div{padding:24px 26px;border-right:1px solid var(--linea)}
.franja-c div:last-child{border-right:0}
.franja-c b{display:block;font:600 22px var(--serif)}
.franja-c span{font-size:13.5px;color:var(--suave)}

section.blq{padding:110px 0}
section.blq.corto{padding:70px 0}
.cabeza{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;margin-bottom:46px}
.cabeza p{max-width:430px;color:var(--suave);font-size:16.5px}
.oscuro{background:radial-gradient(90% 70% at 85% 0%,rgba(196,154,60,.16),transparent 60%),linear-gradient(180deg,#121114,#0b0b0c);color:#efe8d6}
.oscuro h1,.oscuro h2{color:#f7f0dc}
.oscuro .cabeza p,.oscuro p.lead{color:#a99f88}
.mas{display:inline-flex;align-items:center;gap:8px;font:600 11.5px var(--rot);letter-spacing:.18em;text-transform:uppercase;color:var(--oro-o);text-decoration:none}
.mas i{font-style:normal;transition:transform .3s}
.mas:hover i,a:hover>.txt .mas i,a:hover .mas i{transform:translateX(5px)}
.oscuro .mas{color:var(--oro-c)}

/* Tarjetas de producto */
.prods{display:grid;grid-template-columns:repeat(6,1fr);gap:20px}
.prod{grid-column:span 2;position:relative;background:var(--papel);border-radius:22px;overflow:hidden;text-decoration:none;box-shadow:0 20px 50px -38px rgba(0,0,0,.4);border:1px solid #efe8da;transition:transform .35s,box-shadow .35s;display:flex;flex-direction:column}
.prods.cinco .prod:nth-child(4),.prods.cinco .prod:nth-child(5){grid-column:span 3}
.prod:hover{transform:translateY(-6px);box-shadow:0 34px 60px -36px rgba(0,0,0,.45)}
.prod .vis{height:220px}
.prod .txt{padding:22px 24px 24px;display:flex;flex-direction:column;gap:6px;flex:1}
.prod h3{font-size:28px}
.prod p{font-size:14.5px;color:var(--suave)}
.prod .mas{margin-top:auto;padding-top:12px}

/* Piezas dibujadas (muestras, no fotos) */
.vis{position:relative;overflow:hidden;background:var(--crema);display:grid;place-items:center}
.vis>*{transition:transform .6s cubic-bezier(.2,.7,.2,1)}
a:hover .vis .pz:first-child{transform:var(--h1,none)}
.pz{position:absolute;border-radius:6px;box-shadow:0 16px 26px -14px rgba(0,0,0,.45)}
.t1{width:150px;height:88px;background:linear-gradient(150deg,#1b1a1e,#0b0b0c);transform:rotate(-9deg) translate(-38px,8px);display:grid;place-items:center;--h1:rotate(-14deg) translate(-52px,0)}
.t1 svg{width:34px}
.t2{width:150px;height:88px;background:#fbf8f1;transform:rotate(7deg) translate(40px,-6px);padding:14px 16px}
.t2 i{display:block;height:5px;border-radius:3px;background:#d8cfbd;margin-top:6px}
.t2 i:first-child{width:60%;height:8px;background:#1d1b18;margin-top:0}
.t2 i.o{width:35%;background:var(--oro)}
.inv{width:116px;height:160px;background:#fffdf8;transform:rotate(-5deg) translateX(-26px);border:1px solid #efe4cc;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:10px;--h1:rotate(-9deg) translate(-40px,-6px)}
.inv em{font:italic 500 22px var(--serif);color:var(--oro-o)}
.inv small{font:600 7px var(--rot);letter-spacing:.2em;color:#8c836f}
.inv:before{content:"";position:absolute;inset:6px;border:1px solid #e3cf98;border-radius:3px}
.sob{width:150px;height:100px;background:linear-gradient(160deg,#e9dfc8,#d9cba9);transform:rotate(6deg) translate(40px,26px)}
.sob:before{content:"";position:absolute;inset:0;clip-path:polygon(0 0,100% 0,50% 58%);background:#cfbf98}
.sob:after{content:"";position:absolute;left:50%;top:50%;width:18px;height:18px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#e6c877,#9c7417);transform:translate(-50%,-30%)}
.lona{width:250px;height:110px;background:linear-gradient(120deg,#141316,#26242a);border-radius:4px;color:#f2e7c7;display:flex;align-items:center;justify-content:center;gap:12px;font:700 20px var(--rot);letter-spacing:.2em;--h1:scale(1.05)}
.lona svg{width:34px}
.lona:before,.lona:after{content:"";position:absolute;top:-6px;width:10px;height:10px;border-radius:50%;border:2px solid #b9b2a4;background:var(--crema)}
.lona:before{left:10px}.lona:after{right:10px}
.vol{width:104px;height:146px;background:#fff;padding:12px;transform:rotate(-8deg) translateX(-40px);display:flex;flex-direction:column;gap:6px;--h1:rotate(-12deg) translate(-54px,-4px)}
.vol .img{height:58px;border-radius:3px;background:linear-gradient(135deg,#e6c877,#9c7417)}
.vol i{display:block;height:5px;border-radius:3px;background:#ddd5c5}
.vol i.n{height:9px;width:80%;background:#1d1b18}
.tri{width:150px;height:110px;background:#fbf8f1;transform:rotate(5deg) translateX(46px);display:grid;grid-template-columns:repeat(3,1fr)}
.tri span{border-right:1px dashed #dfd5c0}
.tri span:nth-child(2){background:linear-gradient(180deg,#1b1a1e,#0b0b0c)}
.eti{width:84px;height:84px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#2a282d,#0c0c0d);display:grid;place-items:center;border:3px solid #c49a3c}
.eti svg{width:40px}
.e1{transform:translate(-70px,-10px) rotate(-10deg);--h1:translate(-80px,-18px) rotate(-22deg)}
.e2{transform:translate(6px,16px) rotate(6deg);background:#fbf8f1;border-color:#1d1b18}
.e3{width:96px;height:54px;border-radius:10px;transform:translate(84px,-18px) rotate(12deg);background:linear-gradient(120deg,#b8892b,#e6c877);border:0;font:700 10px var(--rot);letter-spacing:.2em;color:#1a1405}

/* Piezas de la galería */
.obra{position:relative;border-radius:18px;overflow:hidden;background:#1a191c;border:1px solid #2a282c;display:grid;place-items:center;cursor:zoom-in;transition:transform .4s,opacity .4s}
.obra:hover{transform:translateY(-4px)}
.obra figcaption{position:absolute;left:0;right:0;bottom:0;padding:14px 16px;background:linear-gradient(0deg,rgba(0,0,0,.78),transparent);font:600 11px var(--rot);letter-spacing:.16em;text-transform:uppercase;color:#e6dcc2;opacity:0;transform:translateY(8px);transition:.35s}
.obra:hover figcaption,.obra:focus-visible figcaption{opacity:1;transform:none}
.muestra{position:absolute;top:12px;right:12px;font:600 9px var(--rot);letter-spacing:.18em;color:#8c836f;border:1px solid #3a373c;border-radius:999px;padding:4px 9px;z-index:1}
.xv{width:46%;aspect-ratio:3/4.2;background:#fffdf8;border-radius:4px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;position:relative;box-shadow:0 30px 50px -20px rgba(0,0,0,.8);transform:rotate(-4deg)}
.xv:before{content:"";position:absolute;inset:8px;border:1px solid #e3cf98}
.xv small{font:600 8px var(--rot);letter-spacing:.3em;color:#8c836f}
.xv em{font:italic 500 clamp(24px,3.2vw,44px) var(--serif);color:var(--oro-o);line-height:1}
.xv b{font:600 clamp(26px,3.4vw,46px) var(--serif);color:#1d1b18}
.boda{width:52%;aspect-ratio:4/3;background:#fbf8f1;border-radius:4px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;box-shadow:0 30px 50px -20px rgba(0,0,0,.8);transform:rotate(3deg)}
.boda em{font:italic 500 clamp(18px,2.2vw,30px) var(--serif);color:#1d1b18}
.boda small{font:600 7px var(--rot);letter-spacing:.28em;color:var(--oro-o)}
.mini{width:62%;aspect-ratio:9/5.2;border-radius:6px;background:linear-gradient(150deg,#1b1a1e,#08080a);display:grid;place-items:center;box-shadow:0 20px 30px -16px rgba(0,0,0,.9);border:1px solid #2f2d31}
.mini svg{width:28%}
.mini.cl{background:#fbf8f1;border-color:#e6dcc2}
.stk{display:flex;gap:10px}
.stk i{width:54px;height:54px;border-radius:50%;background:linear-gradient(135deg,#b8892b,#e6c877);display:block;box-shadow:0 10px 20px -8px rgba(0,0,0,.8)}
.stk i:nth-child(2){background:#fbf8f1;transform:translateY(12px)}
.stk i:nth-child(3){background:#2a282d;border:2px solid #c49a3c}
.men{width:42%;aspect-ratio:3/5;background:#fbf8f1;border-radius:4px;padding:14px 12px;display:flex;flex-direction:column;gap:7px;box-shadow:0 30px 50px -20px rgba(0,0,0,.8);transform:rotate(3deg)}
.men b{font:600 14px var(--serif);text-align:center;color:#1d1b18}
.men i{height:4px;border-radius:2px;background:#e1d8c6;display:block}
.men i.o{background:var(--oro);width:40%;margin:4px auto}
.let{width:72%;height:44%;border-radius:6px;background:linear-gradient(120deg,#141316,#26242a);border:2px solid #c49a3c;display:flex;align-items:center;justify-content:center;gap:10px;color:#f2e7c7;font:700 clamp(12px,1.4vw,17px) var(--rot);letter-spacing:.22em}
.let svg{width:20%}
.vol2{width:44%;aspect-ratio:3/4;background:linear-gradient(160deg,#c49a3c,#6e5310);border-radius:4px;padding:12%;display:flex;flex-direction:column;justify-content:flex-end;gap:6px;box-shadow:0 30px 50px -20px rgba(0,0,0,.8);transform:rotate(-3deg)}
.vol2 b{font:600 clamp(16px,1.8vw,22px) var(--serif);color:#fff8e6;line-height:1.05}
.vol2 i{height:4px;border-radius:2px;background:rgba(255,248,230,.5);display:block}
.frasco{width:22%;aspect-ratio:2/3;border-radius:14px 14px 10px 10px;background:linear-gradient(90deg,#d9d2c4,#f4f0e8 40%,#cfc7b6);position:relative;box-shadow:0 30px 40px -20px rgba(0,0,0,.8)}
.frasco:before{content:"";position:absolute;left:18%;right:18%;top:-14%;height:16%;border-radius:4px;background:#2a282d}
.frasco:after{content:"MIEL";position:absolute;left:8%;right:8%;top:38%;height:30%;border-radius:4px;background:#0c0c0d;border:1px solid #c49a3c;color:#e6c877;font:700 9px var(--rot);letter-spacing:.2em;display:grid;place-items:center}
.banner{width:30%;aspect-ratio:1/2.6;background:linear-gradient(180deg,#141316,#26242a);border-radius:4px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:#f2e7c7;font:700 11px var(--rot);letter-spacing:.2em;box-shadow:0 30px 40px -20px rgba(0,0,0,.8);border-top:4px solid #c49a3c}
.banner svg{width:44%}

/* MÁS MUESTRAS (10/nov): lonas con tela, pliegues, ojillos y cuerdas; caja, lacre, tríptico y abanico. */
.tela{position:relative;border-radius:3px;box-shadow:0 22px 30px -18px rgba(0,0,0,.7)}
.tela:after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:
  repeating-linear-gradient(0deg,rgba(255,255,255,.035) 0 1px,transparent 1px 3px),
  repeating-linear-gradient(90deg,rgba(0,0,0,.05) 0 1px,transparent 1px 3px),
  linear-gradient(100deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.12) 16%,rgba(0,0,0,.2) 29%,rgba(255,255,255,.07) 44%,rgba(0,0,0,.14) 61%,rgba(255,255,255,.1) 79%,rgba(0,0,0,.12) 100%)}
.oj{position:absolute;width:9px;height:9px;border-radius:50%;background:radial-gradient(circle at 50% 50%,rgba(0,0,0,.55) 0 30%,#d9d9de 34%,#8d8d94 70%,#5c5c62);z-index:2;box-shadow:0 1px 2px rgba(0,0,0,.5)}
.oj.a1{left:6px;top:6px}.oj.a2{right:6px;top:6px}.oj.a3{left:6px;bottom:6px}.oj.a4{right:6px;bottom:6px}
.cu{position:absolute;height:1.5px;background:linear-gradient(90deg,#c9bfa6,#8f866f);transform-origin:left center;z-index:1}
.ln-negra{background:linear-gradient(160deg,#1d1c20,#0a0a0b);color:#f2e7c7;display:flex;align-items:center;justify-content:center;gap:4%}
.ln-negra svg{width:16%;height:auto;aspect-ratio:1.14}
.ln-negra b{font:700 clamp(10px,1.7vw,22px)/1.1 var(--rot);letter-spacing:.2em;color:#e6c877}
.ln-negra b small{display:block;font:600 .4em var(--rot);letter-spacing:.24em;color:#cfc6b0;margin-top:6px}
.ln-crema{background:linear-gradient(170deg,#fffaf0,#efe4cc);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3%;color:#1d1b18}
.ln-crema small{font:600 clamp(6px,.8vw,10px) var(--rot);letter-spacing:.32em;color:var(--oro-o)}
.ln-crema em{font:italic 500 clamp(16px,2.4vw,34px)/1 var(--serif);color:#1d1b18}
.ln-crema svg{width:12%;height:auto;aspect-ratio:1.14}
.ln-oro{background:linear-gradient(135deg,#9c7417,#e6c877 45%,#b8892b);display:grid;place-items:center;text-align:center}
.ln-oro b{font:600 clamp(14px,1.7vw,26px)/.95 var(--serif);color:#1a1405;letter-spacing:.02em}
.ln-rev{background:linear-gradient(170deg,#e9e6df,#d8d3c8);display:grid;place-items:center}
.ln-rev:before{content:"";position:absolute;inset:12px;border:1px dashed rgba(0,0,0,.18);border-radius:2px}
.ln-rev p{font:600 11px var(--rot);letter-spacing:.22em;text-transform:uppercase;color:#8f897c}
/* Fachada */
.esc-fachada{position:absolute;inset:0;overflow:hidden}
.esc-fachada .muro{position:absolute;inset:0;background:linear-gradient(180deg,#d8cbb2,#c9b998);}
.esc-fachada .muro:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 20% 30%,rgba(255,255,255,.18),transparent 40%),repeating-linear-gradient(0deg,rgba(0,0,0,.025) 0 2px,transparent 2px 5px)}
.esc-fachada .ventana{position:absolute;left:8%;top:48%;width:20%;height:30%;background:linear-gradient(160deg,#3d4a52,#1e262b);border:5px solid #f2ede2;box-shadow:inset 0 0 0 1px rgba(255,255,255,.15)}
.esc-fachada .puerta{position:absolute;left:42%;bottom:12%;width:18%;height:46%;background:linear-gradient(90deg,#2a2622,#3a332c);border:5px solid #f2ede2;border-bottom:0}
.esc-fachada .puerta i{position:absolute;right:12%;top:50%;width:4px;height:18px;border-radius:2px;background:#c49a3c}
.esc-fachada .banqueta{position:absolute;left:0;right:0;bottom:0;height:12%;background:linear-gradient(180deg,#9b968c,#7e796f)}
.esc-fachada .tela{position:absolute;left:24%;right:24%;top:10%;height:30%}
.esc-fachada .c1{left:-14%;top:-30%;width:22%;transform:rotate(30deg)}
.esc-fachada .c2{right:-14%;top:-30%;width:22%;transform-origin:right center;transform:rotate(-30deg)}
/* Evento */
.esc-evento{position:absolute;inset:0;background:radial-gradient(60% 50% at 50% 40%,#2a282d,#121114)}
.esc-evento .poste{position:absolute;top:10%;bottom:16%;width:5px;border-radius:3px;background:linear-gradient(90deg,#8d8d94,#e2e2e6,#77777e)}
.esc-evento .p1{left:17%}.esc-evento .p2{right:17%}
.esc-evento .tela{position:absolute;left:18%;right:18%;top:14%;height:52%}
.esc-evento .suelo{position:absolute;left:10%;right:10%;bottom:10%;height:16px;border-radius:50%;background:radial-gradient(closest-side,rgba(0,0,0,.7),transparent)}
/* Camioneta */
.esc-van{position:absolute;inset:0;background:linear-gradient(180deg,#1b1a1e 0 70%,#2a282c 70%)}
.van{position:absolute;left:14%;right:12%;top:20%;height:52%}
.van:before{content:"";position:absolute;inset:0 0 0 0;background:linear-gradient(180deg,#fdfdfb,#dcdad4);border-radius:14px 30px 8px 8px}
.van .cabina{position:absolute;right:0;top:0;width:22%;height:100%;background:linear-gradient(180deg,#fdfdfb,#d6d3cc);border-radius:10px 40px 8px 6px;box-shadow:-2px 0 0 rgba(0,0,0,.08)}
.van .vent{position:absolute;top:10%;height:30%;background:linear-gradient(160deg,#4a5862,#222b31);border-radius:6px}
.van .v1{right:3%;width:15%;border-radius:6px 26px 4px 4px}.van .v2{left:4%;width:10%}
.van .vinil{position:absolute;left:18%;right:26%;top:24%;bottom:26%;background:linear-gradient(160deg,#1d1c20,#0a0a0b);border-radius:4px;display:flex;align-items:center;justify-content:center;gap:6%;border-bottom:3px solid #c49a3c}
.van .vinil svg{width:16%;height:auto;aspect-ratio:1.14}
.van .vinil b{font:700 clamp(8px,1.2vw,15px)/1.1 var(--rot);letter-spacing:.2em;color:#e6c877}
.van .vinil b small{display:block;font:600 .55em var(--rot);color:#cfc6b0;margin-top:3px}
.rueda{position:absolute;bottom:-12%;width:11%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#b9b9be 0 22%,#3a3a3e 26% 30%,#141416 32%);z-index:1}
.r1{left:12%}.r2{right:17%}
.esc-van .suelo{position:absolute;left:8%;right:6%;bottom:22%;height:12px;border-radius:50%;background:radial-gradient(closest-side,rgba(0,0,0,.8),transparent)}
/* Gran apertura con cuerdas */
.esc-cuerdas{position:absolute;inset:0;background:radial-gradient(70% 60% at 50% 45%,#2a282d,#121114)}
.esc-cuerdas .tela{position:absolute;left:18%;right:18%;top:26%;height:44%;transform:perspective(500px) rotateY(-8deg) rotateZ(-1.5deg)}
.esc-cuerdas .k1{left:2%;top:18%;width:20%;transform:rotate(18deg)}.esc-cuerdas .k2{right:2%;top:18%;width:20%;transform-origin:right center;transform:rotate(-18deg)}
.esc-cuerdas .k3{left:2%;bottom:24%;width:20%;transform:rotate(-14deg)}.esc-cuerdas .k4{right:2%;bottom:24%;width:20%;transform-origin:right center;transform:rotate(14deg)}
/* Caja kraft */
.caja{position:relative;width:52%;aspect-ratio:1.4;transform:perspective(600px) rotateX(48deg) rotateZ(-18deg);transform-style:preserve-3d}
.caja .tapa{position:absolute;inset:0;background:linear-gradient(135deg,#caa274,#a77d4f);border-radius:4px;display:grid;place-items:center;box-shadow:0 30px 40px -20px rgba(0,0,0,.8)}
.caja .frente-c{position:absolute;left:0;right:0;bottom:-16%;height:16%;background:linear-gradient(180deg,#9b7346,#7e5c37);transform-origin:top;transform:rotateX(-90deg)}
.stk-r{width:38%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 35% 30%,#2a282d,#0c0c0d);border:3px solid #c49a3c;display:grid;place-items:center}
.stk-r svg{width:58%;height:auto;aspect-ratio:1.14}
.kraft{background:linear-gradient(135deg,#caa274,#a77d4f)}
.kraft .stk-r{width:42%}
.kraft.rev{background:linear-gradient(135deg,#d9bb92,#c3a072)}
.kraft.rev p{font:600 11px var(--rot);letter-spacing:.22em;text-transform:uppercase;color:#7e5c37}
/* Invitación con lacre */
.lacre{position:relative;width:62%;aspect-ratio:1.2}
.inv-l{position:absolute;left:8%;top:0;width:58%;height:84%;background:#fffdf8;border-radius:3px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;transform:rotate(-7deg);box-shadow:0 20px 30px -16px rgba(0,0,0,.8)}
.inv-l small{font:600 7px var(--rot);letter-spacing:.24em;color:var(--oro-o)}
.inv-l em{font:italic 500 clamp(14px,1.8vw,22px) var(--serif);color:#1d1b18}
.sobre-l{position:absolute;right:0;bottom:0;width:66%;height:60%;background:linear-gradient(160deg,#efe8da,#d9cdb3);border-radius:3px;transform:rotate(6deg);box-shadow:0 24px 30px -16px rgba(0,0,0,.8);display:grid;place-items:center}
.sobre-l:before{content:"";position:absolute;inset:0;clip-path:polygon(0 0,100% 0,50% 60%);background:#e3d7bd}
.sello{position:relative;width:24%;aspect-ratio:1;border-radius:48% 52% 50% 46%;background:radial-gradient(circle at 35% 30%,#f0d98f,#b8892b 55%,#7a5a12);box-shadow:0 3px 6px rgba(0,0,0,.4),inset 0 0 0 3px rgba(122,90,18,.35);z-index:1}
.bd .sello{position:absolute;bottom:12%;width:64px}
/* Tríptico abierto */
.trip{display:flex;width:70%;aspect-ratio:1.7;perspective:700px}
.trip .pn{flex:1;background:#fbf8f1;padding:7%;display:flex;flex-direction:column;gap:6px;box-shadow:0 24px 30px -18px rgba(0,0,0,.8)}
.trip .p1{transform:rotateY(22deg);transform-origin:right}.trip .p3{transform:rotateY(-22deg);transform-origin:left;background:linear-gradient(160deg,#1d1c20,#0a0a0b)}
.trip .pn i{display:block;height:4px;border-radius:2px;background:#ddd5c5}
.trip .pn b{font:600 clamp(9px,1vw,13px) var(--serif);color:#1d1b18}
.trip .p3 span{height:40%;border-radius:3px;background:linear-gradient(135deg,#e6c877,#9c7417)}
.trip .p3 i{background:rgba(242,231,199,.3)}
.trip3{flex-direction:row;padding:0;gap:0}
.trip3>div{flex:1;height:100%;padding:6%;display:flex;flex-direction:column;justify-content:center;gap:8px;border-right:1px dashed #dfd5c0;background:#fbf8f1}
.trip3>div:last-child{border-right:0}
.trip3 .port{background:linear-gradient(160deg,#1d1c20,#0a0a0b);align-items:center;text-align:center}
.trip3 .port svg{width:56px;height:50px}
.trip3 .port b{font:600 24px/1.05 var(--serif);color:#f7f0dc}
/* Tarjetas en abanico */
.abanico{position:relative;width:46%;aspect-ratio:1.6}
.abanico .tj{position:absolute;left:0;bottom:0;width:100%;aspect-ratio:1.73;border-radius:5px;transform-origin:8% 92%;box-shadow:0 14px 22px -12px rgba(0,0,0,.9);display:grid;place-items:center}
.abanico .tj svg{width:24%;height:auto;aspect-ratio:1.14}
.abanico .t-a{background:linear-gradient(150deg,#1b1a1e,#08080a);transform:rotate(-24deg)}
.abanico .t-b{background:#fbf8f1;transform:rotate(-12deg)}
.abanico .t-c{background:linear-gradient(150deg,#1b1a1e,#08080a);transform:rotate(0)}
.abanico .t-d{background:linear-gradient(120deg,#b8892b,#e6c877);transform:rotate(12deg)}
.abanico .t-d b,.tj-oro b{font:700 clamp(9px,1vw,13px) var(--rot);letter-spacing:.3em;color:#1a1405}
.tj-oro{background:linear-gradient(120deg,#b8892b,#e6c877 55%,#c49a3c)}
.tj-oro b{font-size:22px}
.vinil-3{background:linear-gradient(160deg,#1d1c20,#0a0a0b);flex-direction:row;gap:24px;border-bottom:6px solid #c49a3c}
.vinil-3 svg{width:70px;height:62px}
.vinil-3 b{font:700 30px/1.1 var(--rot);letter-spacing:.2em;color:#e6c877}
.vinil-3 b small{display:block;font:600 12px var(--rot);color:#cfc6b0;margin-top:4px}
.vinil-3.rev{background:repeating-linear-gradient(45deg,#f4f1ea 0 14px,#ece7dc 14px 28px);border-bottom-color:#d8d0bf}
.vinil-3.rev p{font:600 11px var(--rot);letter-spacing:.22em;text-transform:uppercase;color:#8f897c}
.f3.tela{position:absolute}
.f3.ln-negra b{font-size:30px}.f3.ln-negra svg{width:84px}.f3.ln-crema em{font-size:46px}.f3.ln-crema small{font-size:11px}.f3.ln-crema svg{width:54px}.f3.ln-oro b{font-size:54px}
.f3 .oj{width:14px;height:14px;border-radius:50%;background:radial-gradient(circle at 50% 50%,rgba(0,0,0,.55) 0 30%,#d9d9de 34%,#8d8d94 70%,#5c5c62)}.f3 .oj.a1{left:10px;top:10px}.f3 .oj.a2{right:10px;top:10px}.f3 .oj.a3{left:10px;bottom:10px}.f3 .oj.a4{right:10px;bottom:10px}

/* Pasos */
.pasos{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;counter-reset:p}
.pas{position:relative;padding:30px 26px;border-radius:22px;background:var(--papel);border:1px solid #efe8da}
.pas:before{counter-increment:p;content:"0" counter(p);font:italic 600 52px/1 var(--serif);color:transparent;-webkit-text-stroke:1px var(--oro)}
.pas h3{font-size:25px;margin-top:14px}
.pas p{font-size:14.5px;color:var(--suave);margin-top:8px}
.pasos.tres{grid-template-columns:repeat(3,1fr)}

/* Banda de llamada */
.llamado{border-radius:28px;padding:64px;display:grid;grid-template-columns:1.3fr auto;gap:30px;align-items:center;position:relative;overflow:hidden}
.llamado h2{font-size:clamp(34px,4.4vw,52px)}
.llamado p{color:#a99f88;margin-top:10px;max-width:520px}

/* Blog */
.notas{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.nota{background:var(--papel);border-radius:22px;overflow:hidden;border:1px solid #efe8da;text-decoration:none;display:flex;flex-direction:column;transition:transform .35s,box-shadow .35s}
.nota:hover{transform:translateY(-6px);box-shadow:0 30px 60px -40px rgba(0,0,0,.45)}
.nota .vis{height:190px}
.nota .txt{padding:22px 24px 26px;display:flex;flex-direction:column;gap:8px;flex:1}
.nota small{font:600 10.5px var(--rot);letter-spacing:.18em;text-transform:uppercase;color:var(--oro-o)}
.nota h3{font-size:25px}
.nota p{font-size:14.5px;color:var(--suave)}
.nota .mas{margin-top:auto;padding-top:10px}
.articulo{max-width:720px;margin:0 auto}
.articulo p,.articulo li{font-size:18px;color:#3d3832;line-height:1.75}
.articulo p+p,.articulo ul,.articulo ol{margin-top:18px}
.articulo h2{font-size:34px;margin:44px 0 14px}
.articulo ul,.articulo ol{padding-left:22px;display:grid;gap:8px}
.articulo .destacado{margin:34px 0;padding:24px 28px;border-left:3px solid var(--oro);background:var(--crema);border-radius:0 16px 16px 0;font:italic 500 24px/1.4 var(--serif);color:#2a2622}
.portada-art{height:340px;border-radius:26px;margin:-20px 0 50px}
.firma{display:flex;align-items:center;gap:12px;margin-top:22px;font-size:14px;color:var(--suave)}
.firma i{width:38px;height:38px;border-radius:50%;background:var(--negro);display:grid;place-items:center}
.firma i svg{width:22px}

/* Producto: página interior */
.pr-heroe{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.pr-heroe .vis{height:440px;border-radius:28px;box-shadow:0 40px 70px -46px rgba(0,0,0,.55)}
.pr-heroe .vis .pz{scale:1.45}
.pr-heroe h1{font-size:clamp(44px,6vw,76px)}
.pr-heroe p.lead{font-size:18.5px;color:#4a453d;margin-top:18px}
.ficha{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.ficha .c{background:var(--papel);border-radius:22px;padding:28px;border:1px solid #efe8da}
.ficha h3{font-size:26px;display:flex;align-items:center;gap:12px}
.ficha h3 i{width:38px;height:38px;border-radius:10px;background:var(--crema);display:grid;place-items:center;font:italic 600 20px var(--serif);color:var(--oro-o)}
.ficha ul{list-style:none;margin-top:16px;display:grid;gap:10px}
.ficha li{display:flex;gap:10px;align-items:baseline;font-size:15.5px;padding-bottom:10px;border-bottom:1px solid #f1ece2}
.ficha li:last-child{border-bottom:0;padding-bottom:0}
.ficha li:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--oro);flex:none;transform:translateY(-2px)}
.pend{display:inline-block;font:600 9.5px var(--rot);letter-spacing:.14em;text-transform:uppercase;color:var(--oro-o);background:#f6ecd2;border-radius:999px;padding:3px 9px;vertical-align:2px;margin-left:6px}
.ejemplo{font-size:13px;color:var(--suave);margin-top:22px;padding:12px 16px;border:1px dashed #d8cbad;border-radius:12px;background:#fbf7ee}
.faq{max-width:820px}
.faq details{border-bottom:1px solid var(--linea)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 0;font:600 22px var(--serif)}
.faq summary::-webkit-details-marker{display:none}
.faq summary i{width:34px;height:34px;border-radius:50%;border:1px solid #d8cbad;display:grid;place-items:center;flex:none;transition:transform .3s,background .3s;font-style:normal;color:var(--oro-o)}
.faq details[open] summary i{transform:rotate(45deg);background:var(--crema)}
.faq details p{padding:0 0 22px;color:var(--suave);font-size:16px;max-width:680px}
.faq details[open] p{animation:abre .4s ease}
@keyframes abre{from{opacity:0;transform:translateY(-6px)}}

/* Trabajos: filtros y rejilla */
.filtros{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:30px}
.filtros button{border:1px solid #3a373c;border-radius:999px;padding:10px 18px;font:600 12px var(--rot);letter-spacing:.12em;text-transform:uppercase;color:#cfc6b0;transition:.25s}
.filtros button:hover{border-color:var(--oro)}
.filtros button.on{background:linear-gradient(120deg,#b8892b,#e6c877);color:#1a1405;border-color:transparent}
.galeria{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:200px;grid-auto-flow:dense;gap:16px}
.galeria .g{grid-column:span 2;grid-row:span 2}
.galeria .a{grid-row:span 2}
.galeria .w{grid-column:span 2}
.obra.fuera{display:none}
.caja-luz{position:fixed;inset:0;z-index:90;background:rgba(8,8,9,.9);display:grid;place-items:center;padding:30px max(20px,env(safe-area-inset-right,0px)) 30px max(20px,env(safe-area-inset-left,0px));opacity:0;pointer-events:none;transition:opacity .3s}
.caja-luz.on{opacity:1;pointer-events:auto}
.caja-luz .marco{width:min(760px,100%);aspect-ratio:4/3;border-radius:22px;background:#1a191c;border:1px solid #2a282c;position:relative;display:grid;place-items:center;overflow:hidden;transform:scale(.94);transition:transform .35s}
.caja-luz.on .marco{transform:none}
.caja-luz .marco figcaption{position:absolute;left:0;right:0;bottom:0;padding:16px 20px;color:#e6dcc2;font:600 12px var(--rot);letter-spacing:.16em;text-transform:uppercase;background:linear-gradient(0deg,rgba(0,0,0,.7),transparent)}
.caja-luz button{position:absolute;top:max(18px,env(safe-area-inset-top,0px));right:max(18px,env(safe-area-inset-right,0px));width:46px;height:46px;border-radius:50%;border:1px solid #3a373c;color:#e6dcc2;font-size:18px}

/* Cotizador */
.cot{display:grid;grid-template-columns:1.1fr .9fr;gap:34px;align-items:start}
.form{background:var(--papel);border-radius:26px;padding:34px;box-shadow:0 30px 60px -44px rgba(0,0,0,.45);border:1px solid #efe8da}
.paso-f{display:flex;align-items:baseline;gap:12px;margin:24px 0 12px}
.paso-f:first-child{margin-top:0}
.paso-f i{font:italic 600 26px var(--serif);color:var(--oro)}
.paso-f b{font:600 12px var(--rot);letter-spacing:.18em;text-transform:uppercase}
.ops{display:flex;flex-wrap:wrap;gap:8px}
.ops button{border:1px solid var(--linea);border-radius:999px;padding:10px 16px;font-size:14px;background:#fff;transition:.2s}
.ops button:hover{border-color:var(--oro)}
.ops button.on{background:var(--negro);border-color:var(--negro);color:#f3ead2}
.campo{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.campo input,.campo textarea,.campo select{width:100%;font:inherit;font-size:15px;border:1px solid var(--linea);border-radius:14px;padding:13px 15px;background:#fcfbf8;color:var(--texto)}
.campo textarea{grid-column:1/-1;resize:vertical;min-height:96px}
.campo .ancho{grid-column:1/-1}
.campo input:focus,.campo textarea:focus,.campo select:focus{outline:2px solid rgba(196,154,60,.45);border-color:var(--oro)}
.archivo{display:flex;align-items:center;gap:14px;border:1.5px dashed #d8cbad;border-radius:16px;padding:16px 18px;background:#fbf7ee;cursor:pointer;transition:.2s}
.archivo:hover{border-color:var(--oro)}
.archivo svg{width:26px;height:26px;stroke:var(--oro-o);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.archivo b{display:block;font-weight:600;font-size:14.5px}
.archivo span{font-size:13px;color:var(--suave)}
.archivo input{display:none}
.form .btn{width:100%;margin-top:26px}
.wa{position:sticky;top:110px}
.telefono{width:min(340px,100%);margin:0 auto;background:#0e0e10;border-radius:44px;padding:12px;box-shadow:0 40px 70px -40px rgba(0,0,0,.7)}
.pantalla{border-radius:34px;overflow:hidden;background:#efe7dc;min-height:520px;display:flex;flex-direction:column}
.wa-cab{background:#1f2c33;color:#e9edef;display:flex;align-items:center;gap:10px;padding:34px 14px 12px}
.wa-cab .av{width:36px;height:36px;border-radius:50%;background:#0c0c0d;display:grid;place-items:center;border:1px solid #3a3a3a}
.wa-cab .av svg{width:22px}
.wa-cab b{font-size:15px;font-weight:600;display:block}
.wa-cab small{font-size:11.5px;color:#aebac1}
.wa-cuerpo{flex:1;padding:16px 12px;display:flex;flex-direction:column;gap:8px}
.burb{max-width:86%;padding:8px 10px 6px;border-radius:10px;font-size:13.5px;line-height:1.42;box-shadow:0 1px 1px rgba(0,0,0,.08);white-space:pre-line;animation:sube .35s ease}
@keyframes sube{from{opacity:0;transform:translateY(8px)}}
.burb.yo{align-self:flex-end;background:#d9fdd3;border-top-right-radius:2px}
.burb.ellos{align-self:flex-start;background:#fff;border-top-left-radius:2px}
.burb small{display:block;text-align:right;font-size:10.5px;color:#667781;margin-top:2px}
.burb .adj{display:flex;align-items:center;gap:8px;background:rgba(0,0,0,.05);border-radius:8px;padding:7px 9px;margin-bottom:6px;font-size:12.5px}
.burb .adj i{width:26px;height:30px;border-radius:4px;background:#e2504c;color:#fff;font:700 8px var(--rot);display:grid;place-items:center;font-style:normal}
.escribe{align-self:flex-start;background:#fff;border-radius:10px;padding:10px 14px;display:none;gap:4px}
.escribe.on{display:flex}
.escribe i{width:6px;height:6px;border-radius:50%;background:#9aa5ab;animation:pt 1.2s infinite}
.escribe i:nth-child(2){animation-delay:.2s}.escribe i:nth-child(3){animation-delay:.4s}
@keyframes pt{30%{transform:translateY(-4px)}}
.wa-pie{font-size:12.5px;color:var(--suave);text-align:center;margin-top:14px}

/* Nosotros */
.nos{display:grid;grid-template-columns:.9fr 1.1fr;gap:60px;align-items:center}
.foto-l{position:relative;border-radius:26px;overflow:hidden;box-shadow:0 40px 70px -40px rgba(0,0,0,.6)}
.foto-l img{display:block;width:100%;height:540px;object-fit:cover;object-position:center 40%}
.foto-l span{position:absolute;left:16px;bottom:16px;background:rgba(12,12,13,.75);color:#e6dcc2;font:600 10px var(--rot);letter-spacing:.18em;border-radius:999px;padding:7px 12px;text-transform:uppercase}
.nos p.lead{font-size:18px;color:#4a453d;margin-top:20px}
.valores{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:30px}
.valores div{border-top:1px solid var(--linea);padding-top:14px}
.valores b{font:600 20px var(--serif)}
.valores p{font-size:14px;color:var(--suave);margin-top:4px}
.cifras{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.cifras div{padding:34px 28px;border-radius:22px;border:1px solid #2c2a2e;background:rgba(255,255,255,.02)}
.cifras b{display:block;font:600 22px var(--serif);color:#f7f0dc}
.cifras p{color:#a99f88;font-size:14.5px;margin-top:8px}

/* Contacto */
.contacto{display:grid;grid-template-columns:1fr 1fr;border-radius:28px;overflow:hidden;box-shadow:0 40px 80px -50px rgba(0,0,0,.55)}
.contacto .info{padding:54px;background:linear-gradient(160deg,#1a191c,#0c0c0d);color:#efe8d6}
.fila-c{display:flex;gap:16px;align-items:flex-start;padding:18px 0;border-bottom:1px solid #2c2a2e}
.fila-c svg{width:22px;height:22px;stroke:var(--oro-c);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none;margin-top:3px}
.fila-c small{display:block;font:600 10.5px var(--rot);letter-spacing:.2em;color:#8c836f;text-transform:uppercase}
.fila-c b{font-weight:500;font-size:16px}
.mapa{position:relative;background:#e9e4da;min-height:460px}
.mapa>svg{position:absolute;inset:0;width:100%;height:100%}
.pin{position:absolute;left:52%;top:46%;transform:translate(-50%,-100%);display:flex;flex-direction:column;align-items:center}
.pin .bur{background:var(--negro);color:#f3ead2;border-radius:14px;padding:10px 14px;display:flex;align-items:center;gap:10px;box-shadow:0 14px 30px -10px rgba(0,0,0,.6);white-space:nowrap}
.pin .bur svg{width:26px;height:24px}
.pin .bur b{font:700 13px var(--rot);letter-spacing:.2em}
.pin .bur small{display:block;font-size:11px;color:#bdb39b}
.pin:after{content:"";width:14px;height:14px;background:var(--negro);transform:rotate(45deg);margin-top:-8px}
.pin .pulso{position:absolute;bottom:-18px;width:18px;height:18px;border-radius:50%;background:rgba(196,154,60,.5);animation:pulso 2s infinite}
@keyframes pulso{to{transform:scale(3.2);opacity:0}}
.form-c{max-width:760px}

/* Pie con boletín */
.pie{background:var(--negro);color:#a99f88;padding:70px 0 34px;margin-top:40px}
.pie .env{display:grid;grid-template-columns:1.3fr 1fr 1fr 1.3fr;gap:40px}
.pie .marca b{color:#f3ead2}
.pie h5{font:600 11px var(--rot);letter-spacing:.2em;text-transform:uppercase;color:#e6dcc2;margin-bottom:14px}
.pie ul{list-style:none;display:grid;gap:8px;font-size:14px}
.pie a{text-decoration:none}
.pie a:hover{color:var(--oro-c)}
.boletin p{font-size:14px;margin-bottom:12px}
.boletin form{display:flex;gap:8px}
.boletin input{flex:1;min-width:0;font:inherit;font-size:14px;border:1px solid #3a373c;background:#141316;color:#efe8d6;border-radius:999px;padding:11px 16px}
.boletin button{border-radius:999px;padding:0 16px;background:linear-gradient(120deg,#b8892b,#e6c877);color:#1a1405;font:700 11px var(--rot);letter-spacing:.14em}
.pie .bajo{grid-column:1/-1;border-top:1px solid #2a282c;padding-top:22px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:12.5px}
.sin-margen .pie{margin-top:0}

/* FLOTANTES: WhatsApp y VOLVER ARRIBA, el de todos los proyectos (Acon: acon-wp/tema-hijo/parts/flotantes.html).
   La flecha DESPEGA con su estela y llega al borde justo cuando la página llega arriba: vuelo y scroll comparten
   duración y curva (1300 ms). En dorado de Emily's. Aparece pasados 500 px; mientras no, WhatsApp baja a su lugar. */
.flotantes{position:fixed;right:max(20px,env(safe-area-inset-right,0px));bottom:max(20px,env(safe-area-inset-bottom,0px));z-index:60;display:flex;flex-direction:column;align-items:center;gap:12px;pointer-events:none}
.flotantes>*{pointer-events:auto}
.wa-b{width:58px;height:58px;border-radius:50%;background:#25d366;display:grid;place-items:center;box-shadow:0 14px 30px -10px rgba(0,0,0,.5);transition:transform .32s cubic-bezier(.34,1.56,.64,1),translate .32s cubic-bezier(.34,1.56,.64,1)}
.wa-b svg{width:30px;height:30px;fill:#fff}
.wa-b:hover{transform:translateY(-3px) scale(1.06)}
.flotantes:not(.se-ve) .wa-b{translate:0 62px}
.arriba{position:relative;display:grid;place-items:center;width:50px;height:50px;border-radius:50%;background:rgba(12,12,13,.82);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 14px 30px -12px rgba(0,0,0,.55);opacity:0;transform:translateY(16px) scale(.85);pointer-events:none;transition:opacity .32s ease,transform .32s cubic-bezier(.34,1.56,.64,1)}
.flotantes.se-ve .arriba{opacity:1;transform:none;pointer-events:auto}
.flotantes.se-ve .arriba:hover{transform:translateY(-3px) scale(1.06)}
.arriba:before{content:"";position:absolute;inset:0;border-radius:50%;padding:1.5px;background:linear-gradient(0deg,#9c7417,#f0d98f);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude}
.arriba-flecha{position:relative;z-index:1;width:22px;height:22px;overflow:visible;fill:none;stroke:#e6c877;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:transform .25s}
.arriba:hover .arriba-flecha{transform:translateY(-3px)}
.arriba.despega .arriba-flecha{animation:despega 1.3s cubic-bezier(.65,0,.35,1) forwards}
@keyframes despega{0%{transform:translateY(0);opacity:1}88%{opacity:1}100%{transform:translateY(var(--vuelo,-100vh));opacity:0}}
.arriba-estela{position:absolute;left:calc(50% - 1px);bottom:50%;width:2px;height:calc(var(--vuelo,-100vh) * -1);border-radius:2px;background:linear-gradient(0deg,rgba(196,154,60,0),#c49a3c 45%,#f0d98f);transform:scaleY(0);transform-origin:bottom;opacity:0;pointer-events:none}
.arriba.despega .arriba-estela{animation:estela 1.3s cubic-bezier(.65,0,.35,1) forwards,estela-luz 1.3s linear forwards}
@keyframes estela{to{transform:scaleY(1)}}
@keyframes estela-luz{0%{opacity:.9}70%{opacity:.7}100%{opacity:0}}
html.visor-abierto .flotantes,.cab.abierto~* .flotantes{display:none}
@media (max-width:640px){.flotantes{right:max(14px,env(safe-area-inset-right,0px));bottom:max(14px,env(safe-area-inset-bottom,0px));gap:10px}.arriba{width:46px;height:46px}.wa-b{width:54px;height:54px}.flotantes:not(.se-ve) .wa-b{translate:0 56px}}
@media (prefers-reduced-motion:reduce){.arriba.despega .arriba-flecha,.arriba.despega .arriba-estela{animation:none}}
.toast{position:fixed;left:50%;bottom:150px;transform:translate(-50%,20px);background:var(--negro);color:#f3ead2;font-size:14px;padding:12px 18px;border-radius:14px;opacity:0;pointer-events:none;transition:.3s;z-index:95;max-width:calc(100% - 32px);text-align:center}
.toast.on{opacity:1;transform:translate(-50%,0)}

/* FORMULARIO DE CONTACTO (Isaac, 10/nov/2026: «agrega un formulario de contacto»): Inicio, Contacto y cada producto. */
.contacto-f{display:grid;grid-template-columns:.85fr 1.15fr;gap:50px;align-items:start}
.contacto-f .lado p.lead{color:#4a453d;font-size:17.5px;margin-top:16px}
.contacto-f .lado ul{list-style:none;margin-top:26px;display:grid;gap:14px}
.contacto-f .lado li{display:flex;gap:12px;align-items:flex-start;font-size:15px}
.contacto-f .lado li i{width:40px;height:40px;border-radius:50%;border:1px solid #e3cf98;background:#fbf7ee;display:grid;place-items:center;flex:none}
.contacto-f .lado li i svg{width:20px;height:20px;fill:none;stroke:var(--oro-o);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.contacto-f .lado li b{display:block;font-weight:600}
.contacto-f .lado li span{color:var(--suave);font-size:14px}
.fc{position:relative}
.fc label.etq-c{display:block;font:600 10.5px var(--rot);letter-spacing:.18em;text-transform:uppercase;color:var(--suave);margin:0 0 6px 4px}
.fc .campo>div{display:flex;flex-direction:column}
.fc .campo>div.ancho{grid-column:1/-1}
.fc select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='m1 1 5 5 5-5' fill='none' stroke='%239c7417' stroke-width='1.6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;padding-right:40px}
.fc .acepto{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;color:var(--suave);margin-top:16px;cursor:pointer}
.fc .acepto input{width:18px;height:18px;accent-color:#9c7417;margin-top:2px;flex:none}
.fc .acepto a{color:var(--oro-o)}
.fc .error{color:#a52a23;font-size:13px;margin-top:10px;min-height:1em}
.fc input:invalid.tocado,.fc textarea:invalid.tocado,.fc select:invalid.tocado{border-color:#d9776f}
.fc .gracias{position:absolute;inset:0;border-radius:26px;background:var(--papel);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:12px;padding:30px;opacity:0;pointer-events:none;transition:opacity .4s}
.fc.enviado .gracias{opacity:1;pointer-events:auto}
.fc .gracias svg.ok{width:64px;height:64px}
.fc .gracias svg.ok circle{stroke:var(--oro);stroke-width:2;fill:none;stroke-dasharray:190;stroke-dashoffset:190}
.fc .gracias svg.ok path{stroke:var(--oro-o);stroke-width:3;fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:40;stroke-dashoffset:40}
.fc.enviado .gracias svg.ok circle{animation:traza .8s ease forwards}
.fc.enviado .gracias svg.ok path{animation:traza .5s .6s ease forwards}
.fc .gracias h3{font-size:32px}
.fc .gracias p{color:var(--suave);max-width:380px}
.fc .gracias small{font-size:12px;color:#8c836f}
@media (max-width:1060px){.contacto-f{grid-template-columns:1fr;gap:30px}}

/* VISOR 3D de las muestras (Isaac, 10/nov/2026: «se debe desenfocar y ver la muestra en 3D, que se pueda rotar y ver
   el reverso»). Fondo desenfocado; la pieza es un objeto con anverso, reverso y canto; se gira arrastrando. */
.obra template{display:none}
.visor{position:fixed;inset:0;z-index:100;display:flex;flex-direction:column;background:rgba(10,10,11,.62);-webkit-backdrop-filter:blur(18px) saturate(.8);backdrop-filter:blur(18px) saturate(.8);color:#efe8d6;opacity:0;transition:opacity .35s;padding:max(14px,env(safe-area-inset-top,0px)) max(16px,env(safe-area-inset-right,0px)) max(14px,env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px))}
.visor.on{opacity:1}
.visor[hidden]{display:none}
html.visor-abierto,html.visor-abierto body{overflow:hidden}
.visor-cab{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;max-width:1100px;width:100%;margin:0 auto}
.visor-cab small{display:block;font:600 10.5px var(--rot);letter-spacing:.22em;color:var(--oro-c)}
.visor-cab b{display:block;font:600 clamp(24px,3vw,34px)/1.1 var(--serif);color:#f7f0dc;margin-top:4px}
.v-cerrar{width:46px;height:46px;border-radius:50%;border:1px solid rgba(230,200,119,.4);color:#f1e6c6;font-size:18px;flex:none;transition:background .2s}
.v-cerrar:hover{background:rgba(230,200,119,.12)}
.escenario{flex:1;min-height:0;position:relative;perspective:1300px;overflow:hidden;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none}
.escenario.arrastra{cursor:grabbing}
.piso{position:absolute;left:50%;bottom:8%;width:min(520px,70%);height:60px;transform:translateX(-50%);background:radial-gradient(closest-side,rgba(0,0,0,.55),transparent);filter:blur(4px);transition:width .2s}
.objeto{position:absolute;left:50%;top:50%;transform-style:preserve-3d;will-change:transform}
.objeto .cara3,.objeto .canto{position:absolute;left:0;top:0;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.objeto .cara3{width:100%;height:100%;border-radius:6px;overflow:hidden;box-shadow:0 0 0 .5px rgba(0,0,0,.15)}
.objeto .cara3:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(calc(110deg + var(--ry,0deg)*.5),transparent 30%,rgba(255,255,255,var(--brillo,.18)) 48%,transparent 62%);mix-blend-mode:soft-light}
.visor-pie{display:flex;flex-direction:column;align-items:center;gap:12px}
.pista3{font:600 10.5px var(--rot);letter-spacing:.2em;text-transform:uppercase;color:#a99f88;text-align:center}
.v-botones{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.v-botones button{border:1px solid rgba(230,200,119,.4);border-radius:999px;padding:11px 18px;font:600 12px var(--rot);letter-spacing:.1em;text-transform:uppercase;color:#f1e6c6;transition:background .2s}
.v-botones button:hover{background:rgba(230,200,119,.12)}
.v-botones .v-pri{background:linear-gradient(120deg,#b8892b,#e6c877);color:#1a1405;border-color:transparent}
/* Caras: cada una llena su objeto */
.f3{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:8%;text-align:center}
.f3 i{display:block;height:5px;border-radius:3px;background:#ddd5c5;width:100%}
.f3 h6{font:600 11px var(--rot);letter-spacing:.2em;text-transform:uppercase;color:var(--oro-o);align-self:flex-start;margin-top:6px}
.xv3{background:#fffdf8;color:#1d1b18}
.xv3:before{content:"";position:absolute;inset:14px;border:1px solid #e3cf98}
.xv3 small{font:600 10px var(--rot);letter-spacing:.3em;color:#8c836f}
.xv3 em{font:italic 500 64px/1 var(--serif);color:var(--oro-o)}
.xv3 b{font:600 70px/1 var(--serif)}
.xv3.rev{gap:14px}
.xv3.rev p{font:500 15px var(--txt);color:#5d574d}
.xv3.rev p b{display:block;font:600 24px var(--serif);color:#1d1b18}
.xv3.rev svg{width:46px;height:42px;margin-top:6px}
.tn{background:linear-gradient(150deg,#1b1a1e,#08080a);color:#f2e7c7}
.tn svg{width:76px;height:68px}
.tn b{font:700 18px var(--rot);letter-spacing:.3em;color:#e6c877}
.tc{background:#fbf8f1;color:#1d1b18}
.tc .m{width:84px;height:76px}
.tc.rev,.tn.rev{align-items:flex-start;justify-content:space-between;text-align:left}
.tc.rev b,.tn.rev b{display:block;font:600 26px var(--serif);letter-spacing:0}
.tn.rev b{color:#f7f0dc}
.tc.rev small,.tn.rev small{font:600 9.5px var(--rot);letter-spacing:.22em;color:var(--oro-o)}
.tn.rev small{color:#e6c877}
.tc.rev ul,.tn.rev ul{list-style:none;font-size:13px;display:grid;gap:3px;color:#6c665c}
.tn.rev ul{color:#bdb39b}
.tc.rev .fr{position:absolute;right:0;top:0;bottom:0;width:15%;background:linear-gradient(180deg,#b8892b,#e6c877,#b8892b)}
.mn{background:#fbf8f1;color:#1d1b18;justify-content:flex-start;gap:9px}
.mn>b{font:600 34px var(--serif)}
.mn i.o{width:30%;background:var(--oro);margin:2px auto 6px}
.mn.rev p{margin-top:auto;font:italic 500 18px var(--serif);color:var(--oro-o)}
.hoja-stk{background:#fff;display:grid;grid-template-columns:repeat(3,1fr);place-items:center;padding:8%}
.hoja-stk i{width:76px;height:76px;border-radius:50%;background:linear-gradient(135deg,#b8892b,#e6c877);box-shadow:0 1px 0 rgba(0,0,0,.08)}
.hoja-stk i:nth-child(2n){background:#2a282d;border:3px solid #c49a3c}
.hoja-stk i:nth-child(3n){background:#fbf8f1;border:2px solid #1d1b18}
.hoja-stk.rev{display:flex;background:repeating-linear-gradient(0deg,#f1ede4 0 28px,#e7e1d4 28px 29px),#f1ede4}
.hoja-stk.rev p{font:600 12px var(--rot);letter-spacing:.24em;text-transform:uppercase;color:#9a927f;transform:rotate(-12deg)}
.acr{background:linear-gradient(160deg,#1d1c20,#08080a);flex-direction:row;gap:20px}
.acr:before{content:"";position:absolute;inset:12px;border:2px solid #c49a3c;border-radius:4px}
.acr svg{width:84px;height:76px}
.acr b{font:700 30px var(--rot);letter-spacing:.24em;color:#e6c877}
.acr span{position:absolute;width:16px;height:16px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#9a9aa0 60%,#55555a)}
.acr .t1{left:18px;top:18px}.acr .t2{right:18px;top:18px}.acr .t3{left:18px;bottom:18px}.acr .t4{right:18px;bottom:18px}
.acr.rev{background:linear-gradient(200deg,#2a2930,#121115)}
.acr.rev:before{border-color:rgba(196,154,60,.35)}
.acr.rev p{font:600 11px var(--rot);letter-spacing:.24em;text-transform:uppercase;color:#7d776c}
.vo{background:linear-gradient(160deg,#c49a3c,#6e5310);align-items:flex-start;justify-content:flex-end;text-align:left;gap:12px}
.vo b{font:600 46px/1 var(--serif);color:#fff8e6}
.vo i{background:rgba(255,248,230,.5)}
.vo span{font:700 11px var(--rot);letter-spacing:.24em;color:#fff8e6;margin-top:6px}
.vo.rev{background:#fffdf8;justify-content:flex-start;gap:10px}
.vo.rev .mp{margin-top:auto;align-self:stretch;height:90px;border-radius:8px;background:#ece7dd;display:grid;place-items:center}
.vo.rev .mp svg{width:40px;height:36px}
.bd{background:#fbf8f1;color:#1d1b18}
.bd:before{content:"";position:absolute;inset:12px;border:1px solid #e3cf98}
.bd small{font:600 10px var(--rot);letter-spacing:.3em;color:var(--oro-o)}
.bd em{font:italic 500 50px/1.05 var(--serif)}
.bd.rev p{font:500 14px var(--txt);color:#5d574d}
.bd.rev p b{display:block;font:600 24px var(--serif);color:#1d1b18}
.et{background:radial-gradient(circle at 30% 20%,#2a282d,#0c0c0d);flex-direction:row;gap:18px}
.et:before{content:"";position:absolute;inset:10px;border:1.5px solid #c49a3c;border-radius:4px}
.et svg{width:60px;height:54px}
.et b{font:700 34px var(--rot);letter-spacing:.24em;color:#e6c877}
.et small{position:absolute;bottom:18px;font:600 8.5px var(--rot);letter-spacing:.26em;color:#a99f88}
.et.rev{background:#fbf8f1;flex-direction:column;align-items:flex-start;gap:8px}
.et.rev:before{display:none}
.et.rev small{position:static;color:#8c836f;margin-top:4px}
.bn{background:linear-gradient(180deg,#141316,#26242a);border-top:6px solid #c49a3c;gap:18px}
.bn svg{width:90px;height:80px}
.bn b{font:700 22px var(--rot);letter-spacing:.24em;color:#f2e7c7}
.bn i{background:rgba(242,231,199,.25);width:70%}
.bn.rev{background:linear-gradient(180deg,#c9c4b8,#b3ad9f);border-top-color:#8f8a7e}
.bn.rev span{position:absolute;left:50%;width:14px;height:14px;border-radius:50%;border:3px solid #77736a;transform:translateX(-50%)}
.bn.rev span:nth-child(1){top:4%}.bn.rev span:nth-child(2){top:34%}.bn.rev span:nth-child(3){top:64%}.bn.rev span:nth-child(4){bottom:4%}

/* ANIMACIONES DE APARICIÓN (al bajar) */
.ap{opacity:0;transform:translateY(30px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1);transition-delay:var(--d,0s)}
.ap.izq{transform:translateX(-40px)} .ap.der{transform:translateX(40px)} .ap.zoom{transform:scale(.94)}
.ap.vis-on{opacity:1;transform:none}
.cortina{clip-path:inset(0 0 100% 0);transition:clip-path 1.2s cubic-bezier(.7,0,.2,1);transition-delay:var(--d,0s)}
.cortina.vis-on{clip-path:inset(0 0 0 0)}
.linea-oro{height:1px;background:linear-gradient(90deg,transparent,var(--oro),transparent);transform:scaleX(0);transition:transform 1.4s cubic-bezier(.2,.7,.2,1)}
.linea-oro.vis-on{transform:scaleX(1)}
body.entra main{animation:entra .7s ease both}
/* Solo opacidad: un transform en <main> vuelve a main el marco de todo lo fijo (bug del 10/nov). */
@keyframes entra{from{opacity:0}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.ap,.cortina{opacity:1;transform:none;clip-path:none}.palabras .w>span{transform:none}.dibuja path{stroke-dashoffset:0}.dibuja .corazon{opacity:1}}

/* Tableta y celular */
@media (max-width:1060px){
  .nav,.cab .btn{display:none}
  .menu{display:grid}
  .cab.abierto .nav{display:flex;flex-direction:column;align-items:stretch;gap:0;position:absolute;top:76px;left:0;right:0;max-height:calc(100vh - 76px);overflow-y:auto;background:var(--marmol);border-bottom:1px solid var(--linea);padding:8px max(20px,env(safe-area-inset-right,0px)) 18px max(20px,env(safe-area-inset-left,0px))}
  .cab.abierto .nav a.n,.cab.abierto .nav button.n{padding:15px 0;border-bottom:1px solid var(--linea);width:100%;justify-content:space-between;font-size:13px}
  .cab.abierto .nav a.n:after{display:none}
  .sub{position:static;transform:none;width:auto;opacity:1;visibility:visible;box-shadow:none;border:0;background:transparent;padding:4px 0 8px;grid-template-columns:1fr;display:none}
  .nav li.abre .sub{display:grid}
  .nav li:hover .fl{transform:none} .nav li.abre .fl{transform:rotate(180deg)}
  .heroe-in{grid-template-columns:1fr;padding:56px 36px 40px}
  .escena{min-height:320px}
  .franja-c{grid-template-columns:1fr 1fr}
  .franja-c div:nth-child(2){border-right:0}
  .franja-c div:nth-child(-n+2){border-bottom:1px solid var(--linea)}
  .prods{grid-template-columns:1fr 1fr}
  .prod,.prods.cinco .prod:nth-child(4),.prods.cinco .prod:nth-child(5){grid-column:span 1}
  .galeria{grid-template-columns:1fr 1fr}
  .cot,.nos,.contacto,.pr-heroe{grid-template-columns:1fr}
  .wa{position:static}
  .pasos{grid-template-columns:1fr 1fr}
  .notas,.ficha,.cifras{grid-template-columns:1fr 1fr}
  .pie .env{grid-template-columns:1fr 1fr}
  .llamado{grid-template-columns:1fr;padding:46px 36px}
  .pg-cab .mono-fondo{width:300px;right:-90px}
}
@media (max-width:640px){
  .ap.izq,.ap.der{transform:translateY(30px)}
  section.blq{padding:76px 0}
  .heroe{padding:20px 0 60px}
  .acrilico{border-radius:22px}
  .heroe-in{padding:44px 26px 30px}
  .heroe p.lead,.pg-cab p.lead{font-size:16.5px}
  .acc .btn{flex:1 1 100%}
  .franja-c div{padding:18px}
  .franja-c b{font-size:19px}
  .cabeza{flex-direction:column;align-items:flex-start;margin-bottom:30px}
  .prods,.pasos,.pasos.tres,.valores,.notas,.ficha,.cifras{grid-template-columns:1fr}
  .galeria{grid-auto-rows:150px}
  .form{padding:24px 20px}
  .campo{grid-template-columns:1fr}
  .foto-l img{height:380px}
  .contacto .info{padding:36px 24px}
  .mapa{min-height:320px}
  .pie{padding-bottom:100px}
  .pie .env{grid-template-columns:1fr}
  .marca b{font-size:17px}
  .pr-heroe .vis{height:300px}
  .pr-heroe .vis .pz{scale:1.1}
  .llamado{padding:38px 24px}
  .articulo p,.articulo li{font-size:17px}
  .portada-art{height:220px}
  .pg-cab{padding:44px 0 50px}
}