/* Atelier · Henequén. Hacienda yucateca: cal, piedra, añil y mosaico de pasta.
   Una sola luz: viene de arriba a la izquierda. El acabado protagonista es la cal con su sombra. */
.inv[data-theme="at-henequen"]{
  --at-papel:#F4EEE3; --at-fondo:#F1EBDF; --at-tinta:#1F2A3D; --at-tenue:#68655D; --at-acento:#24407A; --at-linea:rgba(31,42,61,.2);
  --at-fd:'Marcellus SC'; --at-ft:'Cormorant Garamond';
  --anil:#24407A; --ocre:#A9772F; --agave:#5B7B6A; --cal:#F1EBDF; --piedra:#D6C9B2; --piedra2:#C2B398; --madera:#4B301F;
  font-weight:500; font-size:18px; line-height:1.6;
}
/* Muro de cal: fotografía de aplanado de cal (neutra) teñida con el color cal, en teja espejada 2×2 que se repite sin costuras
   y corre con el contenido (nunca fija al viewport: el contenido parecería flotar sobre ella). */
.hq{position:relative;isolation:isolate;background:
  url(/img/texturas/henequen-cal-teja.jpg) calc(50% + 230px) 370px/min(163%,1130px) auto repeat,
  url(/img/texturas/henequen-cal-teja.jpg) center top/min(200%,1400px) auto repeat,#FCF5E6;
  background-blend-mode:multiply,multiply,normal}

/* ---------- Apertura: portón ---------- */
.hq-op{background:var(--cal);color:var(--at-tinta)}
.hq-op .at-skip{background:rgba(241,235,223,.92);opacity:1;color:var(--anil);font-family:'Marcellus SC',serif;box-shadow:0 0 0 1px rgba(36,64,122,.25)}
.hq-muro{position:absolute;inset:0;background:
  radial-gradient(70% 45% at 50% 30%,rgba(255,250,238,.85),transparent 70%),
  radial-gradient(80% 50% at 10% 90%,rgba(196,180,152,.28),transparent 70%),
  radial-gradient(60% 40% at 95% 70%,rgba(196,180,152,.22),transparent 70%),var(--cal)}
