:root{
  --bg:#0b0f16; --bg2:#0e1420; --panel:#121a2a; --ring:rgba(255,255,255,.16);
  --ink:#e8eefc; --muted:#aeb9cf; --gold:#ffd86b; --gold2:#fff2bf; --card:rgba(255,255,255,.06);
}
*{box-sizing:border-box} html,body{height:100%}
body{margin:0; font:16px/1.65 system-ui,-apple-system,Segoe UI,Inter,Roboto,Arial;
     color:var(--ink);
     background:
      radial-gradient(1200px 600px at 50% -10%, #1f2a45 0%, transparent 60%),
      linear-gradient(180deg, var(--bg), var(--bg2));}
.container{max-width:1040px; margin:0 auto; padding:24px}
header.nav{position:sticky; top:0; z-index:30; backdrop-filter:blur(10px);
  background:linear-gradient(180deg, rgba(9,14,25,.85), rgba(9,14,25,.55));
  border-bottom:1px solid var(--ring);}
.nav-inner{display:flex; align-items:center; justify-content:space-between; padding:14px 20px}
.brand{letter-spacing:.22em; font-weight:800}
nav a{color:var(--muted); text-decoration:none; margin-left:16px; padding:8px 10px; border-radius:10px}
nav a:hover, nav a.active{color:var(--ink); background:rgba(255,255,255,.08)}
.hero{padding:70px 24px 36px; text-align:center}
.halo{margin:0 auto 20px; width:min(980px,92vw); padding:28px; border-radius:22px;
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.04));
  border:1px solid var(--ring); box-shadow:0 18px 60px rgba(0,0,0,.45);}
h1{font-size:clamp(32px,5vw,54px); line-height:1.1; margin:0 0 10px}
.lead{color:var(--muted); max-width:58ch; margin:0 auto}
.cta-row{display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin-top:18px}
.btn{appearance:none; border:1px solid var(--ring); border-radius:14px; padding:12px 16px; color:var(--ink);
  background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02)); text-decoration:none; font-weight:700;}
.btn:hover{transform:translateY(-1px)}
.btn.primary{border-color:#4ea3ff66; background:linear-gradient(180deg,#26324a,#172234)}
.btn.gold{border-color:#8a6b2666; background:linear-gradient(180deg,#6c5220,#3a2a0e); color:#ffe9b0}
section{scroll-margin-top:86px; padding:40px 0}
.panel{background:var(--card); border:1px solid var(--ring); border-radius:18px; padding:22px; box-shadow:inset 0 0 1px rgba(255,255,255,.35)}
.grid{display:grid; gap:16px}
@media(min-width:840px){ .cols-2{grid-template-columns:1fr 1fr} .cols-3{grid-template-columns:repeat(3,1fr)} }
.small{font-size:14px; color:var(--muted)}
.card{background:var(--card); border:1px solid var(--ring); border-radius:14px; padding:16px}
.kintsugi{border-color:rgba(255,216,107,.35)}
.money{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin:14px 0}
.money a{display:block; text-align:center; text-decoration:none; color:#1a1404; font-weight:800; border-radius:12px; padding:12px 10px;
  background:linear-gradient(180deg, rgba(255,216,107,.95), rgba(255,216,107,.82)); border:1px solid #a38434aa}
.copy{display:flex; gap:10px; align-items:center; flex-wrap:wrap}
.copy code{padding:8px 10px; border-radius:10px; background:#0f1621; border:1px solid var(--ring); word-break:break-all}
.copy button{padding:10px 12px; border-radius:10px; border:1px solid var(--ring); background:rgba(255,255,255,.06); color:var(--ink); font-weight:700}
footer{padding:36px 20px 64px; text-align:center; color:#a9b6c8; border-top:1px solid var(--ring); margin-top:36px}
hr.rule{border:0; height:1px; background:linear-gradient(90deg, #ffffff00, #ffffff22, #ffffff00); margin:14px 0}
/* Scripture-specific */
.scripture{max-width:860px; margin:0 auto; line-height:1.75}
.scripture h2{font-size:22px; letter-spacing:.05em; color:var(--gold2); margin:0 0 8px}
.scripture p{margin:10px 0}
.divider{margin:22px auto; text-align:center; opacity:.85; color:#cfd6e8}
blockquote{margin:10px 0; padding-left:14px; border-left:2px solid #ffffff2a; color:#d9e3f6}
a.simple{color:#8ed0ff}
