:root { color-scheme:dark; font-family:"Golos Text","Segoe UI",sans-serif; background:#10131c; color:#edf0f8; --bg:#10131c; --panel:#1b202c; --sidebar:#151a24; --hover:#252c3b; --text:#edf0f8; --muted:#a4aec3; --line:#30394b; --accent:#b3baff; --primary:#6261df; --primary-hover:#7372ed; --tint:#2b2e49; --shadow:0 16px 40px #00000024; }
:root.light-theme { color-scheme:light; background:#f4f5f9; color:#202536; --bg:#f4f5f9; --panel:#fff; --sidebar:#fafbfe; --hover:#eff1f7; --text:#202536; --muted:#687287; --line:#e4e7ef; --accent:#5450c6; --primary:#5b55d6; --primary-hover:#4942bd; --tint:#eeedfb; --shadow:0 16px 40px #2930520b; }
@font-face { font-family:"Golos Text"; src:url("/assets/fonts/golos-text-variable.ttf") format("truetype"); font-weight:400 900; font-display:swap; }
* { box-sizing: border-box; }
body { min-height:100vh; margin:0; background:radial-gradient(circle at 80% 0%,var(--tint),transparent 38%),var(--bg); }
header, main, footer { width:min(1080px,100%); margin:auto; padding:28px; }
header { display:flex; justify-content:space-between; gap:24px; align-items:center; border-bottom:1px solid var(--line); }
a { color:var(--accent); text-underline-offset:5px; transition:color .2s ease,opacity .2s ease; }
a:hover { color:var(--text); }
.brand { display:flex; align-items:center; gap:10px; color:var(--text); font-size:26px; font-weight:750; text-decoration:none; letter-spacing:-.05em; }
.brand::before { content:""; display:block; width:34px; height:34px; background:var(--accent); -webkit-mask:url('/assets/yominds-mark.svg?v=20261006-mark') center/76% 76% no-repeat; mask:url('/assets/yominds-mark.svg?v=20261006-mark') center/76% 76% no-repeat; }
h1 { max-width:850px; font-size:clamp(38px,6vw,70px); line-height:1.08; margin:20px 0; color:var(--text); letter-spacing:-.065em; }
h2 { color:var(--text); font-size:28px; letter-spacing:-.035em; }
.eyebrow { color:var(--accent); font-size:11px; font-weight:750; letter-spacing:.14em; margin-top:48px; }
p, li { color:var(--muted); line-height:1.75; }
.intro { max-width:750px; font-size:20px; }
.button { display:inline-block; background:var(--primary); color:#fff; font-weight:650; padding:13px 20px; margin:14px 0; border:1px solid transparent; border-radius:11px; text-decoration:none; box-shadow:0 8px 20px rgba(45,75,180,.2); transition:background .2s ease,transform .2s ease,box-shadow .2s ease; }
.button:hover { color:#fff; background:var(--primary-hover); transform:translateY(-2px); box-shadow:0 12px 26px rgba(45,75,180,.28); }
section { margin-top:64px; }
.grid { display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
article { background:var(--panel); border:1px solid var(--line); border-radius:17px; padding:22px; box-shadow:0 7px 20px rgba(31,48,82,.06); transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease; }
article:hover { border-color:var(--accent); transform:translateY(-3px); box-shadow:0 12px 26px rgba(31,48,82,.12); }
article h3 { display:flex; align-items:center; gap:10px; margin-top:0; color:var(--text); }
.hub-icon { width:22px; height:22px; flex:none; color:var(--accent); fill:none; stroke:currentColor; stroke-width:1.75; stroke-linecap:round; stroke-linejoin:round; }
footer { border-top:1px solid var(--line); margin-top:48px; color:var(--muted); font-size:14px; }
:focus-visible { outline:3px solid var(--tint); outline-offset:3px; box-shadow:0 0 0 1px var(--accent); }
@media (max-width:600px) { .grid { grid-template-columns:1fr; } header { flex-wrap:wrap; } header, main, footer { padding:20px; } h1 { font-size:clamp(28px,8vw,38px); overflow-wrap:break-word; } .intro { font-size:18px; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { transition:none !important; animation:none !important; scroll-behavior:auto !important; } }
