@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,700;1,400;1,600&family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;1,9..40,300&display=swap');

:root {
  /* ── Legacy tokens (kept for Gate/Hero/Countdown/Candle backward compat) ── */
  --silk: #FDFBF7;
  --cream: #F4EFE6;
  --aqua: #A8D0C6;
  --aqua-dim: rgba(168,208,198,0.25);
  --gold: #D4AF37;
  --gold-dim: rgba(212,175,55,0.18);
  --gold-glow: rgba(212,175,55,0.55);
  --gold-deep: #b8921e;
  --ink: #1E1608;
  --mid: #6B5B45;
  --radius-md: 14px;
  --radius-lg: 22px;
  --radius-pill: 100px;

  /* ── Canonical --ls-* Doctrine Tokens (COLOR-B) ── */
  --ls-ink:               #1A1208;
  --ls-ink-soft:          #3B2818;
  --ls-leather:           #5C3B24;
  --ls-leather-deep:      #2A1608;
  --ls-parchment:         #F4EAD4;
  --ls-parchment-soft:    #FAF4E6;
  --ls-parchment-deep:    #E3CEAA;
  --ls-gold:              #B98F4A;
  --ls-gold-soft:         #D8BE7A;
  --ls-gold-deep:         #7A551A;
  --ls-shadow-leather:    rgba(42, 22, 8, 0.16);
  --ls-shadow-leather-soft: rgba(42, 22, 8, 0.10);
  --ls-border-gold:       rgba(185, 143, 74, 0.34);
  --ls-border-gold-soft:  rgba(185, 143, 74, 0.22);
  --ls-candle:            rgba(216, 190, 122, 0.18);
  --ls-grain-opacity:     0.025;
  --ls-section-radius:    4px;
  --ls-card-radius:       3px;
  --ls-divider-height:    38px;
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior: smooth; width:100%; max-width:100%; overflow-x:hidden; }
body {
  width:100%; max-width:100%;
  background: var(--silk);
  font-family: 'DM Sans', sans-serif;
  color: var(--ink);
  overflow-x: hidden;
}
img { display:block; width:100%; height:100%; object-fit:cover; }

/* ── PARTICLES ── */
.particles { position:fixed; inset:0; width:100vw; max-width:100%; pointer-events:none; z-index:0; overflow:clip; contain:paint; }
.orb {
  position:absolute;
  border-radius:50%;
  background: radial-gradient(circle at 38% 35%, rgba(212,175,55,0.45), rgba(168,208,198,0.22) 40%, transparent 70%);
  filter: blur(22px);
  animation: floatOrb linear infinite;
  will-change: transform, opacity;
}
.orb:nth-child(1)  { width:130px;height:130px;left:8%;  animation-duration:20s;animation-delay:0s; }
.orb:nth-child(2)  { width:70px; height:70px; left:28%; animation-duration:26s;animation-delay:-6s; }
.orb:nth-child(3)  { width:180px;height:180px;left:52%; animation-duration:17s;animation-delay:-11s; }
.orb:nth-child(4)  { width:55px; height:55px; left:72%; animation-duration:29s;animation-delay:-3s; }
.orb:nth-child(5)  { width:210px;height:210px;left:84%; animation-duration:22s;animation-delay:-15s; }
.orb:nth-child(6)  { width:95px; height:95px; left:18%; animation-duration:18s;animation-delay:-8s; }
.orb:nth-child(7)  { width:150px;height:150px;left:44%; animation-duration:24s;animation-delay:-2s; }
.orb:nth-child(8)  { width:65px; height:65px; left:63%; animation-duration:19s;animation-delay:-13s; }
.orb:nth-child(9)  { width:115px;height:115px;left:3%;  animation-duration:23s;animation-delay:-18s; }
.orb:nth-child(10) { width:165px;height:165px;left:91%; animation-duration:27s;animation-delay:-7s; }
.orb:nth-child(11) { width:80px; height:80px; left:36%; animation-duration:21s;animation-delay:-4s; background:radial-gradient(circle,rgba(168,208,198,0.5),transparent 65%); }
.orb:nth-child(12) { width:120px;height:120px;left:58%; animation-duration:25s;animation-delay:-9s; }
@keyframes floatOrb {
  0%   { transform:translateY(108vh) scale(0.75); opacity:0; }
  8%   { opacity:1; }
  92%  { opacity:0.6; }
  100% { transform:translateY(-15vh) scale(1.15); opacity:0; }
}

/* ── GATE / SACRED BOOK ── */
#gate {
  position:fixed;inset:0;z-index:9999;
  width:100%;max-width:100vw;
  background:
    radial-gradient(ellipse 46% 44% at 50% 43%,rgba(217,189,122,0.18) 0%,rgba(42,26,14,0.20) 38%,transparent 70%),
    radial-gradient(ellipse 78% 68% at 50% 44%,#1C1208 0%,#120B06 48%,#050302 100%);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:0;cursor:default;
  transition:opacity 1.25s ease,visibility 1.25s ease;overflow:hidden;
  contain:layout paint size;
  overscroll-behavior:contain;
  -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
}
/* Gate fades to invisible first; .gate-dismissed is deferred in JS to avoid killing this transition */
#gate.open{opacity:0;visibility:hidden;pointer-events:none;}
/* gate-dismissed applied ~1250ms after .open so opacity transition can breathe */
#gate.gate-dismissed{display:none!important;}
#gate.is-opening .gate-tagline{opacity:.72;letter-spacing:.36em;}

#gate,#gate *,#gate svg,#gate path,.book-cover,.book-cover *,button,[role='button']{
  -webkit-tap-highlight-color:transparent;
}

#gate :focus-visible{
  outline:2px solid rgba(217,189,122,.92);
  outline-offset:6px;
}

/* Divine light behind the book */
.divine-rays{
  position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(ellipse 62% 46% at 50% 48%,rgba(247,240,222,0.10) 0%,rgba(217,189,122,0.08) 38%,transparent 72%),
    radial-gradient(ellipse 82% 70% at 50% 48%,rgba(217,189,122,0.10) 0%,transparent 68%);
  animation:raysPulse 5.8s ease-in-out infinite;
  overflow:hidden;
}
@keyframes raysPulse{0%,100%{opacity:.58;}50%{opacity:1;}}

.divine-rays::before{
  content:'';position:absolute;inset:-6%;
  background:repeating-conic-gradient(from 12deg at 50% 48%,rgba(217,189,122,0.035) 0deg 5deg,transparent 5deg 19deg);
  filter:blur(.2px);opacity:.42;animation:sacredRaysTurn 34s linear infinite;
}
@keyframes sacredRaysTurn{to{transform:rotate(360deg)}}

.divine-rays::after{
  content:'';position:absolute;
  inset:12% 10% 28%;
  background:radial-gradient(ellipse 44% 58% at 50% 34%,rgba(247,240,222,0.13),rgba(217,189,122,0.06) 42%,transparent 74%);
  filter:blur(18px);
  opacity:.86;
}

/* 3D book scene */
.book-scene{
  perspective:1400px;
  perspective-origin:50% 44%;
  display:flex;align-items:center;justify-content:center;
  width:min(92vw,430px);height:min(68vh,470px);
  max-width:100vw;overflow:visible;
  transform:none;
}
.book{
  --book-w: clamp(218px, 62vw, 286px);
  --book-h: clamp(310px, 78vw, 390px);
  position:relative;width:var(--book-w);height:var(--book-h);
  transform-style:preserve-3d;
  filter:drop-shadow(0 24px 70px rgba(0,0,0,0.72)) drop-shadow(0 0 42px rgba(185,143,74,0.22));
  animation:bookFloat 6.5s ease-in-out infinite;
  transition:transform 3s cubic-bezier(.18,.72,.12,1), filter 3s ease;
}
#gate.is-opening .book{animation:none;transform:translateY(-4px) rotateX(6deg) rotateZ(-1deg);filter:drop-shadow(0 30px 82px rgba(0,0,0,0.78)) drop-shadow(0 0 58px rgba(217,189,122,0.26));}
@keyframes bookFloat{
  0%,100%{transform:translateY(0) rotateX(2deg);}
  50%{transform:translateY(-10px) rotateX(0deg);}
}
.book-shadow{position:absolute;left:8%;right:2%;bottom:-22px;height:34px;background:radial-gradient(ellipse,rgba(0,0,0,.55),transparent 70%);filter:blur(10px);transform:translateZ(-32px);opacity:.72;}

