/* Bondivo — site styles. Night is where a feeling waits; paper is where it gets said. */
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/cormorant-garamond-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Cormorant Garamond";font-style:italic;font-weight:400;font-display:swap;src:url(fonts/cormorant-garamond-latin-400-italic.woff2) format("woff2")}
@font-face{font-family:"Cormorant Garamond";font-style:italic;font-weight:500;font-display:swap;src:url(fonts/cormorant-garamond-latin-500-italic.woff2) format("woff2")}
@font-face{font-family:"Cormorant Garamond";font-style:italic;font-weight:600;font-display:swap;src:url(fonts/cormorant-garamond-latin-600-italic.woff2) format("woff2")}
@font-face{font-family:"DM Sans";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/dm-sans-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"DM Sans";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/dm-sans-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"DM Sans";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/dm-sans-latin-600-normal.woff2) format("woff2")}

:root{
  --paper:#FCFAF7; --paper-deep:#F6F0F7; --ink:#2A1B3D; --ink-soft:#655971; --hairline:#EFE6F7;
  --purple:#7B2FF7; --purple-deep:#6329BF; --blue:#2E8BFF; --coral:#FF6A3D; --coral-deep:#C8431B;
  --dusk:#1E1530; --dusk-soft:#2B194C; --lavender:#CBADF7; --logo-night:#B58AF7; --window:#FFC978;
  --serif:"Cormorant Garamond","Iowan Old Style",Georgia,serif;
  --sans:"DM Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --ease:cubic-bezier(.22,.61,.36,1);
  --gut:max(20px,env(safe-area-inset-left,0px));
  --gut-r:max(20px,env(safe-area-inset-right,0px));
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
html,body{height:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:400 1rem/1.55 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
body.night{background:var(--dusk);color:var(--paper)}
img,video{max-width:100%}
button,input,textarea{font:inherit;color:inherit}
a{color:var(--purple-deep)}
[hidden]{display:none!important}
:focus-visible{outline:2px solid var(--purple);outline-offset:3px;border-radius:10px}
.night :focus-visible{outline-color:var(--window)}
.defs{position:absolute;width:0;height:0;overflow:hidden}
.wrap{max-width:1080px;margin:0 auto;padding-left:var(--gut);padding-right:var(--gut-r)}
.narrow{max-width:760px}

/* logo */
.logo{display:inline-flex;align-items:flex-start;font:italic 500 1.8rem/1 var(--serif);letter-spacing:-.02em;color:var(--purple);text-decoration:none;white-space:nowrap}
.night .logo,.logo.on-night{color:var(--logo-night)}
.mark{overflow:visible;flex:none}
.logo .mark{width:.95em;height:.556em;margin-left:-.075em;margin-top:-.03em}
.arc{transform-box:fill-box;transform-origin:42% 56%}

/* header */
.head{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:64px}
.nav{display:flex;align-items:center;gap:4px}
.nav a,.linkish{display:inline-flex;align-items:center;min-height:44px;padding:0 10px;white-space:nowrap;font:500 .92rem var(--sans);color:var(--ink-soft);text-decoration:none;background:none;border:0;cursor:pointer}
.nav a:hover,.linkish:hover{color:var(--ink)}
.night .nav a,.night .linkish{color:var(--lavender)}
.lang{display:flex}
.lang button{background:none;border:0;cursor:pointer;min-height:44px;padding:0 9px;font:500 .88rem var(--sans);color:inherit;opacity:.6}
.lang button[aria-pressed="true"]{opacity:1;color:var(--purple-deep);background:linear-gradient(var(--coral),var(--coral)) no-repeat 50% calc(100% - 9px)/18px 2px}
.night .lang button[aria-pressed="true"]{color:var(--paper)}
@media (max-width:520px){.nav .hide-s{display:none}}

/* type */
.voice{font:500 clamp(1.9rem,1.4rem + 2.4vw,3rem)/1.1 var(--serif);letter-spacing:-.01em;margin:0;text-wrap:balance}
.asks{font:italic 500 clamp(1.45rem,1.2rem + 1.2vw,1.9rem)/1.2 var(--serif);margin:0;text-wrap:balance}
.lead{font-size:clamp(1.04rem,1rem + .3vw,1.2rem);color:var(--ink-soft);margin:0;max-width:36rem;text-wrap:pretty}
.small{font-size:.88rem;color:var(--ink-soft)}
.night .small{color:var(--lavender)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 28px;border-radius:999px;border:0;cursor:pointer;text-decoration:none;
  background:var(--purple);color:#fff;font:600 1.02rem var(--sans);box-shadow:0 14px 30px -14px rgba(123,47,247,.8);transition:background 200ms,transform 200ms var(--ease),opacity 200ms}
.btn:hover{background:var(--purple-deep)}.btn:active{transform:scale(.97)}
.btn[disabled]{opacity:.45;cursor:default;box-shadow:none}
.btn .mark{width:32px;height:19px}.btn .arc-blue{fill:#FCFAF7}.btn .arc-purple{fill:#CBADF7}
.btn.soft{background:transparent;color:var(--purple-deep);box-shadow:inset 0 0 0 1.5px var(--purple-deep)}
.btn.soft:hover{background:rgba(123,47,247,.06)}
.btn.coral{background:transparent;color:var(--coral-deep);box-shadow:inset 0 0 0 1.5px var(--coral)}
.btn.danger{background:var(--coral-deep);box-shadow:none}
.night .btn.soft{color:var(--paper);box-shadow:inset 0 0 0 1.5px var(--lavender)}
.chip{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border-radius:999px;border:1.5px solid var(--hairline);background:var(--paper);cursor:pointer;font:500 .93rem var(--sans);color:var(--ink);text-decoration:none;transition:border-color 200ms,background 200ms}
.chip:hover{border-color:var(--purple);background:#fff}
.speech{display:block;width:150px;height:14px;fill:none;stroke:var(--coral);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}

/* ---------- welcome (night → dawn) ---------- */
canvas.sky{position:fixed;inset:0;width:100%;height:100%;display:block}
.scene{position:relative;z-index:1;min-height:100%;display:grid;grid-template-rows:auto 1fr auto;padding-left:var(--gut);padding-right:var(--gut-r);padding-top:env(safe-area-inset-top,0px)}
.t{transition:color 900ms var(--ease),opacity 600ms var(--ease);color:var(--lavender)}
.t.day{color:var(--ink-soft)}
.t.day .lang button[aria-pressed="true"]{color:var(--purple-deep)}
.mid{display:grid;justify-items:center;align-content:center;gap:clamp(14px,2.6vh,26px);text-align:center;padding-block:clamp(8px,3vh,40px);min-width:0}
.logo.hero{font-size:clamp(3.4rem,2rem + 9vw,7rem);transition:color 900ms var(--ease);margin:0}
.logo.hero.day{color:var(--purple)}
.say{font:italic 500 clamp(1.5rem,1.1rem + 2vw,2.3rem)/1.15 var(--serif);margin:0;max-width:18ch;text-wrap:balance;color:var(--paper);transition:color 900ms var(--ease)}
.say.day{color:var(--ink)}
.sheet{width:min(100%,600px);background:#fff;color:var(--ink);border-radius:26px;padding:18px 18px 10px;text-align:left;
  box-shadow:0 0 0 1px rgba(255,255,255,.5),0 0 60px 6px rgba(255,201,120,.28),0 30px 60px -30px rgba(0,0,0,.6);transition:box-shadow 900ms var(--ease)}
.sheet.day{box-shadow:0 0 0 1.5px var(--hairline),0 26px 60px -34px rgba(42,27,61,.45)}
.sheet textarea{display:block;width:100%;min-height:clamp(84px,14vh,128px);border:0;outline:0;resize:none;background:transparent;font:400 1.08rem/1.55 var(--sans);padding:0}
.sheet textarea::placeholder{font:italic 500 1.5rem/1.3 var(--serif);color:#8C819A}
.sheet-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:52px;padding-top:6px}
.coach{font:italic 500 1.16rem/1.25 var(--serif);color:var(--purple-deep);margin:0;transition:opacity 300ms}
.three{flex:none;width:48px;height:28px}
.three .arc{opacity:.16;transition:opacity 900ms var(--ease)}
.three .arc.on{opacity:1;animation:pop 700ms var(--ease)}
@keyframes pop{0%{transform:scale(.7)}60%{transform:scale(1.12)}100%{transform:scale(1)}}
.go{display:grid;justify-items:center;gap:8px}
.foot-line{text-align:center;padding-block:10px calc(14px + env(safe-area-inset-bottom,0px));display:grid;gap:4px;justify-items:center}
.foot-line .light-line{font:italic 500 1.08rem/1.3 var(--serif);color:#F4E6CC;transition:color 900ms var(--ease)}
.foot-line.day .light-line{color:var(--ink-soft)}
.foot-links{display:flex;flex-wrap:wrap;justify-content:center;gap:0 6px}
.foot-links a{display:inline-flex;align-items:center;min-height:40px;padding:0 8px;font:500 .84rem var(--sans);color:inherit;text-decoration:none;opacity:.85}
.intro .logo.hero{animation:appear 1600ms var(--ease) 500ms backwards}
.intro .say{animation:rise 1000ms var(--ease) 1700ms backwards}
.intro .sheet{animation:rise 1000ms var(--ease) 2200ms backwards}
.intro .go,.intro .foot-line,.intro .top{animation:appear 1200ms var(--ease) 2900ms backwards}
@keyframes appear{from{opacity:0}}
@keyframes rise{from{opacity:0;transform:translateY(16px)}}
.scene.sent .mid>*,.scene.sent .foot-line,.scene.sent .top{opacity:0;transition:opacity 600ms var(--ease);pointer-events:none}

/* ---------- create: the conversation ---------- */
.chat-page{display:grid;grid-template-rows:auto 1fr auto;min-height:100%}
.chat-head{position:sticky;top:0;z-index:5;background:rgba(252,250,247,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--hairline);padding-top:env(safe-area-inset-top,0px)}
.thread{display:flex;flex-direction:column;gap:18px;padding-block:22px 28px;width:100%}
.msg{max-width:min(100%,560px);display:grid;gap:8px;animation:rise 500ms var(--ease) backwards}
.msg.bv{align-self:flex-start}
.msg.me{align-self:flex-end;background:var(--hairline);border-radius:22px 22px 6px 22px;padding:12px 16px;white-space:pre-wrap;overflow-wrap:anywhere}
.msg.bv p{margin:0;color:var(--ink-soft)}
.msg.bv .asks{color:var(--ink)}
.msg .row{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:4px}
.field{width:100%;min-height:52px;border-radius:999px;border:1.5px solid var(--hairline);background:#fff;padding:0 20px;font-size:1.02rem;outline:0}
.field:focus{border-color:var(--purple)}
.code{display:flex;gap:8px}
.code input{width:46px;height:56px;border-radius:14px;border:1.5px solid var(--hairline);background:#fff;text-align:center;font:500 1.4rem var(--sans);outline:0}
.code input:focus{border-color:var(--purple)}
.thumbs{display:flex;flex-wrap:wrap;gap:8px}
.thumbs img{width:72px;height:72px;object-fit:cover;border-radius:12px}
.note{font-size:.86rem;color:var(--ink-soft)}
.title-song{font:italic 500 clamp(1.6rem,1.3rem + 1.4vw,2.1rem)/1.15 var(--serif);color:var(--purple-deep);margin:0}
.plans{display:grid;gap:10px;width:min(100%,460px)}
.plan{display:flex;align-items:center;justify-content:space-between;gap:14px;text-align:left;border-radius:18px;border:1.5px solid var(--hairline);background:#fff;padding:14px 18px;cursor:pointer}
.plan.best{border-color:var(--purple)}
.plan b{display:block;font:600 1.02rem var(--sans)}
.plan .price{font:500 1.6rem var(--serif);white-space:nowrap}
.pulse{position:relative;width:120px;height:120px;display:grid;place-items:center}
.pulse .mark{width:70px;height:41px;position:relative;z-index:1}
.pulse i{position:absolute;inset:30px;border-radius:50%;border:1.5px solid;opacity:0;animation:out 3.6s linear infinite}
.pulse i:nth-child(1){border-color:var(--purple)}.pulse i:nth-child(2){border-color:var(--blue);animation-delay:1.2s}.pulse i:nth-child(3){border-color:var(--coral);animation-delay:2.4s}
@keyframes out{0%{opacity:0;transform:scale(.7)}15%{opacity:.6}100%{opacity:0;transform:scale(2.4)}}
.cloud{background:#fff;border-radius:22px;padding:18px 20px;box-shadow:0 20px 44px -30px rgba(42,27,61,.4),inset 0 0 0 1.5px var(--hairline);display:grid;gap:6px}
.cloud .glow{width:14px;height:14px;border-radius:50%;background:var(--window);box-shadow:0 0 0 6px rgba(255,201,120,.3),0 0 18px 4px rgba(255,201,120,.8);animation:breathe 3s ease-in-out infinite}
@keyframes breathe{50%{box-shadow:0 0 0 9px rgba(255,201,120,.18),0 0 26px 8px rgba(255,201,120,.6)}}
.composer{position:sticky;bottom:0;z-index:5;background:linear-gradient(rgba(252,250,247,0),var(--paper) 26%);padding-block:14px calc(12px + env(safe-area-inset-bottom,0px))}
.composer .bar{display:flex;align-items:flex-end;gap:8px;background:#fff;border-radius:28px;padding:8px 8px 8px 18px;box-shadow:0 14px 40px -22px rgba(42,27,61,.5),inset 0 0 0 1.5px var(--hairline)}
.composer textarea{flex:1;min-width:0;border:0;outline:0;resize:none;background:transparent;font-size:1.05rem;line-height:1.5;padding:9px 0;max-height:40vh}
.round{flex:none;width:44px;height:44px;border-radius:50%;border:0;cursor:pointer;display:grid;place-items:center;background:var(--purple);color:#fff}
.round.ghost{background:transparent;color:var(--ink-soft)}
.round svg{width:22px;height:22px}
.round[disabled]{opacity:.4}
.left-line{text-align:center;margin:8px 0 0}

/* full-screen moments */
.stage{position:fixed;inset:0;z-index:30;background:radial-gradient(ellipse at 50% 115%,#2B194C 0%,#1E1530 62%);color:var(--paper);display:grid;animation:appear 600ms var(--ease)}
.stage canvas{position:absolute;inset:0;width:100%;height:100%}
.stage .cap{position:relative;z-index:1;align-self:end;justify-self:center;text-align:center;padding:0 24px calc(18vh + env(safe-area-inset-bottom,0px));display:grid;gap:8px;max-width:34rem}
.stage .cap .big{font:500 clamp(1.7rem,1.3rem + 2.4vw,2.6rem)/1.15 var(--serif);margin:0;text-wrap:balance}
.stage .cap .it{font:italic 500 clamp(1.2rem,1rem + 1vw,1.5rem)/1.3 var(--serif);color:#F4E6CC;margin:0;min-height:1.4em;transition:opacity 500ms}
.stage .receipt{font:500 .95rem var(--sans);color:var(--window);font-variant-numeric:tabular-nums;margin:0;min-height:1.4em;transition:opacity 500ms}
.stage .skip{position:absolute;z-index:2;right:max(16px,env(safe-area-inset-right,0px));top:calc(12px + env(safe-area-inset-top,0px))}
.ready{place-items:center;align-content:center;gap:14px;padding:calc(20px + env(safe-area-inset-top,0px)) var(--gut-r) calc(20px + env(safe-area-inset-bottom,0px)) var(--gut);overflow:auto;text-align:center}
.ready .player{position:relative;height:min(62vh,640px);aspect-ratio:9/16;max-width:100%;border-radius:18px;overflow:hidden;background:#000;box-shadow:0 0 0 1px rgba(255,255,255,.08),0 40px 80px -30px #000}
.ready video{width:100%;height:100%;object-fit:contain;display:block;background:#000}
.ready .ring{position:absolute;left:50%;top:42%;width:40vmin;height:40vmin;margin:-20vmin;border-radius:50%;border:2px solid var(--coral);opacity:0;animation:open 1600ms var(--ease) 200ms}
@keyframes open{0%{opacity:.8;transform:scale(.2)}100%{opacity:0;transform:scale(3.4)}}
.ready .acts{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.ready .linkish{color:var(--lavender)}
.ready .x{position:absolute;right:max(12px,env(safe-area-inset-right,0px));top:calc(10px + env(safe-area-inset-top,0px))}

/* ---------- gallery / pricing / legal ---------- */
.page{padding-block:18px 72px}
.cards{display:grid;gap:18px;margin-top:26px}
@media (min-width:700px){.cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1000px){.cards.three-up{grid-template-columns:repeat(3,minmax(0,1fr));align-items:end}}
.card{background:#fff;border-radius:20px;overflow:hidden;box-shadow:0 22px 50px -36px rgba(42,27,61,.5),inset 0 0 0 1.5px var(--hairline);display:grid}
.card .poster{position:relative;aspect-ratio:16/10;background:radial-gradient(ellipse at 50% 120%,#2B194C,#1E1530 70%);display:grid;place-items:center;cursor:pointer;border:0;width:100%;color:#fff}
.card .poster .play{width:58px;height:58px;border-radius:50%;background:rgba(255,255,255,.14);display:grid;place-items:center;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.5)}
.card .body{padding:16px 18px 14px;display:grid;gap:10px}
.card h3{font:italic 500 1.5rem/1.15 var(--serif);margin:0}
.card .row{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:center}
.card .del{color:var(--coral-deep)}
.price-card{padding:24px 22px;display:grid;gap:10px;align-content:start}
.price-card .p{font:500 2.6rem/1 var(--serif)}
.price-card.best{box-shadow:0 26px 60px -36px rgba(123,47,247,.7),inset 0 0 0 2px var(--purple)}
.badge{justify-self:start;font:600 .72rem var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--purple-deep);background:var(--hairline);border-radius:999px;padding:5px 10px}
.give{color:var(--ink-soft);font-size:.95rem}
.sheet-modal{position:fixed;inset:0;z-index:40;background:rgba(30,21,48,.55);display:grid;align-items:end;justify-items:center;animation:appear 250ms}
.sheet-modal .inner{background:var(--paper);border-radius:24px 24px 0 0;padding:24px var(--gut-r) calc(24px + env(safe-area-inset-bottom,0px)) var(--gut);width:min(100%,520px);display:grid;gap:12px}
@media (min-width:700px){.sheet-modal{align-items:center}.sheet-modal .inner{border-radius:24px;padding:28px}}
.legal h2{font:500 1.5rem var(--serif);margin:34px 0 8px}.legal p,.legal ul{max-width:38rem;margin:0 0 12px}.legal ul{padding-left:20px}
.plain{list-style:none;padding:0!important;margin:20px 0 34px!important;display:grid;gap:10px}
.plain li{background:#fff;border-radius:16px;padding:14px 18px;box-shadow:inset 0 0 0 1.5px var(--hairline)}
.plain-h{font:italic 500 1.5rem var(--serif);margin:26px 0 0}
.site-foot{border-top:1px solid var(--hairline);padding-block:22px calc(28px + env(safe-area-inset-bottom,0px));display:flex;flex-wrap:wrap;gap:6px 18px;align-items:center;justify-content:space-between}
.site-foot nav{display:flex;flex-wrap:wrap;gap:0 4px}
.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:60;background:var(--ink);color:#fff;border-radius:999px;padding:12px 20px;font-size:.95rem;animation:rise 300ms var(--ease)}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

/* on the dark stages */
.stage .small{color:var(--lavender)}
.stage .btn.soft{color:#fff;box-shadow:inset 0 0 0 1.5px var(--lavender)}
.stage .btn.soft:hover{background:rgba(255,255,255,.08)}
/* gallery poster = the video's own cream opening card */
.card .poster{background:#F6EFE3;color:var(--ink);padding:18px;align-content:center;justify-items:center;gap:10px;text-align:center}
.card .poster .pt{font:italic 500 1.5rem/1.15 var(--serif);color:var(--purple-deep);text-wrap:balance}
.card .poster .pto{font:500 .78rem var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft)}
.card .poster .play{background:var(--purple);color:#fff;box-shadow:0 12px 26px -12px rgba(123,47,247,.8)}
/* coming soon (preview gate) */
.soon{min-height:100%;display:grid;place-content:center;justify-items:center;gap:14px;text-align:center;padding:24px}
.soon .logo{font-size:clamp(3rem,2rem + 8vw,6rem)}
@media (max-width:420px){.chat-head .nav a{padding:0 6px;font-size:.86rem}.chat-head .logo{font-size:1.5rem}}

/* ---------- header (every page) ---------- */
.site-head{position:sticky;top:0;z-index:20;background:var(--paper);border-bottom:1px solid var(--hairline);padding-top:env(safe-area-inset-top,0px)}
.site-head .head{min-height:60px}
.site-head.on-night{background:var(--dusk);border-color:rgba(203,173,247,.14)}
.site-head .nav a[aria-current="page"]{color:var(--ink);box-shadow:inset 0 -2px 0 -0px var(--coral)}
.site-head.on-night .nav a{color:var(--lavender)}.site-head.on-night .nav a:hover{color:#fff}
.site-head.on-night .lang button[aria-pressed="true"]{color:#fff}
.small-btn{min-height:40px;padding:0 18px;font-size:.92rem;box-shadow:none;margin-left:6px}
.nav.phone{display:none}
@media (max-width:760px){.nav.desk{display:none}.nav.phone{display:flex}}
.menu-btn{font-weight:600}
.on-night .menu-btn{color:#fff}
.menu-sheet{border-top:1px solid var(--hairline);background:inherit;animation:appear 200ms var(--ease)}
.menu-sheet nav{display:grid;gap:2px;padding-block:8px 18px}
.menu-sheet a:not(.btn){display:flex;align-items:center;min-height:48px;font:500 1.05rem var(--sans);color:inherit;text-decoration:none;border-bottom:1px solid var(--hairline)}
.on-night .menu-sheet a:not(.btn){color:#fff;border-color:rgba(203,173,247,.14)}
.menu-sheet .btn{margin-top:12px}
.site-head .logo{font-size:1.65rem}
.home .site-head .logo{opacity:0;pointer-events:none;transition:opacity 400ms}
.home.scrolled .site-head .logo{opacity:1;pointer-events:auto}

/* ---------- footer ---------- */
.site-foot{border-top:1px solid var(--hairline);background:var(--paper);color:var(--ink);display:block;padding:0}
.foot-in{display:grid;gap:22px;padding-block:44px calc(32px + env(safe-area-inset-bottom,0px))}
@media (min-width:860px){.foot-in{grid-template-columns:1fr auto;align-items:start}.foot-legal{grid-column:1/-1}}
.foot-slogan{font:italic 500 1.15rem var(--serif);color:var(--ink-soft);margin:8px 0 0}
.foot-nav{display:flex;flex-wrap:wrap;gap:0 22px;align-items:center}
.foot-nav a,.foot-nav span{display:inline-flex;align-items:center;min-height:44px;font:500 .94rem var(--sans);color:var(--ink-soft);text-decoration:none}
.foot-nav a:hover{color:var(--ink)}
.foot-legal{margin:0}

/* ---------- home ---------- */
:root{--sec:clamp(64px,8vw,120px);--sec-airy:clamp(80px,10vw,144px)}
.home .scene{min-height:calc(88svh - 60px);grid-template-rows:1fr auto;padding-top:0}
.home .mid{gap:clamp(12px,2.2vh,22px);padding-block:clamp(16px,4vh,48px) 8px}
.hero-sub{font-size:clamp(1.02rem,.95rem + .35vw,1.18rem);color:var(--lavender);margin:0;max-width:30rem;text-wrap:balance;transition:color 900ms var(--ease)}
.hero-sub.day{color:var(--ink-soft)}
.hero-chips{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;max-width:640px}
@media (max-width:640px){.hero-chips{flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start;width:calc(100% + 40px);margin:0 -20px;padding:2px 20px;scrollbar-width:none}.hero-chips::-webkit-scrollbar{display:none}}
.hero-chips .chip{flex:none;min-height:40px;font-size:.88rem;background:rgba(255,255,255,.06);border-color:rgba(203,173,247,.28);color:#F4E6CC;transition:background 200ms,border-color 200ms,color 900ms}
.hero-chips .chip:hover{background:rgba(255,255,255,.14);border-color:var(--lavender)}
.hero-chips .chip.day{background:#fff;border-color:var(--hairline);color:var(--ink)}
.reassure{font-size:.86rem;color:var(--lavender);transition:color 900ms var(--ease)}
.reassure.day{color:var(--ink-soft)}
.peek{display:flex;justify-content:center;padding-bottom:12px}

.home-more{position:relative;z-index:2;background:var(--paper);color:var(--ink);border-radius:28px 28px 0 0;box-shadow:0 -24px 50px -30px rgba(0,0,0,.55);overflow-x:clip}
.home-more .small,.home-more .linkish{color:var(--ink-soft)}
.sec{padding-block:var(--sec)}
.sec + .sec{padding-top:0}
.eyebrow{font:600 .76rem var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--purple-deep);margin:0 0 12px}
.sec-h{font:500 clamp(2rem,1.5rem + 2.2vw,3.1rem)/1.08 var(--serif);letter-spacing:-.01em;margin:0;text-wrap:balance}

/* sample: these words became a song */
.sample{display:grid;gap:32px;align-items:center;margin-top:32px}
@media (min-width:860px){.sample{grid-template-columns:minmax(0,1fr) auto;gap:72px}}
.letter{background:#fff;border-radius:22px;padding:26px 26px 22px;box-shadow:0 30px 60px -40px rgba(42,27,61,.5),inset 0 0 0 1.5px var(--hairline);display:grid;gap:14px;max-width:560px}
.letter .to{font:600 .76rem var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft)}
.letter p{margin:0;font:italic 500 clamp(1.25rem,1.1rem + .6vw,1.5rem)/1.45 var(--serif);color:var(--ink)}
.letter .w{transition:background 600ms var(--ease),color 600ms}
.letter .w.lit{background:linear-gradient(transparent 62%,rgba(255,201,120,.7) 62%);color:var(--purple-deep)}
.sample-note{margin-top:14px;color:var(--ink-soft);font-size:.95rem;max-width:30rem}
.phone-frame{justify-self:center;position:relative;width:min(72vw,300px);aspect-ratio:9/16;border-radius:30px;overflow:hidden;background:#F6EFE3;
  box-shadow:0 0 0 8px #2A1B3D,0 50px 90px -40px rgba(42,27,61,.75)}
.phone-frame .shot{position:absolute;inset:0;background-size:cover;background-position:center;opacity:0;transform:scale(1.06);transition:opacity 1200ms var(--ease)}
.phone-frame .shot.on{opacity:1;animation:kb 7s linear forwards}
@keyframes kb{from{transform:scale(1.06)}to{transform:scale(1.16) translate(-2%,-1%)}}
.phone-frame .cap{position:absolute;left:0;right:0;bottom:7%;text-align:center;padding:0 10%;font:500 1.02rem/1.3 var(--sans);color:#fff;text-shadow:0 1px 10px rgba(0,0,0,.55);transition:opacity 600ms}
.phone-frame .card{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:10px;text-align:center;background:#F6EFE3;transition:opacity 900ms var(--ease);padding:12%}
.phone-frame .card .logo{font-size:1.7rem}
.phone-frame .card .to{font:600 .7rem var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft)}
.phone-frame .card .ti{font:italic 500 1.7rem/1.1 var(--serif);color:var(--purple-deep)}

/* why: three steps */
.why-grid{display:grid;gap:22px;margin-top:32px}
@media (min-width:760px){.why-grid{grid-template-columns:repeat(3,1fr);gap:24px}}
.why-step{display:grid;gap:8px;align-content:start;padding:24px;border-radius:20px;background:var(--paper-deep)}
.why-step .n{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font:500 1.3rem var(--serif);color:#fff;background:var(--purple)}
.why-step b{font:600 1.08rem var(--sans)}
.why-step span{color:var(--ink-soft)}
.research-line{display:flex;gap:14px;align-items:baseline;flex-wrap:wrap;margin-top:28px;color:var(--ink-soft)}
.research-line b{font:italic 500 1.35rem var(--serif);color:var(--ink)}

/* prices, gently */
.price-row{display:grid;gap:14px;margin-top:28px}
@media (min-width:760px){.price-row{grid-template-columns:repeat(3,1fr)}}
.price-mini{display:grid;gap:4px;padding:22px 24px;border-radius:20px;background:#fff;box-shadow:inset 0 0 0 1.5px var(--hairline)}
.price-mini.best{box-shadow:inset 0 0 0 2px var(--purple)}
.price-mini .p{font:500 2.1rem/1.1 var(--serif)}
.price-mini .g{font-size:.92rem;color:var(--ink-soft)}

/* giving: the field of lights (full-bleed night) */
.lights-sec{position:relative;background:radial-gradient(ellipse at 50% 120%,#2B194C 0%,#1E1530 62%);color:var(--paper);padding-top:var(--sec-airy);overflow:hidden}
.field-band{position:relative;height:clamp(170px,24vw,280px);margin-top:clamp(8px,2vw,24px)}
.field-band canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.lights-sec .wrap{position:relative;z-index:1;display:grid;gap:18px}
.lights-sec .sec-h{color:#fff;max-width:16ch}
.lights-sec .eyebrow{color:var(--window)}
.lights-sec p{margin:0;max-width:34rem;color:var(--lavender);font-size:1.06rem}
.lights-stats{display:flex;flex-wrap:wrap;gap:12px 40px;align-items:flex-end;margin-top:8px}
.lights-stats .big{font:500 clamp(2.2rem,1.8rem + 2vw,3.2rem)/1 var(--serif);color:var(--window);font-variant-numeric:tabular-nums}
.lights-stats .lab{display:block;font:500 .9rem var(--sans);color:var(--lavender);margin-top:6px}
.lights-sec .proof{font-size:.9rem;color:var(--lavender);opacity:.85}
.first-light{font:italic 500 clamp(1.4rem,1.2rem + .8vw,1.8rem)/1.25 var(--serif);color:#F4E6CC;margin:0}

/* closing */
.closing{text-align:center;display:grid;justify-items:center;gap:14px;padding-block:var(--sec)}
.closing .sec-h{font-style:italic}
.scroll-cue{display:inline-block;width:1.5px;height:28px;background:linear-gradient(var(--lavender),transparent);animation:cue 2.4s var(--ease) infinite}
@keyframes cue{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

.home-more .btn.soft{color:var(--purple-deep);box-shadow:inset 0 0 0 1.5px var(--purple-deep)}
.lights-sec .wrap{grid-template-columns:minmax(0,1fr)}
@media (min-width:860px){.lights-sec .wrap{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);column-gap:64px;align-items:end}.lights-sec .wrap>.eyebrow,.lights-sec .wrap>.sec-h{grid-column:1}.lights-sec .wrap>#lP{grid-column:1}.lights-stats{grid-column:2;grid-row:2/4;justify-self:end;text-align:right}.lights-stats>div{text-align:right}.lights-sec .proof{grid-column:2;justify-self:end;text-align:right}}