/* Lume: light product presentation inspired by Apple's material and spacing. */
:root {
  --ink:#1d1d1f; --ink-soft:#62626a; --muted:#86868b;
  --paper:#fff; --paper-2:#f5f5f7; --line:#e5e5e9;
  --coral:#c94752; --coral-deep:#c94752;
  --sans:-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;
  --serif:var(--sans); --mono:var(--sans);
}
body { background:#fff; font-family:var(--sans); color:var(--ink); }
.grain { display:none; }
.section-pad,.topbar,.footer { width:min(1200px,calc(100% - 80px)); }
h1,h2,h3,h4 { font-family:var(--sans); }
.hero h1 em,h2 em,h3 em,.preview-script,.script-label { font-family:var(--sans); font-style:normal; font-weight:inherit; letter-spacing:inherit; }
button:focus-visible,a:focus-visible,summary:focus-visible { outline:3px solid var(--coral-deep); outline-offset:4px; }
.topbar { height:76px; gap:24px; }
.brand-word { font-size:22px; }.nav-links { gap:25px; font-size:12px; }
.locale-toggle { color:#6e6e73; font-size:10px; border-color:#e5e5e9; }
.button { min-height:49px; padding:0 23px; font-size:13px; font-weight:600; box-shadow:none; white-space:nowrap; }
.button-primary,.button-dark { background:var(--coral-deep); color:#fff; box-shadow:none; }
.button-primary:hover,.button-dark:hover { background:#b53b46; box-shadow:none; transform:translateY(-1px); }
.button-ghost { border-color:#dcdce1; background:#fff; color:var(--ink); }
.button-small { min-height:38px; font-size:11px; }
.hero { display:grid; grid-template-columns:minmax(310px,.82fr) minmax(0,1.25fr); gap:20px; align-items:center; min-height:610px; padding:45px 0 62px; }
.hero-copy { max-width:470px; }.hero .eyebrow { border:0; background:none; padding:0; color:var(--coral-deep); text-transform:none; letter-spacing:0; font:600 12px var(--sans); }
.hero h1 { margin:18px 0 23px; font-size:clamp(46px,4.6vw,65px); line-height:1.07; letter-spacing:-.052em; font-weight:650; }
.hero h1 em { color:var(--coral-deep); }
.hero-lede { max-width:355px; font-size:16px; line-height:1.65; color:#6e6e73; }
.hero-actions { display:flex; flex-direction:row; align-items:center; gap:19px; margin-top:28px; }
.text-link,.underlined-link { font-size:12px; font-weight:600; }
.hero-purchase-note { display:flex; align-items:center; gap:12px; margin-top:23px; font-size:11px; color:#86868b; }.hero-purchase-note strong { color:#424247; font-size:14px; font-weight:600; }
.product-hero-visual { width:100%; min-width:0; margin-right:-25px; }
.device-shot { position:relative; width:100%; margin:0; overflow:hidden; isolation:isolate; }
.device-canvas { position:absolute; top:0; left:0; transform-origin:0 0; }
.device-backplate { display:block; position:absolute; width:100%; height:100%; }
.device-live-screen { position:absolute; top:0; left:0; z-index:1; border:0; background:#fafafa; transform-origin:0 0; pointer-events:none; }
.device-shot-mac .device-live-screen { clip-path:polygon(0% 0%,46.5% 0%,46.5% 3.4%,57.6% 3.4%,57.6% 0%,100% 0%,100% 100%,0% 100%); border-radius:5px; }
.device-shot-phone .device-live-screen { border-radius:50px; clip-path:polygon(0% 0%,35% 0%,35% 5.8%,65% 5.8%,65% 0%,100% 0%,100% 100%,0% 100%); }
.device-context { display:flex; align-items:center; justify-content:space-between; gap:15px; margin:0 15px 0 20px; color:#86868b; font-size:10px; }
.device-context .underlined-link { font-size:11px; }
.signal-strip { background:#f5f5f7; border-color:#e5e5e9; }.signal-item { font-size:11px; }.signal-number { font-size:11px; color:#9b9ba2; }.signal-price { background:#f0f0f3; }.signal-price strong { font-family:var(--sans); font-size:25px; font-weight:650; letter-spacing:-1px; }
.mobile-experience { display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center; padding:80px 0; }
.mobile-experience-visual { overflow:hidden; border-radius:24px; background:#f5f5f7; }
.mobile-experience-copy { padding-right:10px; }.experience-label { color:var(--coral-deep); font-size:12px; font-weight:600; }
.mobile-experience h2 { margin:17px 0 22px; font-size:clamp(38px,4.1vw,55px); line-height:1.08; letter-spacing:-.045em; font-weight:650; }.mobile-experience h2 em { color:var(--coral-deep); }
.mobile-experience-copy>p { max-width:410px; color:#6e6e73; font-size:15px; line-height:1.7; }
.experience-points { display:grid; gap:16px; margin:26px 0; }.experience-points strong,.experience-points span { display:block; }.experience-points strong { margin-bottom:4px; font-size:13px; font-weight:600; }.experience-points span { color:#86868b; font-size:12px; }
.experience-preview { display:block; border:0; padding:0; background:none; margin-top:16px; color:#73737b; font-size:12px; font-weight:600; }
.statement { display:block; max-width:760px; padding:54px 0 70px; text-align:center; }
.statement-mark,.statement-copy .section-kicker { display:none; }.statement h2 { margin:0; font-size:clamp(35px,3.8vw,49px); line-height:1.13; letter-spacing:-.042em; font-weight:650; }.statement h2 em { color:var(--coral-deep); }
.statement-side { max-width:470px; margin:20px auto 0; padding:0; border:0; }.statement-side p { margin:0 0 18px; font-size:14px; line-height:1.8; color:#6e6e73; }
.how { padding:52px 0 80px; }.section-intro { max-width:550px; }.section-intro .section-kicker { display:none; }.section-intro h2 { font-size:clamp(35px,4vw,50px); line-height:1.13; letter-spacing:-.04em; font-weight:650; }.section-intro p { font-size:14px; color:#6e6e73; line-height:1.7; }
.journey-layout { display:grid; grid-template-columns:.86fr 1.14fr; gap:52px; align-items:start; margin-top:37px; }
.journey-row { min-height:112px; padding:23px 13px; background:transparent; border:0; border-bottom:1px solid #e8e8ed; }.journey-row.is-active { background:#f5f5f7; border-radius:12px; }.journey-row h3 { font-size:15px; letter-spacing:-.2px; }.journey-row p { font-size:12px; line-height:1.7; color:#77777f; }.journey-index { color:#9c9ca3; font-size:10px; }.journey-arrow { color:#9c9ca3; }
.journey-preview-card { padding:19px; border:1px solid #e5e5e9; border-radius:19px; background:#fff; box-shadow:0 7px 28px rgba(30,30,45,.035); }
.journey-preview-heading>span { color:#8a8a92; font-size:10px; }.journey-preview-heading h3 { font-size:20px; line-height:1.25; letter-spacing:-.6px; margin:5px 0 17px; }
.responsive-app-preview { position:relative; overflow:hidden; aspect-ratio:1000/760; border:1px solid #ededf1; border-radius:10px; background:#f5f5f7; }
.responsive-app-preview iframe { position:absolute; width:1000px; height:760px; border:0; transform-origin:0 0; pointer-events:none; }
.journey-preview-foot { display:flex; justify-content:space-between; align-items:center; gap:15px; padding-top:14px; font-size:10px; color:#86868b; }.journey-preview-foot .underlined-link { font-size:10px; }
.occasions { padding:45px 0 80px; }.occasions-head { display:block; }.occasions-head .section-kicker { display:none; }.occasions-head h2 { font-size:clamp(35px,4vw,50px); line-height:1.13; letter-spacing:-.04em; font-weight:650; }.occasions-head>p { max-width:500px; margin:17px 0 0; font-size:14px; color:#6e6e73; }
.occasion-layout { display:grid; grid-template-columns:.86fr 1.14fr; gap:52px; align-items:start; margin-top:36px; }.occasion-tab { background:none; border:0; border-bottom:1px solid #e5e5e9; padding:22px 13px; border-radius:0; }.occasion-tab.is-selected { background:#f5f5f7; border-radius:12px; }.occasion-tab strong { font-size:15px; }.occasion-tab small { color:#86868b; font-size:12px; }.occasion-tab>span { color:#9c9ca3; }.occasion-tab b { color:#9c9ca3; }
.occasion-preview { min-height:0; border:1px solid #e5e5e9; border-radius:19px; background:#fff; color:var(--ink); box-shadow:none; }.occasion-preview::before,.occasion-preview::after,.preview-main::before,.preview-main::after { display:none; }
.preview-top { padding:17px 20px; color:#8a8a92; border-color:#ededf1; background:#fff; font:400 11px var(--sans); text-transform:none; letter-spacing:0; }
.preview-main { min-height:0; padding:20px; background:#fff; }.occasion-photo { display:block; width:100%; height:auto; aspect-ratio:16/9; border-radius:12px; object-fit:cover; margin-bottom:20px; }.preview-script { color:var(--coral-deep); font:500 12px var(--sans); }.preview-main h3 { margin:9px 0 13px; color:var(--ink); font-size:33px; line-height:1.1; letter-spacing:-.04em; font-weight:650; }.preview-main h3 em { color:var(--ink); }.preview-main p { font-size:13px; color:#6e6e73; line-height:1.7; }.preview-counter { border-color:#e8e8ed; margin-top:18px; padding-top:13px; }.preview-counter>span { color:#86868b; font:400 10px var(--sans); }.preview-counter strong { color:var(--coral-deep); font:600 20px var(--sans); letter-spacing:-.4px; }.preview-foot { padding:15px 20px; border-color:#e5e5e9; color:#86868b; background:#fafafa; font:400 10px var(--sans); text-transform:none; letter-spacing:0; }
.feature { display:grid; grid-template-columns:1.04fr .96fr; gap:65px; align-items:center; padding:55px 0 80px; }.feature-visual { min-width:0; display:flex; flex-direction:column; }.feature-couple { display:block; width:100%; height:auto; aspect-ratio:4/3; object-fit:cover; border-radius:20px; }.feature-caption { padding:11px 0; margin:0; font:400 10px var(--sans); text-transform:none; letter-spacing:0; }
.feature-copy>.section-kicker { display:none; }.feature h2 { font-size:clamp(35px,3.6vw,48px); line-height:1.14; letter-spacing:-.04em; font-weight:650; }.feature h2 em { color:var(--coral-deep); }.feature-copy>p { margin:21px 0; font-size:14px; line-height:1.8; }.feature-points { margin:20px 0 25px; }.feature-points li { padding:15px 0; }.feature-points b { font-size:13px; }.feature-points small { font-size:11px; color:#86868b; }
.line-icon { display:grid; place-items:center; width:33px; height:33px; flex-shrink:0; border:0; border-radius:9px; color:var(--coral-deep); background:#f5f5f7; }.line-icon::before { content:''; position:static; display:block; width:19px; height:19px; border:0; transform:none; background:currentColor; -webkit-mask:center/contain no-repeat; mask:center/contain no-repeat; }.line-icon::after { display:none; }.icon-frame::before { -webkit-mask-image:url('/assets/icons/images-square.svg'); mask-image:url('/assets/icons/images-square.svg'); }.icon-music::before { -webkit-mask-image:url('/assets/icons/music-note.svg'); mask-image:url('/assets/icons/music-note.svg'); }.icon-share::before { -webkit-mask-image:url('/assets/icons/share-network.svg'); mask-image:url('/assets/icons/share-network.svg'); }
.offer { display:grid; grid-template-columns:1.1fr .9fr; gap:70px; align-items:center; padding:60px 0 85px; }.offer h2 { margin:0 0 20px; font-size:clamp(35px,4vw,50px); line-height:1.14; letter-spacing:-.04em; font-weight:650; }.offer h2 em { color:var(--coral-deep); }.offer-intro>p { max-width:460px; color:#6e6e73; font-size:14px; line-height:1.8; }.offer-features { display:grid; grid-template-columns:1fr 1fr; gap:14px 24px; margin:25px 0 0; padding:0; list-style:none; font-size:12px; }.offer-features li { display:flex; align-items:center; gap:9px; }.offer-features li::before { content:'✓'; color:var(--coral-deep); }
.offer-card { padding:31px; border:1px solid #e5e5e9; border-radius:20px; background:#f5f5f7; }.offer-card>span { color:#86868b; font-size:12px; }.offer-price { display:flex; align-items:baseline; gap:8px; margin:10px 0; }.offer-price strong { font-size:57px; line-height:1.2; letter-spacing:-2.9px; font-weight:650; }.offer-price span { color:#86868b; font-size:16px; }.offer-card>p { font-size:12px; color:#77777f; }.offer-card .button { width:100%; margin:12px 0; }.offer-payment { border-top:1px solid #dddde2; margin-top:19px; padding-top:17px; color:#86868b; font-size:11px; }
.faq { max-width:900px; padding:30px 0 75px; }.faq h2 { margin:0 0 25px; font-size:33px; letter-spacing:-1px; font-weight:650; }.faq details { padding:19px 0; border-bottom:1px solid #e5e5e9; }.faq summary { display:flex; justify-content:space-between; gap:20px; list-style:none; cursor:pointer; font-size:14px; font-weight:600; }.faq summary::after { content:'+'; color:#86868b; font-size:20px; line-height:1; }.faq details[open] summary::after { content:'−'; }.faq details p { max-width:720px; margin:15px 0 0; color:#77777f; font-size:13px; line-height:1.8; }
.closing { margin-bottom:24px; padding:65px 30px; border-radius:21px; background:#f5f5f7; }.closing-inner { background:none; color:var(--ink); border:0; }.closing .closing-star,.closing .section-kicker { display:none; }.closing h2 { margin:10px 0 22px; color:var(--ink); font-size:clamp(45px,6vw,75px); line-height:1.08; letter-spacing:-.045em; font-weight:650; }.closing h2 em { color:var(--coral-deep); }.closing p { color:#77777f; font-size:14px; line-height:1.7; }.closing-detail { color:#86868b; font:400 10px var(--sans); text-transform:none; letter-spacing:0; }
.footer { display:flex; justify-content:space-between; flex-wrap:wrap; gap:22px; min-height:100px; padding:24px 0; color:#86868b; font:400 11px var(--sans); }.footer small { font:400 10px var(--sans); }
.purchase-bar { position:fixed; z-index:40; right:24px; bottom:22px; display:flex; align-items:center; gap:20px; padding:10px 11px 10px 18px; border:1px solid #e5e5e9; border-radius:16px; background:rgba(255,255,255,.96); box-shadow:0 8px 28px rgba(27,27,42,.10); transform:translateY(130px); opacity:0; visibility:hidden; transition:transform .22s ease,opacity .22s ease,visibility .22s; }.purchase-bar.is-visible { transform:translateY(0); opacity:1; visibility:visible; }.purchase-bar strong,.purchase-bar small { display:block; }.purchase-bar strong { font-size:13px; font-weight:600; }.purchase-bar small { margin-top:3px; font-size:10px; color:#86868b; }.purchase-bar .button { min-height:40px; font-size:11px; }
body.modal-open .purchase-bar { visibility:hidden; }
.preview-modal-backdrop { background:rgba(85,85,96,.34); backdrop-filter:blur(12px); }.preview-modal-window { max-width:1120px; height:min(90dvh,820px); border:1px solid #e5e5e9; border-radius:18px; box-shadow:0 20px 70px rgba(30,30,50,.15); }.preview-modal-bar { flex-shrink:0; background:#fafafa; border-color:#e5e5e9; }
.wizard-backdrop { background:rgba(85,85,96,.34); backdrop-filter:blur(12px); }.wizard { background:#fff; border:1px solid #e5e5e9; border-radius:23px; box-shadow:0 20px 80px rgba(30,30,50,.13); }
.wizard-header h2 { line-height:1.15; font-size:28px; letter-spacing:-.7px; font-weight:600; }.wizard-step h3,.wizard-success h3 { line-height:1.15; font-size:30px; letter-spacing:-1px; font-weight:600; }.wizard-step-number,.wizard-overline { font:500 10px var(--sans); letter-spacing:0; }.wizard-step input,.wizard-step textarea { background:#f8f8fa; border-color:#e1e1e6; border-radius:10px; }.choice-card,.theme-card { border-color:#e5e5e9; background:#fafafa; }.wizard-hint,.upload-zone { background:#f5f5f7; border-color:#dedee4; }.hint-mark { background:#ededf1; color:#77777f; }.pill-choice.is-selected { background:#fbeef0; color:var(--coral-deep); border-color:var(--coral-deep); }.summary-card { border-color:#e5e5e9; background:#e5e5e9; }.summary-card>div { background:#fff; }.checkout-box { border-color:#e5e5e9; background:#f8f8fa; }
@media(max-width:1000px) {
  .section-pad,.topbar,.footer { width:calc(100% - 56px); }.hero { grid-template-columns:.95fr 1.1fr; gap:10px; }.hero h1 { font-size:48px; }.hero-actions { gap:14px; }.hero-actions .button { padding:0 18px; }.mobile-experience { gap:36px; }.journey-layout,.occasion-layout { gap:32px; }.feature { gap:37px; }.offer { gap:38px; }
}
@media(max-width:760px) {
  .section-pad,.topbar,.footer { width:calc(100% - 40px); }.topbar { height:70px; gap:12px; }.topbar-actions { gap:7px; }.nav-links { display:none; }.top-cta { padding:0 12px; font-size:10px; }.brand-word { font-size:21px; }
  .hero { display:flex; flex-direction:column; align-items:stretch; min-height:0; padding:40px 0 38px; gap:24px; }.hero-copy { max-width:520px; }.hero h1 { margin:14px 0 21px; font-size:clamp(42px,9.3vw,57px); line-height:1.08; letter-spacing:-.045em; }.hero-lede { max-width:430px; font-size:15px; }.hero-actions { flex-direction:row; align-items:center; gap:18px; }.hero-purchase-note { font-size:10px; gap:10px; margin-top:22px; }.product-hero-visual { width:calc(100% + 16px); margin:0 -8px; max-width:none; }.device-context { margin:0 8px; font-size:9px; }.device-context .underlined-link { font-size:10px; }
  .mobile-experience { grid-template-columns:1fr; gap:32px; padding:54px 0; }.mobile-experience-visual { width:100%; max-width:460px; margin:auto; }.mobile-experience-copy { padding:0; }.mobile-experience h2 { font-size:41px; }.mobile-experience-copy>p { font-size:14px; }
  .statement { padding:27px 0 48px; }.statement h2 { font-size:35px; }.statement-side { margin-top:19px; }
  .how,.occasions { padding:36px 0 54px; }.section-intro h2,.occasions-head h2 { font-size:36px; }.journey-layout,.occasion-layout { grid-template-columns:1fr; gap:26px; margin-top:25px; }.journey-row { min-height:105px; padding:19px 12px; }.journey-preview-card { padding:15px; }.occasion-tab { padding:19px 12px; }
  .feature { grid-template-columns:1fr; gap:27px; padding:35px 0 54px; }.feature-couple { border-radius:17px; }.feature h2 { font-size:36px; }.feature-points { margin-bottom:25px; }
  .offer { grid-template-columns:1fr; gap:28px; padding:35px 0 55px; }.offer h2 { font-size:36px; }.offer-features { gap:13px 17px; font-size:11px; }.offer-card { padding:25px; }
  .faq { padding:15px 0 48px; }.faq h2 { font-size:28px; letter-spacing:-.8px; }.faq summary { font-size:13px; }.closing { padding:49px 23px; }.closing h2 { font-size:47px; }.closing p { font-size:13px; }
  .purchase-bar { left:10px; right:10px; bottom:10px; justify-content:space-between; gap:10px; padding:10px 11px 10px 14px; border-radius:14px; }.purchase-bar .button { padding:0 17px; font-size:10px; }.purchase-bar strong { max-width:140px; font-size:12px; }.footer { padding:24px 0 100px; }
  .preview-modal-backdrop { padding:8px; }.preview-modal-bar { padding:10px; }.preview-modal-bar>div:first-child { min-width:0; }.preview-modal-bar #preview-modal-url { font-size:9px!important; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
}
@media(max-width:380px) { .hero-actions { gap:11px; }.hero-actions .button { padding:0 16px; font-size:11px; }.hero-actions .text-link { font-size:11px; }.topbar-actions { gap:5px; }.locale-toggle { padding:0 7px; }.offer-features { grid-template-columns:1fr; } }
@media(prefers-reduced-motion:reduce) { .purchase-bar { transition:none; } }

/* Creator workspace hooks */
.topbar-dashboard-link { color: var(--ink-soft); font-size: 12px; font-weight: 600; white-space: nowrap; }
.topbar-dashboard-link:hover { color: var(--ink); }
.upload-zone { transition: border-color .2s ease, background .2s ease, transform .2s ease; }
.upload-zone.is-dragging { border-color: var(--coral-deep); background: #fff5f5; transform: translateY(-1px); }
.upload-preview { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:8px; width:100%; margin-top:12px; }
.photo-preview-item { position:relative; min-width:0; margin:0; overflow:hidden; border:1px solid #e4e4e8; border-radius:10px; background:#fff; }
.photo-preview-item img { display:block; width:100%; aspect-ratio:1; object-fit:cover; }
.photo-preview-item figcaption { padding:4px 5px 5px; color:#8a8a91; font-size:9px; text-transform:uppercase; letter-spacing:.04em; }
.photo-remove-button { position:absolute; top:4px; right:4px; display:grid; place-items:center; width:22px; height:22px; padding:0; border:1px solid rgba(255,255,255,.8); border-radius:50%; color:#fff; background:rgba(29,29,31,.72); font-size:16px; line-height:1; }
.photo-remove-button:hover { background:var(--coral-deep); }
.wizard-success .button-ghost { color:var(--ink); background:#fff; }
@media(max-width:760px) { .topbar-dashboard-link { display:none; } .upload-preview { grid-template-columns:repeat(3,minmax(0,1fr)); } }
