/* ════════════════════════════════════════════════════════════════════════
   ΕΝΝΟΙΑ (evergreen) — article-like template (Persis.ai v3)
   Ίδιο design system με τις σελίδες περιοχής (Source Serif 4 / Hanken Grotesk /
   JetBrains Mono · evergreen accent · light+dark), αλλά διάταξη ΑΡΘΡΟΥ:
   στενή στήλη ανάγνωσης + sticky TOC, prose-first, callout boxes.
   ════════════════════════════════════════════════════════════════════════ */

/* ═══════════ v3 TOKENS ═══════════ */
:root{
  --bg:#fafaf7; --surface:#ffffff; --surface-2:#f4f3ee; --surface-3:#edeae1;
  --border:oklch(20% 0 0 / 0.10); --border-strong:oklch(20% 0 0 / 0.22);
  --text-1:#161410; --text-2:#56544c; --text-3:#8a887e;
  --accent:oklch(40% 0.06 155); --accent-soft:oklch(40% 0.06 155 / 0.09); --accent-ink:oklch(34% 0.05 155);
  --green:oklch(48% 0.11 155); --green-soft:oklch(48% 0.11 155 / 0.10);
  --amber:oklch(56% 0.12 70); --amber-soft:oklch(56% 0.12 70 / 0.12);
  --coral:oklch(52% 0.17 28); --coral-soft:oklch(52% 0.17 28 / 0.10);
  --info:oklch(48% 0.11 235); --info-soft:oklch(48% 0.11 235 / 0.10);
  --on-accent:#ffffff;
  --shadow-sm:0 1px 2px oklch(20% 0 0 / 0.04);
  --shadow:0 2px 10px oklch(20% 0 0 / 0.06);
  --shadow-md:0 12px 36px oklch(20% 0 0 / 0.12);
  --serif:'Source Serif 4','Times New Roman',serif;
  --sans:'Hanken Grotesk',system-ui,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,monospace;
  --r:6px; --r-lg:10px;
}
html[data-theme="dark"]{
  --bg:#0d0d0b; --surface:#161614; --surface-2:#1f1f1b; --surface-3:#262621;
  --border:oklch(85% 0.005 80 / 0.10); --border-strong:oklch(85% 0.005 80 / 0.22);
  --text-1:#ece9df; --text-2:#a8a59b; --text-3:#6e6c64;
  --accent:oklch(64% 0.085 155); --accent-soft:oklch(64% 0.085 155 / 0.14); --accent-ink:oklch(74% 0.075 155);
  --green:oklch(70% 0.13 155); --green-soft:oklch(70% 0.13 155 / 0.14);
  --amber:oklch(76% 0.13 70); --amber-soft:oklch(76% 0.13 70 / 0.14);
  --coral:oklch(68% 0.15 28); --coral-soft:oklch(68% 0.15 28 / 0.14);
  --info:oklch(72% 0.10 235); --info-soft:oklch(72% 0.10 235 / 0.14);
  --on-accent:#0d0d0b;
  --shadow-sm:0 1px 2px rgb(0 0 0 / 0.4);
  --shadow:0 2px 10px rgb(0 0 0 / 0.5);
  --shadow-md:0 12px 36px rgb(0 0 0 / 0.6);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{background:var(--bg);color:var(--text-1);font-family:var(--sans);font-size:16px;line-height:1.7;-webkit-font-smoothing:antialiased;transition:background-color .35s ease,color .35s ease;}
::selection{background:var(--accent-soft);color:var(--text-1);}
::-webkit-scrollbar{width:9px;height:9px;}
::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:5px;}
::-webkit-scrollbar-track{background:transparent;}
a{color:inherit;text-decoration:none;}
a:focus-visible,button:focus-visible{outline:none;box-shadow:0 0 0 2px var(--bg),0 0 0 4px var(--accent);}
h1,h2,h3,h4{font-weight:400;}

