
:root{--ink:#17212b;--muted:#5d6b78;--bg:#f5f7f8;--surface:#ffffff;--line:#dbe2e8;--accent:#275d68;--accent2:#dff1ed;--warm:#fff4d7;--danger:#8b3a3a;--shadow:0 14px 35px rgba(27,49,66,.09);--radius:20px}
*{box-sizing:border-box} html{scroll-behavior:smooth} body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--bg);line-height:1.65} a{color:inherit} button,input,textarea{font:inherit}
.skip{position:absolute;left:-9999px;top:auto}.skip:focus{left:1rem;top:1rem;background:#fff;padding:.7rem 1rem;z-index:50;border-radius:10px}
.site-header{background:#12333b;color:#fff;position:sticky;top:0;z-index:20;box-shadow:0 2px 18px rgba(0,0,0,.12)}.header-inner{max-width:1120px;margin:auto;padding:.8rem 1.25rem;display:flex;align-items:center;justify-content:space-between;gap:1rem}.brand{text-decoration:none;font-weight:800;letter-spacing:.2px}.top-nav{display:flex;gap:.45rem;flex-wrap:wrap}.top-nav a{text-decoration:none;color:#eaf5f3;padding:.45rem .7rem;border-radius:9px}.top-nav a:hover,.top-nav a:focus{background:rgba(255,255,255,.12)}
main{max-width:1120px;margin:auto;padding:2rem 1.25rem 4rem}.hero{display:grid;grid-template-columns:1fr;gap:2rem;align-items:center;padding:3.2rem 0 2rem}.eyebrow{text-transform:uppercase;letter-spacing:.14em;font-size:.78rem;font-weight:800;color:var(--accent)}.hero h1,.page-title{font-size:clamp(2.2rem,5vw,4.5rem);line-height:1.02;margin:.35rem 0 1rem;letter-spacing:-.045em}.hero p{font-size:1.15rem;color:var(--muted);max-width:720px}.hero-panel{background:#12333b;color:#fff;padding:1.5rem;border-radius:var(--radius);box-shadow:var(--shadow)}.habit-mini{display:grid;grid-template-columns:1fr 1fr;gap:.6rem}.habit-mini span{background:rgba(255,255,255,.09);padding:.7rem;border-radius:12px;font-size:.9rem}
.choice-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.25rem;margin:2rem 0}.choice-card,.case-card,.section-card,.activity,.quiz-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}.choice-card{padding:1.7rem;text-decoration:none;transition:.2s transform,.2s box-shadow}.choice-card:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(27,49,66,.13)}.choice-card h2{margin:.25rem 0 .45rem;font-size:1.55rem}.choice-card p{color:var(--muted);margin:.25rem 0}.icon-box{width:48px;height:48px;border-radius:14px;background:var(--accent2);display:grid;place-items:center;font-size:1.35rem}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:1rem;margin:1.5rem 0}.section-head h1,.section-head h2{margin:.2rem 0}.muted{color:var(--muted)}.case-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.case-card{padding:1.35rem;display:flex;flex-direction:column;gap:.6rem}.case-card h2{font-size:1.25rem;line-height:1.25;margin:0}.case-card p{margin:0;color:var(--muted)}.case-card .btn{margin-top:auto;align-self:flex-start}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;border:0;border-radius:11px;padding:.72rem 1rem;text-decoration:none;font-weight:750;cursor:pointer;background:var(--accent);color:#fff}.btn.secondary{background:#e7eef0;color:#19363d}.btn.ghost{background:transparent;color:var(--accent);border:1px solid #b8c8ce}.btn:focus{outline:3px solid #95c9c0;outline-offset:2px}.btn[disabled],.disabled{opacity:.45;pointer-events:none}
.breadcrumbs{font-size:.9rem;color:var(--muted);margin-bottom:1rem}.breadcrumbs a{color:var(--accent)}.case-intro{padding:1rem 0 1.4rem;border-bottom:1px solid var(--line);margin-bottom:1.4rem}.case-intro h1{font-size:clamp(2rem,4vw,3.3rem);line-height:1.1;margin:.25rem 0 .7rem}.progress-chip{display:inline-block;background:var(--accent2);color:#17464d;border-radius:999px;padding:.35rem .7rem;font-size:.85rem;font-weight:700}.section-card{padding:1.5rem;margin:1rem 0}.section-card h2{margin-top:0}.section-card h3{margin-bottom:.35rem}.section-card p{margin:.6rem 0}.message{background:#f0f5f6;border-left:4px solid var(--accent);padding:1rem 1.1rem;border-radius:0 12px 12px 0;font-size:1.02rem;margin:1rem 0}.habit-label{display:inline-block;background:var(--warm);padding:.2rem .55rem;border-radius:999px;font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em}.activities{display:grid;gap:1rem}.activity{padding:1.35rem}.activity h3{margin-top:0}.activity textarea{width:100%;min-height:100px;resize:vertical;border:1px solid #cbd6db;border-radius:12px;padding:.8rem;margin:.5rem 0 .8rem;background:#fbfcfc}.suggested{display:none;margin-top:1rem;background:#edf7f4;border-left:4px solid #438a7d;padding:1rem;border-radius:0 12px 12px 0}.suggested.show{display:block}.activity-actions{display:flex;gap:.6rem;flex-wrap:wrap}
.case-nav{display:grid;grid-template-columns:1fr auto 1fr;gap:.7rem;align-items:center;margin-top:2rem;padding-top:1.3rem;border-top:1px solid var(--line)}.case-nav .next{justify-self:end}.case-nav .directory{justify-self:center}
.quiz-shell{max-width:850px;margin:auto}.quiz-card{padding:1.35rem;margin:1rem 0}.quiz-card h2{font-size:1.1rem;margin-top:0}.option{display:flex;gap:.7rem;align-items:flex-start;padding:.7rem;border:1px solid #dbe2e8;border-radius:11px;margin:.55rem 0;cursor:pointer}.option:has(input:checked){border-color:#5e9990;background:#edf7f4}.feedback{display:none;margin-top:.7rem;padding:.65rem .8rem;border-radius:10px}.feedback.correct{display:block;background:#e4f5eb}.feedback.incorrect{display:block;background:#fae7e7;color:#6a2525}.scorebox{display:none;background:#12333b;color:white;border-radius:var(--radius);padding:1.3rem;margin:1.2rem 0}.scorebox.show{display:block}.quiz-actions{display:flex;gap:.7rem;flex-wrap:wrap;position:sticky;bottom:1rem;background:rgba(245,247,248,.94);backdrop-filter:blur(8px);padding:.8rem;border:1px solid var(--line);border-radius:16px}
.footer-note{margin-top:3rem;color:var(--muted);font-size:.9rem;text-align:center}.pill-row{display:flex;gap:.5rem;flex-wrap:wrap}.pill{background:#e8eff1;border-radius:999px;padding:.35rem .7rem;font-size:.85rem}
@media(max-width:800px){.hero{grid-template-columns:1fr}.choice-grid,.case-grid{grid-template-columns:1fr}.case-nav{grid-template-columns:1fr 1fr}.case-nav .directory{grid-column:1/-1;grid-row:2}.header-inner{align-items:flex-start}.top-nav{justify-content:flex-end}.hero{padding-top:2rem}}
@media(max-width:520px){main{padding-left:1rem;padding-right:1rem}.site-header{position:static}.header-inner{display:block}.top-nav{margin-top:.5rem}.case-nav{grid-template-columns:1fr}.case-nav .directory{grid-column:auto;grid-row:auto}.case-nav .next,.case-nav .directory{justify-self:stretch}.case-nav a{width:100%}}