/* Spine */
.book-spine{
  position:absolute;left:0;top:0;bottom:0;width:22px;
  background:linear-gradient(90deg,#0c0602 0%,#2F2116 28%,#5C3B24 54%,#1d1006 100%);
  border-radius:5px 0 0 5px;
  box-shadow:inset -5px 0 9px rgba(0,0,0,0.58), inset 2px 0 4px rgba(217,189,122,0.12);
  z-index:5;transform:translateZ(7px);
}
.book-spine::after{content:'';position:absolute;inset:12px 4px;border:1px solid rgba(217,189,122,0.28);border-radius:2px;}

/* Pages */
.book-pages{
  position:absolute;left:22px;top:4px;bottom:4px;right:0;
  background:
    linear-gradient(90deg,rgba(42,33,24,.2) 0%,transparent 12%,transparent 86%,rgba(42,33,24,.16) 100%),
    repeating-linear-gradient(0deg,#F7F0DE 0px,#F7F0DE 2px,#EFE3C8 3px,#f2e8d0 5px);
  border-radius:0 8px 8px 0;
  box-shadow:inset 10px 0 18px rgba(42,33,24,0.18), inset -5px 0 14px rgba(0,0,0,0.16), 0 0 0 1px rgba(185,143,74,0.14);
  display:flex;align-items:center;justify-content:center;
  transform:translateZ(0);
  overflow:hidden;
}
.book-pages::before{content:'';position:absolute;inset:14px 13px;border:1px solid rgba(185,143,74,.22);border-radius:0 7px 7px 0;pointer-events:none;}
.book-pages::after{content:'';position:absolute;left:0;top:0;bottom:0;width:30px;background:linear-gradient(90deg,rgba(42,33,24,.18),transparent);pointer-events:none;}
.page-depth{position:absolute;top:0;right:0;bottom:0;width:9px;background:repeating-linear-gradient(0deg,#d8cba9 0 2px,#f4ead1 2px 4px);opacity:.72;}
.book-pages-inner{
  position:relative;z-index:2;text-align:center;padding:26px 22px 24px 26px;
  opacity:.88;transform:translateX(-2px) translateY(2px) scale(.995);
  transition:opacity .42s ease,transform .62s cubic-bezier(.2,.68,.16,1),filter .42s ease;
  filter:contrast(.92) saturate(.94);
}
.book-pages-inner.show{opacity:1;transform:translateX(0) translateY(0) scale(1);filter:contrast(1) saturate(1);}
.verse-kicker{display:block;margin-bottom:12px;font-size:.56rem;letter-spacing:.34em;text-transform:uppercase;color:#B98F4A;}
.book-pages-inner p{
  font-family:'Playfair Display',serif;font-style:italic;
  font-size:clamp(.84rem,3.5vw,1.02rem);color:#2A2118;line-height:1.72;
  letter-spacing:0.015em;text-wrap:balance;text-shadow:0 1px 0 rgba(255,255,255,.55);
}

.book-inner-leaf{
  position:absolute;left:23px;top:7px;bottom:7px;width:calc(100% - 25px);
  border-radius:0 7px 7px 0;
  background:linear-gradient(100deg,rgba(239,227,200,.94),rgba(247,240,222,.72));
  transform-origin:left center;
  transform:rotateY(0deg) translateZ(5px);
  opacity:.16;z-index:2;pointer-events:none;
  box-shadow:inset 9px 0 20px rgba(42,33,24,.16);
  transition:transform 2.8s cubic-bezier(.18,.72,.12,1),opacity 1.2s ease;
}
#gate.is-opening .book-inner-leaf{transform:rotateY(-12deg) translateZ(8px);opacity:.62;}
#gate.verse-visible .book-inner-leaf{opacity:.32;}

/* Front cover */
.book-cover{
  position:absolute;inset:0;left:22px;
  background:
    radial-gradient(circle at 30% 16%,rgba(217,189,122,.10),transparent 32%),
    linear-gradient(135deg,#5C3B24 0%,#2F2116 33%,#160d05 58%,#3b2818 100%);
  border-radius:0 9px 9px 0;
  border:1px solid rgba(217,189,122,0.38);border-left:none;
  transform-origin:left center;transform-style:preserve-3d;
  transition:transform 2.85s cubic-bezier(.18,.72,.12,1),box-shadow 2.85s ease,filter 2.85s ease;
  cursor:pointer;z-index:6;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;
  padding:28px 22px;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.035), inset 12px 0 22px rgba(0,0,0,.32), 0 10px 28px rgba(0,0,0,.34);
  backface-visibility:visible;
  -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
  user-select:none;
  -webkit-user-select:none;
}
.book-cover::before{content:'';position:absolute;inset:10px;border:1px solid rgba(217,189,122,0.24);border-radius:0 6px 6px 0;pointer-events:none;}
.book-cover::after{content:'';position:absolute;inset:17px;border:1px solid rgba(217,189,122,0.12);border-radius:0 4px 4px 0;pointer-events:none;}
.book-cover.open,.book.is-open .book-cover{transform:rotateY(-154deg) translateZ(9px);box-shadow:16px 12px 35px rgba(0,0,0,.42), inset -9px 0 28px rgba(0,0,0,.44);filter:brightness(.82) saturate(.95);}
.book-cover:focus-visible{outline:2px solid rgba(217,189,122,.9);outline-offset:6px;box-shadow:0 0 0 6px rgba(185,143,74,.16), inset 12px 0 22px rgba(0,0,0,.32);}
.book-cover:hover{box-shadow:0 0 64px rgba(185,143,74,0.24),inset 0 0 34px rgba(217,189,122,0.07),inset 12px 0 22px rgba(0,0,0,.32);}
.cover-ornament{width:54px;height:76px;color:#D9BD7A;filter:drop-shadow(0 0 10px rgba(217,189,122,.45));}
.cover-ornament svg{width:100%;height:100%;overflow:visible;}
.cover-cross-mark path{fill:none;stroke-linecap:round;stroke-linejoin:round;}
.cover-cross-mark .cross-engrave{stroke:rgba(10,6,2,.62);stroke-width:8.2;filter:drop-shadow(0 1px 0 rgba(217,189,122,.16));}
.cover-cross-mark .cross-gold{stroke:#B98F4A;stroke-width:4.6;filter:drop-shadow(0 0 8px rgba(185,143,74,.42));}
.cover-cross-mark .cross-bevel{stroke:rgba(247,240,222,.34);stroke-width:1.3;opacity:.9;}
.cover-title{font-family:'Playfair Display',serif;font-style:italic;font-size:1.12rem;color:#D9BD7A;text-align:center;line-height:1.3;text-shadow:0 0 20px rgba(185,143,74,0.62);letter-spacing:0.04em;}
.cover-name{font-family:'Playfair Display',serif;font-style:italic;font-size:0.84rem;color:rgba(217,189,122,0.74);text-align:center;letter-spacing:0.06em;}
.cover-line{width:58px;height:1px;background:linear-gradient(90deg,transparent,#B98F4A,#D9BD7A,#B98F4A,transparent);}
.cover-hint{position:absolute;bottom:16px;left:0;right:0;text-align:center;font-size:0.48rem;letter-spacing:0.35em;text-transform:uppercase;color:rgba(217,189,122,0.58);animation:hintPulse 2.8s ease-in-out infinite;}
#gate.is-opening .cover-hint{opacity:0;animation:none;}
@keyframes hintPulse{0%,100%{opacity:.35;}50%{opacity:.95;}}

.book-edge-top,.book-edge-bottom{position:absolute;left:22px;right:0;height:4px;background:linear-gradient(90deg,#8b672f,#D9BD7A,#B98F4A,#f3d989,#8b672f);z-index:7;box-shadow:0 0 10px rgba(185,143,74,.22);}
.book-edge-top{top:0;border-radius:0 4px 0 0;}
.book-edge-bottom{bottom:0;border-radius:0 0 4px 0;}

.gate-tagline{margin-top:2rem;font-size:0.62rem;letter-spacing:0.32em;text-transform:uppercase;color:rgba(217,189,122,0.56);animation:taglinePulse 3.4s ease-in-out infinite;transition:opacity .7s ease,letter-spacing .7s ease;}
@keyframes taglinePulse{0%,100%{opacity:.38;}50%{opacity:.86;}}

@media(max-width:420px){.book-scene{height:430px}.book{--book-w:236px;--book-h:326px}.cover-title{font-size:1.02rem}.book-pages-inner{padding:22px 17px 21px 22px}.book-pages-inner p{font-size:.86rem}.verse-kicker{font-size:.5rem;letter-spacing:.28em}.gate-tagline{font-size:.54rem;letter-spacing:.24em}.cover-ornament{width:50px;height:72px}}
@media(prefers-reduced-motion:reduce){
  .divine-rays,.divine-rays::before,.book,.cover-hint,.gate-tagline{animation:none!important;}
  .book,.book-cover,.book-inner-leaf,.book-pages-inner,#gate{transition-duration:.01ms!important;transition-delay:0ms!important;}
  .book-cover.open,.book.is-open .book-cover{transform:rotateY(-118deg) translateZ(6px);}
}

/* ── CANVAS PARTICLES (JS driven) ── */
#divine-canvas { position:fixed; inset:0; z-index:0; pointer-events:none; }

/* ── HERO ── */
#hero {
  position:relative; min-height:100svh;
  display:flex; align-items:flex-end; justify-content:center;
  padding-bottom:90px; overflow:hidden;
}
.hero-bg {
  position:absolute; inset:0;
  background-image: url('fotos/hero-montage.jpg');
  background-size:cover; background-position:center top;
  z-index:0;
  transform:scale(1.05);
  animation: heroZoom 18s ease-in-out infinite alternate;
}
@keyframes heroZoom {
  0%   { transform:scale(1.05) translateY(0); }
  100% { transform:scale(1.12) translateY(-1.5%); }
}
.hero-vignette {
  position:absolute; inset:0;
  background:
    radial-gradient(ellipse 90% 100% at 50% 0%, transparent 30%, rgba(5,3,1,0.72) 100%),
    linear-gradient(to bottom, rgba(7,5,3,0.25) 0%, rgba(7,5,3,0.08) 30%, rgba(7,5,3,0.58) 80%, rgba(7,5,3,0.78) 100%);
  z-index:1;
}
.hero-fog {
  position:absolute; bottom:0; left:0; right:0; height:280px;
  background: linear-gradient(to top, rgba(30,18,8,0.68) 0%, rgba(30,18,8,0.35) 35%, transparent 100%);
  z-index:2;
}
.hero-content { position:relative; z-index:3; text-align:center; padding:0 20px; }

/*
  HERO PENDING STATE
  While the Gate is active, hero animations are frozen.
  .hero-pending suspends all child keyframes.
  .hero-ready lifts the suspension and triggers the reveal cascade.
  Fallback: if JS fails, #hero defaults to fully visible (no opacity:0 base).
*/
#hero.hero-pending .hero-eyebrow,
#hero.hero-pending .hero-name,
#hero.hero-pending .hero-rite,
#hero.hero-pending .hero-date,
#hero.hero-pending .hero-scroll {
  opacity: 0;
  animation: none;
  transform: none;
}

/* HERO READY — sacred page reveal cascade, triggered by JS after gate exit */
#hero.hero-ready .hero-eyebrow {
  animation: heroReveal 0.9s cubic-bezier(0.22,1,0.36,1) 0.08s forwards;
}
#hero.hero-ready .hero-name {
  animation: heroRevealUp 1.05s cubic-bezier(0.22,1,0.36,1) 0.18s forwards;
}
#hero.hero-ready .hero-rite {
  animation: heroReveal 0.9s cubic-bezier(0.22,1,0.36,1) 0.32s forwards;
}
#hero.hero-ready .hero-date {
  animation: heroReveal 0.85s cubic-bezier(0.22,1,0.36,1) 0.46s forwards;
}
#hero.hero-ready .hero-scroll {
  animation: heroReveal 0.8s cubic-bezier(0.22,1,0.36,1) 0.72s forwards;
}

/* Keyframes for hero-ready reveals — small translateY (≤14px), soft opacity */
@keyframes heroReveal {
  from { opacity:0; transform:translateY(14px); }
  to   { opacity:1; transform:translateY(0); }
}
@keyframes heroRevealUp {
  from { opacity:0; transform:translateY(16px); }
  to   { opacity:1; transform:translateY(0); }
}

/* Reduced-motion: collapse reveal to immediate readable state, no long movement */
@media (prefers-reduced-motion:reduce){
  #hero.hero-pending .hero-eyebrow,
  #hero.hero-pending .hero-name,
  #hero.hero-pending .hero-rite,
  #hero.hero-pending .hero-date,
  #hero.hero-pending .hero-scroll { opacity:0; animation:none; }

  #hero.hero-ready .hero-eyebrow,
  #hero.hero-ready .hero-name,
  #hero.hero-ready .hero-rite,
  #hero.hero-ready .hero-date,
  #hero.hero-ready .hero-scroll {
    animation: heroRevealReduced 0.25s ease forwards !important;
  }
  @keyframes heroRevealReduced {
    from { opacity:0; }
    to   { opacity:1; }
  }
}

.hero-eyebrow {
  display:block; font-size:0.66rem; letter-spacing:0.36em; text-transform:uppercase;
  color:#E8D89A;
  text-shadow: 0 0 12px rgba(212,175,55,0.7), 0 1px 3px rgba(0,0,0,0.6);
  filter: none;
  margin-bottom:1.1rem;
  opacity:0;
}
.hero-name {
  font-family:'Playfair Display', serif; font-style:italic;
  font-size: clamp(3.8rem, 13vw, 8.5rem);
  line-height:0.93; letter-spacing:-0.02em;
  color:#FDFAF4;
  text-shadow: 0 2px 24px rgba(0,0,0,0.7), 0 0 60px rgba(212,175,55,0.18), 0 4px 8px rgba(0,0,0,0.5);
  opacity:0;
}
.hero-rite {
  display:block; font-family:'Playfair Display', serif; font-style:italic;
  font-size: clamp(1rem, 3.2vw, 1.5rem);
  color:#E8D89A;
  text-shadow: 0 1px 8px rgba(0,0,0,0.7), 0 0 20px rgba(212,175,55,0.25);
  margin-top:0.8rem; letter-spacing:0.06em;
  opacity:0;
}
.hero-date {
  display:inline-flex; align-items:center; gap:10px; margin-top:1.6rem;
  padding:0.55rem 1.6rem;
  border:1px solid rgba(212,175,55,0.75);
  border-radius:var(--radius-pill);
  background:rgba(18,10,3,0.45); backdrop-filter:blur(8px);
  font-size:0.72rem; letter-spacing:0.22em; text-transform:uppercase;
  color:#E8D89A;
  text-shadow: 0 1px 4px rgba(0,0,0,0.6);
  opacity:0;
}
.hero-date span { opacity:0.5; }

/* scroll indicator */
.hero-scroll {
  position:absolute; bottom:28px; left:0; right:0; margin:auto;
  width:fit-content; transform:translateX(0);
  z-index:3; display:flex; flex-direction:column; align-items:center; gap:6px;
  opacity:0;
}
.hero-scroll span {
  font-size:0.52rem; letter-spacing:0.35em; text-transform:uppercase;
  color:#E8D89A;
  text-shadow: 0 1px 6px rgba(0,0,0,0.7);
}
.hero-scroll-line {
  width:1px; height:40px;
  background: linear-gradient(to bottom, #D4AF37, transparent);
  animation: scrollPulse 1.8s ease-in-out infinite;
}
@keyframes scrollPulse { 0%,100%{ transform:scaleY(1); opacity:0.5; } 50%{ transform:scaleY(1.4); opacity:1; } }

@keyframes fadeInUp {
  from { opacity:0; transform:translateY(30px); }
  to   { opacity:1; transform:translateY(0); }
}
@keyframes fadeInDown {
  from { opacity:0; transform:translateY(-20px); }
  to   { opacity:1; transform:translateY(0); }
}
@keyframes fadeIn { from{ opacity:0; } to{ opacity:1; } }

/* ── SACRED COUNTDOWN (ls-countdown) — COUNTDOWN-A ── */
#ls-countdown {
  position: relative;
  z-index: 1;
  padding: 56px 20px 60px;
  background:
    radial-gradient(ellipse 70% 100% at 50% 0%, var(--ls-candle) 0%, transparent 65%),
    linear-gradient(180deg, var(--ls-parchment-soft) 0%, var(--ls-parchment) 48%, var(--ls-parchment-soft) 100%);
  border-top: 1px solid var(--ls-border-gold-soft);
  border-bottom: 1px solid var(--ls-border-gold-soft);
  text-align: center;
  overflow: hidden;
}
/* Subtle parchment grain */
#ls-countdown::before {
  content: '';
  position: absolute; inset: 0; pointer-events: none; z-index: 0;
  background: repeating-linear-gradient(
    0deg,
    rgba(92,59,36,0.018) 0px, rgba(92,59,36,0.018) 1px,
    transparent 1px, transparent 5px
  );
}
#ls-countdown > .ls-countdown__inner { position: relative; z-index: 1; }

/* Engraved rule SVG */
.ls-countdown__rule {
  width: 100%;
  max-width: 260px;
  margin: 0 auto 1.2rem;
  display: flex; align-items: center; justify-content: center;
}
.ls-countdown__rule svg { width: 100%; height: 12px; overflow: visible; }

/* Liturgical eyebrow */
.ls-countdown__eyebrow {
  display: block;
  font-size: 0.54rem;
  letter-spacing: 0.44em;
  text-transform: uppercase;
  color: var(--ls-leather-deep);
  margin-bottom: 1.6rem;
  opacity: 1;
  font-weight: 500;
}

/* Clock strip — compact altar strip */
.ls-countdown__strip {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  max-width: min(100%, 380px);
  margin: 0 auto;
}

/* Individual value cell */
.ls-countdown__cell {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  min-width: 64px;
  padding: 14px 10px 12px;
  background:
    radial-gradient(ellipse at 50% 0%, var(--ls-candle) 0%, transparent 72%),
    var(--ls-parchment-soft);
  border: 1px solid var(--ls-border-gold-soft);
  border-radius: 6px;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.7),
    0 2px 10px var(--ls-shadow-leather-soft),
    0 0 0 0.5px var(--ls-border-gold-soft);
}

/* Old gold numeral */
.ls-countdown__value {
  font-family: 'Playfair Display', serif;
  font-style: italic;
  font-size: clamp(1.9rem, 6.5vw, 2.8rem);
  line-height: 1;
  color: var(--ls-gold-deep);
  letter-spacing: -0.02em;
  text-shadow: 0 1px 0 rgba(255,255,255,0.7), 0 0 16px var(--ls-candle);
  font-feature-settings: 'tnum';
  min-width: 2ch;
  display: block;
  transition: color 0.3s ease;
}

/* Label */
.ls-countdown__label {
  font-size: 0.48rem;
  letter-spacing: 0.38em;
  text-transform: uppercase;
  color: var(--mid);
  opacity: 0.75;
  display: block;
}

/* Engraved separator */
.ls-countdown__sep {
  width: 8px;
  height: 48px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 2px;
}
.ls-countdown__sep svg { width: 8px; height: 48px; }

/* Past-event status message */
.ls-countdown__status {
  font-family: 'Playfair Display', serif;
  font-style: italic;
  font-size: clamp(0.88rem, 3.2vw, 1.1rem);
  color: var(--mid);
  margin-top: 1.4rem;
  letter-spacing: 0.02em;
  line-height: 1.5;
  opacity: 0;
  transition: opacity 0.55s ease;
}
.ls-countdown__status:not([hidden]) { opacity: 0.78; }

/* Past state — dim the cells slightly, reveal the message */
#ls-countdown.ls-countdown--past .ls-countdown__value {
  color: rgba(139,100,32,0.45);
}
#ls-countdown.ls-countdown--past .ls-countdown__cell {
  background: rgba(255,252,243,0.5);
  border-color: rgba(185,143,74,0.12);
}

