
:root {
  --ink:#16171B; --paper:#F4E4E2; --muted:#5C5A60; --line:#E2C9C6; --granate:#6E1630;
  --accent:#7A1F3D; --accent-dark:#5A1229; --blush:#FBF1EF; --stone:#EBD5D2;
  --navy:#2E4A62; --gold:#C9A45C; --sky:#E6F0F5; --peach:#FBEDE4;
  --serif:'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --sans:Inter, system-ui, -apple-system, 'Segoe UI', sans-serif;
}
* { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--sans); line-height:1.6; }
body:not([data-lang="en"]) [data-l="en"],
body:not([data-lang="es"]) [data-l="es"],
body:not([data-lang="fr"]) [data-l="fr"] { display:none !important; }
a { color:var(--accent); } a:hover { color:var(--ink); }
.wrap { max-width:1180px; margin:0 auto; padding:0 24px; }
.muted { color:var(--muted); }

/* top bar */
.topbar { background:var(--accent); color:#fff; }
.topbar .wrap { display:flex; justify-content:space-between; align-items:center; gap:16px; min-height:56px; }
.home-link { font-family:var(--serif); font-weight:600; font-size:24px; color:#fff; text-decoration:none; }
.home-link:hover { color:#F5D7DF; }
.home-link span { color:var(--gold); }
.langs { display:flex; gap:4px; }
.langs button { font:inherit; min-width:44px; min-height:40px; border:0; border-radius:999px; background:none; cursor:pointer;
  font-size:12px; font-weight:600; letter-spacing:.08em; color:#F5D7DF; }
.langs button[aria-pressed="true"] { background:#fff; color:var(--accent); }

/* masthead */
.masthead { text-align:center; padding:52px 24px 36px; }
.logo { font-family:var(--serif); font-weight:600; font-size:clamp(52px, 9vw, 104px); line-height:1; letter-spacing:-.02em; margin:0; }
.logo { color:var(--granate); }
.logo span { color:var(--gold); }
.tagline { margin:14px 0 0; font-family:var(--serif); font-style:italic; font-size:clamp(18px, 2.4vw, 22px); color:var(--muted); }
.edition-date { display:inline-block; margin:18px 0 0; padding:6px 14px; border-radius:999px; background:#fff;
  font-size:12px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--accent); }
.rule { height:6px; background:linear-gradient(90deg, #7A1F3D 0 25%, #2E4A62 25% 50%, #C9A45C 50% 75%, #2F6F6A 75% 100%); }

/* lead story */
.lead-band { background:var(--granate); color:#fff; }
.lead-band .dek { color:#F1D3DA; }
.lead-band .muted { color:#E9C3CC; }
.lead-band .cta { background:var(--gold); color:var(--ink); }
.lead-band .cta:hover { background:#fff; color:var(--granate); }
.lead-band .lead-title a:hover { color:#F5D7DF; }
.lead-band .pill { background:#fff !important; color:var(--granate); }
.lead { display:grid; grid-template-columns:minmax(0, 1.35fr) minmax(0, 1fr); gap:48px; align-items:center; padding-top:52px; padding-bottom:52px; }
.lead a.img-link { display:block; }
.lead-img { width:100%; aspect-ratio:4/3; object-fit:cover; display:block; border-radius:4px; box-shadow:12px 12px 0 var(--gold); }
.lead-title { font-family:var(--serif); font-weight:600; font-size:clamp(34px, 4.4vw, 56px); line-height:1.05;
  letter-spacing:-.01em; margin:14px 0 16px; }
.lead-title a, .card h3 a { color:inherit; text-decoration:none; }
.lead-title a:hover, .card h3 a:hover { color:var(--cat, var(--accent)); }
.dek { font-size:18px; color:var(--muted); margin:0 0 24px; }
.cta { display:inline-flex; gap:8px; align-items:center; min-height:48px; padding:0 24px; border-radius:999px;
  background:var(--accent); color:#fff; font-weight:600; font-size:15px; text-decoration:none; }
.cta:hover { background:var(--ink); color:#fff; }

/* labels */
.kicker { margin:0; display:flex; flex-wrap:wrap; align-items:center; gap:10px; font-size:11px; font-weight:600;
  letter-spacing:.12em; text-transform:uppercase; }
.pill { display:inline-block; padding:5px 11px; border-radius:999px; color:#fff; }

/* news grid */
.section-title { display:flex; align-items:center; gap:16px; margin:56px 0 28px; font-family:var(--serif); font-weight:600; font-size:34px; color:var(--granate); }
.section-title::after { content:""; flex:1; height:2px; background:linear-gradient(90deg, var(--granate), transparent); }
.grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(300px, 1fr)); gap:44px 32px; padding-bottom:72px; }
.card { display:flex; flex-direction:column; gap:12px; border-top:4px solid var(--cat); padding-top:16px; }
.card-img { width:100%; aspect-ratio:3/2; object-fit:cover; display:block; border-radius:4px; transition:transform .25s; }
.card a.img-link { display:block; overflow:hidden; border-radius:4px; }
.card a.img-link:hover .card-img { transform:scale(1.03); }
.card h3 { font-family:var(--serif); font-weight:600; font-size:26px; line-height:1.15; margin:0; }
.card-dek { margin:0; color:var(--muted); font-size:15px; }
.pixel { image-rendering:pixelated; background:var(--stone); }
.ph { display:flex; align-items:center; justify-content:center; background:var(--cat, var(--stone)); font-family:var(--serif);
  font-style:italic; font-size:28px; color:#fff; }
.empty { text-align:center; padding:96px 0; font-family:var(--serif); font-size:28px; color:var(--muted); }

/* advertising */
.sp { display:flex; flex-direction:column; gap:6px; }
.sp-tag { font-size:10px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); }
.sp-box { display:flex; align-items:center; justify-content:center; background:var(--blush); border:1px dashed #C99AA5;
  border-radius:4px; text-align:center; padding:16px; }
.sp-house { display:flex; flex-direction:column; gap:6px; align-items:center; font-size:14px; color:var(--granate); }
.sp-house a { color:var(--granate); font-weight:600; }
.sp-logo { font-family:var(--serif); font-weight:600; font-size:22px; color:var(--granate); }
.sp-leader { margin:40px auto 0; max-width:970px; }
.sp-leader .sp-box { min-height:110px; }
.sp-card .sp-box { aspect-ratio:3/2; height:auto; }
.sp-card { border-top:4px solid #C99AA5; padding-top:16px; }
.sp-inline { margin:12px 0 8px; }
.sp-inline .sp-box { min-height:250px; }
.sp-rail .sp-box { min-height:600px; }
.side-col { display:none; position:fixed; top:150px; width:120px; z-index:1; }
.side-col .sp-box { min-height:600px; padding:10px; font-size:13px; }
.side-col .sp-logo { font-size:18px; }
.side-col.left { left:calc(50% - 590px - 144px); }
.side-col.right { right:calc(50% - 590px - 144px); }
body:has(.story-layout) .side-col.right { display:none !important; }

/* article page */
.story-layout { max-width:1180px; margin:0 auto; display:flex; gap:56px; padding:0 24px; justify-content:center; }
.story { flex:0 1 780px; min-width:0; padding:40px 0 72px; }
.rail { display:none; flex:0 0 300px; padding-top:96px; }
.rail .sp { position:sticky; top:24px; }
.back { display:inline-block; margin-bottom:24px; font-size:14px; font-weight:600; text-decoration:none; }
.story h1 { color:var(--granate); font-family:var(--serif); font-weight:600; font-size:clamp(36px, 5.4vw, 60px); line-height:1.05; margin:14px 0 16px; }
.story .dek { font-size:20px; }
.byline { font-size:13px; color:var(--muted); margin:0 0 28px; padding-bottom:20px; border-bottom:2px solid var(--granate); }
.story-img { width:100%; aspect-ratio:16/9; object-fit:cover; display:block; border-radius:4px; }
.credit { margin:8px 0 32px; font-size:12px; color:var(--muted); }
.credit a { color:var(--muted); }
.body p { font-size:19px; line-height:1.75; margin:0 0 22px; }
.body div > p:first-child::first-letter { float:left; font-family:var(--serif); font-weight:600; font-size:68px;
  line-height:.85; padding:6px 10px 0 0; color:var(--cat); }
.box { padding:24px 28px; margin-top:28px; border-radius:4px; }
.box.keys { background:#fff; }
.box.accent { background:var(--granate); color:#fff; }
.box.accent h2 { color:var(--gold) !important; }
.box.move { background:var(--blush); }
.box h2, .src-title { margin:0 0 10px; font-size:12px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--accent); }
.box.keys h2 { color:var(--navy); }
.box.move h2 { color:#9A4A26; }
.box p, .box li { font-size:17px; margin:0 0 8px; }
.box ul { margin:0; padding-left:20px; }
.src-title { margin-top:40px; }
.sources { margin:0; padding-left:20px; font-size:14px; }
.sources li { margin-bottom:6px; word-break:break-word; }

/* newsletter + footer */
.subscribe { background:#4A0E20; color:#fff; }
.sub-inner { display:flex; flex-wrap:wrap; gap:24px; align-items:center; justify-content:space-between; padding-top:52px; padding-bottom:52px; }
.sub-kicker { margin:0 0 6px; font-family:var(--serif); font-weight:600; font-size:36px; }
.sub-text { margin:0; color:#EBC9D2; max-width:560px; }
.cta.light { background:var(--gold); color:var(--ink); }
.cta.light:hover { background:#fff; color:var(--ink); }
footer { background:var(--ink); color:#B8BAC1; padding:40px 24px 52px; text-align:center; font-size:13px; max-width:none !important; }
footer p { margin:4px 0; }
footer .logo-sm { font-family:var(--serif); font-weight:600; font-size:30px; color:#fff; display:block; margin-bottom:6px; }
.ai-note { max-width:560px; margin:14px auto 0 !important; font-size:12px; color:#8E9199; }

@media (min-width: 1460px) {
  .side-col { display:block; }
}
@media (min-width: 1640px) {
  .side-col { width:160px; }
  .side-col.left { left:calc(50% - 590px - 196px); }
  .side-col.right { right:calc(50% - 590px - 196px); }
}
@media (min-width: 1200px) {
  .rail { display:block; }
  .sp-inline { display:none; }
}
@media (max-width: 820px) {
  .lead { grid-template-columns:1fr; gap:28px; padding-top:32px; padding-bottom:40px; }
  .lead-img { box-shadow:8px 8px 0 var(--gold); }
  .grid { grid-template-columns:1fr; gap:40px; }
  .wrap { padding:0 16px; }
  .story-layout { padding:0 16px; }
  .story { padding:28px 0 56px; }
  .body p { font-size:18px; }
  .box { padding:20px; }
  .sp-leader { margin-top:28px; }
}
