/* ══════════════════════════════════════════
   AZULA XV · PUNTA DE PLATA
   Hoja de estudio a punta de plata: papel preparado perla, línea que se oxida,
   hatching zurdo, realce de blanco de plomo. Cero oro.
   core-structure.css queda intacto: aquí solo tokens y piel.
══════════════════════════════════════════ */

@font-face { font-family: 'Calligraphy'; src: url('../../assets/font/calligraphy.woff2') format('woff2'); font-display: swap; }
@font-face { font-family: 'Cinzel'; src: url('../../assets/font/cinzel-regular.woff2') format('woff2'); font-display: swap; }
@font-face { font-family: 'Cormorant Garamond'; src: url('../../assets/font/cormorant-garamond-400-latin.woff2') format('woff2'); font-weight: 300 700; font-display: swap; }
@font-face { font-family: 'Cormorant Garamond'; src: url('../../assets/font/cormorant-garamond-400-italic-latin.woff2') format('woff2'); font-style: italic; font-display: swap; }

:root {
  /* semánticos (doctrina) */
  --color-canvas: #F2EFE8;       /* marfil */
  --color-canvas-deep: #E7E3DA;
  --color-heighten: #F6F3ED;     /* luz del papel */
  --color-ink: #1F1F1F;
  --color-ink-soft: #2B2D30;
  --color-mid: #6B6B6B;          /* solo ≥18px */
  --color-silver: #C9CDD2;       /* plata clara decorativa */
  --color-pale: #C9CDD2;
  --color-action: #2B2D30;
  --color-focus: #1F1F1F;
  --color-plate: #3E4146;
  --color-plate-deep: #4C5056;
  --color-on-plate: #FFFFFF;
  --color-on-plate-secondary: #E3E5E8;
  --silver-1: linear-gradient(180deg, #fefefe 0%, #ffffff 12.5%, #e7e7e7 25%, #c9c9c9 37.5%, #acacac 50%, #8f8e93 62.5%, #717075 75%, #656469 87.5%, #636267 100%);
  --silver-2: linear-gradient(180deg, #676767 0%, #828282 12.5%, #a2a2a2 25%, #c1c1c1 37.5%, #e0e0e0 50%, #fefefe 62.5%, #dddddd 75%, #bababa 87.5%, #9a9a9a 100%);
  --silver-3: linear-gradient(115deg, #D4D6DA 0%, #F1F2EE 28%, #FFFFFF 45%, #F1F2EE 59%, #D4D6DA 78%, #FFFFFF 100%);
  --silver-4: linear-gradient(210deg, #bdbdbf 0%, #dadada 12.5%, #f6f6f6 25%, #dfdfe0 37.5%, #bdbdbd 50%, #9b9b9b 62.5%, #78787a 75%, #5a595e 87.5%, #525156 100%);
  --silver-5: linear-gradient(207deg, #969696 0%, #A3A3A4 12.5%, #B6B6B7 25%, #CCCCCD 37.5%, #E1E1E2 50%, #F8F8F8 62.5%, #E6E6E7 75%, #CFCFD0 87.5%, #B7B7B8 100%);
  --silver-light: linear-gradient(180deg, #FFFFFF 0%, #E9EAEC 52%, #C9CDD2 100%);
  --pdp-paper-color: #ECE7DD;
  /* misma receta que la hoja de la carta: orilla taupe, luz de lectura arriba, tile a 512 (menos nube) */
  --pdp-paper-layers: radial-gradient(ellipse 125% 100% at 46% 42%, transparent 50%, rgba(118,106,94,.22) 100%), radial-gradient(ellipse 70% 55% at 22% 16%, rgba(255,255,255,.42), transparent 100%), url('../../assets/textures/pergamino.webp');
  --pdp-paper-sizes: 100% 100%, 100% 100%, 512px 512px;
  --pdp-paper-shadow: drop-shadow(0 12px 16px rgba(31,31,31,.2));
  --leaf: linear-gradient(115deg, #8A8D91 0%, #E9EAEC 38%, #FFFFFF 46%, #B9BBBE 58%, #6F7276 100%);
  --ivory-background: url('../../assets/textures/construccion-claro.svg'), linear-gradient(rgba(243,239,230,.82), rgba(243,239,230,.82)), url('../../assets/textures/marfil.webp'), linear-gradient(#FFFFFF, #FFFFFF);
  /* velo peltre sobre el marfil: grano fino, sin ondas de agua */
  --plate-background: url('../../assets/textures/construccion-oscuro.svg'), linear-gradient(rgba(76,80,86,.34), rgba(76,80,86,.34)), url('../../assets/textures/marfil.webp'), radial-gradient(ellipse 95% 82% at 50% 38%, #5C6066 0%, #4C5056 56%, #3E4146 100%);
  /* las fuentes vienen cortadas a los lados: la caída lateral llega a cero ANTES del borde de la caja */
  --gown-organic-mask: radial-gradient(ellipse 60% 70% at 50% 42%, #000 58%, transparent 100%), linear-gradient(to bottom, #000 0 74%, transparent 100%), linear-gradient(90deg, transparent 0, #000 16%, #000 84%, transparent 100%);
  --rule: rgba(31, 31, 31, .16);

  --f-name: 'Calligraphy', 'Cormorant Garamond', cursive;
  --f-inscription: 'Cinzel', 'Cormorant Garamond', serif;
  --f-text: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --ease-silver: cubic-bezier(.22, .61, .36, 1);

  /* el skeleton adopta la hoja */
  --kc-font: var(--f-text);
  --kc-bg: var(--color-canvas);
  --kc-surface: transparent;
  --kc-border: var(--rule);
  --kc-text: var(--color-ink);
  --kc-text-muted: var(--color-ink-soft);
  --kc-accent: var(--color-ink-soft);
  --kc-accent-h: var(--color-ink);

  /* el kit de footer/anillo lee estos nombres */
  --ft: var(--f-text);
  --ease-bounce: cubic-bezier(.34, 1.56, .64, 1);
  --ease-out: cubic-bezier(.23, 1, .32, 1);
  --terra: var(--color-mid);
  --terra-l: var(--color-ink-soft);
  --olivo: var(--color-silver);
  --olivo-l: var(--color-mid);
  --olivo-xl: var(--color-ink-soft);
  --crema: var(--color-heighten);
  --oscuro: var(--color-ink);
}

/* ── Marfil: hard-light sobre blanco y velo al 82% dejan el canvas #F2EFE8 con grano σ≈3.9. ── */
html { background: var(--color-canvas); -webkit-text-size-adjust: 100%; }
body {
  background-color: var(--color-canvas);
  background-image: var(--ivory-background);
  background-size: 720px 720px, 100% 100%, 720px 720px, 100% 100%;
  background-position: 50% 50%, center, 50% 50%, center;
  background-repeat: repeat, no-repeat, repeat, no-repeat;
  background-blend-mode: normal, normal, hard-light, normal;
  color: var(--color-ink);
  font-family: var(--f-text);
  font-weight: 500;
  font-size: 1.125rem;
  line-height: 1.55;
  -webkit-tap-highlight-color: transparent;
}
::selection { background: rgba(125, 129, 135, .28); }
:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 4px; }
/* sin destello azul al tocar; el contorno de teclado sigue en :focus-visible */
*, *::before, *::after { -webkit-tap-highlight-color: transparent; }
a, button, label, summary, [role="button"], input, select, textarea { touch-action: manipulation; }
:focus:not(:focus-visible) { outline: none; }
.pdp-hero-study img, .pdp-polaroid img, .pdp-dresscode-art img { -webkit-touch-callout: none; user-select: none; }

.pdp-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ══ GATE: la lámina viva ══ */
#kc-gate {
  background-color: var(--color-canvas);
  background-image: var(--ivory-background);
  background-size: 720px 720px, 100% 100%, 720px 720px, 100% 100%;
  background-position: 50% 42%, center, 50% 50%, center;
  background-repeat: repeat, no-repeat, repeat, no-repeat;
  background-blend-mode: normal, normal, hard-light, normal;
  display: grid;
  grid-template-rows: auto 1fr;
  justify-items: center;
  overflow: hidden;
}
#kc-gate .kc-gate-bg { display: block; position: absolute; inset: 0; background: radial-gradient(120% 90% at 50% 38%, transparent 60%, rgba(76, 80, 86, .08) 100%); }
.pdp-gate-stage {
  position: relative;
  width: min(100vw, 480px, calc((100svh - 275px) * 390 / 560));
  aspect-ratio: 390 / 560;
  margin-top: max(1.5svh, env(safe-area-inset-top));
  transition: transform .9s var(--ease-silver);
}
.pdp-gate-stage canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.pdp-gate-fallback-name {
  display: none;
  position: absolute; left: 0; right: 0; top: 50.4%; transform: translateY(-58%);
  text-align: center; font-family: var(--f-name); font-size: clamp(4rem, 19vw, 6.4rem); color: #5f5b56; line-height: 1;
}
#kc-gate.pdp-name-fallback .pdp-gate-fallback-name { display: block; animation: pdp-tarnish 2.4s 1.2s both var(--ease-silver); }

#kc-gate .kc-gate-content {
  position: relative; z-index: 1;
  align-self: start;
  display: flex; flex-direction: column; align-items: center;
  gap: .9rem;
  padding: 0 1rem max(1.25rem, env(safe-area-inset-bottom));
  text-align: center;
}
#kc-gate .kc-gate-label {
  font-family: var(--f-inscription);
  font-size: .8rem; letter-spacing: .42em; text-indent: .42em;
  color: var(--color-ink-soft);
  animation: pdp-arrive 1.1s 5s both var(--ease-silver);
}
/* sello de plata: hoja metálica en el anillo, monograma grabado dentro */
#kc-gate .kc-gate-cta {
  display: flex; flex-direction: column; align-items: center; gap: .55rem;
  background: none; border: 0; border-radius: 0; padding: .25rem .5rem;
  color: var(--color-ink); cursor: pointer;
  min-height: 44px;
  animation: pdp-arrive 1.1s 5.6s both var(--ease-silver);
}
#kc-gate .kc-gate-cta:hover, #kc-gate .kc-gate-cta:focus-visible { transform: none; }
#kc-gate .kc-gate-cta-icon {
  position: relative;
  display: grid; place-items: center;
  width: 4.6rem; height: 4.6rem; border-radius: 50%;
  background: var(--leaf);
  box-shadow: 0 1px 0 var(--color-heighten) inset, 0 6px 16px -10px rgba(31, 31, 31, .55);
  transition: transform .35s var(--ease-silver), box-shadow .35s;
}
#kc-gate .kc-gate-cta-icon::before {
  content: ''; position: absolute; inset: 4px; border-radius: 50%;
  background: radial-gradient(circle at 34% 30%, #F7F7F5 0%, var(--color-canvas) 60%, #D9D7D1 100%);
}
#kc-gate .kc-gate-cta-icon svg { position: relative; width: 78%; height: 78%; fill: none; stroke: #4a4743; stroke-width: 1.15; stroke-linecap: round; }
#kc-gate .kc-gate-cta-icon svg circle:first-child { stroke: none; }
#kc-gate .kc-gate-cta-icon svg circle + circle { stroke: #8a8e94; stroke-width: .7; stroke-dasharray: 1.5 2.5; }
#kc-gate .kc-gate-cta:active .kc-gate-cta-icon { transform: scale(.95); }
#kc-gate .kc-gate-cta:focus-visible { outline: none; }
#kc-gate .kc-gate-cta:focus-visible .kc-gate-cta-icon { outline: 2px solid var(--color-focus); outline-offset: 5px; }
#kc-gate .kc-gate-cta-text {
  font-family: var(--f-text); font-size: 1.1rem; letter-spacing: .06em; color: var(--color-ink);
}
#kc-gate .kc-gate-credit {
  font-family: var(--f-inscription); font-size: .62rem; letter-spacing: .3em; color: var(--color-ink-soft);
  animation: pdp-arrive 1.1s 6s both var(--ease-silver);
}
#kc-gate.kc-gate-opening .pdp-gate-stage { transform: translateY(-10px) scale(1.015); }
#kc-gate { transition: opacity .7s var(--ease-silver), visibility .7s; }

@keyframes pdp-arrive { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@keyframes pdp-tarnish { from { opacity: 0; color: #a3a7ad; } to { opacity: 1; color: #5f5b56; } }

/* ══ escenas: trazar y patinar ══ */
#kc-main { display: flex; flex-direction: column; }
#kc-hero { order: 0; }
/* Móvil: el hero vive en su propia capa. Sin esto, sus animaciones arrastran a todo lo que viene después (pdp-hero-name medía 390×6111, 21 Mpx a DPR3). */
#kc-hero { will-change: transform; }
#kc-countdown { order: 1; }
#kc-protocol-social { order: 2; }
#kc-event-info { order: 3; }
#kc-itinerary { order: 4; }
#kc-dresscode { order: 5; }
#kc-gifts { order: 6; }
#kc-gallery { order: 7; }
#rsvp { order: 8; }
#kc-capture { order: 9; }
#kc-footer { order: 20; }

/* base sin peso: cada escena manda sobre su propio fondo */
:where(#kc-main) section {
  position: relative;
  padding: 4rem 1.25rem;
  background-color: var(--color-canvas);
  background-image: var(--ivory-background);
  background-size: 720px 720px, 100% 100%, 720px 720px, 100% 100%;
  background-position: 50% 50%, center, 50% 50%, center;
  background-repeat: repeat, no-repeat, repeat, no-repeat;
  background-blend-mode: normal, normal, hard-light, normal;
  color: var(--color-ink-soft);
}
#kc-main .kc-section-inner { width: min(100%, 38rem); margin-inline: auto; }
:where(#kc-main, #kc-main p, #kc-main li) { font-family: var(--f-text); font-weight: 500; }
.kc-section-title {
  color: var(--color-ink);
  font-family: var(--f-text);
  font-size: clamp(1.8rem, 7vw, 2.35rem);
  font-weight: 600;
  line-height: 1.1;
  margin: 0 0 1.5rem;
}
.kc-section-title:not(.pdp-sr)::after {
  --section-rule: var(--color-ink);
  content: '';
  display: block;
  height: 9px;
  margin-top: 1rem;
  background:
    linear-gradient(45deg, transparent 40%, var(--section-rule) 40% 60%, transparent 60%) center / 8px 8px no-repeat,
    linear-gradient(var(--section-rule), var(--section-rule)) left center / calc(50% - 10px) 1px no-repeat,
    linear-gradient(var(--section-rule), var(--section-rule)) right center / calc(50% - 10px) 1px no-repeat;
}
.pdp-sr, .kc-section-title.pdp-sr {
  position: absolute !important; width: 1px !important; height: 1px !important;
  padding: 0 !important; margin: -1px !important; overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important;
}
#kc-main .kc-btn {
  min-height: 44px;
  padding: .7rem 1rem;
  border: 1px solid var(--color-ink);
  border-radius: 2px;
  color: var(--color-action);
  background: transparent;
  font-family: var(--f-inscription);
  font-size: .78rem;
  font-weight: 400;
  letter-spacing: .12em;
  line-height: 1.4;
  text-align: center;
}
#kc-main .kc-btn:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 4px; }
#kc-main .kc-btn:active { scale: .97; background-color: rgba(62, 65, 70, .1); }

/* 1 · Placa de pewter: la silueta vuelve retrato a la construcción */
#kc-hero {
  position: relative;
  isolation: isolate;
  display: grid;
  place-items: center;
  min-height: 100svh;
  overflow: hidden;
  padding: 1rem 1rem 4.5rem;
  color: var(--color-on-plate);
  text-align: center;
  background-color: var(--color-plate);
  background-image: var(--plate-background);
  background-size: 720px 720px, 100% 100%, 720px 720px, 100% 100%;
  background-position: 50% 42%, center, 50% 50%, center;
  background-repeat: repeat, no-repeat, repeat, no-repeat;
  background-blend-mode: normal, normal, soft-light, normal;
}
#kc-hero .kc-hero-bg {
  display: block;
  position: absolute;
  z-index: -1;
  inset: 0;
  background: radial-gradient(ellipse 48% 42% at 50% 37%, rgba(255,255,255,.10) 0%, rgba(255,255,255,.04) 54%, transparent 100%);
}
#kc-hero .kc-hero-content {
  position: relative;
  z-index: 1;
  width: min(100%, 38rem);
  display: flex;
  flex-direction: column;
  align-items: center;
}
.pdp-hero-study {
  position: relative;
  isolation: isolate;
  width: min(87vw, calc(63svh * .562));
  height: 63svh;
  max-height: 38rem;
  margin: 0 auto;
}
.pdp-hero-study::before {
  content: '';
  position: absolute;
  z-index: -2;
  inset: 6% -22% 15%;
  background: radial-gradient(ellipse at 50% 45%, rgba(222,225,229,.18), rgba(143,148,155,.08) 43%, transparent 72%);
}
.pdp-hero-study img {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  object-fit: contain;
  -webkit-mask-image: var(--gown-organic-mask);
  -webkit-mask-repeat: no-repeat, no-repeat;
  -webkit-mask-size: 100% 100%, 100% 100%;
  -webkit-mask-composite: source-in;
          mask-image: var(--gown-organic-mask);
          mask-repeat: no-repeat, no-repeat;
          mask-size: 100% 100%, 100% 100%;
          mask-composite: intersect;
}
.pdp-vitruvian {
  position: absolute;
  z-index: 0;
  inset: -4% -5%;
  width: 110%;
  height: 108%;
  fill: none;
  stroke: url(#pdp-construction-silver);
  stroke-width: .75;
  opacity: .48;
  pointer-events: none;
}
.pdp-hero-study::after {
  content: '';
  position: absolute;
  z-index: 2;
  inset: 0;
  background-image: linear-gradient(108deg, transparent 44%, rgba(255,255,255,.66) 50%, transparent 56%);
  background-size: 300% 100%;
  background-position: 100% 0;
  -webkit-mask-image: url('../../assets/hero/silueta.webp'), var(--gown-organic-mask);
  -webkit-mask-repeat: no-repeat, no-repeat, no-repeat;
  -webkit-mask-size: 100% 100%, 100% 100%, 100% 100%;
  -webkit-mask-composite: source-in, source-in;
          mask-image: url('../../assets/hero/silueta.webp'), var(--gown-organic-mask);
          mask-repeat: no-repeat, no-repeat, no-repeat;
          mask-size: 100% 100%, 100% 100%, 100% 100%;
          mask-composite: intersect, intersect;
  opacity: 0;   /* fuera de la figura no existe: sin esto queda un fantasma estacionado a la izquierda */
  mix-blend-mode: soft-light;
  pointer-events: none;
}
body.kc-gate-unlocked #kc-hero .pdp-hero-study::after { animation: pdp-silhouette-sweep 1.6s 1.35s ease-out 1 both; }
@keyframes pdp-silhouette-sweep {
  0% { background-position: 100% 0; opacity: 0; }
  12%, 78% { opacity: .42; }
  100% { background-position: 0 0; opacity: 0; }
}
#kc-hero-label {
  margin: -1.6rem 0 .1rem;   /* fuera de la falda que se disuelve: se lee sobre peltre, no sobre el vestido */
  color: var(--color-on-plate);
  font-family: var(--f-inscription);
  font-size: .78rem;
  font-weight: 400;
  letter-spacing: .22em;
}
/* Hoja de plata sobre la letra del nombre: único texto metálico de la invitación (material, no jerarquía). */
.pdp-hero-name {
  margin: 0;
  padding: 0 .08em;
  color: #FFFFFF;
  font-family: var(--f-name);
  font-size: clamp(4.6rem, 22vw, 7.5rem);
  font-weight: 400;
  line-height: .78;
  background: var(--silver-3);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  filter: drop-shadow(0 1px 1.5px rgba(31,31,31,.45));
}
@supports not (background-clip: text) {
  .pdp-hero-name { color: #FFFFFF; -webkit-text-fill-color: #FFFFFF; }
}
#kc-hero .kc-hero-title {
  max-width: 24rem;
  margin: .65rem 0 .5rem;
  color: var(--color-on-plate);
  font-family: var(--f-inscription);
  font-size: clamp(.88rem, 3.2vw, 1.05rem);
  font-weight: 400;
  letter-spacing: .13em;
  line-height: 1.55;
  text-transform: uppercase;
}
#kc-hero .kc-hero-date { color: var(--color-on-plate); font-size: 1.3rem; line-height: 1.2; }
#kc-hero .kc-hero-venue { margin-top: .2rem; color: var(--color-on-plate-secondary); font-size: 1.15rem; font-style: italic; line-height: 1.25; }
#kc-hero .kc-scroll-hint {
  position: absolute;
  bottom: max(1rem, env(safe-area-inset-bottom));
  left: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .45rem;
  color: var(--color-on-plate-secondary);
  font-family: var(--f-inscription);
  font-size: .78rem;
  letter-spacing: .14em;
  transform: none;
  translate: -50% 0;
}
#kc-hero .kc-scroll-hint::after {
  content: '';
  width: 1px;
  height: 2rem;
  background: linear-gradient(var(--silver-4));
}

