:root {
  --ink: #251d2c;
  --muted: #726979;
  --paper: #f8f3ed;
  --paper-2: #efe5dc;
  --wine: #6e394f;
  --purple: #604a76;
  --peach: #e7a17f;
  --line: rgba(37, 29, 44, 0.13);
  --radius: 28px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Segoe UI", sans-serif;
  line-height: 1.7;
  overflow-x: hidden;
}
a { color: inherit; text-decoration: none; }
button { font: inherit; }
.noise {
  position: fixed; inset: 0; pointer-events: none; z-index: 99; opacity: .045;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E");
}
.site-header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 50;
  height: 84px; display: flex; align-items: center; padding: 0 5vw;
  color: white; transition: .35s ease; border-bottom: 1px solid transparent;
}
.site-header.scrolled { background: rgba(35,26,42,.88); backdrop-filter: blur(18px); border-color: rgba(255,255,255,.08); }
.brand { display: inline-flex; align-items: center; gap: 10px; font-weight: 800; letter-spacing: .08em; font-size: 14px; }
.site-header .brand { font-size: 24px; }
.brand-mark { display:grid; place-items:center; width:28px; height:28px; border:1px solid currentColor; border-radius:50%; }
.site-nav { margin-left: auto; display: flex; gap: 36px; font-size: 13px; font-weight: 600; }
.site-nav a { opacity: .75; transition:.2s; }
.site-nav a:hover { opacity:1; }
.menu-toggle { display:none; background:none; border:0; padding:8px; }
.menu-toggle span { display:block; width:22px; height:1px; margin:6px; background:white; }

.hero {
  position: relative; min-height: 100vh; overflow: hidden; color: white;
  background: #7b536f url("assets/hero-sunset.jpg") center / cover no-repeat;
  display: flex; align-items:center; padding: 130px 8vw 100px;
}
.hero-content { position:relative; z-index:4; max-width:720px; }
.eyebrow { margin:0 0 20px; letter-spacing:.22em; font-size:12px; font-weight:800; opacity:.72; }
.hero h1 { margin:0; font-size:clamp(52px,7vw,104px); line-height:1.25; letter-spacing:-.055em; white-space:nowrap; }
.hero-copy { margin:28px 0 36px; font-size:clamp(16px,1.4vw,20px); color:rgba(255,255,255,.78); white-space:nowrap; }
.hero-actions { display:flex; gap:14px; flex-wrap:wrap; }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:12px; min-height:54px; padding:0 24px; border-radius:999px; font-weight:700; font-size:14px; transition:.25s; }
.btn:hover { transform:translateY(-3px); }
.btn-primary { background:white; color:var(--ink); }
.btn-ghost { border:1px solid rgba(255,255,255,.35); background:rgba(255,255,255,.07); backdrop-filter:blur(8px); }
.scroll-indicator { position:absolute;z-index:5;bottom:30px;left:8vw;display:flex;align-items:center;gap:14px;font-size:9px;letter-spacing:.18em;opacity:.6; }
.scroll-indicator i{display:block;width:70px;height:1px;background:white;position:relative}.scroll-indicator i::after{content:"";position:absolute;right:0;top:-2px;width:5px;height:5px;border-radius:50%;background:white}

