:root {  --cream: #FBF6EE; --cream-light: #FFFDF9; --cream-dark: #F3E8D6; --lilac: #D8CBF0; --lilac-light: #F1EBFA; --lilac-dark: #B9A5E0; --peach: #F4B494; --peach-light: #FCE6D8; --peach-dark: #A4502A; --gold: #E8C36A; --gold-light: #FBF0D3; --gold-dark: #86661A; --primary: #6A4BB0; --primary-light: #E9E1F7; --primary-dark: #47307E; --ink: #1F1A33; --ink-light: #4E4669; --ink-dark: #120E20; --night: #1B1530; --night-light: #2D2452; --night-dark: #0F0B1E;  --sage: #7FA88A; --sage-light: #D3E6D7; --sage-dark: #3F6B4C;  --whatsapp: #25D366; --whatsapp-light: #DCF8C6; --whatsapp-dark: #128C7E; --white: #FFFFFF;  --text-color: var(--ink); --text-color-muted: var(--ink-light); --heading-color: var(--ink); --link-color: var(--primary); --link-color-hover: var(--primary-dark); --bg-body: var(--cream); --focus-ring: var(--primary); --edge-color: var(--cream);  --eyebrow-color: var(--gold-dark);  --surface-card: var(--cream-light);  --field-bg: var(--white); --field-line: color-mix(in oklab, var(--primary) 62%, var(--white)); --border-card: var(--lilac-light); --text-on-night: var(--cream); --text-on-night-muted: var(--lilac); --heading-on-night: var(--cream-light); --accent-on-night: var(--gold);  --tint-white-glass: color-mix(in oklab, var(--white) 62%, transparent); --tint-white-edge: color-mix(in oklab, var(--white) 75%, transparent); --tint-night-glass: color-mix(in oklab, var(--night) 80%, transparent);  --tint-white-line: color-mix(in oklab, var(--white) 18%, transparent); --tint-white-soft: color-mix(in oklab, var(--white) 8%, transparent); --blob-lilac: color-mix(in oklab, var(--lilac) 70%, transparent); --blob-peach: color-mix(in oklab, var(--peach) 55%, transparent); --blob-gold: color-mix(in oklab, var(--gold) 45%, transparent); --blob-violet: color-mix(in oklab, var(--primary) 40%, transparent);  --gradient-dawn: linear-gradient(160deg, var(--cream-light) 0%, var(--cream) 30%, var(--lilac-light) 64%, var(--peach-light) 100%); --gradient-dusk: linear-gradient(180deg, var(--lilac-light) 0%, var(--cream) 55%, var(--peach-light) 100%); --gradient-night: linear-gradient(180deg, var(--night-dark) 0%, var(--night) 48%, var(--night-light) 100%); --gradient-button: linear-gradient(110deg, var(--primary) 0%, var(--primary-dark) 100%); --gradient-highlight: linear-gradient(90deg, color-mix(in oklab, var(--gold) 70%, transparent), color-mix(in oklab, var(--peach) 70%, transparent)); --gradient-starlight: radial-gradient(circle, var(--cream-light) 0%, var(--gold-light) 35%, transparent 70%);  --font-display: "Cormorant", "Iowan Old Style", Georgia, serif;  --font-body: "Jost", system-ui, -apple-system, "Segoe UI", sans-serif;  --font-script: "Pinyon Script", "Snell Roundhand", cursive;  --font-eyebrow: "Cinzel", "Trajan Pro", Georgia, serif;  --weight-regular: 400; --weight-medium: 500; --weight-semibold: 600; --leading-tight: 1.05; --leading-snug: 1.25; --leading-body: 1.65; --tracking-display: -0.01em; --tracking-eyebrow: 0.14em; --text-xs: clamp(1.2rem, 1.1648rem + 0.0939vw, 1.3rem);  --text-s: clamp(1.4rem, 1.3648rem + 0.0939vw, 1.5rem);  --text-m: clamp(1.6rem, 1.5296rem + 0.1878vw, 1.8rem);  --text-l: clamp(1.8rem, 1.6944rem + 0.2817vw, 2.1rem);  --text-xl: clamp(2.3rem, 1.9831rem + 0.8451vw, 3.2rem);  --text-xxl: clamp(3.2rem, 2.4958rem + 1.8779vw, 5.2rem);  --text-page-title: clamp(3.6rem, 2.6141rem + 2.6291vw, 6.4rem);  --text-display: clamp(4.4rem, 2.569rem + 4.8826vw, 9.6rem);   --space-xs: clamp(0.8rem, 0.6592rem + 0.3756vw, 1.2rem);  --space-s: clamp(1.2rem, 0.9183rem + 0.7512vw, 2rem);  --space-m: clamp(2rem, 1.5775rem + 1.1268vw, 3.2rem);  --space-l: clamp(3.2rem, 2.3549rem + 2.2535vw, 5.6rem);  --space-xl: clamp(4.8rem, 3.1099rem + 4.507vw, 9.6rem);  --space-xxl: clamp(7.2rem, 4.1014rem + 8.2629vw, 16rem);  --content-gap: var(--space-m); --grid-gap: var(--space-l);  --gutter: clamp(2rem, 0.4507rem + 4.1315vw, 6.4rem);  --section-padding-block: clamp(7.2rem, 4.6648rem + 6.7606vw, 14.4rem);  --width-wide: 136.6rem;  --width-narrow: 96rem;  --width-content: 72rem;  --measure-display: 16ch;  --measure-lede: 38ch;   --size-blob-l: clamp(28.8rem, 17.5324rem + 30.0469vw, 60.8rem);  --size-blob-m: clamp(20rem, 12.2535rem + 20.6573vw, 42rem);  --size-shooting: clamp(9.6rem, 6.2197rem + 9.0141vw, 19.2rem);  --size-moon: clamp(4rem, 2.3099rem + 4.507vw, 8.8rem);  --size-sparkle: clamp(1rem, 0.7183rem + 0.7512vw, 1.8rem);  --size-bell: clamp(1.6rem, 1.1775rem + 1.1268vw, 2.8rem);  --size-mote: 0.5rem;  --radius-s: 1rem; --radius-m: 1.8rem; --radius-l: clamp(2.4rem, 1.8366rem + 1.5023vw, 4rem);  --radius-pill: 100vmax;  --shadow-soft: 0 0.4rem 1.6rem color-mix(in oklab, var(--night) 6%, transparent), 0 1.6rem 4.8rem color-mix(in oklab, var(--primary) 9%, transparent); --shadow-lift: 0 0.8rem 2.4rem color-mix(in oklab, var(--night) 10%, transparent), 0 3.2rem 7.2rem color-mix(in oklab, var(--primary) 16%, transparent); --shadow-glow: 0 0 4rem color-mix(in oklab, var(--gold) 38%, transparent), 0 0 9.6rem color-mix(in oklab, var(--lilac) 50%, transparent); --shadow-inner-glow: inset 0 0.1rem 0 var(--tint-white-edge), inset 0 0 3.2rem color-mix(in oklab, var(--white) 50%, transparent); --shadow-inner-glow-night: inset 0 0.1rem 0 color-mix(in oklab, var(--white) 14%, transparent); --border-hairline: 0.1rem solid var(--tint-white-edge); --blur-glass: 1.6rem; --blur-blob: 7.2rem;  --ease-out: cubic-bezier(0.22, 1, 0.36, 1); --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1); --ease-float: cubic-bezier(0.37, 0, 0.63, 1); --ease-spring: cubic-bezier(0.34, 1.4, 0.64, 1); --duration-fast: 200ms; --duration-base: 450ms; --duration-slow: 900ms; --duration-reveal: 1200ms; --duration-twinkle: 4s; --duration-float: 7s; --duration-drift: 24s; --duration-shooting: 1.6s; --stagger: 90ms; --transition-base: var(--duration-base) var(--ease-out); }  @media (prefers-reduced-motion: reduce) { :root { --duration-fast: 1ms; --duration-base: 1ms; --duration-slow: 1ms; --duration-reveal: 1ms; --stagger: 0ms; } }  html { color-scheme: light; } body { overflow-x: clip; -webkit-font-smoothing: antialiased; } h1, h2, h3, h4 { text-wrap: pretty; }  p { text-wrap: pretty; } :focus-visible { outline: 0.2rem solid var(--focus-ring); outline-offset: 0.3rem; } ::selection { background: var(--gold-light); color: var(--ink-dark); }  .is-offscreen *, .is-offscreen *::before, .is-offscreen *::after { animation-play-state: paused !important; } .sky__blob, .cloud, .halo, .sky__comet, .sky__stars, .storybook, .lily-art, .thought, .fireflies__fly { will-change: transform, opacity; }  html { scroll-behavior: smooth; } html.lenis, html.lenis body { height: auto; } .lenis.lenis-smooth { scroll-behavior: auto !important; } .lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior: contain; } .lenis.lenis-stopped { overflow: hidden; } section[id] { scroll-margin-top: calc(var(--space-xl) + 4rem); }  .text-accent { font-style: italic; font-weight: 500; padding-inline-end: 0.08em; background: linear-gradient(100deg, var(--gold) 0%, var(--peach) 25%, var(--gold-light) 50%, var(--peach) 75%, var(--gold) 100%); background-size: 200% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; animation: lotv-shimmer calc(var(--duration-drift) / 3) linear infinite; } .section--dawn .text-accent, .section--dusk .text-accent { background-image: linear-gradient(100deg, var(--peach-dark) 0%, var(--primary) 30%, var(--gold-dark) 55%, var(--peach-dark) 80%, var(--primary) 100%); }  @media (max-width: 767px) { .sky__comets > :nth-child(n+3), .fireflies > :nth-child(n+6), .sky__sparkles > :nth-child(n+4), .sky__stars--near, .cloud--b { display: none; } }  @keyframes lotv-rise { from { opacity: 0; transform: translateY(var(--space-m)); } to { opacity: 1; transform: none; } } @keyframes lotv-bloom { from { opacity: 0; transform: scale(0.94); } to { opacity: 1; transform: none; } } @keyframes lotv-twinkle { 0% { opacity: 0.35; } 50% { opacity: 1; } 100% { opacity: 0.55; } } @keyframes lotv-sparkle { 0%, 100% { opacity: 0.3; transform: scale(0.6) rotate(0deg); } 50% { opacity: 1; transform: scale(1) rotate(45deg); } } @keyframes lotv-drift { 0% { transform: translate(0, 0) scale(1); } 50% { transform: translate(var(--space-l), calc(var(--space-m) * -1)) scale(1.08); } 100% { transform: translate(calc(var(--space-l) * -1), var(--space-l)) scale(0.95); } } @keyframes lotv-shoot { 0% { opacity: 0; transform: rotate(-32deg) translateX(0); } 1.5% { opacity: 1; } 9% { opacity: 0; transform: rotate(-32deg) translateX(-55vw); } 100% { opacity: 0; transform: rotate(-32deg) translateX(-55vw); } } @keyframes lotv-float { from { transform: translateY(0) rotate(-1deg); } to { transform: translateY(calc(var(--space-s) * -1)) rotate(1deg); } } @keyframes lotv-pulse { from { opacity: 0.7; transform: scale(0.97); } to { opacity: 1; transform: scale(1.03); } } @keyframes lotv-flicker { 0% { opacity: 0.75; } 40% { opacity: 1; } 70% { opacity: 0.85; } 100% { opacity: 0.95; } } @keyframes lotv-mote { 0% { transform: translate(0, 0) scale(0.6); opacity: 0; } 15% { opacity: 1; } 100% { transform: translate(var(--mote-drift, 0), calc(var(--space-xxl) * -2)) scale(1); opacity: 0; } } @keyframes lotv-sway { from { transform: rotate(-3deg); } to { transform: rotate(3deg); } } @keyframes lotv-shimmer { from { background-position: 0% 0; } to { background-position: -200% 0; } } @keyframes lotv-glow { from { opacity: 0.75; } to { opacity: 1; } } @keyframes lotv-ring { from { transform: rotate(-7deg); } to { transform: rotate(7deg); } } @keyframes lotv-flap { from { transform: scaleX(1); } to { transform: scaleX(0.3); } } @keyframes lotv-flutter { 0% { transform: translate(0, 0) rotate(0deg); } 50% { transform: translate(1.2rem, -1.6rem) rotate(6deg); } 100% { transform: translate(-0.8rem, -0.6rem) rotate(-4deg); } } @keyframes lotv-dash { to { stroke-dashoffset: -120; } } @keyframes lotv-wave { from { transform: skewY(-6deg) scaleX(0.9); } to { transform: skewY(6deg) scaleX(1.05); } } @keyframes lotv-steam { 0% { opacity: 0; transform: translateY(0.4rem); } 40% { opacity: 1; } 100% { opacity: 0; transform: translateY(-0.8rem); } } @keyframes lotv-firefly { 0% { opacity: 0; transform: translate(0, 0); } 20% { opacity: 1; } 50% { transform: translate(var(--fly-x, 2rem), var(--fly-y, -3rem)); } 80% { opacity: 0.9; } 100% { opacity: 0; transform: translate(calc(var(--fly-x, 2rem) * -0.5), calc(var(--fly-y, -3rem) * 1.5)); } } @keyframes lotv-cloud { from { transform: translateX(-6%); } to { transform: translateX(6%); } } @keyframes lotv-ping { 0% { transform: scale(1); opacity: 0.55; } 80%, 100% { transform: scale(1.6); opacity: 0; } }  @media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 1ms !important; animation-iteration-count: 1 !important; animation-delay: 0ms !important; transition-duration: 1ms !important; } }  .form-card, .modal-card { --text-color: var(--ink); --text-color-muted: var(--ink-light); --heading-color: var(--ink); --eyebrow-color: var(--gold-dark); --link-color: var(--primary); --link-color-hover: var(--primary-dark); --focus-ring: var(--primary); color: var(--text-color); }  .form--steps .form-steps__progress { display: grid; gap: var(--space-s); margin-bottom: var(--space-m); } .form--steps .form-steps__list { display: flex; justify-content: space-between; gap: var(--space-xs); margin: 0; padding: 0; list-style: none; counter-reset: lotv-step; } .form--steps .form-steps__label { counter-increment: lotv-step; display: flex; align-items: center; gap: var(--space-xs); font-family: var(--font-eyebrow); font-size: var(--text-xs); font-weight: 600; letter-spacing: var(--tracking-eyebrow); text-transform: uppercase; color: var(--text-color-muted); opacity: 0.6; transition: opacity var(--transition-base), color var(--transition-base); } .form--steps .form-steps__label::before { content: counter(lotv-step, upper-roman); display: grid; place-items: center; flex-shrink: 0; inline-size: 3.2rem; aspect-ratio: 1; border-radius: 50%; border: 0.1rem solid currentColor; font-family: var(--font-display); font-size: var(--text-m); font-style: italic; letter-spacing: 0; transition: background-color var(--transition-base), color var(--transition-base), box-shadow var(--transition-base); } .form--steps .form-steps__label.is-active, .form--steps .form-steps__label.is-done { color: var(--eyebrow-color); opacity: 1; } .form--steps .form-steps__label.is-active::before { box-shadow: 0 0 1.6rem color-mix(in oklab, var(--gold) 55%, transparent); } .form--steps .form-steps__label.is-done::before { background: var(--eyebrow-color); color: var(--night); } .form--steps .form-steps__bar { block-size: 0.4rem; border-radius: var(--radius-pill); background: var(--field-line); overflow: hidden; } .form--steps .form-steps__bar-fill { display: block; block-size: 100%; inline-size: var(--steps-progress, 33%); background: linear-gradient(90deg, var(--gold), var(--peach)); box-shadow: 0 0 1.2rem var(--gold); transition: inline-size var(--duration-slow) var(--ease-out); } .form--steps .form-steps__status { margin: 0; font-size: var(--text-s); color: var(--text-color-muted); } .form--steps .form-steps__step { margin: 0; padding: 0; border: 0; min-inline-size: 0; animation: lotv-rise var(--duration-slow) var(--ease-out) both; } .form--steps .form-steps__step[hidden] { display: none; } .form--steps .form-steps__legend { padding: 0; margin-bottom: var(--space-s); font-family: var(--font-display); font-size: var(--text-xl); font-weight: 600; line-height: var(--leading-snug); color: var(--heading-color); } .form--steps .form-steps__nav { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-s); margin-top: var(--space-s); } .form--steps .form-steps__nav > :only-child { margin-inline-start: auto; } .form--steps .form-steps__nav > div { margin: 0; } .form--steps .form-steps__next, .form--steps .form-steps__back { padding: var(--space-s) var(--space-m); border-radius: var(--radius-pill); font-family: var(--font-body); font-size: var(--text-m); font-weight: 500; line-height: 1.2; cursor: pointer; transition: background-color var(--transition-base), color var(--transition-base), box-shadow var(--transition-base), transform var(--duration-base) var(--ease-spring); } .form--steps .form-steps__next { border: 0; background: var(--gold); color: var(--ink-dark); box-shadow: 0 0 1.6rem color-mix(in oklab, var(--gold) 35%, transparent); } .form--steps .form-steps__next:hover { background: var(--gold-light); box-shadow: var(--shadow-glow); transform: translateY(-0.2rem); } .form--steps .form-steps__back { border: 0.1rem solid var(--field-line); background: transparent; color: var(--text-color); } .form--steps .form-steps__back:hover { border-color: var(--gold); }  .form--steps .form-steps__progress, .form--steps .form-steps__step { flex: 0 0 100%; inline-size: 100%; } .form--steps .form-steps__step > div { inline-size: 100%; } .form--steps input:not([type="radio"]):not([type="checkbox"]), .form--steps select, .form--steps textarea { inline-size: 100%; }  .form--steps li:has(> input[type="radio"]) { position: relative; } .form--steps ul:has(input[type="radio"]) { display: flex; flex-wrap: wrap; gap: var(--space-xs); margin: 0; padding: 0; list-style: none; } .form--steps input[type="radio"] { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; } .form--steps input[type="radio"] + label { display: inline-flex; align-items: center; gap: var(--space-xs); padding: var(--space-xs) var(--space-m); border-radius: var(--radius-pill); border: 0.1rem solid var(--field-line); background: var(--field-bg); color: var(--text-color); cursor: pointer; transition: background-color var(--transition-base), color var(--transition-base), border-color var(--transition-base); } .form--steps input[type="radio"]:hover + label { border-color: var(--gold); } .form--steps input[type="radio"]:checked + label { background: var(--gold); border-color: var(--gold); color: var(--ink-dark); } .form--steps input[type="radio"]:focus-visible + label { outline: 0.2rem solid var(--focus-ring); outline-offset: 0.3rem; } @media (max-width: 478px) { .form--steps .form-steps__label { font-size: 0; gap: 0; } .form--steps .form-steps__label::before { font-size: var(--text-m); } }