/* ============================================================
   Tema «nube» · Inolvidia — demo babyshower-nube («Nubecita»)
   Cielo pastel de tarde: nube, salvia, durazno, cielo y arena.
   Tipos: Fraunces con el eje SOFT al máximo (títulos redondeados, cursiva para nombres)
   + Quicksand para el texto. Cada sección asoma con un borde de nube, los globos
   suben despacio por la pantalla (.inv-fx) y la intro «confetti» cuelga un móvil de cuna.
   Todo acotado bajo html[data-theme="nube"] y solo con clases públicas del motor.
   ============================================================ */

:root {
  /* — contrato §5 — */
  --bg: #F5F3EF;
  --bg-alt: #E9F1F8;
  --surface: #FFFFFF;
  --ink: #33413F;
  --ink-soft: #5A6764;
  --accent: #56704F;
  --accent-2: #F6C6A8;
  --accent-ink: #FFFFFF;
  --line: rgba(51, 65, 63, .12);
  --font-display: 'Fraunces', Georgia, 'Times New Roman', serif;
  --font-script: 'Fraunces', Georgia, 'Times New Roman', serif;
  --font-body: 'Quicksand', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --radius: 28px;
  --shadow: 0 22px 44px -26px rgba(76, 104, 128, .5);
  --hero-overlay: linear-gradient(180deg, rgba(40, 52, 58, .2) 0%, rgba(40, 52, 58, .06) 32%, rgba(40, 52, 58, .6) 70%, rgba(40, 52, 58, .84) 100%);
  --hero-ink: #FFFFFF;
  --intro-bg: #DCEAF4;
  --intro-ink: #33413F;
  --seal: #A8BBA2;
  /* estrellitas y puntos en durazno, arena, cielo y salvia */
  --pattern: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300' viewBox='0 0 300 300'%3E%3Cpath d='M44,43c0,4.9 1.96,7 6.02,7c-4.06,0 -6.02,2.1 -6.02,7c0,-4.9 -1.96,-7 -6.02,-7c4.06,0 6.02,-2.1 6.02,-7z' fill='%23F6C6A8' fill-opacity='0.75'/%3E%3Cpath d='M214,141c0,3.5 1.4,5 4.3,5c-2.9,0 -4.3,1.5 -4.3,5c0,-3.5 -1.4,-5 -4.3,-5c2.9,0 4.3,-1.5 4.3,-5z' fill='%23D9C3A5' fill-opacity='0.8'/%3E%3Cpath d='M122,250c0,4.2 1.68,6 5.16,6c-3.48,0 -5.16,1.8 -5.16,6c0,-4.2 -1.68,-6 -5.16,-6c3.48,0 5.16,-1.8 5.16,-6z' fill='%23BFD7EA' fill-opacity='0.85'/%3E%3Cpath d='M262,33.6c0,3.08 1.23,4.4 3.78,4.4c-2.55,0 -3.78,1.32 -3.78,4.4c0,-3.08 -1.23,-4.4 -3.78,-4.4c2.55,0 3.78,-1.32 3.78,-4.4z' fill='%23A8BBA2' fill-opacity='0.7'/%3E%3Cpath d='M78,168.4c0,2.52 1.01,3.6 3.1,3.6c-2.09,0 -3.1,1.08 -3.1,3.6c0,-2.52 -1.01,-3.6 -3.1,-3.6c2.09,0 3.1,-1.08 3.1,-3.6z' fill='%23F6C6A8' fill-opacity='0.7'/%3E%3Cpath d='M170,87c0,2.1 0.84,3 2.58,3c-1.74,0 -2.58,0.9 -2.58,3c0,-2.1 -0.84,-3 -2.58,-3c1.74,0 2.58,-0.9 2.58,-3z' fill='%23BFD7EA' fill-opacity='0.8'/%3E%3Cpath d='M284,246.6c0,2.38 0.95,3.4 2.92,3.4c-1.97,0 -2.92,1.02 -2.92,3.4c0,-2.38 -0.95,-3.4 -2.92,-3.4c1.97,0 2.92,-1.02 2.92,-3.4z' fill='%23D9C3A5' fill-opacity='0.7'/%3E%3Ccircle cx='100' cy='22' r='1.8' fill='%23D9C3A5' fill-opacity='0.7'/%3E%3Ccircle cx='292' cy='118' r='1.5' fill='%23F6C6A8' fill-opacity='0.7'/%3E%3Ccircle cx='22' cy='232' r='1.8' fill='%23BFD7EA' fill-opacity='0.8'/%3E%3Ccircle cx='152' cy='204' r='1.4' fill='%23D9C3A5' fill-opacity='0.6'/%3E%3Ccircle cx='238' cy='272' r='1.6' fill='%23A8BBA2' fill-opacity='0.6'/%3E%3Ccircle cx='62' cy='116' r='1.3' fill='%23BFD7EA' fill-opacity='0.7'/%3E%3Ccircle cx='196' cy='286' r='1.4' fill='%23F6C6A8' fill-opacity='0.6'/%3E%3Ccircle cx='244' cy='84' r='1.4' fill='%23D9C3A5' fill-opacity='0.6'/%3E%3C/svg%3E");
  /* nube con luna y estrellas */
  --ornament: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 280 56'%3E%3Cg transform='translate(104 8) scale(.36)' fill='%23fff'%3E%3Ccircle cx='52' cy='66' r='30'/%3E%3Ccircle cx='94' cy='46' r='40'/%3E%3Ccircle cx='142' cy='58' r='32'/%3E%3Ccircle cx='174' cy='76' r='20'/%3E%3Ccircle cx='24' cy='80' r='18'/%3E%3Crect x='24' y='66' width='150' height='32' rx='16'/%3E%3C/g%3E%3Cpath d='M134,7a9,9 0 1 0 8.28,14.4a7.2,7.2 0 1 1 -8.28,-14.4z' fill='%23D9C3A5'/%3E%3Cpath d='M76,23c0,4.9 1.96,7 6.02,7c-4.06,0 -6.02,2.1 -6.02,7c0,-4.9 -1.96,-7 -6.02,-7c4.06,0 6.02,-2.1 6.02,-7z' fill='%23F6C6A8'/%3E%3Cpath d='M204,18c0,4.2 1.68,6 5.16,6c-3.48,0 -5.16,1.8 -5.16,6c0,-4.2 -1.68,-6 -5.16,-6c3.48,0 5.16,-1.8 5.16,-6z' fill='%23BFD7EA'/%3E%3Ccircle cx='56' cy='38' r='2' fill='%23A8BBA2'/%3E%3Ccircle cx='226' cy='40' r='2' fill='%23D9C3A5'/%3E%3Cpath d='M20 44h26M234 44h26' stroke='%23D9C3A5' stroke-width='1.5' stroke-linecap='round' stroke-dasharray='1 6'/%3E%3C/svg%3E");

  /* — internas del tema — */
  --nb-peach: #F6C6A8;
  --nb-sage: #A8BBA2;
  --nb-sky: #BFD7EA;
  --nb-sand: #D9C3A5;
  --nb-cloud: #F5F3EF;
  --nb-sky-deep: #DCEAF4;
  --nb-cloud-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 100'%3E%3Cg fill='%23fff'%3E%3Ccircle cx='52' cy='66' r='30'/%3E%3Ccircle cx='94' cy='46' r='40'/%3E%3Ccircle cx='142' cy='58' r='32'/%3E%3Ccircle cx='174' cy='76' r='20'/%3E%3Ccircle cx='24' cy='80' r='18'/%3E%3Crect x='24' y='66' width='150' height='32' rx='16'/%3E%3C/g%3E%3C/svg%3E");
  --nb-mobile-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 170'%3E%3Cpath d='M150 0v14' stroke='%23B9A58A' stroke-width='1.5'/%3E%3Cpath d='M40 26q110 -26 220 0' fill='none' stroke='%23C9B79E' stroke-width='5' stroke-linecap='round'/%3E%3Ccircle cx='150' cy='15' r='5' fill='%23D9C3A5'/%3E%3Cpath d='M52 24V78' stroke='%23B9A58A' stroke-width='1.2' stroke-opacity='.85'/%3E%3Cpath d='M111 17V116' stroke='%23B9A58A' stroke-width='1.2' stroke-opacity='.85'/%3E%3Cpath d='M189 17V98' stroke='%23B9A58A' stroke-width='1.2' stroke-opacity='.85'/%3E%3Cpath d='M248 24V72' stroke='%23B9A58A' stroke-width='1.2' stroke-opacity='.85'/%3E%3Cpath d='M52,78a20,20 0 1 0 18.4,32a16,16 0 1 1 -18.4,-32z' fill='%23D9C3A5'/%3E%3Cpath d='M111,116c0,14 5.6,20 16.5,20c-10.9,0 -16.5,6 -16.5,20c0,-14 -5.6,-20 -16.5,-20c10.9,0 16.5,-6 16.5,-20z' fill='%23F6C6A8'/%3E%3Cg fill='%23fff' transform='translate(152 96) scale(.38)'%3E%3Ccircle cx='52' cy='66' r='30'/%3E%3Ccircle cx='94' cy='46' r='40'/%3E%3Ccircle cx='142' cy='58' r='32'/%3E%3Ccircle cx='174' cy='76' r='20'/%3E%3Ccircle cx='24' cy='80' r='18'/%3E%3Crect x='24' y='66' width='150' height='32' rx='16'/%3E%3C/g%3E%3Cpath d='M248,72c0,12.6 5.04,18 15,18c-9.96,0 -15,5.4 -15,18c0,-12.6 -5.04,-18 -15,-18c9.96,0 15,-5.4 15,-18z' fill='%23A8BBA2'/%3E%3C/svg%3E");
  --nb-balloon-peach: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 96'%3E%3Cpath d='M20 2c10 0 18 9 18 21 0 13-9 25-18 25S2 36 2 23C2 11 10 2 20 2z' fill='%23F6C6A8'/%3E%3Cpath d='M11 10c3-4 7-5 10-4' stroke='%23fff' stroke-opacity='.7' stroke-width='3' fill='none' stroke-linecap='round'/%3E%3Cpath d='M17 48h6l-3 4z' fill='%23F6C6A8'/%3E%3Cpath d='M20 52c-4 8 4 14 0 22s3 14 0 22' stroke='%238C9A96' stroke-width='1.1' fill='none'/%3E%3C/svg%3E");
  --nb-balloon-sage: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 96'%3E%3Cpath d='M20 2c10 0 18 9 18 21 0 13-9 25-18 25S2 36 2 23C2 11 10 2 20 2z' fill='%23A8BBA2'/%3E%3Cpath d='M11 10c3-4 7-5 10-4' stroke='%23fff' stroke-opacity='.7' stroke-width='3' fill='none' stroke-linecap='round'/%3E%3Cpath d='M17 48h6l-3 4z' fill='%23A8BBA2'/%3E%3Cpath d='M20 52c-4 8 4 14 0 22s3 14 0 22' stroke='%238C9A96' stroke-width='1.1' fill='none'/%3E%3C/svg%3E");
  --nb-balloon-sky: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 96'%3E%3Cpath d='M20 2c10 0 18 9 18 21 0 13-9 25-18 25S2 36 2 23C2 11 10 2 20 2z' fill='%23A9CBE6'/%3E%3Cpath d='M11 10c3-4 7-5 10-4' stroke='%23fff' stroke-opacity='.7' stroke-width='3' fill='none' stroke-linecap='round'/%3E%3Cpath d='M17 48h6l-3 4z' fill='%23A9CBE6'/%3E%3Cpath d='M20 52c-4 8 4 14 0 22s3 14 0 22' stroke='%238C9A96' stroke-width='1.1' fill='none'/%3E%3C/svg%3E");
}

