:root{
  --font: "Sora", system-ui, -apple-system, sans-serif;
  --lagoon:#0FA396; --lagoon-bright:#12C7B5; --rose:#E8736B;
  --coral:#EE6A52; --coral-deep:#D8523B;      /* punchy energy accent (live/latest) */
  --ink:#14161F;                               /* dark chrome (ribbon/footer) — both modes */
  --grad:linear-gradient(90deg,var(--lagoon),var(--rose));
  --champagne:#E8DCC8; --maxw:1240px; --radius:16px; --r:12px;
}
:root, [data-theme="light"]{
  --bg:#FBFAF6; --bg-soft:#F4F1E9; --surface:#fff; --sand:#F2ECE0; --text:#11141F; --muted:#5C6373;
  --hair:rgba(17,20,31,.11); --link:#0B7E73; --pill-fg:#06231f; --label-teal:#0A7268; --coral-text:#B23A24;
  --hero-glow:rgba(15,163,150,.10); --shadow:0 14px 40px rgba(17,20,31,.08);
}
[data-theme="dark"]{
  --bg:#10131F; --bg-soft:#161A29; --surface:#171B2A; --sand:#1B2030; --text:#EEF0F4; --muted:#AEB4C2;
  --hair:rgba(255,255,255,.11); --link:#12C7B5; --pill-fg:#06231f; --label-teal:#12C7B5; --coral-text:#F0836E;
  --hero-glow:rgba(15,163,150,.22); --shadow:0 18px 50px rgba(0,0,0,.45);
}
*{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }
body{ margin:0; background:var(--bg); color:var(--text); font-family:var(--font);
  line-height:1.65; -webkit-font-smoothing:antialiased; transition:background .25s,color .25s; }
.wrap{ max-width:var(--maxw); margin:0 auto; padding:0 24px; }
a{ color:var(--link); text-decoration:none; }
a:hover{ text-decoration:underline; }
img{ max-width:100%; display:block; }
:focus-visible{ outline:2px solid var(--lagoon); outline-offset:2px; border-radius:4px; }
h1,h2,h3,h4{ font-weight:800; letter-spacing:-.03em; line-height:1.05; margin:0; }
.eyebrow{ font-size:12px; font-weight:600; letter-spacing:.22em; text-transform:uppercase; color:var(--label-teal); }
.muted{ color:var(--muted); }
/* horizon signature */
.horizon{ position:relative; height:1px; margin:30px 0;
  background:linear-gradient(90deg,transparent,var(--lagoon) 30%,var(--rose) 70%,transparent); }
.horizon[data-coord]::after{ content:attr(data-coord); position:absolute; right:0; top:-9px;
  font-size:10px; letter-spacing:.3em; color:var(--muted); }
/* pills */
.pill{ display:inline-flex; align-items:center; gap:7px; padding:5px 13px; border-radius:999px;
  font-size:12px; font-weight:700; background:var(--grad); color:var(--pill-fg); width:max-content; }
.pill--ghost{ background:transparent; color:var(--link); border:1px solid var(--hair); }
/* circular gradient "read more" arrow */
.more{ display:inline-flex; align-items:center; gap:10px; font-weight:600; color:var(--text); }
.more .arrow{ width:34px; height:34px; border-radius:999px; display:grid; place-items:center;
  background:var(--grad); color:#06231f; transition:transform .2s; }
.more:hover{ text-decoration:none; } .more:hover .arrow{ transform:translateX(3px); }
/* cards */
.card .ph{ aspect-ratio:16/10; border-radius:var(--radius); overflow:hidden; background:var(--bg-soft); }
.card .ph img{ width:100%; height:100%; object-fit:cover; }
.card .ck{ font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--label-teal); margin-top:12px; display:block; }
.card h3{ font-size:19px; letter-spacing:-.02em; margin-top:6px; }
.card h3 a{ color:var(--text); } .card h3 a:hover{ color:var(--link); }
/* category circle */
.cat{ display:flex; flex-direction:column; align-items:center; gap:10px; width:84px; text-align:center; }
.cat .ring{ width:64px; height:64px; border-radius:999px; object-fit:cover; background:var(--bg-soft);
  box-shadow:0 10px 24px var(--hero-glow); border:1px solid var(--hair); }
.cat small{ font-size:12.5px; font-weight:600; } .cat em{ font-style:normal; font-size:11px; color:var(--muted); }
/* header / footer */
.site-head{ position:sticky; top:0; z-index:40; background:color-mix(in srgb,var(--bg) 88%,transparent);
  backdrop-filter:saturate(140%) blur(10px); border-bottom:1px solid var(--hair); }
.site-foot{ border-top:1px solid var(--hair); margin-top:64px; padding:40px 0; color:var(--muted); font-size:14px; }
.toggle{ width:38px; height:38px; border-radius:999px; border:1px solid var(--hair); background:var(--surface);
  color:var(--text); display:grid; place-items:center; cursor:pointer; }
.btn{ display:inline-flex; align-items:center; gap:8px; padding:10px 17px; border-radius:999px;
  background:var(--lagoon); color:#04231f; font-weight:800; border:0; cursor:pointer; text-decoration:none;
  transition:filter .15s, transform .15s; }
.btn:hover{ filter:brightness(1.05); text-decoration:none; }
.btn--coral{ background:var(--coral); color:#2a0b04; }
@media (prefers-reduced-motion: reduce){ *{ animation:none!important; transition:none!important; } .more .arrow{ transition:none; } }

/* ── Task 2: Header / nav / ticker / footer ───────────────────────────── */

/* Brand logotype */
.brand{ font-size:22px; font-weight:800; letter-spacing:-.04em; color:var(--text);
  white-space:nowrap; flex-shrink:0; }
.brand:hover{ text-decoration:none; color:var(--text); }
.brand span{ color:var(--rose); }

/* Nav bar layout */
.rak-nav{ display:flex; align-items:center; gap:22px; height:66px; }

/* Desktop: details/summary used only as mobile disclosure — hide the toggle at wide widths */
.rak-menu-wrap{ display:contents; }       /* flatten into flex row */
.rak-menu-wrap > summary{ display:none; } /* hide burger on desktop */
.rak-links{ display:flex; gap:20px; font-weight:600; font-size:14.5px; list-style:none;
  margin:0; padding:0; }
.rak-links a{ color:var(--text); }
.rak-links a:hover{ color:var(--link); text-decoration:none; }

/* Search pill */
.rak-search{ margin-left:auto; }
.rak-search input{ height:36px; padding:0 14px; border-radius:999px;
  border:1px solid var(--hair); background:var(--surface); color:var(--text);
  font-family:var(--font); font-size:14px; outline:none; width:180px;
  transition:border-color .2s, width .2s; }
.rak-search input::placeholder{ color:var(--muted); }
.rak-search input:focus{ border-color:var(--lagoon); width:220px; }

/* Sun / moon icon swap */
[data-theme="dark"]  .i-moon{ display:none; }
[data-theme="light"] .i-sun { display:none; }
/* Default (no attribute = light): hide sun, show moon */
:root:not([data-theme]) .i-sun{ display:none; }

/* ── Mobile nav (< 860px) ──────────────────────────────────────────────── */
@media (max-width: 860px){
  .rak-menu-wrap{ display:block; position:static; }
  .rak-menu-wrap > summary{
    display:grid; place-items:center; width:38px; height:38px;
    border-radius:999px; border:1px solid var(--hair); background:var(--surface);
    color:var(--text); cursor:pointer; list-style:none; flex-shrink:0; }
  .rak-menu-wrap > summary::-webkit-details-marker{ display:none; }
  /* show X when open, burger when closed */
  .rak-menu-wrap > summary .i-close{ display:none; }
  .rak-menu-wrap[open] > summary .i-burger{ display:none; }
  .rak-menu-wrap[open] > summary .i-close{ display:inline; }
  /* dropdown panel */
  .rak-links{
    flex-direction:column; gap:0; position:absolute; top:66px; left:0; right:0;
    background:var(--bg); border-bottom:1px solid var(--hair);
    padding:12px 24px 16px; z-index:39; }
  .rak-links a{ padding:8px 0; border-bottom:1px solid var(--hair); font-size:15px; }
  .rak-links a:last-child{ border-bottom:0; }
  .rak-search{ margin-left:auto; }
  .rak-search input{ width:130px; }
  .rak-search input:focus{ width:160px; }
  /* keep site-head positioned so dropdown can use absolute */
  .site-head{ position:sticky; }
}

/* ── Ticker ──────────────────────────────────────────────────────────────── */
.rak-ticker{ background:var(--bg-soft); border-bottom:1px solid var(--hair); font-size:13px; }
.rak-ticker .wrap{ display:flex; align-items:center; gap:14px; height:36px; overflow:hidden; }
.rak-ticker__track{ display:flex; gap:32px; overflow:hidden; white-space:nowrap;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent); }
.rak-ticker__track a{ color:var(--text); flex-shrink:0; }
.rak-ticker__track a:hover{ color:var(--link); text-decoration:none; }