/* 2 · Banda de plata pulida con grano fino sobre el reflejo. */
#kc-countdown {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: 2.1rem 1.25rem;
  color: var(--color-ink);
  background-color: #B6B6B7;
  background-image: url('../../assets/textures/construccion-claro.svg'), url('../../assets/textures/marfil.webp'), var(--silver-5);
  background-size: 720px 720px, 720px 720px, 100% 100%;
  background-position: 50% 38%, 50% 50%, center;
  background-repeat: repeat, repeat, no-repeat;
  background-blend-mode: normal, soft-light, normal;
}
#kc-countdown .kc-section-inner { position: relative; z-index: 1; width: min(100%, 40rem); text-align: center; }
#kc-countdown .kc-section-title { margin: 0; }
#kc-countdown .kc-countdown-date {
  margin: 0 auto .6rem;
  color: var(--color-ink);
  font-family: var(--f-inscription);
  font-size: .78rem;
  font-weight: 400;
  letter-spacing: .02em;
  line-height: 1.4;
}
#kc-countdown .kc-countdown-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  margin: .55rem 0 0;
}
#kc-countdown .kc-unit {
  min-width: 0;
  padding: .1rem .15rem;
  border-right: 1px solid rgba(31,31,31,.42);
}
#kc-countdown .kc-unit:last-child { border-right: 0; }
#kc-countdown .kc-num {
  color: var(--color-ink);
  font-family: var(--f-inscription);
  font-size: clamp(2.6rem, 10vw, 3.7rem);
  font-weight: 400;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}