.hq-escena{--pw:min(70vw,300px,calc((69vh - 150px) * 118 / 169));position:absolute;left:0;right:0;bottom:calc(31vh - 10px);z-index:2;display:grid;justify-items:center;gap:22px;padding:0 24px}
.hq-arriba{display:grid;gap:12px;justify-items:center;text-align:center}
.hq-op .at-para{font-family:'Marcellus SC',serif;font-size:12px;letter-spacing:.3em;color:var(--anil);opacity:1}
.hq-op .at-para strong{font-weight:400}
.hq-piso{position:absolute;left:-40%;right:-40%;bottom:0;height:31vh;z-index:1;transform-origin:50% 0;transform:perspective(520px) rotateX(56deg);
  -webkit-mask:linear-gradient(180deg,rgba(0,0,0,.5),#000 30%);mask:linear-gradient(180deg,rgba(0,0,0,.5),#000 30%)}
.hq-piso svg{display:block;filter:saturate(.85)}
.hq-piso::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(60,45,30,.35),rgba(60,45,30,0) 40%)}
/* Arco de cantera reutilizable */
.hq-arco{position:relative;width:100%;filter:drop-shadow(0 18px 18px rgba(70,52,30,.28))}
.hq-hueco{position:absolute;overflow:hidden;background:#D9CBB2}
.hq-hueco > img{width:100%;height:100%;object-fit:cover;filter:saturate(.9) contrast(1.02)}
.hq-cantera{position:absolute;inset:0;width:100%;height:100%;z-index:4;pointer-events:none;overflow:visible}
.hq-umbral{display:block;width:calc(var(--pw) + 34px);height:12px;margin-top:-22px;background:linear-gradient(180deg,#DCCFB8,#C3B293);box-shadow:0 1px 0 rgba(80,62,40,.4),0 14px 22px -6px rgba(60,45,30,.45);border-radius:1px;position:relative;z-index:1}
.hq-porton{width:var(--pw)}
.hq-porton .hq-hueco{perspective:1100px;background:#2a1d14;box-shadow:inset 0 18px 30px rgba(0,0,0,.35)}
.hq-luz{position:absolute;inset:0;z-index:0;background:
  radial-gradient(55% 34% at 50% 34%,#FFFDF6,rgba(255,248,230,.75) 50%,transparent 80%),
  linear-gradient(180deg,#F6EEDC 0%,#EFE2C8 58%,#D9C4A0 59%,#CDB58F 100%)}
.hq-patio{position:absolute;inset:0;width:100%;height:100%;opacity:.9}
.hq-luz::after{content:"";position:absolute;left:0;right:0;bottom:0;height:41%;opacity:.55;
  background:repeating-linear-gradient(90deg,rgba(36,64,122,.35) 0 1px,transparent 1px 18%),repeating-linear-gradient(0deg,rgba(36,64,122,.3) 0 1px,transparent 1px 22%);transform:perspective(160px) rotateX(48deg);transform-origin:50% 0}
.hq-hoja{position:absolute;top:0;bottom:0;width:50%;z-index:1;transition:transform 1.9s var(--ease-papel) .7s,filter 1.9s var(--ease-papel) .7s;
  background:
    repeating-linear-gradient(90deg,rgba(20,10,4,.55) 0 1.5px,rgba(255,220,180,.06) 1.5px 2.5px,transparent 2.5px 33.333%),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='120' height='400'><filter id='v'><feTurbulence type='fractalNoise' baseFrequency='.012 .28' numOctaves='3' seed='4'/><feColorMatrix values='0 0 0 0 .16  0 0 0 0 .09  0 0 0 0 .04  0 0 0 .55 0'/></filter><rect width='100%' height='100%' filter='url(%23v)'/></svg>") 0 0/120px 400px,
    linear-gradient(180deg,#6A4630,#553621 55%,#47301F)}
.hq-pintura{position:absolute;inset:0;background:linear-gradient(180deg,#6F7D93 0%,#5A6A84 36%,#4C5C78 70%,#43526C);opacity:.96;
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='400'><filter id='m'><feTurbulence type='fractalNoise' baseFrequency='.06 .16' numOctaves='4' seed='9'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 2.6 0 -.58'/><feComponentTransfer><feFuncA type='discrete' tableValues='0 1 1 1 1 1 1 1'/></feComponentTransfer></filter><rect width='100%' height='100%' filter='url(%23m)'/></svg>") 0 0/200px 400px;
  mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='400'><filter id='m'><feTurbulence type='fractalNoise' baseFrequency='.06 .16' numOctaves='4' seed='9'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 2.6 0 -.58'/><feComponentTransfer><feFuncA type='discrete' tableValues='0 1 1 1 1 1 1 1'/></feComponentTransfer></filter><rect width='100%' height='100%' filter='url(%23m)'/></svg>") 0 0/200px 400px}
.hq-pintura::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.14),transparent 30%,transparent 75%,rgba(20,20,30,.22)),repeating-linear-gradient(90deg,rgba(255,255,255,.03) 0 3px,transparent 3px 7px)}
.hq-pintura::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,rgba(0,0,0,.35) 0 1.5px,transparent 1.5px 33.333%),url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='120' height='400'><filter id='v'><feTurbulence type='fractalNoise' baseFrequency='.012 .28' numOctaves='3' seed='4'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 .1  0 0 0 .35 0'/></filter><rect width='100%' height='100%' filter='url(%23v)'/></svg>") 0 0/120px 400px}
.hq-izq{left:0;transform-origin:0 50%;box-shadow:inset -10px 0 14px -10px rgba(0,0,0,.6),inset 6px 0 10px -8px rgba(255,220,180,.12)}
.hq-der{right:0;transform-origin:100% 50%;box-shadow:inset 10px 0 14px -10px rgba(0,0,0,.6)}
.hq-cincho{position:absolute;left:0;right:0;height:12px;transform:translateY(-50%);
  background:radial-gradient(circle at 50% 45%,#8b8279 0 1.2px,#2b2622 1.8px 3.4px,transparent 3.8px) 0 0/24px 12px repeat-x,
    linear-gradient(180deg,#3a3430,#1c1916 55%,#2a2522);box-shadow:0 2px 3px rgba(0,0,0,.45)}
.hq-tablero{position:absolute;left:15%;right:15%;height:23%;border-radius:2px;
  box-shadow:inset 1px 1px 0 rgba(255,220,180,.12),inset -1px -1px 0 rgba(0,0,0,.35),inset 0 0 0 6px rgba(0,0,0,.08),inset 7px 7px 0 rgba(255,220,180,.06),inset -7px -7px 0 rgba(0,0,0,.18)}
.hq-toca{position:absolute;z-index:3;left:50%;top:44%;width:62px;padding:0;border:0;background:none;transform:translateX(-50%);cursor:pointer;transition:opacity .4s}
.hq-aldaba{display:block;width:100%;height:auto;filter:drop-shadow(1px 3px 2px rgba(0,0,0,.6))}
.hq-anillo{transform-origin:30px 18px}
.hq-toca:hover .hq-anillo{transform:translateY(-1px)}
.hq-pista{margin:0;font:italic 500 20px/1 'Cormorant Garamond',serif;color:var(--at-tenue)}
.hq-op.is-opening .hq-anillo{animation:hq-toc .38s cubic-bezier(.3,0,.2,1) 2}
.hq-op.is-opening .hq-izq{transform:rotateY(96deg);filter:brightness(.55)}
.hq-op.is-opening .hq-der{transform:rotateY(-96deg);filter:brightness(.55)}
.hq-op.is-opening .hq-toca{opacity:0;transition-delay:.7s}
.hq-op.is-opening .hq-pista,.hq-op.is-opening .at-para,.hq-op.is-opening .at-skip{opacity:0;transition:opacity .6s .6s}
.hq-op.is-opening .hq-luz{animation:hq-sol 2.6s var(--ease-papel) .9s both}
/* Segundo acto: la cámara cruza el umbral. La escena crece desde el hueco del portón, el piso se queda atrás
   y la luz del patio lo inunda todo antes de que aparezca la portada. */
.hq-op.is-opening .hq-escena{transform-origin:50% 62%;animation:hq-entrar 2.3s cubic-bezier(.55,0,.25,1) 1.5s both}
.hq-op.is-opening .hq-piso{animation:hq-piso 2.3s cubic-bezier(.55,0,.25,1) 1.5s both}
.hq-op.is-opening .hq-patio{animation:hq-patio 2.6s cubic-bezier(.55,0,.25,1) 1.5s both}
.hq-op.is-opening .hq-muro{animation:hq-muro 2s ease-in 1.8s both}
.hq-op.is-opening::after{content:"";position:absolute;inset:0;z-index:4;pointer-events:none;background:radial-gradient(60% 50% at 50% 42%,#FFFDF6,#F8F0DE 60%,#F1EBDF);opacity:0;animation:hq-blanco 1.1s ease-in 2.7s forwards}
@keyframes hq-toc{0%,100%{transform:none}45%{transform:translateY(-4px) scale(1,.84)}}
@keyframes hq-sol{to{filter:brightness(1.18) saturate(1.05)}}
@keyframes hq-entrar{to{transform:translateY(12vh) scale(4.2)}}
@keyframes hq-piso{to{transform:perspective(520px) rotateX(56deg) translateY(60%);opacity:0}}
@keyframes hq-patio{to{transform:scale(1.35) translateY(-4%)}}
@keyframes hq-muro{to{filter:brightness(1.15)}}
@keyframes hq-blanco{to{opacity:1}}
@media (prefers-reduced-motion:reduce){.hq-op.is-opening .hq-escena,.hq-op.is-opening .hq-piso,.hq-op.is-opening .hq-patio,.hq-op.is-opening::after{animation:none}}

/* ---------- Portada ---------- */
/* La portada deja asomar la clave del arco al pie de la primera pantalla: invita a bajar hacia la ventana. */
.hq-portada{position:relative;min-height:84vh;min-height:84svh;display:grid;place-items:center;padding:60px max(10vw,30px) 36px;text-align:center;overflow:hidden}
.hq-sombra{position:absolute;inset:-10% -30%;pointer-events:none;opacity:.55;mix-blend-mode:multiply;
  -webkit-mask:linear-gradient(180deg,#000 55%,transparent 88%);mask:linear-gradient(180deg,#000 55%,transparent 88%);
  transform:translate(calc(var(--tx) * 18px),calc(var(--ty) * 10px)) skewX(-14deg);transition:transform .2s linear;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 500' preserveAspectRatio='none'><filter id='b'><feGaussianBlur stdDeviation='14'/></filter><path filter='url(%23b)' fill='%239c8a6c' fill-opacity='.32' fill-rule='evenodd' d='M0 0h400v500H0z M120 500V230a80 80 0 0 1 160 0v270z'/></svg>") center/100% 100% no-repeat}
.hq-pin{position:relative;z-index:1;width:100%;max-width:560px}
.hq-eb{margin:0;font:400 13px/1.3 'Marcellus SC',serif;letter-spacing:.32em;color:var(--anil)}
.hq-nombres{margin:22px 0 0;font:400 clamp(46px,14.2vw,92px)/.98 'Marcellus SC',serif;letter-spacing:.05em;color:var(--at-tinta);text-wrap:balance}
.hq-nombres span{display:block}
.hq-nombres em{display:block;margin:.16em 0 .1em;font:italic 500 .46em/1 'Cormorant Garamond',serif;letter-spacing:0;color:var(--anil)}
.hq-fecha{margin:28px 0 0;font:italic 500 25px/1.35 'Cormorant Garamond',serif;color:var(--at-tinta)}
.hq-lugar{margin:12px auto 0;max-width:30ch;font:400 13px/1.7 'Marcellus SC',serif;letter-spacing:.22em;color:var(--at-tenue)}
.hq-horal{margin:14px 0 0;font:italic 500 20px/1.3 'Cormorant Garamond',serif;color:var(--at-tenue)}
.hq-para{margin:0 auto;padding:0 max(10vw,30px) 56px;max-width:560px;text-align:center;font:italic 500 21px/1.4 'Cormorant Garamond',serif;color:var(--anil)}
/* La ventana: arco de cantera (PNG) a casi todo el alto del teléfono, con la foto de la pareja en el hueco. */
.hq-ventana{margin:0 auto;padding:0 0 72px;width:min(94vw,480px,calc((100svh - 40px) * 1024 / 1536))}

/* ---------- Marco de cantera (raster) ----------
   Piedra en ::after por encima de la foto; la sombra que la piedra arroja sobre el muro en ::before, sin filter.
   Hueco del PNG: x 20.4 % a 79.5 %, y desde 15.8 %. La foto se mete bajo la piedra un poco por cada lado. */
.hq-marco{position:relative;width:100%;aspect-ratio:1024/1536;isolation:isolate}
.hq-marco::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:url(/img/texturas/henequen-arco.png) center/100% 100% no-repeat}
.hq-marco::before{content:"";position:absolute;inset:3% 5% 1.5%;z-index:-1;pointer-events:none;border-radius:50% 50% 2px 2px/30% 30% 2px 2px;
  box-shadow:0 24px 40px -4px rgba(70,52,30,.34),8px 10px 18px rgba(70,52,30,.16)}
.hq-marco-f{position:absolute;left:19.6%;right:19.6%;top:15%;bottom:1.4%;overflow:hidden;background:#D9CBB2;border-radius:50% 50% 0 0/24.2% 24.2% 0 0}
.hq-marco-f > img{display:block;width:100%;height:100%;object-fit:cover}

/* ---------- Remate de hierro forjado (PNG) ----------
   La sombra es la misma silueta en tono tierra, desplazada hacia abajo a la derecha (la luz viene de arriba a la izquierda). */
.hq-remate{position:relative;display:block;width:min(66vw,300px);aspect-ratio:1100/397;margin:0 auto 30px;isolation:isolate;
  background:url(/img/texturas/henequen-hierro.png) center/100% 100% no-repeat}
.hq-remate::before{content:"";position:absolute;inset:0;z-index:-1;transform:translate(3px,6px);background:rgba(70,52,30,.26);
  -webkit-mask:url(/img/texturas/henequen-hierro.png) center/100% 100% no-repeat;mask:url(/img/texturas/henequen-hierro.png) center/100% 100% no-repeat}
/* Agave en grabado (PNG): se usa como marca de agua grande en el cierre. */
.hq-agave{position:absolute;pointer-events:none;background:url(/img/texturas/henequen-agave.png) center bottom/contain no-repeat}

/* ---------- Patios ----------
   Cada patio ocupa todo el ancho con su material; dentro, .hq-sec acota el texto. */
.hq-patio{position:relative;isolation:isolate}
.hq-sec{position:relative;max-width:600px;margin:0 auto;padding:96px max(10vw,32px);text-align:center}
.hq-ancho .hq-sec{max-width:900px}
.hq-breve .hq-sec{padding-top:56px;padding-bottom:56px}
.hq-h{margin:0 0 40px}
.hq-k{margin:0;font:400 13px/1.5 'Marcellus SC',serif;letter-spacing:.28em;color:var(--anil)}
.hq-t{margin:12px 0 0;font:italic 500 clamp(36px,9.4vw,52px)/1.05 'Cormorant Garamond',serif;letter-spacing:-.01em;color:var(--at-tinta);text-wrap:balance}
.hq-k2{margin:0 0 8px;font:400 13px/1.5 'Marcellus SC',serif;letter-spacing:.22em;color:var(--ocre)}
.hq-intro{margin:26px auto 0;max-width:32ch}
.hq .at-link{color:var(--anil);font-family:'Marcellus SC',serif;font-size:13px;letter-spacing:.24em;border-bottom-color:rgba(36,64,122,.45)}

/* Cal: el muro base (la textura fija de la página). Dos patios de cal seguidos se separan con un rombo de forja. */
.hq-cal + .hq-cal .hq-sec::before{content:"";position:absolute;top:0;left:50%;width:9px;height:9px;background:var(--ocre);transform:translate(-50%,-50%) rotate(45deg);
  box-shadow:-34px 34px 0 -3px rgba(36,64,122,.55),34px -34px 0 -3px rgba(36,64,122,.55)}

/* Corredor: fotografía de la hacienda a todo lo ancho. Un velo oscuro en ::before (queda sobre la foto y bajo el texto). */
.hq-corredor{min-height:min(88svh,760px);display:grid;align-items:end;color:#F4EEE3;
  background:url(/img/texturas/henequen-corredor.jpg) 50% 35%/cover #4A3F30}
.hq-corredor::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(180deg,rgba(24,20,14,.28),rgba(24,20,14,0) 35%,rgba(24,20,14,.08) 55%,rgba(24,20,14,.72) 100%)}
.hq-corredor .hq-sec{padding-top:min(42svh,360px);padding-bottom:72px}
.hq-corredor blockquote{margin:0}
.hq-corredor blockquote p{margin:0;font:italic 500 clamp(28px,7.4vw,40px)/1.28 'Cormorant Garamond',serif;color:#FBF6EA;text-wrap:balance;text-shadow:0 2px 24px rgba(0,0,0,.45)}
.hq-corredor cite{display:block;margin-top:20px;font:400 13px/1.3 'Marcellus SC',serif;letter-spacing:.26em;font-style:normal;color:rgba(244,238,227,.78)}
.hq-corredor .hq-intro{color:rgba(251,246,234,.9);font-size:19px;text-shadow:0 1px 14px rgba(0,0,0,.4)}

/* Pasta: el piso de mosaico fotográfico. La cuenta va en una placa de cantera apoyada encima. */
.hq-pasta{background:url(/img/texturas/henequen-pasta-teja.jpg) center top/min(100%,640px) auto repeat #D9CDB8}
.hq-pasta::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(80% 60% at 50% 45%,rgba(255,250,240,.08),rgba(40,30,18,.22) 100%)}
.hq-pasta .hq-sec{padding:72px max(6vw,20px)}
.hq-placa{position:relative;isolation:isolate;margin:0 auto;max-width:460px;padding:44px 8% 40px;color:var(--at-tinta);
  background:url(/img/texturas/henequen-cal.jpg) center/cover,#E8DCC6;background-blend-mode:multiply;
  box-shadow:inset 0 0 0 1px rgba(80,62,40,.28),inset 0 0 0 7px rgba(255,250,240,.35),inset 0 0 0 8px rgba(80,62,40,.22),
    inset 0 2px 0 rgba(255,255,255,.55),inset 0 -3px 0 rgba(80,62,40,.25),0 2px 2px rgba(40,30,18,.35),0 30px 40px -18px rgba(40,30,18,.6)}
.hq-placa p:last-child{margin:0}
.hq-placa .hq-k{color:var(--anil)}
.hq-cd{display:flex;justify-content:center;gap:clamp(18px,6vw,44px);margin:18px 0 26px}
.hq-cd .cdu{display:grid;gap:6px}
.hq-cd b{font:400 clamp(42px,12vw,64px)/1 'Marcellus SC',serif;font-variant-numeric:lining-nums tabular-nums;color:var(--at-tinta);text-shadow:0 1px 0 rgba(255,255,255,.5)}
.hq-cd small{font:italic 500 17px/1 'Cormorant Garamond',serif;color:var(--at-tenue)}

/* Familias sobre cal limpia */
.hq-papas{display:grid;gap:30px;margin:0 0 44px}
@media (min-width:600px){.hq-papas{grid-template-columns:1fr 1fr}.hq-papas:has(> :only-child){grid-template-columns:1fr}}
.hq-papa{margin:0;font-size:22px;line-height:1.35;text-wrap:balance}
.hq-padrinos{columns:2;column-gap:22px;margin:0;padding:28px 0 0;border-top:1px solid var(--at-linea);text-align:center}
.hq-padrinos:has(> div:only-child){columns:1}
.hq-padrinos div{break-inside:avoid;margin:0 0 22px}
.hq-padrinos dt{font:400 13px/1.5 'Marcellus SC',serif;letter-spacing:.18em;color:var(--anil);margin-bottom:4px}
.hq-padrinos dd{margin:0;font-size:19px;line-height:1.35}

/* Añil: la misma cal, teñida de azul profundo. Todo lo que va encima pasa a tono cal. */
.hq-anil{color:#F1EBDF;--at-tinta:#F1EBDF;--at-tenue:rgba(241,235,223,.72);--at-linea:rgba(241,235,223,.26);
  background:url(/img/texturas/henequen-cal.jpg) center/cover,#1F3A74;background-blend-mode:multiply}
.hq-anil::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(90% 50% at 30% 0%,rgba(255,240,210,.12),transparent 60%),linear-gradient(180deg,rgba(10,18,40,.25),transparent 18%,transparent 82%,rgba(10,18,40,.35))}
.hq-anil .hq-k,.hq-anil .hq-k2{color:#D9B36A}
.hq-anil .hq-t,.hq-anil h3{color:#F7F2E8}
.hq-anil .at-link{color:#F1EBDF;border-bottom-color:rgba(241,235,223,.5)}
.hq-nichos{display:grid;gap:64px}
.hq-anil .hq-marco::before{box-shadow:0 26px 40px -4px rgba(0,0,0,.55),8px 10px 18px rgba(0,0,0,.3)}
.hq-nicho-f{width:min(78vw,320px);margin:0 auto 24px}
.hq-nicho h3{margin:0;font:400 clamp(26px,7vw,32px)/1.15 'Marcellus SC',serif;letter-spacing:.03em}
.hq-hora{margin:10px 0 0;font-style:italic;font-size:21px;color:#D9B36A}
.hq-dir{margin:6px auto 18px;max-width:30ch;color:var(--at-tenue);font-size:17px}

/* Fibra: tela de henequén; encima, una tarjeta de algodón desbarbada (PNG) con el programa. */
.hq-fibra{background:url(/img/texturas/henequen-fibra-teja.jpg) center/150px auto repeat,#F4ECDA;background-blend-mode:multiply}
.hq-fibra::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,rgba(60,45,30,.16),rgba(240,228,205,.18) 20%,rgba(240,228,205,.18) 80%,rgba(60,45,30,.16))}
.hq-fibra .hq-sec{padding:72px max(5vw,16px)}
.hq-tarjeta{position:relative;isolation:isolate;max-width:480px;margin:0 auto;padding:16% 13% 17%;color:var(--at-tinta);background:none}
.hq-tarjeta::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:url(/img/texturas/tarjeta-algodon.png) center/100% 100% no-repeat}
.hq-tarjeta::before{content:"";position:absolute;inset:8% 10%;z-index:-2;border-radius:10px;box-shadow:0 24px 46px 2px rgba(60,45,30,.36),0 6px 14px rgba(60,45,30,.14)}
.hq-tarjeta .hq-h{margin-bottom:28px}
.hq-tarjeta .hq-t{font-size:clamp(32px,8.6vw,44px)}
.hq-prog{list-style:none;margin:0;padding:0;text-align:left}
.hq-prog li{display:grid;grid-template-columns:86px 1fr;gap:14px;align-items:baseline;padding:14px 0;border-bottom:1px solid var(--at-linea)}
.hq-prog li:last-child{border-bottom:0}
.hq-ph{font:400 15px/1.2 'Marcellus SC',serif;letter-spacing:.06em;color:var(--anil);font-variant-numeric:lining-nums tabular-nums;white-space:nowrap}
.hq-pd strong{display:block;font-weight:600;font-size:19px;line-height:1.3}
.hq-pd small{display:block;margin-top:2px;font-style:italic;font-size:16px;color:var(--at-tenue)}

/* Lino: la tela del traje, en crudo. Las muestras de color son retazos con su pespunte. */
.hq-lino{background:url(/img/texturas/lino-teja.jpg) center/320px auto repeat,#F6F1E6;background-blend-mode:multiply}
.hq-lino::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,rgba(246,241,232,.62),rgba(246,241,232,.5) 16%,rgba(246,241,232,.5) 84%,rgba(246,241,232,.62))}
.hq-lino .hq-nota{color:var(--at-tinta)}
.hq-retazos{max-width:34ch;margin:0 auto}
.hq-retazos p{margin:0 0 20px}
.hq-lino .at-sw{gap:14px;margin:8px 0 22px}
.hq-lino .at-sw i{width:38px;height:38px;border-radius:4px;transform:rotate(-3deg);box-shadow:inset 0 0 0 1px rgba(0,0,0,.12),0 2px 4px rgba(60,45,30,.3);outline:1px dashed rgba(255,250,240,.75);outline-offset:-5px}
.hq-lino .at-sw i:nth-child(2n){transform:rotate(2.5deg)}
.hq-nota{font-style:italic;color:var(--at-tenue);font-size:17px}

/* Arcada sobre cal */
.hq-arcada{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.hq .hq-arcada .gal-i{aspect-ratio:3/4;border-radius:50% 50% 0 0/36% 36% 0 0;box-shadow:0 0 0 5px var(--piedra),0 0 0 6px rgba(80,62,40,.3)}
@media (min-width:760px){.hq-arcada{grid-template-columns:repeat(3,1fr);gap:26px}}

/* Madera: mesa de mezquite; las opciones de regalo son papeles de fibra puestos encima, apenas girados. */
.hq-madera{color:#F1EBDF;--at-tenue:rgba(241,235,223,.72);background:url(/img/texturas/henequen-madera.jpg) center/cover #3B2A1E}
.hq-madera::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(90% 60% at 50% 30%,rgba(255,220,170,.06),transparent 70%),linear-gradient(180deg,rgba(0,0,0,.58),rgba(0,0,0,.42) 26%,rgba(0,0,0,.22) 50%,rgba(0,0,0,.22) 80%,rgba(0,0,0,.45))}
.hq-madera .hq-k{color:#D9B36A}
.hq-madera .hq-t{color:#F7F2E8}
.hq-madera .hq-intro{color:#FAF5EA;font-size:19px;line-height:1.55;text-shadow:0 1px 2px rgba(0,0,0,.7),0 0 22px rgba(0,0,0,.55)}
.hq-madera .hq-t{text-shadow:0 1px 2px rgba(0,0,0,.6),0 0 24px rgba(0,0,0,.5)}
.hq-mesa{display:grid;gap:26px;margin-top:40px}
.hq-papel{position:relative;padding:30px 10% 32px;color:var(--at-tinta);--at-tenue:#68655D;--at-linea:rgba(31,42,61,.2);transform:rotate(-.8deg);
  background:url(/img/texturas/papel-fibra.jpg) center/cover,#F6F0E3;background-blend-mode:multiply;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.35),0 1px 1px rgba(0,0,0,.4),0 16px 26px -10px rgba(0,0,0,.7)}
.hq-papel:nth-child(2n){transform:rotate(.7deg)}
.hq-papel p{margin:6px 0 0}
.hq-papel .at-link{color:var(--anil)}
.hq-madera .at-clabe .copy{box-shadow:inset 0 0 0 1px rgba(31,42,61,.3)}

/* Hospedaje y notas sobre cal */
.hq-hoteles{display:grid;gap:36px}
.hq-hotel h3{margin:0 0 6px;font:400 22px/1.2 'Marcellus SC',serif}
.hq-hotel p{margin:4px 0 10px}
.hq-notas{list-style:none;margin:0;padding:0;display:grid;gap:10px;font-style:italic;font-size:20px}
.hq-tag{margin:10px 0 0;font:400 clamp(26px,7vw,34px)/1.2 'Marcellus SC',serif;letter-spacing:.06em;color:var(--anil)}

/* Confirmación: talón de algodón (PNG) sobre el muro de añil. */
.hq-rsvp .hq-sec{padding:80px max(5vw,16px) 96px}
/* El talón es un pliego de papel de algodón de corte recto (más alto que la tarjeta desbarbada del programa), clavado al muro. */
.hq-talon{position:relative;max-width:480px;margin:0 auto;padding:52px 9% 56px;color:#1F2A3D;--at-tinta:#1F2A3D;--at-tenue:#68655D;--at-linea:rgba(31,42,61,.2);--at-papel:#F7F2E8;
  background:linear-gradient(rgba(252,248,240,.55),rgba(252,248,240,.55)),url(/img/texturas/papel-crema-teja.jpg) center top/700px auto repeat,#F8F3E8;background-blend-mode:normal,multiply,normal;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.5),0 1px 1px rgba(0,0,0,.45),0 30px 50px -16px rgba(0,0,0,.65)}
/* Los campos llevan su propia caja de papel más claro: sobre textura, una sola línea inferior se pierde. */
.inv[data-theme="at-henequen"] .hq-talon .fld input,.inv[data-theme="at-henequen"] .hq-talon .fld select,.inv[data-theme="at-henequen"] .hq-talon .fld textarea{
  padding:11px 14px;background:rgba(255,253,248,.72);border:1px solid rgba(31,42,61,.22);border-radius:2px;box-shadow:inset 0 1px 2px rgba(60,45,30,.08)}
.inv[data-theme="at-henequen"] .hq-talon .fld select{background-position:calc(100% - 16px) 55%,calc(100% - 11px) 55%}
.inv[data-theme="at-henequen"] .hq-talon .fld input:focus,.inv[data-theme="at-henequen"] .hq-talon .fld select:focus,.inv[data-theme="at-henequen"] .hq-talon .fld textarea:focus{border-color:var(--anil);box-shadow:0 0 0 1px var(--anil),inset 0 1px 2px rgba(60,45,30,.08)}
.inv[data-theme="at-henequen"] .hq-talon .fld > span{color:#4A4A48}
.inv[data-theme="at-henequen"] .hq-talon .seg{background:rgba(255,253,248,.72);box-shadow:inset 0 0 0 1px rgba(31,42,61,.22)}
.inv[data-theme="at-henequen"] .hq-talon .rsvp{gap:18px}
.hq-talon::before,.hq-talon::after{content:"";position:absolute;top:14px;width:10px;height:10px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#8a847c,#2b2622 70%);box-shadow:0 1px 2px rgba(0,0,0,.6)}
.hq-talon::before{left:14px}.hq-talon::after{right:14px}
.hq-talon .hq-k{color:var(--anil)}.hq-talon .hq-k2{color:var(--ocre)}.hq-talon .hq-t{color:#1F2A3D;font-size:clamp(32px,8.6vw,44px)}
.hq-talon .at-link{color:var(--anil)}
.hq-remate-talon{width:min(62%,250px);margin:0 auto 22px}
.hq .rsvp .btn{background:var(--anil);color:#F7F2E8;font-family:'Marcellus SC',serif;font-size:14px;letter-spacing:.16em}
.inv[data-theme="at-henequen"] .hq .seg input:checked + span{background:var(--anil);color:#F7F2E8}
.inv[data-theme="at-henequen"] .hq .seg span{font-size:17px}
.inv[data-theme="at-henequen"] .hq .fld > span{font-family:'Marcellus SC',serif;letter-spacing:.16em;font-size:13px}
.inv[data-theme="at-henequen"] .hq .fld input,.inv[data-theme="at-henequen"] .hq .fld select,.inv[data-theme="at-henequen"] .hq .fld textarea{font-size:17px}

/* Cierre: cal limpia con el agave en grabado (PNG) como emblema. */
.hq-cierre .hq-sec{padding:88px max(10vw,32px) 56px}
.hq-agave-cierre{position:relative;display:block;width:min(58vw,230px);aspect-ratio:1;margin:0 auto 6px;opacity:.9}
.hq-remate-cierre{width:min(52vw,220px);margin:0 auto 34px}
.hq-firma{margin:22px 0 14px;font:italic 500 clamp(32px,9vw,46px)/1.1 'Cormorant Garamond',serif;color:var(--anil)}
.inv[data-theme="at-henequen"] .inv-brand{padding-top:10px}

/* ---------- Apertura en video (póster del portón) ----------
   El póster es claro arriba (muro de cal) y oscuro al centro (portón) y abajo (mosaico): los nombres van en la franja de muro,
   arriba del arco; «Toca para abrir» y «Entrar» llevan fondo propio porque caen sobre el mosaico. */
.inv[data-template="henequen"] .opv{object-position:50% 0}
.inv[data-template="henequen"] .opv-ui{padding-top:max(22px,3.6vh);gap:2px}
.inv[data-template="henequen"] .opv-ui .op-to{font:400 13px/1.3 'Marcellus SC',serif;letter-spacing:.3em;color:#24407A;text-shadow:0 1px 0 rgba(255,250,240,.7)}
.inv[data-template="henequen"] .opv-ui .op-to strong{color:#1F2A3D;font-weight:400}
/* Remate de luz: Marcellus es ancha; cada nombre va en su renglón con la & entre ambos, y nunca se sale del ancho. */
.inv[data-template="henequen"] .opv-fin-n{font:400 clamp(30px,8.6vw,50px)/1.12 'Marcellus SC',serif;letter-spacing:.04em;max-width:100%;overflow-wrap:anywhere}
.inv[data-template="henequen"] .opv-fin-n .opv-fin-nm{display:block}
.inv[data-template="henequen"] .opv-fin-n .amp{display:block;margin:.02em 0;font-size:.55em;line-height:1;color:#24407A}
.inv[data-template="henequen"] .opv-n{margin-top:4px;font:400 clamp(26px,7.4vw,38px)/1.1 'Marcellus SC',serif;letter-spacing:.05em;color:#1F2A3D;text-shadow:0 1px 0 rgba(255,250,240,.75),0 0 18px rgba(248,240,226,.9)}
.inv[data-template="henequen"] .opv-tap{white-space:nowrap;background:rgba(244,238,227,.9);color:#24407A;font:400 13px/1 'Marcellus SC',serif;letter-spacing:.26em;text-transform:none;
  box-shadow:inset 0 0 0 1px rgba(36,64,122,.28),0 12px 30px -8px rgba(30,20,10,.65)}
.inv[data-template="henequen"] .opv-skip{min-height:40px;border-radius:999px;background:rgba(31,42,61,.62);color:#F4EEE3;font:400 12px/1 'Marcellus SC',serif;letter-spacing:.26em;text-transform:none;
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}