/* Fraunces «suave» en toda la invitación (Quicksand ignora el eje) */
html[data-theme="nube"] body.inv { font-variation-settings: 'SOFT' 100; }
html[data-theme="nube"] .inv-script { font-style: italic; font-weight: 400; }
html[data-theme="nube"] ::selection { background: var(--nb-peach); color: var(--ink); }

/* ---------- fondo general (escritorio: cielo con nubes a los lados) ---------- */
html[data-theme="nube"] {
  background-color: #E3EDF5;
  background-image:
    radial-gradient(60vw 50vh at 8% 0%, rgba(246, 198, 168, .42), transparent 70%),
    radial-gradient(60vw 60vh at 92% 100%, rgba(168, 187, 162, .34), transparent 70%),
    var(--pattern), var(--pattern);
  background-size: auto, auto, 300px, 470px;
  background-position: 0 0, 0 0, 0 0, 140px 170px;
}
html[data-theme="nube"] body.inv::before,
html[data-theme="nube"] body.inv::after {
  content: ''; position: fixed; z-index: -1; pointer-events: none;
  aspect-ratio: 2 / 1; background: var(--nb-cloud-svg) center / contain no-repeat;
  filter: drop-shadow(0 16px 22px rgba(76, 104, 128, .16));
}
html[data-theme="nube"] body.inv::before { width: 300px; top: 12vh; left: calc(50% - 280px - 340px); animation: nbDrift 18s ease-in-out infinite; }
html[data-theme="nube"] body.inv::after { width: 220px; bottom: 14vh; right: calc(50% - 280px - 260px); animation: nbDrift 22s ease-in-out -7s infinite reverse; }
@keyframes nbDrift { 0%, 100% { translate: 0 0; } 50% { translate: 26px -8px; } }

