/* ScholarRoads — shared styles for content pages (teal + cream) */
:root{
  --teal:#12a191; --teal-d:#0c8073; --teal-l:#57c6ba;
  --cream:#fbf6ec; --cream-2:#f3ead6; --ink:#1b2f2b; --muted:#5c6d67;
  --coral:#ff8a5b; --gold:#e9b24a; --line:#e8ddc7; --radius:20px; --max:900px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{color:var(--ink);background:var(--cream);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden;
  display:flex;flex-direction:column;min-height:100vh}
body::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(36% 32% at 8% 6%, rgba(18,161,145,.14), transparent 62%),
    radial-gradient(34% 32% at 94% 8%, rgba(255,138,91,.12), transparent 62%),
    radial-gradient(38% 38% at 96% 72%, rgba(18,161,145,.10), transparent 62%),
    linear-gradient(180deg,#fbf6ec 0%, #f7f1e3 60%, #fbf6ec 100%)}
.wrap{position:relative;z-index:1;max-width:var(--max);margin:0 auto;padding:0 22px}
a{color:var(--teal-d);text-decoration:none} a:hover{color:var(--teal)}

.topbar{position:sticky;top:0;z-index:20;background:rgba(251,246,236,.85);
  backdrop-filter:blur(12px);border-bottom:1px solid rgba(232,221,199,.7)}
.topbar .inner{max-width:1120px;margin:0 auto;padding:15px 22px;display:flex;align-items:center;justify-content:space-between}
.logo{display:flex;align-items:center;gap:0;font-weight:800;font-size:22px;color:var(--ink)}
.logo .mk{width:36px;height:36px;border-radius:10px;margin-right:11px;background:linear-gradient(150deg,var(--teal),var(--teal-d));
  display:flex;align-items:center;justify-content:center;flex:0 0 auto;box-shadow:0 8px 18px -8px rgba(12,128,115,.6)}
.logo .mk svg{width:21px;height:21px}
.logo span{color:var(--teal-d)}
.logo:hover{color:var(--ink)}
.topbar .btn{display:inline-flex;align-items:center;gap:6px;background:#fff;border:1.5px solid var(--line);
  color:var(--ink);font-weight:700;font-size:14px;padding:9px 16px;border-radius:999px}
.topbar .btn:hover{border-color:var(--teal-l);color:var(--ink)}
.topnav{display:flex;align-items:center;gap:22px}
.topnav a{font-weight:700;font-size:15px;color:var(--ink)}
.topnav a:hover{color:var(--teal-d)}
.topnav .navcta{display:inline-flex;align-items:center;gap:8px;background:linear-gradient(180deg,var(--teal),var(--teal-d));
  color:#fff;padding:9px 16px;border-radius:999px;font-size:14px}
.topnav .navcta:hover{color:#fff;transform:translateY(-1px);transition:.15s}
@media(max-width:640px){.topnav a:not(.navcta){display:none}}

main.wrap{position:relative;z-index:1;flex:1 0 auto;display:flex;flex-direction:column;padding:56px 22px 56px}
.page{display:block;margin:auto 0}
.doc{max-width:820px;margin:0 auto;background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:44px 46px;box-shadow:0 30px 60px -34px rgba(27,47,43,.4)}
@media(max-width:560px){.doc{padding:30px 22px}}
.doc h1{font-size:34px;font-weight:800;letter-spacing:-.4px;color:var(--ink);line-height:1.15}
.doc .updated{color:var(--muted);font-size:13.5px;margin-top:8px}
.doc h2{font-size:20px;font-weight:800;margin:30px 0 8px;color:var(--ink)}
.doc p{color:#33443f;font-size:16px;margin:12px 0}
.doc ul{margin:12px 0 12px 22px;color:#33443f;font-size:16px}
.doc li{margin:7px 0}
.doc strong{color:var(--ink)}
.doc a{font-weight:600;text-decoration:underline}
.doc .back{display:inline-block;margin-top:28px;font-weight:700;text-decoration:none;color:var(--teal-d)}
.callout{background:var(--cream-2);border-left:4px solid var(--teal);border-radius:12px;padding:16px 18px;margin:18px 0}
.callout p{margin:0;font-size:15px;color:#33443f}

footer{position:relative;z-index:1;border-top:1px solid var(--line);padding:30px 0 44px;text-align:center;color:var(--muted);font-size:13px;background:rgba(243,234,214,.4)}
footer .brandline{font-weight:800;color:var(--ink);margin-bottom:10px}
footer .brandline span{color:var(--teal-d)}
footer .legal{display:flex;gap:14px 16px;justify-content:center;flex-wrap:wrap;margin-bottom:12px}
footer .disc{max-width:770px;margin:10px auto 0;font-size:12px;line-height:1.6}