/* Clinical Education Bytesize — shared styles (palette and type carried over from the original landing page) */
:root{
  --ink:#1B2622;
  --ink-soft:#4B5A52;
  --paper:#EAE7DA;
  --paper-raised:#F3F1E6;
  --teal:#14615A;
  --teal-deep:#0E4A45;
  --amber:#8F5C1F;
  --line:#C9C3AE;
  --line-soft:#DAD5C4;
  --link:var(--teal-deep);
  --btn-bg:var(--teal-deep);
  --btn-fg:#F3F1E6;
  color-scheme: light;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --ink:#ECE7DC;
    --ink-soft:#B7C2BB;
    --paper:#141F1B;
    --paper-raised:#1B2925;
    --teal:#57BAAC;
    --teal-deep:#3E9A8D;
    --amber:#D99A4E;
    --line:#33423B;
    --line-soft:#283530;
    --link:#57BAAC;
    --btn-bg:#57BAAC;
    --btn-fg:#0E1613;
    color-scheme: dark;
  }
}
:root[data-theme="dark"]{
  --ink:#ECE7DC; --ink-soft:#B7C2BB; --paper:#141F1B; --paper-raised:#1B2925;
  --teal:#57BAAC; --teal-deep:#3E9A8D; --amber:#D99A4E; --line:#33423B; --line-soft:#283530;
  --link:#57BAAC; --btn-bg:#57BAAC; --btn-fg:#0E1613; color-scheme: dark;
}

*{box-sizing:border-box;}
html,body{margin:0;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion: reduce){ html{scroll-behavior:auto;} }
body{
  background:var(--paper);
  color:var(--ink);
  font-family:"IBM Plex Sans", ui-sans-serif, system-ui, sans-serif;
  font-size:16px;
  line-height:1.6;
  padding-inline:16px;
}
.wrap{max-width:820px;margin:0 auto;}
h1,h2,h3{font-family:"Spectral", Georgia, serif;font-weight:600;text-wrap:balance;margin:0;}
.mono,.num{font-family:"IBM Plex Mono", ui-monospace, monospace;font-variant-numeric:tabular-nums;}
a{color:var(--link);}
a:focus-visible,.btn:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:2px solid var(--amber);outline-offset:3px;
}
.skip{position:absolute;left:-9999px;top:8px;background:var(--paper-raised);padding:8px 12px;z-index:10;}
.skip:focus{left:16px;}

/* masthead */
.masthead{
  display:flex;align-items:center;justify-content:space-between;
  padding-block:18px 14px;border-bottom:1px solid var(--line-soft);
  gap:12px 20px;flex-wrap:wrap;
}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);}
.brand img{width:34px;height:34px;border-radius:50%;background:#fff;}
.brand span{font-family:"IBM Plex Mono", monospace;font-size:12.5px;letter-spacing:.09em;text-transform:uppercase;}
.brand b{font-weight:600;}
nav.main ul{list-style:none;margin:0;padding:0;display:flex;gap:4px 18px;flex-wrap:wrap;}
nav.main a{
  font-family:"IBM Plex Mono", monospace;font-size:13px;letter-spacing:.04em;
  color:var(--ink-soft);text-decoration:none;padding:6px 0;display:inline-block;
}
nav.main a:hover,nav.main a[aria-current="page"]{color:var(--ink);text-decoration:underline;text-underline-offset:5px;text-decoration-color:var(--amber);}

/* hero */
.hero{padding-block:44px 30px;}
.eyebrow{
  font-family:"IBM Plex Mono", monospace;font-size:12.5px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--amber);margin-bottom:14px;display:block;
}
.hero h1{font-size:clamp(2rem, 5.4vw, 3rem);line-height:1.12;max-width:20ch;}
.hero .sub{
  font-family:"Spectral", serif;font-style:italic;font-weight:400;
  font-size:1.2rem;color:var(--ink-soft);margin:16px 0 0;max-width:46ch;
}
.cta-row{display:flex;gap:14px 18px;align-items:center;margin-top:28px;flex-wrap:wrap;}
.btn{
  font-family:"IBM Plex Sans", ui-sans-serif, system-ui, sans-serif;font-weight:600;font-size:15px;
  background:var(--btn-bg);color:var(--btn-fg);
  padding:12px 20px;border-radius:3px;text-decoration:none;border:1px solid var(--btn-bg);
  display:inline-flex;align-items:center;gap:10px;cursor:pointer;
}
.btn:hover{filter:brightness(1.08);}
.btn.ghost{background:transparent;color:var(--link);border-color:var(--line);}
.note{font-family:"IBM Plex Mono", monospace;font-size:13px;color:var(--ink-soft);}