/* ═══ NAV ═══ */
.nav{position:fixed;top:0;left:0;right:0;z-index:100;padding:16px 40px;display:flex;align-items:center;justify-content:space-between;gap:24px;transition:background-color .3s,padding .3s,box-shadow .3s,backdrop-filter .3s;}
.nav.scrolled{background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(14px) saturate(1.4);box-shadow:0 1px 0 var(--border);padding:11px 40px;}
.brand{display:flex;align-items:center;gap:11px;}
.brand-mark{width:31px;height:31px;border-radius:7px;background:var(--text-1);color:var(--bg);display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-style:italic;font-weight:500;font-size:18px;}
.brand-name{font-family:var(--serif);font-size:20px;letter-spacing:-.015em;}
.brand-name b{font-weight:400;font-style:italic;color:var(--text-3);}
.nav-right{display:flex;align-items:center;gap:18px;}
.tt{display:inline-flex;gap:3px;padding:3px;background:var(--surface-2);border:1px solid var(--border);border-radius:99px;}
.tt button{padding:5px 11px;background:transparent;color:var(--text-2);border:none;border-radius:99px;font-family:var(--mono);font-size:9px;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;transition:background-color .15s,color .15s;}
.tt button.on{background:var(--text-1);color:var(--bg);}
.nav-cta{display:inline-flex;align-items:center;gap:7px;background:var(--text-1);color:var(--bg);padding:8px 15px;border-radius:var(--r);font-size:13px;font-weight:600;transition:opacity .15s;white-space:nowrap;}
.nav-cta:hover{opacity:.86;}
.nav-cta svg{flex-shrink:0;}

/* ═══ BUTTONS ═══ */
.btn-p{display:inline-flex;align-items:center;justify-content:center;gap:9px;background:var(--text-1);color:var(--bg);padding:14px 26px;border-radius:var(--r);font-size:15px;font-weight:600;font-family:var(--sans);border:none;cursor:pointer;transition:opacity .15s;}
.btn-p:hover{opacity:.86;}
.btn-s{display:inline-flex;align-items:center;justify-content:center;gap:9px;background:transparent;color:var(--text-1);padding:14px 26px;border-radius:var(--r);font-size:15px;font-weight:600;box-shadow:inset 0 0 0 1px var(--border-strong);transition:box-shadow .15s,background-color .15s;cursor:pointer;border:none;font-family:var(--sans);}
.btn-s:hover{box-shadow:inset 0 0 0 1px var(--text-3);background:var(--surface-2);}
.btn-accent{background:var(--accent);color:var(--on-accent);}

/* ═══ BREADCRUMB ═══ */
.crumb{max-width:1080px;margin:0 auto;padding:104px 40px 0;}
.crumb ol{list-style:none;display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-family:var(--mono);font-size:10.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--text-3);font-weight:600;}
.crumb a{color:var(--text-2);transition:color .15s;}
.crumb a:hover{color:var(--accent-ink);}
.crumb li.here{color:var(--accent-ink);}
.crumb .sep{opacity:.5;}

/* ═══ HERO ═══ */
.hero{max-width:1080px;margin:0 auto;padding:26px 40px 30px;}
.hero-inner{max-width:760px;}
.kicker{font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--accent-ink);margin-bottom:16px;display:inline-flex;align-items:center;gap:9px;}
.kicker .dot{width:5px;height:5px;border-radius:50%;background:var(--accent);}
.hero h1{font-family:var(--serif);font-size:52px;font-weight:400;letter-spacing:-.026em;line-height:1.06;color:var(--text-1);margin-bottom:20px;text-wrap:balance;}
.hero h1 em{font-style:italic;color:var(--accent-ink);}
.hero-sub{font-size:19px;line-height:1.6;color:var(--text-2);max-width:640px;text-wrap:pretty;margin-bottom:26px;}
.hero-meta{display:flex;flex-wrap:wrap;gap:9px;align-items:center;}
.meta-chip{display:inline-flex;align-items:center;gap:7px;font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;padding:6px 11px;border-radius:99px;background:var(--surface-2);color:var(--text-2);border:1px solid var(--border);}
.meta-chip svg{opacity:.7;flex-shrink:0;}
.meta-chip.fresh{background:var(--green-soft);color:var(--green);border-color:color-mix(in oklch,var(--green) 26%,var(--border));}
.meta-chip.fresh .d{width:5px;height:5px;border-radius:50%;background:var(--green);}
.conf-chip{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;padding:6px 11px;border-radius:99px;border:1px solid;}
.conf-chip.h{background:var(--green-soft);color:var(--green);border-color:color-mix(in oklch,var(--green) 26%,var(--border));}
.conf-chip.m{background:var(--info-soft);color:var(--info);border-color:color-mix(in oklch,var(--info) 26%,var(--border));}
.conf-chip.l{background:var(--amber-soft);color:var(--amber);border-color:color-mix(in oklch,var(--amber) 26%,var(--border));}