/* Mobile refinements */
@media (max-width: 420px) {
  #ls-countdown { padding: 44px 16px 48px; }
  .ls-countdown__cell { min-width: 54px; padding: 11px 7px 10px; }
  .ls-countdown__eyebrow { letter-spacing: 0.32em; }
}

/* Reduced-motion: no backdrop-filter cost, no grain animation */
@media (prefers-reduced-motion: reduce) {
  .ls-countdown__cell { backdrop-filter: none; -webkit-backdrop-filter: none; }
  .ls-countdown__status { transition: none; }
}

/* ── SECTION UTILITIES ── */
section { position:relative; z-index:1; }
.s-eyebrow { display:block; font-size:0.62rem; letter-spacing:0.42em; text-transform:uppercase; color:var(--ls-gold); margin-bottom:0.7rem; }
.s-title { font-family:'Playfair Display', serif; font-style:italic; font-size:clamp(1.9rem,5.5vw,3rem); color:var(--ls-ink); line-height:1.15; }

/* Manuscript Rule — replaces .s-divider in Itinerary/Gallery/RSVP headers */
.ls-manuscript-rule {
  width: 100%;
  max-width: 260px;
  margin: 1.2rem auto 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ls-manuscript-rule svg {
  width: 100%;
  height: 12px;
  overflow: visible;
}

/* ── PAGE FOLD TRANSITION (MOTION-C — kills Arcus Sacrum SVG wave) ──
   Feels like a page being turned: gradient from previous material into next,
   thin old-gold hairline, leather shadow. No SVG curve. No SaaS wave.
   Height: 24px mobile, 28px desktop.
*/
.ls-pagefold {
  display: block;
  width: 100%;
  max-width: 100%;
  position: relative;
  z-index: 2;
  overflow: hidden;
  pointer-events: none;
  height: 28px;
  /* Leather shadow reinforces material depth */
  box-shadow: 0 4px 12px rgba(42,22,8,0.12);
}
/* Hairline: the single old-gold page-edge */
.ls-pagefold::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(185,143,74,0.18) 12%,
    rgba(185,143,74,0.48) 40%,
    rgba(185,143,74,0.52) 50%,
    rgba(185,143,74,0.48) 60%,
    rgba(185,143,74,0.18) 88%,
    transparent 100%
  );
}
/* Gradient fill: transitions previous section color into next section color */
.ls-pagefold::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to bottom,
    var(--ls-parchment-soft) 0%,
    var(--ls-parchment) 100%
  );
}
/* Down variant: Hero (dark fog) → Countdown (parchment-soft) */
.ls-pagefold--down {
  background: var(--ls-parchment-soft);
}
.ls-pagefold--down::after {
  background: linear-gradient(
    to bottom,
    rgba(30,18,8,0.15) 0%,
    var(--ls-parchment-soft) 100%
  );
}
/* Up variant: Detalles (parchment-soft) → Itinerary (parchment-soft) */
.ls-pagefold--up {
  background: var(--ls-parchment-soft);
}
.ls-pagefold--up::before {
  top: auto;
  bottom: 0;
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(185,143,74,0.18) 12%,
    rgba(185,143,74,0.42) 40%,
    rgba(185,143,74,0.45) 50%,
    rgba(185,143,74,0.42) 60%,
    rgba(185,143,74,0.18) 88%,
    transparent 100%
  );
}
.ls-pagefold--up::after {
  background: linear-gradient(
    to bottom,
    var(--ls-parchment) 0%,
    var(--ls-parchment-soft) 100%
  );
}
@media (max-width: 420px) {
  .ls-pagefold { height: 22px; }
}
@media (prefers-reduced-motion: reduce) {
  .ls-pagefold { box-shadow: none; }
}


