/* Case-study pages (projects/*.html) only. Shared tokens/primitives
   (nav chrome, .cov, .kicker, .tag, section, footer) live in base.css. */

:root{ --maxw:820px; }

nav .wrap{max-width:920px;}
nav .back{
  display:inline-flex;align-items:center;gap:6px;
  color:var(--ink-soft);text-decoration:none;font-size:14px;font-weight:500;
}
nav .back:hover{color:var(--teal);}

/* HERO */
header.hero{padding:56px 0 40px;}
h1.title{font-size:clamp(30px,5vw,44px);font-weight:700;line-height:1.08;}
.dek{max-width:640px;font-size:17px;color:var(--ink-soft);margin-top:18px;}
.meta-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px;}
.cov{margin:22px 0 4px;}

article section{padding:44px 0;}
article h2.section-title{margin-bottom:16px;}
.lede{font-size:15.5px;color:var(--ink-soft);margin:0 0 14px;}
h3.sub{font-size:16px;margin:28px 0 10px;}
h3.sub:first-child{margin-top:0;}

/* PULLQUOTE / CALLOUT */
.callout{
  border-left:2px solid var(--amber);background:var(--amber-dim);
  padding:14px 18px;border-radius:0 8px 8px 0;margin:20px 0;
  font-size:14.5px;color:#5c4213;
}
.callout b{color:#3d2c0d;}

/* LOOP DIAGRAM */
.loop{
  display:flex;flex-wrap:wrap;gap:0;align-items:stretch;margin:26px 0 8px;
}
.loop-step{
  background:var(--surface);border:1px solid var(--line);border-radius:8px;
  padding:14px 16px;flex:1 1 150px;min-width:150px;
}
.loop-step .n{
  font-family:'IBM Plex Mono';font-size:11px;color:var(--teal);margin-bottom:6px;
}
.loop-step .t{font-size:13.5px;font-weight:600;}
.loop-step .d{font-size:12.5px;color:var(--ink-soft);margin-top:4px;line-height:1.45;}
.loop-arrow{
  display:flex;align-items:center;justify-content:center;
  color:var(--ink-faint);font-size:16px;padding:0 6px;flex:0 0 auto;
}
@media (max-width:640px){
  .loop{flex-direction:column;}
  .loop-arrow{transform:rotate(90deg);padding:4px 0;}
}
.loop-branch{
  display:flex;gap:10px;margin-top:10px;
}
.loop-branch .loop-step{flex:1;}
.loop-step.branch-yes{border-color:var(--teal);}
.loop-step.branch-no{border-color:var(--ink-faint);}

/* BENCHMARK TABLE */
.bench-grid{display:grid;grid-template-columns:1fr;gap:0;margin-top:18px;border-top:1px solid var(--line);}
.bench-row{
  display:grid;grid-template-columns:230px 1fr;gap:16px;padding:13px 0;border-bottom:1px solid var(--line);
}
@media (max-width:600px){ .bench-row{grid-template-columns:1fr;gap:6px;} }
.bench-cat{font-size:13px;font-weight:600;color:var(--navy);}
.bench-items{display:flex;flex-wrap:wrap;gap:6px;}
.bench-tag{
  font-family:'IBM Plex Mono';font-size:11.5px;color:var(--ink-soft);
  background:var(--bg);border:1px solid var(--line);padding:3px 8px;border-radius:5px;
}

/* CODE PANEL */
.code-panel{
  background:var(--navy);color:#DCE8E0;border-radius:10px;padding:20px 22px;
  font-family:'IBM Plex Mono',monospace;font-size:12.5px;line-height:1.7;
  overflow-x:auto;margin:20px 0;
  white-space:pre;
}
.code-panel .cmt{color:#7C93A8;}
.code-panel .key{color:#7FD9BE;}
.code-panel .str{color:#F2C78A;}
.code-label{
  font-family:'IBM Plex Mono';font-size:11px;color:var(--ink-faint);
  text-transform:uppercase;letter-spacing:0.05em;margin-bottom:8px;
}

/* RULE LIST */
.rule-list{list-style:none;margin:18px 0;padding:0;display:flex;flex-direction:column;gap:14px;}
.rule-list li{padding-left:26px;position:relative;font-size:14.5px;color:var(--ink-soft);}
.rule-list li::before{
  content:attr(data-n);position:absolute;left:0;top:0;
  font-family:'IBM Plex Mono';font-size:11px;color:var(--teal);
  width:18px;height:18px;border:1px solid var(--teal);border-radius:50%;
  display:flex;align-items:center;justify-content:center;
}
.rule-list b{color:var(--ink);}

/* WORKED / DIDN'T-WORK COMPARISON */
.verdict-cols{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:18px;}
@media (max-width:640px){ .verdict-cols{grid-template-columns:1fr;} }
.verdict-col h4{
  font-family:'IBM Plex Mono';font-size:11px;text-transform:uppercase;letter-spacing:0.05em;
  margin-bottom:12px;
}
.verdict-col.worked h4{color:var(--teal);}
.verdict-col.didnt h4{color:var(--coral);}
.verdict-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px;}
.verdict-list li{padding-left:22px;position:relative;font-size:14px;color:var(--ink-soft);line-height:1.5;}
.verdict-list li::before{position:absolute;left:0;top:0;font-family:'IBM Plex Mono';font-size:13px;}
.verdict-col.worked .verdict-list li::before{content:'✓';color:var(--teal);}
.verdict-col.didnt .verdict-list li::before{content:'✗';color:var(--coral);}

/* SCREENSHOTS */
.screenshot-figure{margin:22px 0;}
.screenshot{
  width:100%;display:block;border:1px solid var(--line);border-radius:10px;
}
.screenshot-caption{
  font-family:'IBM Plex Mono';font-size:11.5px;color:var(--ink-faint);
  margin-top:8px;line-height:1.5;
}

/* STRATEGY CARDS — parallel retrieval strategies feeding one merge point */
.strategy-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:22px 0 4px;}
@media (max-width:640px){ .strategy-grid{grid-template-columns:1fr;} }
.strategy-card{
  background:var(--surface);border:1px solid var(--line);border-left:3px solid var(--line);
  border-radius:8px;padding:14px 16px;
}
.strategy-card .t{font-size:13.5px;font-weight:600;}
.strategy-card .d{font-size:12.5px;color:var(--ink-soft);margin-top:4px;line-height:1.5;}
.strategy-card.c-teal{border-left-color:var(--teal);}
.strategy-card.c-navy{border-left-color:var(--navy);}
.strategy-card.c-amber{border-left-color:var(--amber);}
.strategy-card.c-coral{border-left-color:var(--coral);}

/* DATA TABLE — for results grids with a numeric column per condition */
.data-table{width:100%;border-collapse:collapse;margin:20px 0;font-size:13.5px;overflow-x:auto;display:block;}
.data-table thead{display:table-header-group;}
.data-table tbody{display:table-row-group;}
.data-table, .data-table tr{width:100%;}
.data-table th, .data-table td{
  padding:9px 12px;text-align:left;border-bottom:1px solid var(--line);
  font-family:'IBM Plex Mono';font-size:12.5px;white-space:nowrap;
}
.data-table th{
  color:var(--ink-faint);font-weight:500;text-transform:uppercase;font-size:10.5px;
  letter-spacing:0.04em;border-bottom:1px solid var(--ink-faint);
}
.data-table td.label{font-family:'Inter';font-weight:600;color:var(--ink);white-space:normal;}
.data-table td.best{color:var(--teal);font-weight:600;}

/* HORIZONTAL BAR — single-series magnitude comparison across named conditions */
.hbar-row{display:flex;align-items:center;gap:12px;margin:10px 0;}
.hbar-label{width:110px;flex-shrink:0;font-size:13px;color:var(--ink-soft);}
.hbar-track{flex:1;background:var(--line);border-radius:4px;height:18px;overflow:hidden;}
.hbar-fill{height:100%;border-radius:4px;background:var(--teal);}
.hbar-value{width:46px;flex-shrink:0;text-align:right;font-family:'IBM Plex Mono';font-size:12px;color:var(--ink-soft);}

footer{border-top:1px solid var(--line);}