/* Статичні сторінки 42.finance. Згенеровано build/generate.mjs — правити тут не варто. */
*,*::before,*::after{box-sizing:border-box}
:root{
  --bg:#07080A; --bg-1:#0E1014; --bg-2:#14171C;
  --fg:#F2F3F5; --fg-2:#C8CCD2; --mute:#797F88; --mute-2:#9AA0A8;
  --line:rgba(255,255,255,.08); --line-2:rgba(255,255,255,.14);
  --accent:#d4ff3a; --accent-2:#B8FF6B; --accent-fg:#07080A;
  --bar-bg:rgba(7,8,10,.88); --tag-line:rgba(212,255,58,.35);
  --serif:"Newsreader","Times New Roman",Georgia,serif;
  --sans:"Geist","Inter",Helvetica,Arial,sans-serif;
  --mono:"IBM Plex Mono","JetBrains Mono",ui-monospace,monospace;
  --wrap:720px;
  color-scheme:dark;
}
/* Світла тема — ті самі токени, що в SPA (html[data-theme="light"] в index.html),
   щоб статичні сторінки й лендінг виглядали як один сайт. Акцент у світлій темі
   стає темно-синім, а лаймовий іде у --accent-fg: підпис на темному. */
html[data-theme="light"]{
  --bg:#EFEAD8; --bg-1:#E7E2CF; --bg-2:#DDD7C2;
  /* --mute темніший за відповідник у SPA (#6B7078): той давав лише 4.14:1 на
     основному тлі й 3.95:1 на --bg-2 (плашки, цитати) — нижче WCAG AA для
     дрібного тексту крихт, футера й підписів. #595E66 тримає ≥4.5:1 на всіх
     трьох світлих фонах, лишаючись візуально приглушеним. */
  --fg:#0E0F12; --fg-2:#2A2D33; --mute:#595E66; --mute-2:#3F4248;
  --line:rgba(14,15,18,.10); --line-2:rgba(14,15,18,.18);
  --accent:#0E0F12; --accent-2:#000; --accent-fg:#d4ff3a;
  --bar-bg:rgba(239,234,216,.88); --tag-line:rgba(14,15,18,.30);
  color-scheme:light;
}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--bg);color:var(--fg);
  font-family:var(--sans);font-size:17px;line-height:1.68;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit}
img{max-width:100%;height:auto}

/* шапка */
.bar{
  display:flex;justify-content:space-between;align-items:center;gap:20px;
  padding:20px 24px;border-bottom:1px solid var(--line);
  position:sticky;top:0;background:var(--bar-bg);backdrop-filter:blur(8px);z-index:10;
}
.bar__logo{font-family:var(--serif);font-size:19px;letter-spacing:-.01em;text-decoration:none}
.bar__logo span{color:var(--accent)}
.bar__nav{display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px;font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.bar__nav a{color:var(--mute-2);text-decoration:none}
.bar__nav a:hover,.bar__nav a[aria-current]{color:var(--accent)}
/* Перемикач теми. Показує ЦІЛЬ, а не поточний стан: у темній темі — «Light».
   Перемикання підпису — на CSS, щоб не блимало до виконання скрипта.
   Виглядає як звичайний пункт меню: без рамки й падінгів, щоб стояти з
   рештою на одній лінії. */
.bar__theme{
  font:inherit;line-height:inherit;color:var(--mute-2);background:none;border:0;
  padding:0;margin:0;cursor:pointer;letter-spacing:.08em;text-transform:uppercase;
}
.bar__theme:hover{color:var(--accent)}
.bar__theme .th-d{display:none}
html[data-theme="light"] .bar__theme .th-l{display:none}
html[data-theme="light"] .bar__theme .th-d{display:inline}

main{max-width:var(--wrap);margin:0 auto;padding:0 24px}

/* крихти */
.crumbs{display:flex;flex-wrap:wrap;gap:9px;align-items:center;font-family:var(--mono);font-size:11.5px;
  letter-spacing:.08em;text-transform:uppercase;color:var(--mute);padding:34px 0 22px}
.crumbs a{color:var(--mute);text-decoration:none}
.crumbs a:hover{color:var(--accent)}

/* заголовний блок */
.eyebrow{font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--accent);margin:34px 0 0}
.post__meta{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;
  font-family:var(--mono);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--mute)}
.tag{color:var(--accent);border:1px solid var(--tag-line);border-radius:2px;padding:1px 7px}
h1{font-family:var(--serif);font-weight:400;font-size:clamp(32px,5.4vw,49px);line-height:1.14;
  letter-spacing:-.015em;margin:18px 0 0;text-wrap:balance}