/* ── ITINERARY ── */
#itinerary {
  padding: 110px 20px;
  background: var(--ls-parchment-soft);
  overflow-x: clip;
  background-image:
    repeating-linear-gradient(
      0deg,
      rgba(42,22,8,var(--ls-grain-opacity)) 0px, rgba(42,22,8,var(--ls-grain-opacity)) 1px,
      transparent 1px, transparent 5px
    ),
    linear-gradient(180deg, var(--ls-parchment-soft) 0%, var(--ls-parchment) 100%);
}
.itinerary-hd { text-align:center; margin-bottom:68px; }

/* Central engraved line */
.timeline {
  max-width: 740px;
  margin: 0 auto;
  position: relative;
  overflow-x: clip;
}
.timeline::before {
  content: '';
  position: absolute;
  left: 50%;
  top: 0;
  bottom: 0;
  width: 1px;
  background: linear-gradient(
    to bottom,
    transparent 0%,
    #B98F4A 10%,
    #B98F4A 90%,
    transparent 100%
  );
  transform: translateX(-50%);
  opacity: 0.45;
}
@media(max-width:580px){
  .timeline::before { left: 28px; }
}

/* Timeline item row */
.t-item {
  position: relative;
  display: flex;
  gap: 44px;
  margin-bottom: 52px;
  align-items: flex-start;
}
.t-item:nth-child(even) { flex-direction: row-reverse; }
@media(max-width:580px){
  .t-item,
  .t-item:nth-child(even) {
    flex-direction: column;
    padding-left: 62px;
  }
}

/* Sacred timeline dot */
.t-dot {
  position: absolute;
  left: 50%;
  top: 26px;
  transform: translateX(-50%);
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: #D9BD7A;
  border: 2px solid #EFE3C8;
  box-shadow:
    0 0 0 1px #B98F4A,
    0 0 10px rgba(185,143,74,0.4);
  z-index: 1;
}
@media(max-width:580px){ .t-dot { left: 28px; } }

/* Parchment card */
.t-card {
  width: calc(50% - 44px);
  background: linear-gradient(145deg, var(--ls-parchment-soft) 0%, var(--ls-parchment) 100%);
  border: 1px solid var(--ls-border-gold-soft);
  border-radius: var(--ls-card-radius);
  padding: 24px 24px 22px;
  box-shadow:
    0 2px 18px var(--ls-shadow-leather-soft),
    inset 0 1px 0 rgba(255,252,240,0.9),
    inset 0 0 0 1px var(--ls-border-gold-soft);
  border-left: 3px solid rgba(185,143,74,0.40);
  transition: transform 0.32s ease, box-shadow 0.32s ease;
}
.t-card:hover {
  transform: translateY(-4px);
  box-shadow:
    0 10px 36px rgba(47,33,22,0.1),
    0 0 0 1px rgba(185,143,74,0.4),
    inset 0 1px 0 rgba(255,252,240,0.9);
}
@media(max-width:580px){ .t-card { width:100%; } }

/* SVG icon container */
.t-icon {
  margin-bottom: 10px;
  line-height: 1;
  display: block;
}
.t-svg-icon {
  width: 36px;
  height: 36px;
  display: block;
  overflow: visible;
  opacity: 0.88;
}

/* Time stamp */
.t-time {
  font-size: 0.6rem;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: #8B6420;
  margin-bottom: 5px;
  font-weight: 400;
}

/* Event title */
.t-name {
  font-family: 'Playfair Display', serif;
  font-style: italic;
  font-size: 1.12rem;
  color: #2A2118;
  margin-bottom: 6px;
  line-height: 1.25;
}

/* Event detail */
.t-detail {
  font-size: 0.8rem;
  color: #5C3B24;
  line-height: 1.65;
  opacity: 0.82;
}

/* ── GALLERY : CARD STACK ── */
#gallery {
  padding: 110px 20px;
  background: var(--ls-parchment-deep);
  background-image: repeating-linear-gradient(
    0deg,
    rgba(42,22,8,var(--ls-grain-opacity)) 0px, rgba(42,22,8,var(--ls-grain-opacity)) 1px,
    transparent 1px, transparent 5px
  );
}
.gallery-hd { text-align:center; margin-bottom:52px; }

.card-stack-wrap {
  max-width: 480px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 28px;
}
.cs-arrow {
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--ls-parchment-soft);
  border: 1px solid var(--ls-border-gold);
  color: var(--ls-gold-deep);
  font-size: 1.1rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.25s, box-shadow 0.25s, transform 0.15s;
  box-shadow: 0 2px 12px var(--ls-shadow-leather-soft), 0 0 0 1px var(--ls-border-gold-soft);
  -webkit-tap-highlight-color: transparent;
}
.cs-arrow:hover {
  background: rgba(217,189,122,0.2);
  box-shadow: 0 0 18px rgba(185,143,74,0.35), 0 0 0 1px rgba(185,143,74,0.4);
  transform: scale(1.08);
}
.cs-arrow:active { transform: scale(0.95); }

/* Arrow icon */
.cs-arrow svg { width: 18px; height: 18px; }
.cs-arrow svg path { stroke: #8B6420; }

.card-stack {
  position: relative;
  width: 300px;
  height: 380px;
  flex-shrink: 0;
}
@media(max-width:520px){
  .card-stack-wrap { gap: 12px; }
  .card-stack { width: 240px; height: 310px; }
  .cs-arrow { width: 36px; height: 36px; }
}

.cs-card {
  position: absolute;
  inset: 0;
  border-radius: 3px;
  overflow: hidden;
  /* Antique leather-bound frame */
  box-shadow:
    0 12px 40px rgba(47,33,22,0.24),
    0 0 0 1px rgba(185,143,74,0.22),
    inset 0 0 0 3px rgba(250,245,232,0.14);
  cursor: default;
  transition:
    transform 0.5s cubic-bezier(0.34,1.56,0.64,1),
    box-shadow 0.4s ease,
    opacity 0.4s ease;
}
/* Parchment page-turn edge pseudo */
.cs-card::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 3px;
  pointer-events: none;
  box-shadow: inset 3px 0 8px rgba(47,33,22,0.12), inset -3px 0 8px rgba(47,33,22,0.06);
}
.cs-card img { width:100%; height:100%; object-fit:cover; display:block; }

/* Stack depth states — untouched: preserves JS logic */
.cs-card[data-pos="0"] {
  transform: scale(1) translateY(0) rotate(0deg);
  z-index: 6;
  box-shadow:
    0 18px 56px rgba(47,33,22,0.28),
    0 0 0 1px rgba(185,143,74,0.38),
    0 0 22px rgba(185,143,74,0.14);
}
.cs-card[data-pos="1"] {
  transform: scale(0.94) translateY(14px) rotate(1.5deg);
  z-index: 5;
}
.cs-card[data-pos="2"] {
  transform: scale(0.88) translateY(26px) rotate(-1deg);
  z-index: 4;
}
.cs-card[data-pos="3"] {
  transform: scale(0.82) translateY(36px) rotate(2deg);
  z-index: 3;
  opacity: 0.7;
}
.cs-card[data-pos="4"] {
  transform: scale(0.76) translateY(44px) rotate(-1.5deg);
  z-index: 2;
  opacity: 0.4;
}
.cs-card[data-pos="5"] {
  transform: scale(0.7) translateY(50px) rotate(0.5deg);
  z-index: 1;
  opacity: 0.15;
}
/* Exit animations — untouched */
.cs-card.exit-left {
  transform: translateX(-160%) rotate(-20deg) !important;
  opacity: 0 !important;
  transition: transform 0.4s ease, opacity 0.4s ease;
}
.cs-card.exit-right {
  transform: translateX(160%) rotate(20deg) !important;
  opacity: 0 !important;
  transition: transform 0.4s ease, opacity 0.4s ease;
}

/* Stack counter — editorial serif */
.cs-counter {
  text-align: center;
  margin-top: 20px;
  font-family: 'Playfair Display', serif;
  font-style: italic;
  font-size: 0.72rem;
  letter-spacing: 0.18em;
  color: #8B6420;
  opacity: 0.65;
}

/* lightbox */
#lightbox {
  position:fixed; inset:0; z-index:8000;
  background:rgba(7,5,3,0.92); backdrop-filter:blur(8px);
  display:none; align-items:center; justify-content:center;
  cursor:zoom-out;
}
#lightbox.show { display:flex; animation:fadeIn 0.3s ease; }
#lightbox img { max-width:90vw; max-height:88vh; border-radius:var(--radius-md); object-fit:contain; box-shadow:0 0 80px rgba(212,175,55,0.2); }
#lightbox-close {
  position:absolute; top:20px; right:24px;
  background:transparent; border:1px solid rgba(212,175,55,0.4); color:var(--gold);
  width:42px; height:42px; border-radius:50%; font-size:1.2rem; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  transition:background 0.2s ease;
}
#lightbox-close:hover { background:rgba(212,175,55,0.15); }

