@import url("https://fonts.googleapis.com/css2?family=Baloo+2:wght@500;600;700;800&family=Chewy&family=DM+Sans:wght@400;500;600;700;800&family=Fredoka:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,400;0,500;0,600;1,400;1,500&display=swap");

:root {
  --font-body: "DM Sans";
  --font-display: "Playfair Display";
  --cream: #fbf6ef;
  --paper: #fffdf9;
  --ink: #302528;
  --muted: #837477;
  --rose: #bd8993;
  --rose-soft: #f0dfe0;
  --wine: #6e2638;
  --gold: #c6a66d;
  --line: #eadfda;
  --shadow: 0 24px 80px rgba(81, 48, 55, .11);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--cream); font-family: var(--font-body), Arial, sans-serif; }
button, input, textarea, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { color: inherit; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
::selection { background: #ead0d5; color: var(--wine); }
:focus-visible { outline: 3px solid color-mix(in srgb, var(--rose) 55%, transparent); outline-offset: 3px; }

.overline { margin: 0 0 16px; color: var(--rose); font-size: 11px; font-weight: 800; letter-spacing: .25em; }
.primary-action { display: inline-flex; align-items: center; justify-content: center; gap: 26px; min-height: 53px; padding: 0 25px; border: 0; border-radius: 4px; background: var(--wine); color: white; font-size: 13px; font-weight: 800; letter-spacing: .04em; cursor: pointer; box-shadow: 0 12px 28px rgba(110, 38, 56, .18); transition: transform .2s, box-shadow .2s, background .2s; }
.primary-action:hover { transform: translateY(-2px); box-shadow: 0 16px 34px rgba(110, 38, 56, .23); background: #7c2c41; }
.primary-action.light { background: white; color: var(--wine); }
.underlined-action { padding-bottom: 5px; border-bottom: 1px solid currentColor; font-size: 12px; font-weight: 800; letter-spacing: .08em; }
.underlined-action.centered { display: table; margin: 46px auto 0; }

/* Marketing */
.marketing-page { min-height: 100vh; overflow: hidden; background: var(--paper); }
.marketing-nav { position: relative; z-index: 10; height: 88px; display: flex; align-items: center; justify-content: space-between; max-width: 1380px; margin: 0 auto; padding: 0 45px; border-bottom: 1px solid rgba(110, 38, 56, .08); }
.marketing-brand, .studio-brand { display: flex; align-items: center; gap: 11px; }
.marketing-brand > span, .studio-brand > span { width: 39px; height: 39px; display: grid; place-items: center; border: 1px solid var(--rose); border-radius: 50%; color: var(--wine); font-family: var(--font-display), serif; font-size: 13px; font-weight: 700; }
.marketing-brand div, .studio-brand div { display: flex; flex-direction: column; line-height: 1; }
.marketing-brand strong, .studio-brand strong { font-family: var(--font-display), serif; font-size: 21px; font-weight: 600; }
.marketing-brand small, .studio-brand small { margin-top: 5px; color: var(--rose); font-size: 8px; font-weight: 800; letter-spacing: .28em; }
.marketing-nav nav { display: flex; gap: 38px; font-size: 11px; font-weight: 700; letter-spacing: .1em; }
.marketing-nav nav a { transition: color .2s; }
.marketing-nav nav a:hover { color: var(--rose); }
.nav-cta { padding: 12px 18px; border: 1px solid var(--wine); border-radius: 3px; color: var(--wine); font-size: 11px; font-weight: 800; letter-spacing: .08em; transition: background .2s, color .2s; }
.nav-cta:hover { background: var(--wine); color: white; }
.marketing-hero { position: relative; min-height: 690px; display: grid; grid-template-columns: 1fr 1fr; align-items: center; max-width: 1380px; margin: 0 auto; padding: 70px 70px 86px; }
.hero-copy { position: relative; z-index: 2; max-width: 590px; }
.hero-copy h1 { margin: 0; font-family: var(--font-display), serif; font-size: clamp(66px, 6vw, 96px); font-weight: 500; line-height: .92; letter-spacing: -.045em; }
.hero-copy h1 em { color: var(--rose); font-weight: 400; }
.hero-copy > p:not(.overline) { max-width: 480px; margin: 30px 0 32px; color: var(--muted); font-family: var(--font-display), serif; font-size: 20px; line-height: 1.55; }
.hero-actions { display: flex; align-items: center; gap: 30px; }
.trust-line { display: flex; align-items: center; gap: 10px; margin-top: 34px; color: #9c8e8d; font-size: 11px; }
.trust-line > span { color: var(--gold); }
.trust-line p { margin: 0; }
.trust-line strong { color: var(--ink); }
.hero-showcase { position: relative; height: 550px; }
.showcase-phone { position: absolute; z-index: 4; left: 50%; top: 50%; width: 256px; height: 515px; padding: 10px; border: 1px solid #ddd0ca; border-radius: 41px; background: #1e181a; box-shadow: 0 35px 80px rgba(71, 45, 52, .24); transform: translate(-50%, -50%) rotate(1.8deg); }
.showcase-notch { position: absolute; z-index: 2; top: 17px; left: 50%; width: 77px; height: 18px; border-radius: 20px; background: #1e181a; transform: translateX(-50%); }
.showcase-screen { height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 48px 24px 32px; overflow: hidden; border-radius: 32px; background: radial-gradient(circle at 10% 18%, #fff 0 3px, transparent 4px), radial-gradient(circle at 80% 76%, #d9b97c 0 2px, transparent 3px), linear-gradient(150deg, #f7e9e8, #fffaf5 50%, #ecd9db); text-align: center; }
.showcase-screen::before, .showcase-screen::after { content: ""; position: absolute; width: 125px; height: 210px; border: 1px solid rgba(126, 68, 83, .18); border-radius: 50%; transform: rotate(40deg); }
.showcase-screen::before { top: 60px; left: -40px; }.showcase-screen::after { right: -44px; bottom: 38px; }
.showcase-screen small { position: relative; z-index: 1; color: var(--wine); font-size: 8px; font-weight: 800; letter-spacing: .28em; }
.showcase-screen h2 { position: relative; z-index: 1; margin: 21px 0 12px; color: var(--wine); font-family: var(--font-display), serif; font-size: 40px; font-weight: 500; line-height: .9; }
.showcase-screen h2 b { color: var(--rose); font-size: 28px; font-style: italic; font-weight: 400; }
.showcase-screen i, .showcase-star { color: var(--gold); font-style: normal; }
.showcase-screen p { position: relative; z-index: 1; margin: 18px 0 32px; color: #7a6469; font-size: 7px; font-weight: 800; letter-spacing: .14em; }
.showcase-screen button { position: relative; z-index: 1; padding: 12px 19px; border: 1px solid var(--wine); border-radius: 2px; background: transparent; color: var(--wine); font-size: 7px; font-weight: 800; letter-spacing: .18em; }
.showcase-card { position: absolute; z-index: 2; width: 245px; height: 190px; padding: 32px; border: 1px solid #e5d8d2; background: #fffdfa; box-shadow: var(--shadow); }
.showcase-card span { color: var(--rose); font-size: 8px; font-weight: 800; letter-spacing: .2em; }
.showcase-card h3 { margin: 20px 0; font-family: var(--font-display), serif; font-size: 24px; font-weight: 500; line-height: 1.1; }
.showcase-card i { color: var(--gold); font-style: normal; }
.card-back { left: 2%; top: 13%; transform: rotate(-7deg); }
.card-front { right: 0; bottom: 11%; text-align: center; transform: rotate(7deg); }
.card-front div { margin: 18px 0 4px; }.card-front strong { display: block; color: var(--wine); font-family: var(--font-display), serif; font-size: 48px; line-height: .8; }.card-front small { color: var(--muted); font-size: 7px; letter-spacing: .2em; }.card-front p { color: var(--muted); font-family: var(--font-display), serif; font-style: italic; font-size: 13px; }
.floating-heart { position: absolute; z-index: 5; right: 12%; top: 17%; width: 64px; height: 64px; display: grid; place-items: center; border-radius: 50%; background: var(--wine); color: white; font-size: 27px; box-shadow: 0 16px 35px #6e26383d; }
.hero-blossom { position: absolute; border: 1px solid rgba(189, 137, 147, .17); border-radius: 50%; pointer-events: none; }
.blossom-one { width: 250px; height: 520px; left: -150px; top: 100px; transform: rotate(28deg); }.blossom-two { width: 300px; height: 620px; right: -220px; top: -40px; transform: rotate(22deg); }
.love-strip { min-height: 78px; display: flex; align-items: center; justify-content: center; gap: 24px; padding: 18px 30px; background: var(--wine); color: #f7e9e7; text-align: center; }
.love-strip p { margin: 0; font-family: var(--font-display), serif; font-size: 16px; font-style: italic; letter-spacing: .02em; }.love-strip span { color: var(--gold); }
.styles-section, .steps-section { padding: 110px 50px; background: var(--cream); }
.marketing-section-title { max-width: 750px; margin: 0 auto 62px; text-align: center; }
.marketing-section-title h2, .features-copy h2, .final-cta h2 { margin: 0; font-family: var(--font-display), serif; font-size: clamp(43px, 4vw, 62px); font-weight: 500; line-height: 1.08; letter-spacing: -.025em; }
.marketing-section-title h2 em, .features-copy h2 em, .final-cta h2 em { color: var(--rose); font-weight: 400; }
.marketing-section-title > p:last-child { color: var(--muted); font-size: 14px; }
.style-showcase-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; max-width: 1250px; margin: 0 auto; }
.style-showcase-grid article { min-width: 0; }
.style-art { position: relative; height: 390px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 24px; overflow: hidden; border: 1px solid #e9ddd8; text-align: center; transition: transform .3s, box-shadow .3s; }
.style-showcase-grid article:hover .style-art { transform: translateY(-8px); box-shadow: var(--shadow); }
.style-art::before, .style-art::after { content: ""; position: absolute; width: 130px; height: 260px; border: 1px solid color-mix(in srgb, currentColor 12%, transparent); border-radius: 50%; }
.style-art::before { left: -70px; top: -35px; transform: rotate(-35deg); }.style-art::after { right: -80px; bottom: -50px; transform: rotate(40deg); }
.style-art > span { position: absolute; top: 16px; right: 18px; color: #9c8989; font-size: 9px; }.style-art small { color: var(--rose); font-size: 7px; font-weight: 800; letter-spacing: .24em; }.style-art h3 { max-width: 230px; margin: 22px 0 15px; font-family: var(--font-display), serif; font-size: 34px; font-weight: 500; line-height: .95; }.style-art i { color: var(--gold); font-style: normal; }.style-art p { max-width: 180px; color: var(--muted); font-size: 7px; font-weight: 700; letter-spacing: .11em; line-height: 1.6; }
.style-showcase-grid article > div:last-child { padding: 18px 4px; }.style-showcase-grid article > div:last-child > p { margin: 0 0 6px; color: var(--rose); font-size: 9px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }.style-showcase-grid article > div:last-child h3 { display: inline; margin: 0; font-family: var(--font-display), serif; font-size: 22px; font-weight: 600; }
.style-colors { float: right; display: flex; gap: 5px; margin-top: 7px; }.style-colors i { width: 13px; height: 13px; border: 1px solid #0001; border-radius: 50%; }
.features-section { display: grid; grid-template-columns: .85fr 1.15fr; gap: 70px; padding: 110px max(50px, calc((100vw - 1250px)/2)); background: var(--wine); color: white; }
.features-copy { max-width: 480px; }.features-copy .overline { color: #d6b479; }.features-copy h2 em { color: #e8bfc6; }.features-copy > p:not(.overline) { margin: 28px 0 34px; color: #dfcdd1; font-family: var(--font-display), serif; font-size: 18px; line-height: 1.6; }
.features-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }.features-grid article { min-height: 180px; padding: 28px; border: 1px solid #ffffff1f; background: #ffffff0a; }.features-grid article > span { color: #d6b479; font-family: var(--font-display), serif; font-size: 25px; }.features-grid h3 { margin: 17px 0 9px; font-family: var(--font-display), serif; font-size: 20px; font-weight: 600; }.features-grid p { margin: 0; color: #d7c4c8; font-size: 12px; line-height: 1.6; }
.steps-section { background: white; }.steps-grid { display: grid; grid-template-columns: repeat(3, 1fr); max-width: 1050px; margin: 0 auto; }.steps-grid article { position: relative; padding: 40px 60px; text-align: center; }.steps-grid article:not(:last-child)::after { content: ""; position: absolute; right: 0; top: 50%; width: 1px; height: 100px; background: var(--line); transform: translateY(-50%); }.steps-grid span { color: var(--rose); font-family: var(--font-display), serif; font-size: 42px; font-style: italic; }.steps-grid h3 { margin: 18px 0 10px; font-family: var(--font-display), serif; font-size: 23px; font-weight: 600; }.steps-grid p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.6; }
.final-cta { position: relative; padding: 105px 30px; overflow: hidden; background: linear-gradient(145deg, #f6e6e5, #fcf5ee); text-align: center; }.final-cta > span { color: var(--gold); }.final-cta .overline { margin-top: 16px; }.final-cta > p:not(.overline) { margin: 23px 0 30px; color: var(--muted); font-family: var(--font-display), serif; font-size: 17px; }.cta-pearl { position: absolute; border: 1px solid #b98a9333; border-radius: 50%; }.cta-pearl.one { width: 340px; height: 600px; left: -220px; top: -150px; transform: rotate(25deg); }.cta-pearl.two { width: 400px; height: 650px; right: -270px; bottom: -260px; transform: rotate(-28deg); }
.marketing-footer { display: grid; grid-template-columns: 1fr 1fr auto auto; align-items: center; gap: 35px; padding: 42px max(45px, calc((100vw - 1250px)/2)); border-top: 1px solid var(--line); background: var(--paper); }.marketing-footer > p { color: var(--muted); font-family: var(--font-display), serif; font-size: 14px; font-style: italic; }.marketing-footer nav { display: flex; gap: 20px; font-size: 10px; font-weight: 800; letter-spacing: .08em; }.marketing-footer > small { color: #a09290; font-size: 9px; }

/* Dashboard and studio */
.dashboard-shell, .studio-shell { min-height: 100vh; background: #f8f5f1; }
.studio-topbar { position: relative; z-index: 20; height: 72px; display: grid; grid-template-columns: 240px 1fr auto; align-items: center; gap: 20px; padding: 0 25px; border-bottom: 1px solid #e8e1dc; background: rgba(255,255,255,.96); }.dashboard-topbar { grid-template-columns: 1fr auto; height: 82px; padding: 0 max(35px, calc((100vw - 1240px)/2)); }.studio-brand > span { width: 34px; height: 34px; font-size: 11px; }.studio-brand strong { font-size: 18px; }.button-brand { padding: 0; border: 0; background: none; text-align: left; cursor: pointer; }
.account-chip { display: flex; align-items: center; gap: 10px; }.account-chip > span { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 50%; background: var(--wine); color: white; font-family: var(--font-display), serif; }.account-chip div { display: flex; flex-direction: column; }.account-chip strong { font-size: 12px; }.account-chip small { margin-top: 3px; color: var(--muted); font-size: 9px; }
.dashboard-content { max-width: 1240px; margin: 0 auto; padding: 65px 35px 100px; }.dashboard-welcome { display: flex; align-items: flex-end; justify-content: space-between; gap: 40px; }.dashboard-welcome > div { max-width: 710px; }.dashboard-welcome h1 { margin: 0 0 16px; font-family: var(--font-display), serif; font-size: clamp(42px, 4.5vw, 64px); font-weight: 500; line-height: 1.02; letter-spacing: -.03em; }.dashboard-welcome > div > p:last-child { margin: 0; color: var(--muted); font-family: var(--font-display), serif; font-size: 17px; }
.metric-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin: 50px 0 70px; }.metric-row article { display: flex; align-items: center; gap: 17px; padding: 22px; border: 1px solid #e9dfda; background: white; }.metric-row article > span { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; background: #f6e9e9; color: var(--wine); }.metric-row article div { display: flex; flex-direction: column; }.metric-row strong { font-family: var(--font-display), serif; font-size: 28px; font-weight: 600; line-height: 1; }.metric-row small { margin-top: 5px; color: var(--muted); font-size: 10px; font-weight: 700; letter-spacing: .05em; }
.section-heading { display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 25px; }.section-heading h2 { margin: 0; font-family: var(--font-display), serif; font-size: 34px; font-weight: 600; }.text-action { border: 0; border-bottom: 1px solid; background: transparent; color: var(--wine); font-size: 11px; font-weight: 800; cursor: pointer; }
.empty-projects, .mini-empty { padding: 65px 30px; border: 1px dashed #d8c9c5; background: #fffaf7; text-align: center; }.empty-bow { width: 62px; height: 62px; display: grid; place-items: center; margin: 0 auto 15px; border-radius: 50%; background: var(--rose-soft); color: var(--wine); font-size: 26px; }.empty-projects h3 { margin: 0; font-family: var(--font-display), serif; font-size: 27px; }.empty-projects p { color: var(--muted); font-size: 13px; }.empty-projects .primary-action { margin-top: 12px; }
.project-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; }.project-card { overflow: hidden; border: 1px solid #e8ddd8; background: white; transition: transform .2s, box-shadow .2s; }.project-card:hover { transform: translateY(-4px); box-shadow: var(--shadow); }.project-cover { position: relative; width: 100%; height: 310px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 30px; border: 0; color: var(--ink); cursor: pointer; overflow: hidden; }.project-cover::before, .project-cover::after { content: ""; position: absolute; width: 140px; height: 280px; border: 1px solid #76545d22; border-radius: 50%; transform: rotate(35deg); }.project-cover::before { left: -80px; top: -70px; }.project-cover::after { right: -80px; bottom: -90px; }.project-status { position: absolute; top: 15px; left: 15px; padding: 6px 8px; border-radius: 20px; background: #ffffffcc; color: #6c5f61; font-size: 8px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }.cover-ornament { color: var(--gold); }.project-cover small { margin-top: 17px; color: var(--rose); font-size: 8px; font-weight: 800; letter-spacing: .2em; }.project-cover h3 { max-width: 280px; margin: 19px 0 13px; font-family: var(--font-display), serif; font-size: 34px; font-weight: 500; line-height: 1; }.project-cover p { color: var(--muted); font-size: 8px; font-weight: 700; letter-spacing: .12em; }.project-meta { display: flex; justify-content: space-between; align-items: flex-start; padding: 18px 19px 12px; }.project-meta h3 { margin: 0 0 5px; font-family: var(--font-display), serif; font-size: 19px; }.project-meta p { margin: 0; color: var(--muted); font-size: 10px; }.project-meta > button { width: 30px; border: 0; background: none; font-size: 20px; cursor: pointer; }.project-footer { display: flex; justify-content: space-between; padding: 12px 19px 18px; color: var(--muted); font-size: 9px; }.project-footer button { border: 0; background: none; color: var(--wine); font-size: 10px; font-weight: 800; cursor: pointer; }
.modal-backdrop { position: fixed; z-index: 100; inset: 0; display: grid; place-items: center; padding: 25px; overflow: auto; background: rgba(36, 25, 28, .58); backdrop-filter: blur(8px); }.template-modal { position: relative; width: min(1050px, 100%); max-height: calc(100vh - 50px); padding: 43px; overflow: auto; background: #fffdf9; box-shadow: 0 30px 100px #0005; }.modal-close { position: absolute; right: 24px; top: 20px; width: 36px; height: 36px; border: 1px solid var(--line); border-radius: 50%; background: white; font-size: 23px; cursor: pointer; }.template-modal > h2 { margin: 0; font-family: var(--font-display), serif; font-size: 39px; font-weight: 600; }.template-modal > p:not(.overline) { color: var(--muted); font-size: 13px; }.create-basics { display: grid; grid-template-columns: 1.5fr 1fr; gap: 15px; margin: 28px 0; }.create-basics label { color: var(--muted); font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .07em; }.create-basics input { width: 100%; height: 46px; margin-top: 7px; padding: 0 13px; border: 1px solid var(--line); background: white; color: var(--ink); font-size: 13px; text-transform: none; }.template-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }.template-grid > button { display: grid; grid-template-columns: 145px 1fr; gap: 20px; align-items: center; padding: 10px; border: 1px solid var(--line); background: white; text-align: left; cursor: pointer; transition: border-color .2s, transform .2s; }.template-grid > button:hover { border-color: var(--rose); transform: translateY(-2px); }.template-art { height: 180px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 15px; text-align: center; }.template-art > span { color: var(--gold); }.template-art small { margin-top: 12px; color: var(--rose); font-size: 6px; font-weight: 800; letter-spacing: .18em; }.template-art strong { margin: 13px 0; font-family: var(--font-display), serif; font-size: 21px; font-weight: 500; line-height: .95; }.template-art em { color: var(--muted); font-size: 6px; font-style: normal; letter-spacing: .1em; }.template-grid > button > div:last-child > span { color: var(--rose); font-size: 8px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }.template-grid h3 { margin: 7px 0; font-family: var(--font-display), serif; font-size: 23px; }.template-grid p { margin: 0 0 13px; color: var(--muted); font-size: 10px; line-height: 1.5; }.swatches { display: flex; gap: 6px; }.swatches i { width: 15px; height: 15px; border: 1px solid #0001; border-radius: 50%; }
.topbar-title { display: flex; align-items: center; gap: 9px; min-width: 0; color: var(--muted); font-size: 11px; }.topbar-title button { padding: 0; border: 0; background: none; color: var(--muted); cursor: pointer; }.topbar-title strong { max-width: 260px; overflow: hidden; color: var(--ink); text-overflow: ellipsis; white-space: nowrap; }.topbar-title em { padding: 5px 8px; border-radius: 20px; background: #f3edea; color: #7e6e6e; font-size: 8px; font-style: normal; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }.topbar-title em.published { background: #e6f3eb; color: #39704c; }.topbar-actions { display: flex; align-items: center; gap: 10px; }.save-state { color: #8b7c7c; font-size: 9px; }.ghost-button, .publish-button { min-height: 38px; padding: 0 14px; border: 1px solid #dfd5d1; border-radius: 3px; background: white; font-size: 10px; font-weight: 800; cursor: pointer; }.publish-button { border-color: var(--wine); background: var(--wine); color: white; }
.studio-workspace { height: calc(100vh - 72px); display: grid; grid-template-columns: 112px minmax(430px, 540px) 1fr; overflow: hidden; }.studio-rail { display: flex; flex-direction: column; gap: 2px; padding: 16px 9px; border-right: 1px solid #e7ded9; background: #fffdfb; }.studio-rail button { display: flex; flex-direction: column; align-items: center; gap: 7px; padding: 11px 4px; border: 0; border-radius: 5px; background: transparent; color: #847679; font-size: 8px; font-weight: 700; cursor: pointer; }.studio-rail button > span { font-family: var(--font-display), serif; font-size: 18px; }.studio-rail button:hover, .studio-rail button.active { background: #f4e8e8; color: var(--wine); }.editor-panel { padding: 35px 34px 80px; overflow-y: auto; border-right: 1px solid #e7ded9; background: white; }.panel-title { margin-bottom: 30px; }.panel-title h2 { margin: 0 0 9px; font-family: var(--font-display), serif; font-size: 31px; font-weight: 600; }.panel-title > p:last-child { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.5; }.field-section { margin: 0 -2px 30px; padding-bottom: 27px; border-bottom: 1px solid #eee7e3; }.field-section h3 { margin: 0 0 17px; color: var(--ink); font-family: var(--font-display), serif; font-size: 18px; font-weight: 600; }.studio-field { display: block; margin-bottom: 13px; }.studio-field > span { display: block; margin-bottom: 6px; color: #786b6d; font-size: 9px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }.studio-field input, .studio-field textarea { width: 100%; padding: 11px 12px; border: 1px solid #e3d9d5; border-radius: 3px; background: #fffdfb; color: var(--ink); font-size: 12px; outline: none; transition: border-color .2s, box-shadow .2s; }.studio-field input { height: 42px; }.studio-field textarea { resize: vertical; line-height: 1.55; }.studio-field input:focus, .studio-field textarea:focus { border-color: var(--rose); box-shadow: 0 0 0 3px #bd89931a; }.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 11px; }.palette-presets { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }.palette-presets button { padding: 10px; border: 1px solid #e5dcd8; border-radius: 3px; background: white; text-align: left; cursor: pointer; }.palette-presets button:hover { border-color: var(--rose); }.palette-presets button > span { display: flex; margin-bottom: 7px; overflow: hidden; border-radius: 3px; }.palette-presets i { flex: 1; height: 20px; }.palette-presets strong { font-family: var(--font-display), serif; font-size: 13px; }.color-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }.color-grid label > span { display: block; margin-bottom: 6px; color: var(--muted); font-size: 9px; font-weight: 700; }.color-grid label > div { display: flex; height: 38px; border: 1px solid #e2d8d3; background: white; }.color-grid input[type=color] { width: 44px; padding: 4px; border: 0; background: transparent; }.color-grid input:last-child { min-width: 0; flex: 1; padding: 0 8px; border: 0; font-size: 10px; }.design-note { display: flex; gap: 14px; padding: 17px; border: 1px solid #e7dad5; background: #fbf6f2; }.design-note > span { color: var(--gold); }.design-note strong { font-family: var(--font-display), serif; font-size: 14px; }.design-note p { margin: 5px 0 0; color: var(--muted); font-size: 10px; line-height: 1.5; }
.schedule-editor { display: flex; flex-direction: column; gap: 9px; }.schedule-editor article { display: grid; grid-template-columns: 34px 1fr 25px; gap: 10px; align-items: center; padding: 11px; border: 1px solid #e7ded9; border-radius: 3px; background: #fffdfb; }.drag-handle { width: 31px; height: 31px; display: grid; place-items: center; border-radius: 50%; background: var(--rose-soft); color: var(--wine); font-family: var(--font-display), serif; font-size: 11px; }.schedule-fields { display: grid; grid-template-columns: 75px 1fr; gap: 5px; }.schedule-fields input { min-width: 0; height: 32px; padding: 0 7px; border: 1px solid #e6deda; background: white; font-size: 10px; }.schedule-fields input:last-child { grid-column: 2; color: var(--muted); }.schedule-editor article > button { border: 0; background: none; color: #a58080; font-size: 19px; cursor: pointer; }.add-row-button { width: 100%; margin-top: 12px; padding: 12px; border: 1px dashed #d3c3be; background: #fbf7f4; color: var(--wine); font-size: 10px; font-weight: 800; cursor: pointer; }
.upload-box { min-height: 180px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 20px; overflow: hidden; border: 1px dashed #cab6b2; background: #fbf6f2; cursor: pointer; text-align: center; }.upload-box img { width: 100%; height: 170px; margin: -20px -20px 13px; object-fit: cover; }.upload-box > span { color: var(--rose); font-size: 31px; }.upload-box strong { margin-top: 10px; font-family: var(--font-display), serif; font-size: 16px; }.upload-box small { margin-top: 4px; color: var(--muted); font-size: 9px; }.upload-box input, .gallery-editor input, .audio-upload input { display: none; }.danger-text { margin-top: 8px; padding: 0; border: 0; background: none; color: #a33d50; font-size: 9px; font-weight: 800; cursor: pointer; }.gallery-editor { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }.gallery-editor > div, .gallery-editor > label { position: relative; aspect-ratio: 1; overflow: hidden; border: 1px solid #e5dad5; }.gallery-editor img { width: 100%; height: 100%; object-fit: cover; }.gallery-editor button { position: absolute; right: 4px; top: 4px; width: 22px; height: 22px; border: 0; border-radius: 50%; background: #fff; cursor: pointer; }.gallery-editor > label { display: flex; flex-direction: column; align-items: center; justify-content: center; background: #fbf6f2; color: var(--rose); cursor: pointer; }.gallery-editor > label span { font-size: 23px; }.gallery-editor > label small { margin-top: 4px; font-size: 8px; }.audio-upload { display: flex; align-items: center; gap: 13px; padding: 15px; border: 1px solid #e5dad5; background: #fbf6f2; cursor: pointer; }.audio-upload > span { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; background: var(--wine); color: white; }.audio-upload > div { flex: 1; display: flex; flex-direction: column; }.audio-upload strong { font-family: var(--font-display), serif; font-size: 14px; }.audio-upload small { margin-top: 3px; color: var(--muted); font-size: 8px; }.audio-upload em { color: var(--wine); font-size: 9px; font-style: normal; font-weight: 800; }
.guest-form { padding: 18px; border: 1px solid #e5dad5; background: #fbf7f4; }.guest-form .primary-action { width: 100%; min-height: 42px; }.list-header { display: flex; justify-content: space-between; align-items: center; margin: 26px 0 12px; color: var(--muted); font-size: 10px; font-weight: 800; }.list-header button { padding: 0; border: 0; border-bottom: 1px solid; background: none; color: var(--wine); font-size: 9px; font-weight: 800; cursor: pointer; }.guest-list article { display: grid; grid-template-columns: 36px 1fr auto; gap: 10px; align-items: center; padding: 13px 0; border-bottom: 1px solid #eee7e3; }.guest-avatar { width: 35px; height: 35px; display: grid; place-items: center; border-radius: 50%; background: var(--rose-soft); color: var(--wine); font-family: var(--font-display), serif; }.guest-list article strong { font-size: 11px; }.guest-list article p { margin: 3px 0; color: var(--muted); font-size: 9px; }.guest-list article small { color: #60816b; font-size: 8px; font-weight: 700; }.guest-actions { display: flex; gap: 4px; }.guest-actions button { padding: 7px 9px; border: 1px solid #e2d7d3; background: white; color: var(--wine); font-size: 8px; font-weight: 800; cursor: pointer; }.mini-empty { padding: 35px 15px; }.mini-empty span { color: var(--rose); font-size: 26px; }.mini-empty p { color: var(--muted); font-size: 10px; }
.rsvp-metrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; }.rsvp-metrics article { padding: 14px 9px; border: 1px solid #e6dcd8; background: #fbf7f4; text-align: center; }.rsvp-metrics strong { display: block; font-family: var(--font-display), serif; font-size: 25px; }.rsvp-metrics span { color: var(--muted); font-size: 7px; font-weight: 700; }.responses-list article { display: grid; grid-template-columns: 31px 1fr auto; gap: 10px; padding: 14px 0; border-bottom: 1px solid #eee7e3; }.responses-list article > span { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; background: #e7f3eb; color: #3c7a51; }.responses-list article > span.no { background: #f7e5e7; color: #9d3f4e; }.responses-list strong { font-size: 11px; }.responses-list p { margin: 3px 0; color: var(--muted); font-size: 9px; }.responses-list blockquote { margin: 7px 0 0; padding-left: 8px; border-left: 2px solid var(--rose-soft); color: #79696b; font-family: var(--font-display), serif; font-size: 10px; font-style: italic; }.responses-list time { color: #a49695; font-size: 8px; }
.preview-stage { display: flex; flex-direction: column; align-items: center; padding: 20px 30px 30px; overflow-y: auto; background: radial-gradient(circle at 50% 25%, #ffffff, #f2eeea 70%); }.preview-toolbar { width: min(400px, 100%); display: flex; justify-content: space-between; align-items: center; margin-bottom: 13px; color: #897a7c; font-size: 9px; }.preview-toolbar div { padding: 6px 9px; border: 1px solid #e1d7d3; border-radius: 20px; background: white; }.preview-toolbar i { display: inline-block; width: 5px; height: 5px; margin-right: 4px; border-radius: 50%; background: #5b9a6c; }.phone-frame { position: relative; flex: 0 0 auto; width: 310px; height: 670px; padding: 10px; border: 1px solid #cfc4bf; border-radius: 42px; background: #252023; box-shadow: 0 30px 70px #4a313b26; }.phone-notch { position: absolute; z-index: 5; top: 16px; left: 50%; width: 90px; height: 20px; border-radius: 20px; background: #252023; transform: translateX(-50%); }.phone-screen { height: 100%; overflow-y: auto; border-radius: 33px; background: var(--p-bg); color: var(--p-ink); scrollbar-width: none; }.phone-screen::-webkit-scrollbar { display: none; }.mini-hero { min-height: 430px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 50px 25px 30px; background: radial-gradient(circle at 20% 30%, var(--p-surface) 0 2px, transparent 3px), linear-gradient(145deg, var(--p-soft), var(--p-bg)); background-size: auto, cover; background-position: center; text-align: center; }.mini-hero.photo { color: white; }.mini-hero > span, .mini-hero i { color: var(--p-accent); font-style: normal; }.mini-hero small, .mini-intro small, .mini-venue small, .mini-timeline > small, .mini-rsvp small { margin: 17px 0 0; color: var(--p-accent); font-size: 6px; font-weight: 800; letter-spacing: .24em; }.mini-hero h1 { margin: 20px 0 14px; font-family: var(--font-display), serif; font-size: 36px; font-weight: 500; line-height: .95; }.mini-hero p { margin-top: 20px; font-size: 6px; font-weight: 700; letter-spacing: .14em; }.mini-intro { padding: 48px 28px; background: var(--p-surface); text-align: center; }.mini-intro h2, .mini-venue h2, .mini-timeline h2, .mini-rsvp h2 { margin: 13px 0; font-family: var(--font-display), serif; font-size: 23px; font-weight: 500; line-height: 1.05; }.mini-intro p { color: var(--p-muted); font-family: var(--font-display), serif; font-size: 11px; line-height: 1.55; }.mini-countdown { display: flex; justify-content: center; gap: 22px; padding: 23px; background: var(--p-dark); color: white; }.mini-countdown span { display: flex; flex-direction: column; align-items: center; color: #ffffffb0; font-size: 6px; text-transform: uppercase; }.mini-countdown strong { color: white; font-family: var(--font-display), serif; font-size: 20px; font-weight: 500; }.mini-venue, .mini-rsvp { padding: 46px 28px; text-align: center; }.mini-venue > span { color: var(--p-accent); font-size: 24px; }.mini-venue > p { color: var(--p-dark); font-family: var(--font-display), serif; font-size: 13px; }.mini-venue em { display: block; color: var(--p-muted); font-size: 8px; font-style: normal; }.mini-venue button, .mini-rsvp button { margin-top: 18px; padding: 10px 14px; border: 0; background: var(--p-dark); color: white; font-size: 7px; font-weight: 800; }.mini-timeline { padding: 45px 28px; background: var(--p-soft); text-align: center; }.mini-timeline > div { display: grid; grid-template-columns: 42px 8px 1fr; gap: 6px; align-items: start; margin-top: 14px; text-align: left; }.mini-timeline time { color: var(--p-dark); font-family: var(--font-display), serif; font-size: 11px; }.mini-timeline i { width: 6px; height: 6px; margin-top: 4px; border-radius: 50%; background: var(--p-accent); }.mini-timeline p { display: flex; flex-direction: column; margin: 0; }.mini-timeline strong { font-family: var(--font-display), serif; font-size: 11px; }.mini-timeline p span { color: var(--p-muted); font-size: 7px; }.mini-rsvp { background: var(--p-surface); }.phone-screen footer { padding: 35px 20px; background: var(--p-dark); color: white; text-align: center; }.phone-screen footer h2 { margin: 0; font-family: var(--font-display), serif; font-size: 22px; font-weight: 500; }.phone-screen footer p { color: #ffffffaa; font-size: 6px; letter-spacing: .12em; }.preview-link-row { width: min(400px, 100%); display: flex; justify-content: center; gap: 18px; margin-top: 15px; }.preview-link-row button, .preview-link-row a { padding: 0; border: 0; border-bottom: 1px solid; background: none; color: var(--wine); font-size: 9px; font-weight: 800; cursor: pointer; }
.studio-loading { min-height: 100vh; display: grid; place-items: center; align-content: center; gap: 10px; background: var(--cream); color: var(--wine); }.studio-loading span { font-size: 30px; animation: pulse 1.6s infinite; }.studio-loading p { font-family: var(--font-display), serif; }.studio-toast { position: fixed; z-index: 200; right: 24px; bottom: 24px; max-width: 380px; padding: 14px 19px; border-radius: 4px; background: #302529; color: white; font-size: 11px; box-shadow: 0 15px 50px #0004; }

/* Public invitation */
.invitation-page { min-height: 100vh; overflow: hidden; background: var(--invite-bg); color: var(--invite-ink); font-family: var(--font-body), sans-serif; }.invite-hero { position: relative; min-height: 100svh; display: grid; place-items: center; overflow: hidden; background: radial-gradient(circle at 20% 30%, var(--invite-surface) 0 3px, transparent 4px), radial-gradient(circle at 77% 70%, var(--invite-accent) 0 2px, transparent 3px), linear-gradient(145deg, var(--invite-soft), var(--invite-bg)); }.invite-hero-photo { position: absolute; inset: 0; background-size: cover; background-position: center; }.invite-hero-overlay { position: absolute; inset: 0; background: linear-gradient(to bottom, rgba(34,18,24,.12), rgba(34,18,24,.37)); opacity: 0; }.invite-hero.has-photo .invite-hero-overlay { opacity: 1; }.invite-hero.has-photo .invite-hero-copy { color: white; text-shadow: 0 2px 16px #0005; }.invite-hero.has-photo .invite-eyebrow, .invite-hero.has-photo .invite-date-line { color: white; }.invite-hero-copy { position: relative; z-index: 2; max-width: 900px; padding: 70px 25px; text-align: center; }.invite-for { display: table; margin: 0 auto 35px; padding: 9px 17px; border: 1px solid currentColor; border-radius: 30px; font-family: var(--font-display), serif; font-size: 14px; font-style: italic; }.invite-eyebrow, .invite-kicker { margin: 0; color: var(--invite-accent); font-size: 10px; font-weight: 800; letter-spacing: .3em; }.invite-hero h1 { margin: 28px 0 22px; font-family: var(--font-display), serif; font-size: clamp(72px, 11vw, 142px); font-weight: 500; line-height: .85; letter-spacing: -.045em; }.invite-flourish { display: flex; align-items: center; gap: 13px; width: 170px; margin: 0 auto; color: var(--invite-accent); }.invite-flourish::before, .invite-flourish::after { content: ""; flex: 1; height: 1px; background: currentColor; opacity: .55; }.invite-date-line { margin-top: 27px; color: var(--invite-dark); font-size: 10px; font-weight: 800; letter-spacing: .22em; }.invite-scroll { position: absolute; left: 50%; bottom: 24px; width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid currentColor; border-radius: 50%; font-size: 24px; transform: translateX(-50%); animation: bob 2s infinite; }.pearl { position: absolute; z-index: 1; border: 1px solid color-mix(in srgb, var(--invite-accent) 28%, transparent); border-radius: 50%; }.pearl-one { width: 420px; height: 750px; left: -300px; top: -130px; transform: rotate(24deg); }.pearl-two { width: 480px; height: 800px; right: -340px; bottom: -270px; transform: rotate(-28deg); }.music-orb { position: fixed; z-index: 20; right: 20px; bottom: 20px; width: 52px; height: 52px; border: 0; border-radius: 50%; background: var(--invite-dark); color: white; font-family: var(--font-display), serif; font-size: 20px; box-shadow: 0 12px 35px #0003; cursor: pointer; }.music-orb.playing { animation: musicPulse 1.8s infinite; }
.invite-section { max-width: 1000px; margin: 0 auto; padding: 110px 30px; text-align: center; }.invite-intro { max-width: 760px; }.tiny-star { color: var(--gold); font-size: 20px; }.invite-intro .invite-kicker { margin-top: 20px; }.invite-section > h2, .event-card h2, .rsvp-card > h2 { margin: 19px 0; font-family: var(--font-display), serif; font-size: clamp(43px, 6vw, 65px); font-weight: 500; line-height: 1.08; }.invite-intro > p:last-child { color: var(--invite-muted); font-family: var(--font-display), serif; font-size: 20px; line-height: 1.75; }
.countdown-band { padding: 47px 25px; background: var(--invite-dark); color: white; text-align: center; }.countdown-band > p { margin: 0 0 25px; color: #ffffffb0; font-family: var(--font-display), serif; font-size: 16px; font-style: italic; }.countdown-grid { display: flex; justify-content: center; gap: clamp(25px, 7vw, 85px); }.countdown-grid div { position: relative; display: flex; flex-direction: column; min-width: 66px; }.countdown-grid div:not(:last-child)::after { content: "✦"; position: absolute; right: clamp(-44px, -3.8vw, -18px); top: 16px; color: var(--invite-accent); font-size: 9px; }.countdown-grid strong { font-family: var(--font-display), serif; font-size: clamp(38px, 5vw, 58px); font-weight: 400; line-height: 1; }.countdown-grid span { margin-top: 8px; color: #ffffff99; font-size: 8px; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; }
.event-card-section { max-width: 850px; }.event-card { position: relative; padding: 70px 45px; border: 1px solid color-mix(in srgb, var(--invite-accent) 35%, transparent); background: var(--invite-surface); box-shadow: 0 25px 70px color-mix(in srgb, var(--invite-dark) 12%, transparent); }.event-card::before { content: ""; position: absolute; inset: 12px; border: 1px solid color-mix(in srgb, var(--invite-accent) 20%, transparent); pointer-events: none; }.event-icon { color: var(--invite-accent); font-size: 30px; }.event-card .invite-kicker { margin-top: 18px; }.event-time { color: var(--invite-dark); font-family: var(--font-display), serif; font-size: 22px; }.event-card > p:not(.invite-kicker, .event-time) { color: var(--invite-muted); line-height: 1.6; }.event-actions { display: flex; justify-content: center; gap: 12px; margin-top: 30px; }.invite-button { display: inline-flex; min-height: 48px; align-items: center; justify-content: center; padding: 0 24px; border: 1px solid var(--invite-dark); background: var(--invite-dark); color: white; font-size: 10px; font-weight: 800; letter-spacing: .09em; cursor: pointer; }.invite-button.outline { background: transparent; color: var(--invite-dark); }.invite-button.solid { width: 100%; }.invite-button:disabled { opacity: .6; cursor: wait; }
.timeline-section { max-width: 780px; }.invite-timeline { position: relative; max-width: 600px; margin: 50px auto 0; }.invite-timeline::before { content: ""; position: absolute; left: 114px; top: 10px; bottom: 20px; width: 1px; background: color-mix(in srgb, var(--invite-accent) 45%, transparent); }.invite-timeline article { position: relative; display: grid; grid-template-columns: 90px 28px 1fr; gap: 12px; min-height: 90px; text-align: left; }.invite-timeline time { color: var(--invite-dark); font-family: var(--font-display), serif; font-size: 20px; text-align: right; }.timeline-dot { position: relative; z-index: 1; width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; background: var(--invite-bg); color: var(--invite-accent); font-size: 9px; }.invite-timeline h3 { margin: 0 0 5px; font-family: var(--font-display), serif; font-size: 21px; font-weight: 600; }.invite-timeline p { margin: 0; color: var(--invite-muted); font-size: 12px; }
.invite-gallery { display: grid; grid-template-columns: repeat(3, 1fr); height: 550px; }.invite-gallery div { background-size: cover; background-position: center; }.invite-gallery div:nth-child(2) { transform: translateY(35px); }.detail-pair { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; max-width: 900px; }.detail-pair article { padding: 50px 35px; border: 1px solid color-mix(in srgb, var(--invite-accent) 30%, transparent); background: var(--invite-surface); }.detail-pair article > span { color: var(--invite-accent); font-size: 28px; }.detail-pair .invite-kicker { margin-top: 20px; }.detail-pair h3 { margin: 15px 0 10px; font-family: var(--font-display), serif; font-size: 27px; }.detail-pair article > p:last-child { color: var(--invite-muted); font-size: 12px; line-height: 1.6; }
.rsvp-section { padding: 100px 25px; background: var(--invite-soft); }.rsvp-card { max-width: 650px; margin: 0 auto; padding: 65px; border: 1px solid color-mix(in srgb, var(--invite-accent) 30%, transparent); background: var(--invite-surface); text-align: center; }.rsvp-card > p:not(.invite-kicker) { color: var(--invite-muted); font-family: var(--font-display), serif; line-height: 1.6; }.rsvp-form { display: grid; gap: 14px; margin-top: 30px; text-align: left; }.rsvp-form label { color: var(--invite-muted); font-size: 9px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }.rsvp-form input, .rsvp-form textarea { width: 100%; margin-top: 7px; padding: 12px; border: 1px solid color-mix(in srgb, var(--invite-accent) 35%, transparent); background: var(--invite-bg); color: var(--invite-ink); font-size: 12px; text-transform: none; outline: none; }.attendance-choice { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }.attendance-choice button { padding: 12px; border: 1px solid color-mix(in srgb, var(--invite-accent) 35%, transparent); background: transparent; color: var(--invite-muted); font-size: 10px; font-weight: 700; cursor: pointer; }.attendance-choice button.active { border-color: var(--invite-dark); background: var(--invite-dark); color: white; }.form-error { margin: 0; color: #a73349; font-size: 11px; }.rsvp-success { margin-top: 30px; padding: 30px; background: var(--invite-bg); }.rsvp-success > span { width: 45px; height: 45px; display: grid; place-items: center; margin: 0 auto; border-radius: 50%; background: var(--invite-dark); color: white; }.rsvp-success h3 { font-family: var(--font-display), serif; font-size: 27px; }.rsvp-success p { color: var(--invite-muted); line-height: 1.6; }
.invite-footer { display: flex; flex-direction: column; align-items: center; padding: 75px 25px 45px; background: var(--invite-dark); color: white; text-align: center; }.invite-footer > span { color: var(--invite-accent); }.invite-footer h2 { margin: 20px 0 8px; font-family: var(--font-display), serif; font-size: 45px; font-weight: 500; }.invite-footer > p { color: #ffffff99; font-size: 8px; font-weight: 800; letter-spacing: .18em; }.invite-footer button { margin: 20px 0 48px; padding: 11px 17px; border: 1px solid #ffffff88; background: transparent; color: white; font-size: 9px; font-weight: 800; cursor: pointer; }.invite-footer small { color: #ffffff65; font-size: 8px; letter-spacing: .08em; }

@keyframes pulse { 50% { opacity: .35; transform: scale(.85); } }
@keyframes bob { 50% { transform: translate(-50%, 7px); } }
@keyframes musicPulse { 50% { transform: scale(1.08); box-shadow: 0 12px 45px color-mix(in srgb, var(--invite-accent) 60%, transparent); } }

@media (max-width: 1050px) {
  .marketing-hero { grid-template-columns: .9fr 1.1fr; padding-inline: 38px; }.hero-copy h1 { font-size: 72px; }.style-showcase-grid { grid-template-columns: repeat(2, 1fr); max-width: 700px; }.features-section { grid-template-columns: 1fr; }.features-copy { max-width: 700px; }.marketing-footer { grid-template-columns: 1fr auto; }.marketing-footer > p { display: none; }
  .project-grid { grid-template-columns: repeat(2, 1fr); }.studio-workspace { grid-template-columns: 92px minmax(390px, 480px) 1fr; }.preview-stage { padding-inline: 15px; }.phone-frame { width: 280px; height: 610px; }
}

@media (max-width: 800px) {
  .marketing-nav { height: 72px; padding: 0 20px; }.marketing-nav nav { display: none; }.nav-cta { padding: 10px 12px; }.marketing-hero { grid-template-columns: 1fr; padding: 70px 24px 30px; text-align: center; }.hero-copy { margin: 0 auto; }.hero-copy h1 { font-size: clamp(56px, 17vw, 76px); }.hero-copy > p:not(.overline) { margin-inline: auto; }.hero-actions, .trust-line { justify-content: center; }.hero-showcase { height: 600px; margin-top: 20px; }.showcase-phone { width: 240px; height: 490px; }.card-back { left: -7%; }.card-front { right: -7%; }.love-strip { font-size: 12px; }.styles-section, .steps-section { padding: 85px 20px; }.features-section { padding: 85px 24px; }.features-grid { grid-template-columns: 1fr 1fr; }.steps-grid { grid-template-columns: 1fr; }.steps-grid article { padding: 30px 40px; }.steps-grid article:not(:last-child)::after { left: 50%; right: auto; top: auto; bottom: 0; width: 80px; height: 1px; transform: translateX(-50%); }.marketing-footer { grid-template-columns: 1fr; justify-items: center; text-align: center; }.marketing-footer nav { justify-content: center; }
  .dashboard-topbar { padding: 0 20px; }.dashboard-content { padding: 45px 20px 80px; }.dashboard-welcome { align-items: flex-start; flex-direction: column; }.metric-row { grid-template-columns: 1fr; margin: 35px 0 55px; }.project-grid { grid-template-columns: 1fr 1fr; gap: 14px; }.project-cover { height: 260px; }.template-modal { padding: 35px 20px; }.template-grid { grid-template-columns: 1fr; }
  .studio-topbar { grid-template-columns: auto 1fr; padding: 0 14px; }.studio-topbar > .studio-brand div, .topbar-title span, .topbar-title button, .save-state { display: none; }.topbar-actions { justify-content: flex-end; }.ghost-button { display: none; }.studio-workspace { height: auto; min-height: calc(100vh - 72px); grid-template-columns: 1fr; padding-bottom: 68px; }.studio-rail { position: fixed; z-index: 30; left: 0; right: 0; bottom: 0; height: 68px; flex-direction: row; justify-content: space-around; padding: 5px; overflow-x: auto; border: 0; border-top: 1px solid #dfd5d1; }.studio-rail button { min-width: 59px; padding: 5px 3px; }.studio-rail button > span { font-size: 15px; }.editor-panel { min-height: 700px; padding: 28px 20px 80px; border-right: 0; }.preview-stage { display: none; }.template-grid > button { grid-template-columns: 125px 1fr; }.create-basics { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
  .hero-actions { flex-direction: column; gap: 20px; }.hero-showcase { height: 540px; transform: scale(.86); transform-origin: top center; margin-bottom: -70px; }.showcase-card { width: 210px; }.card-back { left: -22%; }.card-front { right: -22%; }.style-showcase-grid { grid-template-columns: 1fr; }.style-art { height: 450px; }.features-grid { grid-template-columns: 1fr; }.features-grid article { min-height: auto; }.marketing-section-title h2, .features-copy h2, .final-cta h2 { font-size: 40px; }.love-strip span { display: none; }
  .project-grid { grid-template-columns: 1fr; }.dashboard-welcome h1 { font-size: 43px; }.section-heading { align-items: flex-start; }.project-cover { height: 310px; }.template-grid > button { grid-template-columns: 105px 1fr; }.template-art { height: 145px; }.template-modal > h2 { font-size: 32px; }.field-row, .color-grid { grid-template-columns: 1fr; }
  .invite-hero h1 { font-size: clamp(62px, 20vw, 95px); }.invite-section { padding: 80px 20px; }.invite-intro > p:last-child { font-size: 17px; }.countdown-grid { gap: 15px; }.countdown-grid div { min-width: 55px; }.countdown-grid div:not(:last-child)::after { display: none; }.event-card { padding: 55px 23px; }.event-actions { flex-direction: column; }.invite-timeline::before { left: 84px; }.invite-timeline article { grid-template-columns: 62px 22px 1fr; }.invite-timeline time { font-size: 16px; }.invite-gallery { grid-template-columns: 1fr 1fr; height: 600px; }.invite-gallery div:nth-child(2) { transform: none; }.detail-pair { grid-template-columns: 1fr; }.rsvp-card { padding: 45px 20px; }.attendance-choice { grid-template-columns: 1fr; }.invite-footer h2 { font-size: 36px; }
}

@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; } }

/* Instalación e inicio de sesión para servidor propio */
.auth-page { min-height: 100vh; display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(430px, .85fr); gap: clamp(35px, 7vw, 110px); align-items: center; padding: clamp(28px, 6vw, 90px); overflow: hidden; background: radial-gradient(circle at 10% 18%, #efd9d9 0 3px, transparent 4px), radial-gradient(circle at 83% 76%, #d7b671 0 2px, transparent 3px), linear-gradient(145deg, #fbf4ef, #f7e7e7); }
.auth-story { position: relative; max-width: 760px; }.auth-story::before, .auth-story::after { content: ""; position: absolute; z-index: 0; width: 260px; height: 530px; border: 1px solid #b98a9330; border-radius: 50%; pointer-events: none; }.auth-story::before { left: -210px; top: -170px; transform: rotate(28deg); }.auth-story::after { right: -60px; bottom: -260px; transform: rotate(-22deg); }.auth-story > * { position: relative; z-index: 1; }
.auth-brand { display: inline-flex; align-items: center; gap: 11px; margin-bottom: clamp(45px, 8vh, 90px); }.auth-brand > span { width: 44px; height: 44px; display: grid; place-items: center; border: 1px solid var(--rose); border-radius: 50%; color: var(--wine); font-family: var(--font-display), serif; font-size: 14px; font-weight: 700; }.auth-brand div { display: flex; flex-direction: column; line-height: 1; }.auth-brand strong { font-family: var(--font-display), serif; font-size: 23px; }.auth-brand small { margin-top: 5px; color: var(--rose); font-size: 8px; font-weight: 800; letter-spacing: .28em; }
.auth-story h1 { margin: 17px 0 25px; font-family: var(--font-display), serif; font-size: clamp(52px, 6vw, 88px); font-weight: 500; line-height: .96; letter-spacing: -.04em; }.auth-story h1 em { color: var(--rose); font-weight: 400; }.auth-story > p:not(.overline) { max-width: 650px; color: var(--muted); font-family: var(--font-display), serif; font-size: 19px; line-height: 1.65; }
.auth-benefits { display: grid; gap: 10px; margin-top: 30px; color: #79696b; font-size: 12px; }.auth-benefits span { padding: 10px 14px; border-left: 1px solid var(--rose); background: #fff9; }
.auth-card { position: relative; width: min(500px, 100%); justify-self: end; padding: clamp(28px, 4vw, 48px); border: 1px solid #dfcfca; background: #fffdfaee; box-shadow: 0 30px 90px #53333d1c; backdrop-filter: blur(16px); }.auth-card::before { content: ""; position: absolute; inset: 10px; border: 1px solid #bd89952e; pointer-events: none; }.auth-card > * { position: relative; z-index: 1; }.auth-step { display: inline-flex; padding: 7px 10px; background: #f4e2e2; color: var(--wine); font-size: 8px; font-weight: 900; letter-spacing: .14em; }.auth-card h2 { margin: 22px 0 7px; font-family: var(--font-display), serif; font-size: 38px; font-weight: 500; }.auth-card > p { margin: 0 0 25px; color: var(--muted); font-size: 12px; line-height: 1.55; }.auth-card label { display: grid; gap: 7px; margin: 15px 0; color: #58494d; font-size: 10px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }.auth-card input { width: 100%; min-height: 48px; padding: 11px 13px; border: 1px solid #d9ceca; background: #fff; color: var(--ink); font: inherit; font-size: 14px; text-transform: none; outline: none; }.auth-card input:focus { border-color: var(--rose); box-shadow: 0 0 0 3px #bd89951f; }.auth-card small { color: var(--muted); font-size: 9px; font-weight: 500; letter-spacing: 0; line-height: 1.5; text-transform: none; }.auth-submit { width: 100%; margin-top: 10px; border: 0; }.auth-submit:disabled { opacity: .65; cursor: wait; }.auth-error { margin: 15px 0; padding: 12px 14px; border: 1px solid #e4b8c1; background: #fff0f2; color: #963349; font-size: 11px; line-height: 1.5; }.auth-home-link { display: table; margin: 22px auto 0; border-bottom: 1px solid; color: var(--wine); font-size: 10px; font-weight: 800; }
.account-area { display: flex; align-items: center; gap: 16px; }.account-area > a { padding: 8px 10px; border-left: 1px solid var(--line); color: var(--muted); font-size: 9px; font-weight: 800; text-transform: uppercase; }
@media (max-width: 850px) { .auth-page { grid-template-columns: 1fr; padding: 24px; }.auth-story { display: none; }.auth-card { justify-self: center; }.account-area > a { display: none; } }

/* Galería adaptable, mapa, WhatsApp y capas decorativas */
.detail-anchor { height: 0; scroll-margin-top: 20px; }
.decoration-zone { position: relative; }
.invite-decoration { position: absolute; z-index: 4; left: var(--dec-x); top: var(--dec-y); width: min(var(--dec-width), 55vw); height: auto; max-height: 70%; object-fit: contain; opacity: var(--dec-opacity); pointer-events: none; user-select: none; transform: translate(-50%, -50%) rotate(var(--dec-rotation)); transform-origin: center; filter: drop-shadow(0 12px 20px #2b182326); }
.invite-hero .invite-decoration { max-height: 72vh; }
.invite-gallery-section { position: relative; max-width: 1280px; margin: 0 auto; padding: 110px 30px; }
.gallery-heading { max-width: 760px; margin: 0 auto 45px; text-align: center; }
.gallery-heading h2, .map-copy h2 { margin: 18px 0 12px; font-family: var(--font-display), serif; font-size: clamp(40px, 5vw, 60px); font-weight: 500; line-height: 1.08; }
.invite-gallery { width: min(1180px, 100%); display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); grid-auto-flow: dense; grid-auto-rows: 90px; gap: 14px; height: auto; margin: 0 auto; }
.invite-gallery .gallery-item { min-width: 0; min-height: 0; grid-column: span 4; grid-row: span 3; margin: 0; overflow: hidden; border-radius: 4px; background: var(--invite-soft); box-shadow: 0 13px 34px color-mix(in srgb, var(--invite-dark) 12%, transparent); transform: none; }
.invite-gallery .gallery-item:nth-child(8n + 1) { grid-column: span 7; grid-row: span 4; }
.invite-gallery .gallery-item:nth-child(8n + 2), .invite-gallery .gallery-item:nth-child(8n + 3) { grid-column: span 5; grid-row: span 2; }
.invite-gallery .gallery-item:nth-child(8n + 7), .invite-gallery .gallery-item:nth-child(8n + 8) { grid-column: span 6; grid-row: span 3; }
.invite-gallery .gallery-item:only-child { grid-column: 3 / span 8; grid-row: span 5; }
.invite-gallery:has(.gallery-item:nth-child(2):last-child) .gallery-item { grid-column: span 6; grid-row: span 5; }
.invite-gallery img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; transition: transform .5s ease; }
.invite-gallery .gallery-item:hover img { transform: scale(1.025); }
.map-section { width: min(1180px, calc(100% - 60px)); min-height: 440px; display: grid; grid-template-columns: minmax(300px, .75fr) minmax(0, 1.25fr); margin: 0 auto 40px; border: 1px solid color-mix(in srgb, var(--invite-accent) 28%, transparent); background: var(--invite-surface); box-shadow: 0 22px 65px color-mix(in srgb, var(--invite-dark) 10%, transparent); }
.map-copy { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: 55px; text-align: left; }
.map-copy > p:not(.invite-kicker) { color: var(--invite-muted); font-family: var(--font-display), serif; font-size: 17px; line-height: 1.6; }
.map-copy > a { margin-top: 15px; padding-bottom: 4px; border-bottom: 1px solid; color: var(--invite-dark); font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.map-frame { min-height: 440px; overflow: hidden; background: var(--invite-soft); }
.map-frame iframe { width: 100%; height: 100%; min-height: 440px; display: block; border: 0; }
.whatsapp-orb { position: fixed; z-index: 30; right: 20px; bottom: 20px; min-height: 54px; display: inline-flex; align-items: center; gap: 9px; padding: 6px 16px 6px 7px; border-radius: 999px; background: #1f9d55; color: white; box-shadow: 0 13px 38px #123d2550; font-size: 10px; font-weight: 900; letter-spacing: .05em; text-transform: uppercase; }
.whatsapp-orb span { width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid #ffffff70; border-radius: 50%; font-size: 19px; }
.music-orb.with-whatsapp { bottom: 86px; }
.whatsapp-confirm-button { width: 100%; min-height: 48px; display: inline-flex; align-items: center; justify-content: center; margin-top: 18px; padding: 11px 18px; background: #1f9d55; color: white; font-size: 10px; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; }

/* Controles del estudio */
.studio-rail { overflow-y: auto; }
.studio-rail button { flex: 0 0 auto; }
.field-help { margin: -4px 0 14px; color: var(--muted); font-size: 9px; line-height: 1.55; }
.section-switches { display: grid; gap: 9px; }
.section-switch { min-height: 66px; display: grid; grid-template-columns: 36px 1fr auto; gap: 12px; align-items: center; padding: 12px 14px; border: 1px solid #e5dcd8; background: #fffdfb; cursor: pointer; }
.section-switch input { width: 34px; height: 20px; appearance: none; border-radius: 20px; background: #d8ceca; cursor: pointer; transition: background .2s; }
.section-switch input::after { content: ""; width: 14px; height: 14px; display: block; margin: 3px; border-radius: 50%; background: white; box-shadow: 0 1px 4px #0003; transition: transform .2s; }
.section-switch input:checked { background: var(--wine); }
.section-switch input:checked::after { transform: translateX(14px); }
.section-switch > span { display: flex; flex-direction: column; }
.section-switch strong { font-family: var(--font-display), serif; font-size: 14px; }
.section-switch small { margin-top: 4px; color: var(--muted); font-size: 8px; }
.section-switch i { color: var(--rose); font-size: 8px; font-style: normal; font-weight: 900; text-transform: uppercase; }
.element-upload { min-height: 100px; display: flex; align-items: center; gap: 15px; padding: 18px; border: 1px dashed #cab6b2; background: #fbf6f2; cursor: pointer; }
.element-upload > span { width: 46px; height: 46px; display: grid; flex: 0 0 46px; place-items: center; border-radius: 50%; background: var(--wine); color: white; font-size: 24px; }
.element-upload > div { display: flex; flex-direction: column; }
.element-upload strong { font-family: var(--font-display), serif; font-size: 15px; }
.element-upload small { margin-top: 5px; color: var(--muted); font-size: 8px; line-height: 1.5; }
.element-upload input { display: none; }
.decoration-editor { display: grid; gap: 14px; }
.decoration-card { display: grid; grid-template-columns: 120px 1fr; gap: 15px; padding: 14px; border: 1px solid #e5dcd8; background: #fffdfb; }
.decoration-thumb { position: relative; min-height: 150px; display: grid; place-items: center; overflow: hidden; background: linear-gradient(45deg,#eee 25%,transparent 25%) 0 0/18px 18px,linear-gradient(45deg,transparent 75%,#eee 75%) 0 0/18px 18px,linear-gradient(45deg,transparent 75%,#eee 75%) 9px -9px/18px 18px,linear-gradient(45deg,#eee 25%,#fff 25%) 9px 9px/18px 18px; }
.decoration-thumb img { width: 100%; height: 150px; object-fit: contain; }
.decoration-thumb span { position: absolute; left: 7px; top: 7px; width: 22px; height: 22px; display: grid; place-items: center; border-radius: 50%; background: var(--wine); color: white; font-size: 8px; }
.decoration-main { min-width: 0; }
.studio-field select { width: 100%; height: 42px; padding: 0 11px; border: 1px solid #e3d9d5; background: #fffdfb; color: var(--ink); font-size: 11px; outline: none; }
.decoration-ranges { display: grid; grid-template-columns: 1fr 1fr; gap: 9px 12px; }
.decoration-ranges label > span { display: flex; justify-content: space-between; color: var(--muted); font-size: 8px; font-weight: 800; text-transform: uppercase; }
.decoration-ranges output { color: var(--wine); font-size: 8px; }
.decoration-ranges input { width: 100%; accent-color: var(--wine); }
.gallery-editor { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.gallery-editor > div, .gallery-editor > label { aspect-ratio: 4 / 3; border-radius: 3px; }
.gallery-editor button { z-index: 2; box-shadow: 0 2px 8px #0003; }
.mini-zone { position: relative; overflow: hidden; }
.mini-zone > :not(.mini-decoration) { position: relative; z-index: 2; }
.mini-decoration { position: absolute; z-index: 3; height: auto; max-height: 72%; object-fit: contain; pointer-events: none; filter: drop-shadow(0 5px 8px #21101924); }
.mini-map { display: grid; place-items: center; gap: 8px; padding: 42px 25px; background: linear-gradient(135deg,var(--p-soft),var(--p-surface)); text-align: center; }
.mini-map > small, .mini-details > small { color: var(--p-accent); font-size: 6px; font-weight: 900; letter-spacing: .2em; }
.mini-map > div { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 50%; background: var(--p-dark); color: white; font-size: 19px; }
.mini-map > strong { font-family: var(--font-display), serif; font-size: 17px; }
.mini-map > span { max-width: 210px; color: var(--p-muted); font-size: 7px; }
.mini-gallery { display: grid; grid-template-columns: 1.4fr 1fr; grid-auto-rows: 90px; gap: 4px; padding: 4px; background: var(--p-bg); }
.mini-gallery > img { width: 100%; height: 100%; object-fit: cover; }
.mini-gallery > img:first-child { grid-row: span 2; }
.mini-details { display: flex; flex-direction: column; align-items: center; gap: 9px; padding: 40px 25px; background: var(--p-bg); text-align: center; }
.mini-details strong { color: var(--p-ink); font-family: var(--font-display), serif; font-size: 12px; }
.mini-details > span { color: var(--p-accent); font-size: 8px; font-weight: 800; }
.mini-whatsapp { position: sticky; z-index: 8; left: calc(100% - 52px); bottom: 12px; width: 40px; height: 40px; display: grid; place-items: center; margin: -52px 12px 12px auto; border-radius: 50%; background: #1f9d55; color: white; box-shadow: 0 5px 15px #0003; }

@media (max-width: 760px) {
  .invite-gallery-section { padding: 80px 18px; }
  .invite-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 175px; gap: 8px; }
  .invite-gallery .gallery-item, .invite-gallery .gallery-item:nth-child(n), .invite-gallery:has(.gallery-item:nth-child(2):last-child) .gallery-item { grid-column: span 1; grid-row: span 1; }
  .invite-gallery .gallery-item:first-child { grid-column: 1 / -1; grid-row: span 2; }
  .invite-gallery .gallery-item:only-child { grid-column: 1 / -1; grid-row: span 2; }
  .map-section { width: calc(100% - 36px); grid-template-columns: 1fr; }
  .map-copy { align-items: center; padding: 45px 24px; text-align: center; }
  .map-frame, .map-frame iframe { min-height: 340px; }
  .invite-decoration { width: min(var(--dec-width), 48vw); }
  .decoration-card { grid-template-columns: 95px 1fr; }
  .decoration-thumb, .decoration-thumb img { min-height: 120px; height: 120px; }
}

@media (max-width: 480px) {
  .invite-gallery { grid-template-columns: 1fr; grid-auto-rows: 270px; }
  .invite-gallery .gallery-item, .invite-gallery .gallery-item:nth-child(n), .invite-gallery .gallery-item:first-child, .invite-gallery .gallery-item:only-child, .invite-gallery:has(.gallery-item:nth-child(2):last-child) .gallery-item { grid-column: 1; grid-row: span 1; }
  .whatsapp-orb { width: 54px; min-width: 54px; padding: 7px; }
  .whatsapp-orb span { width: 40px; }
  .whatsapp-orb strong { display: none; }
  .decoration-card { grid-template-columns: 1fr; }
  .decoration-thumb, .decoration-thumb img { min-height: 180px; height: 180px; }
  .decoration-ranges { grid-template-columns: 1fr; }
}

/* Constructor infantil avanzado */
.kid-mode { padding: clamp(18px, 4vw, 52px); background-color: var(--kid-bg); }
.kid-pattern-solid { background-image: none; }
.kid-pattern-diamonds { background-image: linear-gradient(45deg, transparent 46%, color-mix(in srgb, var(--kid-pattern) 72%, transparent) 47% 49%, transparent 50%), linear-gradient(-45deg, transparent 46%, color-mix(in srgb, var(--kid-pattern) 72%, transparent) 47% 49%, transparent 50%), radial-gradient(circle, var(--kid-pattern) 0 2px, transparent 3px); background-size: var(--kid-scale) var(--kid-scale); background-position: 0 0; }
.kid-pattern-dots { background-image: radial-gradient(circle, color-mix(in srgb, var(--kid-pattern) 85%, transparent) 0 4px, transparent 5px); background-size: var(--kid-scale) var(--kid-scale); }
.kid-pattern-stripes { background-image: repeating-linear-gradient(135deg, transparent 0 var(--kid-scale), color-mix(in srgb, var(--kid-pattern) 55%, transparent) var(--kid-scale) calc(var(--kid-scale) + 7px)); }
.kid-pattern-confetti { background-image: radial-gradient(circle at 12% 18%, var(--kid-pattern) 0 3px, transparent 4px), radial-gradient(circle at 72% 35%, color-mix(in srgb, var(--kid-pattern) 75%, transparent) 0 4px, transparent 5px), linear-gradient(32deg, transparent 48%, color-mix(in srgb, var(--kid-pattern) 65%, transparent) 49% 52%, transparent 53%); background-size: var(--kid-scale) var(--kid-scale); }
.kid-mode.kid-has-background { background-image: linear-gradient(#ffffff12,#ffffff12), var(--kid-bg-image); background-size: cover; background-position: center; background-attachment: fixed; }
.kid-mode .invite-canvas { position: relative; width: min(980px, 100%); margin: 0 auto; overflow: hidden; background: var(--kid-frame); box-shadow: 0 30px 90px #6b295c38; }
.kid-frame-square .invite-canvas { border-radius: 0; }
.kid-frame-rounded .invite-canvas { border-radius: clamp(28px, 6vw, 76px); }
.kid-frame-wavy .invite-canvas { border-radius: 8% 12% 7% 11% / 2% 3% 2.5% 3.5%; }
.kid-frame-wavy .invite-canvas::before { content: ""; position: absolute; z-index: 10; inset: 13px; border: 2px dashed color-mix(in srgb, var(--invite-accent) 30%, transparent); border-radius: inherit; pointer-events: none; }
.kid-mode .invite-hero { min-height: min(900px, 92svh); }
.kid-mode .invite-hero h1 { font-size: clamp(58px, 12vw, var(--kid-title-size)); line-height: .86; }
.kid-mode .invite-section { max-width: 820px; }
.kid-mode .map-section { width: calc(100% - 70px); }
.kid-mode .invite-gallery-section { padding-inline: 35px; }
.kid-font-playfair .invite-canvas h1, .kid-font-playfair .invite-canvas h2, .kid-font-playfair .invite-canvas h3 { font-family: "Playfair Display", serif; }
.kid-font-rounded .invite-canvas h1, .kid-font-rounded .invite-canvas h2, .kid-font-rounded .invite-canvas h3 { font-family: "Fredoka", sans-serif; font-weight: 600; }
.kid-font-chunky .invite-canvas h1, .kid-font-chunky .invite-canvas h2, .kid-font-chunky .invite-canvas h3 { font-family: "Baloo 2", sans-serif; font-weight: 800; letter-spacing: -.03em; }
.kid-font-handwritten .invite-canvas h1, .kid-font-handwritten .invite-canvas h2, .kid-font-handwritten .invite-canvas h3 { font-family: "Chewy", cursive; letter-spacing: .01em; }
.kid-uppercase .invite-hero h1 { text-transform: uppercase; }
.kid-title-gold .invite-hero h1, .kid-title-gold .age-spotlight strong { color: #c99418; background: linear-gradient(105deg,#7d5100 8%,#ffd95d 28%,#9b6500 48%,#fff2a8 62%,#b07800 83%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; filter: drop-shadow(0 3px 0 #75440030); }
.kid-title-gradient .invite-hero h1, .kid-title-gradient .age-spotlight strong { color: var(--invite-dark); background: linear-gradient(135deg,var(--invite-dark),var(--invite-accent) 48%,#f3b92c); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.kid-title-shadow .invite-hero h1 { color: var(--invite-accent); text-shadow: 3px 3px 0 white, 6px 6px 0 color-mix(in srgb,var(--invite-dark) 55%,transparent), 0 12px 25px #0002; }
.age-spotlight { position: relative; min-height: 680px; display: grid; place-items: center; padding: 90px 25px; overflow: hidden; background: linear-gradient(180deg,var(--invite-surface),var(--invite-bg)); text-align: center; }
.age-spotlight-copy { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: center; }
.age-spotlight-copy > p { margin: 0 0 -20px; color: var(--invite-dark); font-size: clamp(24px, 4vw, 42px); font-weight: 900; letter-spacing: .08em; }
.age-spotlight-copy > strong { font-family: "Baloo 2", var(--font-display), sans-serif; font-size: clamp(210px, 42vw, 390px); font-weight: 800; line-height: .82; color: var(--invite-accent); text-shadow: 0 12px 35px color-mix(in srgb,var(--invite-dark) 20%,transparent); }
.age-spotlight-copy h2 { margin: -10px 0 0; color: var(--invite-dark); font-family: var(--font-display), serif; font-size: clamp(45px, 8vw, 80px); line-height: 1; }
.kid-sticker { position: absolute; z-index: 1; color: #f5b521; font-size: clamp(16px, 3vw, 34px); animation: stickerFloat 4s ease-in-out infinite; }
.kid-sticker:nth-of-type(3n) { color: var(--invite-accent); }.kid-sticker:nth-of-type(4n) { color: var(--invite-dark); }
.sticker-1 { left: 12%; top: 14%; }.sticker-2 { right: 14%; top: 18%; }.sticker-3 { left: 20%; top: 42%; }.sticker-4 { right: 20%; top: 48%; }.sticker-5 { left: 10%; bottom: 18%; }.sticker-6 { right: 12%; bottom: 14%; }.sticker-7 { left: 34%; top: 12%; }.sticker-8 { right: 35%; bottom: 9%; }.sticker-9 { left: 7%; top: 62%; }.sticker-10 { right: 7%; top: 65%; }.sticker-11 { left: 28%; bottom: 18%; }.sticker-12 { right: 29%; top: 34%; }
.custom-invite-block { position: relative; width: min(780px, calc(100% - 60px)); margin: 55px auto; padding: clamp(38px, 7vw, 75px); overflow: hidden; background: var(--block-bg); color: var(--block-color); text-align: center; }
.custom-invite-block.align-left { text-align: left; }
.custom-invite-block--plain { background: transparent; }
.custom-invite-block--card { border: 2px solid color-mix(in srgb,var(--block-color) 18%,transparent); border-radius: 28px; box-shadow: 0 18px 50px color-mix(in srgb,var(--block-color) 10%,transparent); }
.custom-invite-block--highlight h2 { font-size: clamp(70px, 14vw, 150px); line-height: .85; }
.custom-invite-block--ribbon { width: 100%; max-width: none; border-radius: 0; transform: rotate(-1deg); }
.custom-invite-block--ribbon > * { transform: rotate(1deg); }
.custom-block-icon { display: block; margin-bottom: 18px; font-size: 38px; }
.custom-invite-block .invite-kicker { color: inherit; opacity: .72; }
.custom-invite-block h2 { margin: 14px 0; color: inherit; font-family: var(--font-display), serif; font-size: clamp(38px, 7vw, 68px); font-weight: 700; }
.custom-block-text { margin: 15px auto 0; color: inherit; font-family: var(--font-display), serif; font-size: 18px; line-height: 1.65; opacity: .82; }
@keyframes stickerFloat { 50% { transform: translateY(-9px) rotate(8deg); } }

/* Nuevas herramientas del estudio */
.kid-tools { margin-top: 34px; padding-top: 30px; border-top: 3px double #e8dcd7; }
.feature-toggle { min-height: 70px; display: grid; grid-template-columns: 38px 1fr auto; gap: 12px; align-items: center; padding: 14px; border: 1px solid #e5dcd8; background: #fffaf7; cursor: pointer; }
.feature-toggle.compact { min-height: 60px; margin-top: 14px; }
.feature-toggle input { width: 36px; height: 21px; appearance: none; border-radius: 20px; background: #d6cbc8; cursor: pointer; }
.feature-toggle input::after { content: ""; width: 15px; height: 15px; display: block; margin: 3px; border-radius: 50%; background: white; box-shadow: 0 1px 4px #0003; transition: transform .2s; }
.feature-toggle input:checked { background: var(--wine); }.feature-toggle input:checked::after { transform: translateX(15px); }
.feature-toggle > span { display: flex; flex-direction: column; }.feature-toggle strong { font-family: var(--font-display), serif; font-size: 14px; }.feature-toggle small { margin-top: 4px; color: var(--muted); font-size: 8px; }.feature-toggle i { color: var(--rose); font-size: 8px; font-style: normal; font-weight: 900; text-transform: uppercase; }
.kid-color-grid, .block-colors { display: grid; grid-template-columns: repeat(3,1fr); gap: 9px; margin: 13px 0; }
.kid-color-grid label, .block-colors label { display: grid; gap: 6px; color: var(--muted); font-size: 8px; font-weight: 800; text-transform: uppercase; }
.kid-color-grid input, .block-colors input { width: 100%; height: 40px; padding: 3px; border: 1px solid #e3d9d5; background: white; }
.range-control { display: grid; gap: 8px; margin: 16px 0; }.range-control > span { display: flex; justify-content: space-between; color: var(--muted); font-size: 9px; font-weight: 800; text-transform: uppercase; }.range-control output { color: var(--wine); }.range-control input { width: 100%; accent-color: var(--wine); }
.age-tools { margin-top: 30px; padding-top: 28px; border-top: 3px double #e8dcd7; }
.kid-background-tools .element-upload { min-height: 115px; }.kid-background-thumb { width: 95px; height: 82px; flex: 0 0 95px; border-radius: 8px; object-fit: cover; }
.block-editor { display: grid; gap: 16px; margin-top: 18px; }
.block-card { padding: 16px; border: 1px solid #e2d7d2; background: #fffdfb; box-shadow: 0 10px 28px #5e36430a; }
.block-card > header { display: grid; grid-template-columns: 28px 1fr auto; gap: 10px; align-items: center; margin: -16px -16px 17px; padding: 11px 13px; background: #f7eeea; }
.block-card > header > span { width: 26px; height: 26px; display: grid; place-items: center; border-radius: 50%; background: var(--wine); color: white; font-size: 8px; }.block-card > header strong { overflow: hidden; font-family: var(--font-display), serif; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }.block-card > header div { display: flex; gap: 4px; }.block-card > header button { width: 27px; height: 27px; border: 1px solid #ddcfca; background: white; cursor: pointer; }
.block-colors { grid-template-columns: 1fr 1fr; }
.add-row-button:disabled { opacity: .45; cursor: not-allowed; }

/* Vista previa infantil */
.phone-screen.kid-preview { padding: 10px; background-color: var(--mini-kid-bg); }
.kid-preview.mini-pattern-diamonds { background-image: linear-gradient(45deg,transparent 46%,color-mix(in srgb,var(--mini-pattern) 65%,transparent) 47% 49%,transparent 50%),linear-gradient(-45deg,transparent 46%,color-mix(in srgb,var(--mini-pattern) 65%,transparent) 47% 49%,transparent 50%); background-size: var(--mini-scale) var(--mini-scale); }
.kid-preview.mini-pattern-dots { background-image: radial-gradient(circle,var(--mini-pattern) 0 2px,transparent 3px); background-size: var(--mini-scale) var(--mini-scale); }
.kid-preview.mini-pattern-stripes { background-image: repeating-linear-gradient(135deg,transparent 0 var(--mini-scale),color-mix(in srgb,var(--mini-pattern) 55%,transparent) var(--mini-scale) calc(var(--mini-scale) + 4px)); }
.kid-preview.mini-pattern-confetti { background-image: radial-gradient(circle at 20% 20%,var(--mini-pattern) 0 2px,transparent 3px),radial-gradient(circle at 75% 60%,var(--mini-pattern) 0 2px,transparent 3px); background-size: var(--mini-scale) var(--mini-scale); }
.mini-canvas { overflow: hidden; background: var(--p-bg); }
.kid-preview .mini-canvas { background: var(--mini-frame); box-shadow: 0 8px 20px #51274433; }
.kid-preview.mini-frame-rounded .mini-canvas { border-radius: 25px; }.kid-preview.mini-frame-wavy .mini-canvas { border-radius: 10% 13% 8% 12% / 1.5% 2% 1.8% 2.4%; }
.mini-font-rounded .mini-canvas h1, .mini-font-rounded .mini-canvas h2, .mini-font-rounded .mini-canvas h3 { font-family: "Fredoka",sans-serif; }.mini-font-chunky .mini-canvas h1, .mini-font-chunky .mini-canvas h2, .mini-font-chunky .mini-canvas h3 { font-family: "Baloo 2",sans-serif; font-weight: 800; }.mini-font-handwritten .mini-canvas h1, .mini-font-handwritten .mini-canvas h2, .mini-font-handwritten .mini-canvas h3 { font-family: "Chewy",cursive; }
.kid-preview .mini-hero h1 { font-size: var(--mini-title-size); }.mini-uppercase .mini-hero h1 { text-transform: uppercase; }
.mini-title-gold .mini-hero h1, .mini-title-gold .mini-age > strong { background: linear-gradient(105deg,#815100,#ffe468,#9c6500); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; }.mini-title-gradient .mini-hero h1, .mini-title-gradient .mini-age > strong { background: linear-gradient(135deg,var(--p-dark),var(--p-accent),#f4b927); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; }.mini-title-shadow .mini-hero h1 { color: var(--p-accent); text-shadow: 2px 2px white,4px 4px var(--p-dark); }
.mini-age { min-height: 330px; display: grid; place-items: center; align-content: center; overflow: hidden; background: var(--p-surface); text-align: center; }.mini-age > small { color: var(--p-dark); font-size: 10px; font-weight: 900; }.mini-age > strong { color: var(--p-accent); font-family: "Baloo 2",sans-serif; font-size: 150px; font-weight: 800; line-height: .8; }.mini-age h2 { margin: 5px 0; font-size: 30px; }.mini-sticker { position: absolute; z-index: 1; color: #f1b522; font-style: normal; }.mini-sticker-1 { left: 12%;top:15% }.mini-sticker-2 { right:12%;top:20% }.mini-sticker-3 { left:18%;top:55% }.mini-sticker-4 { right:18%;top:60% }.mini-sticker-5 { left:32%;top:10% }.mini-sticker-6 { right:30%;bottom:10% }.mini-sticker-7 { left:8%;bottom:15% }.mini-sticker-8 { right:8%;bottom:18% }
.mini-custom { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 30px 20px; background: var(--mini-block-bg); color: var(--mini-block-color); text-align: center; }.mini-custom.align-left { align-items: flex-start; text-align: left; }.mini-custom > span { font-size: 22px; }.mini-custom > small { font-size: 6px; font-weight: 900; letter-spacing: .16em; }.mini-custom > strong { font-family: var(--font-display),serif; font-size: 20px; }.mini-custom > p { margin: 0; font-size: 8px; line-height: 1.5; }.mini-custom-highlight > strong { font-size: 42px; line-height: .9; }.mini-custom-card { margin: 8px; border: 1px solid currentColor; border-radius: 15px; }.mini-custom-ribbon { transform: rotate(-1deg); }

@media (max-width: 700px) {
  .kid-mode { padding: 10px; }
  .kid-frame-rounded .invite-canvas { border-radius: 35px; }
  .kid-mode .map-section { width: calc(100% - 28px); }
  .age-spotlight { min-height: 520px; }
  .age-spotlight-copy > strong { font-size: clamp(190px, 65vw, 300px); }
  .custom-invite-block { width: calc(100% - 32px); margin-block: 30px; padding: 40px 22px; }
  .kid-color-grid { grid-template-columns: 1fr; }
}

/* =========================================================
   PRINTKIDS MOMENTS PRO 2.0 · CONSTRUCTOR MULTIPROPÓSITO
   ========================================================= */
.pro-studio-shell{min-width:1180px}.pro-workspace{grid-template-columns:112px minmax(520px,640px) minmax(430px,1fr)}
.dashboard-main-actions,.project-actions-inline,.topbar-actions,.preview-toolbar>div,.publish-card>div{display:flex;align-items:center;gap:10px}
.studio-list-heading{align-items:end}.project-search{width:min(360px,42vw);height:44px;padding:0 15px;border:1px solid #dfd4cf;border-radius:12px;background:#fff}
.pro-project-card .project-footer{align-items:center}.project-actions-inline button{border:0;background:transparent;color:var(--wine);font-size:11px;font-weight:800;cursor:pointer}.project-actions-inline button:last-child{color:#a64545}.kebab{border:1px solid #e2d6d0!important;border-radius:9px!important;background:white!important}
.pro-template-modal{width:min(1180px,94vw);max-height:92vh;overflow:auto}.pro-template-modal .template-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.studio-rail{overflow-y:auto}.studio-rail button{min-height:65px}.editor-panel{overflow-y:auto;padding-bottom:80px}.panel-title{position:sticky;top:0;z-index:8;padding-bottom:18px;background:linear-gradient(var(--paper) 82%,transparent)}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}.studio-field{display:grid;gap:7px}.studio-field.full{grid-column:1/-1}.studio-field>span{color:#796b6e;font-size:9px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.studio-field input,.studio-field textarea,.studio-field select{width:100%;min-height:43px;padding:11px 12px;border:1px solid #e0d5d0;border-radius:10px;background:#fff;color:#31272a}.studio-field textarea{min-height:105px;resize:vertical}.studio-field small{color:#9a8d8d;font-size:9px;line-height:1.4}.studio-field input[type=range]{min-height:25px;padding:0;accent-color:var(--wine)}
.subheading{margin:34px 0 14px;padding-top:22px;border-top:1px solid #eadfda;font-family:var(--font-display),serif;font-size:20px}.repeat-list{display:grid;gap:14px}.block-card{border-radius:16px}.block-card>header{border-radius:16px 16px 0 0}.block-card .form-grid{margin-top:4px}.add-row-button{width:100%;min-height:45px;margin-top:12px;border:1px dashed #cdbbb5;border-radius:12px;background:#fffaf7;color:var(--wine);font-size:11px;font-weight:900;cursor:pointer}
.section-manager{display:grid;gap:9px}.section-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px;border:1px solid #e4d9d4;border-radius:13px;background:#fff}.section-row label{display:flex;align-items:center;gap:12px;cursor:pointer}.section-row label input{width:20px;height:20px;accent-color:var(--wine)}.section-row label span{display:flex;flex-direction:column}.section-row label strong{font-family:var(--font-display),serif;font-size:14px}.section-row label small{color:var(--muted);font-size:9px}.section-row>div{display:flex;gap:5px}.section-row button{width:31px;height:31px;border:1px solid #dfd3cd;border-radius:8px;background:#fff;cursor:pointer}.section-row button:disabled{opacity:.3}
.preset-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:20px}.preset-grid button{min-height:42px;border:1px solid #dfd3cd;border-radius:10px;background:white;font-size:10px;font-weight:800;cursor:pointer}.preset-grid button.active{border-color:var(--wine);background:var(--wine);color:#fff}.color-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.color-grid.two{grid-template-columns:1fr 1fr}.color-grid label{display:grid;gap:6px;color:#796b6e;font-size:8px;font-weight:900;text-transform:uppercase}.color-grid input{width:100%;height:45px;padding:4px;border:1px solid #ddd1cc;border-radius:9px;background:#fff}
.chip-editor,.simple-string-list{display:flex;flex-wrap:wrap;gap:8px}.chip-editor label{position:relative;width:48px;height:48px}.chip-editor input{width:100%;height:100%;padding:3px;border:1px solid #ddd;border-radius:50%;background:#fff}.chip-editor label button{position:absolute;right:-3px;top:-3px;width:19px;height:19px;border:0;border-radius:50%;background:#8f3e4f;color:#fff;font-size:11px}.chip-editor>button{border:1px dashed #cdbbb5;border-radius:20px;background:#fff;padding:0 14px}.simple-string-list{display:grid}.simple-string-list label{display:grid;grid-template-columns:1fr 35px;gap:6px}.simple-string-list input{height:42px;padding:0 12px;border:1px solid #dfd4cf;border-radius:9px}.simple-string-list button{border:0;border-radius:8px;background:#f5e5e5;color:#a33}
.media-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.upload-card{min-height:118px;display:grid;place-items:center;align-content:center;gap:7px;padding:16px;border:1px dashed #cdbab3;border-radius:16px;background:#fffaf7;text-align:center;cursor:pointer}.upload-card.wide{width:100%;margin-bottom:14px}.upload-card input{display:none}.upload-card span{color:var(--wine);font-family:var(--font-display),serif;font-size:15px;font-weight:700}.upload-card small{max-width:100%;overflow:hidden;color:var(--muted);font-size:9px;text-overflow:ellipsis;white-space:nowrap}.mini-danger{margin:6px 0 15px;border:0;background:transparent;color:#a33;font-size:9px;cursor:pointer}.gallery-admin-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.gallery-admin-grid figure{position:relative;aspect-ratio:1;margin:0;overflow:hidden;border-radius:10px}.gallery-admin-grid img{width:100%;height:100%;object-fit:cover}.gallery-admin-grid button{position:absolute;right:5px;top:5px;width:24px;height:24px;border:0;border-radius:50%;background:#000b;color:white}.decoration-editor>img{width:70px;height:70px;margin:0 auto 14px;object-fit:contain}.asset-list,.guest-list,.response-list,.revision-list,.analytics-list{display:grid;gap:9px;margin-top:14px}.asset-list article,.guest-list article,.revision-list article,.analytics-list article{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px;border:1px solid #e3d8d3;border-radius:11px;background:#fff}.asset-list article span{max-width:80px;color:var(--rose);font-size:8px}.asset-list article strong{flex:1;overflow:hidden;font-size:10px;text-overflow:ellipsis;white-space:nowrap}.asset-list article small{color:var(--muted);font-size:8px}.asset-list article button,.guest-list article button,.revision-list article button{border:0;background:transparent;color:var(--wine);font-size:9px;font-weight:800;cursor:pointer}
.guest-form{padding:18px;border:1px solid #e4d8d3;border-radius:16px;background:#fff}.guest-form .primary-action{margin-top:15px}.bulk-import{margin:20px 0;padding:15px;border:1px solid #e4d8d3;border-radius:14px;background:#fff}.bulk-import summary{font-weight:800;cursor:pointer}.bulk-import p{color:var(--muted);font-size:10px}.bulk-import textarea{width:100%;min-height:120px;padding:12px;border:1px solid #ddd1cc;border-radius:10px;resize:vertical}.guest-list article>div:first-child{display:flex;flex-direction:column}.guest-list article small{margin-top:4px;color:var(--muted);font-size:9px}.guest-list article>div:last-child{display:flex;gap:8px}
.response-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:15px}.response-summary article{padding:18px;border-radius:14px;background:#fff;text-align:center}.response-summary strong{display:block;color:var(--wine);font-family:var(--font-display),serif;font-size:28px}.response-summary span{color:var(--muted);font-size:8px}.response-list article{padding:15px;border:1px solid #e4d8d3;border-radius:14px;background:#fff}.response-list header{display:flex;justify-content:space-between}.response-list header span{padding:4px 8px;border-radius:15px;font-size:8px;font-weight:900}.attendance-yes{background:#e1f1e7;color:#27633c}.attendance-no{background:#f5e4e4;color:#903838}.attendance-maybe{background:#fff1cf;color:#7c5b12}.response-list p,.response-list blockquote{color:var(--muted);font-size:10px}.response-list blockquote{margin:8px 0;padding-left:10px;border-left:2px solid var(--rose)}.response-list small{display:block;margin:4px 0}.response-list time{display:block;margin-top:9px;color:#aaa;font-size:8px}.empty-note{padding:25px;border:1px dashed #ddcec8;border-radius:12px;color:var(--muted);text-align:center}
.publish-card{display:grid;gap:12px;padding:18px;border-radius:16px;background:var(--wine);color:#fff}.publish-card code{overflow:auto;padding:10px;border-radius:8px;background:#ffffff18;font-size:10px}.publish-card .ghost-button{border-color:#ffffff55;color:#fff}.analytics-list article span{font-size:10px}.analytics-list article strong{margin-left:auto}.analytics-list article small{color:var(--muted)}.revision-list article>div{display:flex;flex-direction:column}.revision-list article small{color:var(--muted);font-size:8px}.tool-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.tool-grid button{min-height:88px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:15px;border:1px solid #e2d6d0;border-radius:14px;background:#fff;text-align:left;cursor:pointer}.tool-grid button strong{font-family:var(--font-display),serif}.tool-grid button small{margin-top:5px;color:var(--muted)}.tool-grid button.danger{background:#fff6f6;color:#a33}
.pro-preview-stage{padding-inline:22px}.preview-toolbar button{border:0;background:transparent;color:var(--muted);font-size:9px;cursor:pointer}.live-preview-wrap{margin:auto;overflow:hidden;border:9px solid #201b1d;background:white;box-shadow:0 28px 70px #3a222b30;transition:width .3s,height .3s,border-radius .3s}.live-preview-wrap.mobile{width:390px;height:730px;border-radius:34px}.live-preview-wrap.desktop{width:min(100%,720px);height:730px;border-radius:12px}.live-preview-wrap iframe{width:100%;height:100%;border:0;background:#fff}.preview-link-row{justify-content:center}

/* INVITACIÓN PÚBLICA MULTIPROPÓSITO */
.public-invitation{--heading-font:"Playfair Display",serif;--body-font:"DM Sans",sans-serif;--accent-font:"Playfair Display",serif;margin:0;background:var(--invite-bg);color:var(--invite-ink);font-family:var(--body-font);overflow-x:hidden}.public-invitation.heading-cormorant{--heading-font:"Playfair Display",serif}.public-invitation.heading-montserrat,.public-invitation.heading-inter{--heading-font:"DM Sans",sans-serif}.public-invitation.heading-baloo{--heading-font:"Baloo 2",sans-serif}.public-invitation.heading-fredoka{--heading-font:"Fredoka",sans-serif}.public-invitation.heading-space{--heading-font:"DM Sans",sans-serif}.public-invitation.body-serif{--body-font:"Playfair Display",serif}.invite-page{position:relative;min-height:100vh;background-color:var(--invite-bg);background-attachment:fixed}.pattern-grain .invite-page:before,.pattern-dots .invite-page:before,.pattern-diamonds .invite-page:before,.pattern-confetti .invite-page:before,.pattern-glow .invite-page:before,.pattern-floral .invite-page:before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.35}.pattern-grain .invite-page:before{background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.12'/%3E%3C/svg%3E")}.pattern-dots .invite-page:before{background-image:radial-gradient(var(--invite-accent) 1px,transparent 1.5px);background-size:28px 28px}.pattern-diamonds .invite-page:before{background-image:linear-gradient(45deg,transparent 47%,var(--invite-soft) 48% 52%,transparent 53%),linear-gradient(-45deg,transparent 47%,var(--invite-soft) 48% 52%,transparent 53%);background-size:55px 55px}.pattern-confetti .invite-page:before{background-image:radial-gradient(circle at 20% 20%,var(--invite-accent) 0 3px,transparent 4px),radial-gradient(circle at 75% 60%,var(--invite-gold) 0 2px,transparent 3px);background-size:75px 75px}.pattern-glow .invite-page:before{background:radial-gradient(circle at 15% 10%,var(--invite-accent),transparent 35%),radial-gradient(circle at 90% 70%,var(--invite-gold),transparent 35%);filter:blur(45px);opacity:.25}.pattern-floral .invite-page:before{background:radial-gradient(ellipse at 0 0,var(--invite-soft),transparent 35%),radial-gradient(ellipse at 100% 100%,var(--invite-accent),transparent 35%);opacity:.23}.invite-page>*{position:relative;z-index:1}
.preview-ribbon{position:fixed;z-index:1000;left:50%;top:8px;transform:translateX(-50%);padding:8px 16px;border-radius:20px;background:#111;color:#fff;font-size:9px;font-weight:900;letter-spacing:.14em}.invite-hero{position:relative;min-height:100svh;display:grid;place-items:center;padding:100px 24px;background-color:var(--invite-soft);background-position:center;background-size:cover;text-align:center;isolation:isolate}.invite-hero:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,transparent 55%,var(--invite-bg))}.invite-hero.has-photo{color:#fff;text-shadow:0 2px 20px #0006}.hero-inner{width:min(900px,100%)}.hero-inner .invite-kicker{letter-spacing:.34em}.hero-inner h1{max-width:100%;margin:18px auto;font-family:var(--heading-font);font-size:clamp(54px,10vw,var(--invite-title-size));font-weight:600;line-height:.88;letter-spacing:-.045em}.hero-inner h2{max-width:720px;margin:22px auto;font-family:var(--accent-font);font-size:clamp(20px,3vw,34px);font-weight:400;line-height:1.35}.hero-date{font-size:12px;font-weight:800;letter-spacing:.16em}.personalized-hello{display:table;margin:15px auto;padding:8px 14px;border:1px solid currentColor;border-radius:30px;font-family:var(--accent-font);font-size:15px}.hero-divider{display:flex;align-items:center;justify-content:center;gap:14px;color:var(--invite-gold)}.hero-divider:before,.hero-divider:after{content:"";width:80px;height:1px;background:currentColor}.scroll-hint{display:inline-flex;flex-direction:column;gap:7px;margin-top:44px;font-size:10px;font-weight:800;letter-spacing:.12em}.scroll-hint span{font-size:18px;animation:scrollBounce 1.7s infinite}@keyframes scrollBounce{50%{transform:translateY(7px)}}.hero-split .invite-hero{justify-items:start;text-align:left}.hero-split .hero-inner{margin-left:max(5vw,30px);max-width:650px}.hero-split .hero-inner h2{margin-left:0}.hero-split .hero-divider{justify-content:flex-start}.hero-minimal .invite-hero{min-height:78svh}.hero-poster .invite-hero{min-height:100svh}.title-gold .hero-inner h1{background:linear-gradient(105deg,#8c672a,var(--invite-gold),#fff0a8,#8c672a);background-clip:text;-webkit-background-clip:text;color:transparent}.title-gradient .hero-inner h1{background:linear-gradient(135deg,var(--invite-accent),var(--invite-gold),var(--invite-dark));background-clip:text;-webkit-background-clip:text;color:transparent}.title-shadow .hero-inner h1{text-shadow:3px 3px 0 var(--invite-surface),7px 7px 0 var(--invite-dark)}.title-outline .hero-inner h1{color:transparent;-webkit-text-stroke:2px currentColor}
.invite-kicker{margin:0;color:var(--invite-accent);font-size:10px;font-weight:900;letter-spacing:.25em;text-transform:uppercase}.invite-section{width:min(var(--invite-width),calc(100% - 36px));margin:0 auto;padding:clamp(75px,10vw,130px) 24px;text-align:center}.invite-section>h2,.rsvp-card>h2{margin:14px auto 22px;font-family:var(--heading-font);font-size:clamp(38px,6vw,72px);font-weight:500;line-height:1.02}.invite-section>p{max-width:760px;margin:0 auto;color:var(--invite-muted);font-family:var(--accent-font);font-size:clamp(16px,2.2vw,22px);line-height:1.7}.sections-cards .invite-section{margin-block:28px;border-radius:var(--invite-radius);background:var(--invite-surface);box-shadow:0 28px 80px color-mix(in srgb,var(--invite-ink) 10%,transparent)}.sections-lines .invite-section{border-top:1px solid color-mix(in srgb,var(--invite-ink) 16%,transparent)}.sections-glass .invite-section{margin-block:25px;border:1px solid #ffffff24;border-radius:var(--invite-radius);background:color-mix(in srgb,var(--invite-surface) 72%,transparent);box-shadow:0 25px 70px #0003;backdrop-filter:blur(18px)}.sections-bubbles .invite-section{margin-block:28px;border-radius:60px 25px 60px 25px;background:var(--invite-surface);box-shadow:0 25px 55px color-mix(in srgb,var(--invite-accent) 15%,transparent)}
.hosts-grid,.venues-grid,.story-grid,.gift-options,.bank-grid,.info-group-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px;margin-top:42px}.hosts-grid article,.story-grid article,.gift-options>a,.gift-options>article,.bank-grid article,.info-group-grid article{padding:28px;border:1px solid color-mix(in srgb,var(--invite-ink) 14%,transparent);border-radius:var(--invite-radius);background:color-mix(in srgb,var(--invite-surface) 92%,transparent)}.hosts-grid small{color:var(--invite-muted);font-size:10px;letter-spacing:.1em;text-transform:uppercase}.hosts-grid h3,.story-grid h3,.info-group-grid h3{margin:10px 0;font-family:var(--heading-font);font-size:25px}.age-spotlight{min-height:620px;display:grid;place-items:center;padding:80px 20px;background:var(--invite-soft);text-align:center}.age-spotlight p{margin:0;color:var(--invite-dark);font-weight:900;letter-spacing:.25em}.age-spotlight strong{display:block;color:var(--invite-accent);font-family:var(--heading-font);font-size:clamp(180px,35vw,390px);line-height:.72}.age-spotlight h2{margin:15px 0;font-family:var(--heading-font);font-size:clamp(45px,8vw,90px)}.age-spotlight small{color:var(--invite-muted);font-family:var(--accent-font);font-size:18px}.countdown-band{padding:70px 20px;background:var(--invite-dark);color:#fff;text-align:center}.countdown-band>p{font-family:var(--accent-font);font-size:18px}.countdown-grid{display:grid;grid-template-columns:repeat(4,minmax(70px,150px));justify-content:center;gap:14px}.countdown-grid div{padding:20px 8px;border:1px solid #ffffff2e;border-radius:var(--invite-radius)}.countdown-grid strong{display:block;font-family:var(--heading-font);font-size:clamp(36px,6vw,72px)}.countdown-grid span{font-size:9px;letter-spacing:.12em;text-transform:uppercase}
.venue-card{overflow:hidden;padding:28px;border:1px solid color-mix(in srgb,var(--invite-ink) 14%,transparent);border-radius:var(--invite-radius);background:var(--invite-surface)}.venue-card>span{font-size:28px}.venue-card>p{color:var(--invite-accent);font-size:10px;font-weight:900;letter-spacing:.18em;text-transform:uppercase}.venue-card h3{margin:10px 0;font-family:var(--heading-font);font-size:30px}.venue-card>strong{display:block;margin:12px 0}.venue-card address{color:var(--invite-muted);font-style:normal;line-height:1.5}.venue-card>small{display:block;margin-top:10px}.venue-card>div{display:flex;justify-content:center;gap:8px;margin:20px 0}.venue-card iframe{width:calc(100% + 56px);height:220px;margin:22px -28px -28px;border:0}.invite-button{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 20px;border:1px solid var(--invite-dark);border-radius:999px;background:var(--invite-dark);color:#fff;font-size:10px;font-weight:900;letter-spacing:.08em}.invite-button.outline{background:transparent;color:var(--invite-dark)}
.invite-timeline{max-width:720px;margin:45px auto 0}.invite-timeline article{display:grid;grid-template-columns:100px 35px 1fr;align-items:start;text-align:left}.invite-timeline time{padding-top:5px;color:var(--invite-accent);font-weight:900}.invite-timeline article>span{position:relative;display:grid;place-items:center;color:var(--invite-gold)}.invite-timeline article>span:after{content:"";position:absolute;top:26px;width:1px;height:74px;background:color-mix(in srgb,var(--invite-ink) 18%,transparent)}.invite-timeline article:last-child>span:after{display:none}.invite-timeline h3{margin:0;font-family:var(--heading-font);font-size:24px}.invite-timeline p{margin:6px 0 36px;color:var(--invite-muted)}.story-grid time{color:var(--invite-accent);font-weight:900}.story-grid p,.info-group-grid p{color:var(--invite-muted);line-height:1.6}.invite-gallery{display:grid;grid-template-columns:repeat(12,1fr);gap:10px;margin-top:45px}.invite-gallery button{grid-column:span 4;aspect-ratio:1;border:0;padding:0;overflow:hidden;border-radius:calc(var(--invite-radius)*.65);background:none;cursor:zoom-in}.invite-gallery button:nth-child(5n+1){grid-column:span 7;aspect-ratio:1.25}.invite-gallery button:nth-child(5n+2){grid-column:span 5;aspect-ratio:.9}.invite-gallery img{width:100%;height:100%;object-fit:cover;transition:transform .4s}.invite-gallery button:hover img{transform:scale(1.04)}.video-frame{position:relative;aspect-ratio:16/9;margin-top:40px;overflow:hidden;border-radius:var(--invite-radius)}.video-frame iframe,.video-section video{width:100%;height:100%;border:0}.video-section>video{max-width:900px;max-height:600px;margin-top:40px;border-radius:var(--invite-radius);background:#000}.dress-swatches{display:flex;justify-content:center;gap:10px;margin-top:28px}.dress-swatches i{width:42px;height:42px;border:4px solid var(--invite-surface);border-radius:50%;box-shadow:0 4px 16px #0002}.dress-section>small{display:block;margin-top:12px;color:var(--invite-muted)}.gift-options>a,.gift-options>article{display:flex;flex-direction:column;gap:7px}.gift-options strong,.bank-grid strong{font-family:var(--heading-font);font-size:22px}.gift-options small,.bank-grid span,.bank-grid small{color:var(--invite-muted)}.bank-grid code{display:block;margin-top:10px;padding:8px;border-radius:8px;background:var(--invite-soft);font-size:12px}.info-group-grid a{display:inline-block;margin:8px;color:var(--invite-dark);font-size:11px;font-weight:900}.faq-list{max-width:760px;margin:40px auto 0;text-align:left}.faq-list details{border-bottom:1px solid color-mix(in srgb,var(--invite-ink) 18%,transparent)}.faq-list summary{padding:20px 0;font-family:var(--heading-font);font-size:20px;cursor:pointer}.faq-list details p{padding-bottom:20px;color:var(--invite-muted);line-height:1.6}
.custom-invite-block{border-radius:var(--invite-radius)}.custom-block-image{width:min(100%,580px);max-height:500px;margin:0 auto 25px;border-radius:calc(var(--invite-radius)*.7);object-fit:cover}.custom-invite-block--quote h2:before{content:"“"}.custom-invite-block--quote h2:after{content:"”"}.custom-invite-block.align-right{text-align:right}.custom-invite-block .invite-button{margin-top:24px}.rsvp-section{padding:100px 18px;background:var(--invite-dark)}.rsvp-card{width:min(760px,100%);margin:auto;padding:clamp(28px,6vw,65px);border-radius:var(--invite-radius);background:var(--invite-surface);color:var(--invite-ink);text-align:center}.rsvp-card>p{color:var(--invite-muted);line-height:1.6}.attendance-buttons{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:8px;margin:30px 0}.attendance-buttons button{min-height:45px;border:1px solid color-mix(in srgb,var(--invite-ink) 20%,transparent);border-radius:999px;background:transparent;cursor:pointer}.attendance-buttons button.active{border-color:var(--invite-dark);background:var(--invite-dark);color:#fff}.rsvp-form{display:grid;grid-template-columns:1fr 1fr;gap:13px;text-align:left}.rsvp-form label{display:grid;gap:7px;color:var(--invite-muted);font-size:10px;font-weight:900}.rsvp-form input,.rsvp-form textarea,.rsvp-form select{width:100%;min-height:47px;padding:12px;border:1px solid color-mix(in srgb,var(--invite-ink) 18%,transparent);border-radius:11px;background:var(--invite-bg);color:var(--invite-ink)}.rsvp-form textarea{min-height:100px;resize:vertical}.rsvp-form label:has(textarea),.rsvp-form .rsvp-error,.rsvp-form>.invite-button{grid-column:1/-1}.checkbox-answer{display:flex;align-items:center;gap:8px}.checkbox-answer input{width:20px;min-height:20px}.honeypot{position:absolute!important;left:-9999px!important}.rsvp-error{color:#b13535}.rsvp-success span{display:grid;place-items:center;width:65px;height:65px;margin:auto;border-radius:50%;background:var(--invite-dark);color:#fff;font-size:30px}.rsvp-success h3{font-family:var(--heading-font);font-size:34px}.rsvp-closed{margin-top:25px;padding:18px;border-radius:12px;background:var(--invite-soft)}.share-section{padding:70px 20px;background:var(--invite-soft);text-align:center}.share-section p{font-family:var(--accent-font);font-size:20px}.share-section button{min-height:46px;padding:0 22px;border:1px solid var(--invite-dark);border-radius:999px;background:transparent;color:var(--invite-dark);font-weight:900}.invite-footer{min-height:300px;display:grid;place-items:center;align-content:center;gap:8px;padding:60px 20px;background:var(--invite-bg);text-align:center}.invite-footer>span{color:var(--invite-gold);font-size:24px}.invite-footer p{margin:0;font-family:var(--heading-font);font-size:36px}.invite-footer small{color:var(--invite-muted)}.invite-decoration{position:absolute;z-index:4;max-width:none;pointer-events:none}.decoration-zone{position:relative}.music-orb,.whatsapp-orb{position:fixed;z-index:50;right:18px;width:58px;height:58px;display:grid;place-items:center;border:0;border-radius:50%;box-shadow:0 12px 35px #0003}.music-orb{bottom:88px;background:var(--invite-dark);color:#fff;font-size:22px}.whatsapp-orb{bottom:20px;background:#25d366;color:#fff}.whatsapp-orb span{font-size:12px;font-weight:900}.whatsapp-orb strong{display:none}.lightbox{position:fixed;z-index:2000;inset:0;display:grid;place-items:center;padding:30px;background:#000d}.lightbox[hidden]{display:none}.lightbox img{max-width:95vw;max-height:90vh;object-fit:contain}.lightbox button{position:absolute;right:20px;top:20px;width:48px;height:48px;border:0;border-radius:50%;background:#fff;color:#111;font-size:28px}.lightbox-open{overflow:hidden}.reveal{opacity:0;transform:translateY(24px);transition:opacity .8s,transform .8s}.reveal.is-visible{opacity:1;transform:none}.animation-none .reveal{opacity:1;transform:none}.animation-playful .reveal{transition-timing-function:cubic-bezier(.18,.89,.32,1.28)}.animation-energetic .reveal{transform:scale(.96)}.animation-energetic .reveal.is-visible{transform:scale(1)}
.invite-access-page{min-height:100vh;display:grid;place-items:center;padding:24px;background:linear-gradient(145deg,#f7ece8,#fff)}.invite-access-card{width:min(430px,100%);padding:45px;border:1px solid #eadbd5;border-radius:24px;background:#fff;text-align:center;box-shadow:0 30px 80px #5d34451f}.invite-access-card>span{color:var(--gold);font-size:30px}.invite-access-card>p{color:var(--rose);font-size:10px;font-weight:900;letter-spacing:.2em}.invite-access-card h1{font-family:var(--font-display),serif;font-size:40px}.invite-access-card label{display:grid;gap:9px;color:var(--muted);font-size:10px;text-align:left}.invite-access-card input{height:50px;padding:0 14px;border:1px solid #ddd0cb;border-radius:10px}.invite-access-card button{width:100%;height:50px;margin-top:15px;border:0;border-radius:10px;background:var(--wine);color:#fff;font-weight:900}

@media(max-width:1180px){.pro-studio-shell{min-width:0}.pro-workspace{grid-template-columns:92px minmax(460px,1fr)}.pro-preview-stage{display:none}.pro-template-modal .template-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:800px){.dashboard-main-actions{align-items:stretch;flex-direction:column}.studio-list-heading{align-items:stretch;flex-direction:column}.project-search{width:100%}.pro-template-modal .template-grid{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}.studio-field.full{grid-column:auto}.color-grid{grid-template-columns:1fr 1fr}.preset-grid{grid-template-columns:1fr 1fr}.response-summary{grid-template-columns:1fr}.invite-gallery button,.invite-gallery button:nth-child(n){grid-column:span 6;aspect-ratio:1}.rsvp-form{grid-template-columns:1fr}.rsvp-form label:has(textarea),.rsvp-form .rsvp-error,.rsvp-form>.invite-button{grid-column:auto}.hero-split .hero-inner{margin-left:0}.hero-split .invite-hero{text-align:center;justify-items:center}.hero-split .hero-inner h2{margin-inline:auto}.hero-split .hero-divider{justify-content:center}.venues-grid,.hosts-grid,.story-grid,.gift-options,.bank-grid,.info-group-grid{grid-template-columns:1fr}.invite-timeline article{grid-template-columns:65px 25px 1fr}}
@media(max-width:600px){.invite-section{width:calc(100% - 20px);padding:65px 18px}.sections-cards .invite-section,.sections-glass .invite-section,.sections-bubbles .invite-section{margin-block:10px}.invite-hero{padding-inline:18px}.countdown-grid{grid-template-columns:repeat(2,1fr)}.invite-gallery{gap:5px}.venue-card>div{flex-direction:column}.rsvp-section{padding:55px 10px}.rsvp-card{padding:28px 18px}.age-spotlight{min-height:480px}.age-spotlight strong{font-size:55vw}.music-orb,.whatsapp-orb{right:12px}.custom-invite-block{width:calc(100% - 20px)}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}.reveal{opacity:1;transform:none;transition:none}.scroll-hint span{animation:none}}