/* ---------- capa de efectos: globos que suben despacio ---------- */
html[data-theme="nube"] .inv-fx::before,
html[data-theme="nube"] .inv-fx::after {
  content: ''; position: absolute; bottom: -120px; width: 30px; aspect-ratio: 40 / 96;
  background: var(--nb-balloon-peach) center / contain no-repeat;
  opacity: 0;
  animation: nbRise 26s linear 2s infinite;
}
html[data-theme="nube"] .inv-fx::before { left: 5%; }
html[data-theme="nube"] .inv-fx::after { right: 6%; width: 24px; background-image: var(--nb-balloon-sage); animation-delay: 14s; animation-duration: 30s; }
@keyframes nbRise {
  0% { transform: translate(0, 0) rotate(-4deg); opacity: 0; }
  6% { opacity: .85; }
  50% { transform: translate(14px, -60vh) rotate(5deg); }
  88% { opacity: .85; }
  100% { transform: translate(-6px, calc(-100vh - 160px)) rotate(-3deg); opacity: 0; }
}

/* ---------- tipografía ---------- */
html[data-theme="nube"] .inv-eyebrow { font-weight: 700; letter-spacing: .24em; }
html[data-theme="nube"] .inv-title { font-weight: 450; letter-spacing: -.015em; line-height: 1.08; }
html[data-theme="nube"] .inv-text { font-weight: 500; }