h1 em{font-style:italic;color:var(--accent)}
.lede{font-family:var(--serif);font-size:clamp(19px,2.4vw,23px);line-height:1.5;color:var(--fg-2);margin:20px 0 0}
.byline{font-family:var(--mono);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--mute);margin:22px 0 0;padding-top:22px;border-top:1px solid var(--line)}

/* тіло статті / кейса */
.post__body{margin:34px 0 0;padding-bottom:20px}
.post__body p{margin:0 0 22px}
.post__body em{font-style:italic;color:var(--fg)}
.post__body strong{font-weight:600;color:var(--fg)}
.post__body code{font-family:var(--mono);font-size:.88em;background:var(--bg-2);
  border:1px solid var(--line);border-radius:3px;padding:1px 5px}
.post__body h2{font-family:var(--serif);font-weight:400;font-size:clamp(25px,3.4vw,32px);
  line-height:1.25;letter-spacing:-.01em;margin:44px 0 16px;text-wrap:balance}
.post__body h2 em{font-style:italic;color:var(--accent)}
.post__body h3{font-family:var(--mono);font-weight:500;font-size:13px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--accent);margin:36px 0 14px}
.post__body ul{margin:0 0 22px;padding-left:22px}
.post__body li{margin:0 0 10px}
.post__body li::marker{color:var(--accent)}

blockquote{margin:30px 0;padding:20px 24px;background:var(--bg-1);
  border-left:2px solid var(--accent);border-radius:0 4px 4px 0;
  font-family:var(--serif);font-size:19px;line-height:1.5;color:var(--fg-2)}
blockquote p{margin:0}
blockquote footer{font-family:var(--mono);font-size:11px;letter-spacing:.09em;
  text-transform:uppercase;color:var(--mute);margin-top:12px}
.pull{margin:34px 0;font-family:var(--serif);font-size:clamp(21px,3vw,27px);line-height:1.36;
  color:var(--fg);text-align:center;padding:14px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.pull em{font-style:italic;color:var(--accent)}

figure.data{margin:32px 0}
figure.data figcaption{font-family:var(--mono);font-size:11.5px;letter-spacing:.09em;
  text-transform:uppercase;color:var(--mute);margin-bottom:12px}
.data__scroll{overflow-x:auto;border:1px solid var(--line);border-radius:5px;background:var(--bg-1)}
figure.data table{border-collapse:collapse;width:100%;min-width:440px;font-size:14.5px}
figure.data th,figure.data td{padding:11px 15px;text-align:left;vertical-align:top;
  border-bottom:1px solid var(--line)}
figure.data tr:last-child th,figure.data tr:last-child td{border-bottom:none}
figure.data th{font-weight:500;color:var(--mute-2);white-space:nowrap}
figure.data td{color:var(--fg-2)}
figure.data td em{font-style:normal;color:var(--accent)}

.tags{display:flex;flex-wrap:wrap;gap:8px;margin:26px 0 0}

/* дотичні */
.related{border-top:1px solid var(--line);margin-top:24px;padding:36px 0 0}
.related h2{font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.1em;
  text-transform:uppercase;color:var(--mute);margin:0 0 18px}
.related__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.card{display:flex;flex-direction:column;gap:9px;padding:18px;background:var(--bg-1);
  border:1px solid var(--line);border-radius:5px;text-decoration:none;transition:border-color .2s}
.card:hover{border-color:var(--line-2)}
.card__t{font-family:var(--serif);font-size:19px;line-height:1.3}
.card__x{font-size:14px;color:var(--mute-2);line-height:1.5}

/* індексні сторінки */
.idx{padding:34px 0 0}
.idx>h1{margin-top:14px}
.idx__list{display:flex;flex-direction:column;margin:34px 0 0;border-top:1px solid var(--line)}
.row{display:flex;flex-direction:column;gap:9px;padding:26px 0;
  border-bottom:1px solid var(--line);text-decoration:none;transition:padding-left .2s}
.row:hover{padding-left:10px}
.row__meta{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;font-family:var(--mono);
  font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--mute)}
.row__t{font-family:var(--serif);font-size:clamp(21px,3vw,27px);line-height:1.26;text-wrap:balance}
.row__t em{font-style:italic;color:var(--accent)}
.row__x{font-size:15px;color:var(--mute-2);line-height:1.55;max-width:62ch}

/* послуги / маніфест */
.svc,.mfx{border-top:1px solid var(--line);margin-top:40px;padding-top:34px}
.svc h2,.mfx h2{font-family:var(--serif);font-weight:400;font-size:clamp(23px,3.2vw,30px);
  line-height:1.25;margin:0 0 14px;text-wrap:balance}