/* key-stat card */
.keystat{display:flex;align-items:center;gap:26px;margin-top:30px;padding:24px 28px;background:var(--surface);border:1px solid var(--border);border-left:3px solid var(--accent);border-radius:var(--r-lg);box-shadow:var(--shadow-sm);max-width:620px;}
.keystat .num{font-family:var(--serif);font-size:58px;font-weight:600;letter-spacing:-.03em;line-height:.9;color:var(--accent-ink);white-space:nowrap;}
.keystat .num .u{font-family:var(--mono);font-size:17px;font-weight:500;color:var(--text-3);letter-spacing:0;margin-left:5px;}
.keystat .kv{display:flex;flex-direction:column;gap:5px;}
.keystat .kl{font-family:var(--mono);font-size:9.5px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--text-3);}
.keystat .kt{font-size:14px;line-height:1.5;color:var(--text-2);text-wrap:pretty;}
.keystat .kt b{color:var(--text-1);font-weight:600;}

/* ═══ ARTICLE LAYOUT ═══ */
.layout{max-width:1080px;margin:0 auto;padding:30px 40px 40px;display:grid;grid-template-columns:228px minmax(0,1fr);gap:56px;align-items:start;}
.toc{position:sticky;top:90px;}
.toc .tl{font-family:var(--mono);font-size:9.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--text-3);margin-bottom:14px;padding-left:13px;}
.toc ol{list-style:none;display:flex;flex-direction:column;}
.toc a{display:block;font-size:13px;font-weight:500;line-height:1.4;color:var(--text-2);padding:8px 0 8px 13px;border-left:2px solid var(--border);transition:color .15s,border-color .15s;}
.toc a:hover{color:var(--text-1);}
.toc a.active{color:var(--accent-ink);border-left-color:var(--accent);font-weight:600;}
.toc-cta{margin-top:20px;padding-left:13px;}
.toc-cta a{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:600;color:var(--accent-ink);}
.toc-cta a svg{transition:transform .2s ease;}
.toc-cta a:hover svg{transform:translateX(3px);}

.article{min-width:0;max-width:680px;}
.sect{padding-top:8px;margin-bottom:54px;scroll-margin-top:96px;}
.sect:last-child{margin-bottom:0;}
.sect-label{font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--text-3);margin-bottom:12px;}
.sect h2{font-family:var(--serif);font-size:31px;font-weight:400;letter-spacing:-.02em;line-height:1.16;color:var(--text-1);margin-bottom:18px;text-wrap:balance;}
.sect h2 em{font-style:italic;color:var(--accent-ink);}
.article p{font-size:17px;line-height:1.78;color:var(--text-2);margin-bottom:18px;text-wrap:pretty;}
.article p:last-child{margin-bottom:0;}
.article p b,.article p strong{color:var(--text-1);font-weight:600;}
.article p .term{font-family:var(--serif);font-style:italic;color:var(--accent-ink);font-weight:600;}
.article .lead{font-family:var(--serif);font-size:21px;line-height:1.6;color:var(--text-1);font-weight:400;margin-bottom:22px;letter-spacing:-.005em;}
.article .lead em{font-style:italic;color:var(--accent-ink);}

/* definition contrast cards */
.defs{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:24px 0;}
.def{padding:20px 22px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);position:relative;overflow:hidden;}
.def::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;}
.def.a::before{background:var(--info);}
.def.b::before{background:var(--green);}
.def .dk{font-family:var(--mono);font-size:9.5px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;margin-bottom:9px;display:flex;align-items:center;gap:8px;}
.def.a .dk{color:var(--info);}
.def.b .dk{color:var(--green);}
.def .dk .ic{width:22px;height:22px;border-radius:6px;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.def.a .dk .ic{background:var(--info-soft);}
.def.b .dk .ic{background:var(--green-soft);}
.def h4{font-family:var(--serif);font-size:18px;font-weight:600;letter-spacing:-.01em;color:var(--text-1);margin-bottom:8px;}
.def p{font-size:14px;line-height:1.6;color:var(--text-2);margin-bottom:0;}
.def-summary{margin:0 0 8px;padding:16px 20px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-lg);font-family:var(--serif);font-size:16.5px;line-height:1.6;color:var(--text-1);text-wrap:pretty;}
.def-summary b{font-weight:600;color:var(--accent-ink);}

