/* ===========================================================
   Dae — marketing site styles
   Palette: cream surfaces · deep blue · baby-blue sky · soft pink
   Type: Fredoka (display) · Nunito (body)
   =========================================================== */

:root {
  /* brand */
  --cream-50:#fcfbf6;  --cream-100:#f8f5ec;  --cream-200:#f6f3ea;  --cream-300:#ece7d9;
  --blue-500:#3f6896;  --blue-600:#32527a;   --blue-700:#26405f;   --blue-900:#1f3450;
  --sky-100:#edf6fd;   --sky-200:#d6eaf8;    --sky-300:#bcdcf2;     --sky-400:#97c8ec;  --sky-500:#6aaadb;
  --pink-100:#fcf1f4;  --pink-400:#d291a1;   --pink-500:#c87f91;    --pink-600:#b87082;

  --ink:#1f3450;
  --ink-soft:#3f5168;
  --muted:#6b7a8d;
  --line:rgba(31,52,80,.10);

  --radius:22px;
  --radius-sm:14px;
  --shadow-sm:0 2px 10px rgba(31,52,80,.06);
  --shadow:0 18px 50px -18px rgba(31,52,80,.30);
  --shadow-lg:0 40px 90px -30px rgba(31,52,80,.45);
  --maxw:1160px;

  --grad-blue: linear-gradient(120deg,#3f6896,#6aaadb);
  --grad-warm: linear-gradient(120deg,#3f6896 0%,#6aaadb 45%,#d291a1 100%);
}

*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
  font-family:"Nunito",system-ui,-apple-system,sans-serif;
  color:var(--ink);
  background:var(--cream-50);
  line-height:1.65;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
h1,h2,h3,h4,.wordmark{ font-family:"Fredoka",sans-serif; line-height:1.08; letter-spacing:-.02em; }

.container{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:24px; }
.container--narrow{ max-width:780px; }

.grad{
  background:var(--grad-warm);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:transparent;
}

/* ---------- buttons ---------- */
.btn{
  --b:var(--blue-500);
  display:inline-flex; align-items:center; justify-content:center; gap:.4em;
  font-family:"Nunito",sans-serif; font-weight:800; font-size:1rem;
  padding:.85em 1.4em; border-radius:999px; border:1px solid transparent;
  cursor:pointer; transition:transform .18s ease, box-shadow .25s ease, background .2s ease, color .2s ease;
  white-space:nowrap;
}
.btn:hover{ transform:translateY(-2px); }
.btn:active{ transform:translateY(0); }
.btn--primary{ background:var(--blue-500); color:#fff; box-shadow:0 10px 24px -10px rgba(63,104,150,.8); }
.btn--primary:hover{ background:var(--blue-600); box-shadow:0 16px 30px -12px rgba(63,104,150,.9); }
.btn--ghost{ background:rgba(255,255,255,.55); color:var(--blue-700); border-color:var(--line); backdrop-filter:blur(8px); }
.btn--ghost:hover{ background:#fff; }
.btn--invert{ background:#fff; color:var(--blue-700); }
.btn--invert:hover{ background:var(--cream-100); }
.btn--lg{ padding:1.05em 1.8em; font-size:1.05rem; }
.btn--small{ padding:.6em 1em; font-size:.9rem; }

/* ---------- nav ---------- */
.nav{
  position:fixed; inset:0 0 auto 0; z-index:50;
  transition:background .3s ease, box-shadow .3s ease, padding .3s ease;
  padding:18px 0;
}
.nav.is-stuck{
  background:rgba(252,251,246,.78);
  backdrop-filter:blur(14px) saturate(140%);
  box-shadow:0 1px 0 var(--line);
  padding:12px 0;
}
.nav__inner{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:24px;
  display:flex; align-items:center; justify-content:space-between; }
.wordmark{ font-size:1.8rem; font-weight:700; color:var(--blue-700); letter-spacing:-.04em; }
.wordmark__dot{ color:var(--pink-400); }
.nav__links{ display:flex; align-items:center; gap:30px; }
.nav__links a{ font-weight:700; color:var(--ink-soft); transition:color .2s; }
.nav__links a:hover{ color:var(--blue-500); }
.nav__links .btn{ color:#fff; }
.nav__toggle{ display:none; flex-direction:column; gap:5px; background:none; border:0; cursor:pointer; padding:8px; }
.nav__toggle span{ width:24px; height:2.5px; background:var(--blue-700); border-radius:2px; transition:.25s; }
.nav.is-open .nav__toggle span:nth-child(1){ transform:translateY(7.5px) rotate(45deg); }
.nav.is-open .nav__toggle span:nth-child(2){ opacity:0; }
.nav.is-open .nav__toggle span:nth-child(3){ transform:translateY(-7.5px) rotate(-45deg); }

/* ---------- hero ---------- */
.hero{ position:relative; padding:148px 0 80px; overflow:hidden; }
.hero__blobs{ position:absolute; inset:0; z-index:0; pointer-events:none; filter:blur(8px); }
.blob{ position:absolute; border-radius:50%; opacity:.55; filter:blur(60px); animation:drift 18s ease-in-out infinite; }
.blob--blue{ width:520px; height:520px; background:var(--sky-300); top:-160px; right:-120px; }
.blob--pink{ width:380px; height:380px; background:var(--pink-100); bottom:-120px; left:-80px; animation-delay:-6s; }
.blob--sky{ width:300px; height:300px; background:var(--sky-200); top:40%; left:35%; animation-delay:-11s; opacity:.4; }
@keyframes drift{ 0%,100%{ transform:translate(0,0) scale(1);} 33%{ transform:translate(30px,-25px) scale(1.06);} 66%{ transform:translate(-20px,20px) scale(.96);} }

.hero__grid{
  position:relative; z-index:1; width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:24px;
  display:grid; grid-template-columns:1.05fr .95fr; gap:48px; align-items:center;
}
.eyebrow{
  display:inline-block; font-weight:800; font-size:.82rem; letter-spacing:.12em; text-transform:uppercase;
  color:var(--blue-500); background:var(--sky-100); border:1px solid var(--sky-300);
  padding:.5em 1em; border-radius:999px; margin-bottom:22px;
}
.hero__title{ font-size:clamp(2.6rem,5.6vw,4.5rem); font-weight:700; color:var(--blue-900); margin-bottom:22px; }
.hero__sub{ font-size:1.18rem; color:var(--ink-soft); max-width:33ch; margin-bottom:32px; }
.hero__sub em{ font-style:normal; color:var(--blue-500); font-weight:800; }
.hero__cta{ display:flex; flex-wrap:wrap; gap:14px; margin-bottom:30px; }

.stores{ display:flex; flex-wrap:wrap; gap:12px; }
.store-badge{
  display:inline-flex; align-items:center; gap:10px;
  background:var(--blue-900); color:#fff; border-radius:14px; padding:8px 16px;
}
.store-badge span{ display:flex; flex-direction:column; font-weight:800; font-size:1.05rem; line-height:1.1; }
.store-badge small{ font-weight:600; font-size:.62rem; letter-spacing:.06em; text-transform:uppercase; opacity:.7; }

/* phone */
.hero__device{ position:relative; display:flex; justify-content:center; }
.phone{
  position:relative; width:300px; height:610px; border-radius:46px;
  background:linear-gradient(160deg,#26405f,#1f3450); padding:13px;
  box-shadow:var(--shadow-lg); animation:floaty 6s ease-in-out infinite;
}
@keyframes floaty{ 0%,100%{ transform:translateY(0) rotate(-1.5deg);} 50%{ transform:translateY(-14px) rotate(-1.5deg);} }
.phone__notch{ position:absolute; top:13px; left:50%; transform:translateX(-50%); width:120px; height:24px; background:#1f3450; border-radius:0 0 16px 16px; z-index:5; }
.phone__screen{ width:100%; height:100%; border-radius:34px; background:var(--cream-100); overflow:hidden; display:flex; flex-direction:column; }
.appbar{ display:flex; align-items:center; justify-content:space-between; padding:34px 20px 12px; }
.appbar__title{ font-family:"Fredoka"; font-weight:700; font-size:1.5rem; color:var(--blue-700); }
.appbar__pill{ font-weight:800; font-size:.75rem; color:var(--blue-500); background:var(--sky-100); border:1px solid var(--sky-300); padding:.3em .7em; border-radius:999px; }

.deck{ position:relative; flex:1; margin:6px 18px 0; }
.card{ position:absolute; inset:0; border-radius:24px; background:#fff; box-shadow:var(--shadow); }
.card--back{ transform:scale(.9) translateY(26px); opacity:.5; background:var(--sky-200); }
.card--mid{ transform:scale(.95) translateY(13px); opacity:.8; background:var(--cream-300); }
.card--front{ overflow:hidden; display:flex; flex-direction:column; transition:transform .5s cubic-bezier(.22,1,.36,1), opacity .5s; }
.card--front.swipe-yes{ transform:translateX(120%) rotate(16deg); opacity:0; }
.card--front.swipe-no{ transform:translateX(-120%) rotate(-16deg); opacity:0; }
.card__photo{ position:relative; height:58%; background:
   radial-gradient(120% 90% at 70% 10%, rgba(255,255,255,.4), transparent 50%),
   linear-gradient(150deg,#6aaadb,#3f6896 55%,#26405f); }
.card__tag{ position:absolute; left:12px; bottom:12px; background:rgba(255,255,255,.92); color:var(--blue-700); font-weight:800; font-size:.78rem; padding:.4em .8em; border-radius:999px; }
.card__stamp{ position:absolute; top:16px; font-family:"Fredoka"; font-weight:700; font-size:1.4rem; padding:.1em .5em; border-radius:10px; border:3px solid; opacity:0; transition:opacity .2s; }
.card__stamp--like{ right:16px; color:#2bb673; border-color:#2bb673; transform:rotate(12deg); }
.card__stamp--nope{ left:16px; color:#ef4444; border-color:#ef4444; transform:rotate(-12deg); }
.card--front.show-like .card__stamp--like{ opacity:1; }
.card--front.show-nope .card__stamp--nope{ opacity:1; }
.card__body{ padding:16px 16px 0; }
.card__body h3{ font-size:1.18rem; color:var(--blue-900); margin-bottom:4px; }
.card__body p{ font-size:.84rem; color:var(--muted); line-height:1.4; }
.card__meta{ display:flex; gap:6px; font-size:.78rem; font-weight:700; color:var(--blue-500); margin-top:8px; }
.card__meta span:nth-child(even){ color:var(--line); }

.deck__controls{ display:flex; justify-content:center; align-items:center; gap:18px; padding:16px 0 22px; }
.ctrl{ width:56px; height:56px; border-radius:50%; border:0; background:#fff; box-shadow:var(--shadow-sm); font-size:1.3rem; cursor:pointer; transition:transform .15s ease; display:grid; place-items:center; }
.ctrl:hover{ transform:scale(1.08); }
.ctrl--no{ color:#ef4444; }
.ctrl--yes{ color:#fff; background:var(--pink-400); width:64px; height:64px; font-size:1.6rem; }
.ctrl--back{ color:var(--blue-500); width:46px; height:46px; font-size:1rem; }

.float-chip{ position:absolute; background:#fff; border:1px solid var(--line); box-shadow:var(--shadow); font-weight:800; font-size:.9rem; color:var(--blue-700); padding:.7em 1.1em; border-radius:14px; animation:floaty 5s ease-in-out infinite; }
.float-chip--1{ top:60px; left:-10px; color:var(--pink-600); }
.float-chip--2{ bottom:90px; right:-14px; color:#2bb673; animation-delay:-2.5s; }

/* real-screenshot device frames */
.device{ position:relative; background:linear-gradient(160deg,#26405f,#1f3450); border-radius:42px; padding:11px; box-shadow:var(--shadow-lg); }
.device__screen{ position:relative; border-radius:32px; overflow:hidden; background:#d6eaf8; }
.device__shot{ display:block; width:100%; height:auto; }   /* static row screenshots */
.device--hero{ width:300px; animation:floaty 6s ease-in-out infinite; }
.device--row{ width:272px; margin-inline:auto; }

/* hero: real card-deck — script.js swipes the top card away (like / dislike) revealing the
   next card; header, chips and the bottom tabs are the static base, exactly like the app */
.deck-base{ display:block; width:100%; height:auto; }
.deck-card{
  position:absolute; top:0; left:0; width:100%; height:auto;
  clip-path:inset(16.6% 0 20% 0);              /* show just the swipeable card, not the buttons below */
  transform-origin:50% 50%; backface-visibility:hidden; will-change:transform,opacity;
  /* transitions are applied per-move by script.js so each swipe eases smoothly */
}
/* swipe stamps in the card's TOP CORNERS — matches the app (LIKE top-left, NOPE top-right) */
.swipe-stamp{
  position:absolute; top:20.5%; z-index:30;
  font-family:"Fredoka",sans-serif; font-weight:700; font-size:1.4rem; letter-spacing:.04em;
  padding:.04em .5em; border-radius:12px; background:rgba(255,255,255,.92);
  opacity:0; pointer-events:none; transition:opacity .18s ease;
}
.swipe-stamp--like{ left:9%;  color:#2bb673; border:3px solid #2bb673; transform:rotate(-10deg); }
.swipe-stamp--nope{ right:9%; color:#ef4444; border:3px solid #ef4444; transform:rotate(10deg); }
.swipe-stamp.is-on{ opacity:1; }

/* waitlist form (in the dark CTA card) */
.waitlist{ max-width:520px; margin:6px auto 0; text-align:left; }
.waitlist__row{ display:flex; gap:12px; margin-bottom:12px; }
.waitlist__row .waitlist__input{ flex:1; min-width:0; }
.waitlist__input{
  width:100%; margin-bottom:12px; padding:.95em 1.1em; border-radius:14px;
  border:1px solid rgba(255,255,255,.25); background:rgba(255,255,255,.96);
  font-family:"Nunito",sans-serif; font-size:1rem; color:var(--ink); outline:none;
  transition:box-shadow .2s ease, border-color .2s ease;
}
.waitlist__input::placeholder{ color:#8aa0b5; }
.waitlist__input:focus{ border-color:var(--sky-400); box-shadow:0 0 0 4px rgba(106,170,219,.35); }
.waitlist__submit{ width:100%; margin-top:4px; }
.waitlist__submit[disabled]{ opacity:.65; cursor:default; transform:none; }
.waitlist__msg{ min-height:1.2em; margin-top:14px; font-weight:700; font-size:.98rem; text-align:center; }
.waitlist__msg.is-ok{ color:#7ee3b0; }
.waitlist__msg.is-err{ color:#ffd0d0; }
@media (max-width:520px){ .waitlist__row{ flex-direction:column; gap:0; } }

/* ---------- marquee ---------- */
.marquee{ background:var(--blue-900); color:var(--sky-200); padding:16px 0; overflow:hidden; }
.marquee__track{ display:flex; gap:28px; white-space:nowrap; width:max-content; animation:scroll 26s linear infinite; }
.marquee__track span{ font-family:"Fredoka"; font-weight:600; font-size:1.15rem; opacity:.9; }
.marquee__track span:nth-child(even){ opacity:.4; }
@keyframes scroll{ from{ transform:translateX(0);} to{ transform:translateX(-50%);} }

/* ---------- generic section ---------- */
.section{ padding:96px 0; }
.section__head{ max-width:680px; margin:0 auto 56px; text-align:center; }
.kicker{ display:inline-block; font-weight:800; letter-spacing:.12em; text-transform:uppercase; font-size:.78rem; color:var(--pink-600); margin-bottom:14px; }
.kicker--light{ color:var(--sky-300); }
.section__head h2{ font-size:clamp(1.9rem,3.8vw,2.9rem); color:var(--blue-900); }
.section__lead{ margin-top:16px; font-size:1.12rem; color:var(--ink-soft); }

/* ---------- D.A.E. cards ---------- */
.dae{ background:linear-gradient(180deg,var(--cream-50),var(--cream-200)); }
.dae__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.dae__card{
  background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:40px 32px;
  box-shadow:var(--shadow-sm); transition:transform .3s ease, box-shadow .3s ease; position:relative; overflow:hidden;
}
.dae__card::after{ content:""; position:absolute; inset:auto -40px -40px auto; width:140px; height:140px; border-radius:50%; background:var(--sky-100); opacity:.7; transition:transform .4s ease; }
.dae__card:hover{ transform:translateY(-6px); box-shadow:var(--shadow); }
.dae__card:hover::after{ transform:scale(1.4); }
.dae__letter{ position:relative; z-index:1; display:inline-grid; place-items:center; width:62px; height:62px; border-radius:18px; background:var(--grad-blue); color:#fff; font-family:"Fredoka"; font-weight:700; font-size:1.9rem; margin-bottom:22px; box-shadow:0 10px 22px -10px rgba(63,104,150,.8); }
.dae__card:nth-child(2) .dae__letter{ background:linear-gradient(120deg,#6aaadb,#97c8ec); }
.dae__card:nth-child(3) .dae__letter{ background:linear-gradient(120deg,#d291a1,#c87f91); box-shadow:0 10px 22px -10px rgba(210,145,161,.8); }
.dae__card h3{ position:relative; z-index:1; font-size:1.5rem; color:var(--blue-900); margin-bottom:10px; }
.dae__card p{ position:relative; z-index:1; color:var(--ink-soft); }

/* ---------- bento ---------- */
.bento{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.bento__cell{
  background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:30px;
  box-shadow:var(--shadow-sm); transition:transform .3s ease, box-shadow .3s ease; position:relative; overflow:hidden;
}
.bento__cell:hover{ transform:translateY(-5px); box-shadow:var(--shadow); }
.bento__cell--lg{ grid-column:span 2; grid-row:span 2; background:linear-gradient(160deg,#fff,var(--sky-100)); }
.bento__cell--wide{ grid-column:span 2; }
.bento__cell--accent{ background:linear-gradient(155deg,var(--blue-500),var(--blue-700)); color:#fff; }
.bento__cell--accent h3{ color:#fff; }
.bento__cell--accent p{ color:rgba(255,255,255,.85); }
.bento__icon{ font-size:2rem; margin-bottom:14px; }
.bento__cell h3{ font-size:1.35rem; color:var(--blue-900); margin-bottom:8px; }
.bento__cell p{ color:var(--ink-soft); }
.bento__cell--lg h3{ font-size:1.7rem; }
.chip{ display:inline-block; margin-top:14px; font-weight:800; font-size:.72rem; letter-spacing:.06em; text-transform:uppercase; padding:.4em .8em; border-radius:999px; }
.chip--soon{ background:rgba(255,255,255,.18); color:#fff; border:1px solid rgba(255,255,255,.35); }

.bento__art--deck{ display:flex; gap:12px; margin-top:26px; }
.mini-card{ width:64px; height:84px; border-radius:14px; display:grid; place-items:center; font-size:1.8rem; background:#fff; box-shadow:var(--shadow-sm); transition:transform .3s ease; }
.mini-card:nth-child(1){ transform:rotate(-6deg); background:var(--pink-100); }
.mini-card:nth-child(2){ transform:translateY(-6px); background:var(--sky-100); }
.mini-card:nth-child(3){ transform:rotate(6deg); background:var(--cream-200); }
.bento__cell--lg:hover .mini-card:nth-child(1){ transform:rotate(-10deg) translateY(-4px); }
.bento__cell--lg:hover .mini-card:nth-child(3){ transform:rotate(10deg) translateY(-4px); }

/* ---------- showcase rows ---------- */
.row{ display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center; padding:40px 0; }
.row--reverse .row__copy{ order:2; }
.row h2{ font-size:clamp(1.8rem,3.4vw,2.6rem); color:var(--blue-900); margin:10px 0 16px; }
.row__copy p{ font-size:1.1rem; color:var(--ink-soft); margin-bottom:20px; }
.ticks{ list-style:none; display:grid; gap:12px; }
.ticks li{ position:relative; padding-left:34px; font-weight:600; color:var(--ink); }
.ticks li::before{ content:"✓"; position:absolute; left:0; top:-1px; width:22px; height:22px; border-radius:50%; background:var(--sky-100); color:var(--blue-500); font-weight:900; font-size:.8rem; display:grid; place-items:center; border:1px solid var(--sky-300); }

.row__art{ display:flex; justify-content:center; }
.glasscard{
  width:100%; max-width:380px; border-radius:var(--radius); padding:30px;
  background:rgba(255,255,255,.7); backdrop-filter:blur(12px); border:1px solid #fff;
  box-shadow:var(--shadow);
}
.glasscard--match{ text-align:center; background:linear-gradient(160deg,rgba(255,255,255,.85),var(--pink-100)); }
.avatars{ display:flex; justify-content:center; margin-bottom:14px; }
.avatars span{ width:58px; height:58px; border-radius:50%; display:grid; place-items:center; font-size:1.8rem; background:#fff; box-shadow:var(--shadow-sm); border:3px solid #fff; }
.avatars span:nth-child(2){ margin-left:-16px; }
.glasscard--match strong{ display:block; font-family:"Fredoka"; font-size:1.6rem; color:var(--pink-600); margin-bottom:6px; }
.glasscard--match p{ color:var(--ink-soft); margin-bottom:18px; }
.glasscard--match .btn{ color:#fff; }
.feed-item{ display:flex; gap:12px; align-items:center; padding:12px 0; border-bottom:1px solid var(--line); }
.feed-item:last-child{ border-bottom:0; }
.feed-ava{ width:42px; height:42px; border-radius:50%; display:grid; place-items:center; font-size:1.3rem; background:var(--sky-100); flex-shrink:0; }
.feed-item b{ color:var(--blue-700); }
.feed-item small{ display:block; color:var(--muted); font-size:.85rem; }

/* ---------- steps ---------- */
.how{ background:linear-gradient(180deg,var(--cream-200),var(--cream-50)); }
.steps{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; counter-reset:step; }
.step{ background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:36px 30px; box-shadow:var(--shadow-sm); position:relative; }
.step__num{ display:inline-grid; place-items:center; width:48px; height:48px; border-radius:14px; background:var(--blue-900); color:#fff; font-family:"Fredoka"; font-weight:700; font-size:1.3rem; margin-bottom:20px; }
.step h3{ font-size:1.35rem; color:var(--blue-900); margin-bottom:8px; }
.step p{ color:var(--ink-soft); }

/* ---------- faq ---------- */
.accordion{ display:grid; gap:14px; }
.accordion details{ background:#fff; border:1px solid var(--line); border-radius:var(--radius-sm); padding:4px 24px; box-shadow:var(--shadow-sm); transition:box-shadow .25s; }
.accordion details[open]{ box-shadow:var(--shadow); }
.accordion summary{ list-style:none; cursor:pointer; font-family:"Fredoka"; font-weight:600; font-size:1.15rem; color:var(--blue-900); padding:18px 0; display:flex; justify-content:space-between; align-items:center; gap:16px; }
.accordion summary::-webkit-details-marker{ display:none; }
.accordion summary::after{ content:"+"; font-size:1.6rem; color:var(--blue-500); transition:transform .25s; line-height:1; }
.accordion details[open] summary::after{ transform:rotate(45deg); }
.accordion p{ color:var(--ink-soft); padding:0 0 20px; max-width:62ch; }

/* ---------- CTA ---------- */
.cta{ padding:30px 24px 90px; }
.cta__inner{
  position:relative; overflow:hidden; max-width:var(--maxw); margin-inline:auto; text-align:center;
  background:radial-gradient(120% 140% at 0% 0%, #3f6896, #1f3450 60%);
  color:#fff; border-radius:36px; padding:72px 28px;
  box-shadow:var(--shadow-lg);
}
.cta__inner::before, .cta__inner::after{ content:""; position:absolute; border-radius:50%; filter:blur(50px); opacity:.4; }
.cta__inner::before{ width:280px; height:280px; background:var(--sky-500); top:-100px; right:-60px; }
.cta__inner::after{ width:220px; height:220px; background:var(--pink-400); bottom:-90px; left:-40px; }
.cta__inner > *{ position:relative; z-index:1; }
.cta__inner h2{ font-size:clamp(2rem,4.5vw,3.2rem); margin-bottom:14px; }
.cta__inner p{ font-size:1.15rem; color:rgba(255,255,255,.82); max-width:46ch; margin:0 auto 30px; }
.cta__fine{ margin-top:22px; font-size:.95rem; }
.cta__fine a{ color:#fff; text-decoration:underline; text-underline-offset:3px; }

/* ---------- footer ---------- */
.footer{ background:var(--blue-900); color:rgba(255,255,255,.7); padding:70px 0 32px; }
.footer__grid{ display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:40px; padding-bottom:48px; border-bottom:1px solid rgba(255,255,255,.12); }
.footer__brand p{ margin-top:14px; max-width:30ch; }
.wordmark--footer{ color:#fff; font-size:2rem; }
.footer__col h4{ font-family:"Nunito"; font-weight:800; color:#fff; font-size:.85rem; letter-spacing:.08em; text-transform:uppercase; margin-bottom:16px; }
.footer__col a{ display:block; padding:6px 0; transition:color .2s; }
.footer__col a:hover{ color:#fff; }
.footer__base{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; padding-top:26px; font-size:.9rem; }

/* ---------- reveal animation ---------- */
.reveal{ opacity:0; transform:translateY(26px); transition:opacity .7s ease, transform .7s cubic-bezier(.22,1,.36,1); transition-delay:var(--d,0s); }
.reveal.in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){
  .reveal{ opacity:1; transform:none; }
  .blob,.phone,.float-chip,.marquee__track,
  .device--hero,.deck-card,.swipe-stamp{ animation:none; }
  .swipe-stamp{ display:none; }
  html{ scroll-behavior:auto; }
}

/* ---------- responsive ---------- */
@media (max-width:980px){
  .hero__grid{ grid-template-columns:1fr; gap:30px; }
  .hero__copy{ text-align:center; margin-inline:auto; }
  .hero__sub{ max-width:46ch; margin-inline:auto; }
  .hero__cta,.stores{ justify-content:center; }
  .bento{ grid-template-columns:repeat(2,1fr); }
  .bento__cell--lg{ grid-column:span 2; grid-row:auto; }
  .bento__cell--wide{ grid-column:span 2; }
  .dae__grid,.steps{ grid-template-columns:1fr; }
  .row,.row--reverse{ grid-template-columns:1fr; gap:30px; }
  .row--reverse .row__copy{ order:0; }
  .row__copy{ text-align:center; }
  .ticks{ display:inline-grid; text-align:left; }
}
@media (max-width:720px){
  .nav__links{
    position:fixed; inset:64px 16px auto 16px; flex-direction:column; gap:10px; align-items:stretch;
    background:rgba(252,251,246,.97); backdrop-filter:blur(14px);
    border:1px solid var(--line); border-radius:20px; padding:18px; box-shadow:var(--shadow-lg);
    transform:translateY(-12px) scale(.98); opacity:0; pointer-events:none; transition:.25s;
  }
  .nav.is-open .nav__links{ transform:none; opacity:1; pointer-events:auto; }
  .nav__links a{ padding:8px 4px; }
  .nav__toggle{ display:flex; }
  .footer__grid{ grid-template-columns:1fr 1fr; }
  .section{ padding:72px 0; }
}
@media (max-width:460px){
  .bento{ grid-template-columns:1fr; }
  .bento__cell--lg,.bento__cell--wide{ grid-column:auto; }
  .footer__grid{ grid-template-columns:1fr; }
  .device--hero{ width:270px; }
}

/* ===========================================================
   Legal pages (privacy / terms / guidelines)
   =========================================================== */
.legal-hero{
  padding:140px 0 50px; text-align:center; position:relative; overflow:hidden;
  background:linear-gradient(180deg,var(--sky-100),var(--cream-50));
  border-bottom:1px solid var(--line);
}
.legal-hero .kicker{ margin-bottom:10px; }
.legal-hero h1{ font-size:clamp(2.2rem,5vw,3.2rem); color:var(--blue-900); }
.legal-hero .updated{ margin-top:14px; color:var(--muted); font-weight:600; }
.legal-nav{ display:flex; justify-content:center; gap:10px; flex-wrap:wrap; margin-top:26px; }
.legal-nav a{ font-weight:800; font-size:.9rem; color:var(--blue-700); background:#fff; border:1px solid var(--line); padding:.55em 1.1em; border-radius:999px; transition:.2s; }
.legal-nav a:hover{ background:var(--blue-500); color:#fff; border-color:var(--blue-500); }
.legal-nav a[aria-current="page"]{ background:var(--blue-900); color:#fff; border-color:var(--blue-900); }

.legal-body{ padding:64px 0 96px; }
.legal-body .container{ max-width:820px; }
.legal-intro{ font-size:1.18rem; color:var(--ink-soft); margin-bottom:40px; padding-bottom:32px; border-bottom:1px solid var(--line); }
.legal-section{ margin-bottom:38px; }
.legal-section h2{ font-size:1.4rem; color:var(--blue-900); margin-bottom:14px; }
.legal-section p{ color:var(--ink-soft); margin-bottom:12px; }
.legal-section p.bullet{ position:relative; padding-left:26px; margin-bottom:8px; }
.legal-section p.bullet::before{ content:""; position:absolute; left:6px; top:11px; width:7px; height:7px; border-radius:50%; background:var(--pink-400); }
.legal-section a{ color:var(--blue-500); font-weight:700; text-decoration:underline; text-underline-offset:2px; }
.legal-disclaimer{ margin-top:40px; padding:20px 24px; background:var(--cream-200); border:1px solid var(--line); border-radius:var(--radius-sm); color:var(--muted); font-size:.92rem; }
.legal-back{ display:inline-flex; margin-top:30px; font-weight:800; color:var(--blue-500); }