#kc-countdown .kc-unit-label {
  display: block;
  margin-top: .35rem;
  color: var(--color-ink);
  font-family: var(--f-inscription);
  font-size: .78rem;
  font-weight: 400;
  letter-spacing: .03em;
  line-height: 1.2;
}
#kc-countdown .kc-unit:nth-child(3) .kc-unit-label { font-size: .78rem; }
#kc-countdown::after {
  content: '';
  position: absolute;
  z-index: -1;
  top: -45%;
  bottom: -45%;
  left: -32%;
  width: 24%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.62), transparent);
  transform: skewX(-22deg);
  pointer-events: none;
}
#kc-countdown.is-traced::after { animation: pdp-band-sheen 1.6s ease-out 1 both; }
@keyframes pdp-band-sheen { to { left: 112%; } }

/* 3 · Dedicatoria con una sola rúbrica de grafito */
#kc-protocol-social {
  text-align: center;
  background-position: 38% 18%, center, 28% 20%, center;
}
#kc-protocol-social .kc-section-title::after { width: min(100%, 20rem); margin-inline: auto; }
.pdp-dedication-copy {
  max-width: 31rem;
  margin: 0 auto;
  color: var(--color-ink-soft);
  font-size: 1.3rem;
  font-style: italic;
  line-height: 1.45;
}
.pdp-rubric {
  display: block;
  width: min(11rem, 45vw);
  height: 1px;
  margin: 1.5rem auto .7rem;
  background: linear-gradient(90deg, transparent, #6B6B6B 18%, #B7B7B7 52%, #2B2D30 82%, transparent);
}
.pdp-dedication-signature { color: var(--color-ink); font-family: var(--f-name) !important; font-size: 2.6rem; line-height: 1; }
.pdp-family-signature { margin-top: 1.4rem; }
#kc-protocol-social .kc-card-title {
  margin: 0 0 .15rem;
  color: var(--color-ink);
  font-family: var(--f-inscription);
  font-size: .78rem;
  font-weight: 400;
  letter-spacing: .09em;
  line-height: 1.5;
}
#kc-family-parents, #kc-family-godparents { color: var(--color-ink); font-size: 1.35rem; font-weight: 600; line-height: 1.35; }