.section { padding: 130px 8vw; }
.section-heading { margin-bottom:64px; }
.section-heading h2 { margin:0; font-size:clamp(38px,5vw,68px); line-height:1.15; letter-spacing:-.045em; }
.story { background:#f5eee7; }
.story-grid { display:grid; grid-template-columns:1.35fr .9fr; gap:24px; }
.story-card,.quote-card { min-height:330px; border-radius:var(--radius); padding:42px; position:relative; overflow:hidden; }
.story-card { background:#fffaf6; border:1px solid var(--line); display:flex; align-items:flex-end; }
.story-card.large { min-height:520px; background:linear-gradient(145deg,#5b3a4c,#9d655f); color:white; }
.story-card.large::after { content:"";position:absolute;width:340px;height:340px;border:1px solid rgba(255,255,255,.15);border-radius:50%;right:-100px;top:-90px;box-shadow:0 0 0 70px rgba(255,255,255,.035),0 0 0 140px rgba(255,255,255,.025); }
.story-card h3 { font-size:34px;line-height:1.25;margin:8px 0 16px;letter-spacing:-.03em; }
.story-card p { max-width:550px;color:inherit;opacity:.72;margin:0; }
.card-kicker { font-size:11px!important;letter-spacing:.18em;font-weight:800; }
.number { position:absolute;top:30px;right:34px;font-family:Georgia,serif;font-size:25px;opacity:.35; }
.quote-card { background:#2c2331;color:white;display:flex;flex-direction:column;justify-content:center; }
.quote-mark { font-family:Georgia,serif;font-size:78px;line-height:.7;color:#e3a889; }
.quote-card blockquote { margin:20px 0;font-family:Georgia,"Apple SD Gothic Neo",serif;font-size:26px;line-height:1.55; }
.quote-card p { font-size:12px;opacity:.55; }
.story-grid > .story-card:last-child { grid-column:2; }

.works { background:#201a25;color:white; }
.horizontal { display:flex;align-items:flex-end;justify-content:space-between;gap:60px; }
.horizontal > p { max-width:460px;color:rgba(255,255,255,.55); }
.work-list { display:grid;gap:28px; }
.work-card { min-height:520px;border-radius:32px;overflow:hidden;display:grid;grid-template-columns: .85fr 1.15fr;position:relative; }
.work-copy { padding:64px;display:flex;flex-direction:column;justify-content:center;position:relative;z-index:3; }
.work-index { font-size:11px;letter-spacing:.16em;opacity:.55; }
.work-copy h3 { font-size:clamp(42px,5vw,74px);margin:12px 0 18px;letter-spacing:-.05em; }
.work-copy p { max-width:430px;opacity:.66;font-size:17px; }
.work-copy a { margin-top:28px;font-size:14px;font-weight:700; }
.work-routine { background:linear-gradient(135deg,#f1ddd0,#a1778e);color:#302532; }
.phone-scene { position:relative;min-height:520px;background:radial-gradient(circle at 50% 50%,rgba(255,255,255,.35),transparent 53%); }
.phone { position:absolute;width:230px;height:470px;padding:10px;background:#27212c;border-radius:38px;box-shadow:0 35px 70px rgba(44,28,42,.35); }
.phone-left{left:14%;top:55px;transform:rotate(-8deg)}.phone-right{right:12%;top:38px;transform:rotate(8deg)}
.phone-screen{height:100%;border-radius:31px;background:#fff7f1;padding:28px 20px;color:#33283a;display:flex;flex-direction:column;gap:14px}.phone-screen.dark{background:#3c2b47;color:white}
.phone-screen small{font-size:9px;letter-spacing:.15em;opacity:.55}.phone-screen strong{font-size:21px}.progress-ring{width:128px;height:128px;border:14px solid #d5bcc7;border-top-color:#6f4968;border-radius:50%;display:grid;place-items:center;margin:18px auto;font-size:25px;font-weight:800}.mini-task{padding:12px;border-radius:13px;background:#eee2e3;font-size:12px}.mini-task.done{text-decoration:line-through;opacity:.55}.chart-bars{display:flex;align-items:flex-end;gap:7px;height:170px;margin-top:32px}.chart-bars i{flex:1;background:linear-gradient(#db9d8f,#826284);border-radius:8px 8px 3px 3px}.chart-bars i:nth-child(1){height:35%}.chart-bars i:nth-child(2){height:55%}.chart-bars i:nth-child(3){height:43%}.chart-bars i:nth-child(4){height:72%}.chart-bars i:nth-child(5){height:62%}.chart-bars i:nth-child(6){height:88%}.chart-bars i:nth-child(7){height:100%}.streak{margin-top:24px;padding:11px;border-radius:12px;background:rgba(255,255,255,.08);font-size:12px;text-align:center}
.work-game { background:linear-gradient(135deg,#34284c,#735061); }
.game-scene { position:relative;min-height:520px;overflow:hidden;background:radial-gradient(circle at 40% 35%,rgba(198,161,207,.34),transparent 42%); }
.moon{position:absolute;width:120px;height:120px;border-radius:50%;background:#ffe6be;left:18%;top:15%;box-shadow:0 0 70px rgba(255,224,190,.35)}.game-island{position:absolute;width:420px;height:180px;background:linear-gradient(#8e6680,#3e304e);border-radius:50%;left:12%;bottom:80px;box-shadow:0 35px 0 -15px rgba(20,15,30,.6);transform:rotate(-4deg)}.game-character{position:absolute;left:43%;bottom:190px;font-size:80px;color:#ffe2ad;text-shadow:0 0 24px #fff}.game-spark{position:absolute;color:#f6d5b7}.s1{left:25%;top:50%;font-size:25px}.s2{left:65%;top:24%;font-size:18px}.s3{left:72%;top:62%;font-size:30px}
.work-budget { background:linear-gradient(135deg,#d9c8b8,#7c8b7d);color:#2b2d2b; }
.budget-visual { display:grid;place-items:center;padding:40px; }
.budget-card { width:min(440px,90%);padding:42px;border-radius:28px;background:rgba(255,255,255,.78);box-shadow:0 30px 80px rgba(28,42,33,.18);backdrop-filter:blur(20px); }
.budget-card small{display:block;opacity:.55;margin-bottom:8px}.budget-card strong{display:block;font-size:36px}.budget-line{height:130px;margin:26px 0;position:relative;border-bottom:1px solid rgba(0,0,0,.08);overflow:hidden}.budget-line i{position:absolute;inset:25px 0 10px;background:linear-gradient(150deg,transparent 0 15%,#667968 16% 18%,transparent 19% 32%,#667968 33% 35%,transparent 36% 48%,#667968 49% 51%,transparent 52% 64%,#667968 65% 67%,transparent 68% 80%,#667968 81% 83%,transparent 84%);clip-path:polygon(0 80%,15% 55%,31% 70%,49% 34%,65% 48%,82% 14%,100% 25%,100% 100%,0 100%);background-color:rgba(102,121,104,.15)}.budget-items{display:flex;justify-content:space-between;font-size:11px;opacity:.65}

.values { background:#f5eee7; }
.centered { text-align:center; }
.value-grid { display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line); }
.value-card { min-height:350px;padding:38px 28px;border-right:1px solid var(--line);position:relative;display:flex;flex-direction:column;justify-content:flex-end; }
.value-card:last-child{border-right:0}.value-card span{position:absolute;top:24px;left:28px;font-size:11px;opacity:.4}.value-card i{font-style:normal;font-size:56px;margin-bottom:auto;color:var(--wine)}.value-card h3{font-size:22px;margin:0 0 10px}.value-card p{margin:0;color:var(--muted);font-size:14px}
.contact { min-height:650px;background:#5b3c54;color:white;position:relative;overflow:hidden;display:grid;place-items:center;text-align:center; }
.contact-inner{position:relative;z-index:2}.contact h2{font-size:clamp(42px,5vw,74px);line-height:1.2;margin:0;letter-spacing:-.045em}.contact p:not(.eyebrow){opacity:.65;margin:24px 0 34px}.btn-light{background:white;color:var(--ink)}.contact-orbit{position:absolute;border:1px solid rgba(255,255,255,.12);border-radius:50%}.orbit-one{width:650px;height:650px}.orbit-two{width:920px;height:920px}
footer { padding:42px 8vw;background:#1d1821;color:white;display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:center; }
footer > .brand { font-size: 15.4px; }
footer > p{margin:0;text-align:right;opacity:.5;font-size:13px}.footer-meta{grid-column:1/-1;padding-top:26px;border-top:1px solid rgba(255,255,255,.1);display:flex;gap:25px;font-size:11px;opacity:.5}.footer-meta span{margin-right:auto}
.reveal { opacity:0;transform:translateY(28px);transition:opacity .8s ease,transform .8s ease; }
.reveal.visible { opacity:1;transform:none; }

/* Privacy policy */
.legal-page { background:#f5eee7; }
.legal-page .site-header { background:rgba(35,26,42,.92);backdrop-filter:blur(18px);border-color:rgba(255,255,255,.08); }
.legal-main { padding-top:84px; }
.legal-hero { padding:104px 8vw 88px;background:#2c2331;color:white; }
.legal-hero-inner { max-width:980px;margin:0 auto; }
.legal-hero h1 { margin:0;font-size:clamp(44px,6vw,76px);line-height:1.15;letter-spacing:-.055em; }
.legal-intro { max-width:760px;margin:26px 0 0;color:rgba(255,255,255,.7);font-size:17px; }
.legal-updated { display:inline-block;margin-top:32px;padding:8px 14px;border:1px solid rgba(255,255,255,.18);border-radius:999px;color:rgba(255,255,255,.65);font-size:12px; }
.legal-content { max-width:980px;margin:0 auto;padding:72px 32px 120px; }
.privacy-summary { display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:64px; }
.summary-card { padding:24px;border:1px solid var(--line);border-radius:20px;background:#fffaf6; }
.summary-card span { display:block;margin-bottom:7px;color:var(--muted);font-size:12px; }
.summary-card strong { display:block;font-size:20px;letter-spacing:-.03em; }
.summary-card strong::before { content:"✓";margin-right:8px;color:var(--wine); }
.legal-toc { margin-bottom:28px;padding:34px;border:1px solid var(--line);border-radius:24px;background:rgba(255,250,246,.62); }
.legal-toc h2 { margin:0 0 20px;font-size:18px; }
.legal-toc ol { display:grid;grid-template-columns:repeat(2,1fr);gap:10px 32px;margin:0;padding-left:22px;color:var(--muted);font-size:14px; }
.legal-toc a { text-decoration:underline;text-decoration-color:rgba(110,57,79,.25);text-underline-offset:4px; }
.legal-section { scroll-margin-top:110px;padding:46px 4px;border-bottom:1px solid var(--line); }
.legal-section h2 { margin:0 0 20px;font-size:clamp(23px,3vw,30px);letter-spacing:-.035em; }
.legal-section h3 { margin:28px 0 10px;font-size:17px; }
.legal-section p { margin:0 0 13px;color:#554b5b; }
.legal-section ul { margin:12px 0 0;padding-left:22px;color:#554b5b; }
.legal-section li + li { margin-top:8px; }
.none-table { width:100%;margin:20px 0;border-collapse:collapse;background:#fffaf6;border-radius:16px;overflow:hidden; }
.none-table th,.none-table td { padding:17px 20px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top; }
.none-table th { width:30%;color:var(--muted);font-size:13px;font-weight:600; }
.none-table tr:last-child th,.none-table tr:last-child td { border-bottom:0; }
.legal-note { margin-top:20px!important;padding:18px 20px;border-left:3px solid var(--wine);border-radius:0 12px 12px 0;background:rgba(110,57,79,.06);font-size:14px; }
.contact-panel { display:flex;align-items:center;justify-content:space-between;gap:24px;padding:26px 28px;border-radius:18px;background:#2c2331;color:white; }
.contact-panel p { margin:0;color:rgba(255,255,255,.62);font-size:13px; }
.contact-panel a { flex:none;font-weight:700;text-decoration:underline;text-underline-offset:4px; }
.remedy-list a { text-decoration:underline;text-underline-offset:3px; }
.back-home { display:inline-flex;margin-top:42px;align-items:center;gap:10px;font-size:14px;font-weight:700; }
.back-home:hover { color:var(--wine); }

@media (max-width: 980px) {
  .site-nav{display:none}.menu-toggle{display:block;margin-left:auto}.site-header.menu-open .site-nav{display:flex;position:absolute;top:84px;left:0;right:0;padding:26px 5vw 34px;background:rgba(35,26,42,.96);flex-direction:column;gap:20px}.hero{padding-left:6vw}.story-grid{grid-template-columns:1fr}.story-grid > .story-card:last-child{grid-column:auto}.horizontal{align-items:flex-start;flex-direction:column}.work-card{grid-template-columns:1fr}.work-routine .work-copy,.work-budget .work-copy{order:1}.phone-scene{order:2}.value-grid{grid-template-columns:repeat(2,1fr)}.value-card:nth-child(2){border-right:0}.value-card:nth-child(-n+2){border-bottom:1px solid var(--line)}.privacy-summary{grid-template-columns:repeat(2,1fr)}
}
@media (max-width: 640px) {
  .site-header{height:72px;padding:0 22px}.site-header.menu-open .site-nav{top:72px}.hero{min-height:860px;padding:156px 24px 100px;align-items:flex-start}.hero h1{font-size:clamp(30px,12vw,54px)}.hero-copy{font-size:min(16px,3.4vw)}.scroll-indicator{left:24px}.section{padding:92px 24px}.story-card,.quote-card{padding:30px;min-height:330px}.story-card.large{min-height:440px}.work-card{min-height:auto;border-radius:24px}.work-copy{padding:38px 28px}.phone-scene,.game-scene{min-height:430px}.phone{width:170px;height:350px;border-radius:28px}.phone-screen{border-radius:21px;padding:22px 14px}.phone-left{left:7%;top:45px}.phone-right{right:6%;top:30px}.progress-ring{width:90px;height:90px;border-width:10px;font-size:18px;margin:8px auto}.chart-bars{height:105px;margin-top:12px}.game-island{width:320px;left:-5%}.work-budget .budget-visual{min-height:390px}.budget-card{padding:28px}.value-grid{grid-template-columns:1fr}.value-card{border-right:0!important;border-bottom:1px solid var(--line);min-height:270px}.contact{min-height:580px}.contact h2 br{display:none}footer{grid-template-columns:1fr}footer>p{text-align:left}.footer-meta{flex-wrap:wrap}.footer-meta span{width:100%}.legal-main{padding-top:72px}.legal-hero{padding:72px 24px 62px}.legal-content{padding:48px 24px 88px}.privacy-summary{grid-template-columns:1fr 1fr;gap:10px}.summary-card{padding:18px}.summary-card strong{font-size:17px}.legal-toc{padding:26px 22px}.legal-toc ol{grid-template-columns:1fr}.legal-section{padding:38px 0}.none-table th,.none-table td{display:block;width:100%;padding:13px 16px}.none-table th{padding-bottom:0;border-bottom:0}.none-table td{padding-top:5px}.contact-panel{align-items:flex-start;flex-direction:column}
}