/* example / callout box */
.example{margin:24px 0;background:var(--surface);border:1px solid var(--border);border-left:3px solid var(--amber);border-radius:var(--r-lg);overflow:hidden;}
.example-head{display:flex;align-items:center;gap:9px;padding:13px 20px;background:var(--amber-soft);border-bottom:1px solid color-mix(in oklch,var(--amber) 22%,var(--border));}
.example-head .el{font-family:var(--mono);font-size:9.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--amber);}
.example-body{padding:20px 22px;}
.example-body p{font-size:15px;line-height:1.65;color:var(--text-2);margin-bottom:0;}
.example-calc{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-top:16px;padding-top:16px;border-top:1px solid var(--border);}
.calc-term{display:flex;flex-direction:column;gap:3px;}
.calc-term .ct-v{font-family:var(--serif);font-size:24px;font-weight:600;letter-spacing:-.015em;color:var(--text-1);}
.calc-term .ct-v .u{font-family:var(--mono);font-size:12px;font-weight:500;color:var(--text-3);}
.calc-term .ct-k{font-family:var(--mono);font-size:9px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--text-3);}
.calc-op{font-family:var(--serif);font-size:22px;color:var(--text-3);font-weight:600;}
.calc-arrow{color:var(--text-3);}
.verdict{display:inline-flex;align-items:center;gap:9px;font-family:var(--serif);font-size:19px;font-weight:600;letter-spacing:-.01em;}
.verdict .vd{width:11px;height:11px;border-radius:50%;flex-shrink:0;}
.verdict.no{color:var(--coral);}
.verdict.no .vd{background:var(--coral);box-shadow:0 0 0 4px var(--coral-soft);}
.verdict.yes{color:var(--green);}
.verdict.yes .vd{background:var(--green);box-shadow:0 0 0 4px var(--green-soft);}

/* "πού αλλάζει" cards */
.change-cards{display:flex;flex-direction:column;gap:12px;margin:22px 0 0;}
.change{display:flex;gap:15px;align-items:flex-start;padding:18px 20px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);transition:box-shadow .2s,transform .2s;}
.change:hover{box-shadow:var(--shadow);transform:translateY(-1px);}
.change .ci{width:34px;height:34px;border-radius:8px;background:var(--accent-soft);color:var(--accent-ink);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.change .cc h4{font-family:var(--serif);font-size:17px;font-weight:500;letter-spacing:-.008em;color:var(--text-1);margin-bottom:5px;}
.change .cc p{font-size:14.5px;line-height:1.6;color:var(--text-2);margin-bottom:0;}
.change .cc p .slot{font-family:var(--serif);font-weight:600;color:var(--text-1);background:var(--amber-soft);border-bottom:1.5px dashed color-mix(in oklch,var(--amber) 55%,var(--border));padding:0 3px;border-radius:3px 3px 0 0;}

/* pitfalls / myth-reality */
.pitfalls{display:flex;flex-direction:column;gap:12px;margin:22px 0 0;}
.pit{padding:18px 20px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);}
.pit .myth{display:flex;align-items:flex-start;gap:11px;margin-bottom:11px;}
.pit .myth .mi{width:22px;height:22px;border-radius:50%;background:var(--coral-soft);color:var(--coral);display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:1px;}
.pit .myth .mt{font-family:var(--serif);font-size:17px;font-weight:500;font-style:italic;color:var(--text-2);line-height:1.4;}
.pit .reality{display:flex;align-items:flex-start;gap:11px;padding-top:11px;border-top:1px solid var(--border);}
.pit .reality .ri{width:22px;height:22px;border-radius:50%;background:var(--green-soft);color:var(--green);display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:1px;}
.pit .reality .rt{font-size:14.5px;line-height:1.6;color:var(--text-1);}
.pit .reality .rt b{font-weight:600;}