/* ── Footer ─────────────────────────────────────────────────────────────── */
.rak-foot-grid{ display:grid; gap:32px 48px;
  grid-template-columns:2fr 1fr 1fr; margin:32px 0; }
.rak-foot-grid h4{ font-size:13px; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
  color:var(--muted); margin-bottom:10px; }
.rak-foot-grid a{ display:block; color:var(--muted); font-size:14px; margin-bottom:6px; }
.rak-foot-grid a:hover{ color:var(--link); text-decoration:none; }
.rak-foot-grid .brand{ display:inline-block; margin-bottom:10px; }
.rak-foot-grid p{ font-size:14px; line-height:1.6; margin:0; }

.rak-foot-base{ display:flex; align-items:center; gap:14px; font-size:13px;
  padding-top:16px; border-top:1px solid var(--hair); }

@media (max-width: 680px){
  .rak-foot-grid{ grid-template-columns:1fr 1fr; }
  .rak-foot-grid > div:first-child{ grid-column:1/-1; }
}
@media (max-width: 420px){
  .rak-foot-grid{ grid-template-columns:1fr; }
}

/* ── Task 4: Article page ─────────────────────────────────────────────────── */

/* Article reading column — narrower than the full wrap */
.rak-article{ max-width:760px; padding-top:32px; padding-bottom:64px; }

/* Breadcrumb */
.rak-crumbs{ font-size:13px; margin-bottom:24px; display:flex; flex-wrap:wrap; gap:4px; align-items:center; }
.rak-crumbs a{ color:var(--muted); }
.rak-crumbs a:hover{ color:var(--link); text-decoration:underline; }

/* Article header */
.rak-article__head{ display:flex; flex-direction:column; gap:14px; margin-bottom:32px; }
.rak-article__head h1{
  font-size:clamp(26px,4.5vw,52px);
  font-weight:800;
  letter-spacing:-.035em;
  line-height:1.06;
}

/* Lead / excerpt */
.rak-lead{ font-size:clamp(16px,2vw,20px); line-height:1.55; margin:0; }

/* Byline + share row */
.rak-byline{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; font-size:14px; }

/* Share buttons */
.rak-share{ display:inline-flex; gap:8px; margin-left:4px; }
.rak-share__b{
  display:inline-flex; align-items:center; justify-content:center;
  width:32px; height:32px; border-radius:999px;
  border:1px solid var(--hair); color:var(--muted);
  font-size:11px; font-weight:700; letter-spacing:.05em;
  transition:background .15s, color .15s;
}
.rak-share__b:hover{ background:var(--lagoon); color:#fff; border-color:var(--lagoon); text-decoration:none; }

/* Hero image */
.rak-article__hero{
  width:100%; border-radius:var(--radius);
  box-shadow:0 0 60px var(--hero-glow);
  margin-bottom:40px;
  object-fit:cover;
}

/* ── Prose — GoRAK-rendered article body ──────────────────────────────────── */
.rak-prose{
  font-size:clamp(17px,1.3vw,19px);   /* modern editorial baseline */
  line-height:1.75;
  max-width:72ch;      /* ~68–72 characters — optimal measure */
  color:var(--text);
}
.rak-prose > * + *{ margin-top:1.4em; }
.rak-prose h2{
  font-size:clamp(20px,2.5vw,28px);
  font-weight:600;
  letter-spacing:-.025em;
  line-height:1.15;
  margin-top:2.2em;
  margin-bottom:.5em;
  color:var(--text);
}
.rak-prose h3{
  font-size:clamp(16px,2vw,21px);
  font-weight:600;
  letter-spacing:-.02em;
  line-height:1.2;
  margin-top:1.8em;
  margin-bottom:.4em;
  color:var(--text);
}
.rak-prose p{ margin:0; }
.rak-prose a{ color:var(--link); text-decoration:underline; text-underline-offset:3px; }
.rak-prose a:hover{ text-decoration:none; }
.rak-prose strong{ font-weight:700; }
.rak-prose em{ font-style:italic; }

/* Block quote — lagoon left rule */
.rak-prose blockquote{
  margin:1.6em 0;
  padding:.8em 1.2em;
  border-left:4px solid var(--lagoon);
  background:var(--bg-soft);
  border-radius:0 var(--radius) var(--radius) 0;
  color:var(--muted);
  font-style:italic;
}
.rak-prose blockquote p{ margin:0; }

/* Lists */
.rak-prose ul, .rak-prose ol{
  padding-left:1.5em;
  margin:0;
}
.rak-prose li{ margin-bottom:.35em; }
.rak-prose ul li{ list-style:disc; }
.rak-prose ol li{ list-style:decimal; }

/* Images and figures */
.rak-prose img{
  width:100%; border-radius:var(--radius);
  box-shadow:var(--shadow);
  margin:1.2em 0;
}
.rak-prose figure{
  margin:1.6em 0;
}
.rak-prose figure img{ margin:0; }
.rak-prose figcaption{
  font-size:12.5px;
  color:var(--muted);
  margin-top:.5em;
  text-align:center;
  font-style:italic;
}

/* Tables */
.rak-prose table{
  width:100%; border-collapse:collapse;
  font-size:14px;
  margin:1.4em 0;
}
.rak-prose th{
  text-align:left; font-weight:700;
  padding:8px 12px;
  border-bottom:2px solid var(--hair);
  font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--muted);
}
.rak-prose td{
  padding:8px 12px;
  border-bottom:1px solid var(--hair);
  vertical-align:top;
}
.rak-prose tr:last-child td{ border-bottom:0; }

