@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Italiana&display=swap');

:root { --ink:#f8f1ff; --muted:#b8abc7; --bg:#09060d; --panel:#110c18; --line:rgba(255,255,255,.12); --pink:#ff4fd8; --violet:#8a5cff; --orange:#ff835f; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; background:var(--bg); }
body { margin:0; background:var(--bg); color:var(--ink); font-family:"DM Sans",sans-serif; overflow-x:hidden; }
a { color:inherit; text-decoration:none; }
button { font:inherit; }
img, video { display:block; width:100%; }
::selection { background:var(--pink); color:#16051d; }

.site-header { position:fixed; z-index:50; top:18px; left:50%; transform:translateX(-50%); width:min(1180px,calc(100% - 36px)); height:68px; padding:10px 12px 10px 18px; border:1px solid rgba(255,255,255,.13); border-radius:18px; display:flex; align-items:center; justify-content:space-between; background:rgba(10,6,15,.76); box-shadow:0 20px 60px rgba(0,0,0,.25); backdrop-filter:blur(20px); }
.brand { display:flex; align-items:center; gap:10px; font-weight:700; letter-spacing:-.03em; font-size:19px; }
.brand img { width:37px; height:37px; border-radius:10px; }
.nav-links { display:flex; align-items:center; gap:28px; font-size:14px; color:#d4c7df; }
.nav-links a:hover { color:#fff; }
.nav-links .nav-cta { color:#fff; background:#21152b; border:1px solid var(--line); padding:13px 17px; border-radius:11px; }
.menu-button { display:none; width:44px; height:44px; border:0; border-radius:10px; background:#1a1121; padding:13px; }
.menu-button span { display:block; height:1px; margin:5px 0; background:#fff; }

.hero { position:relative; min-height:960px; padding:170px max(32px,calc((100vw - 1180px)/2)) 100px; display:grid; grid-template-columns:1.02fr .98fr; gap:55px; align-items:center; overflow:hidden; }
.hero:before { content:""; position:absolute; inset:0; opacity:.22; pointer-events:none; background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px); background-size:70px 70px; mask-image:linear-gradient(to bottom,black,transparent 85%); }
.hero-glow { position:absolute; border-radius:50%; filter:blur(90px); pointer-events:none; }
.hero-glow-one { width:520px; height:520px; right:-100px; top:110px; background:rgba(157,63,255,.18); }
.hero-glow-two { width:320px; height:320px; left:-170px; top:290px; background:rgba(255,61,143,.12); }
.hero-copy { z-index:2; max-width:650px; }
.eyebrow { margin:0 0 24px; display:flex; align-items:center; gap:10px; color:#d8c9e4; font-size:12px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; }
.eyebrow span { width:28px; height:1px; background:linear-gradient(90deg,var(--pink),var(--orange)); }
h1,h2 { margin:0; font-family:"Italiana",Georgia,serif; font-weight:400; line-height:.92; letter-spacing:-.045em; }
h1 { font-size:clamp(72px,8.1vw,132px); max-width:770px; }
h1 em,h2 em { color:var(--pink); font-weight:400; }
.hero-intro { max-width:550px; margin:30px 0 34px; color:var(--muted); font-size:18px; line-height:1.7; }
.hero-actions { display:flex; gap:14px; flex-wrap:wrap; }
.button { min-height:62px; display:inline-flex; align-items:center; justify-content:center; gap:12px; padding:10px 23px; border-radius:14px; transition:.25s ease; }
.button-primary { color:#130b18; background:linear-gradient(135deg,#ffb4e8 0%,#ff65ce 48%,#b48aff 100%); box-shadow:0 14px 50px rgba(255,79,216,.2); }
.button-primary:hover { transform:translateY(-3px); box-shadow:0 18px 60px rgba(255,79,216,.35); }
.button small { display:block; font-size:8px; font-weight:700; letter-spacing:.14em; }
.button span:last-child { font-weight:700; line-height:1.1; }
.play-mark { font-size:20px; }
.button-ghost { border:1px solid var(--line); background:rgba(255,255,255,.03); color:#e4d8eb; }
.button-ghost:hover { border-color:rgba(255,255,255,.3); background:rgba(255,255,255,.07); }
.button-ghost span { color:var(--pink); }
.social-proof { display:flex; align-items:center; gap:15px; margin-top:40px; color:#887a93; font-size:12px; }
.social-proof p { margin:0; line-height:1.45; }
.social-proof strong { color:#c9bdd2; font-weight:600; }
.avatar-stack { display:flex; }
.avatar-stack span { width:34px; height:34px; margin-left:-8px; border:2px solid var(--bg); display:grid; place-items:center; border-radius:50%; background:linear-gradient(135deg,#723fe6,#df3e96); font-size:11px; }
.avatar-stack span:first-child { margin-left:0; }

.hero-visual { position:relative; height:680px; display:grid; place-items:center; z-index:2; }
.phone-shell { position:relative; width:332px; height:664px; padding:9px; border:1px solid rgba(255,255,255,.3); border-radius:53px; background:linear-gradient(155deg,#31243c,#08060b 45%); box-shadow:0 45px 110px rgba(0,0,0,.7),0 0 80px rgba(203,67,255,.2); transform:rotate(3deg); overflow:hidden; }
.phone-shell:before { content:""; position:absolute; z-index:4; top:18px; left:50%; width:92px; height:24px; transform:translateX(-50%); background:#09070b; border-radius:20px; }
.phone-shell video { height:100%; object-fit:cover; border-radius:45px; background:#130b19; }
.phone-shine { position:absolute; inset:0; background:linear-gradient(115deg,rgba(255,255,255,.12),transparent 28%); pointer-events:none; }
.orbit { position:absolute; border:1px solid rgba(238,135,255,.16); border-radius:50%; }
.orbit-one { width:570px; height:570px; }
.orbit-two { width:465px; height:465px; border-style:dashed; animation:spin 26s linear infinite; }
.float-card { position:absolute; z-index:5; padding:16px 18px; border:1px solid rgba(255,255,255,.18); border-radius:15px; background:rgba(24,13,31,.76); backdrop-filter:blur(16px); box-shadow:0 18px 50px rgba(0,0,0,.35); }
.float-card span { display:block; margin-bottom:7px; color:#ac9ab8; font-size:9px; letter-spacing:.16em; }
.float-card strong { font-size:15px; }
.float-card-top { top:110px; right:-18px; width:148px; }
.float-card-top strong { font-family:"Italiana"; font-size:26px; }
.meter { height:3px; margin-top:10px; border-radius:4px; background:#3a2a43; overflow:hidden; }
.meter i { display:block; width:92%; height:100%; background:linear-gradient(90deg,var(--violet),var(--pink)); }
.float-card-bottom { bottom:105px; left:-52px; }
.spark { position:absolute; z-index:6; color:#ffb0ee; text-shadow:0 0 16px #ff3dcc; animation:pulse 2.4s ease-in-out infinite; }
.spark-one { top:55px; right:80px; font-size:30px; }
.spark-two { bottom:65px; right:45px; font-size:18px; animation-delay:1s; }

.ticker { overflow:hidden; padding:20px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:#0d0812; transform:rotate(-1.2deg) scale(1.02); }
.ticker div { width:max-content; display:flex; align-items:center; gap:36px; animation:marquee 22s linear infinite; color:#f0e7f5; font-size:12px; font-weight:600; letter-spacing:.18em; }
.ticker b { color:var(--pink); font-size:18px; }

.section { width:min(1180px,calc(100% - 64px)); margin:0 auto; padding:150px 0; }
.section-heading { display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:70px; }
.section-heading .eyebrow { align-self:flex-start; margin-top:10px; }
.section h2,.final-cta h2 { font-size:clamp(60px,7vw,106px); }
.steps { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; align-items:start; }
.step-card { min-width:0; }
.step-card.offset { margin-top:90px; }
.step-media { position:relative; height:390px; overflow:hidden; border-radius:24px; border:1px solid var(--line); background:#160c1c; }
.step-media.tall { height:480px; }
.step-media img { height:100%; object-fit:cover; transition:transform .7s ease; }
.step-card:hover img { transform:scale(1.04); }
.step-copy { display:flex; gap:18px; padding:24px 6px; }
.step-copy>span { color:var(--pink); font-size:11px; letter-spacing:.15em; }
.step-copy h3 { margin:0 0 8px; font-size:20px; }
.step-copy p { margin:0; color:var(--muted); line-height:1.6; font-size:14px; }

.tone-lab { display:grid; grid-template-columns:.9fr 1.1fr; gap:0; align-items:stretch; padding-top:60px; }
.tone-image { min-height:740px; border-radius:30px 0 0 30px; overflow:hidden; }
.tone-image img { height:100%; object-fit:cover; }
.tone-panel { padding:70px; border:1px solid var(--line); border-left:0; border-radius:0 30px 30px 0; background:radial-gradient(circle at 90% 5%,rgba(164,57,238,.17),transparent 35%),#100b15; }
.tone-panel h2 { font-size:clamp(56px,5.8vw,86px); }
.tone-toggle { width:max-content; display:flex; gap:5px; margin:35px 0 22px; padding:5px; border:1px solid var(--line); border-radius:12px; background:#09060d; }
.tone-toggle button { border:0; padding:11px 18px; border-radius:8px; background:transparent; color:#897a93; cursor:pointer; }
.tone-toggle button.active { color:#160b19; background:#f7b3e5; }
.result-card { padding:28px; border:1px solid rgba(255,128,222,.24); border-radius:20px; background:linear-gradient(145deg,rgba(138,92,255,.13),rgba(255,79,216,.06)); min-height:304px; }
.result-top { display:flex; justify-content:space-between; color:#9985a7; font-size:9px; letter-spacing:.16em; }
.result-label { margin:27px 0 9px; color:var(--pink); font-size:10px; letter-spacing:.16em; }
.result-card h3 { margin:0 0 12px; font-family:"Italiana"; font-size:36px; font-weight:400; }
.result-card>p:not(.result-label) { margin:0; color:#b8a9c3; line-height:1.6; }
.metrics { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:28px; }
.metrics div { padding:13px; border-radius:10px; background:rgba(255,255,255,.04); }
.metrics span { display:block; color:#76677f; font-size:8px; letter-spacing:.09em; }
.metrics strong { display:block; margin-top:4px; font-family:"Italiana"; font-size:25px; font-weight:400; }

.section-heading.centered { display:block; text-align:center; }
.section-heading.centered .eyebrow { justify-content:center; }
.feature-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.feature-card { min-height:340px; padding:30px; border:1px solid var(--line); border-radius:22px; background:linear-gradient(145deg,rgba(255,255,255,.035),rgba(255,255,255,.008)); transition:.3s ease; }
.feature-card:hover { transform:translateY(-8px); border-color:rgba(255,103,216,.4); background:linear-gradient(145deg,rgba(158,75,255,.12),rgba(255,79,216,.04)); }
.feature-card>span { color:#6f6178; font-size:10px; letter-spacing:.15em; }
.feature-icon { width:62px; height:62px; margin:50px 0 30px; display:grid; place-items:center; border-radius:50%; color:#ff9ee3; background:radial-gradient(circle,#79246b,#2a112f 65%); box-shadow:0 0 45px rgba(255,65,201,.14); }
.feature-card h3 { margin:0 0 12px; font-size:24px; }
.feature-card p { margin:0; color:var(--muted); font-size:14px; line-height:1.65; }

.occasion { width:100%; max-width:none; display:grid; grid-template-columns:1.15fr .85fr; padding:0; background:#100a15; }
.occasion-image { max-height:790px; overflow:hidden; }
.occasion-image img { height:100%; object-fit:cover; object-position:center 42%; }
.occasion-copy { padding:clamp(60px,8vw,130px); align-self:center; }
.occasion-copy h2 { font-size:clamp(60px,6.7vw,100px); }
.occasion-copy>p:not(.eyebrow) { max-width:590px; margin:30px 0; color:var(--muted); line-height:1.7; }
.occasion-tags { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:38px; }
.occasion-tags span { padding:9px 11px; border:1px solid var(--line); border-radius:30px; color:#ab9ab5; font-size:9px; letter-spacing:.12em; }
.occasion-copy>a { display:inline-flex; align-items:center; gap:20px; padding-bottom:8px; border-bottom:1px solid var(--pink); }
.occasion-copy>a span { color:var(--pink); }

.faq { display:grid; grid-template-columns:.8fr 1.2fr; gap:90px; }
.faq .section-heading { display:block; margin:0; }
.faq-list details { border-top:1px solid var(--line); }
.faq-list details:last-child { border-bottom:1px solid var(--line); }
.faq-list summary { list-style:none; padding:26px 4px; display:flex; justify-content:space-between; align-items:center; cursor:pointer; font-size:18px; }
.faq-list summary::-webkit-details-marker { display:none; }
.faq-list summary span { color:var(--pink); font-size:25px; font-weight:300; transition:.2s; }
.faq-list details[open] summary span { transform:rotate(45deg); }
.faq-list details p { margin:0; padding:0 45px 28px 4px; color:var(--muted); line-height:1.7; }

.final-cta { position:relative; padding:150px 32px; overflow:hidden; display:flex; flex-direction:column; align-items:center; text-align:center; border-top:1px solid var(--line); background:radial-gradient(circle at 50% 75%,rgba(165,55,244,.22),transparent 38%); }
.final-cta:before { content:""; position:absolute; width:620px; height:620px; border:1px solid rgba(255,255,255,.07); border-radius:50%; bottom:-360px; }
.cta-orb { position:relative; width:100px; margin-bottom:28px; }
.cta-orb img { border-radius:24px; box-shadow:0 0 55px rgba(116,74,255,.35); }
.final-cta .eyebrow { justify-content:center; }
.final-cta>p:not(.eyebrow) { max-width:560px; color:var(--muted); line-height:1.7; margin:28px 0; }
.final-cta .button { z-index:1; }
footer { width:min(1180px,calc(100% - 64px)); margin:0 auto; padding:36px 0; display:grid; grid-template-columns:1fr 1fr auto; gap:20px; align-items:center; border-top:1px solid var(--line); color:#8e8197; font-size:12px; }
footer>p { text-align:center; }
footer>div { display:flex; gap:20px; justify-content:flex-end; }
footer .brand { color:#fff; }
footer small { grid-column:1/-1; text-align:center; color:#5e5265; }

/* Legal pages */
.legal-body { background:radial-gradient(circle at 50% 0,rgba(138,92,255,.11),transparent 32%),var(--bg); }
.policy-page { min-height:100vh; padding:150px 0 100px; }
.policy-hero { width:min(1180px,calc(100% - 64px)); margin:0 auto 70px; padding:70px; border:1px solid var(--line); border-radius:30px; background:radial-gradient(circle at 92% 8%,rgba(255,79,216,.16),transparent 35%),linear-gradient(145deg,rgba(255,255,255,.04),rgba(255,255,255,.01)); }
.policy-hero .eyebrow { color:var(--pink); }
.policy-hero h1 { font-size:clamp(64px,8vw,118px); }
.policy-hero>p { max-width:760px; margin:28px 0 36px; color:var(--muted); font-size:17px; line-height:1.75; }
.policy-meta { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin:0; }
.policy-meta div { padding:17px 18px; border:1px solid var(--line); border-radius:13px; background:rgba(255,255,255,.025); }
.policy-meta dt { margin-bottom:6px; color:#806f8c; font-size:9px; font-weight:700; letter-spacing:.15em; text-transform:uppercase; }
.policy-meta dd { margin:0; color:#eee3f5; font-size:14px; }
.policy-meta a,.policy-content a { color:#ff85de; text-decoration:underline; text-decoration-color:rgba(255,133,222,.35); text-underline-offset:4px; }
.policy-layout { width:min(1180px,calc(100% - 64px)); margin:0 auto; display:grid; grid-template-columns:270px minmax(0,1fr); gap:34px; align-items:start; }
.policy-toc { position:sticky; top:110px; padding:24px; border:1px solid var(--line); border-radius:20px; background:rgba(17,12,24,.78); backdrop-filter:blur(18px); }
.policy-toc-head { padding-bottom:18px; border-bottom:1px solid var(--line); }
.policy-kicker { display:block; margin-bottom:6px; color:var(--pink); font-size:9px; font-weight:700; letter-spacing:.15em; text-transform:uppercase; }
.policy-toc-head strong { font-family:"Italiana",Georgia,serif; font-size:25px; font-weight:400; }
.policy-toc-links { display:flex; flex-direction:column; padding-top:12px; }
.policy-toc-links a { position:relative; padding:8px 0 8px 31px; color:#95869f; font-size:12px; line-height:1.3; transition:.2s ease; }
.policy-toc-links a:before { content:attr(data-index); position:absolute; left:0; color:#594b63; font-size:9px; }
.policy-toc-links a:hover { color:#fff; transform:translateX(3px); }
.policy-content { min-width:0; }
.policy-content article { scroll-margin-top:110px; margin-bottom:16px; padding:36px 40px; border:1px solid var(--line); border-radius:20px; background:linear-gradient(145deg,rgba(255,255,255,.035),rgba(255,255,255,.012)); }
.policy-content h2 { margin:0 0 20px; font-family:"DM Sans",sans-serif; font-size:24px; line-height:1.25; letter-spacing:-.025em; }
.policy-content p,.policy-content li { color:var(--muted); font-size:14px; line-height:1.8; }
.policy-content p { margin:0 0 17px; }
.policy-content p:last-child { margin-bottom:0; }
.policy-content ul { margin:14px 0 20px; padding-left:20px; }
.policy-content li { margin:7px 0; padding-left:5px; }
.policy-content strong { color:#f0e5f6; }
.policy-table { margin:25px 0; overflow:hidden; border:1px solid var(--line); border-radius:14px; }
.policy-table [role="row"] { display:grid; grid-template-columns:.85fr 1.45fr 1.45fr; }
.policy-table [role="row"]>* { min-width:0; padding:15px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); color:#aa9ab5; font-size:12px; line-height:1.55; overflow-wrap:anywhere; }
.policy-table [role="row"]>*:last-child { border-right:0; }
.policy-table [role="row"]:last-child>* { border-bottom:0; }
.policy-table [role="row"]:first-child { background:rgba(255,79,216,.08); }
.policy-table [role="row"]:first-child>* { color:#f2e8f7; font-size:10px; letter-spacing:.08em; text-transform:uppercase; }

[data-reveal] { opacity:0; transform:translateY(30px); transition:opacity .75s ease,transform .75s ease; }
[data-reveal][data-visible="true"] { opacity:1; transform:none; }
@keyframes spin { to { transform:rotate(360deg); } }
@keyframes pulse { 50% { opacity:.45; transform:scale(.8); } }
@keyframes marquee { to { transform:translateX(-50%); } }

@media (max-width: 1000px) {
  .hero { grid-template-columns:1fr; padding-top:150px; text-align:center; }
  .hero-copy { margin:auto; }
  .hero .eyebrow,.hero-actions,.social-proof { justify-content:center; }
  .hero-intro { margin-left:auto; margin-right:auto; }
  .hero-visual { height:650px; }
  .steps { gap:14px; }
  .step-media,.step-media.tall { height:390px; }
  .tone-panel { padding:44px; }
  .occasion { grid-template-columns:1fr; }
  .occasion-image { max-height:690px; }
  .occasion-copy { text-align:center; }
  .occasion-copy .eyebrow,.occasion-tags { justify-content:center; }
  .occasion-copy>p:not(.eyebrow) { margin-left:auto; margin-right:auto; }
  .policy-layout { grid-template-columns:1fr; }
  .policy-toc { position:static; }
  .policy-toc-links { display:grid; grid-template-columns:repeat(2,1fr); gap:2px 20px; }
}

@media (max-width: 760px) {
  .site-header { top:10px; width:calc(100% - 20px); }
  .menu-button { display:block; }
  .nav-links { position:absolute; left:0; right:0; top:76px; padding:18px; display:none; flex-direction:column; align-items:stretch; gap:4px; border:1px solid var(--line); border-radius:16px; background:rgba(10,6,15,.97); }
  .nav-links.open { display:flex; }
  .nav-links a { padding:12px; }
  .hero { min-height:0; padding:130px 22px 80px; gap:35px; }
  h1 { font-size:clamp(60px,18vw,86px); }
  .hero-intro { font-size:16px; }
  .hero-visual { height:530px; }
  .phone-shell { width:248px; height:496px; border-radius:42px; }
  .phone-shell video { border-radius:34px; }
  .orbit-one { width:410px; height:410px; }
  .orbit-two { width:340px; height:340px; }
  .float-card-top { right:0; top:75px; }
  .float-card-bottom { left:0; bottom:50px; max-width:170px; }
  .section { width:calc(100% - 36px); padding:100px 0; }
  .section-heading { display:block; margin-bottom:45px; }
  .section h2,.final-cta h2 { font-size:clamp(54px,16vw,78px); }
  .steps,.feature-grid { grid-template-columns:1fr; }
  .step-card.offset { margin-top:0; }
  .step-media,.step-media.tall { height:460px; }
  .tone-lab { grid-template-columns:1fr; }
  .tone-image { min-height:520px; border-radius:24px 24px 0 0; }
  .tone-panel { padding:34px 20px; border-left:1px solid var(--line); border-top:0; border-radius:0 0 24px 24px; }
  .tone-panel h2 { font-size:55px; }
  .result-card { padding:22px 17px; }
  .result-card h3 { font-size:28px; }
  .metrics div { padding:10px 7px; }
  .occasion-image { height:560px; }
  .occasion-copy { padding:70px 22px; }
  .faq { grid-template-columns:1fr; gap:50px; }
  .final-cta { padding:100px 22px; }
  footer { width:calc(100% - 36px); grid-template-columns:1fr; text-align:center; }
  footer .brand,footer>div { justify-content:center; }
  footer>p { margin:0; }
  .ticker div { animation-duration:16s; }
  .policy-page { padding:110px 0 70px; }
  .policy-hero,.policy-layout { width:calc(100% - 28px); }
  .policy-hero { margin-bottom:24px; padding:40px 22px; border-radius:22px; }
  .policy-hero h1 { font-size:clamp(52px,16vw,76px); }
  .policy-hero>p { font-size:15px; }
  .policy-meta { grid-template-columns:1fr; }
  .policy-toc { display:block !important; visibility:visible !important; opacity:1 !important; width:100%; padding:20px; overflow:hidden; border-color:rgba(255,79,216,.3); background:linear-gradient(145deg,rgba(255,79,216,.08),rgba(138,92,255,.06)),#110c18; }
  .policy-toc-head { display:flex; align-items:flex-end; justify-content:space-between; gap:16px; padding-bottom:15px; }
  .policy-toc-head .policy-kicker { margin:0; }
  .policy-toc-head strong { display:block; color:#f7edf9; font-size:22px; }
  .policy-toc-links { display:flex !important; grid-template-columns:none; flex-direction:row; gap:9px; padding:14px 0 4px; overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x proximity; scrollbar-width:thin; scrollbar-color:rgba(255,79,216,.45) transparent; }
  .policy-toc-links a { flex:0 0 auto; min-width:max-content; padding:11px 14px 11px 38px; border:1px solid var(--line); border-radius:10px; background:rgba(255,255,255,.035); color:#d8c9e4; scroll-snap-align:start; }
  .policy-toc-links a:before { left:13px; top:13px; color:var(--pink); }
  .policy-content article { padding:27px 20px; border-radius:16px; }
  .policy-content h2 { font-size:21px; }
  .policy-table { overflow-x:auto; }
  .policy-table [role="row"] { min-width:680px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *,*:before,*:after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
  [data-reveal] { opacity:1; transform:none; }
}