/* engineer CTA block */
.eng-cta{margin:24px 0 0;padding:30px 30px 28px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--shadow);position:relative;overflow:hidden;}
.eng-cta::before{content:"";position:absolute;inset:0 0 auto 0;height:3px;background:linear-gradient(90deg,var(--accent),color-mix(in oklch,var(--accent) 40%,var(--info)));}
.eng-cta .ec-eyebrow{font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--accent-ink);margin-bottom:11px;}
.eng-cta h3{font-family:var(--serif);font-size:24px;font-weight:500;letter-spacing:-.015em;line-height:1.2;color:var(--text-1);margin-bottom:11px;text-wrap:balance;}
.eng-cta h3 em{font-style:italic;color:var(--accent-ink);}
.eng-cta p{font-size:15px;line-height:1.65;color:var(--text-2);margin-bottom:20px;max-width:480px;}
.eng-cta .ec-btns{display:flex;flex-wrap:wrap;gap:11px;align-items:center;}
.eng-cta .ec-trust{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px;}
.trust-chip{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:9px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--text-2);background:var(--surface-2);border:1px solid var(--border);border-radius:99px;padding:6px 11px;}
.trust-chip svg{color:var(--green);flex-shrink:0;}

/* ═══ FAQ ═══ */
.faq-sect{scroll-margin-top:96px;}
.faq-item{border-bottom:1px solid var(--border);}
.faq-item:first-child{border-top:1px solid var(--border);}
.faq-q{width:100%;background:none;border:none;padding:19px 0;font-size:16.5px;font-weight:600;color:var(--text-1);cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;text-align:left;font-family:var(--sans);transition:color .15s;}
.faq-q:hover{color:var(--accent-ink);}
.faq-chev{width:18px;height:18px;flex-shrink:0;color:var(--text-3);transition:transform .25s ease;}
.faq-item.open .faq-chev{transform:rotate(180deg);}
.faq-ans{max-height:0;overflow:hidden;transition:max-height .35s ease;}
.faq-item.open .faq-ans{max-height:520px;}
.faq-ans-in{padding:0 0 21px;font-size:15px;line-height:1.72;color:var(--text-2);max-width:620px;}
.faq-ans-in .lead{display:block;font-family:var(--serif);font-size:17px;font-weight:600;color:var(--text-1);margin-bottom:8px;letter-spacing:-.005em;}
.faq-ans-in .slot{font-family:var(--serif);font-weight:600;color:var(--text-1);background:var(--amber-soft);border-bottom:1.5px dashed color-mix(in oklch,var(--amber) 55%,var(--border));padding:0 3px;border-radius:3px 3px 0 0;}

/* ═══ DISCLAIMER ═══ */
.disc{margin-top:34px;display:flex;gap:14px;align-items:flex-start;padding:20px 22px;background:var(--surface-2);border:1px solid var(--border);border-left:3px solid var(--amber);border-radius:var(--r-lg);}
.disc-ico{color:var(--amber);flex-shrink:0;margin-top:2px;}
.disc p{font-size:13px;line-height:1.62;color:var(--text-2);margin-bottom:0;}
.disc p b{color:var(--text-1);font-weight:600;}

/* ═══ RELATED ═══ */
.related{border-top:1px solid var(--border);background:var(--surface-2);transition:background-color .35s ease;}
.related-inner{max-width:1080px;margin:0 auto;padding:64px 40px;}
.related h2{font-family:var(--serif);font-size:26px;font-weight:400;letter-spacing:-.018em;color:var(--text-1);margin-bottom:6px;}
.related .rsub{font-size:14.5px;color:var(--text-2);margin-bottom:28px;}
.concept-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(228px,1fr));gap:14px;}
.concept{display:flex;flex-direction:column;gap:8px;padding:20px 22px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);transition:box-shadow .2s,transform .2s,border-color .2s;}
.concept:hover{box-shadow:var(--shadow);transform:translateY(-2px);border-color:var(--border-strong);}
.concept.current{border-color:color-mix(in oklch,var(--accent) 35%,var(--border));background:var(--accent-soft);}
.concept .pk{font-family:var(--mono);font-size:9px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text-3);display:flex;align-items:center;gap:7px;}
.concept.current .pk{color:var(--accent-ink);}
.concept.current .pk .now{font-family:var(--mono);font-size:8px;background:var(--accent);color:var(--on-accent);padding:2px 6px;border-radius:99px;letter-spacing:.06em;}
.concept h4{font-family:var(--serif);font-size:17px;font-weight:500;letter-spacing:-.01em;line-height:1.25;color:var(--text-1);}
.concept p{font-size:13px;line-height:1.5;color:var(--text-2);}
.concept .go{margin-top:auto;font-size:12.5px;font-weight:600;color:var(--accent-ink);display:inline-flex;align-items:center;gap:6px;padding-top:4px;}
.concept .go svg{transition:transform .2s ease;}
.concept:hover .go svg{transform:translateX(3px);}