/* GoRAK media-placeholder divs carry inline styles — leave them untouched */

/* Tags row */
.rak-tags{ display:flex; flex-wrap:wrap; gap:8px; margin-top:40px; }

/* ── Task 3: Home magazine layout (editorial) ─────────────────────────────── */

/* Hero band — overlay lead + mixed-media rail, with an ambient lagoon glow */
.rak-hero-band{ position:relative; padding:34px 0 6px; }
.rak-hero-band::before{ content:""; position:absolute; inset:0 0 45% 0; pointer-events:none;
  background:radial-gradient(72% 80% at 28% 0,var(--hero-glow),transparent 70%); }
.rak-hero{ position:relative; display:grid; grid-template-columns:1.7fr 330px; gap:34px; align-items:stretch; }

/* Lead: big image with overlaid headline */
.rak-lead{ position:relative; display:block; min-height:540px; border-radius:calc(var(--radius) + 4px);
  overflow:hidden; box-shadow:var(--shadow); color:#fff; isolation:isolate; }
.rak-lead__img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .6s ease; }
.rak-lead:hover .rak-lead__img{ transform:scale(1.04); }
.rak-lead__scrim{ position:absolute; inset:0;
  background:linear-gradient(180deg,rgba(8,12,22,.04) 28%,rgba(8,12,22,.50) 70%,rgba(8,12,22,.82) 100%); }
.rak-lead__cap{ position:absolute; left:0; right:0; bottom:0; padding:clamp(20px,3vw,36px);
  display:flex; flex-direction:column; gap:14px; }
.rak-lead__cap h1{ color:#fff; font-size:clamp(27px,3.6vw,48px); letter-spacing:-.035em; line-height:1.03; max-width:18ch; }
.rak-lead__ex{ color:rgba(255,255,255,.84); font-size:15px; line-height:1.5; max-width:54ch; margin:0; }
.rak-lead__meta{ color:rgba(255,255,255,.7); font-size:12.5px; letter-spacing:.02em; }
.rak-lead:hover, .rak-lead:hover .rak-lead__cap h1{ text-decoration:none; }

/* Rail */
.rak-rail{ display:flex; flex-direction:column; gap:18px; }
.rak-rail .eyebrow{ margin-bottom:2px; }
.rak-rail__item{ display:grid; grid-template-columns:88px 1fr; gap:14px; align-items:center;
  padding-bottom:18px; border-bottom:1px solid var(--hair); }
.rak-rail__item:last-child{ border-bottom:0; padding-bottom:0; }
.rak-rail__item:hover{ text-decoration:none; }
.rak-rail__thumb{ width:88px; height:66px; border-radius:12px; background:var(--bg-soft) center/cover;
  box-shadow:0 7px 18px var(--hero-glow); }
.rak-rail__txt{ display:flex; flex-direction:column; gap:4px; min-width:0; }
.rak-rail__cat{ font-style:normal; font-size:10.5px; font-weight:700; letter-spacing:.14em;
  text-transform:uppercase; color:var(--label-teal); }
.rak-rail__title{ font-weight:600; font-size:15px; line-height:1.24; color:var(--text); }
.rak-rail__item:hover .rak-rail__title{ color:var(--link); }
@media (max-width: 900px){
  .rak-hero{ grid-template-columns:1fr; }
  .rak-lead{ min-height:420px; }
}

/* Explore / categories */
.rak-explore{ padding:48px 0 4px; }
.rak-explore__head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:20px; }
.rak-cats{ display:flex; gap:14px; overflow-x:auto; padding:6px 0 12px; scrollbar-width:none; }
.rak-cats::-webkit-scrollbar{ display:none; }
.rak-cats .cat{ flex-shrink:0; width:98px; }
.rak-cats .cat .ring{ width:80px; height:80px; background:var(--bg-soft) center/cover; display:block;
  transition:transform .22s, box-shadow .22s; }
.rak-cats .cat:hover{ text-decoration:none; }
.rak-cats .cat:hover .ring{ transform:translateY(-5px); box-shadow:0 18px 32px var(--hero-glow); }
.rak-cats .cat small{ margin-top:2px; }

/* Section heads */
.rak-section{ padding:46px 0; }
.rak-section__head{ display:flex; align-items:center; gap:18px; margin-bottom:26px; }
.rak-section__head h2{ font-size:clamp(21px,2.6vw,30px); white-space:nowrap; }
.rak-section__head .more{ margin-left:auto; }
.rak-headrule{ flex:1; height:1px; background:linear-gradient(90deg,var(--lagoon),var(--rose),transparent); opacity:.55; }
.more--sm{ font-size:13px; } .more--sm .arrow{ width:28px; height:28px; }

/* Overlay cards + asymmetric mosaic */
.rak-mosaic{ display:grid; grid-template-columns:repeat(3,1fr); grid-auto-rows:228px; gap:20px; }
.ov-card{ position:relative; display:block; border-radius:var(--radius); overflow:hidden;
  color:#fff; box-shadow:var(--shadow); isolation:isolate; }
.ov-card--lead{ grid-column:span 2; grid-row:span 2; }
.ov-card img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .6s ease; }
.ov-card:hover img{ transform:scale(1.05); }
.ov-card:hover{ text-decoration:none; }
.ov-card__scrim{ position:absolute; inset:0;
  background:linear-gradient(180deg,rgba(8,12,22,.02) 35%,rgba(8,12,22,.74) 96%); }
.ov-card__pill{ position:absolute; top:14px; left:14px; }
.ov-card__cap{ position:absolute; left:0; right:0; bottom:0; padding:20px; }
.ov-card__cap h3{ color:#fff; font-size:18px; letter-spacing:-.02em; line-height:1.18; }
.ov-card--lead .ov-card__cap{ padding:26px; }
.ov-card--lead .ov-card__cap h3{ font-size:clamp(20px,2.4vw,30px); }
.ov-card__cap p{ color:rgba(255,255,255,.84); font-size:13.5px; line-height:1.45; margin:8px 0 0; max-width:46ch; }
@media (max-width: 820px){
  .rak-mosaic{ grid-template-columns:1fr 1fr; grid-auto-rows:200px; }
  .ov-card--lead{ grid-column:span 2; grid-row:span 1; min-height:280px; }
}
@media (max-width: 540px){ .rak-mosaic{ grid-template-columns:1fr; } .ov-card--lead{ grid-column:span 1; } .ov-card{ min-height:220px; } }

/* Latest — two-column compact cards */
.rak-latest{ display:grid; grid-template-columns:1fr 1fr; gap:6px 30px; }
.rak-compact{ display:grid; grid-template-columns:98px 1fr; gap:16px; align-items:center;
  padding:13px 0; border-bottom:1px solid var(--hair); }
.rak-compact:hover{ text-decoration:none; }
.rak-compact__thumb{ width:98px; height:72px; border-radius:12px; background:var(--bg-soft) center/cover;
  box-shadow:0 6px 16px var(--hero-glow); flex-shrink:0; }
.rak-compact__txt{ display:flex; flex-direction:column; gap:4px; min-width:0; }
.rak-compact__cat{ font-style:normal; font-size:10.5px; font-weight:700; letter-spacing:.14em;
  text-transform:uppercase; color:var(--label-teal); }
.rak-compact__title{ font-weight:600; font-size:15.5px; line-height:1.24; color:var(--text); }
.rak-compact:hover .rak-compact__title{ color:var(--link); }
.rak-compact__date{ font-size:12px; }
@media (max-width: 700px){ .rak-latest{ grid-template-columns:1fr; } }

/* ── Task 5: Category + search grid ─────────────────────────────────────────── */

/* Card grid — uniform overlay cards for category + search pages */
.rak-cardgrid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; grid-auto-rows:240px; }
/* Author display:grid beats the UA [hidden] rule — restore hidden semantics for the
   JS-toggled events grid (its no-JS baseline is the agenda list). */
