/* ─────────────────────────────────────────────────────────────
   Windrose Service Manual — EU Edition
   Shared stylesheet for the index (table of contents) and all
   105 section pages. Brand palette matches the site + US manual.
   ───────────────────────────────────────────────────────────── */

@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700&family=Inter:wght@400;500;600&display=swap');

:root{
  --brand-navy:#0e1a2b;
  --brand-navy-2:#13233a;
  --accent:#0b5ed7;
  --accent-red:#8a1a1a;
  --bg:#f0f4f8;
  --surface:#ffffff;
  --ink:#1d2733;
  --ink-soft:#556170;
  --ink-faint:#8a95a3;
  --line:#dde3ea;
  --header-h:56px;
}

*{box-sizing:border-box;}

html{scroll-behavior:smooth;}

body{
  font-family:Inter,-apple-system,Segoe UI,Arial,'Microsoft YaHei',sans-serif;
  color:var(--ink);
  background:var(--bg);
  line-height:1.6;
  margin:0;
  padding:calc(var(--header-h) + 28px) 20px 96px;
}

/* ── Global branded header bar (injected on every page) ───────── */
body::before{
  content:"WINDROSE";
  position:fixed; top:0; left:0; right:0; z-index:100;
  height:var(--header-h);
  display:flex; align-items:center;
  padding:0 22px;
  font-family:'Barlow Condensed',sans-serif;
  font-weight:700; font-size:22px; letter-spacing:.14em;
  color:#fff;
  background:linear-gradient(90deg,var(--brand-navy),var(--brand-navy-2));
  border-bottom:3px solid var(--accent);
  box-shadow:0 2px 10px rgba(10,20,35,.18);
}
body::after{
  content:"Service Manual · EU Edition";
  position:fixed; top:0; right:22px; z-index:101;
  height:var(--header-h);
  display:flex; align-items:center;
  font-family:'Barlow Condensed',sans-serif;
  font-weight:500; font-size:15px; letter-spacing:.06em;
  color:#9fc3ff;
  text-transform:uppercase;
}

/* ── Content column ───────────────────────────────────────────── */
body{max-width:none;}
h1, h2, h3, h4, h5, p, ul, .ln, .crumb, .nav, .edition-banner, .toc-intro,
a.back, .toc-chapter{
  max-width:980px; margin-left:auto; margin-right:auto;
}

/* ── Back link (pill button) ──────────────────────────────────── */
a.back{
  display:inline-block;
  margin:0 auto 16px;
  padding:7px 15px;
  font-size:.9em; font-weight:600;
  color:var(--accent);
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:999px;
  text-decoration:none;
  transition:background .15s,border-color .15s;
}
a.back:hover{background:#eaf1ff;border-color:var(--accent);}

/* ── Breadcrumb ───────────────────────────────────────────────── */
.crumb{
  font-size:.82em; color:var(--ink-soft);
  margin-bottom:20px; padding-bottom:14px;
  border-bottom:1px solid var(--line);
}
.crumb a{color:var(--accent);text-decoration:none;}
.crumb a:hover{text-decoration:underline;}

/* ── Headings ─────────────────────────────────────────────────── */
h1{
  font-family:'Barlow Condensed',sans-serif;
  font-size:2.1em; font-weight:700; line-height:1.15;
  color:var(--brand-navy);
  margin:.2em auto .6em;
  padding-bottom:.35em;
  border-bottom:3px solid var(--brand-navy);
}
h2{
  font-family:'Barlow Condensed',sans-serif;
  font-size:1.5em; font-weight:600;
  color:var(--accent-red);
  margin:1.9em auto .7em;
  padding:6px 0 6px 14px;
  border-left:5px solid var(--accent-red);
  scroll-margin-top:calc(var(--header-h) + 12px);
}
h3{
  font-size:1.2em; font-weight:600; color:var(--accent);
  margin:1.5em auto .5em;
  scroll-margin-top:calc(var(--header-h) + 12px);
}
h4{font-size:1.05em;font-weight:600;color:var(--ink);margin:1.2em auto .4em;}
h5{font-size:.97em;font-weight:600;color:var(--ink-soft);margin:1em auto .3em;}

/* ── Body text lines (each source line is a .ln div) ──────────── */
.ln{margin:.35em auto;font-size:.96em;color:var(--ink);}

p{margin:.6em auto;}

/* ── Images / diagrams ────────────────────────────────────────── */
img{
  max-width:min(100%,980px); height:auto; display:block;
  margin:18px auto;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:8px;
  padding:6px;
  box-shadow:0 1px 4px rgba(20,35,55,.06);
}

/* ── Prev / next navigation ───────────────────────────────────── */
.nav{
  display:flex; justify-content:space-between; gap:12px;
  margin:56px auto 0; padding-top:20px;
  border-top:1px solid var(--line);
  font-size:.92em;
}
.nav a{
  display:inline-block;
  padding:9px 16px;
  color:var(--accent); font-weight:600;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:8px;
  text-decoration:none;
  transition:background .15s,border-color .15s;
}
.nav a:hover{background:#eaf1ff;border-color:var(--accent);}

/* ═══════════════════════════════════════════════════════════════
   Table-of-contents landing page (index.html)
   ═══════════════════════════════════════════════════════════════ */
.edition-banner{
  background:linear-gradient(90deg,#0e1a2b,#13233a);
  color:#dbe7ff;
  padding:14px 18px;
  border-radius:10px;
  border:1px solid #24405f;
  font-size:.95em;
  margin:0 auto 22px;
}
.edition-banner strong{color:#fff;}

.toc-intro{color:var(--ink-soft);font-size:.95em;margin:0 auto 26px;}

/* TOC chapters render as h2 + ul.li a — style them as cards */
body > h2{
  background:none;
}
body > ul{
  list-style:none;
  max-width:980px; margin:0 auto 8px; padding:0;
  display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr));
  gap:8px;
}
body > ul > li{margin:0;}
body > ul > li > a{
  display:block;
  padding:11px 14px;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:8px;
  color:var(--ink);
  text-decoration:none;
  font-size:.94em; font-weight:500;
  transition:background .15s,border-color .15s,transform .05s;
}
body > ul > li > a:hover{
  background:#eaf1ff; border-color:var(--accent);
}
body > ul > li > a span{color:var(--ink-faint) !important;font-weight:400;}

/* ── Responsive ───────────────────────────────────────────────── */
@media (max-width:640px){
  body{padding:calc(var(--header-h) + 18px) 14px 72px;}
  body::after{display:none;}
  h1{font-size:1.7em;}
  body > ul{grid-template-columns:1fr;}
  .nav{flex-direction:column;}
  .nav a{text-align:center;}
}
