
:root{--bg:#F8F8F6;--main:#111111;--sub:#D8D8D8;--text:#222222;--card:rgba(255,255,255,.58);--shadow:0 18px 45px rgba(0,0,0,.12)}
*{box-sizing:border-box} html{scroll-behavior:smooth} body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans SC",Arial,sans-serif;background:var(--bg);color:var(--text);line-height:1.85} a{color:inherit;text-decoration:none} img{width:100%;display:block;object-fit:cover} .site-header{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:16px 5vw;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(18px);border-bottom:1px solid color-mix(in srgb,var(--text) 12%,transparent)} .logo{font-weight:800;letter-spacing:.08em;font-size:20px} nav{display:flex;gap:20px;align-items:center;flex-wrap:wrap} nav a{font-size:14px;opacity:.82} .menu-btn{display:none;border:0;background:var(--main);color:var(--bg);border-radius:999px;padding:8px 12px} .hero{display:grid;grid-template-columns:1.05fr .95fr;gap:6vw;align-items:center;min-height:82vh;padding:7vw 5vw} .hero h1,.page-hero h1{font-size:clamp(38px,7vw,86px);line-height:1.05;margin:10px 0 22px;letter-spacing:-.05em} .hero p,.page-hero p{font-size:18px;max-width:720px;opacity:.86} .hero-img img{height:min(72vh,760px);border-radius:44px;box-shadow:var(--shadow)} .eyebrow{display:inline-block;padding:5px 12px;border-radius:999px;background:var(--sub);color:var(--text);font-size:13px;letter-spacing:.12em} .actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:28px} .btn{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:12px 22px;background:linear-gradient(135deg,var(--main),var(--sub));color:var(--bg);font-weight:700;box-shadow:0 10px 24px color-mix(in srgb,var(--main) 30%,transparent)} .section{padding:58px 5vw} .section h2{font-size:clamp(28px,4vw,54px);line-height:1.18;margin:14px 0 22px} .grid{display:grid;gap:24px} .cards{grid-template-columns:repeat(3,minmax(0,1fr))} .card,.story,details{background:var(--card);border:1px solid color-mix(in srgb,var(--text) 10%,transparent);border-radius:30px;padding:20px;box-shadow:var(--shadow)} .card img{height:260px;border-radius:22px;margin-bottom:16px} .tag{font-size:12px;background:var(--sub);padding:4px 10px;border-radius:999px} .link{font-weight:700;color:var(--main)} .split{display:grid;grid-template-columns:1fr .9fr;gap:40px;align-items:center} .split img{border-radius:36px;max-height:620px;box-shadow:var(--shadow)} .stories{grid-template-columns:repeat(4,minmax(0,1fr))} .stars{color:var(--main);letter-spacing:.1em} .timeline ol{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;padding:0;list-style:none} .timeline li{padding:22px;border-radius:26px;background:var(--card);box-shadow:var(--shadow)} details{margin:14px 0} summary{cursor:pointer;font-weight:800} .page-hero{padding:90px 5vw 40px} .article{max-width:980px;margin:auto} .masonry{columns:3 260px;column-gap:18px;margin:34px 0} .masonry img{break-inside:avoid;border-radius:28px;margin:0 0 18px;box-shadow:var(--shadow)} .footer{margin-top:70px;padding:50px 5vw;background:color-mix(in srgb,var(--text) 8%,transparent)} .footer-links{display:flex;gap:18px;flex-wrap:wrap;margin:20px 0} .top-btn{position:fixed;right:18px;bottom:18px;border:0;border-radius:50%;width:46px;height:46px;background:var(--main);color:var(--bg);box-shadow:var(--shadow);display:none} .top-btn.show{display:block}
@media(max-width:860px){nav{display:none;position:absolute;left:5vw;right:5vw;top:62px;background:var(--bg);border-radius:24px;padding:18px;box-shadow:var(--shadow)}nav.open{display:grid}.menu-btn{display:block}.hero,.split{grid-template-columns:1fr}.hero{padding-top:32px}.cards,.stories,.timeline ol{grid-template-columns:1fr}.card img{height:220px}}