.rak-cardgrid[hidden]{ display:none; }
@media (max-width: 820px){ .rak-cardgrid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width: 540px){ .rak-cardgrid{ grid-template-columns:1fr; } .rak-cardgrid .ov-card{ min-height:220px; } }

/* Search page — larger centred search form */
.rak-search--page{ display:flex; justify-content:center; margin:24px 0; }
.rak-search--page input{ width:min(480px,100%); height:46px; font-size:16px; padding:0 20px; }

/* ── Task 6: Polish — responsive, a11y, reduced-motion, contrast ─────────────── */

/* Focus rings: ensure all interactive elements have a visible ring */
a:focus-visible,
button:focus-visible,
input:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid var(--lagoon);
  outline-offset: 3px;
  border-radius: 4px;
}
/* Override: pill links need the radius to match their shape */
.pill:focus-visible, .pill--ghost:focus-visible { border-radius: 999px; }
/* Toggle button focus */
.toggle:focus-visible { outline: 2px solid var(--lagoon); outline-offset: 3px; }
/* More arrow focus */
.more:focus-visible { outline: 2px solid var(--lagoon); outline-offset: 3px; border-radius: 4px; }

/* prefers-reduced-motion: disable all hover transforms + transitions explicitly on known elements */
@media (prefers-reduced-motion: reduce) {
  *{ animation: none !important; transition: none !important; }
  .more .arrow{ transition: none !important; }
  /* hover zoom on images and category rings */
  .rak-lead:hover .rak-lead__img{ transform: none !important; }
  .ov-card:hover img{ transform: none !important; }
  .rak-cats .cat:hover .ring{ transform: none !important; box-shadow: none !important; }
  .rak-plan__grid a:hover{ transform: none !important; box-shadow: none !important; }
  .rak-cats .cat:hover .ring,
  .ov-card img,
  .rak-lead__img { transition: none !important; }
}

/* Contrast: nudge --muted to meet AA on light bg (#FBFAF6 → #5C6373 is ~4.5:1 OK)
   In dark mode --muted #AEB4C2 on --bg #10131F is ~7.1:1 — no change needed.
   Adding explicit muted colour enforcements to be safe: */
