:root {
  --black: #070503;
  --panel: #0d0a07;
  --gold: #d8a84e;
  --gold-light: #f1cf86;
  --cream: #eadfc9;
  --muted: #b9aa93;
  --line: rgba(216,168,78,.48);
  --shell: 1220px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--black); }
body { margin: 0; background: var(--black); color: var(--cream); font-family: Georgia, 'Times New Roman', serif; }
a { color: inherit; }
.shell { width: min(var(--shell), calc(100% - 48px)); margin-inline: auto; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.eyebrow { font: 700 12px/1.2 Arial, sans-serif; letter-spacing: .24em; color: var(--gold-light); }
.site-header { min-height:132px; display:flex; align-items:center; justify-content:center; padding:22px 24px 20px; background:linear-gradient(180deg,#090704 0%,#050403 100%); border-bottom:1px solid rgba(216,168,78,.38); position:relative; z-index:10; }
.site-header::after { content:""; position:absolute; bottom:-1px; left:50%; width:min(520px,70vw); height:1px; transform:translateX(-50%); background:linear-gradient(90deg,transparent,var(--gold),transparent); opacity:.72; }
.brand { display:block; line-height:0; }
.brand-lockup { position:relative; display:inline-block; line-height:0; }
.brand img { display:block; width:min(350px,72vw); height:auto; filter:drop-shadow(0 3px 13px rgba(216,168,78,.18)); }
.brand-tm { position:absolute; top:24%; right:-0.45em; color:var(--gold-light); font:700 12px/1 Georgia, 'Times New Roman', serif; letter-spacing:0; text-shadow:0 1px 8px rgba(216,168,78,.35); }
.hero { min-height: 680px; position: relative; display:flex; align-items:center; background: url('assets/vault-library.png') center center / cover no-repeat; overflow:hidden; border-bottom:1px solid var(--line); }
.hero-shade { position:absolute; inset:0; background: linear-gradient(90deg, rgba(0,0,0,.94) 0%, rgba(0,0,0,.82) 28%, rgba(0,0,0,.36) 56%, rgba(0,0,0,.12) 100%), linear-gradient(0deg, rgba(0,0,0,.42), transparent 48%); }
.hero-content { position:relative; z-index:1; padding-block:82px 64px; }
h1,h2,h3,p { margin-top:0; }
h1 { margin-bottom:18px; max-width:570px; color:#f4d99e; font-size:clamp(42px, 4.25vw, 58px); line-height:1.02; font-weight:500; letter-spacing:-.025em; text-shadow:0 2px 18px #000; }
.tagline { max-width:560px; color:#e7cf9e; font-size:clamp(18px, 2vw, 24px); line-height:1.45; font-style:italic; }
.hero-copy { max-width:535px; color:#ddd1bf; font: 18px/1.55 Arial, sans-serif; text-shadow:0 1px 8px #000; }
.pill { display:inline-block; margin-top:14px; padding:15px 24px; border:1px solid var(--gold); border-radius:999px; text-decoration:none; color:var(--gold-light); font:700 12px/1 Arial,sans-serif; letter-spacing:.18em; background:rgba(8,6,4,.62); box-shadow:0 0 26px rgba(216,168,78,.08); }
.features { padding:44px 0 52px; background: radial-gradient(circle at 50% -20%, rgba(102,69,27,.2), transparent 45%), #090704; border-bottom:1px solid rgba(216,168,78,.28); }
.feature-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:18px; }
.feature-card { text-align:center; min-width:0; }
.feature-art { width:100%; max-width:188px; aspect-ratio:1 / 1.08; margin:0 auto 14px; display:flex; align-items:flex-end; justify-content:center; }
.feature-art img { width:100%; height:100%; display:block; object-fit:contain; filter:drop-shadow(0 12px 22px rgba(0,0,0,.5)); }
.feature-card h3 { color:#f0d39a; font-size:17px; line-height:1.16; margin-bottom:8px; }
.feature-card p { color:#bfb09a; font:14px/1.45 Arial,sans-serif; max-width:190px; margin:0 auto; }
.showcase { overflow:hidden; padding:74px 0 86px; background: radial-gradient(circle at 25% 60%, rgba(95,58,19,.14), transparent 34%), #070503; border-bottom:1px solid var(--line); }
.showcase-inner { display:grid; grid-template-columns:minmax(0,1.42fr) minmax(360px,.72fr); align-items:center; gap:64px; }
.phones { height:660px; position:relative; perspective:1400px; }
.phone { position:absolute; width:250px; aspect-ratio:942/2048; border:3px solid #b8873f; border-radius:36px; padding:7px; background:#050505; box-shadow:0 18px 55px #000, 0 0 0 1px rgba(255,218,145,.55), inset 0 0 0 2px #1a120a; overflow:hidden; }
.phone:before { content:""; position:absolute; inset:5px; border:1px solid rgba(255,255,255,.12); border-radius:29px; pointer-events:none; z-index:3; }
.phone img { width:100%; height:100%; display:block; object-fit:cover; border-radius:27px; }
.speaker { position:absolute; z-index:4; top:10px; left:50%; transform:translateX(-50%); width:72px; height:16px; border-radius:0 0 11px 11px; background:#030303; box-shadow:0 1px 0 rgba(255,255,255,.12); }
.phone-library { left:1%; top:80px; transform:rotate(-2deg) scale(.88); z-index:1; }
.phone-book { left:24%; top:10px; z-index:4; }
.phone-clubs { left:49%; top:65px; transform:rotate(1.5deg) scale(.93); z-index:3; }
.phone-profile { left:70%; top:110px; transform:rotate(3deg) scale(.84); z-index:2; }
.showcase-copy h2,.next h2 { color:#efd092; font-size:clamp(42px,4.25vw,58px); font-weight:500; line-height:1.02; margin-bottom:20px; }
.keep-line { white-space:nowrap; }
.showcase-copy > p:last-child,.next-content > p { color:#c9baa3; font:19px/1.6 Arial,sans-serif; }
.ornament { display:flex; align-items:center; gap:10px; color:var(--gold); margin:18px 0 24px; max-width:320px; }
.ornament span { height:1px; flex:1; background:linear-gradient(90deg,transparent,var(--gold)); }
.ornament span:last-child { background:linear-gradient(90deg,var(--gold),transparent); }
.next { min-height:470px; position:relative; display:flex; align-items:center; background:url('assets/vault-library.png') center 72% / cover no-repeat; overflow:hidden; }
.next-shade { position:absolute; inset:0; background:linear-gradient(90deg,rgba(0,0,0,.72),rgba(0,0,0,.76) 50%,rgba(0,0,0,.72)), linear-gradient(0deg,rgba(0,0,0,.46),rgba(0,0,0,.12)); backdrop-filter:blur(2px); }
.next-content { position:relative; z-index:1; padding:58px 0; width:min(720px, calc(100% - 48px)); margin:0 auto; text-align:center; }
.next-content p { max-width:620px; margin-left:auto; margin-right:auto; }
.next-content .ornament { margin-left:auto; margin-right:auto; }
.next-content .store-future { justify-content:center; }
.store-future { display:flex; align-items:center; gap:16px; margin-top:26px; flex-wrap:wrap; }
.future-badge { min-width:170px; padding:13px 18px; border-radius:12px; }
footer { padding:30px 0 18px; background:#050403; border-top:1px solid rgba(216,168,78,.34); }
.footer-inner { display:grid; grid-template-columns:220px 1fr auto; gap:30px; align-items:center; }
.footer-brand { line-height:0; }
.brand-lockup-footer img { width:190px; height:auto; display:block; }
.brand-tm-footer { top:18%; right:-0.45em; font-size:9px; }
.footer-inner nav { display:flex; justify-content:center; flex-wrap:wrap; gap:24px; }
.footer-inner a { text-decoration:none; color:#bcae99; font:12px Arial,sans-serif; }
.footer-inner a:hover { color:var(--gold-light); }
.footer-inner p,.legal-note { margin:0; color:#887b69; font:11px/1.5 Arial,sans-serif; }
.legal-note { text-align:center; margin-top:20px; }
@media (max-width: 1050px) {
  .feature-grid { grid-template-columns:repeat(3,1fr); row-gap:36px; }
  .showcase-inner { grid-template-columns:1fr; }
  .phones { width:min(820px,100%); margin:auto; }
  .showcase-copy { max-width:720px; text-align:center; margin:auto; }
  .ornament { margin-inline:auto; }
  .next-content { margin:0 auto; text-align:center; }
  .next-content .ornament { margin-inline:auto; }
  .store-future { justify-content:center; }
  .next-shade { background:rgba(0,0,0,.76); }
}
@media (max-width: 760px) {
  .shell { width:min(100% - 30px, var(--shell)); }
  .site-header { min-height:112px; padding-block:18px; }
  .brand img { width:min(310px,70vw); }
  .hero { min-height:650px; background-position:60% center; }
  .hero-shade { background:linear-gradient(90deg,rgba(0,0,0,.92),rgba(0,0,0,.62)), linear-gradient(0deg,rgba(0,0,0,.72),transparent); }
  .hero-content { padding-top:72px; align-self:flex-end; padding-bottom:54px; }
  h1 { font-size:44px; max-width:500px; }
  .tagline { font-size:18px; }
  .hero-copy { font-size:16px; }
  .feature-grid { grid-template-columns:repeat(2,1fr); }
  .feature-card:last-child { grid-column:1/-1; }
  .phones { height:620px; transform:scale(.9); transform-origin:top center; margin-bottom:-60px; }
  .phone { width:220px; }
  .phone-library { left:-4%; top:100px; }
  .phone-book { left:16%; top:20px; }
  .phone-clubs { left:43%; top:105px; }
  .phone-profile { left:64%; top:45px; }
  .footer-inner { grid-template-columns:1fr; text-align:center; }
  .footer-brand { margin:auto; }
}
@media (max-width: 520px) {
  .keep-line { white-space:normal; }
  .site-header { min-height:100px; padding-block:15px; }
  .brand img { width:min(275px,78vw); }
  h1 { font-size:38px; }
  .features { padding-top:36px; }
  .feature-grid { grid-template-columns:1fr; }
  .feature-card:last-child { grid-column:auto; }
  .feature-card p { max-width:270px; }
  .phones { height:620px; width:100%; transform:none; display:grid; grid-template-columns:1fr 1fr; gap:14px; }
  .phone { position:relative; inset:auto; width:100%; border-radius:26px; padding:5px; transform:none !important; }
  .phone img { border-radius:20px; }
  .phone:before { border-radius:22px; }
  .speaker { top:7px; width:54px; height:12px; }
  .showcase { padding-top:52px; }
  .showcase-copy h2,.next h2 { font-size:42px; }
  .store-future { flex-direction:column; }
  .future-badge { width:220px; }
}

.platform-note {
  margin: 1.5rem auto 0;
  color: var(--gold-bright);
  font-family: var(--sans);
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}

/* Mobile composition closeout — preserve desktop/tablet layouts above. */
@media (max-width: 520px) {
  .shell { width: calc(100% - 36px); }

  .site-header { min-height: 88px; padding: 12px 18px 11px; }
  .brand img { width: min(250px, 72vw); }
  .brand-tm { font-size: 9px; right: -0.35em; }

  .hero {
    min-height: 540px;
    align-items: flex-end;
    background-position: 62% center;
  }
  .hero-shade {
    background:
      linear-gradient(0deg, rgba(0,0,0,.94) 0%, rgba(0,0,0,.70) 48%, rgba(0,0,0,.24) 100%),
      linear-gradient(90deg, rgba(0,0,0,.82), rgba(0,0,0,.30));
  }
  .hero-content { padding: 48px 0 42px; }
  .hero .eyebrow { margin-bottom: 12px; }
  h1 { font-size: clamp(34px, 10vw, 40px); line-height: 1.03; margin-bottom: 14px; }
  .tagline { font-size: 17px; line-height: 1.42; margin-bottom: 14px; }
  .hero-copy { font-size: 15px; line-height: 1.5; margin-bottom: 18px; }
  .pill { margin-top: 0; padding: 13px 17px; font-size: 10px; letter-spacing: .14em; }

  .features { padding: 34px 0 40px; }
  .feature-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 14px;
    row-gap: 30px;
  }
  .feature-card:last-child { grid-column: 1 / -1; width: calc(50% - 7px); justify-self: center; }
  .feature-art { max-width: 132px; margin-bottom: 10px; }
  .feature-card h3 { font-size: 14px; line-height: 1.12; margin-bottom: 7px; }
  .feature-card p { max-width: 155px; font-size: 12px; line-height: 1.4; }

  .showcase { padding: 44px 0 54px; }
  .showcase-inner { gap: 24px; }
  .phones {
    display: block;
    position: relative;
    width: min(100%, 390px);
    height: 410px;
    margin: 0 auto;
    overflow: visible;
  }
  .phone {
    position: absolute;
    width: min(43vw, 168px);
    inset: auto;
    border-width: 2px;
    border-radius: 25px;
    padding: 5px;
  }
  .phone img { border-radius: 19px; }
  .phone:before { inset: 4px; border-radius: 21px; }
  .speaker { top: 7px; width: 48px; height: 11px; }
  .phone-library { left: 1%; top: 58px; transform: rotate(-7deg) scale(.88) !important; z-index: 1; }
  .phone-book { left: 22%; top: 5px; transform: rotate(-2deg) !important; z-index: 4; }
  .phone-clubs { right: 20%; left: auto; top: 22px; transform: rotate(3deg) scale(.96) !important; z-index: 3; }
  .phone-profile { right: 0; left: auto; top: 68px; transform: rotate(7deg) scale(.86) !important; z-index: 2; }

  .showcase-copy { padding-top: 2px; }
  .showcase-copy .eyebrow { margin-bottom: 12px; }
  .showcase-copy h2, .next h2 { font-size: clamp(34px, 10vw, 40px); line-height: 1.04; margin-bottom: 16px; }
  .showcase-copy > p:last-child, .next-content > p { font-size: 16px; line-height: 1.55; }
  .ornament { margin-top: 14px; margin-bottom: 18px; max-width: 250px; }

  .next { min-height: 390px; background-position: center 72%; }
  .next-shade { background: rgba(0,0,0,.78); backdrop-filter: blur(1px); }
  .next-content { width: calc(100% - 36px); padding: 48px 0; }
  .next-content .eyebrow { margin-bottom: 12px; }
  .platform-note {
    margin-top: 20px;
    color: var(--gold-light);
    font: 700 11px/1.4 Arial, sans-serif;
    letter-spacing: .16em;
  }

  footer { padding: 25px 0 17px; }
  .footer-inner { gap: 20px; }
  .brand-lockup-footer img { width: 165px; }
  .footer-inner nav { gap: 12px 20px; }
  .footer-inner p { max-width: 280px; margin-inline: auto; }
}

@media (max-width: 380px) {
  .shell { width: calc(100% - 28px); }
  .feature-grid { column-gap: 10px; }
  .feature-art { max-width: 118px; }
  .feature-card p { font-size: 11.5px; }
  .phones { height: 385px; }
  .phone { width: min(44vw, 158px); }
  .phone-book { left: 20%; }
  .phone-clubs { right: 18%; }
}


/* Public legal pages — mirrors the authoritative in-app legal documents. */
.legal-page { background: radial-gradient(circle at 50% 0%, rgba(216,168,78,.08), transparent 34%), var(--black); }
.legal-document { max-width: 900px; padding-top: 58px; padding-bottom: 72px; }
.legal-site-header { min-height: 112px; }
.legal-back { display:inline-block; margin-bottom:38px; color:var(--muted); text-decoration:none; font:600 12px/1.4 Arial,sans-serif; letter-spacing:.08em; text-transform:uppercase; }
.legal-back:hover { color:var(--gold-light); }
.legal-document > .eyebrow { margin-bottom:12px; }
.legal-document > h1 { max-width:none; margin-bottom:18px; color:#f4d99e; text-shadow:none; }
.legal-ornament { margin:0 0 42px; max-width:300px; }
.legal-copy { color:#d9cdbb; font:15.5px/1.75 Arial,sans-serif; }
.legal-copy h2 { margin:38px 0 12px; color:var(--gold-light); font:500 25px/1.25 Georgia,'Times New Roman',serif; }
.legal-copy p { margin:0 0 18px; }
.legal-copy strong { color:#eadfc9; }
.legal-copy a, .legal-page-links a { color:var(--gold-light); text-underline-offset:3px; }
.legal-page-links { display:flex; flex-wrap:wrap; gap:14px 26px; margin-top:50px; padding-top:26px; border-top:1px solid rgba(216,168,78,.3); font:600 12px/1.5 Arial,sans-serif; letter-spacing:.06em; text-transform:uppercase; }
@media (max-width: 520px) {
  .legal-document { padding-top:38px; padding-bottom:52px; }
  .legal-back { margin-bottom:28px; }
  .legal-document > h1 { font-size:36px; }
  .legal-copy { font-size:14.5px; line-height:1.7; }
  .legal-copy h2 { margin-top:32px; font-size:22px; }
}