/* 4 · Dos estudios pequeños orientan la llegada */
#kc-event-info { padding-block: 3.6rem !important; background-position: 76% 48%, center, 62% 18%, center; }
#kc-event-info .kc-section-inner { width: min(100%, 55rem); max-width: none; } /* el skeleton capa a 640px; aquí manda el ancho de la escena */
#kc-event-info .kc-section-title { margin-bottom: 1.6rem; }
#kc-event-info .kc-cards-grid { display: grid; grid-template-columns: 1fr; gap: 0; }
#kc-event-info .kc-card {
  position: relative;
  display: grid;
  grid-template-columns: 104px minmax(0, 1fr);
  grid-template-rows: auto auto auto;
  align-items: center;
  justify-items: start;
  gap: .3rem .95rem;
  padding: 1.9rem 0;
  border: 0;
  border-bottom: 1px solid #B7B7B7;
  border-radius: 0;
  background: transparent;
  text-align: left;
}
#kc-event-info .kc-card:last-child { border-bottom: 0; }
#kc-event-info .kc-card::before {
  content: '';
  display: block;
  grid-column: 1;
  grid-row: 1 / 4;
  width: 104px;
  aspect-ratio: 1;
  margin: 0;
  background: center / contain no-repeat;
}
#kc-event-info .kc-card:nth-child(1)::before { background-image: url('../../assets/studies/arch.webp'); }
#kc-event-info .kc-card:nth-child(2)::before { background-image: url('../../assets/studies/branch.webp'); }
#kc-event-info .pdp-event-time {
  grid-column: 2;
  color: var(--color-ink);
  font-family: var(--f-inscription);
  font-size: .9rem;
  font-weight: 400;
  letter-spacing: .1em;
  line-height: 1.4;
}
#kc-event-info .kc-card-title { grid-column: 2; color: var(--color-ink); font-family: var(--f-text); font-size: 1.4rem; font-weight: 600; line-height: 1.15; }
#kc-event-info .kc-btn { grid-column: 2; justify-self: stretch; width: 100%; min-height: 44px; padding: .85rem .8rem; color: var(--color-ink); font-size: .82rem; letter-spacing: .05em; line-height: 1.3; }