/* sections */
section{padding-block:44px;border-top:1px solid var(--line-soft);}
.kicker{
  font-family:"IBM Plex Mono", monospace;font-size:12px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink-soft);margin-bottom:14px;display:block;
}
section h2{font-size:1.5rem;margin-bottom:22px;}
section p{max-width:62ch;}
.lead{font-size:1.06rem;}

/* course cards */
.courses{display:flex;flex-direction:column;}
.course{
  display:grid;grid-template-columns:76px 1fr;gap:6px 20px;
  padding-block:26px;border-bottom:1px solid var(--line-soft);
}
.course:first-child{padding-top:4px;}
.course:last-child{border-bottom:none;}
.course .code{font-family:"IBM Plex Mono", monospace;font-size:13px;color:var(--amber);padding-top:6px;}
.course h3{font-size:1.35rem;line-height:1.25;}
.course h3 a{color:var(--ink);text-decoration:none;}
.course h3 a:hover{text-decoration:underline;text-decoration-color:var(--amber);text-underline-offset:4px;}
.course p{margin:8px 0 0;color:var(--ink-soft);}
.course .meta{font-family:"IBM Plex Mono", monospace;font-size:12.5px;color:var(--ink-soft);margin-top:10px;}
.course .links{display:flex;gap:12px 20px;flex-wrap:wrap;margin-top:16px;align-items:center;}
.course .links a.more{font-weight:600;}

/* features / list rows */
.rows{display:grid;gap:0;}
.row{display:grid;grid-template-columns:auto 1fr;gap:14px;padding-block:14px;border-bottom:1px dashed var(--line-soft);}
.row:last-child{border-bottom:none;}
.row .mk{font-family:"IBM Plex Mono", monospace;color:var(--amber);font-size:14px;padding-top:2px;}
.row p{margin:0;}
.row b{font-weight:600;}

.grid2{display:grid;grid-template-columns:repeat(2, minmax(0,1fr));gap:18px;}
.panel{background:var(--paper-raised);border:1px solid var(--line);border-radius:4px;padding:22px;}
.panel h3{font-size:1.1rem;margin-bottom:8px;}
.panel p{margin:0;color:var(--ink-soft);}

/* curriculum */
.curriculum{display:flex;flex-direction:column;}
.mod{display:grid;grid-template-columns:44px 1fr auto;gap:16px;align-items:baseline;padding-block:15px;border-bottom:1px solid var(--line-soft);}
.mod:last-child{border-bottom:none;}
.mod .n{font-family:"IBM Plex Mono", monospace;color:var(--ink-soft);font-size:14px;}
.mod .t{font-family:"Spectral", serif;font-weight:600;font-size:1.04rem;}
.mod .t span{display:block;font-family:"IBM Plex Sans", ui-sans-serif, system-ui, sans-serif;font-weight:400;font-size:.9rem;color:var(--ink-soft);margin-top:3px;}
.mod .d{font-family:"IBM Plex Mono", monospace;font-size:13px;color:var(--ink-soft);white-space:nowrap;}
.facts{display:flex;gap:20px 36px;flex-wrap:wrap;margin-top:26px;}
.fact .v{font-family:"IBM Plex Mono", monospace;font-size:1.4rem;color:var(--ink);}
.fact .l{font-size:12.5px;color:var(--ink-soft);margin-top:2px;}

/* diagrams */
.chart-block{margin-top:8px;}
svg.chart{width:100%;height:auto;display:block;}
.chart-line{fill:none;stroke:var(--teal-deep);stroke-width:2.5;}
.chart-target{stroke:var(--amber);stroke-width:1.3;stroke-dasharray:4 4;}
.chart-grid{stroke:var(--line);stroke-width:1;}
.chart-tick{fill:var(--ink-soft);font-family:"IBM Plex Mono", monospace;font-size:11px;}
.chart-label{fill:var(--ink);font-family:"IBM Plex Mono", monospace;font-size:11px;font-weight:500;}
.chart-dot{fill:var(--teal-deep);stroke:var(--paper);stroke-width:2;}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .chart-line{stroke:var(--teal);}
  :root:not([data-theme="light"]) .chart-dot{fill:var(--teal);}
}
.caption{font-family:"IBM Plex Mono", monospace;font-size:12px;color:var(--ink-soft);letter-spacing:.03em;margin-top:10px;}

