/* Neza site: light only. Gentle editorial — serif headlines and reading text, lots of space, few boxes. */
:root{
  color-scheme: light;
  --bg:#FBF8F3; --ink:#2B2018; --body:#3B3029; --muted:#7A6D61; --line:#E7DED3;
  --brand:#BF5B39; --brand-deep:#9E4527; --cream:#F6F4F0; --white:#FFFFFF;
  --display:"Fraunces", Georgia, "Times New Roman", serif;
  --read:"Source Serif 4", Georgia, serif;
  --ui:"Figtree", -apple-system, system-ui, "Segoe UI", sans-serif;
}
*{box-sizing:border-box}
html{background:var(--bg)}
body{margin:0;background:var(--bg);color:var(--body);font:18px/1.65 var(--read)}
a{color:var(--brand-deep);text-underline-offset:3px}
a:focus-visible{outline:2px solid var(--brand);outline-offset:3px;border-radius:3px}
.wrap{max-width:1180px;margin:0 auto;padding-inline:24px;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column}
.wrap > main{flex:1}

.site-nav{display:flex;align-items:center;gap:22px;padding-block:22px;font:500 15px var(--ui)}
.site-nav .home{display:flex;align-items:center;gap:10px;margin-right:auto;text-decoration:none;color:var(--brand);font:600 23px var(--display)}
.site-nav .home img{width:34px;height:34px;filter:drop-shadow(0 3px 6px rgba(191,91,57,.3))}
.site-nav a:not(.home){color:var(--muted);text-decoration:none}
.site-nav a:not(.home):hover,.site-nav a[aria-current]{color:var(--ink)}

/* home */
.hero{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:40px;align-items:center;padding-block:56px 40px}
@media (max-width:760px){.hero{grid-template-columns:1fr;gap:36px;padding-top:24px}}
.hero h1{font:400 clamp(40px,6vw,62px)/1.06 var(--display);color:var(--ink);letter-spacing:-.015em;margin:0 0 20px;text-wrap:balance}
.hero h1 em{color:var(--brand)}
.lede{font-size:20px;max-width:34ch;margin:0 0 26px}
.soon{font:600 15px var(--ui);color:var(--brand-deep);border-bottom:1.5px solid currentColor;padding-bottom:2px}

/* hero: app cards laid loosely on the page; a straight stack on phones */
.collage{position:relative;height:540px}
.collage::before{content:"";position:absolute;inset:8% 6%;border-radius:50%;background:radial-gradient(closest-side,rgba(217,130,98,.18),transparent)}
.card{background:var(--white);border-radius:22px;padding:18px 20px;display:grid;gap:9px;font-family:-apple-system,BlinkMacSystemFont,system-ui,var(--ui);color:var(--ink);border:1px solid #F0E8E0;box-shadow:0 24px 48px -18px rgba(90,50,25,.28),0 4px 12px rgba(90,50,25,.06)}
.collage .card{position:absolute;width:300px}
.collage .c1{top:10px;left:2%;rotate:-3deg;z-index:2}
.collage .c2{top:140px;right:0;rotate:2.5deg;z-index:3}
.collage .c3{top:280px;left:0;rotate:1.5deg;z-index:4}
.collage .c4{top:420px;right:4%;rotate:-2deg;z-index:5;width:290px}
@media (max-width:760px){.collage{height:auto;display:grid;gap:14px}.collage .card{position:static;width:auto;rotate:0deg}.collage::before{display:none}}
.card .lbl{font-size:13px;color:var(--muted)}
.card .total{font-size:38px;font-weight:700;letter-spacing:-.025em;line-height:1;font-variant-numeric:tabular-nums}
.card .pill{justify-self:start;font-size:12px;font-weight:600;color:var(--brand-deep);background:#F6E3DA;border-radius:99px;padding:3px 10px}
.card .row{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-size:14px;white-space:nowrap}
.card .row b{font-weight:600}
.card .row span{color:var(--muted)}
.card .bar{height:8px;border-radius:9px;background:#EFE4DB;overflow:hidden}
.card .bar i{display:block;height:100%;width:62%;background:var(--brand);border-radius:9px}
.card.focus{background:#F6E3DA;border-color:#F0D4C7}
.card.focus b{font-size:16px;font-weight:600;line-height:1.3}
.card .note{font-size:13px;color:var(--brand-deep);line-height:1.4}

.verse{margin:80px 0 0;padding-top:28px;border-top:1px solid var(--line);max-width:640px}
.verse p{margin:0;font:italic 400 24px/1.4 var(--display);color:var(--brand-deep)}
.verse cite{display:block;margin-top:10px;font:600 12px var(--ui);letter-spacing:.08em;text-transform:uppercase;font-style:normal;color:var(--muted)}

.features{padding-block:72px 8px;border-top:1px solid var(--line);margin-top:48px}
.features > h2{font:400 clamp(30px,4vw,40px)/1.15 var(--display);color:var(--ink);margin:0 0 10px;letter-spacing:-.01em;text-wrap:balance}
.features > p{margin:0 0 44px;max-width:52ch;font-size:19px}
.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:44px 40px}
@media (max-width:900px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.grid{grid-template-columns:1fr;gap:32px}}
.feature svg{width:28px;height:28px;color:var(--brand);margin-bottom:12px}
.feature h3{font:500 22px/1.25 var(--display);color:var(--ink);margin:0 0 6px}
.feature p{margin:0;font-size:17px}
.promise{display:flex;flex-wrap:wrap;gap:10px 28px;margin-top:56px;padding:22px 26px;border-radius:18px;background:#F4ECE4;font:500 15px var(--ui);color:var(--ink)}
.promise span::before{content:"✓";color:var(--brand);font-weight:700;margin-right:8px}

/* reading pages */
.doc{max-width:680px;padding-block:32px 24px}
.doc h1{font:400 clamp(36px,5vw,46px)/1.1 var(--display);color:var(--ink);margin:0 0 8px;letter-spacing:-.01em}
.doc .updated{font:500 14px var(--ui);color:var(--muted);margin:0 0 28px}
.doc h2{font:500 24px/1.25 var(--display);color:var(--ink);margin:40px 0 10px}
.doc p,.doc li{max-width:62ch}
.doc .muted{color:var(--muted)}
.doc table{width:100%;border-collapse:collapse;table-layout:fixed;overflow-wrap:anywhere;font-size:16px;margin:8px 0}
.doc th{font:600 12px var(--ui);letter-spacing:.07em;text-transform:uppercase;color:var(--brand-deep);text-align:left;padding:10px 8px 8px 0}
.doc td{padding:10px 8px 10px 0;border-top:1px solid var(--line);vertical-align:top}
.faq{border-top:1px solid var(--line)}
.faq:last-of-type{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px 0;font:500 20px/1.3 var(--display);color:var(--ink)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";flex:none;width:10px;height:10px;border-right:2px solid var(--brand);border-bottom:2px solid var(--brand);rotate:45deg;translate:0 -3px;transition:rotate .2s ease,translate .2s ease}
.faq[open] summary::after{rotate:225deg;translate:0 3px}
.faq summary:hover{color:var(--brand-deep)}
.faq summary:focus-visible{outline:2px solid var(--brand);outline-offset:4px;border-radius:4px}
.faq p{margin:0 0 20px;max-width:62ch}
@media (prefers-reduced-motion:reduce){.faq summary::after{transition:none}}

.site-foot{margin-top:96px;border-top:1px solid var(--line);padding-block:26px 40px;display:flex;flex-wrap:wrap;gap:8px 24px;font:14px var(--ui);color:var(--muted)}
.site-foot a{color:var(--muted)}