/* ── RSVP ── */
#rsvp { padding:110px 20px; background: var(--ls-parchment-soft); text-align:center; }
.rsvp-hd { margin-bottom:52px; }
.rsvp-card {
  max-width:600px; margin:0 auto;
  background:
    radial-gradient(ellipse 70% 60% at 50% 0%, var(--ls-candle), transparent 65%),
    linear-gradient(160deg, var(--ls-parchment-soft) 0%, var(--ls-parchment) 100%);
  border: 1px solid var(--ls-border-gold);
  border-radius: var(--ls-section-radius);
  padding:52px 44px;
  box-shadow:
    0 10px 50px var(--ls-shadow-leather),
    inset 0 1px 0 rgba(255,255,255,0.7);
}
@media(max-width:480px){ .rsvp-card { padding:34px 22px; } }
.f-group { margin-bottom:22px; text-align:left; }
.f-label { display:block; font-size:0.62rem; letter-spacing:0.32em; text-transform:uppercase; color:var(--ls-gold); margin-bottom:8px; }
.f-input, .f-select, .f-textarea {
  width:100%; padding:14px 18px;
  background:rgba(255,252,243,0.88);
  border: 1px solid var(--ls-border-gold-soft);
  border-bottom: 2px solid var(--ls-border-gold-soft);
  border-radius: var(--ls-card-radius);
  font-family:'DM Sans', sans-serif; font-size:0.9rem; color:var(--ls-ink);
  outline:none; appearance:none; -webkit-appearance:none;
  transition:border-color 0.28s ease, box-shadow 0.28s ease;
}
.f-input:focus, .f-select:focus, .f-textarea:focus {
  border-color: var(--ls-gold);
  border-bottom-color: var(--ls-gold-deep);
  box-shadow: 0 2px 0 var(--ls-gold-deep), 0 0 0 3px var(--ls-candle);
}
.f-textarea { resize:vertical; min-height:100px; }
.f-sel-wrap { position:relative; }
.f-sel-wrap::after {
  content:'▾'; position:absolute; right:16px; top:50%; transform:translateY(-50%);
  color:var(--gold); pointer-events:none; font-size:0.78rem;
}
.btn-submit {
  width:100%; padding:16px; margin-top:8px;
  background:linear-gradient(110deg, #b8921e, var(--gold) 50%, #e8cc52);
  background-size:220% 100%; background-position:left center;
  border:none; border-radius:var(--radius-pill);
  font-family:'DM Sans', sans-serif; font-size:0.72rem; font-weight:500;
  letter-spacing:0.3em; text-transform:uppercase; color:#1a1005;
  cursor:pointer;
  transition:box-shadow 0.32s ease, transform 0.18s ease, background-position 0.5s ease;
}
.btn-submit:hover { box-shadow:0 0 36px rgba(212,175,55,0.65), 0 5px 22px rgba(0,0,0,0.1); transform:translateY(-2px); background-position:right center; }
.btn-submit:active { transform:translateY(0); }
.btn-submit:disabled { opacity:0.6; cursor:not-allowed; transform:none; }

/* VIP Ticket */
#rsvp-ticket {
  display:none;
  animation:fadeInUp 0.6s ease;
}
.kc-ticket {
  padding:32px 28px;
  background:linear-gradient(145deg, #1f1608, #2e2108);
  border:1px solid rgba(212,175,55,0.4);
  border-radius:var(--radius-lg);
  color:var(--silk);
  position:relative; overflow:hidden;
  text-align:center;
}
.kc-ticket::before {
  content:''; position:absolute; inset:0;
  background:radial-gradient(ellipse at 50% 0%, rgba(212,175,55,0.12) 0%, transparent 65%);
}
.ticket-cross { display:flex; align-items:center; justify-content:center; margin-bottom:16px; filter:drop-shadow(0 0 10px rgba(212,175,55,0.7)); }
.ticket-name { font-family:'Playfair Display', serif; font-style:italic; font-size:clamp(1.6rem,5vw,2.4rem); color:var(--gold); margin-bottom:6px; }
.ticket-event { font-size:0.65rem; letter-spacing:0.35em; text-transform:uppercase; color:rgba(253,251,247,0.6); margin-bottom:20px; }
.ticket-passes { font-size:0.75rem; letter-spacing:0.22em; text-transform:uppercase; color:var(--aqua); margin-bottom:24px; }
#ticket-qr { width:120px; height:120px; margin:0 auto 20px; border-radius:8px; background:#fff; padding:6px; }
.ticket-brand { font-size:0.52rem; letter-spacing:0.3em; text-transform:uppercase; color:rgba(212,175,55,0.35); margin-top:16px; }
.ticket-divider { width:60px; height:1px; background:linear-gradient(90deg,transparent,var(--gold),transparent); margin:16px auto; }

/* scan overlay */
#scan-overlay {
  display:none; position:fixed; inset:0; z-index:9998;
  background:linear-gradient(145deg, #0c0802, #1f1608);
  flex-direction:column; align-items:center; justify-content:center; gap:20px;
  text-align:center; padding:30px;
}
#scan-overlay.show { display:flex; }
.scan-name { font-family:'Playfair Display', serif; font-style:italic; font-size:clamp(2rem,7vw,3.5rem); color:var(--gold); }
.scan-passes { font-size:0.75rem; letter-spacing:0.3em; text-transform:uppercase; color:var(--aqua); }
#scan-qr { width:160px; height:160px; background:#fff; border-radius:12px; padding:8px; margin:10px auto; }

/* ── FOOTER CEREMONIAL (Libro Sagrado — dark sacred closure, COLOR-B-R) ── */
.ls-footer {
  position: relative;
  z-index: 1;
  padding: 44px 24px 96px;
  text-align: center;
  background:
    linear-gradient(180deg, var(--ls-leather-deep) 0%, #1C0E04 60%, #120802 100%);
  border-top: 2px solid rgba(185,143,74,0.45);
  overflow: hidden;
}
/* Subtle parchment grain overlay */
.ls-footer::before {
  content: '';
  position: absolute; inset: 0; pointer-events: none;
  background: repeating-linear-gradient(
    0deg,
    rgba(92,59,36,0.028) 0px, rgba(92,59,36,0.028) 1px,
    transparent 1px, transparent 4px
  );
  z-index: 0;
}
/* Inner vignette */
.ls-footer::after {
  content: '';
  position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(ellipse 80% 60% at 50% 100%, rgba(47,33,22,0.22), transparent 70%);
  z-index: 0;
}
.ls-footer > * { position: relative; z-index: 1; }

/* Gold rule SVG container */
.ls-footer__rule {
  width: 100%;
  max-width: 320px;
  margin: 0 auto 1.6rem;
  display: flex;
  align-items: center;
  justify-content: center;
  /* Observer-triggered reveal: animation waits for .is-visible on .ls-footer */
  opacity: 0;
  transform: translateY(12px);
  transition: opacity 1.0s ease, transform 1.0s ease;
}
.ls-footer__rule svg {
  width: 100%;
  height: 14px;
  overflow: visible;
}

/* Family closing line */
.ls-footer__closing {
  font-family: 'Playfair Display', serif;
  font-style: italic;
  font-size: clamp(1rem, 3.8vw, 1.35rem);
  color: #E8D89A;
  line-height: 1.5;
  letter-spacing: 0.01em;
  margin-bottom: 0.75rem;
  text-shadow: 0 1px 8px rgba(0,0,0,0.5);
  opacity: 0;
  transform: translateY(12px);
  transition: opacity 1.0s 0.12s ease, transform 1.0s 0.12s ease;
}

/* Event reference */
.ls-footer__event {
  font-size: 0.68rem;
  letter-spacing: 0.26em;
  text-transform: uppercase;
  color: rgba(216,190,122,0.78);
  margin-bottom: 0.3rem;
  opacity: 0;
  transform: translateY(12px);
  transition: opacity 1.0s 0.24s ease, transform 1.0s 0.24s ease;
}
.ls-footer__place {
  font-size: 0.62rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(216,190,122,0.55);
  margin-bottom: 0;
  opacity: 0;
  transform: translateY(12px);
  transition: opacity 1.0s 0.34s ease, transform 1.0s 0.34s ease;
}

/* Thin separator */
.ls-footer__thin-rule {
  width: 48px;
  height: 1px;
  margin: 1.4rem auto;
  background: linear-gradient(90deg, transparent, rgba(185,143,74,0.55), transparent);
  opacity: 0;
  transition: opacity 1.0s 0.44s ease;
}

/* KC Studio brand row */
.ls-footer__brand {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  opacity: 0;
  transform: translateY(12px);
  transition: opacity 1.0s 0.52s ease, transform 1.0s 0.52s ease;
}
/* Brand anchor link */
.ls-footer__brand-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
  cursor: pointer;
}
.ls-footer__brand-mark {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  opacity: 0.72;
}
.ls-footer__brand-text {
  font-size: 0.54rem;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: rgba(216,190,122,0.65);
  opacity: 1;
}
.ls-footer__brand-link:hover .ls-footer__brand-text,
.ls-footer__brand-link:focus .ls-footer__brand-text {
  opacity: 1;
  color: #E8D89A;
}
.ls-footer__brand-link:focus-visible {
  outline: 2px solid rgba(185,143,74,0.8);
  outline-offset: 4px;
  border-radius: 2px;
}

/* ── FOOTER OBSERVER-TRIGGERED REVEAL ── */
/* When IntersectionObserver adds .is-visible to .ls-footer, children transition in */
.ls-footer.is-visible .ls-footer__rule,
.ls-footer.is-visible .ls-footer__closing,
.ls-footer.is-visible .ls-footer__event,
.ls-footer.is-visible .ls-footer__place,
.ls-footer.is-visible .ls-footer__thin-rule,
.ls-footer.is-visible .ls-footer__brand {
  opacity: 1;
  transform: translateY(0);
}
/* thin-rule does not use translateY */
.ls-footer.is-visible .ls-footer__thin-rule { opacity: 0.7; }

/* Reduced-motion: instant readable state, no translateY */
@media (prefers-reduced-motion: reduce) {
  .ls-footer__rule,
  .ls-footer__closing,
  .ls-footer__event,
  .ls-footer__place,
  .ls-footer__thin-rule,
  .ls-footer__brand {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

@keyframes lsFooterFade {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}


/* ── RITUAL CANDLE MUSIC CONTROL (#libro-music-candle) ── */
#libro-music-candle{
  position:fixed;bottom:1.5rem;right:1.4rem;z-index:250;
  background:none;border:none;padding:4px;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
  filter:drop-shadow(0 2px 8px rgba(0,0,0,0.55));
  transition:filter 0.4s ease,transform 0.3s ease;
  transform-origin:50% 90%;
  opacity:0;transform:translateY(20px) scale(0.85);
  will-change:transform,filter;
  user-select:none;-webkit-user-select:none;
}
#libro-music-candle.lmc-hidden{display:none!important}

#libro-music-candle.lmc-appearing{
  animation:lmcCandleAppear 0.7s cubic-bezier(0.23,1,0.32,1) forwards;
}
#libro-music-candle:hover{
  filter:drop-shadow(0 3px 12px rgba(0,0,0,0.65)) drop-shadow(0 0 10px rgba(210,155,40,0.45));
  transform:scale(1.08) translateY(-2px);
}
#libro-music-candle.lmc-playing{
  filter:
    drop-shadow(0 2px 8px rgba(0,0,0,0.55))
    drop-shadow(0 0 14px rgba(210,155,40,0.82));
}
#libro-music-candle:focus-visible{outline:2px solid rgba(212,175,55,0.85);outline-offset:8px;border-radius:50%;}

.lmc-candle-svg{width:40px;height:76px;overflow:visible;display:block}

