/* Recruiting case studies share the submission document's typography and colors. */
.detail-panel { --case-ink:#1c2942; --case-blue:#315efb; --case-muted:#6e7b91; --case-line:#e2e7f0; background:#fff; border-color:#dce2ec; border-radius:12px; box-shadow:0 22px 70px -35px #283a6340; }
.detail-toolbar { border-color:var(--case-line); padding:13px 28px; background:#fbfcff; }
.detail-toolbar > div { color:#6c7b98; }
.detail-toolbar .status-dot { background:var(--case-blue); box-shadow:none; width:5px; height:5px; border-radius:1px; }
.close-button { color:#697996; }
.close-button:hover { color:var(--case-blue); }
.close-button kbd { color:#8090ab; background:white; border-color:#dce3ef; box-shadow:0 2px #edf0f7; }
.detail-panel :focus-visible { outline-color:var(--case-blue); }
.detail-scroll { scrollbar-color:#c8d1e3 transparent; }
.detail-content { padding:34px 34px 25px; color:var(--case-ink); }
.detail-intro { position:relative; padding-top:2px; isolation:isolate; }
.case-number { position:absolute; right:0; top:-8px; font:500 91px/1 var(--sans); color:#f0f3fa; letter-spacing:-5px; z-index:-1; }
.project-category { font:8px var(--mono); letter-spacing:1.3px; color:var(--case-blue); padding-right:35px; margin-bottom:17px; }
.detail-title { font-size:43px; font-weight:700; letter-spacing:-1.7px; color:var(--case-ink); margin:0 0 17px; }
.case-focus { font-size:16px; font-weight:600; color:#3d4b67; line-height:1.6; letter-spacing:-.4px; margin:0 0 10px; }
.detail-subtitle { font-size:12px; line-height:1.9; color:var(--case-muted); }
.project-meta { margin-top:24px; padding:17px 0; border-top:1px solid var(--case-line); border-bottom:1px solid var(--case-line); grid-template-columns:1.2fr 1fr; }
.project-meta dt { font:9px var(--sans); letter-spacing:0; color:#8b97a9; margin-bottom:7px; }
.project-meta dd { font-size:11px; color:#455570; line-height:1.8; }
.case-type { display:block; color:#8a97ae; font-size:10px; }
.project-links { gap:8px; margin:17px 0 28px; }
.project-link { border-color:#dce3f2; font-size:10px; border-radius:4px; }
.project-link.primary { background:var(--case-ink); border-color:var(--case-ink); color:white; }
.project-link.primary:hover { background:var(--case-blue); border-color:var(--case-blue); }
.project-link:hover { background:#f0f4ff; color:var(--case-blue); }
.project-url { font-size:9px; color:#7d8aa3; margin-top:4px; }
.case-label, .project-highlights h3.case-label, .project-stack h3.case-label { font:600 12px var(--sans); letter-spacing:0; color:var(--case-ink); display:flex; align-items:center; gap:11px; margin:0 0 14px; }
.case-label > span { font:9px var(--mono); color:var(--case-blue); }
.case-problem p { font-size:13px; line-height:1.95; color:#5c6a82; margin:0; word-break:keep-all; }
.case-architecture { margin:24px 0 29px; padding:20px 20px 16px; background:#1c2942; border-radius:5px; }
.case-architecture figcaption { font:7px var(--mono); letter-spacing:1.5px; color:#8ea0c5; margin-bottom:17px; }
.case-architecture ol { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; list-style:none; padding:0; margin:0; }
.case-architecture li { padding:13px 6px; background:#273650; border:1px solid #42516e; text-align:center; position:relative; }
.case-architecture li:not(:last-child)::after { content:'→'; position:absolute; top:50%; right:-18px; transform:translateY(-50%); color:#879ac1; font-size:13px; }
.case-architecture li > b { font-size:10px; font-weight:500; color:#edf2ff; display:block; }
.case-architecture li > span { display:block; font-size:8px; color:#9aaac8; margin-top:5px; }
.case-architecture > p { font-size:9px; color:#8296be; text-align:center; margin:12px 0 0; line-height:1.8; }
.highlight-grid { grid-template-columns:1fr; gap:0; }
.highlight-card { display:grid; grid-template-columns:25px minmax(0,1fr); gap:13px; padding:18px 0; border:0; border-bottom:1px solid var(--case-line); border-radius:0; background:transparent; }
.highlight-card:first-child { padding-top:5px; }
.highlight-card > span { grid-row:auto; font:10px var(--mono); color:#9aa8c0; padding-top:4px; margin:0; }
.highlight-card h4 { font-size:13px; line-height:1.6; font-weight:600; color:#2e3f5b; margin:0 0 7px; }
.highlight-card p { font-size:12px; line-height:1.9; color:#6c7a90; margin:0; }
.highlight-card small { display:block; font-size:10px; line-height:1.8; color:#5371b9; margin-top:7px; }
.case-outcome { border-left:3px solid var(--case-blue); background:#f0f4ff; padding:19px 20px; margin-top:27px; }
.case-outcome .case-label { margin-bottom:10px; color:#315bc9; }
.case-outcome p { margin:0; font-size:12px; line-height:1.95; color:#4b618c; word-break:keep-all; }
.case-evidence { margin-top:22px; }
.case-evidence h3 { font-size:11px; margin:0 0 9px; color:#52617d; font-weight:600; }
.case-evidence p { font-size:11px; line-height:1.9; color:#7a879d; margin:0; word-break:keep-all; }
.case-evidence .case-scope { border-top:1px solid #edf0f6; padding-top:10px; margin-top:10px; font-size:10px; color:#8793a8; }
.case-scope b { color:#6e7c95; font-weight:500; margin-right:5px; }
.project-stack { margin-top:26px; }
.project-stack h3.case-label { font-size:11px; color:#71809b; margin-bottom:12px; }
.stack-chips > span { border-color:#e0e6f0; color:#667a9c; border-radius:3px; font-size:9px; padding:6px 8px; }
.case-document-links { display:flex; align-items:center; justify-content:space-between; gap:15px; border-top:1px solid var(--case-line); padding-top:20px; margin-top:27px; font-size:11px; color:var(--case-blue); }
.case-document-links a { display:inline-flex; align-items:center; gap:6px; }
.case-document-links svg { width:12px; height:12px; }
.case-document-links a:hover { text-decoration:underline; }
.detail-end { padding-top:18px; margin-top:19px; border-top:1px solid var(--case-line); }
.detail-end > span { font-size:7px; color:#a0aec6; }
.back-to-menu { color:#657a9f; font-size:10px; }
.back-to-menu:hover { color:var(--case-blue); }
@media(max-width:1000px) {
  .detail-content { padding:28px 24px 23px; }
  .detail-title { font-size:36px; }
  .case-focus { font-size:14px; }
  .case-number { font-size:78px; }
  .case-architecture { padding:17px 13px; }
  .case-architecture ol { gap:15px; }
  .case-architecture li:not(:last-child)::after { right:-13px; font-size:11px; }
  .case-architecture li > b { font-size:9px; }
  .case-architecture li > span { font-size:7px; }
  .highlight-card p { grid-column:auto; }
}
@media(max-width:650px) {
  .detail-panel { border-radius:16px 16px 0 0; }
  .detail-toolbar { padding:12px 23px; }
  .detail-content { padding:29px 23px 23px; }
  .project-category { font-size:7px; letter-spacing:1px; margin-bottom:15px; }
  .detail-title { font-size:35px; margin-bottom:15px; }
  .case-number { font-size:73px; }
  .case-focus { font-size:14px; }
  .detail-subtitle { font-size:12px; }
  .project-meta { grid-template-columns:1fr; gap:13px; margin-top:20px; }
  .case-type { display:inline; margin-left:10px; }
  .case-problem p { font-size:12px; }
  .case-architecture li > span { font-size:7px; }
  .case-architecture > p { font-size:8px; }
  .case-document-links { font-size:10px; }
  .detail-end > span { font-size:6px; letter-spacing:.5px; }
}