/* 5 · Programa: grabado centrado, con un solo punto entre actos */
#kc-itinerary {
  background-color: var(--color-plate);
  background-image: var(--plate-background);
  background-size: 720px 720px, 100% 100%, 720px 720px, 100% 100%;
  background-position: 32% 46%, center, 62% 50%, center;
  background-repeat: repeat, no-repeat, repeat, no-repeat;
  background-blend-mode: normal, normal, soft-light, normal;
  color: var(--color-on-plate);
}
#kc-itinerary .kc-section-inner { width: min(100%, 60rem); }
#kc-itinerary .kc-section-title { color: var(--color-on-plate); }
#kc-itinerary .kc-section-title::after { display: none; }
#kc-itinerary .kc-itinerary-toggle-wrap { position: relative; margin: 0; }
/* programa abierto siempre: el toggle del skeleton se queda en el DOM pero fuera del foco */
#kc-itinerary .kc-itinerary-toggle { display: none; }
#kc-itinerary .kc-itinerary-body { display: block; padding: 0; }
#kc-itinerary .kc-timeline {
  display: grid;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}
#kc-itinerary .kc-timeline li {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .12rem;
  min-height: 0;
  padding: .35rem 0 1.45rem;
  text-align: center;
}
#kc-itinerary .kc-timeline li:not(:last-child)::after {
  content: '';
  width: 5px;
  height: 5px;
  margin-top: 1.35rem;
  background: #E9EAEC;
  transform: rotate(45deg);
}
.pdp-icon {
  display: block;
  width: 32px;
  height: 32px;
  flex: none;
  background: var(--color-plate-deep);
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: contain;
          mask-size: contain;
}
.pdp-icon--misa { -webkit-mask-image: url('../../assets/studies/arch.webp'); mask-image: url('../../assets/studies/arch.webp'); }
.pdp-icon--recepcion { -webkit-mask-image: url('../../assets/icons/recepcion.svg'); mask-image: url('../../assets/icons/recepcion.svg'); }
.pdp-icon--vals { -webkit-mask-image: url('../../assets/icons/vals.svg'); mask-image: url('../../assets/icons/vals.svg'); }
.pdp-icon--cena { -webkit-mask-image: url('../../assets/icons/cena.svg'); mask-image: url('../../assets/icons/cena.svg'); }
.pdp-icon--brindis { -webkit-mask-image: url('../../assets/icons/brindis.svg'); mask-image: url('../../assets/icons/brindis.svg'); }
.pdp-icon--fiesta { -webkit-mask-image: url('../../assets/icons/fiesta.svg'); mask-image: url('../../assets/icons/fiesta.svg'); }
#kc-itinerary .pdp-icon { width: 80px; height: 80px; margin-bottom: .15rem; background: var(--silver-light); }
#kc-itinerary .pdp-icon.is-inline { position: relative; overflow: visible; background: none; -webkit-mask: none; mask: none; }
.pdp-icon-line, .pdp-icon-wash { position: absolute; inset: 0; display: block; }
.pdp-icon-line { z-index: 2; }
.pdp-icon-line svg, .pdp-icon-wash svg { display: block; width: 100%; height: 100%; overflow: visible; }
.pdp-icon-line path { fill: none; stroke-linecap: round; stroke-linejoin: round; }
.pdp-icon-wash { z-index: 1; pointer-events: none; }
#kc-itinerary .pdp-timeline-copy { display: flex; flex-direction: column; align-items: center; width: min(100%, 34rem); }
.pdp-copy-mask { display: block; overflow: hidden; width: 100%; }
.pdp-copy-rise { display: inline-block; }
.pdp-hero-line-mask { display: block; overflow: hidden; line-height: inherit; }
.pdp-hero-line-rise { display: inline-block; max-width: 100%; }
.pdp-timeline-time { color: var(--color-on-plate); font-family: var(--f-inscription) !important; font-size: 1.9rem; font-weight: 400; font-variant-numeric: tabular-nums; line-height: 1.1; }
.pdp-timeline-title { margin-top: .15rem; color: var(--color-on-plate); font-size: 1.35rem; font-weight: 600 !important; line-height: 1.2; }
.pdp-timeline-place { margin-top: .2rem; color: var(--color-on-plate-secondary); font-size: 1.1rem; line-height: 1.35; }
#kc-itinerary-pending { color: var(--color-on-plate); font-size: 1.1rem; }