.lmc-body{
  fill:url(#lmc-candle-grad);
  stroke:rgba(90,55,10,0.42);stroke-width:0.8;
}
.lmc-wax-pool{
  fill:rgba(225,208,158,0.72);
  stroke:rgba(90,55,10,0.3);stroke-width:0.5;
}
.lmc-drip{fill:rgba(235,218,168,0.82);stroke:rgba(90,55,10,0.2);stroke-width:0.4}
.lmc-wick{stroke:#2e1808;stroke-width:1.2;stroke-linecap:round}

/* Flames — off by default */
.lmc-flame-outer{
  fill:url(#lmc-flame-outer);opacity:0;
  transform-origin:20px 28px;will-change:transform,opacity;
}
.lmc-flame-mid{
  fill:url(#lmc-flame-inner);opacity:0;
  transform-origin:20px 26px;will-change:transform,opacity;
}
.lmc-flame-core{
  fill:#FAF4CC;opacity:0;
  transform-origin:20px 23px;will-change:transform,opacity;
}

/* Smoke — off by default */
.lmc-smoke{
  stroke:rgba(200,195,185,0);stroke-width:1.2;
  stroke-linecap:round;fill:none;
  transition:stroke 0.3s ease;
}

/* LIGHTING state */
#libro-music-candle.lmc-lighting .lmc-flame-outer{
  animation:lmcLight 0.8s cubic-bezier(0.23,1,0.32,1) forwards;
}
#libro-music-candle.lmc-lighting .lmc-flame-mid{
  animation:lmcLight 0.7s cubic-bezier(0.23,1,0.32,1) 0.12s forwards;
}
#libro-music-candle.lmc-lighting .lmc-flame-core{
  animation:lmcLight 0.6s cubic-bezier(0.23,1,0.32,1) 0.22s forwards;
}

/* PLAYING stable flicker */
#libro-music-candle.lmc-playing:not(.lmc-lighting) .lmc-flame-outer{
  opacity:1;
  animation:lmcFlickerOuter 1.85s ease-in-out infinite;
}
#libro-music-candle.lmc-playing:not(.lmc-lighting) .lmc-flame-mid{
  opacity:1;
  animation:lmcFlickerMid 1.42s ease-in-out infinite 0.1s;
}
#libro-music-candle.lmc-playing:not(.lmc-lighting) .lmc-flame-core{
  opacity:0.94;
  animation:lmcFlickerCore 1s ease-in-out infinite 0.22s;
}

/* EXTINGUISHING state */
#libro-music-candle.lmc-extinguishing .lmc-flame-outer{
  animation:lmcOut 0.55s ease-in forwards;
}
#libro-music-candle.lmc-extinguishing .lmc-flame-mid{
  animation:lmcOut 0.4s ease-in 0.05s forwards;
}
#libro-music-candle.lmc-extinguishing .lmc-flame-core{
  animation:lmcOut 0.3s ease-in 0.1s forwards;
}
#libro-music-candle.lmc-extinguishing .lmc-smoke{
  stroke:rgba(200,195,185,0.52);
  animation:lmcSmokeRise 0.9s ease-out forwards;
}

/* ── KEYFRAMES ── */
@keyframes lmcCandleAppear{
  0%  {opacity:0;transform:translateY(20px) scale(0.82)}
  60% {opacity:1;transform:translateY(-3px) scale(1.04)}
  100%{opacity:1;transform:translateY(0)    scale(1)}
}
@keyframes lmcLight{
  0%  {opacity:0;transform:scaleX(0.2) scaleY(0)    rotate(-8deg)}
  30% {opacity:0.9;transform:scaleX(1.5) scaleY(0.5) rotate(5deg)}
  60% {opacity:1;transform:scaleX(0.85) scaleY(1.15) rotate(-3deg)}
  80% {opacity:1;transform:scaleX(1.05) scaleY(0.95) rotate(1deg)}
  100%{opacity:1;transform:scaleX(1)    scaleY(1)    rotate(0deg)}
}
@keyframes lmcOut{
  0%  {opacity:1;transform:scaleX(1)    scaleY(1)    rotate(0deg)}
  25% {opacity:0.9;transform:scaleX(0.6) scaleY(1.4) rotate(12deg)}
  50% {opacity:0.5;transform:scaleX(1.2) scaleY(0.4) rotate(-8deg)}
  75% {opacity:0.2;transform:scaleX(0.3) scaleY(0.2)}
  100%{opacity:0;transform:scaleX(0)   scaleY(0)}
}
@keyframes lmcFlickerOuter{
  0%  {transform:scaleX(1)    scaleY(1)    rotate(0deg)}
  20% {transform:scaleX(0.88) scaleY(1.06) rotate(-2deg)}
  40% {transform:scaleX(1.05) scaleY(0.94) rotate(1.5deg)}
  60% {transform:scaleX(0.92) scaleY(1.08) rotate(-1deg)}
  80% {transform:scaleX(1.03) scaleY(0.97) rotate(2deg)}
  100%{transform:scaleX(1)    scaleY(1)    rotate(0deg)}
}
@keyframes lmcFlickerMid{
  0%  {transform:scaleX(1)    scaleY(1)    rotate(0deg);opacity:1}
  25% {transform:scaleX(0.9)  scaleY(1.1)  rotate(2deg);opacity:0.92}
  50% {transform:scaleX(1.08) scaleY(0.92) rotate(-2deg);opacity:1}
  75% {transform:scaleX(0.93) scaleY(1.07) rotate(1deg);opacity:0.95}
  100%{transform:scaleX(1)    scaleY(1)    rotate(0deg);opacity:1}
}
@keyframes lmcFlickerCore{
  0%  {transform:scaleX(1)    scaleY(1);opacity:0.94}
  33% {transform:scaleX(0.85) scaleY(1.15);opacity:0.72}
  66% {transform:scaleX(1.1)  scaleY(0.9);opacity:1}
  100%{transform:scaleX(1)    scaleY(1);opacity:0.94}
}
@keyframes lmcSmokeRise{
  0%  {stroke-dashoffset:0;opacity:0.6;transform:translateY(0)   scaleX(1)}
  50% {opacity:0.4;transform:translateY(-8px)  scaleX(1.3)}
  100%{opacity:0;transform:translateY(-18px) scaleX(0.5)}
}



/* #verse body block — section removed in SECTIONS-B2-R.
   Gate verse (Mateo 19:14) remains intact inside #gate / .book-pages-inner.
   Styles kept as no-op to avoid any cascade break. */
#verse { display: none; }


/* ═══════════════════════════════════════════════════════════
   NARRATIVE CORE — SECTIONS-B2
   Prefixes: ls-family__*, ls-godparents__*, ls-details__*
   All sections: mobile-first, no overflow, no heavy libraries
   ═══════════════════════════════════════════════════════════ */

/* ── SHARED NARRATIVE RULE (all three sections) ── */
.ls-family__rule,
.ls-godparents__rule,
.ls-details__rule {
  width: 100%;
  max-width: 260px;
  margin: 0 auto 1.6rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ls-family__rule svg,
.ls-godparents__rule svg,
.ls-details__rule svg {
  width: 100%;
  height: 12px;
  overflow: visible;
}

/* Shared eyebrow label */
.ls-family__eyebrow,
.ls-godparents__eyebrow,
.ls-details__eyebrow {
  display: block;
  font-size: 0.6rem;
  letter-spacing: 0.42em;
  text-transform: uppercase;
  color: #B98F4A;
  margin-bottom: 1.2rem;
  text-align: center;
}

/* ═══ FAMILIA ═══ */
#familia {
  position: relative;
  z-index: 1;
  background:
    linear-gradient(180deg, var(--ls-parchment-soft) 0%, var(--ls-parchment) 55%, var(--ls-parchment-soft) 100%);
  padding: 88px 20px 72px;
  overflow: hidden;
}
/* Grain texture overlay */
#familia::before {
  content: '';
  position: absolute; inset: 0; pointer-events: none;
  background: repeating-linear-gradient(
    0deg,
    rgba(92,59,36,0.018) 0px, rgba(92,59,36,0.018) 1px,
    transparent 1px, transparent 5px
  );
  z-index: 0;
}
.ls-family__inner {
  position: relative;
  z-index: 1;
  max-width: 600px;
  margin: 0 auto;
  text-align: center;
}

/* Parchment page card */
.ls-family__page {
  position: relative;
  background:
    radial-gradient(ellipse 80% 60% at 50% 0%, var(--ls-candle), transparent 60%),
    linear-gradient(160deg, var(--ls-parchment-soft) 0%, var(--ls-parchment) 50%, var(--ls-parchment-deep) 100%);
  border: 1px solid var(--ls-border-gold);
  border-radius: var(--ls-section-radius);
  padding: 44px 32px 36px;
  box-shadow:
    inset 0 2px 0 rgba(255,255,255,0.5),
    inset 0 -1px 0 rgba(42,22,8,0.08),
    0 8px 40px var(--ls-shadow-leather);
  text-align: left;
  overflow: hidden;
}
/* Page edge lines */
.ls-family__page::before {
  content: '';
  position: absolute;
  left: 18px; top: 0; bottom: 0; width: 1px;
  background: linear-gradient(to bottom, transparent 5%, rgba(185,143,74,0.2) 20%, rgba(185,143,74,0.2) 80%, transparent 95%);
}
.ls-family__page::after {
  content: '';
  position: absolute;
  inset: 8px;
  border: 1px solid rgba(185,143,74,0.12);
  border-radius: 2px;
  pointer-events: none;
}

/* Decorative initial capital */
.ls-family__initial {
  float: left;
  font-family: 'Playfair Display', serif;
  font-size: 5.2rem;
  line-height: 0.78;
  color: #B98F4A;
  margin-right: 10px;
  margin-top: 6px;
  opacity: 0.82;
  text-shadow: 0 2px 8px rgba(185,143,74,0.25);
  pointer-events: none;
  user-select: none;
}

.ls-family__body {
  overflow: hidden;
}
.ls-family__copy {
  font-family: 'Playfair Display', serif;
  font-style: italic;
  font-size: clamp(0.92rem, 3.2vw, 1.05rem);
  color: #2A2118;
  line-height: 1.82;
  letter-spacing: 0.01em;
  margin-bottom: 0.9rem;
}
.ls-family__copy--second {
  font-size: clamp(0.86rem, 3vw, 0.98rem);
  color: #5C3B24;
  font-style: normal;
  font-family: 'DM Sans', sans-serif;
  letter-spacing: 0.02em;
  line-height: 1.7;
}

/* Family name seal */
.ls-family__seal {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 2rem;
  clear: both;
}
.ls-family__seal-rule {
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(185,143,74,0.4));
}
.ls-family__seal-rule:last-child {
  background: linear-gradient(90deg, rgba(185,143,74,0.4), transparent);
}
.ls-family__seal-name {
  font-size: 0.64rem;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: #B98F4A;
  white-space: nowrap;
}