.areas-block{margin-top:34px;padding:24px 26px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px;}
.areas-block .ab-txt h4{font-family:var(--serif);font-size:18px;font-weight:500;letter-spacing:-.01em;color:var(--text-1);margin-bottom:5px;}
.areas-block .ab-txt p{font-size:13.5px;line-height:1.5;color:var(--text-2);max-width:420px;}
.areas-chips{display:flex;flex-wrap:wrap;gap:8px;}
.area-chip{font-family:var(--sans);font-size:12.5px;font-weight:500;color:var(--text-1);background:var(--surface-2);border:1px solid var(--border);border-radius:99px;padding:8px 14px;transition:background-color .15s,border-color .15s,color .15s;display:inline-flex;align-items:center;gap:7px;}
.area-chip:hover{background:var(--surface-3);border-color:var(--border-strong);color:var(--accent-ink);}
.area-chip .pin{font-family:var(--mono);font-size:9px;color:var(--text-3);}
.area-chip.all{background:var(--accent-soft);color:var(--accent-ink);border-color:color-mix(in oklch,var(--accent) 24%,var(--border));}

/* ═══ FOOTER ═══ */
.footer{border-top:1px solid var(--border);}
.footer-inner{max-width:1080px;margin:0 auto;padding:34px 40px;display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:12.5px;color:var(--text-3);}
.footer-brand{font-family:var(--serif);font-weight:500;}
.footer-brand b{color:var(--text-3);font-weight:400;font-style:italic;}
.footer-links{display:flex;gap:24px;flex-wrap:wrap;}
.footer-links a{color:var(--text-2);transition:color .15s;}
.footer-links a:hover{color:var(--text-1);}

/* ═══ REVEAL ═══ */
.fu{opacity:1;transform:none;}
html.js .fu{opacity:0;transform:translateY(16px);}
@media (prefers-reduced-motion:no-preference){html.js .fu.v{animation:su .55s ease-out forwards;}}
@media (prefers-reduced-motion:reduce){html.js .fu{opacity:1;transform:none;}}
html.js .fu.v{opacity:1;transform:none;}
@keyframes su{from{opacity:0;transform:translateY(16px);}to{opacity:1;transform:none;}}

/* ═══ RESPONSIVE ═══ */
@media (max-width:960px){
  .layout{grid-template-columns:1fr;gap:0;}
  .toc{position:static;margin-bottom:34px;padding:16px 18px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);}
  .toc .tl{padding-left:0;}
  .toc ol{display:grid;grid-template-columns:1fr 1fr;gap:2px 18px;}
  .toc a{border-left:none;padding:7px 0;}
  .toc a.active{border-left:none;}
  .toc-cta{padding-left:0;border-top:1px solid var(--border);margin-top:12px;padding-top:14px;}
  .article{max-width:none;}
}
@media (max-width:760px){
  .nav{padding:13px 20px;}
  .nav.scrolled{padding:11px 20px;}
  .brand-name{font-size:18px;}
  .crumb{padding:96px 22px 0;}
  .hero{padding:22px 22px 26px;}
  .hero h1{font-size:36px;}
  .hero-sub{font-size:17px;}
  .layout{padding:24px 22px 36px;}
  .keystat{flex-direction:column;align-items:flex-start;gap:14px;padding:20px 22px;}
  .keystat .num{font-size:48px;}
  .defs{grid-template-columns:1fr;}
  .sect h2{font-size:27px;}
  .related-inner{padding:48px 22px;}
  .areas-block{flex-direction:column;align-items:flex-start;}
  .footer-inner{flex-direction:column;text-align:center;}
}
@media (max-width:460px){
  .hero h1{font-size:30px;}
  .toc ol{grid-template-columns:1fr;}
  .nav-cta span{display:none;}
  .eng-cta .ec-btns{flex-direction:column;align-items:stretch;}
}

/* ═══ PRINT ═══ */
@media print{
  .nav,.toc,.toc-cta,.nav-cta,.faq-chev{display:none!important;}
  html[data-theme="dark"]{--bg:#fff;--surface:#fff;--text-1:#000;--text-2:#333;}
  body{background:#fff;}
  .layout{display:block;}
  .faq-item .faq-ans{max-height:none!important;}
  .related{background:#fff;}
  .sect,.def,.example,.pit,.eng-cta{break-inside:avoid;}
}