/* Shared stylesheet for the /learn education section.
   Mirrors the legal-page look (same palette tokens) + education-specific
   components: quick-exit button, safety callouts, "What DeSpy checks" footer. */
:root{
  color-scheme: light;
  --forest:#061513; --forest-2:#0b2821; --ink:#101915; --muted:#54625b;
  --paper:#fbf8f1; --paper-2:#f4f0e7; --line:#ddd8ce; --sage:#bfe0b9;
  --sage-2:#8eb487; --cream:#fffdf8; --danger:#8a2f22; --danger-bg:#fbeeea;
  --sans:Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --serif:Georgia, "Times New Roman", ui-serif, serif;
}
*{box-sizing:border-box;}
/* Inline article illustrations (Learn batch 3): full-width cards matching the
   site's cream/line tokens. SVGs carry their own subtle animation and disable
   it under prefers-reduced-motion. */
article img{display:block;width:100%;height:auto;margin:26px 0;border:1px solid var(--line);border-radius:14px;background:var(--cream);}
html{scroll-behavior:smooth;}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);line-height:1.65;}
a{color:#1f6f4d;}
a:hover{color:#134a33;}

.learn-nav{
  position:sticky;top:0;z-index:10;display:flex;justify-content:space-between;align-items:center;
  gap:16px;padding:14px clamp(16px,5vw,40px);background:var(--forest);color:#f4faf3;
}
.learn-nav a{color:#eafaf1;text-decoration:none;}
.learn-nav .brand{font-weight:850;letter-spacing:.02em;font-size:18px;}
.learn-nav .links{display:flex;gap:18px;align-items:center;font-size:14px;}
.learn-nav .links a{opacity:.85;}
.learn-nav .links a:hover{opacity:1;}

/* Quick exit — always visible, high contrast, never mislabeled.
   Behavior lives in /assets/quickexit.js (ESC ESC also triggers it). */
.quick-exit{
  position:fixed;right:14px;bottom:14px;z-index:100;
  background:var(--danger);color:#fff;border:0;border-radius:8px;
  padding:12px 16px;font-family:var(--sans);font-size:15px;font-weight:700;
  cursor:pointer;box-shadow:0 4px 14px rgba(0,0,0,.25);
}
.quick-exit:hover{background:#6e2318;}
.quick-exit small{display:block;font-weight:400;font-size:11px;opacity:.9;}

main{max-width:820px;margin:0 auto;padding:clamp(28px,5vw,56px) clamp(18px,5vw,28px) 40px;}
.learn-header h1{font-family:var(--serif);font-size:clamp(30px,5vw,44px);line-height:1.1;margin:0 0 10px;}
.learn-meta{color:var(--muted);font-size:14px;margin:0 0 24px;}
.learn-crumbs{font-size:14px;color:var(--muted);margin:0 0 18px;}
.learn-crumbs a{color:var(--muted);}

.callout{
  background:var(--cream);border:1px solid var(--line);border-left:4px solid var(--sage-2);
  border-radius:8px;padding:16px 18px;margin:0 0 24px;
}
.callout.safety{
  border-left-color:var(--danger);background:var(--danger-bg);
}
.callout.safety strong:first-child{color:var(--danger);}

article h2{font-family:var(--serif);font-size:clamp(21px,3vw,26px);margin:34px 0 10px;padding-top:8px;border-top:1px solid var(--line);}
article h2:first-of-type{border-top:0;padding-top:0;}
article h3{font-size:17px;margin:20px 0 6px;}
article p,article li{font-size:16px;}
article ul,article ol{padding-left:22px;}
article li{margin:6px 0;}
code{background:var(--paper-2);border:1px solid var(--line);border-radius:4px;padding:1px 5px;font-size:.9em;}
.steps{background:var(--paper-2);border:1px solid var(--line);border-radius:8px;padding:14px 18px 14px 34px;margin:14px 0;}
.steps li{margin:8px 0;}

.despy-checks{
  border:1px solid var(--line);border-radius:8px;background:var(--paper-2);
  padding:16px 18px;margin:40px 0 0;
}
.despy-checks h2{border:0;margin:0 0 8px;padding:0;font-size:18px;}
.despy-checks p{font-size:15px;color:var(--muted);margin:0 0 6px;}

.learn-footer{
  border-top:1px solid var(--line);margin-top:48px;padding:26px clamp(18px,5vw,28px) 60px;
  max-width:820px;margin-left:auto;margin-right:auto;color:var(--muted);font-size:14px;
  display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center;
}
.learn-footer a{color:var(--muted);text-decoration:none;}
.learn-footer a:hover{color:var(--ink);text-decoration:underline;}
.learn-footer .sep{opacity:.4;}

/* Index page cards */
.learn-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px;margin:20px 0;}
.learn-card{
  border:1px solid var(--line);border-radius:10px;background:var(--cream);
  padding:16px 18px;display:block;text-decoration:none;color:var(--ink);
}
.learn-card:hover{border-color:var(--sage-2);color:var(--ink);}
.learn-card h3{margin:0 0 6px;font-size:17px;}
.learn-card p{margin:0;font-size:14px;color:var(--muted);}
.learn-card .soon{display:inline-block;margin-top:8px;font-size:12px;color:var(--muted);border:1px solid var(--line);border-radius:999px;padding:1px 8px;}
.section-label{font-size:13px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin:30px 0 4px;}