:root { --journal-ink:#17373e; --journal-muted:#60767a; --journal-paper:#f7fbfb; --journal-line:rgba(55,103,113,.16); --journal-aqua:#7ed9e8; --journal-sand:#d9c29a; --journal-display:Inter,system-ui,sans-serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body.journal { margin:0; min-width:320px; background:radial-gradient(circle at 8% 4%,rgba(160,229,242,.2),transparent 25rem),radial-gradient(circle at 94% 15%,rgba(242,222,184,.18),transparent 26rem),var(--journal-paper); color:var(--journal-ink); font-family:var(--journal-display); }
a { color:inherit; text-decoration:none; }
.journal-shell { width:min(1060px,calc(100% - 48px)); margin-inline:auto; }
.journal-header { min-height:94px; display:flex; align-items:center; justify-content:space-between; gap:24px; border-bottom:1px solid var(--journal-line); }
.journal-brand { display:flex; align-items:center; gap:15px; }
.journal-brand img { width:111px; height:auto; }
.journal-brand span { padding-left:15px; border-left:1px solid var(--journal-line); color:#42666d; font-size:10px; font-weight:700; letter-spacing:.1em; }
.journal-back { padding:10px 13px; border:1px solid rgba(255,255,255,.82); border-radius:999px; background:rgba(255,255,255,.54); box-shadow:inset 0 1px 0 white; color:#3d6168; font-size:11px; font-weight:700; }
.journal-back:hover { background:rgba(210,247,252,.75); }
.journal-hero { max-width:760px; padding:95px 0 56px; }
.journal-kicker { margin:0 0 15px; color:#51808b; font-size:10px; font-weight:700; letter-spacing:.14em; }
.journal-hero h1,.article-head h1 { margin:0; font-size:clamp(42px,6.2vw,79px); line-height:.98; letter-spacing:-.075em; }
.journal-lead { max-width:600px; margin:22px 0 0; color:var(--journal-muted); font-size:16px; line-height:1.7; }
.topic-strip { display:flex; flex-wrap:wrap; gap:8px; margin-top:29px; }
.topic-strip a { padding:8px 11px; border:1px solid rgba(98,145,154,.2); border-radius:999px; background:rgba(255,255,255,.45); color:#4a7077; font-size:10px; font-weight:700; }
.topic-strip a:hover { background:rgba(195,240,248,.7); color:#1f5e6c; }
.journal-section { padding:12px 0 56px; }
.journal-section-head { display:flex; align-items:end; justify-content:space-between; gap:22px; margin-bottom:18px; }
.journal-section-head h2 { margin:0; font-size:26px; line-height:1.05; letter-spacing:-.05em; }
.journal-section-head p { max-width:430px; margin:0; color:var(--journal-muted); font-size:12px; line-height:1.55; }
.article-list { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.article-list article { min-height:198px; padding:24px; border:1px solid rgba(255,255,255,.82); border-radius:23px; background:rgba(255,255,255,.5); box-shadow:inset 0 1px 0 white; }
.article-list h3 { margin:0; font-size:19px; line-height:1.1; letter-spacing:-.045em; }
.article-list p { margin:12px 0 0; color:var(--journal-muted); font-size:12px; line-height:1.6; }
.article-list .read-link { margin-top:19px; }
.story-grid { display:grid; grid-template-columns:1.2fr .8fr; gap:20px; padding-bottom:72px; }
.story-card { min-height:285px; padding:33px; border:1px solid rgba(255,255,255,.82); border-radius:28px; background:rgba(255,255,255,.56); box-shadow:0 22px 48px rgba(40,90,103,.1),inset 0 1px 0 white; }
.story-card.featured { display:flex; flex-direction:column; justify-content:flex-end; min-height:390px; background:linear-gradient(143deg,rgba(255,255,255,.88),rgba(194,239,247,.68)); }
.story-card.sand { background:linear-gradient(143deg,rgba(255,255,255,.88),rgba(239,227,200,.7)); }
.story-card h2 { max-width:660px; margin:0; font-size:clamp(27px,3.6vw,47px); line-height:1.04; letter-spacing:-.06em; }
.story-card:not(.featured) h2 { font-size:25px; }
.story-card p { max-width:610px; margin:14px 0 0; color:var(--journal-muted); font-size:13px; line-height:1.7; }
.story-meta { margin:0 0 17px; color:#527d85; font-size:9px; font-weight:700; letter-spacing:.12em; }
.story-card.sand .story-meta { color:#876d46; }
.read-link { display:inline-flex; align-items:center; gap:8px; width:max-content; margin-top:23px; padding-bottom:5px; border-bottom:1px solid currentColor; color:#1f5e6c; font-size:11px; font-weight:700; }
.sand .read-link { color:#735b37; }
.journal-note { margin:0 0 72px; padding:28px 31px; border-top:1px solid var(--journal-line); border-bottom:1px solid var(--journal-line); color:var(--journal-muted); font-size:13px; line-height:1.7; }
.journal-note strong { color:var(--journal-ink); }
.journal-footer { display:flex; align-items:center; justify-content:space-between; gap:20px; min-height:95px; border-top:1px solid var(--journal-line); color:#73878a; font-size:10px; }
.journal-footer img { width:116px; height:auto; opacity:.86; }
.article { width:min(760px,100%); padding:78px 0 70px; }
.article-head { padding-bottom:35px; border-bottom:1px solid var(--journal-line); }
.article-head .journal-lead { max-width:640px; font-size:17px; }
.article-byline { display:flex; align-items:center; gap:9px; margin-top:25px; color:#668084; font-size:10px; }
.article-byline b { color:var(--journal-ink); }
.article-body { padding-top:34px; }
.article-body p,.article-body li { color:#415e63; font-size:16px; line-height:1.8; }
.article-body h2 { margin:46px 0 12px; color:var(--journal-ink); font-size:27px; line-height:1.1; letter-spacing:-.045em; }
.article-body ul { padding-left:22px; }
.article-body a { border-bottom:1px solid #6092a0; color:#235f6c; }
.article-body strong { color:var(--journal-ink); }
.article-fact { margin:34px 0; padding:25px 28px; border-radius:20px; background:rgba(205,242,249,.58); color:#2c5b64; font-size:15px; line-height:1.65; }
.article-fact.sand { background:rgba(238,226,197,.62); color:#654f2e; }
.article-author { display:flex; align-items:center; gap:16px; margin:40px 0 0; padding:20px 22px; border-top:1px solid var(--journal-line); border-bottom:1px solid var(--journal-line); }
.article-author img { width:58px; height:58px; border-radius:17px; object-fit:cover; object-position:center 18%; filter:none; }
.article-author p { margin:0; color:var(--journal-muted); font-size:12px; line-height:1.55; }
.article-author b { color:var(--journal-ink); }
.article-author a { border-bottom:1px solid #6d9ba3; color:#235f6c; }
.faq { margin-top:51px; padding-top:2px; }
.faq h2,.sources h2 { margin-top:0; }
.faq details { margin-top:10px; padding:15px 17px; border:1px solid rgba(93,139,148,.19); border-radius:15px; background:rgba(255,255,255,.48); }
.faq summary { cursor:pointer; color:var(--journal-ink); font-size:14px; font-weight:700; line-height:1.4; }
.faq details p { margin:12px 0 0; font-size:14px; line-height:1.65; }
.sources { margin-top:49px; padding:25px 28px; border-radius:19px; background:rgba(237,246,246,.77); }
.sources h2 { font-size:21px; }
.sources ul { margin:0; padding-left:20px; }
.sources li { margin-top:7px; font-size:13px; line-height:1.6; }
.article-cta { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-top:55px; padding:29px 31px; border:1px solid rgba(255,255,255,.85); border-radius:24px; background:rgba(255,255,255,.65); box-shadow:inset 0 1px 0 white; }
.article-cta p { margin:0; color:var(--journal-muted); font-size:13px; line-height:1.5; }
.article-cta a { flex:none; padding:12px 16px; border:0; border-radius:999px; background:#245c68; color:#fff; font-size:11px; font-weight:700; }
@media (max-width:720px) { .journal-shell { width:min(100% - 32px,590px); } .journal-header { min-height:76px; } .journal-brand img { width:84px; } .journal-brand span { padding-left:10px; font-size:8px; } .journal-back { padding:9px 11px; font-size:10px; } .journal-hero { padding:64px 0 38px; } .journal-lead { font-size:14px; } .story-grid,.article-list { grid-template-columns:1fr; padding-bottom:50px; } .story-card,.story-card.featured { min-height:auto; padding:28px 24px; } .journal-section-head { align-items:flex-start; flex-direction:column; } .journal-note { margin-bottom:50px; padding:24px; } .article { padding:54px 0 52px; } .article-body p,.article-body li { font-size:15px; } .article-cta { align-items:flex-start; flex-direction:column; } .journal-footer { display:grid; grid-template-columns:116px minmax(0,1fr); align-items:center; gap:18px; min-height:108px; padding:26px 0 28px; } .journal-footer-home { display:inline-flex; align-items:center; } .journal-footer span { justify-self:end; text-align:right; line-height:1.55; } }
@media (max-width:430px) { .journal-footer { grid-template-columns:104px minmax(0,1fr); gap:14px; min-height:100px; padding:24px 0 26px; } .journal-footer img { width:104px; } .journal-footer span { font-size:9px; } }