:root {
  --bg:#faf9f6;
  --surface:#fff;
  --ink:#171717;
  --muted:#69655e;
  --gold:#c89527;
  --gold2:#e2bd63;
  --gold-soft:#f1e4c4;
  --line:#e9e1d2;
  --cream:#f5efe3;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  margin:0; color:var(--ink); background:var(--bg);
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI",Roboto,Arial,sans-serif;
}
body:before {
  content:""; position:fixed; inset:0; pointer-events:none; opacity:.35;
  background-image:linear-gradient(rgba(130,90,20,.025) 1px,transparent 1px),
                    linear-gradient(90deg,rgba(130,90,20,.025) 1px,transparent 1px);
  background-size:56px 56px;
  mask-image:linear-gradient(to bottom,#000,transparent 85%);
}
a { color:inherit; }
.container { width:min(1120px,calc(100% - 40px)); margin:auto; }
header {
  position:relative; z-index:5; height:78px; display:flex; align-items:center;
  justify-content:space-between;
}
.brand { display:flex; align-items:center; gap:12px; text-decoration:none; font-weight:800; letter-spacing:.08em; }
.brand img { width:40px;height:40px;object-fit:contain;border-radius:12px;border:1px solid var(--gold-soft);background:#fff;padding:3px; }
nav { display:flex; gap:28px; align-items:center; }
nav a { text-decoration:none; font-size:14px; color:var(--muted); font-weight:600; }
nav a:hover { color:var(--gold); }

.hero { padding:76px 0 110px; text-align:center; position:relative; }
.hero-logo {
  width:180px;height:180px;object-fit:contain;background:#fff;padding:16px;
  border-radius:38px;border:1px solid var(--gold-soft);
  box-shadow:0 28px 75px rgba(105,76,20,.12);
  margin-bottom:30px;
}
.eyebrow {
  text-transform:uppercase;letter-spacing:.24em;font-size:11px;font-weight:800;color:var(--gold);margin-bottom:15px;
}
h1 { font-size:clamp(46px,7.5vw,82px);line-height:.98;letter-spacing:-.055em;margin:0;font-weight:800; }
h1 span { color:var(--gold); }
.hero p { max-width:650px;margin:24px auto 0;font-size:18px;line-height:1.7;color:var(--muted); }
.store-wrap { margin-top:32px;display:flex;flex-direction:column;align-items:center;gap:11px; }
.store-label { color:#999287;font-size:10px;text-transform:uppercase;letter-spacing:.17em;font-weight:800; }
.store {
  display:flex;align-items:center;gap:12px;text-decoration:none;color:#fff;background:#151515;
  border:2px solid var(--gold);border-radius:16px;padding:12px 23px 12px 16px;
  box-shadow:0 12px 30px rgba(0,0,0,.12);transition:.2s;
}
.store:hover { transform:translateY(-3px);box-shadow:0 18px 38px rgba(135,95,20,.2); }
.store-row { display:flex;gap:14px;flex-wrap:wrap;justify-content:center; }
.apple svg { width:27px;height:30px;fill:#fff;display:block; }
.play svg { width:24px;height:24px;fill:#fff;display:block;margin:3px; }
.store small { display:block;color:#ccc;font-size:10px;line-height:1;margin-bottom:4px; }
.store strong { font-size:21px;font-weight:600; }
.divider { width:80px;height:2px;border-radius:99px;background:linear-gradient(90deg,transparent,var(--gold),transparent);margin:44px auto 0; }

section.feature-section { padding:105px 0; }
.section-head { text-align:center;max-width:650px;margin:0 auto 55px; }
.section-head .kicker { color:var(--gold);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.2em; }
.section-head h2 { font-size:clamp(34px,5vw,54px);letter-spacing:-.045em;margin:12px 0 15px; }
.section-head p { color:var(--muted);font-size:17px;line-height:1.7;margin:0; }

.features { display:grid;grid-template-columns:repeat(3,1fr);gap:20px; }
.card {
  background:rgba(255,255,255,.86);border:1px solid var(--line);border-radius:28px;padding:32px;
  box-shadow:0 15px 45px rgba(76,54,13,.055);
}
.icon {
  width:54px;height:54px;border-radius:17px;background:var(--cream);border:1px solid var(--gold-soft);
  display:grid;place-items:center;color:var(--gold);font-size:24px;margin-bottom:24px;
}
.card h3 { margin:0 0 11px;font-size:22px;letter-spacing:-.025em; }
.card p { margin:0;color:var(--muted);line-height:1.65;font-size:15px; }

.promise {
  background:#171717;color:#fff;border-radius:38px;padding:65px;
  position:relative;overflow:hidden;
}
.promise:after {
  content:"";position:absolute;width:360px;height:360px;border-radius:50%;
  border:1px solid rgba(226,189,99,.2);right:-100px;top:-130px;
  box-shadow:0 0 0 30px rgba(226,189,99,.025),0 0 0 60px rgba(226,189,99,.018);
}
.promise-inner { position:relative;z-index:1;max-width:700px; }
.promise .kicker { color:var(--gold2);text-transform:uppercase;letter-spacing:.2em;font-size:11px;font-weight:800; }
.promise h2 { font-size:clamp(35px,5vw,58px);line-height:1.05;letter-spacing:-.045em;margin:14px 0; }
.promise p { color:#c7c3bb;line-height:1.7;font-size:16px;max-width:600px; }
.quote {
  margin-top:30px;padding-left:20px;border-left:2px solid var(--gold);
  color:#f0e5cd;font-size:16px;font-style:italic;line-height:1.6;
}

.language {
  display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:stretch;
}
.language-card {
  min-height:250px;background:#fff;border:1px solid var(--line);border-radius:30px;padding:38px;
  display:flex;flex-direction:column;justify-content:center;box-shadow:0 15px 45px rgba(76,54,13,.05);
}
.language-card .lang { font-size:14px;color:var(--gold);font-weight:800;letter-spacing:.16em;text-transform:uppercase; }
.language-card h3 { font-size:42px;margin:10px 0 8px;letter-spacing:-.04em; }
.language-card p { margin:0;color:var(--muted);line-height:1.6; }

.break-section { background:var(--cream);border-top:1px solid var(--line);border-bottom:1px solid var(--line); }
.break-content {
  display:grid;grid-template-columns:1.05fr .95fr;gap:60px;align-items:center;
}
.story-visual {
  min-height:370px;border-radius:36px;background:#fff;border:1px solid var(--gold-soft);
  display:flex;align-items:center;justify-content:center;padding:35px;position:relative;
  box-shadow:0 22px 60px rgba(85,61,16,.09);
}
.story-book {
  width:210px;min-height:255px;background:#171717;border-radius:15px 24px 24px 15px;
  border-left:7px solid var(--gold);padding:35px 28px;color:#fff;
  box-shadow:12px 14px 30px rgba(0,0,0,.18);transform:rotate(-4deg);
}
.story-book .cross { color:var(--gold2);font-size:30px; }
.story-book h3 { font-size:25px;line-height:1.05;margin:15px 0 8px; }
.story-book p { color:#bbb;font-size:11px;line-height:1.5;margin:0; }
.break-copy .kicker { color:var(--gold);font-size:11px;text-transform:uppercase;letter-spacing:.2em;font-weight:800; }
.break-copy h2 { font-size:clamp(35px,5vw,55px);line-height:1.05;letter-spacing:-.045em;margin:13px 0 18px; }
.break-copy p { color:var(--muted);font-size:17px;line-height:1.75; }

.wall-back {
  position:absolute;width:180px;height:325px;border-radius:34px;
  background:linear-gradient(170deg,var(--gold-soft),var(--cream));
  border:1px solid var(--gold-soft);transform:rotate(-5deg) translateX(-42px);
}
.wall-phone {
  position:relative;z-index:1;width:180px;height:325px;border-radius:34px;
  background:#171717;padding:9px;transform:rotate(4deg);
  box-shadow:-16px 18px 42px rgba(0,0,0,.2);
}
.wall-screen {
  height:100%;border-radius:26px;padding:20px 16px;color:#fff;text-align:center;
  display:flex;flex-direction:column;align-items:center;justify-content:flex-end;
  position:relative;overflow:hidden;
  background:linear-gradient(175deg,#f0d492,#c89527 34%,#5c4213 68%,#241a0c);
}
.wall-screen:before {
  content:"";position:absolute;top:16%;left:50%;transform:translateX(-50%);
  width:66px;height:66px;border-radius:50%;
  background:radial-gradient(circle,#fdf3d7,#e2bd63 62%,rgba(226,189,99,0) 74%);
}
.wall-screen .cross {
  position:absolute;top:48%;left:50%;transform:translate(-50%,-50%);
  color:#241a0c;font-size:52px;line-height:1;
}
.wall-btn {
  position:relative;z-index:1;margin-bottom:4px;background:rgba(23,23,23,.85);
  color:#f0e5cd;font-size:9px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;
  padding:8px 13px;border-radius:999px;border:1px solid rgba(226,189,99,.45);
}
.wall-tag {
  position:absolute;top:26px;right:34px;z-index:2;background:var(--gold);color:#fff;
  font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
  padding:8px 14px;border-radius:999px;box-shadow:0 8px 20px rgba(150,110,30,.3);
}

.final {
  text-align:center;padding:120px 0 105px;
}
.final h2 { font-size:clamp(38px,6vw,65px);letter-spacing:-.05em;margin:0; }
.final p { color:var(--muted);font-size:17px;line-height:1.7;max-width:580px;margin:20px auto 0; }
.final .store-wrap { margin-top:30px; }

footer {
  border-top:1px solid var(--line);padding:27px 0;color:#918b80;font-size:12px;
}
.footer-inner { display:flex;justify-content:space-between;align-items:center;gap:20px; }
.footer-links { display:flex;gap:20px; }
.footer-links a { text-decoration:none; }
.footer-links a:hover { color:var(--gold); }

@media(max-width:800px) {
  nav a { display:none; }
  .features { grid-template-columns:1fr; }
  .language,.break-content { grid-template-columns:1fr; }
  .promise { padding:42px 30px; }
  .story-visual { min-height:320px; }
}
@media(max-width:560px) {
  .container { width:min(100% - 28px,1120px); }
  .hero { padding:50px 0 75px; }
  .hero-logo { width:155px;height:155px;border-radius:32px; }
  .hero p { font-size:16px; }
  section.feature-section { padding:75px 0; }
  .card { padding:27px; }
  .language-card { min-height:200px;padding:30px; }
  .language-card h3 { font-size:35px; }
  .footer-inner { flex-direction:column; }
}
.lang-switch{display:flex;gap:3px;padding:4px;background:#fff;border:1px solid var(--line);border-radius:999px}.lang-btn{border:0;background:transparent;color:var(--muted);cursor:pointer;padding:7px 11px;border-radius:999px;font-family:inherit;font-size:12px;font-weight:700;transition:background .2s,color .2s}.lang-btn.active{background:var(--ink);color:#fff}.lang-btn:hover:not(.active){color:var(--gold)}

/* Sub-pages (support, privacy, terms, legal) */
.page-hero { padding:80px 0 30px; }
.page-hero .kicker { color:var(--gold);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.2em; }
.page-hero h1 { font-size:clamp(40px,6vw,64px);letter-spacing:-.05em;margin:12px 0 10px; }
.page-hero .updated { color:#999287;font-size:12px;font-weight:600;letter-spacing:.05em;margin:0; }
.legal { max-width:760px;padding-bottom:110px; }
.legal h2 { font-size:26px;letter-spacing:-.03em;margin:46px 0 12px; }
.legal h2:first-child { margin-top:20px; }
.legal p,.legal li { color:var(--muted);line-height:1.75;font-size:15px; }
.legal ul { padding-left:22px;margin:10px 0; }
.legal li { margin-bottom:7px; }
.legal a { color:var(--gold);text-decoration:none; }
.legal a:hover { text-decoration:underline; }
.legal strong { color:var(--ink); }
.faq { display:flex;flex-direction:column;gap:16px;max-width:760px;padding-bottom:40px; }
.faq .card { padding:26px 30px; }
.faq .card h3 { font-size:18px;margin:0 0 8px; }
.faq .card p { font-size:15px; }
.contact-card {
  max-width:760px;background:rgba(255,255,255,.86);border:1px solid var(--line);border-radius:28px;
  padding:34px;box-shadow:0 15px 45px rgba(76,54,13,.055);margin-bottom:44px;
}
.contact-card h2 { margin:0 0 10px;font-size:24px;letter-spacing:-.03em; }
.contact-card p { margin:0 0 14px;color:var(--muted);line-height:1.7;font-size:15px; }
.contact-card p:last-child { margin-bottom:0; }
.contact-card a { color:var(--gold);font-weight:700;text-decoration:none; }
.contact-card a:hover { text-decoration:underline; }
@media(max-width:560px) {
  .page-hero { padding:55px 0 20px; }
  .contact-card { padding:26px; }
}