/* 6 · El protocolo queda escrito sobre pergamino preparado. */
#kc-dresscode {
  overflow: hidden;   /* el halo respira más allá de la figura, nunca más allá del viewport */
  background-position: 26% 32%, center, 88% 27%, center;
}
#kc-dresscode .kc-section-inner { width: min(100%, 48rem); }
.pdp-dresscode-layout { display: grid; grid-template-columns: 1fr; gap: 0; align-items: center; }
.pdp-dresscode-art {
  position: relative;
  isolation: isolate;
  width: min(58vw, 17rem);
  aspect-ratio: 720 / 1279;
  justify-self: center;
  margin: 0;
}
.pdp-dresscode-art::after {
  content: '';
  position: absolute;
  z-index: -1;
  inset: -12% -32% -4%;
  background: radial-gradient(ellipse 68% 64% at 50% 45%, rgba(62,65,70,.22), rgba(62,65,70,.08) 42%, transparent 75%);
  pointer-events: none;
}
.pdp-dresscode-art img {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  -webkit-mask-image: var(--gown-organic-mask);
  -webkit-mask-repeat: no-repeat, no-repeat;
  -webkit-mask-size: 100% 100%, 100% 100%;
  -webkit-mask-composite: source-in;
          mask-image: var(--gown-organic-mask);
          mask-repeat: no-repeat, no-repeat;
          mask-size: 100% 100%, 100% 100%;
          mask-composite: intersect;
}
.pdp-dresscode-copy {
  position: relative;
  z-index: 2;
  margin: -2.3rem .25rem 0;
  padding: 1.65rem 1.5rem 1.5rem;
  border-radius: 3px 7px 4px 6px / 6px 3px 7px 4px;
  background-color: var(--pdp-paper-color);
  background-image: var(--pdp-paper-layers);
  background-size: var(--pdp-paper-sizes);
  color: #1F1F1F;
  filter: var(--pdp-paper-shadow);
  text-align: center;
  font-size: 1.2rem;
  line-height: 1.4;
  rotate: -1.5deg;
}
.pdp-dresscode-copy::before, .pdp-dresscode-copy::after { content: ''; position: absolute; inset: 9px; pointer-events: none; }
.pdp-dresscode-copy::before { border: 1px solid rgba(31,31,31,.22); box-shadow: inset 0 0 0 2px var(--pdp-paper-color), inset 0 0 0 3px rgba(201,205,210,.7); }
.pdp-dresscode-copy::after {
  inset: 5px;
  background:
    linear-gradient(#5C6066,#5C6066) left top / 9px 1px no-repeat,
    linear-gradient(#5C6066,#5C6066) left top / 1px 9px no-repeat,
    linear-gradient(#5C6066,#5C6066) right top / 9px 1px no-repeat,
    linear-gradient(#5C6066,#5C6066) right top / 1px 9px no-repeat,
    linear-gradient(#5C6066,#5C6066) left bottom / 9px 1px no-repeat,
    linear-gradient(#5C6066,#5C6066) left bottom / 1px 9px no-repeat,
    linear-gradient(#5C6066,#5C6066) right bottom / 9px 1px no-repeat,
    linear-gradient(#5C6066,#5C6066) right bottom / 1px 9px no-repeat;
}
.pdp-dresscode-copy > p + p { margin-top: .25rem; }
.pdp-dresscode-copy > p span:first-child { color: #1F1F1F; font-weight: 600; font-variant: small-caps; letter-spacing: .04em; }
.pdp-dresscode-theme { margin-bottom: .7rem; color: #1F1F1F; font-family: var(--f-inscription) !important; font-size: 1.3rem; letter-spacing: .16em; }
.pdp-dresscode-avoid { margin-top: .85rem !important; color: #1F1F1F; font-style: italic; }
#kc-dresscode-pending { margin-top: .7rem; color: #1F1F1F; font-style: italic; }

/* 7–8 · Regalos grandes y fotografías de estudio */
#kc-gifts, #kc-gallery {
  padding-top: 2.4rem !important;
  padding-bottom: 2.4rem !important;
  background-position: 22% 60%, center, 58% 74%, center;
}
#kc-gifts .kc-section-title, #kc-gallery .kc-section-title { font-size: 1.65rem; margin-bottom: .8rem; }
#kc-gifts .kc-section-title::after, #kc-gallery .kc-section-title::after { margin-top: .55rem; }
#kc-gifts { min-height: 540px; padding-block: 3.4rem 4.5rem !important; overflow: hidden; }
#kc-gifts .kc-section-inner { width: min(100%, 38rem); }
.pdp-gift-scene { position: relative; width: min(100%, 27rem); height: 380px; margin: .5rem auto 1.2rem; }
.pdp-gift-box, .pdp-envelope { position: absolute; display: block; }
.pdp-gift-box { left: 50%; bottom: 0; width: 196px; height: 218px; translate: -50% 0; }
.pdp-envelope { z-index: 1; width: 128px; height: 128px; }
.pdp-envelope:nth-of-type(2) { top: 6px; left: 0; rotate: -13deg; }
.pdp-envelope:nth-of-type(3) { top: 0; right: 0; width: 146px; height: 146px; rotate: 14deg; }
.pdp-envelope:nth-of-type(4) { top: 64px; left: 50%; width: 112px; height: 112px; margin-left: -56px; rotate: -3deg; }
.pdp-gift-mark .pdp-icon-line, .pdp-gift-mark .pdp-icon-wash { position: absolute; inset: 0; display: block; }
.pdp-gift-mark .pdp-icon-line { z-index: 2; }
.pdp-gift-mark svg { display: block; width: 100%; height: 100%; overflow: visible; }
.pdp-gift-mark { --pdp-line-px: 1.7; }
.pdp-gift-mark .pdp-icon-line path { fill: none; stroke: #3E4146; stroke-linecap: round; stroke-linejoin: round; }
/* el sobre de la carta: cuerpo en plata clara y corazón en plata media, como en el Gate */
.pdp-gift-mark.pdp-envelope .pdp-icon-line path:first-child { fill: rgba(233,234,236,.88); }
.pdp-gift-mark.pdp-envelope .pdp-icon-line path:last-child { fill: #C9CDD2; }
.pdp-gift-mark .pdp-icon-wash { z-index: 1; clip-path: none; }
.pdp-gift-mark .pdp-icon-wash svg { overflow: visible; }
.pdp-gift-copy { max-width: 28ch; margin: 0 auto; text-align: center; }
#kc-gifts-note, #kc-gifts-pending { color: #2B2D30; font-size: 1.25rem; line-height: 1.45; }
#kc-gifts-pending { margin-top: .5rem; font-style: italic; }
#kc-gallery .kc-card-stack-wrap { display: block; }
#kc-gallery-pending { color: var(--color-ink); font-size: 1.1rem; font-style: italic; }
.pdp-polaroids { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; width: 100%; padding: 1rem .9rem; }
.pdp-polaroid {
  position: relative;
  min-width: 0;
  margin: 0;
  padding: 5px 5px 20px;
  border-radius: 3px 6px 4px 5px / 5px 3px 6px 4px;
  background-color: #F4F1EA;
  background-image: var(--pdp-paper-layers);
  background-size: var(--pdp-paper-sizes);
  filter: drop-shadow(0 7px 9px rgba(31,31,31,.2));
  rotate: var(--pdp-rest-rotation, 0deg);
}
.pdp-polaroid:nth-child(1) { --pdp-rest-rotation: -4deg; }
.pdp-polaroid:nth-child(2) { --pdp-rest-rotation: 3deg; }
.pdp-polaroid:nth-child(3) { --pdp-rest-rotation: 2deg; }
.pdp-polaroid:nth-child(4) { --pdp-rest-rotation: -3deg; }
.pdp-polaroid:nth-child(2), .pdp-polaroid:nth-child(4) { margin-left: -.3rem; z-index: 1; }
.pdp-polaroid:nth-child(3), .pdp-polaroid:nth-child(4) { margin-top: -.45rem; }
.pdp-polaroid img { display: block; width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; filter: none; }
.pdp-polaroid-frame { position: absolute; z-index: 1; inset: 0; width: 100%; height: 100%; pointer-events: none; overflow: visible; }
.pdp-polaroid-frame rect { fill: none; stroke: #5C6066; stroke-width: .8; }
.pdp-polaroid::after { content: ''; position: absolute; z-index: 2; top: 3px; right: 3px; width: 10px; height: 10px; border-top: 1px solid rgba(31,31,31,.5); border-right: 1px solid rgba(31,31,31,.5); }
.pdp-polaroid figcaption { min-height: 1.8em; padding-top: .35rem; color: #2B2D30; font-family: var(--f-name) !important; font-size: clamp(1.15rem, 5vw, 1.65rem); line-height: 1.05; text-align: center; white-space: nowrap; }

/* 9 · KC-RSVP Diamond: vive en kc-rsvp-diamond.css */
#rsvp { background-position: 84% 18%, center, 36% 50%, center; }

/* 10 · La firma vuelve a la placa */
#kc-footer {
  position: relative;
  padding: 3.5rem 1.25rem max(3rem, env(safe-area-inset-bottom));
  border-top: 1px solid #C9CDD2;
  background-color: var(--color-plate);
  background-image: var(--plate-background);
  background-size: 720px 720px, 100% 100%, 720px 720px, 100% 100%;
  background-position: 68% 42%, center, 38% 50%, center;
  background-repeat: repeat, no-repeat, repeat, no-repeat;
  background-blend-mode: normal, normal, soft-light, normal;
  color: var(--color-on-plate);
}
#kc-footer .footer-divider::before, #kc-footer .footer-divider::after { background: linear-gradient(to right, transparent, #E9EAEC); opacity: 1; }
#kc-footer .footer-divider::after { background: linear-gradient(to left, transparent, #E9EAEC); }
#kc-footer .footer-divider img { display: block; width: 7.5rem; height: auto; filter: invert(1) brightness(.85); }
#kc-footer .footer-sello, #kc-footer .footer-sello .nombre-dedicado, #kc-footer .footer-sello .lugar-fecha { animation: none; }
#kc-footer .footer-sello { color: var(--color-on-plate-secondary); font-family: var(--f-inscription); font-size: .78rem; letter-spacing: .12em; }
#kc-footer .footer-sello .nombre-dedicado { color: var(--color-on-plate); letter-spacing: .12em; }
#kc-footer .footer-sello .lugar-fecha { color: var(--color-on-plate-secondary); }
#kc-footer .footer-brand { min-height: 44px; color: var(--color-on-plate); }
#kc-footer .footer-brand-text { color: var(--color-on-plate); font-family: var(--f-text); }
#kc-footer .footer-brand:hover .footer-brand-text { color: #FFFFFF; text-shadow: none; }
#kc-footer .footer-brand::after { background: var(--silver-light); animation: none; }
#kc-footer .footer-brand .ig-ico { color: var(--color-on-plate-secondary); opacity: 1; animation: none; }
#kc-footer .footer-brand-text::after { display: none; animation: none; }

/* ══ Mensaje secreto: un corazón de plata que flota; al tocarlo, se abre la tarjeta de pergamino ══ */
#kc-secret { order: 10; }
#kc-secret {
  background-position: 18% 72%, center, 78% 34%, center;
  padding-block: 3.4rem 3.8rem;
  text-align: center;
}
#kc-secret .kc-section-inner { display: grid; place-items: center; }
#kc-secret .kc-secret-trigger, #kc-secret .pdp-secret-live { grid-area: 1 / 1; }
#kc-secret .kc-secret-trigger {
  position: relative;
  isolation: isolate;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .5rem;
  min-width: 44px;
  min-height: 44px;
  margin: 0;
  padding: .6rem 1rem;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
  color: #2B2D30;
  cursor: pointer;
  transform-origin: 50% 40%;
  transition: transform .5s var(--ease-silver), opacity .5s var(--ease-silver);
}
#kc-secret .kc-secret-trigger::before {
  content: '';
  position: absolute;
  z-index: -1;
  left: 50%;
  top: -1.6rem;
  width: 8rem;
  height: 8rem;
  translate: -50% 0;
  background: radial-gradient(closest-side, rgba(255,255,255,.9), rgba(201,205,210,.5) 52%, rgba(201,205,210,0) 100%);
  pointer-events: none;
}
#kc-secret .pdp-secret-heart {
  position: relative;
  display: block;
  width: 84px;
  height: 73px;
  overflow: visible;
  filter: drop-shadow(0 4px 6px rgba(31,31,31,.22));
  transform-origin: 50% 80%;
  animation: pdp-secret-float 4s ease-in-out infinite;
}
#kc-secret .kc-secret-trigger:active .pdp-secret-heart { scale: .97; }
#kc-secret .pdp-secret-cta {
  color: #2B2D30;
  font-family: var(--f-text);
  font-size: 1.15rem;
  font-style: italic;
  font-weight: 500;
  line-height: 1.2;
}
#kc-secret .kc-secret-trigger[aria-expanded="true"] {
  transform: scale(.4);
  opacity: 0;
  pointer-events: none;
  transition: transform .35s var(--ease-silver), opacity .35s var(--ease-silver);
}
@keyframes pdp-secret-float {
  0%, 100% { transform: translateY(0) rotate(-3deg); }
  50% { transform: translateY(-7px) rotate(3deg); }
}
#kc-secret .kc-secret-msg {
  position: relative;
  box-sizing: border-box;
  width: min(100%, 22rem);
  margin: 0 auto;
  padding: 2rem 1.6rem 2.3rem;
  border: 0;
  border-radius: 3px 7px 4px 6px / 6px 3px 7px 4px;
  background-color: var(--pdp-paper-color);
  background-image: var(--pdp-paper-layers);
  background-size: var(--pdp-paper-sizes);
  box-shadow: none;
  color: #1F1F1F;
  filter: var(--pdp-paper-shadow);
  text-align: center;
  transform-origin: 50% 30%;
  animation: pdp-secret-rise .7s var(--ease-silver) both;
}
#kc-secret .kc-secret-msg::before {
  content: '';
  position: absolute;
  inset: 9px;
  border: 1px solid rgba(31,31,31,.22);
  box-shadow: inset 0 0 0 2px var(--pdp-paper-color), inset 0 0 0 3px rgba(201,205,210,.7);
  pointer-events: none;
}
#kc-secret .pdp-secret-kicker {
  margin: 0 0 1rem;
  color: #2B2D30;
  font-family: var(--f-inscription);
  font-size: .8rem;
  font-weight: 400;
  letter-spacing: .22em;
  text-indent: .22em;
  line-height: 1.4;
}
#kc-secret .kc-secret-msg blockquote {
  margin: 0;
  color: #1F1F1F;
  font-family: var(--f-text);
  font-size: 1.3rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.45;
}
#kc-secret .kc-secret-firma {
  margin: 1.1rem 0 0;
  color: #2B2D30;
  font-family: var(--f-name);
  font-size: 2.6rem;
  font-style: normal;
  line-height: 1;
}
#kc-secret .pdp-secret-timer {
  position: absolute;
  left: 1.6rem;
  right: 1.6rem;
  bottom: 1rem;
  height: 1px;
  background: linear-gradient(90deg, #C9CDD2, #5C6066, #C9CDD2);
  transform-origin: 0 50%;
  animation: pdp-secret-drain 13s linear both;
}
@keyframes pdp-secret-rise {
  0% { opacity: 0; transform: rotate(-4deg) translateY(16px); }
  20% { opacity: 1; }
  100% { opacity: 1; transform: rotate(-1deg) translateY(0); }
}
@keyframes pdp-secret-drain { from { transform: scaleX(1); } to { transform: scaleX(0); } }
@media (prefers-reduced-motion: reduce) {
  #kc-secret .pdp-secret-heart, #kc-secret .kc-secret-msg, #kc-secret .pdp-secret-timer { animation: none; }
  #kc-secret .kc-secret-trigger, #kc-secret .kc-secret-trigger[aria-expanded="true"] { transition: none; }
}

/* Trazado progresivo: los nodos solo se revelan tras abrir el Gate. */
[data-pdp-trace] { position: relative; }
#kc-countdown::after { z-index: 0; }
#kc-itinerary .kc-timeline li > * { position: relative; z-index: 1; }

@media (min-width: 760px) {
  #kc-hero { min-height: 100svh; padding: 2rem 3rem; text-align: left; }
  #kc-hero .kc-hero-content {
    width: min(100%, 76rem);
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(20rem, .95fr);
    grid-template-rows: 1fr repeat(5, auto) 1fr;
    align-content: center;
    justify-items: start;
    column-gap: clamp(2rem, 5vw, 5.5rem);
  }
  .pdp-hero-study { grid-column: 1; grid-row: 1 / -1; width: min(42vw, calc(80svh * .562)); height: 80svh; max-height: 50rem; }
  #kc-hero-label { grid-column: 2; grid-row: 2; margin: 0 0 .7rem; }
  .pdp-hero-name { grid-column: 2; grid-row: 3; font-size: clamp(6rem, 10vw, 9rem); }
  #kc-hero .kc-hero-title { grid-column: 2; grid-row: 4; text-align: left; max-width: 35rem; font-size: clamp(1.1rem, 1.7vw, 1.45rem); }
  #kc-hero .kc-hero-date { grid-column: 2; grid-row: 5; font-size: 1.55rem; }
  #kc-hero .kc-hero-venue { grid-column: 2; grid-row: 6; font-size: 1.3rem; }
  #kc-hero .kc-scroll-hint { left: auto; right: 3rem; bottom: 2rem; transform: none; translate: none; }
  :where(#kc-main) section { padding: 5.5rem 2rem; }
  #kc-event-info .kc-cards-grid { grid-template-columns: 1fr 1fr; gap: 1.5rem; }
  #kc-event-info .kc-card { min-width: 0; grid-template-columns: 128px minmax(0, 1fr); gap: .3rem 1.2rem; padding: 2.2rem 0; }
  #kc-event-info .kc-card::before { width: 128px; }
  #kc-event-info .pdp-event-time { font-size: 1rem; }
  #kc-event-info .kc-card-title { font-size: 1.65rem; }
  #kc-event-info .kc-btn { font-size: .88rem; padding: .9rem 1rem; }
  #kc-itinerary .kc-timeline { grid-template-columns: minmax(0, 1fr); }
  .pdp-dresscode-layout { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 3rem; }
  .pdp-dresscode-art { width: min(100%, 20rem); }
  .pdp-dresscode-copy { margin: 0; }
  .pdp-polaroids { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.1rem; padding: 1rem .4rem; }
  .pdp-polaroid { padding: 7px 7px 26px; }
  .pdp-polaroid:nth-child(n) { margin: 0; }
  .pdp-polaroid figcaption { font-size: clamp(1.2rem, 2.2vw, 1.6rem); }
}

@media (prefers-reduced-motion: reduce) {
  #kc-gate .kc-gate-label, #kc-gate .kc-gate-cta, #kc-gate .kc-gate-credit, #kc-gate.pdp-name-fallback .pdp-gate-fallback-name { animation: none; }
  .pdp-gate-stage, #kc-gate { transition: opacity .3s linear, visibility .3s; }
  #kc-gate.kc-gate-opening .pdp-gate-stage { transform: none; }
  body.kc-gate-unlocked #kc-hero .pdp-hero-study::after { animation: none; }
  #kc-countdown.is-traced::after { animation: none; }
  #kc-main .kc-btn::after { transition: none; }
  #kc-footer .footer-reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
  #kc-footer .footer-brand::after, #kc-footer .footer-brand .ig-ico, #kc-footer .footer-brand-text::after { animation: none !important; }
}

/* ══ KC-Echoes: cámara de plata con guilloché que levita; el álbum se abre el día del evento ══ */
#kc-capture { padding-block: 3rem 3.4rem; text-align: center; }
#kc-capture .pdp-echoes-float { width: 150px; margin: 0 auto 1.1rem; animation: kc-echoes-levita 4.6s ease-in-out infinite; }
#kc-capture .pdp-echoes-cam { display: block; width: 100%; height: auto; overflow: visible; filter: drop-shadow(0 8px 10px rgba(31, 31, 31, .22)); }
@keyframes kc-echoes-levita { 0%, 100% { transform: translateY(0) rotate(-1deg); } 50% { transform: translateY(-6px) rotate(1deg); } }
.pdp-echoes-eyebrow { margin: 0 0 .5rem; font-family: var(--f-inscription) !important; font-size: .78rem; letter-spacing: .24em; text-transform: uppercase; color: var(--color-ink-soft); }
.pdp-echoes-copy { max-width: 30ch; margin: 0 auto 1.3rem; color: var(--color-ink-soft); font-size: 1.25rem; line-height: 1.45; }
#kc-main .pdp-echoes-btn:disabled { cursor: not-allowed; opacity: .8; }
@media (prefers-reduced-motion: reduce) { #kc-capture .pdp-echoes-float { animation: none; } }