:root { --blue:#2A46E0; --ink:#333333; --cream:#FAF4EC; --muted:#5a5a5a; }
@font-face { font-family:'Archivo'; font-style:normal; font-weight:400; font-display:swap; src:url('fonts/archivo-400.woff2') format('woff2'); }
@font-face { font-family:'Archivo'; font-style:normal; font-weight:500; font-display:swap; src:url('fonts/archivo-500.woff2') format('woff2'); }
@font-face { font-family:'Archivo'; font-style:normal; font-weight:600; font-display:swap; src:url('fonts/archivo-600.woff2') format('woff2'); }
@font-face { font-family:'Archivo'; font-style:normal; font-weight:700; font-display:swap; src:url('fonts/archivo-700.woff2') format('woff2'); }
@font-face { font-family:'Archivo'; font-style:normal; font-weight:800; font-display:swap; src:url('fonts/archivo-800.woff2') format('woff2'); }
@font-face { font-family:'Archivo'; font-style:normal; font-weight:900; font-display:swap; src:url('fonts/archivo-900.woff2') format('woff2'); }
@font-face { font-family:'Freeroad'; src:url('fonts/Freeroad-Bold.ttf') format('truetype'); font-weight:700; font-display:swap; }
@font-face { font-family:'Freeroad'; src:url('fonts/Freeroad-Black.ttf') format('truetype'); font-weight:800 900; font-display:swap; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; font-family:Archivo,Helvetica,Arial,sans-serif; color:var(--ink); background:#fff; -webkit-font-smoothing:antialiased; text-wrap:pretty; }
a { color:var(--blue); text-decoration:none; }
a:hover { text-decoration:underline; }
img { max-width:100%; }
.wrap { max-width:820px; margin:0 auto; padding:0 clamp(20px,5vw,32px); }

.site-header { position:sticky; top:0; z-index:50; background:rgba(255,255,255,0.96); backdrop-filter:saturate(140%) blur(8px); border-bottom:1px solid #e8e2d8; }
.site-header .bar { max-width:1180px; margin:0 auto; padding:10px clamp(16px,4vw,32px); display:flex; align-items:center; gap:14px; }
.brand { display:flex; align-items:center; gap:8px; margin-right:auto; color:var(--ink); min-width:0; }
.brand:hover { text-decoration:none; }
.brand img { width:34px; height:auto; display:block; flex:none; }
.brand span { font-weight:900; letter-spacing:-0.03em; font-size:clamp(13px,2.8vw,19px); white-space:nowrap; font-family:'Freeroad',Archivo,Helvetica,sans-serif; }
.btn { font-weight:800; font-size:15px; color:#fff; background:var(--blue); padding:10px 16px; border-radius:10px; box-shadow:0 8px 18px rgba(42,70,224,0.25); white-space:nowrap; flex:none; }
.btn:hover { background:#1c33ad; text-decoration:none; color:#fff; }
.btn { position:relative; overflow:hidden; isolation:isolate; }
.btn::before { content:""; position:absolute; inset:0; background:#1b2a72; transform:translateX(-101%); transition:transform .55s cubic-bezier(.16,1,.3,1); z-index:-1; }
.btn:hover::before { transform:translateX(0); }
.btn:hover { background:var(--blue); }
.btn::after { content:"\2192"; display:inline-block; margin-left:8px; transition:transform .55s cubic-bezier(.16,1,.3,1); }
.btn:hover::after { transform:translateX(5px); }

.breadcrumb { font-size:13px; color:#8a8a8a; padding:22px 0 0; }
.breadcrumb a { color:#8a8a8a; }
article { padding:8px 0 8px; }
article h1 { font-size:clamp(28px,4.6vw,44px); line-height:1.1; font-weight:900; letter-spacing:-0.02em; margin:14px 0 12px; }
.lead { font-size:clamp(17px,2.2vw,20px); line-height:1.5; color:var(--ink); margin:0 0 8px; }
.meta { font-size:13px; color:#8a8a8a; margin:0 0 24px; }
article h2 { font-size:clamp(21px,2.8vw,28px); line-height:1.2; font-weight:900; letter-spacing:-0.01em; margin:34px 0 12px; }
article h3 { font-size:18px; font-weight:800; margin:22px 0 8px; }
article p { font-size:16.5px; line-height:1.7; color:#3f3f3f; margin:0 0 16px; }
article ul { margin:0 0 16px; padding-left:22px; }
article li { font-size:16.5px; line-height:1.7; color:#3f3f3f; margin:0 0 8px; }
.article-hero { width:100%; height:clamp(220px,38vw,360px); object-fit:cover; border-radius:16px; display:block; margin:6px 0 28px; }
.callout { background:var(--cream); border:1px solid #eae3d7; border-left:4px solid var(--blue); border-radius:12px; padding:18px 20px; margin:24px 0; }
.callout p { margin:0; font-size:16px; }
.article-cta { background:#333333; color:#fff; border-radius:16px; padding:28px clamp(20px,4vw,32px); margin:36px 0 0; text-align:center; }
.article-cta h2 { color:#fff; margin:0 0 10px; }
.article-cta p { color:#d8d8d8; margin:0 0 18px; }
.article-cta .btn { display:inline-block; font-size:16px; padding:14px 24px; }
.more { margin:40px 0 0; border-top:1px solid #eee; padding-top:18px; }
.more strong { display:block; font-size:13px; letter-spacing:0.1em; text-transform:uppercase; color:#8a8a8a; margin-bottom:8px; }
.more a { display:block; font-weight:700; padding:7px 0; color:var(--ink); }
.more a:hover { color:var(--blue); }

.site-footer { background:var(--cream); border-top:1px solid #eae3d7; margin-top:44px; }
.site-footer .inner { max-width:1180px; margin:0 auto; padding:28px clamp(20px,5vw,32px); font-size:14px; color:var(--muted); line-height:1.7; }
.site-footer .brandline { font-weight:900; font-size:18px; color:var(--ink); font-family:'Freeroad',Archivo,Helvetica,sans-serif; margin:0 0 6px; }
.site-footer a { font-weight:700; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior:auto; } }