/* ═══ PADRINOS ═══ */
#padrinos {
  position: relative;
  z-index: 1;
  background:
    linear-gradient(180deg, var(--ls-parchment) 0%, var(--ls-parchment-deep) 60%, var(--ls-parchment) 100%);
  padding: 80px 20px 72px;
  overflow: hidden;
}
#padrinos::before {
  content: '';
  position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(ellipse 70% 50% at 50% 0%, rgba(185,143,74,0.07), transparent 65%);
  z-index: 0;
}
.ls-godparents__inner {
  position: relative;
  z-index: 1;
  max-width: 560px;
  margin: 0 auto;
  text-align: center;
}
.ls-godparents__lead {
  font-family: 'Playfair Display', serif;
  font-style: italic;
  font-size: clamp(0.9rem, 3vw, 1.06rem);
  color: #5C3B24;
  line-height: 1.72;
  max-width: 420px;
  margin: 0 auto 2.4rem;
}

/* Bookplate grid: row on desktop, column on mobile */
.ls-godparents__grid {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  flex-wrap: wrap;
}

/* Bookplate card */
.ls-godparents__plate {
  position: relative;
  flex: 1;
  min-width: 140px;
  max-width: 220px;
  background:
    linear-gradient(145deg, var(--ls-parchment-soft) 0%, var(--ls-parchment) 60%, var(--ls-parchment-deep) 100%);
  border: 1px solid var(--ls-border-gold);
  border-radius: var(--ls-card-radius);
  padding: 32px 22px 28px;
  text-align: center;
  box-shadow: 0 4px 24px var(--ls-shadow-leather);
}
/* Inner border frame */
.ls-godparents__plate-frame {
  position: absolute;
  inset: 6px;
  border: 1px solid rgba(185,143,74,0.18);
  border-radius: 2px;
  pointer-events: none;
}
.ls-godparents__plate-icon {
  width: 28px;
  height: 42px;
  display: block;
  margin: 0 auto 12px;
  opacity: 0.85;
}
.ls-godparents__plate-role {
  font-size: 0.56rem;
  letter-spacing: 0.36em;
  text-transform: uppercase;
  color: #B98F4A;
  margin-bottom: 6px;
}
.ls-godparents__plate-name {
  font-family: 'Playfair Display', serif;
  font-style: italic;
  font-size: clamp(1rem, 3.5vw, 1.22rem);
  color: #2F2116;
  line-height: 1.3;
  font-weight: 400;
}

/* Center divider — visible on medium+ screens */
.ls-godparents__divider {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 18px;
}
.ls-godparents__divider svg {
  width: 8px;
  height: 60px;
  overflow: visible;
}

/* Mobile: hide divider, stack vertically */
@media (max-width: 420px) {
  .ls-godparents__grid {
    flex-direction: column;
    gap: 16px;
  }
  .ls-godparents__plate {
    max-width: 100%;
    width: 100%;
  }
  .ls-godparents__divider {
    display: none;
  }
}

/* ═══ DETALLES SAGRADOS ═══ */
#detalles-sagrados {
  position: relative;
  z-index: 1;
  background: linear-gradient(180deg, var(--ls-parchment-soft) 0%, var(--ls-parchment) 100%);
  padding: 80px 20px 72px;
  overflow: hidden;
}
#detalles-sagrados::before {
  content: '';
  position: absolute; inset: 0; pointer-events: none;
  background: repeating-linear-gradient(
    0deg,
    rgba(92,59,36,0.015) 0px, rgba(92,59,36,0.015) 1px,
    transparent 1px, transparent 5px
  );
  z-index: 0;
}
.ls-details__inner {
  position: relative;
  z-index: 1;
  max-width: 560px;
  margin: 0 auto;
  text-align: center;
}

/* Two-column grid → single column on small mobile */
.ls-details__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-top: 0.4rem;
}
@media (max-width: 380px) {
  .ls-details__grid {
    grid-template-columns: 1fr;
  }
}

/* Detail card */
.ls-details__card {
  position: relative;
  background:
    linear-gradient(150deg, var(--ls-parchment-soft) 0%, var(--ls-parchment) 55%, var(--ls-parchment-deep) 100%);
  border: 1px solid var(--ls-border-gold);
  border-left: 3px solid var(--ls-gold);
  border-radius: var(--ls-card-radius);
  padding: 28px 18px 24px;
  text-align: center;
  box-shadow: 0 6px 28px var(--ls-shadow-leather), inset 0 1px 0 rgba(255,255,255,0.5);
  overflow: hidden;
  -webkit-tap-highlight-color: transparent;
}
.ls-details__card::before {
  content: '';
  position: absolute;
  inset: 5px;
  border: 1px solid rgba(185,143,74,0.14);
  border-radius: 2px;
  pointer-events: none;
}
.ls-details__card-glow {
  position: absolute;
  top: -18px; left: 50%;
  transform: translateX(-50%);
  width: 80px; height: 50px;
  background: radial-gradient(ellipse, rgba(185,143,74,0.1), transparent 70%);
  pointer-events: none;
  z-index: 0;
}
.ls-details__card-icon {
  position: relative;
  z-index: 1;
  width: 36px;
  height: 36px;
  display: block;
  margin: 0 auto 12px;
  opacity: 0.82;
}
.ls-details__card-title {
  position: relative;
  z-index: 1;
  font-family: 'Playfair Display', serif;
  font-style: italic;
  font-size: clamp(0.95rem, 3.2vw, 1.12rem);
  color: #2F2116;
  margin-bottom: 6px;
  font-weight: 400;
}
.ls-details__card-body {
  position: relative;
  z-index: 1;
  font-size: 0.78rem;
  color: #5C3B24;
  line-height: 1.5;
  margin-bottom: 2px;
  font-weight: 500;
}
.ls-details__card-sub {
  position: relative;
  z-index: 1;
  font-size: 0.65rem;
  color: rgba(92,59,36,0.7);
  letter-spacing: 0.04em;
  line-height: 1.4;
  margin-bottom: 8px;
}
.ls-details__card-time {
  position: relative;
  z-index: 1;
  font-size: 0.58rem;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: #B98F4A;
  margin-top: 4px;
}

@media (prefers-reduced-motion: reduce) {
  #familia, #padrinos, #detalles-sagrados { animation: none !important; }
}

/* ── DETALLES SAGRADOS: Location CTA (SECTIONS-B2-R) ── */
.ls-details__cta {
  display: inline-block;
  margin-top: 10px;
  padding: 7px 14px;
  font-size: 0.54rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: #2F1A05;
  background: rgba(185,143,74,0.14);
  border: 1px solid rgba(185,143,74,0.5);
  border-radius: 2px;
  text-decoration: none;
  cursor: pointer;
  min-height: 36px;
  line-height: 36px;
  padding-top: 0;
  padding-bottom: 0;
  -webkit-tap-highlight-color: transparent;
  transition: background 0.22s ease, color 0.22s ease, border-color 0.22s ease;
}
.ls-details__cta:hover,
.ls-details__cta:focus {
  background: rgba(185,143,74,0.28);
  color: #1C1005;
  border-color: rgba(185,143,74,0.75);
}
.ls-details__cta:focus-visible {
  outline: 2px solid rgba(185,143,74,0.85);
  outline-offset: 3px;
}

/* ── COLOR-B-R ADDITIONS ── */

/* Global: stronger section title / eyebrow contrast on pale backgrounds */
.s-title {
  color: var(--ls-leather-deep) !important;
  text-shadow: 0 1px 0 rgba(255,255,255,0.4);
}
.s-eyebrow {
  color: var(--ls-gold-deep) !important;
  opacity: 1 !important;
}
.ls-family__eyebrow,
.ls-godparents__eyebrow,
.ls-details__eyebrow {
  color: var(--ls-gold-deep);
  opacity: 1;
}

/* KC-RSVP badge and star seal */
.kc-rsvp-badge {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 0.6rem;
}
.kc-rsvp-star {
  width: 28px;
  height: 28px;
  display: block;
  opacity: 0.85;
}
.kc-rsvp-eyebrow {
  font-size: 0.72rem !important;
  letter-spacing: 0.52em !important;
  color: var(--ls-gold-deep) !important;
  font-weight: 600 !important;
  opacity: 1 !important;
  margin-bottom: 0.5rem;
}
.rsvp-subhead {
  font-family: 'Playfair Display', serif;
  font-style: italic;
  font-size: clamp(0.82rem, 2.8vw, 0.96rem);
  color: var(--ls-leather);
  letter-spacing: 0.02em;
  line-height: 1.55;
  margin-bottom: 0.8rem;
  margin-top: 0.2rem;
}

/* RSVP section: slightly deeper background for card contrast */
#rsvp {
  background: var(--ls-parchment) !important;
}
.rsvp-card {
  border-left: 4px solid rgba(185,143,74,0.55);
}

/* Ticket: improve aqua label readability on dark ticket */
.ticket-passes {
  color: #A8D0C6;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  font-size: 0.75rem;
  margin-bottom: 24px;
}


/* Footer SVG rule: ensure gold rule reads on dark background */
.ls-footer__rule svg line,
.ls-footer__rule svg path {
  stroke: rgba(185,143,74,0.65);
  fill: rgba(185,143,74,0.65);
}

/* ── MOTION-C: SACRED FLOW REVEAL ORCHESTRATION ──
   Pure CSS stagger over AOS-revealed parents.
   AOS triggers opacity/transform on the parent; children stagger within.
   No JS added. No IntersectionObserver added.
   All timing within 650–900ms. TranslateY max 14px.
*/

/* Godparents bookplates — stagger within revealed grid */
.ls-godparents__grid[data-aos].aos-animate .ls-godparents__plate:nth-child(1) {
  animation: sacredSettle 0.72s cubic-bezier(0.22,1,0.36,1) 0.04s both;
}
.ls-godparents__grid[data-aos].aos-animate .ls-godparents__plate:nth-child(2) {
  animation: sacredSettle 0.72s cubic-bezier(0.22,1,0.36,1) 0.14s both;
}

/* Detail cards — stagger within revealed grid */
.ls-details__grid[data-aos].aos-animate .ls-details__card:nth-child(1) {
  animation: sacredSettle 0.78s cubic-bezier(0.22,1,0.36,1) 0.04s both;
}
.ls-details__grid[data-aos].aos-animate .ls-details__card:nth-child(2) {
  animation: sacredSettle 0.78s cubic-bezier(0.22,1,0.36,1) 0.12s both;
}
.ls-details__grid[data-aos].aos-animate .ls-details__card:nth-child(3) {
  animation: sacredSettle 0.78s cubic-bezier(0.22,1,0.36,1) 0.20s both;
}