.svc h2 em,.mfx h2 em{font-style:italic;color:var(--accent)}
.svc__no{font-family:var(--mono);font-size:13px;color:var(--accent);margin-right:10px}
.svc p,.mfx p{margin:0 0 18px;color:var(--fg-2)}
.svc h3{font-family:var(--mono);font-weight:500;font-size:12px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--mute-2);margin:0 0 12px}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;margin:22px 0 0}
.grid2 ul{margin:0;padding-left:20px}
.grid2 li{margin:0 0 9px;color:var(--fg-2);font-size:15.5px}
.grid2 li::marker{color:var(--accent)}
.metarow{display:flex;flex-wrap:wrap;gap:10px 26px;margin:22px 0 0;padding:14px 0 0;
  border-top:1px dashed var(--line)}
.metarow span{font-family:var(--mono);font-size:12px;letter-spacing:.05em;color:var(--fg-2)}
.metarow b{display:block;font-weight:400;font-size:10.5px;letter-spacing:.09em;
  text-transform:uppercase;color:var(--mute)}

/* сторінка політики: картка володільця і примітка */
.legal .card{background:var(--bg-1);border:1px solid var(--line);border-radius:5px;padding:16px 20px;margin:0 0 18px}
.legal .card p{margin:0 0 8px}
.legal .card p:last-child{margin-bottom:0}
.legal .note{border-left:2px solid var(--accent);padding:3px 0 3px 14px;color:var(--mute-2);font-size:14.5px;margin:0 0 18px}
.legal a{color:var(--accent)}

/* FAQ: нативний details/summary — акордеон без JS, текст відповідей
   лишається в розмітці і в згорнутому стані (важливо для краулерів) */
.faqlist{margin:34px 0 0;border-bottom:1px solid var(--line)}
.qa{border-top:1px solid var(--line)}
.qa summary{
  display:flex;gap:14px;align-items:baseline;cursor:pointer;
  padding:21px 0;list-style:none;
  font-family:var(--serif);font-size:clamp(19px,2.7vw,24px);line-height:1.32;
}
.qa summary::-webkit-details-marker{display:none}
.qa .qa__q{flex:1;text-wrap:balance;transition:color .2s}
.qa summary:hover .qa__q{color:var(--accent)}
.qa summary::after{
  content:"";width:15px;height:15px;flex:none;align-self:center;
  background:var(--accent);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M3 6l5 5 5-5' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M3 6l5 5 5-5' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
  transition:transform .22s ease;
}
.qa[open] summary::after{transform:rotate(180deg)}
.qa__a{padding:2px 0 24px}
.qa__a p{margin:0 0 16px;color:var(--fg-2);max-width:62ch}
.qa__a p:last-child{margin-bottom:0}
.qa__a a{color:var(--accent)}
@supports (interpolate-size: allow-keywords){
  :root{interpolate-size:allow-keywords}
  .qa::details-content{block-size:0;overflow:hidden;
    transition:block-size .24s ease,content-visibility .24s allow-discrete}
  .qa[open]::details-content{block-size:auto}
}

/* кар'єра */
.crit__h{font-family:var(--mono);font-weight:500;font-size:12px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--mute);margin:44px 0 18px}
.crit{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px}
.crit .card__x{color:var(--fg-2);font-size:14.5px}
.apply{border-top:1px solid var(--line);margin-top:44px;padding-top:34px}
.apply h2{font-family:var(--serif);font-weight:400;font-size:clamp(23px,3.2vw,30px);margin:0 0 14px}
.apply p{color:var(--fg-2);margin:0 0 22px;max-width:56ch}
.apply__btn{display:inline-block;font-family:var(--mono);font-size:14px;letter-spacing:.03em;
  color:var(--accent-fg);background:var(--accent);border-radius:4px;padding:12px 22px;text-decoration:none}
.apply__btn:hover{background:var(--accent-2)}

/* підвал */
.foot{max-width:var(--wrap);margin:56px auto 0;padding:24px;border-top:1px solid var(--line);
  display:flex;flex-wrap:wrap;gap:12px 22px;align-items:center;
  font-family:var(--mono);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--mute)}
.foot a{color:var(--mute-2);text-decoration:none}
.foot a:hover{color:var(--accent)}
.foot__b{margin-left:auto;color:var(--mute)}

a:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:2px}

@media (max-width:640px){
  body{font-size:16.5px}
  .bar{padding:16px}
  main{padding:0 18px}
  .foot{padding:20px 18px}
  .foot__b{margin-left:0;width:100%}
}
@media (prefers-reduced-motion:reduce){
  *{transition:none!important}
}