:root { --ink:#17191d; --muted:#69717d; --blue:#2459a6; --line:#dce1e8; --pale:#f2f6fc; --serif:Georgia,'Times New Roman',serif; --sans:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif; }
* { box-sizing:border-box; }
body { margin:0; background:#fff; color:var(--ink); font-family:var(--sans); line-height:1.45; }
a { color:inherit; text-decoration:none; } a:hover { color:var(--blue); }
.site-header { max-width:1440px; min-height:72px; margin:auto; padding:0 32px; display:flex; align-items:center; gap:34px; border-bottom:1px solid var(--line); }
.brand { display:flex; align-items:center; gap:12px; font:27px var(--serif); white-space:nowrap; }
.brand-mark { width:39px; height:39px; display:grid; place-items:center; border:1.5px solid var(--ink); border-radius:9px; font:700 25px/1 var(--serif); }
.site-header nav { flex:1; display:flex; justify-content:center; gap:28px; }.site-header nav a { font-size:15px; white-space:nowrap; }.search { padding:5px; font:30px/1 var(--sans); }
.home,.listing,.article-page { max-width:1440px; margin:auto; padding:28px 32px 52px; }.top-grid { display:grid; grid-template-columns:minmax(0,2.3fr) minmax(310px,1fr); gap:34px; padding-bottom:17px; border-bottom:1px solid var(--line); }.lead { display:grid; grid-template-columns:1.35fr 1fr; gap:28px; }
.lead-image,.article-hero,.thumb { position:relative; overflow:hidden; background:linear-gradient(135deg,#7188a1,#30475f); }.lead-image,.article-hero { background-image:url('/assets/demo-train-ai.png'); background-size:cover; background-position:center; }.lead-image { min-height:352px; }.lead-image:before,.article-hero:before,.thumb:before { content:''; position:absolute; inset:0; background:linear-gradient(30deg,rgba(23,45,65,.32),transparent 60%); }.lead-image span,.article-hero span { position:absolute; z-index:1; bottom:12px; left:12px; padding:3px 6px; border-radius:3px; background:rgba(10,20,30,.54); color:#fff; font-size:12px; }
.lead-copy { padding:20px 4px; }.meta { margin:0 0 14px; color:var(--blue); font-size:14px; }.lead h1,.article-page h1,.listing h1 { margin:0 0 20px; max-width:16ch; font:400 clamp(36px,3.4vw,55px)/1.04 var(--serif); letter-spacing:-.03em; }.lead-copy>p:not(.meta),.standfirst { max-width:50ch; margin:0; color:#4b535f; font-size:18px; }
.latest { padding-left:22px; border-left:1px solid var(--line); }.latest h2,.category-band h2,.utility b { margin:0 0 15px; font:700 20px/1.2 var(--serif); }.latest>a:not(.more) { display:grid; grid-template-columns:50px 1fr; gap:10px; padding:10px 0; border-bottom:1px solid var(--line); font:16px/1.25 var(--serif); }.latest time { color:var(--blue); font:13px var(--sans); }.more { display:block; padding-top:14px; color:var(--blue); font-size:14px; }
.category-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:22px; padding:20px 0; }.category-band { padding-right:22px; border-right:1px solid var(--line); }.category-band:last-child { border:0; }.category-band h2 { padding-bottom:8px; border-bottom:3px solid var(--blue); color:var(--blue); font-size:19px; }.thumb { aspect-ratio:1.65; margin-bottom:10px; }.category-band h3 { margin:8px 0; font:400 23px/1.12 var(--serif); }.category-band p { margin:0 0 12px; color:#58616e; font-size:14px; }.mini { display:block; padding:10px 0; border-top:1px solid var(--line); font:15px/1.25 var(--serif); }
.utility { display:grid; grid-template-columns:1fr 1.5fr 1.5fr; gap:20px; padding:17px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }.utility>div { display:flex; align-items:center; gap:16px; padding-right:12px; border-right:1px solid var(--line); }.utility>div:last-child { border:0; }.utility strong { font:34px/1 var(--serif); }.utility span { font-size:14px; }.utility small { color:var(--muted); font-size:12px; }
.site-footer { display:flex; align-items:center; gap:23px; max-width:1440px; margin:auto; padding:22px 32px 34px; border-top:1px solid var(--line); color:#555e6a; font-size:13px; }.site-footer strong { color:var(--ink); font:20px var(--serif); }
.article-page { max-width:900px; }.article-page .meta { margin-top:32px; }.standfirst { margin-bottom:28px; font-size:20px; line-height:1.45; }.article-hero { height:400px; margin:32px 0; }.article-body { max-width:680px; font:20px/1.62 var(--serif); }.article-body p { margin:0 0 24px; }.sources { margin-top:42px; padding-top:20px; border-top:1px solid var(--line); font-family:var(--sans); }.sources h2 { font:700 22px var(--serif); }.sources li { margin:7px 0; color:var(--blue); font-size:15px; }
.listing { max-width:1000px; }.listing h1 { margin-bottom:10px; }.list-card { display:grid; grid-template-columns:250px 1fr; gap:24px; padding:22px 0; border-top:1px solid var(--line); }.list-card .thumb { margin:0; }.list-card h2 { margin:0 0 8px; font:400 29px/1.12 var(--serif); }.list-card p:not(.meta) { margin:0; color:var(--muted); }.information { min-height:50vh; }.information h1 { margin-top:30px; }
@media(max-width:900px) { .site-header{padding:14px 18px;gap:8px}.site-header nav{display:none}.site-header .search{margin-left:auto}.home,.listing,.article-page{padding:18px}.top-grid,.lead{grid-template-columns:1fr;gap:20px}.lead-image{min-height:240px}.latest{padding:20px 0 0;border-top:1px solid var(--line);border-left:0}.category-grid{grid-template-columns:1fr 1fr}.category-band{padding-right:0;border-right:0}.utility{grid-template-columns:1fr}.utility>div{padding-bottom:12px;border-right:0;border-bottom:1px solid var(--line)}.site-footer{flex-wrap:wrap;padding:22px 18px}.article-hero{height:250px}.list-card{grid-template-columns:1fr}.list-card .thumb{max-width:330px} }
@media(max-width:520px) { .category-grid{grid-template-columns:1fr}.lead h1,.article-page h1,.listing h1{font-size:37px}.category-band{padding-bottom:14px;border-bottom:1px solid var(--line)}.utility strong{font-size:30px} }