.steps{display:grid;grid-template-columns:repeat(4, minmax(0,1fr));border:1px solid var(--line);border-radius:4px;overflow:hidden;background:var(--paper-raised);}
.step{padding:18px 16px;border-right:1px solid var(--line);}
.step:last-child{border-right:none;}
.step .s{font-family:"IBM Plex Mono", monospace;font-size:12px;color:var(--amber);letter-spacing:.06em;}
.step h3{font-size:1.02rem;margin:6px 0 4px;}
.step p{margin:0;font-size:.9rem;color:var(--ink-soft);}

.balance{display:grid;grid-template-columns:1fr auto 1fr;gap:0;align-items:stretch;}
.balance .side{background:var(--paper-raised);border:1px solid var(--line);border-radius:4px;padding:18px;}
.balance .side h3{font-size:1.02rem;margin-bottom:6px;}
.balance .side p{margin:0;font-size:.9rem;color:var(--ink-soft);}
.balance .mid{display:flex;align-items:center;justify-content:center;padding:0 14px;font-family:"IBM Plex Mono", monospace;font-size:12px;color:var(--amber);text-align:center;}
.balance-out{margin-top:12px;border:1px solid var(--teal-deep);border-radius:4px;padding:14px 18px;font-family:"Spectral", serif;font-weight:600;text-align:center;}

.callout{border-left:3px solid var(--amber);padding:6px 0 6px 18px;margin-top:8px;}
.callout p{margin:0;color:var(--ink-soft);}

/* author */
.author{display:flex;gap:18px;align-items:flex-start;}
.author img{width:48px;height:48px;border-radius:50%;background:#fff;flex:none;}
.author p{margin:0;max-width:58ch;}
.author .role{font-family:"IBM Plex Mono", monospace;font-size:12px;color:var(--ink-soft);margin-top:8px;letter-spacing:.02em;}

/* closing */
.closing{
  background:var(--paper-raised);border:1px solid var(--line);
  padding:30px;border-radius:4px;
  display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;
}
.closing h2{font-size:1.35rem;max-width:28ch;margin:0;}

/* forms */
form.f{display:grid;gap:16px;max-width:560px;}
form.f label{display:block;font-weight:500;font-size:.95rem;margin-bottom:6px;}
form.f input,form.f select,form.f textarea{
  width:100%;font:inherit;color:var(--ink);background:var(--paper-raised);
  border:1px solid var(--line);border-radius:3px;padding:11px 12px;
}
form.f textarea{min-height:150px;resize:vertical;}
form.f .hint{font-size:.85rem;color:var(--ink-soft);margin-top:4px;}
.hp{position:absolute;left:-9999px;}

.prose h2{font-size:1.25rem;margin:30px 0 10px;}
.prose h2:first-child{margin-top:0;}
.prose ul{padding-left:20px;max-width:62ch;}
.prose li{margin-bottom:6px;}

footer{
  border-top:1px solid var(--line-soft);
  padding-block:28px 44px;
  display:grid;gap:18px;
  font-size:12.5px;color:var(--ink-soft);
}
footer .fnav{display:flex;gap:6px 18px;flex-wrap:wrap;font-family:"IBM Plex Mono", monospace;}
footer .fnav a{color:var(--ink-soft);}
footer .disclaimer{max-width:70ch;line-height:1.55;margin:0;}

@media (max-width:640px){
  .course{grid-template-columns:1fr;}
  .course .code{padding-top:0;}
  .mod{grid-template-columns:32px 1fr;row-gap:2px;}
  .mod .d{grid-column:2;}
  .closing{flex-direction:column;align-items:flex-start;}
  .grid2{grid-template-columns:1fr;}
  .steps{grid-template-columns:1fr 1fr;}
  .step:nth-child(2){border-right:none;}
  .step:nth-child(-n+2){border-bottom:1px solid var(--line);}
  .balance{grid-template-columns:1fr;}
  .balance .mid{padding:10px 0;}
}