/* ---------- secciones: cada una asoma con borde de nube ---------- */
html[data-theme="nube"] .inv-section { --sec: var(--bg); }
html[data-theme="nube"] .inv-section.is-alt { --sec: var(--bg-alt); }
html[data-theme="nube"] .inv-section::before {
  content: ''; position: absolute; left: 0; right: 0; top: -26px; height: 52px; pointer-events: none;
  background:
    radial-gradient(circle at 50% 50%, var(--sec) 0 25px, transparent 26px) 12px 0 / 74px 52px repeat-x,
    radial-gradient(circle at 50% 50%, var(--sec) 0 17px, transparent 18px) 50px 8px / 74px 52px repeat-x;
}
html[data-theme="nube"] .inv-section.is-alt {
  background-image: var(--pattern);
  background-size: 300px;
}

/* ============================================================
   HERO — arco con la foto que asoma entre nubes (layout framed)
   ============================================================ */
html[data-theme="nube"] .inv-hero {
  background-color: var(--bg);
  background-image:
    radial-gradient(60% 26% at 84% 6%, rgba(246, 198, 168, .6), transparent 70%),
    radial-gradient(50% 24% at 6% 30%, rgba(255, 255, 255, .8), transparent 70%),
    linear-gradient(180deg, var(--nb-sky-deep) 0%, var(--bg-alt) 38%, var(--bg) 78%),
    var(--pattern);
  background-size: auto, auto, auto, 300px;
}
html[data-theme="nube"] .inv-hero::before,
html[data-theme="nube"] .inv-hero::after {
  content: ''; position: absolute; z-index: -1; pointer-events: none; aspect-ratio: 2 / 1;
  background: var(--nb-cloud-svg) center / contain no-repeat;
  filter: drop-shadow(0 12px 16px rgba(76, 104, 128, .14));
}
html[data-theme="nube"] .inv-hero::before { width: 170px; left: -58px; top: 70px; animation: nbDrift 14s ease-in-out infinite; }
html[data-theme="nube"] .inv-hero::after { width: 130px; right: -34px; top: 238px; animation: nbDrift 17s ease-in-out -6s infinite reverse; }
html[data-theme="nube"] .inv-hero--framed { justify-content: flex-start; padding-top: calc(40px + env(safe-area-inset-top)); }
html[data-theme="nube"] .inv-hero--framed .inv-hero__media {
  width: min(55vw, 222px); aspect-ratio: 3 / 4; padding: 9px; border: 0;
  border-radius: 999px 999px 30px 30px;
  background: #fff;
  box-shadow: 0 30px 50px -28px rgba(76, 104, 128, .6);
}
html[data-theme="nube"] .inv-hero--framed .inv-hero__img { border-radius: 999px 999px 22px 22px; background: linear-gradient(160deg, var(--nb-sky), var(--nb-peach)); }
html[data-theme="nube"] .inv-hero__img.is-broken { opacity: 0; }
html[data-theme="nube"] .inv-hero--framed .inv-hero__media::before {
  inset: -13px; border: 1.5px solid rgba(246, 198, 168, .95); border-radius: 999px 999px 38px 38px;
}
/* la nube que abraza la base del arco */
html[data-theme="nube"] .inv-hero--framed .inv-hero__media::after {
  content: ''; position: absolute; left: -9%; right: -9%; bottom: -16%; aspect-ratio: 2 / 1; pointer-events: none;
  background: var(--nb-cloud-svg) center bottom / contain no-repeat;
  filter: drop-shadow(0 10px 14px rgba(76, 104, 128, .18));
}
html[data-theme="nube"] .inv-hero--framed .inv-hero__content { padding-top: 30px; }
html[data-theme="nube"] .inv-hero__eyebrow { color: var(--accent); opacity: 1; letter-spacing: .3em; margin-bottom: .1rem; }
html[data-theme="nube"] .inv-hero__title {
  font-size: clamp(3.4rem, 17.5vw, 5.2rem); font-weight: 400; line-height: 1.02; letter-spacing: -.02em;
  color: var(--ink); margin: .04em 0 .16em;
}
html[data-theme="nube"] .inv-hero__subtitle { font-size: 1.12rem; color: var(--ink-soft); opacity: 1; max-width: 19rem; font-weight: 400; }
html[data-theme="nube"] .inv-hero__date { margin-top: 1.15rem; margin-bottom: .7rem; font-weight: 700; color: var(--ink); }
html[data-theme="nube"] .inv-hero__date-side { border-color: rgba(217, 195, 165, .9); }
html[data-theme="nube"] .inv-hero__date-day { font-size: 3.1rem; font-weight: 400; color: var(--accent); }
html[data-theme="nube"] .inv-hero__time { opacity: 1; color: var(--ink-soft); }
html[data-theme="nube"] .inv-hero__place { opacity: 1; font-weight: 600; color: var(--ink); }
html[data-theme="nube"] .inv-hero__place .inv-icon { color: #D98E64; }
html[data-theme="nube"] .inv-guest { border: 1.5px solid rgba(246, 198, 168, .9); box-shadow: var(--shadow); }
html[data-theme="nube"] .inv-guest__label { color: var(--accent); opacity: 1; }
html[data-theme="nube"] .inv-guest__name { font-weight: 500; font-style: italic; }
html[data-theme="nube"] .inv-hero__cue { color: var(--ink-soft); bottom: calc(36px + env(safe-area-inset-bottom)); }
html[data-theme="nube"] .inv-hero__art-spark { color: #E6A47E; }
/* layout «photo» (texto sobre la foto): todo en claro */
html[data-theme="nube"] .inv-hero--photo:not(.inv-hero--noimg) :is(.inv-hero__eyebrow, .inv-hero__title, .inv-hero__subtitle, .inv-hero__date, .inv-hero__date-day, .inv-hero__time, .inv-hero__place, .inv-hero__cue, .inv-guest__label) { color: #fff; }
html[data-theme="nube"] .inv-hero--photo:not(.inv-hero--noimg) .inv-hero__title { text-shadow: 0 2px 26px rgba(0, 0, 0, .28); }
html[data-theme="nube"] .inv-hero--photo:not(.inv-hero--noimg) .inv-hero__date-side { border-color: rgba(255, 255, 255, .55); }
html[data-theme="nube"] .inv-hero--photo:not(.inv-hero--noimg) .inv-hero__place .inv-icon { color: var(--nb-peach); }
html[data-theme="nube"] .inv-hero--photo:not(.inv-hero--noimg) .inv-guest { background: rgba(255, 255, 255, .14); border-color: rgba(255, 255, 255, .45); box-shadow: 0 10px 30px rgba(0, 0, 0, .18); }

/* ============================================================
   SECCIONES
   ============================================================ */
html[data-theme="nube"] .inv-btn { font-weight: 700; }
html[data-theme="nube"] .inv-btn:not(.inv-btn--ghost):not(.is-draft):not(.inv-btn--wa) { box-shadow: 0 12px 24px -12px rgba(86, 112, 79, .75); }

/* cita */
html[data-theme="nube"] .inv-quote__mark { color: var(--nb-peach); opacity: 1; font-style: italic; }
html[data-theme="nube"] .inv-quote__text p { font-weight: 400; font-size: clamp(1.55rem, 6.8vw, 2rem); line-height: 1.36; }
html[data-theme="nube"] .inv-quote__author { color: var(--accent); }
html[data-theme="nube"] .inv-quote__author::before { background: var(--nb-peach); height: 2px; border-radius: 2px; }

/* cuenta regresiva: cuatro nubecitas */
html[data-theme="nube"] .inv-countdown { gap: 10px; margin-top: 18px; }
html[data-theme="nube"] .inv-countdown__unit {
  overflow: visible; border: 0; border-radius: 22px 22px 26px 26px; background: #fff;
  box-shadow: 0 18px 30px -20px rgba(76, 104, 128, .55);
  padding: 16px 2px 13px;
}
html[data-theme="nube"] .inv-countdown__unit::before {
  inset: auto 6% calc(100% - 4px) 6%; height: 30px; opacity: 1;
  background:
    radial-gradient(circle at 30% 100%, #fff 0 12px, transparent 12.5px),
    radial-gradient(circle at 64% 100%, #fff 0 17px, transparent 17.5px);
}
html[data-theme="nube"] .inv-countdown__num { font-weight: 400; color: var(--ink); position: relative; }
html[data-theme="nube"] .inv-countdown__lbl { color: var(--accent); position: relative; }
html[data-theme="nube"] .inv-countdown__date { color: var(--ink-soft); font-weight: 600; }
html[data-theme="nube"] .inv-countdown__done { font-style: italic; color: var(--accent); }

/* lugar */
html[data-theme="nube"] .inv-event { border: 0; }
html[data-theme="nube"] .inv-event__icon { color: var(--ink); background: var(--nb-peach); border: 0; box-shadow: 0 0 0 6px #FDEBE0; }
html[data-theme="nube"] .inv-event.has-img .inv-event__icon { background: var(--nb-peach); box-shadow: 0 0 0 6px #fff, 0 10px 22px -10px rgba(76, 104, 128, .5); }
html[data-theme="nube"] .inv-event__name { font-weight: 450; }
html[data-theme="nube"] .inv-event__meta .inv-icon { color: var(--accent); }
html[data-theme="nube"] .inv-event__media { background: linear-gradient(160deg, var(--nb-sky), var(--nb-peach)); }

/* itinerario: globitos de colores */
html[data-theme="nube"] .inv-timeline::before {
  left: 27px; width: 2px;
  background: repeating-linear-gradient(180deg, var(--nb-sand) 0 3px, transparent 3px 10px);
}
html[data-theme="nube"] .inv-timeline__dot {
  --p: var(--nb-peach);
  color: var(--ink); background: var(--p); border: 3px solid #fff;
  box-shadow: 0 0 0 6px var(--bg), 0 14px 24px -12px rgba(76, 104, 128, .6);
}
html[data-theme="nube"] .inv-section.is-alt .inv-timeline__dot { box-shadow: 0 0 0 6px var(--bg-alt), 0 14px 24px -12px rgba(76, 104, 128, .6); }
html[data-theme="nube"] .inv-timeline__item:nth-child(4n + 2) .inv-timeline__dot { --p: var(--nb-sky); }
html[data-theme="nube"] .inv-timeline__item:nth-child(4n + 3) .inv-timeline__dot { --p: var(--nb-sage); }
html[data-theme="nube"] .inv-timeline__item:nth-child(4n) .inv-timeline__dot { --p: var(--nb-sand); }
html[data-theme="nube"] .inv-timeline__time { color: var(--accent); }
html[data-theme="nube"] .inv-timeline__title { font-weight: 450; font-size: 1.36rem; }

/* regalos */
html[data-theme="nube"] .inv-gift { border: 0; }
html[data-theme="nube"] .inv-gift__icon { color: var(--ink); background: #FDEBE0; border-radius: 18px; }
html[data-theme="nube"] .inv-gift:nth-child(3n + 2) .inv-gift__icon { background: #E3EEF7; }
html[data-theme="nube"] .inv-gift:nth-child(3n) .inv-gift__icon { background: #E8EFE6; }
html[data-theme="nube"] .inv-gift__title { font-weight: 450; }
html[data-theme="nube"] .inv-gift__detail { color: var(--ink-soft); font-weight: 500; }
html[data-theme="nube"] .inv-gift__copy { background: var(--bg-alt); border-color: rgba(86, 112, 79, .3); }

/* código de vestimenta: tarjeta con forma de nube */
html[data-theme="nube"] .inv-dress {
  position: relative; margin-top: 30px;
  padding: 30px 22px 30px; border-radius: 30px;
  background: #fff; box-shadow: var(--shadow);
}
html[data-theme="nube"] .inv-dress::before {
  content: ''; position: absolute; left: 10%; right: 10%; top: -30px; height: 44px; pointer-events: none;
  background:
    radial-gradient(circle at 18% 100%, #fff 0 22px, transparent 22.5px),
    radial-gradient(circle at 44% 100%, #fff 0 34px, transparent 34.5px),
    radial-gradient(circle at 72% 100%, #fff 0 26px, transparent 26.5px),
    radial-gradient(circle at 92% 100%, #fff 0 16px, transparent 16.5px);
}
html[data-theme="nube"] .inv-dress__icon { position: relative; color: var(--ink); background: #FDEBE0; border: 0; }
html[data-theme="nube"] .inv-dress__code { font-style: italic; font-weight: 400; color: var(--ink); }
html[data-theme="nube"] .inv-dress__label { color: var(--accent); }
html[data-theme="nube"] .inv-chip { background: var(--bg); border-color: transparent; font-weight: 600; }

/* consejos para los papás */
html[data-theme="nube"] .inv-wish { border: 0; background: #fff; }
html[data-theme="nube"] .inv-wish:nth-child(3n + 1) { background: #FDF1E8; }
html[data-theme="nube"] .inv-wish:nth-child(3n + 2) { background: #EAF2F8; }
html[data-theme="nube"] .inv-wish:nth-child(3n) { background: #EEF3EC; }
html[data-theme="nube"] .inv-wish::before { color: var(--nb-peach); opacity: .9; font-style: italic; }
html[data-theme="nube"] .inv-wish__msg p { font-style: italic; font-weight: 400; }
html[data-theme="nube"] .inv-wishes__spark,
html[data-theme="nube"] .inv-divider__spark { color: #E6A47E; }

/* formularios */
html[data-theme="nube"] .inv-card { border-color: transparent; }
html[data-theme="nube"] .inv-input { background: var(--bg); border-color: rgba(51, 65, 63, .1); }
html[data-theme="nube"] .inv-input:focus { background: #fff; }
html[data-theme="nube"] .inv-rsvp__face,
html[data-theme="nube"] .inv-stepper { background: var(--bg); }
html[data-theme="nube"] .inv-section.inv-rsvp { background-image: radial-gradient(90% 40% at 50% 0%, rgba(246, 198, 168, .3), transparent 70%), var(--pattern); background-size: auto, 300px; }

/* pie: cielo de tarde con luna */
html[data-theme="nube"] .inv-footer {
  background: radial-gradient(70% 50% at 50% 100%, rgba(246, 198, 168, .45), transparent 70%), linear-gradient(180deg, var(--bg-alt), var(--nb-sky-deep));
}
html[data-theme="nube"] .inv-footer::before {
  content: ''; position: absolute; left: 0; right: 0; top: -26px; height: 52px; pointer-events: none;
  background:
    radial-gradient(circle at 50% 50%, var(--bg-alt) 0 25px, transparent 26px) 30px 0 / 74px 52px repeat-x,
    radial-gradient(circle at 50% 50%, var(--bg-alt) 0 17px, transparent 18px) 68px 8px / 74px 52px repeat-x;
}
html[data-theme="nube"] .inv-footer::after {
  content: ''; position: absolute; left: 50%; bottom: calc(18px + var(--bar-space)); width: 150px; aspect-ratio: 2 / 1; pointer-events: none;
  transform: translateX(-50%); opacity: .95;
  background: var(--nb-cloud-svg) center / contain no-repeat;
  filter: drop-shadow(0 10px 14px rgba(76, 104, 128, .14));
  animation: nbDrift 16s ease-in-out infinite;
}
html[data-theme="nube"] .inv-footer__orn { color: #E6A47E; }
html[data-theme="nube"] .inv-footer__text { font-size: clamp(1.9rem, 8.6vw, 2.3rem); color: var(--ink); text-wrap: balance; }
html[data-theme="nube"] .inv-footer__credit { margin-bottom: 64px; }

/* barra de acciones */
html[data-theme="nube"] .inv-actionbar { background: rgba(255, 255, 255, .86); border-color: rgba(51, 65, 63, .08); }
html[data-theme="nube"] .inv-actionbar__btn:not(.is-primary) .inv-icon { color: var(--accent); }

/* ============================================================
   INTRO «confetti» — cielo de tarde con un móvil de cuna
   (luna, estrellas y nubecita), globos pastel y nubes que se abren.
   ============================================================ */
html[data-theme="nube"] .inv-intro--confetti { background: var(--nb-sky-deep); }
html[data-theme="nube"] .inv-intro--confetti .inv-intro__bg {
  background-image:
    radial-gradient(80% 32% at 78% 100%, rgba(246, 198, 168, .6), transparent 70%),
    radial-gradient(60% 30% at 6% 76%, rgba(168, 187, 162, .32), transparent 70%),
    radial-gradient(50% 26% at 50% 44%, rgba(255, 255, 255, .7), transparent 70%),
    linear-gradient(180deg, #D2E3F0 0%, #E2ECF5 46%, #F6E6DA 100%),
    var(--pattern), var(--pattern);
  background-size: auto, auto, auto, auto, 300px, 470px;
  background-position: 0 0, 0 0, 0 0, 0 0, 0 0, 150px 190px;
}
/* móvil de cuna colgando del techo */
html[data-theme="nube"] .inv-intro--confetti .inv-intro__bg::before {
  content: ''; position: absolute; left: 50%; top: -6px; width: min(80vw, 340px); aspect-ratio: 300 / 170;
  transform: translateX(-50%); transform-origin: 50% 0;
  background: var(--nb-mobile-svg) center top / contain no-repeat;
  filter: drop-shadow(0 10px 12px rgba(76, 104, 128, .16));
  animation: nbMobile 6s ease-in-out infinite;
}
@keyframes nbMobile {
  0%, 100% { transform: translateX(-50%) rotate(-2.2deg); }
  50% { transform: translateX(-50%) rotate(2.2deg); }
}
/* estrellitas que titilan (reemplaza el grano de papel) */
html[data-theme="nube"] .inv-intro--confetti .inv-intro__bg::after {
  mix-blend-mode: normal; opacity: 1;
  background-image:
    radial-gradient(2px 2px at 12% 30%, #fff 60%, transparent 70%),
    radial-gradient(2.4px 2.4px at 84% 38%, #fff 60%, transparent 70%),
    radial-gradient(1.8px 1.8px at 30% 58%, #fff 60%, transparent 70%),
    radial-gradient(2.2px 2.2px at 70% 70%, #fff 60%, transparent 70%),
    radial-gradient(1.6px 1.6px at 52% 24%, #fff 60%, transparent 70%),
    radial-gradient(2px 2px at 92% 84%, #fff 60%, transparent 70%);
  animation: nbTwinkle 3s ease-in-out infinite alternate;
}
@keyframes nbTwinkle { from { opacity: .3; } to { opacity: 1; } }
/* el aviso baja para dejarle el techo al móvil */
html[data-theme="nube"] .inv-intro--confetti .inv-intro__eyebrow { margin-top: clamp(118px, 17vh, 150px); color: #4A6344; /* salvia un tono más oscura: AA sobre el cielo */ }
html[data-theme="nube"] .cnf { --cloud: #fff; }
html[data-theme="nube"] .cnf__cloud { filter: drop-shadow(0 14px 18px rgba(76, 104, 128, .14)); }
html[data-theme="nube"] .cnf__cloud.c3 { left: auto; right: -14%; top: 25%; opacity: .95; }
html[data-theme="nube"] .inv-intro--confetti .inv-intro__cta:focus-visible { outline-color: rgba(86, 112, 79, .55); }
html[data-theme="nube"] .cnf__balloon.b1 { --b: var(--nb-peach); left: 5%; top: 22%; }
html[data-theme="nube"] .cnf__balloon.b2 { --b: #A9CBE6; right: 6%; top: 19%; }
html[data-theme="nube"] .cnf__balloon.b3 { --b: var(--nb-sage); left: 9%; top: 63%; }
html[data-theme="nube"] .cnf__balloon.b4 { --b: var(--nb-sand); right: 10%; top: 60%; }
html[data-theme="nube"] .cnf__balloon.b5 { --b: #F9DCCB; left: 1%; top: 42%; }
html[data-theme="nube"] .cnf__center { top: 50%; }
html[data-theme="nube"] .cnf__eyebrow { color: var(--accent); opacity: 1; letter-spacing: .32em; }
html[data-theme="nube"] .cnf__title { font-style: italic; font-weight: 400; font-size: clamp(3rem, 15vw, 4rem); letter-spacing: -.02em; }
html[data-theme="nube"] .cnf__date { background: var(--accent); color: #fff; letter-spacing: .26em; }
html[data-theme="nube"] .inv-intro--confetti .inv-intro__guest { background: rgba(255, 255, 255, .88); border-color: rgba(246, 198, 168, .9); }
html[data-theme="nube"] .inv-intro--confetti .inv-intro__guest .inv-guest__label { color: var(--accent); opacity: 1; }
html[data-theme="nube"] .inv-intro--confetti .inv-intro__guest .inv-guest__name { font-style: italic; }
html[data-theme="nube"] .inv-intro--confetti .inv-intro__cta {
  background: var(--accent); color: #fff; font-weight: 700;
  box-shadow: 0 16px 30px -12px rgba(86, 112, 79, .65);
}
html[data-theme="nube"] .inv-intro--confetti .inv-intro__cta-ring { animation-name: nbCtaRing; }
@keyframes nbCtaRing { 0% { box-shadow: 0 0 0 0 rgba(86, 112, 79, .45); } 80%, 100% { box-shadow: 0 0 0 16px transparent; } }
@media (prefers-reduced-motion: reduce) {
  html[data-theme="nube"] .inv-intro--confetti .inv-intro__bg::before { animation: none; transform: translateX(-50%); }
}