/* Timeline items nested settle via parent */
.timeline[data-aos].aos-animate .t-item {
  opacity: 0;
}
.timeline[data-aos].aos-animate .t-item:nth-child(1) { animation: sacredSettle 0.76s cubic-bezier(0.22,1,0.36,1) 0.04s both; }
.timeline[data-aos].aos-animate .t-item:nth-child(2) { animation: sacredSettle 0.76s cubic-bezier(0.22,1,0.36,1) 0.16s both; }
.timeline[data-aos].aos-animate .t-item:nth-child(3) { animation: sacredSettle 0.76s cubic-bezier(0.22,1,0.36,1) 0.28s both; }
.timeline[data-aos].aos-animate .t-item:nth-child(4) { animation: sacredSettle 0.76s cubic-bezier(0.22,1,0.36,1) 0.40s both; }

/* Gallery: card stack wraps as editorial page — ease into view */
.card-stack-wrap[data-aos] {
  transition-timing-function: cubic-bezier(0.22,1,0.36,1) !important;
}

/* RSVP: KC-RSVP arrives with deliberate weight — slow ease */
.rsvp-card[data-aos] {
  transition-timing-function: cubic-bezier(0.16,1,0.3,1) !important;
}
.rsvp-hd[data-aos] {
  transition-timing-function: cubic-bezier(0.22,1,0.36,1) !important;
}

/* Countdown: altar strip eases upward softly */
#ls-countdown[data-aos] {
  transition-timing-function: cubic-bezier(0.22,1,0.36,1) !important;
}

/* Shared settle keyframe */
@keyframes sacredSettle {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Prefers-reduced-motion: collapse all motion to immediate readability */
@media (prefers-reduced-motion: reduce) {
  .ls-godparents__grid[data-aos].aos-animate .ls-godparents__plate,
  .ls-details__grid[data-aos].aos-animate .ls-details__card,
  .timeline[data-aos].aos-animate .t-item,
  .ls-parents__grid[data-aos].aos-animate .ls-parents__plate {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
  .card-stack-wrap[data-aos],
  .rsvp-card[data-aos],
  .rsvp-hd[data-aos],
  #ls-countdown[data-aos] {
    transition-timing-function: linear !important;
    transition-duration: 50ms !important;
  }
}

/* ══════════════════════════════════════════════════════
   MIS PADRES / Parents Sacred Bookplate — SECTIONS-B4
   Scoped: #mis-padres, .ls-parents__*
   Palette: --ls-* tokens only.
   Mobile-first. Two bookplates, stacked on mobile.
══════════════════════════════════════════════════════ */

#mis-padres {
  position: relative;
  z-index: 1;
  padding: 80px 20px 72px;
  background:
    radial-gradient(ellipse 60% 80% at 50% 0%, var(--ls-candle) 0%, transparent 65%),
    linear-gradient(180deg, var(--ls-parchment-soft) 0%, var(--ls-parchment) 55%, var(--ls-parchment-soft) 100%);
  overflow-x: clip;
}

/* Subtle parchment grain */
#mis-padres::before {
  content: '';
  position: absolute; inset: 0; pointer-events: none; z-index: 0;
  background: repeating-linear-gradient(
    0deg,
    rgba(92,59,36,0.020) 0px, rgba(92,59,36,0.020) 1px,
    transparent 1px, transparent 5px
  );
}

/* Container */
.ls-parents__inner {
  position: relative;
  z-index: 1;
  max-width: 520px;
  margin: 0 auto;
  text-align: center;
}

/* Section header */
.ls-parents__hd {
  margin-bottom: 2.8rem;
}

/* Eyebrow */
.ls-parents__eyebrow {
  display: block;
  font-size: 0.58rem;
  letter-spacing: 0.44em;
  text-transform: uppercase;
  color: var(--ls-gold-deep);
  margin-bottom: 0.75rem;
  font-weight: 500;
}

/* Section title */
.ls-parents__title {
  font-family: 'Playfair Display', serif;
  font-style: italic;
  font-size: clamp(1.9rem, 5.5vw, 2.8rem);
  color: var(--ls-leather-deep);
  line-height: 1.15;
  margin-bottom: 0.75rem;
  text-shadow: 0 1px 0 rgba(255,255,255,0.35);
}

/* Intro lead */
.ls-parents__lead {
  font-family: 'Playfair Display', serif;
  font-style: italic;
  font-size: clamp(0.86rem, 2.8vw, 0.98rem);
  color: var(--ls-leather);
  line-height: 1.72;
  max-width: 380px;
  margin: 0 auto 1.4rem;
}

/* Engraved manuscript rule */
.ls-parents__rule {
  width: 100%;
  max-width: 220px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ls-parents__rule svg {
  width: 100%;
  height: 12px;
  overflow: visible;
}

/* Family photo anchor */
.ls-parents__photo {
  max-width: min(100%, 340px);
  margin: 2.2rem auto 2.2rem;
  border: 1px solid var(--ls-border-gold);
  background: var(--ls-parchment-soft);
  padding: 8px;
  box-shadow: 0 10px 30px -10px rgba(42,22,8,0.18), inset 0 0 0 1px rgba(255,255,255,0.4);
  border-radius: var(--radius-sm);
  position: relative;
}
.ls-parents__photo::after {
  content: ''; position: absolute; inset: 4px;
  border: 1px solid rgba(185,143,74,0.22);
  border-radius: inherit; pointer-events: none;
}
.ls-parents__photo img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
  border-radius: calc(var(--radius-sm) - 2px);
}

/* Bookplate grid — stacked on mobile, row on ≥480px */
.ls-parents__grid {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
}
@media (min-width: 480px) {
  .ls-parents__grid {
    flex-direction: row;
    align-items: stretch;
    justify-content: center;
    gap: 24px;
  }
}

/* Bookplate card */
.ls-parents__plate {
  position: relative;
  flex: 1;
  min-width: 140px;
  max-width: min(100%, 220px);
  background:
    linear-gradient(145deg, var(--ls-parchment-soft) 0%, var(--ls-parchment) 60%, var(--ls-parchment-deep) 100%);
  border: 1px solid var(--ls-border-gold);
  border-radius: var(--ls-card-radius);
  padding: 32px 22px 26px;
  text-align: center;
  box-shadow:
    0 4px 22px var(--ls-shadow-leather),
    inset 0 1px 0 rgba(255,255,255,0.5);
}
@media (max-width: 479px) {
  .ls-parents__plate {
    max-width: min(100%, 280px);
    width: 100%;
  }
}

/* Inner border frame — editorial bookplate detail */
.ls-parents__plate-frame {
  position: absolute;
  inset: 6px;
  border: 1px solid rgba(185,143,74,0.18);
  border-radius: 2px;
  pointer-events: none;
}

/* Left leather spine accent */
.ls-parents__plate::after {
  content: '';
  position: absolute;
  left: 0; top: 8px; bottom: 8px;
  width: 3px;
  background: linear-gradient(to bottom, rgba(185,143,74,0.35), rgba(185,143,74,0.18), rgba(185,143,74,0.35));
  border-radius: 0 2px 2px 0;
}

/* Circular SVG seal */
.ls-parents__seal {
  width: 40px;
  height: 40px;
  display: block;
  margin: 0 auto 14px;
  opacity: 0.9;
}
.ls-parents__seal svg {
  width: 100%;
  height: 100%;
  display: block;
}

/* Role label */
.ls-parents__plate-role {
  font-size: 0.56rem;
  letter-spacing: 0.38em;
  text-transform: uppercase;
  color: var(--ls-gold);
  margin-bottom: 7px;
}

/* Parent name */
.ls-parents__plate-name {
  font-family: 'Playfair Display', serif;
  font-style: italic;
  font-size: clamp(1rem, 3.5vw, 1.2rem);
  color: var(--ls-leather-deep);
  line-height: 1.3;
  margin-bottom: 10px;
}

/* Intimate line */
.ls-parents__plate-line {
  font-size: 0.74rem;
  letter-spacing: 0.04em;
  color: var(--ls-leather);
  font-style: italic;
  line-height: 1.55;
}

/* ── AOS Child Stagger for Mis Padres bookplates ── */
.ls-parents__grid[data-aos].aos-animate .ls-parents__plate:nth-child(1) {
  animation: sacredSettle 0.76s cubic-bezier(0.22,1,0.36,1) 0.04s both;
}
.ls-parents__grid[data-aos].aos-animate .ls-parents__plate:nth-child(2) {
  animation: sacredSettle 0.76s cubic-bezier(0.22,1,0.36,1) 0.15s both;
}

/* Prefers-reduced-motion */
@media (prefers-reduced-motion: reduce) {
  .ls-parents__grid[data-aos].aos-animate .ls-parents__plate {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
}

/* ── KC-TICKET SHARE — Guardar Pase — RSVP-B ──
   .kc-ticket = capture boundary (dom-to-image-more targets this element only)
   .kc-ticket-share = wrapper OUTSIDE the capture area
   .kc-ticket-share-btn = premium download button, excluded from PNG
*/

/* Capture wrapper: structural boundary only, inherits parent styles */
.kc-ticket { position: relative; }

/* Share container below the ticket */
.kc-ticket-share {
  margin-top: 18px;
  display: flex;
  justify-content: center;
}

/* Guardar Pase button */
.kc-ticket-share-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: 'DM Sans', sans-serif;
  font-size: 0.62rem;
  letter-spacing: 0.20em;
  text-transform: uppercase;
  font-weight: 500;
  padding: 11px 20px;
  min-height: 44px;
  border: 1px solid rgba(216,190,122,0.72);
  border-radius: 100px;
  background: linear-gradient(135deg, var(--ls-leather-deep, #2C180D), #1C0E04);
  color: #F7E8B2;
  box-shadow: 0 8px 22px rgba(42,22,8,0.22), inset 0 0 0 1px rgba(250,244,230,0.08);
  cursor: pointer;
  transition: transform 0.25s ease, box-shadow 0.25s ease, opacity 0.2s ease;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
  user-select: none;
  -webkit-user-select: none;
}
.kc-ticket-share-btn svg {
  color: inherit;
}
.kc-ticket-share-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(42,22,8,0.3), inset 0 0 0 1px rgba(250,244,230,0.12);
}
.kc-ticket-share-btn:disabled {
  opacity: 0.6;
  cursor: default;
  transform: none;
  box-shadow: none;
}
.kc-ticket-share-btn:focus-visible {
  outline: 2px solid rgba(216,190,122,0.8);
  outline-offset: 4px;
}
@media (prefers-reduced-motion: reduce) {
  .kc-ticket-share-btn { transition: none; }
}
