/* ALLYRAX Dreams Lite — pure CSS, mobile-first, no third-party dependencies */
:root {
  color-scheme: light;
  --ink: #213b59;
  --navy: #153458;
  --night: #112a4e;
  --blue: #6d9ec8;
  --light-blue: #dceefa;
  --gold: #dba96d;
  --gold-soft: #f4d7a8;
  --paper: #f9fbff;
  --white: #fff;
  --muted: #627991;
  --display: Georgia, 'Times New Roman', serif;
  --body: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --shadow: 0 24px 75px rgba(36, 81, 128, .13);
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 20px; }
body { margin: 0; font-family: var(--body); color: var(--ink); background: var(--paper); -webkit-font-smoothing: antialiased; overflow-x: hidden; }
button, input, textarea, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
a { color: inherit; }
img, svg { max-width: 100%; }
::selection { background: #d5e8f7; color: var(--navy); }
:focus-visible { outline: 3px solid #e3b373; outline-offset: 3px; }
[hidden] { display: none !important; }
.skip-link { position: absolute; top: -100px; left: 15px; padding: 12px 18px; background: #fff; color: #123; z-index: 100; border-radius: 8px; }
.skip-link:focus { top: 12px; }
.container { width: min(1120px, calc(100% - 44px)); margin: 0 auto; }
.section-padding { padding: 91px 0; }
.eyebrow { display: flex; align-items: center; gap: 11px; font-size: .67rem; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; line-height: 1.65; }
.eyebrow-blue { color: #6593bb; }
.eyebrow-light { color: #cae0f9; }
.eyebrow-gold { color: #e8c18c; justify-content: center; }
.eyebrow-line { width: 24px; height: 1px; background: #e9bf86; display: inline-block; }
.button { display: inline-flex; justify-content: center; align-items: center; gap: 20px; min-height: 54px; padding: 16px 26px; border-radius: 999px; border: 1px solid transparent; text-decoration: none; font-size: .85rem; font-weight: 750; letter-spacing: .015em; transition: transform .25s ease, background-color .25s ease, box-shadow .25s ease; }
.button:hover { transform: translateY(-3px); }
.button:active { transform: translateY(0); }
.button span { font-size: 1.15rem; }
.button-light { background: #fff9f2; color: var(--navy); box-shadow: 0 10px 35px rgba(5, 22, 57, .17); }
.button-light:hover { background: #fff; }
.button-primary { background: var(--navy); color: #fff; box-shadow: 0 15px 28px rgba(27, 54, 92, .17); }
.button-primary:hover { background: #275582; }
.button-full { width: 100%; }

/* Header & night-sky landing */
.site-header { position: absolute; z-index: 12; top: 0; left: 0; right: 0; display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 24px max(22px, calc((100vw - 1150px)/2)); color: #fff; }
.wordmark { display: flex; align-items: center; gap: 10px; font-weight: 750; font-size: .89rem; text-decoration: none; letter-spacing: -.03em; line-height: 1.12; }
.wordmark em { display: block; font-family: var(--display); font-style: italic; font-weight: 400; font-size: .81rem; letter-spacing: 0; color: #f6d5a5; }
.wordmark svg { flex: 0 0 auto; }
.site-header nav { display: flex; align-items: center; gap: 24px; }
.site-header nav a { font-size: .78rem; font-weight: 700; text-decoration: none; }
.nav-link { opacity: .8; }
.nav-link:hover { opacity: 1; }
.nav-cta { border: 1px solid rgba(255,255,255,.35); padding: 11px 15px; border-radius: 99px; background: rgba(255,255,255,.09); }
.nav-cta:hover { background: rgba(255,255,255,.2); }
.nav-cta span { margin-left: 4px; }
.hero { background: linear-gradient(123deg, #122e55 0%, #234c7e 46%, #407fb7 100%); color: #fff; position: relative; isolation: isolate; overflow: hidden; min-height: 780px; display: flex; flex-direction: column; justify-content: center; }
.hero-container { width: min(1140px, calc(100% - 44px)); margin: 100px auto 100px; display: grid; grid-template-columns: 1.13fr .87fr; align-items: center; position: relative; z-index: 2; }
.hero-copy { padding: 35px 0; }
.hero h1 { font-family: var(--display); font-size: clamp(3.5rem, 6.3vw, 6.4rem); line-height: 1.05; letter-spacing: -.052em; font-weight: 400; margin: 25px 0 22px; max-width: 690px; }
.hero h1 i { color: #f9daaa; font-weight: 400; }
.hero-period { color: #f4c77f; }
.hero-description { max-width: 445px; font-size: .95rem; color: #d7e7fa; line-height: 1.95; }
.hero-actions { display: flex; align-items: center; gap: 26px; flex-wrap: wrap; margin-top: 32px; }
.text-button { text-decoration: none; display: inline-flex; gap: 9px; align-items: center; color: #e1eefd; font-size: .82rem; font-weight: 650; padding: 10px 0; }
.text-button:hover { color: #fff; }
.hero-date { display: flex; align-items: center; gap: 8px; font-size: .67rem; color: #c4d9ef; font-weight: 750; letter-spacing: .19em; margin-top: 48px; }
.date-small-star { color: #f6d49f; font-size: 1.3rem; }
.hero-glow { position: absolute; border-radius: 100%; pointer-events: none; filter: blur(4px); }
.hero-glow-one { width: 630px; height: 630px; top: -360px; left: -300px; background: radial-gradient(circle,rgba(132,189,233,.3),transparent 72%); }
.hero-glow-two { width: 770px; height: 760px; bottom: -620px; right: -340px; background: radial-gradient(circle,rgba(125,191,228,.55),transparent 70%); }
.hero-stars { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.hero-stars .star-dot { position: absolute; display: block; width: var(--s); height: var(--s); left: var(--x); top: var(--y); background: #fff; border-radius: 50%; opacity: var(--opacity); animation: twinkle var(--speed) ease-in-out infinite; animation-delay: var(--delay); }
@keyframes twinkle { 0%,100%{opacity:.15; transform:scale(.7)} 50%{opacity:var(--opacity);transform:scale(1.25)} }
.hero-art { height: 540px; position: relative; min-width: 0; }
.moon-halo { width: 455px; height: 455px; position: absolute; left: 50%; top: 45%; transform: translate(-50%,-50%); border-radius: 50%; border: 1px solid rgba(218,234,252,.2); box-shadow: 0 0 0 47px rgba(255,255,255,.02),0 0 0 92px rgba(255,255,255,.025); }
.crescent-moon { position: absolute; z-index: 1; left: 48%; top: 13%; width: 302px; height: 302px; transform: translateX(-50%) rotate(-22deg); border-radius: 50%; background: radial-gradient(circle at 38% 25%,#fff1cd 0%,#ffdfad 50%,#e5b879 100%); box-shadow: 0 0 55px 23px rgba(253,215,155,.24), inset -14px -15px 32px rgba(202,145,80,.16); animation: moon-hover 7s ease-in-out infinite; }
.moon-cut { position: absolute; background: #2d5a8e; width: 310px; height: 307px; border-radius: 50%; top: -78px; left: 88px; box-shadow: inset -25px 20px 35px rgba(59,119,174,.16); }
@keyframes moon-hover { 0%,100% {transform: translateX(-50%) rotate(-22deg) translateY(0)} 50% {transform: translateX(-50%) rotate(-22deg) translateY(-12px)} }
.cloud { position: absolute; z-index: 2; background: #e3effb; border-radius: 90px; filter: drop-shadow(0 14px 12px rgba(19,54,93,.15)); }
.cloud:before,.cloud:after { content: ''; position: absolute; background: inherit; border-radius: 50%; }
.cloud:before { width: 48%; height: 175%; bottom: 8%; left: 19%; }
.cloud:after { width: 37%; height: 133%; bottom: 5%; left: 53%; }
.cloud-one { width: 245px; height: 70px; left: 8%; top: 60%; background: #f4f9ff; animation: float-cloud 7s ease-in-out infinite; }
.cloud-two { width: 265px; height: 71px; right: -7%; top: 67%; background: #c6ddf0; animation: float-cloud 9s ease-in-out infinite reverse; }
.cloud-three { width: 125px; height: 38px; left: 7%; top: 36%; opacity: .8; background: #d2e5f5; animation: float-cloud 11s ease-in-out infinite; }
@keyframes float-cloud { 0%,100% {transform:translateX(0)} 50% {transform:translateX(13px)} }
.spark,.floating-star { position: absolute; color: #ffe6b7; text-shadow: 0 0 17px #ffe9af; z-index: 3; }
.spark-one { font-size: 30px; top: 14%; left: 12%; }
.spark-two { font-size: 42px; top: 26%; right: 4%; }
.spark-three { font-size: 16px; top: 48%; left: 24%; }
.floating-star { animation: twirl 6s ease-in-out infinite; }
.star-one { left: 14%; top: 19%; font-size: 21px; }
.star-two { right: 12%; top: 50%; font-size: 32px; animation-delay: -3s; }
@keyframes twirl { 0%,100% {transform:rotate(0deg) scale(.9)} 50% {transform:rotate(26deg) scale(1.15)} }
.art-label { display: flex; flex-direction: column; align-items: center; position: absolute; z-index: 4; bottom: 9%; right: 12%; padding: 15px 22px; background: rgba(255,255,255,.91); color: var(--navy); transform: rotate(-5deg); box-shadow: 0 13px 38px rgba(8,36,67,.15); border-radius: 8px; }
.art-label span { font-size: .59rem; font-weight: 800; letter-spacing: .16em; }
.art-label strong { font-family: var(--display); font-style: italic; font-size: 1.55rem; font-weight: 400; color: #be8b55; }
.hero-bottom { position: absolute; bottom: 75px; left: 0; right: 0; z-index: 3; display: flex; justify-content: space-between; padding: 0 max(22px, calc((100vw - 1140px)/2)); align-items: center; font-size: .68rem; font-weight: 750; letter-spacing: .11em; color: #d5e7f8; }
.scroll-notice { display:flex; align-items:center; gap: 12px; }
.scroll-icon { border: 1px solid rgba(255,255,255,.36); border-radius: 50%; display:grid; place-items:center; width: 29px; height: 29px; font-size: 1.1rem; }
.hero-bottom-decoration { opacity: .65; }
.hero-wave { position: absolute; bottom: -1px; left: 0; right: 0; height: 100px; z-index: 4; }
.hero-wave svg { width: 100%; height: 100%; display: block; }
.meteor-layer { position: fixed; inset: 0; z-index: 11; pointer-events: none; overflow: hidden; }
.meteor { position: absolute; width: var(--length, 130px); height: 2px; left: var(--left); top: var(--top); background: linear-gradient(90deg,transparent,rgba(255,239,195,.5),#fff5cb); border-radius: 2px; filter: drop-shadow(0 0 5px rgba(255,247,208,.95)); transform: rotate(-27deg); opacity: 0; animation: meteor-travel var(--duration, 1.8s) linear forwards; }
.meteor::after { content: ''; position: absolute; right: -1px; top: -2px; width: 6px; height: 6px; background: #fffaf0; border-radius: 50%; box-shadow: 0 0 12px 4px rgba(255,232,169,.62); }
@keyframes meteor-travel { 0%{opacity:0;transform:translate3d(0,0,0) rotate(-27deg)} 12%{opacity:1} 78%{opacity:1} 100%{opacity:0;transform:translate3d(-380px,190px,0) rotate(-27deg)} }

/* Introduction */
.intro { text-align: center; background: var(--paper); }
.intro-inner { max-width: 760px; }
.little-asterisk { display:block; font-size: 37px; color:#d4a56c; margin-bottom: 20px; }
.intro .eyebrow { justify-content: center; }
.intro h2 { font-family:var(--display);font-size:clamp(2.3rem,4.2vw,4rem);font-weight:400;line-height:1.25;letter-spacing:-.035em;margin:19px auto 23px; }
.intro h2 em,.details-section h2 em,.rsvp-section h2 em,.closing-section h2 em { font-style: italic; color: #c18a51; font-weight: 400; }
.intro p:not(.eyebrow) { font-size: .95rem; line-height:1.9;max-width:600px;margin:0 auto;color:var(--muted); }
.curly-heart { display: block; margin: 25px auto 0; font-family: var(--display); font-size: 2.3rem; color: #b6d1e6; }

/* Baby name / teddy illustration */
.name-section { position:relative;background:linear-gradient(180deg,#eaf5fd 0%,#e6f1fb 100%);overflow:hidden; }
.name-section::before {content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 85% 30%,rgba(255,255,255,.95),transparent 37%),radial-gradient(circle at 5% 75%,rgba(255,255,255,.5),transparent 35%)}
.name-layout { display:grid;grid-template-columns:1.15fr .85fr;gap:25px;align-items:center;position:relative;z-index:2; }
.name-copy { position:relative;z-index:3; padding:50px 0; }
.name-copy h2 { font-family:var(--display);font-size:clamp(2.1rem,3.5vw,3.6rem);font-weight:400;letter-spacing:-.035em;line-height:1.18;max-width:580px;margin:20px 0 12px; }
.baby-name { font-family:var(--display);font-weight:400;font-size:clamp(3.9rem,7.6vw,8.1rem);letter-spacing:-.07em;line-height:.96;color:#2b517d;margin:24px 0;display:flex;flex-direction:column;position:relative;max-width:max-content; }
.baby-name span:not(.name-underline) { color: #c58e56; font-style:italic; padding-left: .18em; }
.name-underline { width:68%;height:10px;border-top:3px solid #c89561;border-radius:70% 70% 0 0;transform:rotate(-3deg);align-self:flex-end;margin-top:11px; }
.name-subtitle { color:#68809a;line-height:1.8;font-size:.94rem;max-width:360px; }
.name-tag { display:inline-flex;align-items:center;gap:10px;font-size:.73rem;letter-spacing:.06em;color:#4c7398;background:#fff;padding:14px 18px;border:1px solid rgba(110,156,200,.22);border-radius:99px;margin-top:16px;box-shadow:0 10px 24px rgba(72,112,152,.07); }
.name-tag span { color:#c68d50;font-size:1.2rem; }
.name-decoration { position:absolute;color:#c1d7ea;font-size:30px; }
.name-decoration-a { top:12%;left:4%; }
.name-decoration-b { bottom:11%;left:48%;font-size:45px; }
.name-decoration-c { top:15%;right:6%;font-size:24px; }
.bear-stage { position:relative;height:475px;isolation:isolate;display:flex;justify-content:center;align-items:flex-end; }
.bear-ring { position:absolute;left:50%;top:50%;width:390px;height:390px;transform:translate(-50%,-52%);border-radius:50%;background:radial-gradient(circle,#fff 0%,rgba(255,255,255,.6) 52%,rgba(255,255,255,.1) 72%);box-shadow:0 0 0 25px rgba(255,255,255,.15);z-index:-1; }
.bear-ground { position:absolute;bottom:21px;left:13%;width:78%;height:38px;border-radius:50%;background:rgba(80,117,147,.15);filter:blur(12px); }
.bear-svg { display:block;position:relative;z-index:3;width:min(100%,385px);height:auto;filter:drop-shadow(0 18px 15px rgba(109,91,77,.09));animation:bear-bob 4s ease-in-out infinite; }
.bear-arm { transform-box:view-box;transform-origin:139px 208px;animation:bear-point 2s ease-in-out infinite; }
@keyframes bear-point {0%,100% {transform:rotate(0deg)} 30% {transform:rotate(-10deg)} 60% {transform:rotate(5deg)}}
@keyframes bear-bob {0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
.bear-speech {position:absolute;z-index:4;top:24px;right:-3%;font-family:var(--display);font-style:italic;color:#2e628e;font-size:1.15rem;transform:rotate(7deg);background:white;border-radius:20px 20px 20px 4px;padding:14px 21px;box-shadow:0 10px 27px rgba(44,104,160,.12); }
.bear-speech span {color:#d79b78;}
.bear-twinkle {position:absolute;color:#d6ac6c;animation:twirl 5s ease-in-out infinite;}
.bear-twinkle-one{top:90px;left:3%;font-size:37px;}.bear-twinkle-two{top:145px;right:3%;font-size:25px;animation-delay:-2s}.bear-twinkle-three{bottom:60px;left:7%;font-size:25px;animation-delay:-4s}
.confetti-layer {position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:5;}
.confetti-piece {position:absolute;top:var(--from-y);left:var(--from-x);width:var(--w);height:var(--h);opacity:0;background:var(--c);border-radius:var(--radius);animation:confetti-fall var(--time) ease-out forwards;animation-delay:var(--delay);}
@keyframes confetti-fall {0% {opacity:0;transform:translate3d(0,-25px,0) rotate(0deg)} 8%{opacity:1} 82%{opacity:1} 100%{opacity:0;transform:translate3d(var(--travel),300px,0) rotate(var(--turn))}}

/* Message */
.message-section {background:linear-gradient(135deg,#1c466f,#163455 75%);color:#fff;position:relative;overflow:hidden;text-align:center;}
.message-section::before,.message-section::after{content:'✦';position:absolute;color:rgba(239,211,170,.17);font-size:180px;pointer-events:none}
.message-section::before{left:-44px;top:-70px}.message-section::after{right:-35px;bottom:-80px;font-size:240px}
.message-inner{max-width:820px;position:relative;z-index:1;}
.quote-mark{font-family:var(--display);font-size:7rem;line-height:.6;color:#e9bd87;display:block;margin:20px auto 12px;}
.message-section h2 {font-family:var(--display);font-weight:400;letter-spacing:-.03em;line-height:1.28;font-size:clamp(2.3rem,4.2vw,4.6rem);margin:26px auto 20px;max-width:850px;}
.message-section h2 em {color:#f1c990;font-style:italic;}
.message-body {color:#c8dbed;line-height:1.9;font-size:1rem;max-width:585px;margin:0 auto;}
.message-signature{display:flex;flex-direction:column;align-items:center;margin-top:48px;gap:5px;color:#e1eaf5;font-size:.83rem;}
.message-signature strong {font-family:var(--display);font-style:italic;color:#f4d3a4;font-size:2.05rem;font-weight:400;margin-top:5px;}
.tiny-star{font-size:18px;color:#f9d9ad;margin-top:16px;}
.message-stars{position:absolute;right:8%;top:28%;color:#f3d8b2;font-size:17px;opacity:.5;transform:rotate(31deg);}

/* When / where */
.details-section {background:var(--paper);}
.section-heading {text-align:center;max-width:660px;margin:0 auto 50px;}
.section-heading .eyebrow {justify-content:center;}
.section-heading h2,.rsvp-intro h2 {font-family:var(--display);font-weight:400;letter-spacing:-.038em;font-size:clamp(2.8rem,4.9vw,5rem);margin:12px 0 14px;line-height:1.1;}
.section-heading > p:last-child {color:var(--muted);font-size:.93rem;line-height:1.7;}
.details-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;}
.detail-card {position:relative;min-height:320px;display:flex;flex-direction:column;align-items:center;text-align:center;padding:36px 24px;overflow:hidden;border-radius:24px;border:1px solid #e6edf5;background:#fff;box-shadow:0 15px 45px rgba(35,72,114,.055);transition:transform .3s ease,box-shadow .3s ease;}
.detail-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.detail-icon{font-family:var(--display);font-size:2rem;color:#d0a572;line-height:1;margin-bottom:27px;}
.detail-kicker{font-size:.67rem;letter-spacing:.17em;color:#86a1b8;font-weight:800;margin-bottom:13px;}
.calendar-day{font-family:var(--display);font-size:5.3rem;line-height:1;letter-spacing:-.04em;color:var(--navy);}
.calendar-month {font-size:1.1rem;margin-top:10px;color:#41678b;}
.calendar-weekday{font-family:var(--display);font-style:italic;color:#bc8d61;font-size:1.2rem;margin-top:6px;}
.time-card{background:#e7f1f9;}
.time-value{font-family:var(--display);font-size:4.5rem;letter-spacing:-.055em;line-height:1.15;margin:12px 0 14px;}
.time-value small{font-family:var(--body);font-size:.95rem;letter-spacing:.01em;color:#ba8e5b;font-weight:800;}
.time-card strong{font-size:1.07rem;}.detail-subtext{font-size:.8rem;max-width:220px;color:#7b95af;margin-top:13px;line-height:1.6;}
.place-card{background:#fffaf3;}.place-title{font-family:var(--display);font-size:2rem;font-weight:400;color:#28577b;margin-top:6px;}
.place-card p{font-size:.82rem;color:#6a8299;line-height:1.7;margin:10px 0 15px;max-width:255px;}
.map-link{font-size:.75rem;font-weight:800;text-decoration:none;color:#ab7b49;border-bottom:1px solid rgba(171,123,73,.45);padding-bottom:4px;margin-top:auto;}
.map-link span{margin-left:4px;}.map-link:hover{color:#82552f;}
.countdown-strip {display:flex;align-items:center;justify-content:center;gap:20px;text-align:center;margin:46px auto 0;max-width:720px;color:#7795ae;font-family:var(--display);font-style:italic;font-size:1.3rem;}
.countdown-strip p {margin:0;}.countdown-spark{color:#cea570;font-size:1.2rem;}

/* RSVP */
.rsvp-section{position:relative;background:linear-gradient(160deg,#edf6fc,#dbeaf6);overflow:hidden;}
.rsvp-section::before{content:'';position:absolute;inset:auto -20% -500px;pointer-events:none;height:700px;background:radial-gradient(ellipse,rgba(255,255,255,.85),transparent 66%);}
.rsvp-layout{display:grid;grid-template-columns:.95fr 1.05fr;align-items:center;gap:75px;position:relative;z-index:1;}
.rsvp-intro{align-self:stretch;display:flex;flex-direction:column;justify-content:center;}
.rsvp-intro h2{margin:18px 0 22px;max-width:470px;}
.rsvp-intro>p:not(.eyebrow){color:#65809c;max-width:405px;line-height:1.95;font-size:1rem;margin:0;}
.rsvp-decorative{height:310px;position:relative;margin-top:50px;}
.balloon{display:block;position:absolute;border-radius:50% 50% 49% 49%;box-shadow:inset -14px -11px 22px rgba(82,100,129,.08),inset 12px 9px 18px rgba(255,255,255,.57);animation:balloon-float 5s ease-in-out infinite;}
.balloon:after{content:'';position:absolute;left:50%;top:100%;height:86px;border-left:1px solid #9ba9b4;transform:rotate(9deg);}
.balloon:before{content:'';position:absolute;left:calc(50% - 5px);top:95%;border-left:6px solid transparent;border-right:6px solid transparent;border-bottom:8px solid #d7bb9c;}
.balloon-one{width:105px;height:132px;background:#bdd8e9;left:12%;top:20px;}
.balloon-two{width:95px;height:121px;background:#f0d6a9;left:36%;top:75px;animation-delay:-1.6s;}
.balloon-three{width:83px;height:108px;background:#fff;left:59%;top:7px;animation-delay:-3.2s;}
@keyframes balloon-float{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-14px) rotate(3deg)}}
.balloon-note{position:absolute;bottom:0;left:5%;font-family:var(--display);font-style:italic;font-size:1.12rem;color:#6a98ba;}
.rsvp-card{position:relative;background:#fff;border:1px solid rgba(255,255,255,.8);border-radius:30px;padding:35px 40px 37px;box-shadow:0 25px 75px rgba(32,75,126,.12);}
.rsvp-card-head{display:flex;justify-content:space-between;align-items:center;}
.rsvp-pill{background:#eaf4fb;color:#477ba1;border-radius:99px;font-weight:800;font-size:.58rem;letter-spacing:.13em;padding:10px 13px;}
.form-star{color:#d2a06a;font-size:2rem;}
.rsvp-card h3{font-family:var(--display);font-weight:400;letter-spacing:-.03em;font-size:2rem;color:#294c75;margin:20px 0 8px;}
.form-subtitle{color:#7691a9;font-size:.82rem;line-height:1.6;margin:0 0 25px;}
.tally-embed{margin:0 0 18px;}
.tally-embed iframe{display:block;width:100%;border:0;border-radius:14px;background:transparent;overflow:hidden;}
/* Antes de que embed.js asigne src, el iframe se oculta SIN perder su caja
   (visibility, no display) para que el IntersectionObserver de Tally pueda
   inicializarlo al acercarse el scroll. */
.tally-embed iframe:not([src]){visibility:hidden;}
/* Sin internet: embed.js no carga y se oculta el contenedor; queda el enlace alternativo. */
.tally-embed.tally-offline{display:none;}
.tally-fallback{font-size:.78rem;color:#7691a9;text-align:center;margin:0 0 10px;}
.tally-fallback a{color:#477ba1;font-weight:700;text-decoration:none;border-bottom:1px solid rgba(71,123,161,.4);padding-bottom:1px;}
.tally-fallback a:hover{color:#2d5f87;}
.tally-privacy{font-size:.68rem;line-height:1.7;color:#8294a6;text-align:center;margin:0 auto;max-width:420px;}
.tally-privacy a{color:#5b7fa5;text-decoration:underline;text-underline-offset:2px;}
.tally-privacy a:hover{color:#3d5d7b;}

/* Closing + footer */
.closing-section{padding:93px 0;background:#fcf8f1;text-align:center;}
.closing-inner{max-width:750px;}
.closing-star{font-size:2.8rem;color:#cfa978;}
.closing-section .closing-inner>p{font-size:.66rem;letter-spacing:.18em;font-weight:800;color:#a7835f;margin:24px 0;}
.closing-section h2{font-family:var(--display);font-size:clamp(2.45rem,4vw,4.1rem);font-weight:400;letter-spacing:-.035em;line-height:1.23;margin:0 auto 29px;}
.closing-names{font-family:var(--display);font-style:italic;font-size:1.5rem;color:#5e8ba9;}
.closing-names span{color:#bfa077;margin:0 10px;}
.back-top{display:inline-block;margin-top:42px;font-size:.77rem;font-weight:750;color:#527797;text-decoration:none;border-bottom:1px solid #9db3c6;padding-bottom:5px;}
/* ALLYRAX Agency footer */
.agency-footer{
  position:relative;overflow:hidden;text-align:center;color:var(--ink);
  background:linear-gradient(170deg,#eef6fd 0%,#dcecf9 55%,#d2e5f6 100%);
  border-top:1px solid #dbe9f5;padding:86px 22px 48px;
}
.agency-footer::before,.agency-footer::after{content:'✦';position:absolute;color:rgba(198,154,99,.16);font-size:120px;pointer-events:none;}
.agency-footer::before{left:-34px;top:-44px;}
.agency-footer::after{right:-26px;bottom:-50px;font-size:150px;}
.agency-footer-inner{position:relative;z-index:1;max-width:640px;margin:0 auto;display:flex;flex-direction:column;align-items:center;}
.agency-star{font-size:2.1rem;color:#cfa978;margin-bottom:15px;}
.agency-eyebrow{margin:0;font-size:.64rem;font-weight:800;letter-spacing:.24em;color:#2b517d;}
.agency-title{font-family:var(--display);font-weight:400;letter-spacing:-.03em;font-size:clamp(2rem,5.5vw,3.1rem);line-height:1.22;color:var(--navy);margin:18px 0 14px;max-width:560px;}
.agency-title em{font-style:italic;color:#a57943;}
.agency-desc{font-size:.93rem;line-height:1.85;color:#45617c;max-width:430px;margin:0 auto;}
.agency-cta{margin-top:30px;}
.agency-signature{display:flex;align-items:center;gap:14px;margin-top:44px;}
.agency-signature img{height:60px;width:auto;display:block;filter:drop-shadow(0 6px 12px rgba(35,72,114,.16));}
.agency-name{font-weight:800;letter-spacing:.22em;font-size:.92rem;color:#1d3a5f;text-align:left;line-height:1.5;}
.agency-name small{display:block;font-size:.62rem;letter-spacing:.3em;color:#41628a;}
.agency-phrase{font-family:var(--display);font-style:italic;font-size:1.12rem;color:#75572b;margin:22px 0 0;}
.agency-made-with{font-size:.7rem;letter-spacing:.08em;color:#45617c;margin:16px 0 0;}

/* Reveals: content stays visible if JavaScript does not run */
.js-enabled [data-reveal] {opacity:0;transform:translate3d(0,24px,0);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.8,.3,1);}
.js-enabled [data-reveal].in-view{opacity:1;transform:translate3d(0,0,0);}

@media(max-width:1020px){
  .hero-container{grid-template-columns:1.2fr .8fr;}.hero-art{transform:scale(.85);transform-origin:center left;}.hero h1{font-size:clamp(3.2rem,7.2vw,5.3rem)}
  .name-layout{grid-template-columns:1fr .9fr}.rsvp-layout{gap:34px}
}
@media(max-width:760px){
  .site-header{padding:17px 20px;}.site-header nav{gap:14px;}.nav-link{display:none;}.wordmark{font-size:.79rem;}.wordmark em{font-size:.73rem;}.nav-cta{padding:9px 13px;}
  .section-padding{padding:72px 0;}
  .hero{min-height:auto;}.hero-container{display:flex;flex-direction:column;align-items:stretch;margin:117px auto 85px;gap:2px;}
  .hero-copy{padding:0;}.hero h1{font-size:clamp(3.45rem,13vw,5.5rem);max-width:590px;margin:23px 0;}.hero-description{font-size:.9rem;line-height:1.8;}
  .hero-actions{gap:10px 24px;margin-top:27px;}.hero-date{margin-top:35px;font-size:.6rem;letter-spacing:.13em;}
  .hero-art{width:100%;height:330px;transform:scale(.74);transform-origin:top center;margin-bottom:-40px;}
  .moon-halo{width:355px;height:355px;top:52%;}.crescent-moon{width:255px;height:255px;left:50%;top:10%;}.moon-cut{width:260px;height:265px;top:-67px;left:77px;}
  .cloud-one{top:62%;left:7%;}.cloud-two{top:70%;right:2%;}.cloud-three{top:39%;}
  .art-label{right:11%;bottom:0;}.hero-bottom{bottom:62px;}.hero-bottom-decoration{display:none;}.hero-wave{height:70px;}
  .name-layout{display:flex;flex-direction:column;gap:0;}.name-copy{padding:0;text-align:center;}.name-copy .eyebrow{justify-content:center;}.name-copy h2{font-size:2.5rem;margin:16px auto 5px;}
  .baby-name{font-size:clamp(4.3rem,18vw,7.3rem);align-items:center;margin:24px auto;}.baby-name span:not(.name-underline){padding-left:0;}.name-underline{align-self:flex-end;}.name-subtitle{margin:0 auto;}
  .bear-stage{width:min(100%,440px);height:390px;margin:28px auto -23px;}.bear-svg{width:315px;}.bear-ring{width:330px;height:330px;top:52%;}.bear-speech{right:0;top:13px;}
  .message-section h2{font-size:clamp(2.4rem,8.5vw,3.4rem);}
  .details-grid{grid-template-columns:1fr;max-width:520px;margin:auto;gap:13px;}.detail-card{min-height:265px;}.detail-icon{margin-bottom:15px;}
  .rsvp-layout{display:flex;flex-direction:column;gap:28px;align-items:stretch;}.rsvp-intro{text-align:center;align-items:center;}.rsvp-intro .eyebrow{justify-content:center;}.rsvp-intro h2{font-size:3.6rem;}.rsvp-decorative{display:none;}.rsvp-card{max-width:570px;width:100%;margin:auto;}
}
@media(max-width:420px){
  .container,.hero-container{width:calc(100% - 38px);}
  .hero h1{font-size:clamp(3.13rem,13vw,3.8rem);}.hero-actions{flex-direction:column;align-items:stretch;}.hero-actions .button,.hero-actions .text-button{align-self:flex-start;}.hero-art{transform:scale(.68);margin-bottom:-65px;}.hero-date{font-size:.56rem;}
  .section-heading h2{font-size:3.05rem;}.intro h2{font-size:2.55rem;}.name-copy h2{font-size:2.3rem;}.baby-name{font-size:4.7rem;}
  .rsvp-card{padding:26px 22px 29px;border-radius:22px;}.rsvp-intro h2{font-size:3.3rem;}
  .agency-footer{padding:68px 20px 42px;}.agency-title{font-size:2.15rem;}.agency-cta{width:100%;max-width:340px;}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important;}
  .js-enabled [data-reveal]{opacity:1;transform:none;}
  .meteor-layer{display:none;}
}

/* ────────────────────────────────────────────────────────────────────────────
   LITE-UX-01 · Pantalla de bienvenida con sobre
   ──────────────────────────────────────────────────────────────────────────── */
body.welcome-open { overflow: hidden; }
.welcome {
  position: fixed; inset: 0; z-index: 90;
  display: grid; place-items: center;
  padding: 26px 22px calc(26px + env(safe-area-inset-bottom));
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 12%, rgba(255,252,244,.95), transparent 52%),
    radial-gradient(circle at 84% 88%, rgba(255,250,240,.6), transparent 40%),
    linear-gradient(168deg, #e9f5fe 0%, #d0e7f9 48%, #afd0ea 100%);
  color: var(--navy);
}
.welcome-stars { position: absolute; inset: 0; pointer-events: none; }
.welcome-stars .star-dot {
  position: absolute; display: block; width: var(--s); height: var(--s);
  left: var(--x); top: var(--y); background: #fff; border-radius: 50%;
  opacity: var(--opacity); box-shadow: 0 0 6px rgba(255,255,255,.85);
  animation: twinkle var(--speed) ease-in-out infinite; animation-delay: var(--delay);
}
.welcome-shoots { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.welcome-shoots i {
  position: absolute; width: 118px; height: 1.5px; border-radius: 2px;
  background: linear-gradient(90deg, transparent, rgba(255,241,203,.9), #fff6d8);
  transform: rotate(-24deg); opacity: 0; animation: welcome-shoot 8.5s linear infinite;
}
.welcome-shoots i:nth-child(1) { top: 12%; left: -16%; }
.welcome-shoots i:nth-child(2) { top: 32%; left: -10%; animation-delay: 3.1s; }
.welcome-shoots i:nth-child(3) { top: 50%; left: -12%; animation-delay: 5.4s; }
.welcome-shoots i:nth-child(4) { top: 66%; left: -8%; animation-delay: 1.7s; }
@keyframes welcome-shoot {
  0% { opacity: 0; transform: translate3d(0,0,0) rotate(-24deg); }
  6% { opacity: .9; }
  24% { opacity: 0; transform: translate3d(64vw,36vh,0) rotate(-24deg); }
  100% { opacity: 0; transform: translate3d(64vw,36vh,0) rotate(-24deg); }
}
.welcome-glow { position: absolute; border-radius: 100%; pointer-events: none; filter: blur(6px); }
.welcome-glow-one { width: 480px; height: 480px; top: -210px; right: -180px; background: radial-gradient(circle, rgba(255,244,222,.85), transparent 70%); }
.welcome-glow-two { width: 540px; height: 540px; bottom: -300px; left: -230px; background: radial-gradient(circle, rgba(190,222,245,.9), transparent 70%); }
.welcome-inner { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: center; text-align: center; max-width: 440px; }
.welcome-eyebrow { margin: 0; font-size: .63rem; font-weight: 800; letter-spacing: .22em; text-transform: uppercase; color: #75572b; }
.welcome h1 { font-family: var(--display); font-weight: 400; font-size: clamp(1.9rem, 6.4vw, 2.75rem); line-height: 1.18; letter-spacing: -.03em; margin: 22px 0 0; color: #1d3a5f; }
.welcome h1 em { color: #a57943; font-style: italic; }
.envelope-wrap { position: relative; width: min(300px, 78vw); height: 212px; margin: 24px auto 30px; filter: drop-shadow(0 24px 28px rgba(28,56,92,.3)); animation: envelope-float 5.5s ease-in-out infinite; }
@keyframes envelope-float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-9px); } }
.envelope { position: absolute; inset: 0; border-radius: 8px; }
.envelope-back { position: absolute; inset: 0; background: linear-gradient(150deg, #efe7d6, #d8cdb6); clip-path: polygon(0 0, 50% 58%, 100% 0, 100% 100%, 0 100%); z-index: 3; border-radius: 8px; }
.letter {
  position: absolute; left: 9%; top: 7%; width: 82%; height: 84%;
  background: #fffaf0; border-radius: 6px; z-index: 2;
  display: grid; place-items: center; padding: 14px 18px;
  font-family: var(--display); font-style: italic; color: #52708c;
  font-size: clamp(.95rem, 3.4vw, 1.15rem); line-height: 1.5; text-align: center;
  box-shadow: 0 3px 12px rgba(46,70,96,.12);
  transition: transform 1.05s cubic-bezier(.2,.8,.2,1);
}
.letter span { color: #d79b78; }
.envelope-front { position: absolute; inset: 0; background: linear-gradient(25deg, #f8f2e6, #e0d4bf); clip-path: polygon(0 100%, 50% 44%, 100% 100%); z-index: 5; border-radius: 8px; }
.envelope-flap { position: absolute; inset: 0; background: linear-gradient(140deg, #f4ecdb, #dfd3bd); clip-path: polygon(0 0, 50% 58%, 100% 0); z-index: 4; transform-origin: top; transition: transform .8s cubic-bezier(.2,.75,.2,1); border-radius: 8px 8px 0 0; }
.seal {
  position: absolute; left: 50%; top: 55%; transform: translate(-50%,-50%); z-index: 8;
  width: 54px; height: 54px; border-radius: 50%; display: grid; place-items: center;
  background: radial-gradient(circle at 32% 26%, #eecdb1, #b07f66); color: #fff6e8;
  font-size: 1.35rem; box-shadow: 0 6px 14px rgba(122,82,66,.45), inset 0 0 0 4px rgba(255,255,255,.22);
  transition: transform .55s ease, opacity .5s ease;
}
.envelope-glint { position: absolute; color: #d9a86a; font-size: 1.4rem; animation: twirl 4.5s ease-in-out infinite; }
.envelope-glint-a { top: 2%; left: 0; }
.envelope-glint-b { bottom: 4%; right: 0; font-size: 1rem; animation-delay: -2.2s; }
.welcome.is-opening .seal { opacity: 0; transform: translate(-50%,-50%) rotate(125deg) scale(.45); }
.welcome.is-opening .letter { transform: translateY(-92px); transition-delay: .18s; }
.welcome.is-opening .envelope-flap { transform: rotateX(176deg); transition-delay: .5s; }
.welcome.is-opening { opacity: 0; transition: opacity .95s ease .95s; }
.welcome-sound { margin: 24px 0 4px; display: flex; flex-direction: column; align-items: center; gap: 9px; }
.sound-switch {
  display: inline-flex; align-items: center; gap: 12px; border: 0; padding: 11px 16px;
  border-radius: 999px; background: rgba(255,255,255,.58); box-shadow: 0 8px 22px rgba(38,74,116,.1);
}
.switch-track { position: relative; width: 46px; height: 26px; border-radius: 999px; background: #b3c8da; flex: 0 0 auto; transition: background-color .3s ease; }
.switch-thumb {
  position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%;
  background: #fffdf6; color: #8a6a35; font-size: .72rem; display: grid; place-items: center;
  transition: transform .3s ease; box-shadow: 0 2px 5px rgba(30,60,95,.25);
}
.sound-switch[aria-checked="true"] .switch-track { background: #c79a5f; }
.sound-switch[aria-checked="true"] .switch-thumb { transform: translateX(20px); color: #b9894c; }
.switch-label { font-size: .85rem; font-weight: 700; color: #274b70; }
.switch-note { margin: 0; font-size: .72rem; color: #45617c; }
.button-open { background: #fff9ef; color: #274b70; border-color: #ead9b6; box-shadow: 0 16px 34px rgba(40,74,114,.18); font-size: .92rem; }
.button-open:hover { background: #fff; }
.welcome-note { display: block; margin-top: 16px; font-size: .72rem; color: #45617c; }

/* ────────────────────────────────────────────────────────────────────────────
   LITE-UX-01 · Botón de sonido flotante (landing)
   ──────────────────────────────────────────────────────────────────────────── */
.sound-float-wrap {
  position: fixed; right: max(16px, env(safe-area-inset-right)); bottom: max(16px, env(safe-area-inset-bottom));
  z-index: 45; display: flex; flex-direction: column; align-items: flex-end; gap: 8px;
  opacity: 0; visibility: hidden; transform: translateY(12px); pointer-events: none;
  transition: opacity .5s ease, transform .5s ease, visibility .5s;
}
body:not(.welcome-open) .sound-float-wrap { opacity: 1; visibility: visible; transform: none; pointer-events: auto; }
.sound-float {
  display: inline-flex; align-items: center; gap: 8px; min-height: 46px; padding: 10px 18px;
  border-radius: 999px; border: 1px solid #cfe0f0; background: rgba(255,255,255,.93);
  backdrop-filter: blur(10px); color: #23466d; font-weight: 750; font-size: .8rem;
  box-shadow: 0 12px 30px rgba(28,60,98,.18);
}
.sound-float-icon { font-size: 1.05rem; color: #c69a63; }
.sound-float.is-playing .sound-float-icon { color: #b3874f; animation: sound-note 1.6s ease-in-out infinite; }
@keyframes sound-note { 0%,100% { transform: translateY(0) scale(1); } 50% { transform: translateY(-3px) scale(1.08); } }
.sound-hint {
  display: block; background: rgba(21,52,88,.9); color: #f4e6cf; font-size: .72rem; padding: 9px 14px;
  border-radius: 999px; box-shadow: 0 8px 20px rgba(20,45,78,.3); max-width: 230px; text-align: center;
  opacity: 0; transform: translateY(6px); transition: opacity .3s ease, transform .3s ease;
}
.sound-hint.is-visible { opacity: 1; transform: none; }

/* ────────────────────────────────────────────────────────────────────────────
   LITE-UX-01 · Cuenta regresiva en cuatro unidades
   ──────────────────────────────────────────────────────────────────────────── */
.countdown-block { margin: 46px auto 0; text-align: center; }
.countdown-block .countdown-strip { margin-bottom: 26px; }
.countdown-grid { display: flex; justify-content: center; gap: 12px; flex-wrap: wrap; }
.countdown-unit {
  min-width: 88px; padding: 19px 12px 15px; background: #fff; border: 1px solid #e6edf5;
  border-radius: 18px; box-shadow: 0 10px 28px rgba(35,72,114,.07);
}
.countdown-unit strong {
  display: block; font-family: var(--display); font-size: clamp(1.9rem, 5vw, 2.6rem);
  color: var(--navy); letter-spacing: -.03em; line-height: 1; font-weight: 400;
  font-variant-numeric: tabular-nums;
}
.countdown-unit span { display: block; margin-top: 8px; font-size: .64rem; letter-spacing: .14em; font-weight: 800; color: #86a1b8; text-transform: uppercase; }
.countdown-message { margin: 0 auto; font-family: var(--display); font-style: italic; font-size: 1.3rem; color: #7795ae; max-width: 560px; line-height: 1.6; }

@media(max-width:420px){
  .welcome { padding: 20px 18px calc(20px + env(safe-area-inset-bottom)); }
  .envelope-wrap { width: min(272px, 80vw); height: 196px; margin: 20px auto 26px; }
  .seal { width: 48px; height: 48px; }
  .countdown-unit { min-width: 72px; padding: 15px 8px 12px; border-radius: 15px; }
  .countdown-unit strong { font-size: 1.7rem; }
  .sound-float { min-height: 44px; padding: 9px 15px; }
}
@media(prefers-reduced-motion:reduce){
  .welcome-shoots { display: none; }
  .welcome { transition: none !important; }
}