/* Closer — REDESIGNED brand layer: editorial warm-luxe (ink + gold + paper) */
:root{
  --brand:#1a1410; --brand2:#3d2f23; --accent:#c8962a; --accdeep:#7c5a10;
  --ink:#1a1410; --muted:#7c6f5f; --line:#e7ddcd; --bg:#faf6ef;
}
html{scroll-behavior:smooth}
.font-heading{font-family:'Fraunces',serif; font-optical-sizing:auto}
.font-body{font-family:'Inter',sans-serif}
body{-webkit-font-smoothing:antialiased; background:var(--bg)}

/* editorial hero */
.hero{background:
  radial-gradient(1200px 400px at 80% -10%, rgba(200,150,42,.10), transparent 60%),
  linear-gradient(180deg,#faf6ef,#f3ebdd)}
.hero h1{font-family:'Fraunces',serif; font-weight:600; letter-spacing:-.02em; line-height:1.05}
.hero .lead{color:var(--muted); max-width:640px; margin-inline:auto; font-size:1.05rem}

/* steps — editorial cards, not SaaS */
.card-step{background:#fff;border:1px solid var(--line);border-radius:1.25rem;padding:1.6rem;margin-bottom:1.75rem;
  box-shadow:0 1px 2px rgba(26,20,16,.04)}
.step-no{width:44px;height:44px;border-radius:14px;background:var(--brand);color:#faf6ef;display:grid;place-items:center;
  font-family:'Fraunces',serif;font-weight:600;font-size:1.15rem;flex:none}
.pill{background:#f3e9d2;color:#9a6f1c;padding:.3rem .75rem;border-radius:999px;font-weight:600}

/* score dial */
.score-card{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1rem;
  border-radius:1rem;background:#f3e9d2;border:1px solid #e7ddcd}
.radial{--v:0;width:110px;height:110px;border-radius:50%;display:grid;place-items:center;
  background:radial-gradient(closest-side,#f3e9d2 79%,transparent 80% 100%),
  conic-gradient(var(--accent) calc(var(--v)*1%),#e7ddcd 0)}
.radial span{font-family:'Fraunces',serif;font-weight:600;font-size:1.9rem;color:var(--brand)}
.radial small{font-size:.9rem;color:var(--muted)}

/* skills chips */
.skill-chip{font-size:.75rem;font-weight:600;padding:.2rem .6rem;border-radius:999px}
.chip-have{background:#e3efe3;color:#3f7a4f}
.chip-gap{background:#f7ecd2;color:#9a6f1c}

/* hover lift */
.hover-lift{transition:transform .15s ease,box-shadow .15s ease}
.hover-lift:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(26,20,16,.08)}

/* stats chips */
.stats-flex{display:flex;flex-wrap:wrap;gap:.5rem}
.stat-chip{background:#f3e9d2;border:1px solid #e7ddcd;color:#9a6f1c;border-radius:999px;
  padding:.25rem .8rem;font-size:.8rem;font-weight:600}
.stat-chip b{font-family:'Fraunces',serif}

/* final cta — editorial, not neon */
.cta-final{background:linear-gradient(135deg,#1a1410,#3d2f23);border-radius:1.5rem;padding:3rem 1.5rem;
  text-align:center;margin:1rem 0 3rem; color:#faf6ef}
.cta-final h2{font-family:'Fraunces',serif; font-weight:600}

/* tracker bits */
.stage-select{font-size:.78rem}
.trk-due{font-size:.72rem;color:#9a6f1c;font-weight:700}
.mini-btn{border:1px solid var(--line);background:#fff;border-radius:.5rem;padding:.15rem .5rem;font-size:.7rem;font-weight:700;cursor:pointer}
.mini-btn:hover{background:#f3e9d2}

/* modal */
.modal{position:fixed;inset:0;background:rgba(26,20,16,.6);display:flex;align-items:center;justify-content:center;z-index:100;padding:1rem}
.modal-card{background:#fff;border-radius:1.25rem;padding:1.6rem;max-width:430px;width:100%;position:relative;max-height:90vh;overflow:auto;
  font-family:'Inter',sans-serif}
.modal-x{position:absolute;top:.7rem;right:.7rem;border:none;background:#f3e9d2;border-radius:.5rem;width:30px;height:30px;cursor:pointer;font-weight:700}
.qr-box{display:flex;gap:1rem;align-items:center;margin-top:1rem}
.qr-box img{border:1px solid var(--line);border-radius:.75rem;background:#fff;flex:none}
.pay-steps{margin:0;padding-left:1.1rem;font-size:.85rem;color:var(--muted)}
.code-row{display:flex;gap:.5rem;margin-top:1rem}
.code-msg.ok{color:#0e9f6e}
.code-msg.bad{color:#dc2626}

/* toast */
.toast{position:fixed;bottom:1.5rem;left:50%;transform:translateX(-50%);background:var(--ink);color:#fff;
  padding:.6rem 1.2rem;border-radius:.75rem;font-weight:600;font-size:.9rem;z-index:200;opacity:.95}

@media print{
  .card-step{border:none;box-shadow:none;padding:0}
  body .no-print{display:none!important}
}