[data-theme="light"] .muted { color: #515666; }  /* slightly darker: ~5.2:1 on #FBFAF6 */

/* Mobile nav: ensure the details/summary is positioned so dropdown sits below header */
@media (max-width: 860px) {
  .site-head { position: sticky; overflow: visible; }
  /* Category strip: always horizontal scroll, no wrap overflow */
  .rak-cats { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  /* Hero + mosaic + latest: already stack via existing media queries, confirm no h-overflow */
  .rak-hero-band, .rak-mosaic, .rak-latest { overflow: hidden; }
  /* Prevent wrap overflow on hero band */
  .rak-hero { overflow: visible; }
}

/* Section padding specificity: unify rak-section and page-level overrides */
.rak-section + .rak-section { padding-top: 0; }
/* The wrap style="padding-top:36px" on category/search overrides OK; no clash needed */

/* 404 page: constrain to wrap width cleanly */
.rak-404 { box-sizing: border-box; }

/* About page: constrain prose width */
.rak-about .rak-prose { box-sizing: border-box; }

/* Nav: prevent search input from overflowing on very small screens */
@media (max-width: 380px) {
  .rak-search input { width: 90px; }
  .rak-search input:focus { width: 110px; }
}

/* ── Branded fallback art — used when an article has no real image ───────────── */
/* Base brand tile (covers any/unknown category). Sits under card scrims + white text. */
.rak-fallback{
  --fb-a:var(--lagoon); --fb-b:var(--rose);
  background:
    radial-gradient(130% 120% at 14% 10%, rgba(255,255,255,.18), transparent 46%),
    linear-gradient(135deg, var(--fb-a) 0%, var(--fb-b) 100%);
}
.rak-fallback::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background-image:repeating-linear-gradient(135deg, rgba(255,255,255,.06) 0 2px, transparent 2px 24px);
  opacity:.7;
}
/* Per-launch-category accents (unknown slugs fall through to the brand base). */
.rak-fallback--things-to-do  { --fb-a:#0E7C8B; --fb-b:#12C7B5; }
.rak-fallback--beaches       { --fb-a:#0FA396; --fb-b:#37B9C9; }
.rak-fallback--where-to-stay { --fb-a:#C7566B; --fb-b:#E8736B; }
.rak-fallback--where-to-eat  { --fb-a:#E8736B; --fb-b:#E0A24E; }
.rak-fallback--heritage      { --fb-a:#B98A54; --fb-b:#E8736B; }
.rak-fallback--itineraries   { --fb-a:#0FA396; --fb-b:#E8736B; }
/* Fallback used as a block image inside overlay cards / hero (absolute-filled). */
.ov-card .rak-fallback, .rak-lead .rak-fallback,
.rak-article__hero.rak-fallback{ position:absolute; inset:0; width:100%; height:100%; }
.rak-article__hero.rak-fallback{ position:relative; aspect-ratio:16/9; }
/* Fallback used as a small thumb (rail / compact / ring) — element already sized. */
.rak-fallback.is-thumb{ position:relative; overflow:hidden; }

/* ── Nav dropdowns (Guides / Plan) — <details>-based, keyboard + click ───────── */
.rak-dd{ position:relative; }
.rak-dd > summary{
  list-style:none; cursor:pointer; display:inline-flex; align-items:center; gap:6px;
  color:var(--text); font-weight:600; font-size:14.5px;
}
.rak-dd > summary::-webkit-details-marker{ display:none; }
.rak-dd > summary:hover{ color:var(--link); }
.rak-dd__caret{ font-size:10px; transition:transform .18s; }
.rak-dd[open] > summary .rak-dd__caret{ transform:rotate(180deg); }
.rak-dd__panel{
  position:absolute; top:calc(100% + 14px); left:-14px; min-width:196px;
  background:var(--surface); border:1px solid var(--hair); border-radius:14px;
  box-shadow:var(--shadow); padding:8px; display:flex; flex-direction:column; z-index:50;
}
.rak-dd__panel a{ padding:9px 12px; border-radius:9px; color:var(--text); font-size:14.5px; font-weight:500; }
.rak-dd__panel a:hover{ background:var(--bg-soft); color:var(--link); text-decoration:none; }
@media (max-width: 860px){
  .rak-dd{ width:100%; }
  .rak-dd > summary{ padding:8px 0; border-bottom:1px solid var(--hair); justify-content:space-between; }
  .rak-dd__panel{ position:static; box-shadow:none; border:0; background:transparent;
    padding:4px 0 8px 12px; border-radius:0; min-width:0; }
  .rak-dd__panel a{ padding:7px 0; }
}

/* ── Home Phase 1: positioning hero, plan block, strips ─────────────────────── */
.eyebrow--on-dark{ color:rgba(255,255,255,.92); }
.rak-lead__cta{ display:flex; gap:12px; flex-wrap:wrap; margin-top:4px; }
.btn--ghost-light{ background:transparent; border:1px solid rgba(255,255,255,.55); color:#fff; }
.btn--ghost-light:hover{ background:rgba(255,255,255,.12); text-decoration:none; }
.rak-lead__feat{ color:rgba(255,255,255,.82); font-size:13px; margin-top:6px; display:inline-block; }
.rak-lead__feat:hover{ color:#fff; }

/* Plan-your-trip start block */
.rak-plan{ padding:44px 0 8px; }
.rak-plan__head{ display:flex; align-items:baseline; gap:14px; margin-bottom:18px; }
.rak-plan__head h2{ font-size:clamp(21px,2.6vw,30px); }
.rak-plan__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.rak-plan__grid a{ display:flex; flex-direction:column; gap:3px; padding:16px 18px;
  border:1px solid var(--hair); border-radius:14px; background:var(--surface);
  transition:border-color .18s, transform .18s, box-shadow .18s; }
.rak-plan__grid a:hover{ border-color:var(--lagoon); transform:translateY(-3px);
  box-shadow:var(--shadow); text-decoration:none; }
.rak-plan__grid b{ font-size:16px; color:var(--text); letter-spacing:-.01em; }
.rak-plan__grid small{ color:var(--muted); font-size:13px; }
@media (max-width: 760px){ .rak-plan__grid{ grid-template-columns:1fr 1fr; } }
@media (max-width: 460px){ .rak-plan__grid{ grid-template-columns:1fr; } }

/* Category ring fallback art (win over the plain .ring background) */
.rak-cats .cat .ring.rak-fallback{ background:
  radial-gradient(130% 120% at 14% 10%, rgba(255,255,255,.20), transparent 46%),
  linear-gradient(135deg, var(--fb-a), var(--fb-b)); }

/* When-to-go + how-far strips */
.rak-strips{ display:grid; grid-template-columns:1fr 1fr; gap:18px; padding:34px 0 8px; }
.rak-strip{ border:1px solid var(--hair); border-radius:16px; padding:20px 22px; background:var(--bg-soft); }
.rak-strip__k{ font-size:11px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:var(--label-teal); }
.rak-strip p{ margin:8px 0 12px; font-size:14.5px; line-height:1.6; }
@media (max-width: 720px){ .rak-strips{ grid-template-columns:1fr; } }

/* Share buttons rendered as <button> (copy-link, native share) */
button.rak-share__b{ width:auto; padding:0 12px; background:transparent; cursor:pointer; font-family:var(--font); }
button.rak-share__b:hover{ background:var(--lagoon); color:#fff; border-color:var(--lagoon); }

/* Read-next sits full-width below the narrow article column */
.rak-readnext{ padding-top:20px; }

/* Empty-states + browse chips (category / search) */
.rak-empty{ padding:22px 0 64px; }
.rak-chips{ display:flex; flex-wrap:wrap; gap:10px; margin-top:14px; }

/* Category intro line */
.rak-cat-intro{ font-size:17px; line-height:1.55; max-width:62ch; margin:.5em 0 0; }

/* At-a-glance quick-facts strip (practical info) */
.rak-facts{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; margin-top:26px;
  background:var(--hair); border:1px solid var(--hair); border-radius:14px; overflow:hidden; }
.rak-facts > div{ background:var(--surface); padding:14px 16px; display:flex; flex-direction:column; gap:3px; }
.rak-facts__k{ font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); }
.rak-facts b{ font-size:15px; }
@media (max-width:560px){ .rak-facts{ grid-template-columns:1fr 1fr; } }

/* ── Phase 4: Offers & Events ───────────────────────────────────────────────── */
/* Coming-soon empty state (offers / events primary state today) */
.rak-comingsoon{ text-align:center; padding:38px 0 72px; }
.rak-comingsoon h2{ font-size:clamp(24px,3.5vw,38px); margin:.35em 0 .25em; }
.rak-comingsoon .rak-chips{ justify-content:center; }

/* Offer / event overlay cards — venue + CTA inside the cap */
.offer-card__venue{ color:rgba(255,255,255,.85); font-size:12.5px; display:block; margin-top:2px; }
.offer-card__cta{ margin-top:12px; align-self:flex-start; padding:8px 15px; font-size:13px; }

/* Events: filter bar + view toggle */
.rak-events__bar{ display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap; margin-bottom:10px; }
.rak-events__filters{ margin-top:0; }
.rak-viewtoggle{ display:inline-flex; border:1px solid var(--hair); border-radius:999px; overflow:hidden; }
.rak-viewtoggle button{ background:transparent; border:0; padding:7px 16px; font-family:var(--font);
  font-size:13px; font-weight:600; color:var(--muted); cursor:pointer; }
.rak-viewtoggle button.is-active{ background:var(--grad); color:#06231f; }

/* Events: agenda list */
.rak-agenda__month{ font-size:13px; letter-spacing:.16em; text-transform:uppercase; color:var(--muted);
  font-weight:700; margin:26px 0 8px; }
.event-row{ display:grid; grid-template-columns:64px 1fr; gap:16px; align-items:center;
  padding:14px 0; border-bottom:1px solid var(--hair); }
.event-row:hover{ text-decoration:none; }
.event-row__date{ display:flex; flex-direction:column; align-items:center; justify-content:center;
  width:64px; height:64px; border-radius:14px; background:var(--bg-soft); border:1px solid var(--hair); }
.event-row__date b{ font-size:22px; line-height:1; color:var(--text); }
.event-row__date em{ font-style:normal; font-size:11px; letter-spacing:.1em; color:var(--label-teal); font-weight:700; }
.event-row__body{ display:flex; flex-direction:column; gap:3px; min-width:0; }
.event-row__title{ font-weight:600; font-size:16px; color:var(--text); line-height:1.25; }
.event-row:hover .event-row__title{ color:var(--link); }
.event-row__meta{ font-size:13px; color:var(--muted); }
.event-row__type{ font-style:normal; color:var(--label-teal); font-weight:600; }

/* Event detail */
.rak-event__tags{ display:flex; align-items:center; gap:10px; }
.rak-event__state{ font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  padding:3px 10px; border-radius:999px; border:1px solid var(--hair); color:var(--muted); }
.rak-event__state--on-now{ color:#06231f; background:var(--grad); border:0; }
.rak-event__facts{ display:flex; flex-direction:column; gap:6px; font-size:15px; margin:6px 0 2px; }
.rak-event__facts b{ display:inline-block; min-width:58px; color:var(--muted); font-weight:700;
  font-size:12px; text-transform:uppercase; letter-spacing:.05em; }
.btn--ghost-alt{ background:transparent; border:1px solid var(--hair); color:var(--text); }
.btn--ghost-alt:hover{ border-color:var(--lagoon); text-decoration:none; }
@media (max-width:520px){ .rak-events__bar{ gap:10px; } }

/* ══════════════════════════════════════════════════════════════════════════════
   PORTAL — dense RAK city-guide layout (live ribbon, two-tier nav, 3-col hero +
   widget sidebar, dense category feed, what's-on, most-read, offers). Own design:
   teal structure + punchy coral energy, light/dark via tokens.
   ══════════════════════════════════════════════════════════════════════════════ */
.p-label{ font-size:11px; font-weight:800; letter-spacing:.09em; text-transform:uppercase; }
.p-ago{ font-size:11.5px; color:var(--muted); font-variant-numeric:tabular-nums; }
.tnum{ font-variant-numeric:tabular-nums; }
.c-teal{ color:var(--label-teal); } .c-coral{ color:var(--coral-text); }

/* ── Live ribbon ───────────────────────────────────────────────────────────── */
.rak-ribbon{ background:var(--ink); color:#EAEAF0; font-size:12.5px; }
.rak-ribbon .wrap{ display:flex; align-items:center; justify-content:space-between; height:38px; gap:16px; overflow-x:auto; scrollbar-width:none; }
.rak-ribbon .wrap::-webkit-scrollbar{ display:none; }
.rak-ribbon__l, .rak-ribbon__r{ display:flex; align-items:center; gap:16px; white-space:nowrap; }
.rak-ribbon b{ color:#fff; font-weight:700; }
.rak-ribbon .sep{ color:var(--lagoon-bright); }
.rak-ribbon .live{ color:var(--coral); font-weight:800; letter-spacing:.04em; }
.rak-ribbon a{ color:#EAEAF0; opacity:.85; } .rak-ribbon a:hover{ opacity:1; text-decoration:none; }

/* ── Masthead ──────────────────────────────────────────────────────────────── */
.rak-mast{ background:var(--bg); border-bottom:1px solid var(--hair); }
.rak-mast .wrap{ display:flex; align-items:center; justify-content:space-between; height:74px; gap:18px; }
.rak-brand{ display:flex; align-items:baseline; gap:10px; }
.rak-brand__mark{ font-size:27px; font-weight:800; letter-spacing:-.045em; color:var(--text); white-space:nowrap; }
.rak-brand__mark .k{ color:var(--coral); }
.rak-brand__tag{ font-size:11px; font-weight:700; letter-spacing:.15em; text-transform:uppercase; color:var(--muted); }
.rak-mast__r{ display:flex; align-items:center; gap:12px; }
.rak-mast__search{ display:flex; align-items:center; gap:8px; height:40px; padding:0 6px 0 15px; border:1px solid var(--hair);
  border-radius:999px; background:var(--surface); }
.rak-mast__search input{ border:0; background:transparent; outline:none; font-family:var(--font); font-size:14px; color:var(--text); width:190px; }
.rak-mast__search input::placeholder{ color:var(--muted); }
.rak-mast__search button{ width:30px; height:30px; border:0; border-radius:999px; background:var(--lagoon); color:#04231f; font-size:15px; font-weight:800; cursor:pointer; }
.rak-social{ display:flex; gap:8px; }
.rak-social a{ width:30px; height:30px; display:grid; place-items:center; border-radius:7px; font-size:11px; font-weight:800;
  background:var(--bg-soft); color:var(--muted); text-transform:lowercase; }
.rak-social a:hover{ background:var(--lagoon); color:#04231f; text-decoration:none; }

/* ── Category ribbon (flat, visible, sticky) ───────────────────────────────── */
.rak-catnav{ position:sticky; top:0; z-index:40; background:var(--surface); border-bottom:1px solid var(--hair);
  box-shadow:0 1px 0 rgba(0,0,0,.03); }
.rak-catnav .wrap{ display:flex; align-items:center; gap:0; height:52px; overflow-x:auto; scrollbar-width:none; }
.rak-catnav .wrap::-webkit-scrollbar{ display:none; }
.rak-catnav a{ position:relative; padding:0 15px; height:52px; display:inline-flex; align-items:center; white-space:nowrap;
  font-weight:700; font-size:14.5px; color:var(--text); }
.rak-catnav a:hover, .rak-catnav a.is-on{ color:var(--link); text-decoration:none; }
.rak-catnav a.is-on::after, .rak-catnav a:hover::after{ content:""; position:absolute; left:12px; right:12px; bottom:0;
  height:3px; background:var(--coral); border-radius:3px 3px 0 0; }
.rak-catnav .hot{ color:var(--coral-text); }
.rak-catnav .spacer{ margin-left:auto; }
.rak-catnav__burger{ display:none; }

/* ── Section scaffolding ───────────────────────────────────────────────────── */
.p-sec{ padding:34px 0; }
.p-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:18px; gap:14px; }
.p-head h2{ font-size:clamp(20px,2.4vw,24px); }
.p-head .kick{ display:inline-flex; align-items:center; gap:10px; }
.p-head .kick::before{ content:""; width:22px; height:4px; border-radius:3px; background:var(--coral); flex-shrink:0; }
.p-more{ font-size:13px; font-weight:800; color:var(--link); white-space:nowrap; }
.p-more:hover{ text-decoration:none; filter:brightness(1.1); }

/* placeholder art (until real photos) — a branded gradient tile */
.p-ph{ position:relative; overflow:hidden; background:
  radial-gradient(130% 120% at 14% 10%, rgba(255,255,255,.16), transparent 46%),
  linear-gradient(150deg, var(--lagoon), var(--coral)); }
.p-ph img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }

/* ── Hero (3 columns) ──────────────────────────────────────────────────────── */
.rak-hero3{ display:grid; grid-template-columns:1.9fr 1.15fr 1fr; gap:22px; padding:26px 0 8px; }
.rak-lead2{ position:relative; border-radius:var(--r); overflow:hidden; min-height:440px; display:flex; align-items:flex-end; color:#fff; }
.rak-lead2 .p-ph{ position:absolute; inset:0; }
.rak-scrim{ position:absolute; inset:0; background:linear-gradient(180deg,rgba(8,10,16,.03) 28%,rgba(8,10,16,.55) 72%,rgba(8,10,16,.87)); }
.rak-lead2__b{ position:relative; padding:24px; display:flex; flex-direction:column; gap:9px; }
.rak-lead2 h1{ font-size:clamp(24px,3vw,32px); color:#fff; max-width:20ch; line-height:1.1; }
.rak-lead2 p{ margin:0; color:rgba(255,255,255,.87); font-size:14.5px; max-width:52ch; }
.rak-lead2__meta{ display:flex; gap:10px; align-items:center; font-size:12px; color:rgba(255,255,255,.82); flex-wrap:wrap; }
.rak-badge{ display:inline-flex; align-items:center; gap:6px; align-self:flex-start; padding:5px 11px; border-radius:6px;
  background:var(--coral); color:#2a0b04; font-size:11px; font-weight:800; letter-spacing:.05em; text-transform:uppercase; }
.rak-badge--teal{ background:var(--lagoon); color:#04231f; }

.rak-tops{ display:flex; flex-direction:column; }
.rak-tops h3{ font-size:12px; letter-spacing:.09em; text-transform:uppercase; color:var(--muted);
  padding-bottom:9px; border-bottom:2px solid var(--text); margin:0 0 2px; }
.rak-top{ display:flex; flex-direction:column; gap:4px; padding:13px 0; border-bottom:1px solid var(--hair); }
.rak-top:hover{ text-decoration:none; } .rak-top:hover .rak-top__t{ color:var(--link); }
.rak-top__t{ font-size:15px; font-weight:700; line-height:1.26; color:var(--text); }

/* widget sidebar */
.rak-rail2{ display:flex; flex-direction:column; gap:14px; }
.rak-w{ border:1px solid var(--hair); border-radius:var(--r); overflow:hidden; background:var(--surface); }
.rak-w__h{ display:flex; align-items:center; justify-content:space-between; padding:11px 14px; font-size:11px; font-weight:800;
  letter-spacing:.08em; text-transform:uppercase; color:var(--muted); border-bottom:1px solid var(--hair); }
.rak-w--wx{ background:linear-gradient(150deg,#0E7C8B,var(--lagoon)); color:#fff; border:0; }
.rak-w--wx .rak-w__h{ color:rgba(255,255,255,.85); border-color:rgba(255,255,255,.22); }
.rak-wx__body{ padding:14px; display:flex; align-items:center; justify-content:space-between; gap:10px; }
.rak-wx__temp{ font-size:42px; font-weight:800; line-height:1; letter-spacing:-.03em; }
.rak-wx__meta{ font-size:12.5px; text-align:right; opacity:.94; }
.rak-wx__row{ padding:0 14px 13px; display:flex; justify-content:space-between; font-size:12px; opacity:.9; }
.rak-pray{ padding:6px 0; }
.rak-pray__row{ display:flex; justify-content:space-between; padding:7px 14px; font-size:13px; }
.rak-pray__row.next{ background:var(--sand); color:var(--label-teal); font-weight:800; }
.rak-mini{ padding:12px 14px; display:flex; align-items:center; justify-content:space-between; gap:10px; }
.rak-mini b{ font-size:15px; color:var(--text); } .rak-mini small{ color:var(--muted); font-size:12px; }
.rak-fx{ display:flex; gap:16px; padding:12px 14px; overflow-x:auto; font-size:13px; scrollbar-width:none; }
.rak-fx::-webkit-scrollbar{ display:none; }
.rak-fx b{ color:var(--link); }
@media (max-width:1000px){ .rak-hero3{ grid-template-columns:1fr; } }

/* ── What's on band ────────────────────────────────────────────────────────── */
.rak-band2{ background:var(--sand); }
.rak-whatson{ display:flex; gap:14px; overflow-x:auto; padding-bottom:4px; scrollbar-width:none; }
.rak-whatson::-webkit-scrollbar{ display:none; }
.rak-ev{ flex:0 0 262px; display:flex; gap:12px; background:var(--surface); border:1px solid var(--hair); border-radius:var(--r); padding:12px; }
.rak-ev:hover{ text-decoration:none; } .rak-ev:hover .rak-ev__t{ color:var(--link); }
.rak-ev__d{ flex:0 0 52px; height:56px; border-radius:9px; background:var(--ink); color:#fff; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.rak-ev__d b{ font-size:20px; line-height:1; } .rak-ev__d span{ font-size:10px; letter-spacing:.1em; text-transform:uppercase; opacity:.85; }
.rak-ev__t{ font-weight:700; font-size:14.5px; line-height:1.2; color:var(--text); }
.rak-ev__v{ font-size:12px; color:var(--muted); margin-top:3px; }

/* ── Dense feed (per-category sections) ────────────────────────────────────── */
.rak-feed{ display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:22px; }
.rak-big{ border-radius:var(--r); overflow:hidden; position:relative; min-height:300px; display:flex; align-items:flex-end; color:#fff; }
.rak-big .p-ph{ position:absolute; inset:0; }
.rak-big__b{ position:relative; padding:20px; display:flex; flex-direction:column; gap:8px; }
.rak-big h3{ font-size:21px; color:#fff; max-width:18ch; line-height:1.14; }
.rak-col{ display:flex; flex-direction:column; }
.rak-row{ display:flex; gap:13px; padding:13px 0; border-bottom:1px solid var(--hair); align-items:flex-start; }
.rak-row:first-child{ padding-top:0; } .rak-row:last-child{ border-bottom:0; }
.rak-row:hover{ text-decoration:none; } .rak-row:hover .rak-row__t{ color:var(--link); }
.rak-row__ph{ flex:0 0 96px; height:70px; border-radius:9px; }
.rak-row__b{ display:flex; flex-direction:column; gap:5px; min-width:0; }
.rak-row__t{ font-weight:700; font-size:15px; line-height:1.28; color:var(--text); }
.rak-row__m{ display:flex; gap:10px; align-items:center; }
@media (max-width:900px){ .rak-feed{ grid-template-columns:1fr; } .rak-big{ min-height:240px; } }

/* two-up dense sections */
.rak-two{ display:grid; grid-template-columns:1fr 1fr; gap:34px; }
@media (max-width:760px){ .rak-two{ grid-template-columns:1fr; } }

/* ── Most read ─────────────────────────────────────────────────────────────── */
.rak-trend{ background:var(--ink); color:#fff; }
.rak-trend .p-head h2{ color:#fff; }
.rak-trend .p-head .kick::before{ background:var(--lagoon); }
.rak-ranks{ display:grid; grid-template-columns:repeat(5,1fr); gap:22px; }
.rak-rank2{ display:flex; gap:12px; align-items:flex-start; }
.rak-rank2:hover{ text-decoration:none; } .rak-rank2:hover .rak-rank2__t{ color:var(--lagoon-bright); }
.rak-rank2__n{ font-size:30px; font-weight:800; color:var(--lagoon-bright); line-height:.9; letter-spacing:-.03em; }
.rak-rank2__t{ font-size:14px; font-weight:700; line-height:1.28; color:#fff; }
.rak-rank2__c{ font-size:10.5px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--coral); display:block; margin-top:6px; }
@media (max-width:1000px){ .rak-ranks{ grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .rak-ranks{ grid-template-columns:1fr; } }

/* ── Offers row ────────────────────────────────────────────────────────────── */
.rak-offers2{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.rak-offer2{ border-radius:var(--r); overflow:hidden; position:relative; min-height:220px; display:flex; align-items:flex-end; color:#fff; }
.rak-offer2 .p-ph{ position:absolute; inset:0; }
.rak-offer2__b{ position:relative; padding:18px; display:flex; flex-direction:column; gap:8px; }
.rak-tag{ align-self:flex-start; background:var(--surface); color:var(--text); font-size:11px; font-weight:800; padding:4px 9px; border-radius:6px; }
.rak-offer2 h3{ font-size:18px; color:#fff; line-height:1.16; }
@media (max-width:820px){ .rak-offers2{ grid-template-columns:1fr; } }

/* ── Landscape hero (full-width banner, no widgets crowding it) ────────────── */
.rak-herowide{ position:relative; border-radius:var(--r); overflow:hidden; margin-top:22px;
  min-height:clamp(300px,40vw,470px); display:flex; align-items:flex-end; color:#fff; }
.rak-herowide .p-ph{ position:absolute; inset:0; }
.rak-herowide__b{ position:relative; padding:clamp(20px,3vw,40px); display:flex; flex-direction:column; gap:11px; max-width:780px; }
.rak-herowide h1{ font-size:clamp(26px,3.7vw,46px); color:#fff; line-height:1.05; max-width:22ch; }
.rak-herowide p{ margin:0; color:rgba(255,255,255,.88); font-size:clamp(14px,1.4vw,17px); max-width:62ch; }
.rak-herowide__meta{ display:flex; gap:12px; font-size:12.5px; color:rgba(255,255,255,.82); flex-wrap:wrap; }

/* Top-stories strip below the hero */
.rak-topstrip{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-top:18px; }
.rak-tcard{ display:flex; flex-direction:column; gap:8px; }
.rak-tcard .p-ph{ aspect-ratio:16/10; border-radius:10px; }
.rak-tcard__c{ font-size:11px; font-weight:800; letter-spacing:.07em; text-transform:uppercase; }
.rak-tcard__t{ font-weight:700; font-size:15px; line-height:1.26; color:var(--text); }
.rak-tcard:hover{ text-decoration:none; } .rak-tcard:hover .rak-tcard__t{ color:var(--link); }
@media (max-width:820px){ .rak-topstrip{ grid-template-columns:1fr 1fr; } }
@media (max-width:480px){ .rak-topstrip{ grid-template-columns:1fr; } }

/* Content + right rail (widgets live here now, not by the banner) */
.rak-main{ display:grid; grid-template-columns:minmax(0,1fr) 302px; gap:36px; align-items:start; }
.rak-main__content{ min-width:0; }
.rak-main__rail{ display:flex; flex-direction:column; gap:14px; position:sticky; top:64px; }
.rak-main__rail .rak-w__h.railtitle{ background:var(--sand); }
@media (max-width:980px){
  .rak-main{ grid-template-columns:1fr; }
  .rak-main__rail{ position:static; flex-direction:row; flex-wrap:wrap; }
  .rak-main__rail .rak-w{ flex:1 1 230px; }
}

/* ── Article page — wide editorial grid: main column + sticky sidebar ──────── */
.rak-article{ max-width:1120px; padding-top:26px; padding-bottom:60px; }
.rak-article__head-wrap{ max-width:820px; }
.rak-crumbs{ color:var(--muted); }
.rak-kicker{ display:inline-block; margin:2px 0 8px; }
.rak-kicker:hover{ text-decoration:none; filter:brightness(1.1); }
.rak-dek{ font-size:clamp(18px,2vw,22px); color:var(--muted); line-height:1.5; margin:14px 0 0; max-width:62ch; font-weight:400; }
.rak-byline{ display:flex; align-items:center; gap:10px 16px; flex-wrap:wrap; margin:20px 0 2px;
  padding:14px 0; border-top:1px solid var(--hair); border-bottom:1px solid var(--hair);
  font-size:13.5px; color:var(--muted); }
.rak-byline__by{ color:var(--text); font-weight:700; }
.rak-byline .rak-share{ margin-left:auto; }

/* Full-width hero — wider than the text column */
.rak-article__hero{ width:100%; aspect-ratio:16/9; object-fit:cover; margin:26px 0 34px;
  box-shadow:var(--shadow); border-radius:var(--r); }
.rak-article__hero.rak-fallback{ aspect-ratio:16/9; border-radius:var(--r); }

/* Body + sidebar grid — uses the horizontal space instead of empty margins */
.rak-article__grid{ display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:60px; align-items:start; }
.rak-article__main{ min-width:0; }
.rak-article__aside{ position:sticky; top:64px; display:flex; flex-direction:column; gap:18px; }
.rak-aside-card{ border:1px solid var(--hair); border-radius:var(--r); background:var(--surface); overflow:hidden; }
.rak-aside-card__h{ font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--muted);
  padding:12px 15px; border-bottom:1px solid var(--hair); }
.rak-aside-more a{ display:flex; gap:11px; padding:11px 15px; border-bottom:1px solid var(--hair); align-items:center; }
.rak-aside-more a:last-child{ border-bottom:0; }
.rak-aside-more a:hover{ text-decoration:none; background:var(--bg-soft); }
.rak-aside-more__ph{ flex:0 0 54px; height:42px; border-radius:7px; }
.rak-aside-more__t{ font-size:13.5px; font-weight:700; line-height:1.25; color:var(--text); }
.rak-aside-cta{ padding:18px 16px; background:var(--sand); }
.rak-aside-cta b{ font-size:16px; display:block; }
.rak-aside-cta p{ font-size:13px; color:var(--muted); margin:4px 0 12px; }
.rak-aside-share{ display:flex; align-items:center; gap:10px; padding:12px 15px; }
.rak-aside-share .p-label{ color:var(--muted); }

/* Inline body images stay in-column; heading rhythm scaled up for 19px body */
.rak-prose img{ max-width:100%; height:auto; }
.rak-prose .fr-dib{ display:block; margin:1.6em auto; float:none; }
.rak-prose .fr-fic{ max-width:100%; }
.rak-prose figure{ margin:1.8em 0; }
.rak-prose h2{ font-size:clamp(23px,2.4vw,30px); margin-top:1.7em; }
.rak-prose h3{ font-size:clamp(19px,2vw,23px); }

@media (max-width:1000px){
  .rak-article{ max-width:760px; }
  .rak-article__grid{ grid-template-columns:1fr; }
  .rak-article__aside{ position:static; }
  .rak-article__head-wrap{ max-width:none; }
}

/* ── Unified portal card grid (category / search / listings) ───────────────── */
.rak-pagehead{ padding:30px 0 4px; }
.rak-pagetitle{ font-size:clamp(28px,4vw,44px); line-height:1.05; letter-spacing:-.02em; margin:4px 0 0; }
.rak-cardgrid2{ display:grid; grid-template-columns:repeat(auto-fill,minmax(288px,1fr)); gap:24px 22px; }
.rak-card{ display:flex; flex-direction:column; gap:9px; }
.rak-card:hover{ text-decoration:none; } .rak-card:hover .rak-card__t{ color:var(--link); }
.rak-card__ph{ aspect-ratio:16/10; border-radius:var(--r); }
.rak-card__c{ font-size:11px; font-weight:800; letter-spacing:.07em; text-transform:uppercase; margin-top:2px; }
.rak-card__t{ font-weight:700; font-size:17px; line-height:1.26; color:var(--text); }
.rak-card__ex{ font-size:13.5px; color:var(--muted); line-height:1.45; }
@media (max-width:560px){ .rak-cardgrid2{ grid-template-columns:1fr 1fr; gap:18px 14px; } .rak-card__t{ font-size:15px; } }
@media (max-width:380px){ .rak-cardgrid2{ grid-template-columns:1fr; } }

/* Skip-to-content link (visible on keyboard focus) */
.skip{ position:absolute; left:12px; top:-48px; z-index:100; background:var(--ink); color:#fff;
  padding:9px 16px; border-radius:8px; font-weight:700; font-size:14px; transition:top .15s; }
.skip:focus{ top:8px; text-decoration:none; }

/* Mobile-only search entry point (the full search form hides < 860px) */
.rak-mast__searchlink{ display:none; }

/* ── Two-tier header responsive ────────────────────────────────────────────── */
@media (max-width:860px){
  .rak-mast__search{ display:none; }
  .rak-brand__tag{ display:none; }
  .rak-mast__searchlink{ display:grid; place-items:center; width:38px; height:38px; border-radius:999px;
    border:1px solid var(--hair); background:var(--surface); color:var(--text); font-size:16px; font-weight:800; }
}