/* ==========================================================================
   eGov redesign — shared design system
   Loaded by header-rd.php for every template that uses the redesign chrome.
   ========================================================================== */

:root{
  --paper:#FAF8F4; --ink:#16161A; --red:#B32A26; --red-dark:#93201D;
  --muted:#57544D; --grey:#6E6A63; --faint:#A8A499; --rule:#E6E1D6; --rule-strong:#D8D3C8;
}
/* overflow-x:clip, not hidden — hidden turns body into a scroll container, which
   silently disables every position:sticky on the page (the article side rails and
   sidebar rely on it). clip trims horizontal overflow without that side effect. */
html,body{margin:0;padding:0;background:var(--paper);overflow-x:clip;}
body.egov-rd{font-family:'Public Sans',sans-serif;color:var(--ink);-webkit-font-smoothing:antialiased;}
.egov-rd a{color:var(--ink);text-decoration:none;}
.egov-rd a:hover{color:var(--red);}
.egov-rd img{display:block;max-width:100%;}
.egov-rd ::selection{background:var(--red);color:#fff;}
.egov-rd *,.egov-rd *::before,.egov-rd *::after{box-sizing:border-box;}

.rd-shell{min-height:100vh;display:flex;flex-direction:column;}
.rd-wrap{max-width:1240px;margin:0 auto;padding-left:32px;padding-right:32px;}
.rd-kicker{color:var(--red);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.1em;}
.rd-date{color:var(--faint);font-size:12px;}
.rd-serif{font-family:'Newsreader',serif;font-weight:600;}
.rd-more{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--red);}
.rd-btn{display:inline-block;white-space:nowrap;padding:13px 18px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;}
.rd-btn-red{background:var(--red);color:#fff;}
.rd-btn-red:hover{background:var(--red-dark);color:#fff;}
.rd-btn-line{border:1px solid var(--ink);color:var(--ink);padding:12px 18px;}
.rd-btn-line:hover{background:var(--ink);color:#fff;}

.rd-thumb{background:#fff;border:1px solid var(--rule);background-size:contain;background-position:center;background-repeat:no-repeat;}
.rd-thumb-16x9{aspect-ratio:16/9;}
.rd-thumb-3x2{aspect-ratio:3/2;}

/* ------------------------------- Top bar ------------------------------- */
.rd-topbar{background:var(--ink);color:#CFCBC2;}
.rd-topbar .rd-wrap{padding-top:8px;padding-bottom:8px;display:flex;align-items:center;justify-content:space-between;font-size:12px;letter-spacing:.04em;}
.rd-topbar-l{display:flex;align-items:center;gap:16px;}
.rd-topbar-l strong{color:#fff;font-weight:600;}
.rd-topbar-l .sep{color:#57544D;}
.rd-topbar-r{display:flex;align-items:center;gap:20px;}
.rd-topbar a{color:#CFCBC2;text-transform:uppercase;font-size:11px;letter-spacing:.08em;}
.rd-topbar a:hover{color:#fff;}
.rd-topbar a.is-strong{font-weight:600;}

/* ------------------------------ Masthead ------------------------------- */
.rd-head{background:var(--paper);border-bottom:1px solid var(--ink);}
.rd-head .rd-wrap{padding-top:26px;}
.rd-head-row{display:flex;align-items:flex-end;justify-content:space-between;padding-bottom:22px;gap:16px;flex-wrap:wrap;}
.rd-logo{display:flex;align-items:center;gap:16px;}
.rd-logo img{height:54px;width:auto;}
.rd-logo span{font-size:12px;text-transform:uppercase;letter-spacing:.14em;color:var(--grey);font-weight:600;border-left:1px solid var(--rule-strong);padding-left:16px;line-height:1.5;}
.rd-head-actions{display:flex;align-items:center;gap:12px;}
.rd-search-btn{cursor:pointer;width:42px;height:42px;border:1px solid var(--ink);background:var(--paper);display:flex;align-items:center;justify-content:center;flex-shrink:0;padding:0;}
.rd-search-btn svg{stroke:var(--ink);}
.rd-search-btn:hover{background:var(--ink);}
.rd-search-btn:hover svg{stroke:#fff;}
/* Wraps rather than scrolls: a scrolling nav needs overflow, and overflow clips the dropdowns. */
.rd-nav{display:flex;flex-wrap:wrap;gap:4px;border-top:1px solid var(--rule);}
.rd-nav a{padding:14px 16px;white-space:nowrap;flex-shrink:0;font-size:13px;font-weight:500;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);border-bottom:3px solid transparent;margin-bottom:-1px;}
.rd-nav a:hover{color:var(--red);}
.rd-nav a.is-active,.rd-nav .rd-nav-btn.is-active{font-weight:800;color:var(--ink);border-bottom-color:var(--red);}

/* --------------------------- Nav dropdowns ----------------------------- */
.rd-nav-item{position:relative;}
.rd-nav-btn{display:flex;align-items:center;gap:6px;cursor:pointer;border:none;background:transparent;
  padding:14px 16px;white-space:nowrap;font-family:'Public Sans',sans-serif;font-size:13px;font-weight:500;
  text-transform:uppercase;letter-spacing:.08em;color:var(--muted);border-bottom:3px solid transparent;margin-bottom:-1px;}
.rd-nav-btn:hover{color:var(--red);}
.rd-nav-btn svg{transition:transform .18s ease;}
.rd-nav-item:hover .rd-nav-btn svg,.rd-nav-item:focus-within .rd-nav-btn svg{transform:rotate(180deg);}
.rd-sub{position:absolute;top:100%;left:0;z-index:60;display:none;flex-direction:column;min-width:240px;
  background:var(--paper);border:1px solid var(--rule);box-shadow:0 24px 48px rgba(0,0,0,.18);padding:6px 0;}
.rd-nav-item:hover .rd-sub,.rd-nav-item:focus-within .rd-sub{display:flex;}
.rd-sub a{padding:11px 18px;font-size:13px;font-weight:500;text-transform:none;letter-spacing:0;
  color:var(--muted);border-bottom:none;margin-bottom:0;white-space:nowrap;}
.rd-sub a:hover{background:#fff;color:var(--red);}
/* Keep the last dropdown ("More") from running off the right edge. */
.rd-nav-item:last-child .rd-sub{left:auto;right:0;}

/* ------------------------- Mobile / tablet nav -------------------------
   Below 1024px the bar would wrap to four or five rows, so it collapses behind
   the hamburger and becomes a vertical list. Dropdowns turn into accordions:
   hover is meaningless on touch, so a tap on the parent toggles .is-open (set
   by the script in footer-rd.php, which only does this below this breakpoint). */
.rd-menu-btn{display:none;}
@media (max-width:1024px){
  .rd-menu-btn{
    display:flex;align-items:center;justify-content:center;flex-shrink:0;
    width:42px;height:42px;padding:0;cursor:pointer;
    border:1px solid var(--ink);background:var(--paper);color:var(--ink);
  }
  .rd-menu-btn:hover{background:var(--ink);color:#fff;}

  .rd-nav{display:none;flex-direction:column;flex-wrap:nowrap;gap:0;padding-bottom:10px;}
  .rd-nav.is-open{display:flex;}

  .rd-nav-item{width:100%;}
  .rd-nav > a,
  .rd-nav-btn{
    width:100%;padding:14px 2px;font-size:14px;
    border-bottom:1px solid var(--rule);border-left:none;margin-bottom:0;
    justify-content:space-between;
  }
  .rd-nav > a.is-active,.rd-nav .rd-nav-btn.is-active{border-bottom-color:var(--rule);color:var(--red);}

  /* Accordion, not a floating panel. */
  .rd-sub{
    position:static;min-width:0;max-width:none;padding:2px 0 10px 14px;
    background:transparent;border:none;box-shadow:none;
  }
  /* Hover/focus must NOT open it here — only an explicit tap does. */
  .rd-nav-item:hover .rd-sub,
  .rd-nav-item:focus-within .rd-sub{display:none;}
  .rd-nav-item.is-open .rd-sub{display:flex;}
  .rd-nav-item.is-open .rd-nav-btn svg{transform:rotate(180deg);}
  .rd-sub a{padding:10px 6px;white-space:normal;border-bottom:1px solid var(--rule);}
  .rd-sub a:last-child{border-bottom:none;}
}

/* --------------------------- Search overlay ---------------------------- */
.rd-search{position:fixed;inset:0;z-index:100;background:rgba(22,22,26,.55);display:none;justify-content:center;align-items:flex-start;padding:0 16px;}
.rd-search.is-open{display:flex;}
.rd-search-scrim{position:absolute;inset:0;}
.rd-search-panel{position:relative;width:100%;max-width:760px;margin-top:80px;background:var(--paper);box-shadow:0 30px 80px rgba(0,0,0,.4);}
.rd-search-panel form{display:flex;align-items:center;gap:14px;padding:22px 26px;border-bottom:1px solid var(--rule);}
.rd-search-panel input{flex:1;min-width:0;border:none;background:transparent;outline:none;font-family:'Newsreader',serif;font-size:24px;color:var(--ink);}
.rd-search-close{cursor:pointer;border:none;background:transparent;font-size:22px;color:var(--grey);line-height:1;}
.rd-search-tags{padding:22px 26px;}
.rd-search-tags h4{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.1em;color:var(--faint);margin:0 0 12px 0;}
.rd-search-tags div{display:flex;flex-wrap:wrap;gap:8px;}
.rd-search-tags a{border:1px solid var(--rule);background:#fff;padding:8px 14px;font-size:13px;}
.rd-search-tags a:hover{border-color:var(--red);color:var(--red);}

/* ------------------------------- Ticker -------------------------------- */
.rd-ticker{background:#fff;border-bottom:1px solid var(--rule);}
.rd-ticker .rd-wrap{padding-top:10px;padding-bottom:10px;display:flex;align-items:center;gap:14px;overflow:hidden;}
.rd-ticker .tag{background:var(--red);color:#fff;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.1em;padding:4px 8px;flex-shrink:0;}
.rd-ticker a{font-size:14px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

/* -------------------------------- Hero --------------------------------- */
.rd-hero{padding-top:48px;padding-bottom:56px;display:grid;grid-template-columns:1.55fr 1fr;gap:56px;}
.rd-lead{display:flex;flex-direction:column;gap:18px;}
.rd-lead-meta{display:flex;align-items:center;gap:12px;}
.rd-lead-meta .rd-kicker{font-size:12px;}
.rd-lead h1{font-family:'Newsreader',serif;font-weight:600;font-size:46px;line-height:1.12;margin:0;letter-spacing:-.01em;}
.rd-lead h1 a:hover{color:var(--red);}
.rd-lead p{font-size:17px;line-height:1.6;color:var(--muted);margin:0;max-width:640px;}
.rd-aside{border-left:1px solid var(--rule);padding-left:40px;display:flex;flex-direction:column;}
.rd-aside h2{font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.12em;margin:0 0 8px 0;}
.rd-aside article{display:grid;grid-template-columns:1fr 88px;gap:16px;padding:18px 0;border-bottom:1px solid var(--rule);}
.rd-aside .txt{display:flex;flex-direction:column;gap:6px;}
.rd-aside h3{font-family:'Newsreader',serif;font-weight:600;font-size:17px;line-height:1.3;margin:0;}
.rd-aside .rd-thumb{width:88px;height:66px;}
.rd-aside .rd-more{margin-top:18px;}

/* ------------------------------- Cards --------------------------------- */
.rd-band-white{border-top:1px solid var(--ink);background:#fff;}
.rd-sec-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:32px;}
.rd-sec-head h2{font-family:'Newsreader',serif;font-weight:600;font-size:30px;margin:0;}
.rd-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:36px;}
.rd-grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;}
.rd-card{display:flex;flex-direction:column;gap:14px;}
.rd-card h3{font-family:'Newsreader',serif;font-weight:600;font-size:22px;line-height:1.25;margin:0;}
.rd-card h3 a:hover{color:var(--red);}
.rd-card p{font-size:14px;line-height:1.55;color:var(--muted);margin:0;}
.rd-card-sm{gap:12px;}
.rd-card-sm h3{font-size:18px;line-height:1.3;}

/* --------------------------- Magazine band ----------------------------- */
.rd-mag{background:var(--ink);color:#fff;}
.rd-mag .rd-wrap{padding-top:64px;padding-bottom:64px;display:grid;grid-template-columns:1fr 1.1fr;gap:48px;align-items:center;}
.rd-mag-copy{display:flex;flex-direction:column;gap:18px;}
.rd-mag-copy .eyebrow{color:#D8827E;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.12em;}
.rd-mag-copy h2{font-family:'Newsreader',serif;font-weight:600;font-size:38px;line-height:1.15;margin:0;}
.rd-mag-copy p{color:#A9A59C;font-size:15px;line-height:1.6;margin:0;}
.rd-mag-cta{display:flex;gap:12px;margin-top:6px;flex-wrap:wrap;}
.rd-mag-cta .ghost{border:1px solid #57544D;color:#fff;}
.rd-mag-cta .ghost:hover{border-color:#fff;color:#fff;}
/* Current issue featured on top, recent issues in a row beneath (home.php). */
.rd-mag-covers{display:block;}
.rd-mag-cover{display:block;transition:transform .2s ease;}
.rd-mag-cover:hover{transform:translateY(-6px);}
.rd-mag-cover .art{width:100%;aspect-ratio:3/4;background:#2C2C33 center/cover no-repeat;box-shadow:0 16px 32px rgba(0,0,0,.45);}
.rd-mag-cover .label{font-size:11px;color:#A9A59C;margin-top:10px;text-transform:uppercase;letter-spacing:.08em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}

.rd-mag-feature{display:grid;grid-template-columns:150px 1fr;gap:22px;align-items:center;
  padding-bottom:26px;margin-bottom:26px;border-bottom:1px solid #2C2C33;}
.rd-mag-feature .art{width:100%;aspect-ratio:3/4;background:#2C2C33 center/cover no-repeat;
  box-shadow:0 16px 32px rgba(0,0,0,.45);transition:transform .2s ease;}
.rd-mag-feature:hover .art{transform:translateY(-6px);}
.rd-mag-feature .meta{display:flex;flex-direction:column;gap:10px;}
.rd-mag-tag{align-self:flex-start;background:var(--red);color:#fff;font-size:10px;font-weight:800;
  text-transform:uppercase;letter-spacing:.1em;padding:5px 10px;}
.rd-mag-feature h3{font-family:'Newsreader',serif;font-weight:600;font-size:26px;line-height:1.15;color:#fff;margin:0;}
.rd-mag-read{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:#D8827E;}
.rd-mag-feature:hover .rd-mag-read{color:#fff;}
.rd-mag-recent{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}

/* ------------------------------ Videos --------------------------------- */
.rd-video{background:var(--ink);color:#fff;}
.rd-video .rd-wrap{padding-top:56px;padding-bottom:64px;}
.rd-video .rd-sec-head h2{color:#fff;}
.rd-video-card{display:flex;flex-direction:column;gap:12px;}
.rd-video-card h3{font-family:'Newsreader',serif;font-weight:600;font-size:18px;line-height:1.3;margin:0;}
.rd-video-card h3 a{color:#fff;}
.rd-video-card h3 a:hover{color:#D8827E;}
.rd-video-card .rd-date{color:#A9A59C;}
.rd-video-poster{position:relative;width:100%;aspect-ratio:16/9;padding:0;border:none;cursor:pointer;
  background:#2C2C33 center/cover no-repeat;transition:transform .2s ease;}
.rd-video-poster::after{content:'';position:absolute;inset:0;background:rgba(22,22,26,.25);transition:background .2s ease;}
.rd-video-poster:hover{transform:translateY(-4px);}
.rd-video-poster:hover::after{background:rgba(22,22,26,.05);}
.rd-video-poster:focus-visible{outline:2px solid var(--red);outline-offset:3px;}
.rd-play{position:absolute;z-index:1;left:50%;top:50%;transform:translate(-50%,-50%);
  width:52px;height:52px;border-radius:50%;background:var(--red);color:#fff;
  display:flex;align-items:center;justify-content:center;transition:background .2s ease;}
.rd-play svg{margin-left:2px;} /* Optical centring — the triangle's mass sits left of its box. */
.rd-video-poster:hover .rd-play{background:var(--red-dark);}

/* Lightbox player. Empty until a poster is clicked, so no YouTube iframe loads with the page. */
.rd-lightbox{position:fixed;inset:0;z-index:120;background:rgba(22,22,26,.88);display:none;align-items:center;justify-content:center;padding:24px;}
.rd-lightbox.is-open{display:flex;}
.rd-lightbox-scrim{position:absolute;inset:0;}
.rd-lightbox-panel{position:relative;width:100%;max-width:1000px;}
.rd-lightbox-frame{position:relative;width:100%;aspect-ratio:16/9;background:#000;box-shadow:0 30px 80px rgba(0,0,0,.5);}
.rd-lightbox-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}
.rd-lightbox-close{position:absolute;top:-42px;right:0;cursor:pointer;border:none;background:transparent;color:#fff;font-size:24px;line-height:1;padding:4px;}
.rd-lightbox-close:hover{color:var(--red);}

/* ----------------------- Events + transfers ---------------------------- */
.rd-split{display:grid;grid-template-columns:1.35fr 1fr;gap:48px;}
.rd-transfers article{padding:14px 0;border-bottom:1px solid var(--rule);display:flex;flex-direction:column;gap:4px;}
.rd-transfers h3{font-family:'Newsreader',serif;font-weight:600;font-size:16px;line-height:1.35;margin:0;}
.rd-transfers h2{font-family:'Newsreader',serif;font-weight:600;font-size:30px;margin:0 0 24px 0;}

/* [bfsievent] output. The plugin ships no CSS of its own — conferences.php styled it
   inline — so these rules must stand alone, not merely override. */
.rd-events{font-size:15px;}
.rd-events img{max-width:100%;height:auto;margin:0 auto;}
/* Cards left-align under the section heading and stretch (1fr) to fill the full
   width, so a partial row — e.g. just 3 upcoming events — spreads edge-to-edge
   instead of leaving a dead gutter on the right. The plugin ships its own
   repeat(4,1fr) grid, which left 3 cards in 4 columns with an empty 4th; this
   two-class selector overrides it. */
.rd-events .event-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:24px;margin:0;}
/* Flex column + margin-top:auto on the button pins every "Visit Website" to the
   card's bottom edge, so a two- or three-line title no longer leaves its button
   floating higher than its neighbours' — the row of buttons lines up. */
.rd-events .event-card{display:flex;flex-direction:column;align-items:center;position:relative;text-align:center;background:#fff;border:1px solid var(--rule);border-radius:0;box-shadow:none;padding:26px 20px;transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;}
.rd-events .event-card:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(22,22,26,.12);border-color:var(--rule-strong);}
.rd-events .event-badge{display:none;position:absolute;top:12px;right:12px;border-radius:0;padding:5px 9px;font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#fff;}
.rd-events .event-badge.upcoming{background:var(--red);}
.rd-events .event-badge.past{background:var(--ink);}
.rd-events .event-logo{display:block;width:100%;max-width:220px;height:140px;object-fit:contain;padding:14px;border-radius:0;background:var(--paper);border:1px solid var(--rule);margin:4px auto 20px;}
/* Reserve a two-line zone for the title (flex-centred, so a one-line title sits
   in the middle of it). With every title box the same height, the dates — and
   the whole row — line up across cards instead of drifting with line count. */
.rd-events .event-title{font-family:'Newsreader',serif;font-weight:600;font-size:19px;line-height:1.3;margin:0 0 10px;min-height:50px;display:flex;align-items:center;justify-content:center;}
.rd-events .event-date{font-size:14px;color:var(--muted);margin:0 0 22px 0;}
.rd-events .event-btn{margin-top:auto;display:inline-block;background:var(--ink);color:#fff;border-radius:0;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;padding:12px 24px;}
.rd-events .event-btn:hover{background:var(--red);color:#fff;box-shadow:none;}
/* Belt and braces: never let a past event render in an Upcoming-only column. */
.rd-events--upcoming .event-card:has(.event-badge.past){display:none;}

/* ----------------------------- Newsletter ------------------------------ */
.rd-news{background:var(--red);color:#fff;}
.rd-news .rd-wrap{padding-top:48px;padding-bottom:48px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:28px;}
.rd-news h2{font-family:'Newsreader',serif;font-weight:600;font-size:30px;margin:0 0 6px 0;}
.rd-news p.dek{margin:0;font-size:15px;color:#F1CDCB;}
.rd-news form{display:flex;flex-wrap:wrap;flex:1 1 340px;max-width:460px;min-width:0;}
.rd-news input{flex:1 1 auto;min-width:0;padding:14px 16px;border:none;font-size:14px;font-family:'Public Sans',sans-serif;outline:none;background:#fff;color:var(--ink);}
.rd-news button{flex:0 0 auto;white-space:nowrap;background:var(--ink);color:#fff;border:none;padding:14px 24px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;cursor:pointer;font-family:'Public Sans',sans-serif;}
.rd-news .message{flex:1 0 100%;margin:8px 0 0 0;min-height:1em;}

/* ------------------------------- Footer -------------------------------- */
.rd-foot{background:var(--ink);color:#A9A59C;margin-top:auto;}
.rd-foot a{color:#A9A59C;}
.rd-foot a:hover{color:#fff;}
.rd-foot .rd-wrap{padding-top:56px;}
.rd-foot-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:40px;}
.rd-foot-logo{display:inline-flex;background:#fff;padding:12px 16px;}
.rd-foot-logo img{height:52px;width:auto;}
.rd-foot p{font-size:14px;line-height:1.65;margin:16px 0 0 0;max-width:320px;}
.rd-foot h4{color:#fff;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.1em;margin:0 0 16px 0;}
.rd-foot ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;font-size:14px;}
.rd-foot-bottom{border-top:1px solid #2C2C33;margin-top:48px;padding:24px 0;display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;font-size:13px;}

/* ==========================================================================
   Internal pages
   ========================================================================== */

/* ------------------------------ Article -------------------------------- */
.rd-article{padding-top:40px;padding-bottom:64px;}
.rd-back{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--grey);}
.rd-article-head{max-width:780px;margin:28px auto 0 auto;}
.rd-article-meta{display:flex;align-items:center;gap:12px;}
.rd-article-head h1{font-family:'Newsreader',serif;font-weight:600;font-size:44px;line-height:1.12;margin:16px 0 0 0;letter-spacing:-.01em;}
.rd-byline{display:flex;align-items:center;gap:10px;margin:24px 0;padding-bottom:24px;border-bottom:1px solid var(--rule);}
.rd-byline .avatar{width:36px;height:36px;border-radius:50%;background:var(--red);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px;flex-shrink:0;}
.rd-byline .who{font-size:13px;}
.rd-byline .who span{color:var(--faint);}
.rd-article-hero{max-width:980px;margin:0 auto;aspect-ratio:16/8;}
.rd-article-body{max-width:700px;margin:40px auto 0 auto;}
.rd-article-body p,.rd-article-body li{font-family:'Newsreader',serif;font-size:20px;line-height:1.65;color:#24242A;}
.rd-article-body p{margin:0 0 24px 0;}
.rd-article-body h2,.rd-article-body h3,.rd-article-body h4{font-family:'Newsreader',serif;font-weight:600;line-height:1.25;margin:36px 0 14px 0;}
.rd-article-body h2{font-size:28px;} .rd-article-body h3{font-size:23px;} .rd-article-body h4{font-size:20px;}
.rd-article-body img{max-width:100%;height:auto;margin:0 auto 12px;}
.rd-article-body a{color:var(--red);text-decoration:underline;}
.rd-article-body blockquote{margin:32px 0;padding:4px 0 4px 24px;border-left:3px solid var(--red);font-family:'Newsreader',serif;font-size:22px;line-height:1.5;color:var(--ink);}
.rd-article-body ul,.rd-article-body ol{padding-left:24px;margin:0 0 24px 0;}
.rd-article-body iframe,.rd-article-body video{max-width:100%;}
.rd-article-body table{width:100%;border-collapse:collapse;font-family:'Public Sans',sans-serif;font-size:15px;}
.rd-article-body td,.rd-article-body th{border:1px solid var(--rule);padding:10px 12px;}
.rd-article-tags{max-width:700px;margin:0 auto;border-top:1px solid var(--rule);padding-top:20px;display:flex;gap:8px;flex-wrap:wrap;}
.rd-article-tags a{border:1px solid var(--rule);background:#fff;padding:6px 12px;font-size:12px;color:var(--muted);}
.rd-article-tags a:hover{border-color:var(--red);color:var(--red);}
.rd-article-share{max-width:700px;margin:28px auto 0 auto;}
.rd-related{max-width:980px;margin:56px auto 0 auto;}
.rd-related h2{font-family:'Newsreader',serif;font-weight:600;font-size:26px;margin:0 0 24px 0;border-top:1px solid var(--ink);padding-top:24px;}
.rd-related .rd-grid-3{gap:28px;}
.rd-related h3{font-size:17px;}

/* ------------------------- Archive / listing --------------------------- */
.rd-archive{padding-top:48px;padding-bottom:64px;}
.rd-archive-head h1{font-family:'Newsreader',serif;font-weight:600;font-size:44px;margin:0 0 8px 0;}
.rd-archive-head p{color:var(--muted);font-size:16px;margin:0 0 28px 0;max-width:600px;}
.rd-archive-rule{border-bottom:1px solid var(--ink);padding-bottom:20px;margin-bottom:36px;display:flex;gap:8px;flex-wrap:wrap;}
.rd-chip{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;padding:9px 16px;border:1px solid var(--rule-strong);background:#fff;color:var(--muted);}
.rd-chip:hover{border-color:var(--red);color:var(--red);}
.rd-chip.is-active{border-color:var(--ink);background:var(--ink);color:#fff;}
.rd-list-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:36px 32px;}
.rd-list-grid .rd-card h3{font-size:20px;line-height:1.28;}
.rd-empty{padding:60px 0;text-align:center;color:var(--grey);font-size:16px;}

/* Pagination — markup comes from egov_rd_pagination(), so these classes are ours. */
.rd-pagination{margin-top:56px;border-top:1px solid var(--rule);padding-top:28px;display:flex;flex-direction:column;align-items:center;gap:14px;}
.rd-pg-links{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:center;}
.rd-pg-links .page-numbers{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-width:44px;height:44px;padding:0 14px;
  border:1px solid var(--rule-strong);background:#fff;
  font-size:14px;font-weight:700;color:var(--ink);
  transition:border-color .18s,color .18s,background .18s;
}
.rd-pg-links a.page-numbers:hover{border-color:var(--red);color:var(--red);}
.rd-pg-links .page-numbers.current{background:var(--ink);border-color:var(--ink);color:#fff;}
.rd-pg-links .page-numbers.dots{border-color:transparent;background:transparent;color:var(--faint);min-width:24px;padding:0 4px;}
.rd-pg-links .prev,.rd-pg-links .next{font-size:12px;text-transform:uppercase;letter-spacing:.08em;}
.rd-pg-links .prev:hover,.rd-pg-links .next:hover{background:var(--ink);border-color:var(--ink);color:#fff;}
.rd-pg-note{font-size:13px;color:var(--grey);}
.rd-pg-note strong{color:var(--ink);}

/* --------------------------- Page / 404 -------------------------------- */
.rd-page{padding-top:48px;padding-bottom:64px;}
.rd-page-head{max-width:820px;}
.rd-page-head h1{font-family:'Newsreader',serif;font-weight:600;font-size:44px;line-height:1.15;margin:0 0 24px 0;}
.rd-page-body{max-width:820px;font-size:17px;line-height:1.7;color:#24242A;}
.rd-page-body h2,.rd-page-body h3{font-family:'Newsreader',serif;font-weight:600;line-height:1.25;margin:36px 0 14px 0;}
.rd-page-body h2{font-size:30px;} .rd-page-body h3{font-size:24px;}
.rd-page-body a{color:var(--red);text-decoration:underline;}
.rd-page-body img{height:auto;}
.rd-page-body table{width:100%;border-collapse:collapse;}
.rd-page-body td,.rd-page-body th{border:1px solid var(--rule);padding:10px 12px;}
.rd-404{padding:96px 0;text-align:center;}
.rd-404 h1{font-family:'Newsreader',serif;font-weight:600;font-size:96px;margin:0;color:var(--red);line-height:1;}
.rd-404 h2{font-family:'Newsreader',serif;font-weight:600;font-size:32px;margin:16px 0 12px 0;}
.rd-404 p{color:var(--muted);font-size:16px;margin:0 auto 28px auto;max-width:520px;}

/* --------------------- Magazine archive pages --------------------------
   egov-magazine-2024, magazine-20xx, latest-magazine… render through page.php
   with editor-era WPBakery content: 3-up cover columns, shortcode buy buttons,
   and a raw-HTML year table sitting on a red vc fill (white/red links on red =
   invisible). page.php adds .rd-page--mag and drops the news rail; these rules
   restyle that legacy content to the design system without touching it. */
.rd-page--mag .rd-page-body{max-width:none;}
/* WPBakery columns as a real grid (its float CSS may or may not be enqueued). */
.rd-page--mag .vc_row{display:flex;flex-wrap:wrap;margin:0 -14px;}
.rd-page--mag .vc_column_container{padding:0 14px;min-width:0;}
.rd-page--mag .vc_col-sm-4{flex:0 0 33.333%;max-width:33.333%;}
.rd-page--mag .vc_col-sm-12{flex:0 0 100%;max-width:100%;}
/* The 50px inline-styled Roboto heading → site serif. */
.rd-page--mag .vc_custom_heading{font-family:'Newsreader',serif !important;font-weight:600 !important;font-size:36px !important;line-height:1.15;margin:0 0 28px;}
/* Issue label bar above each cover. */
.rd-page--mag .wpb_text_column p[style*="background"]{background:var(--ink) !important;padding:10px 12px;font-size:13px;line-height:1.5;letter-spacing:.04em;}
/* Covers. */
.rd-page--mag .vc_single_image-img{width:100%;border:1px solid var(--rule);box-shadow:0 12px 28px rgba(22,22,26,.12);}
/* Buy Digital / Buy Print shortcode buttons → design-system buttons. */
.rd-page--mag .su-button{background:var(--ink) !important;border:none !important;border-radius:0 !important;text-decoration:none !important;}
.rd-page--mag .su-button:hover{background:var(--red) !important;}
.rd-page--mag .su-button span{display:inline-block;border:none !important;border-radius:0 !important;font-size:11px !important;line-height:1 !important;padding:12px 16px !important;font-weight:700;letter-spacing:.06em;text-transform:uppercase;}
/* Year pagination: kill the red fill band, render each year as a chip. */
.rd-page--mag .vc_row-has-fill{background:transparent !important;border-top:1px solid var(--rule);margin-top:32px;padding-top:16px;}
.rd-page--mag .wpb_raw_html table{width:auto;margin:8px auto 0;border-collapse:separate;border-spacing:6px;min-width:0;}
.rd-page--mag .wpb_raw_html td{border:none;padding:0;}
.rd-page--mag .wpb_raw_html td a{display:inline-block;min-width:60px;text-align:center;padding:11px 12px;border:1px solid var(--rule-strong);background:#fff;color:var(--ink) !important;font-size:13px;font-weight:700;text-decoration:none !important;}
.rd-page--mag .wpb_raw_html td a:hover{border-color:var(--red);color:var(--red) !important;}
@media (max-width:768px){
  .rd-page--mag .vc_col-sm-4{flex:0 0 100%;max-width:100%;}
  .rd-page--mag .vc_custom_heading{font-size:28px !important;}
}

/* Breadcrumb */
.rd-crumb{font-size:12px;color:var(--grey);letter-spacing:.04em;margin-bottom:8px;}
.rd-crumb a{color:var(--grey);}
.rd-crumb a:hover{color:var(--red);}

/* ==========================================================================
   Internal-page components
   ========================================================================== */

/* Reading-progress hairline, pinned to the very top of the viewport. */
.rd-progress{position:fixed;top:0;left:0;height:3px;width:0;background:var(--red);z-index:120;transition:width .1s linear;}

/* --- Archive: result count, lead story, empty state --- */
.rd-count{font-size:13px;color:var(--grey);margin-bottom:28px;}
.rd-count strong{color:var(--ink);font-weight:700;}
.rd-archive-head p{margin-bottom:12px;}

.rd-lead-card{
  display:grid;grid-template-columns:1.15fr 1fr;gap:36px;align-items:center;
  border-top:1px solid var(--ink);border-bottom:1px solid var(--rule);
  padding:36px 0;margin-bottom:44px;
}
.rd-lead-card .rd-lead-media{display:block;}
.rd-lead-body{display:flex;flex-direction:column;gap:14px;}
.rd-lead-meta{display:flex;align-items:center;gap:12px;}
.rd-lead-card h2{font-family:'Newsreader',serif;font-weight:600;font-size:34px;line-height:1.15;margin:0;}
.rd-lead-card h2 a:hover{color:var(--red);}
.rd-lead-card p{font-size:16px;line-height:1.6;color:var(--muted);margin:0;}

.rd-empty{padding:72px 0;text-align:center;color:var(--grey);}
.rd-empty-ico{display:block;font-size:40px;color:var(--rule-strong);margin-bottom:12px;}
.rd-empty h2{font-family:'Newsreader',serif;font-weight:600;font-size:26px;color:var(--ink);margin:0 0 8px 0;}
.rd-empty p{margin:0 0 24px 0;font-size:15px;}

/* --- Article: grid, share rail, standfirst, author box --- */
.rd-dot{color:var(--faint);}
.rd-standfirst{font-family:'Newsreader',serif;font-size:21px;line-height:1.55;color:var(--muted);margin:18px 0 0 0;}
.rd-article-figure{margin:0 auto;max-width:980px;}
.rd-article-figure figcaption{margin-top:10px;font-size:13px;color:var(--faint);text-align:center;}

/* Rail sits in its own column so the body keeps a true reading measure. */
.rd-article-grid{
  display:grid;grid-template-columns:64px minmax(0,700px);
  gap:40px;justify-content:center;margin-top:40px;
}
.rd-article-grid .rd-article-body,
.rd-article-grid .rd-article-tags{max-width:none;margin:0;padding:0;}
.rd-article-main{min-width:0;}

.rd-share{display:flex;flex-direction:column;align-items:center;gap:10px;position:sticky;top:24px;height:max-content;}
.rd-share-label{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.1em;color:var(--faint);}
.rd-share-btn{
  width:42px;height:42px;display:grid;place-items:center;cursor:pointer;
  border:1px solid var(--rule);background:#fff;color:var(--muted);padding:0;
  transition:border-color .18s,color .18s,background .18s,transform .18s;
}
.rd-share-btn:hover{border-color:var(--ink);background:var(--ink);color:#fff;transform:translateY(-2px);}
.rd-copied{font-size:11px;color:var(--red);font-weight:700;}

.rd-article-tags{margin-top:32px !important;}
.rd-article-tags a{border-radius:0;}

.rd-authorbox{
  display:flex;gap:18px;align-items:flex-start;
  margin-top:36px;padding:24px;background:#fff;border:1px solid var(--rule);
}
.rd-authorbox .avatar{
  flex-shrink:0;width:52px;height:52px;border-radius:50%;background:var(--red);color:#fff;
  display:grid;place-items:center;font-weight:800;font-size:16px;
}
.rd-authorbox h3{font-family:'Newsreader',serif;font-weight:600;font-size:20px;margin:4px 0 6px 0;}
.rd-authorbox p{margin:0;font-size:14px;line-height:1.6;color:var(--muted);}

.rd-linkpages{margin-top:24px;font-size:14px;font-weight:700;color:var(--muted);display:flex;gap:8px;}

/* --- Prev / next --- */
.rd-postnav{
  max-width:980px;margin:56px auto 0 auto;
  display:grid;grid-template-columns:1fr 1fr;gap:20px;
}
.rd-postnav-item{
  display:flex;flex-direction:column;gap:8px;padding:22px;
  border:1px solid var(--rule);background:#fff;
  transition:border-color .18s,transform .18s;
}
.rd-postnav-item:hover{border-color:var(--ink);transform:translateY(-2px);}
.rd-postnav-item.is-next{text-align:right;}
.rd-postnav-dir{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.1em;color:var(--red);}
.rd-postnav-title{font-family:'Newsreader',serif;font-weight:600;font-size:18px;line-height:1.3;color:var(--ink);}

/* --- Page: header band + TOC --- */
.rd-page-head-band{background:#fff;border-bottom:1px solid var(--ink);padding:44px 0;}
.rd-page-head-band h1{font-family:'Newsreader',serif;font-weight:600;font-size:44px;line-height:1.15;margin:0;max-width:900px;}
.rd-page-head-band .rd-standfirst{max-width:760px;}
.rd-page{padding-top:48px;padding-bottom:72px;}
.rd-page.has-toc{display:grid;grid-template-columns:220px minmax(0,1fr);gap:56px;align-items:start;}
.rd-toc{position:sticky;top:24px;}
.rd-toc-label{display:block;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.1em;color:var(--faint);margin-bottom:12px;}
.rd-toc nav{display:flex;flex-direction:column;border-left:1px solid var(--rule);}
.rd-toc a{padding:8px 0 8px 16px;margin-left:-1px;border-left:2px solid transparent;font-size:14px;line-height:1.4;color:var(--muted);}
.rd-toc a:hover{color:var(--red);border-left-color:var(--red);}
.rd-page.has-toc .rd-page-body{max-width:760px;}

/* --- Page: news sidebar (fills right-hand whitespace on plain pages) -----
   A generic page with no in-page TOC used to render an 820px column inside the
   1240px wrap, leaving a wide empty gutter on the right. When that happens we
   drop a live "Latest News" rail into the gutter — same component as the
   "Page with News Sidebar" template, so the two read identically. */
.rd-page.has-side{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,330px);gap:56px;align-items:start;}
.rd-page.has-side .rd-page-body{max-width:none;}
.rd-newsrail{border-left:1px solid var(--rule);padding-left:32px;position:sticky;top:24px;}
.rd-newsrail h2{font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.12em;margin:0 0 8px;}
.rd-newsrail article{display:grid;grid-template-columns:1fr 76px;gap:14px;padding:16px 0;border-bottom:1px solid var(--rule);}
.rd-newsrail article:last-of-type{border-bottom:none;}
.rd-newsrail .txt{display:flex;flex-direction:column;gap:5px;min-width:0;}
.rd-newsrail h3{font-family:'Newsreader',serif;font-weight:600;font-size:16px;line-height:1.3;margin:0;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
.rd-newsrail h3 a:hover{color:var(--red);}
.rd-newsrail .thumb{width:76px;height:58px;background:#fff center/cover no-repeat;border:1px solid var(--rule);}
.rd-newsrail .rd-more{display:inline-block;margin-top:14px;}
@media (max-width:1024px){
  .rd-page.has-side{grid-template-columns:1fr;gap:36px;}
  .rd-newsrail{border-left:none;padding-left:0;border-top:1px solid var(--ink);padding-top:24px;position:static;}
}

/* ==========================================================================
   Advertising
   ========================================================================== */

/* In-content banners injected by prefix_insert_post_ads() in functions.php.
   It emits .desktop-image (900x150) and .mobile-image (300x300); these rules
   decide which one shows. They used to live inline in the old single.php, so
   without them BOTH banners rendered at every width. */
.rd-article-body .desktop-image,
.rd-article-body .mobile-image{
  margin:28px auto;border:1px solid var(--rule);border-radius:10px;height:auto;max-width:100%;
}
@media (max-width:768px){ .rd-article-body .desktop-image{display:none !important;} }
@media (min-width:769px){ .rd-article-body .mobile-image{display:none !important;} }

/* Hanging side rails — one banner on each edge of the screen, like the main portal.
   Shown on desktop from 1200px up at the creatives' native 150px width; hidden on
   phones and tablets.

   Each rail is an absolute full-height track inside .rd-rail-zone (which wraps the
   article only), and the banner itself is sticky within that track. So it appears
   below the header, follows the reader down the page, and parks at the end of the
   article — it can never cover the menu at the top or the footer at the bottom. */
.rd-rail-zone{position:relative;}
.rd-siderail{display:none;}
@media (min-width:1200px){
  .rd-siderail{
    display:block;position:absolute;top:0;bottom:0;
    width:150px;
    z-index:90;
  }
  .rd-siderail--left{left:12px;}
  .rd-siderail--right{right:12px;}
  .rd-siderail-stick{position:sticky;top:24px;}
  /* 150px rail + 12px edge + 24px breathing room per side. On wide screens the
     1240px cap wins and this changes nothing. */
  .rd-article.rd-wrap{max-width:min(1240px, calc(100vw - 372px));}
  .rd-siderail.is-hidden{display:none;}
  .rd-siderail img{width:100%;height:auto;border:1px solid var(--rule);background:#fff;}
  .rd-siderail-tag{
    display:block;margin-bottom:6px;font-size:9px;font-weight:700;letter-spacing:.1em;
    text-transform:uppercase;color:var(--faint);text-align:center;
  }
  .rd-siderail-x{
    position:absolute;top:16px;right:0;width:22px;height:22px;padding:0;cursor:pointer;
    display:grid;place-items:center;font-size:11px;line-height:1;
    border:1px solid var(--rule);background:#fff;color:var(--grey);z-index:1;
  }
  .rd-siderail-x:hover{background:var(--ink);border-color:var(--ink);color:#fff;}
}

/* ------------------------------ Responsive ----------------------------- */
@media (max-width:1024px){
  .rd-article-grid{grid-template-columns:minmax(0,1fr);gap:24px;}
  /* Rail turns into a horizontal strip above the body. */
  .rd-share{flex-direction:row;position:static;justify-content:flex-start;flex-wrap:wrap;}
  .rd-lead-card{grid-template-columns:1fr;gap:20px;}
  .rd-page.has-toc{grid-template-columns:1fr;gap:28px;}
  .rd-toc{position:static;}
  .rd-toc nav{flex-direction:row;flex-wrap:wrap;border-left:none;gap:8px;}
  .rd-toc a{border:1px solid var(--rule);background:#fff;padding:8px 12px;margin:0;border-left:1px solid var(--rule);}
}
@media (max-width:1024px){
  .rd-hero{grid-template-columns:1fr;gap:40px;}
  .rd-aside{border-left:none;padding-left:0;border-top:1px solid var(--ink);padding-top:24px;}
  .rd-mag .rd-wrap{grid-template-columns:1fr;}
  .rd-split{grid-template-columns:1fr;}
  .rd-grid-4{grid-template-columns:repeat(2,1fr);}
  .rd-list-grid{grid-template-columns:repeat(2,1fr);}
  .rd-foot-grid{grid-template-columns:1fr 1fr;}
}
@media (max-width:768px){
  .rd-wrap{padding-left:18px;padding-right:18px;}
  .rd-hero{padding-top:28px;padding-bottom:36px;}
  .rd-lead h1{font-size:32px;}
  .rd-grid-3{grid-template-columns:1fr;gap:32px;}
  .rd-grid-4,.rd-list-grid{grid-template-columns:1fr;}
  .rd-mag-feature{grid-template-columns:120px 1fr;gap:16px;}
  .rd-mag-feature h3{font-size:21px;}
  .rd-mag-copy h2{font-size:28px;}
  .rd-sec-head h2,.rd-transfers h2,.rd-news h2{font-size:24px;}
  .rd-video .rd-wrap{padding-top:36px;padding-bottom:44px;}
  .rd-lightbox{padding:16px;}
  .rd-logo span,.rd-topbar .sep,.rd-topbar .tagline,.rd-topbar .is-desk,.rd-head-actions .is-desk,.is-desk-inline{display:none;}
  .rd-logo img{height:38px;}
  .rd-head .rd-wrap{padding-top:18px;}
  .rd-head-row{padding-bottom:16px;gap:10px;}
  .rd-head-actions{gap:8px;}
  .rd-btn{padding:11px 14px;font-size:11px;}
  .rd-search-btn{width:38px;height:38px;}
  .rd-topbar .rd-wrap{font-size:11px;}
  .rd-foot-grid{grid-template-columns:1fr;}
  .rd-article-head h1,.rd-archive-head h1,.rd-page-head h1{font-size:30px;}
  .rd-article-body p,.rd-article-body li{font-size:18px;}
  .rd-404 h1{font-size:64px;}
  .rd-page-head-band{padding:28px 0;}
  .rd-page-head-band h1{font-size:30px;}
  .rd-lead-card h2{font-size:26px;}
  .rd-standfirst{font-size:18px;}
  .rd-postnav{grid-template-columns:1fr;}
  .rd-postnav-item.is-next{text-align:left;}
  .rd-authorbox{flex-direction:column;gap:12px;}
  .rd-pg-links .rd-pg-word{display:none;}
  .rd-pg-links .prev,.rd-pg-links .next{padding:0 12px;}
}

/* --------------------------- Conferences page --------------------------- */
/* Upcoming and past are separate sections (conferences.php) rather than one mixed
   grid. The fallback logo is the site mark, not the event's own brand, so inset it
   further and sit it on paper — it should read as a placeholder, not a client logo. */
.rd-conf-sec{margin-bottom:64px;}
.rd-conf-sec:last-child{margin-bottom:0;}
.rd-conf .rd-sec-head{border-bottom:1px solid var(--ink);padding-bottom:14px;margin-bottom:28px;}
.rd-conf .rd-sec-head h2{font-size:26px;}
.rd-events .event-logo--fallback{object-fit:contain;padding:30px;background:var(--paper);}

/* ==========================================================================
   Responsive hardening
   The sheet above only ever branches at 1024 and 768, which leaves two gaps:
   tablet/small-laptop (769-1024) and small phones (<=400). And because body is
   overflow-x:clip, anything wider than its column is CUT OFF rather than made
   scrollable — so overflow here loses content, it does not just look wrong.
   ========================================================================== */

/* iOS inflates text in landscape unless told not to. */
html{-webkit-text-size-adjust:100%;}

/* NOTE: do NOT add a global `.egov-rd img{height:auto}` here. It ties on
   specificity with `.rd-logo img{height:54px}` / `.rd-foot-logo img{height:52px}`
   and, being later in the file, wins — inflating every logo to its natural 86px.
   Content images already get height:auto from their own scoped rules
   (.rd-article-body img, .rd-page-body img, .sp-main img, .rd-events img). */

/* Keyboard users had no visible focus anywhere except the video posters. */
.egov-rd a:focus-visible,
.egov-rd button:focus-visible,
.egov-rd input:focus-visible{outline:2px solid var(--red);outline-offset:2px;}

/* Editor content: long URLs and unbroken strings would otherwise push the
   column wide and get clipped. */
.rd-article-body,.rd-page-body,.sp-main{overflow-wrap:break-word;}

/* Wide tables and fixed-size embeds, wrapped by the script in footer-rd.php.
   Each scrolls inside its own box so the PAGE never scrolls sideways. */
.rd-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 0 24px;}
.rd-scroll table{margin:0;min-width:520px;}
.rd-embed{position:relative;width:100%;aspect-ratio:16/9;margin:0 0 24px;}
.rd-embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}

/* The ticker headline is nowrap+ellipsis, but a flex item will not shrink below
   its content without this — so it overran .rd-wrap and got clipped mid-word
   instead of showing the ellipsis. */
.rd-ticker a{min-width:0;}

/* Section heads are a heading plus a "View all" link on one baseline; at narrow
   widths they need to be allowed to stack rather than overflow. */
.rd-sec-head{flex-wrap:wrap;}

/* --- Tablet / small laptop (769-1024) -----------------------------------
   Bounded BELOW 769 on purpose: these rules come after the <=768 block, so an
   open-ended max-width:1024 would override the phone layout further down. */
@media (min-width:769px) and (max-width:1024px){
  /* Three columns inside ~960px of content is a 296px card holding a 22px serif
     headline — it was the tightest thing on the page. */
  .rd-grid-3{grid-template-columns:repeat(2,1fr);}
  .rd-lead h1{font-size:38px;}
  .rd-article-head h1{font-size:36px;}
  .rd-mag-covers{grid-template-columns:repeat(4,1fr);gap:14px;}
}

/* Below 1024 the hamburger appears, so the masthead was carrying the burger,
   search, "Upcoming Events" AND "Subscribe to Magazine" beside the logo. Drop
   the outline button — Conferences is in the nav it opens. */
@media (max-width:1024px){
  .rd-head-actions .is-desk{display:none;}
  /* .rd-head-row keeps its flex-wrap:wrap from the base sheet — that is what lets
     the buttons drop to a second line on a narrow phone instead of overflowing. */
  .rd-logo{min-width:0;}
}

/* --- Phones ------------------------------------------------------------- */
@media (max-width:768px){
  /* Topbar was a no-wrap flex row: date on the left, three links on the right,
     justify-between. On a phone that is wider than the screen. */
  .rd-topbar .rd-wrap{flex-wrap:wrap;justify-content:center;gap:4px 14px;}
  .rd-topbar-l,.rd-topbar-r{flex-wrap:wrap;justify-content:center;gap:4px 14px;}

  /* Close button sat 42px ABOVE the panel — off-screen on a short viewport.
     Inset it into the player's corner instead, on a scrim so it stays legible
     against a bright frame. */
  .rd-lightbox-close{
    top:6px;right:6px;width:36px;height:36px;padding:0;font-size:18px;
    display:grid;place-items:center;background:rgba(22,22,26,.72);
  }
}

/* --- Small phones (<=400px): iPhone SE, older Androids ------------------ */
@media (max-width:400px){
  .rd-wrap{padding-left:14px;padding-right:14px;}
  .rd-lead h1{font-size:27px;}
  .rd-article-head h1,.rd-archive-head h1,.rd-page-head-band h1{font-size:26px;}
  .rd-404 h1{font-size:52px;}
  /* Newsletter input + button side by side leaves ~90px for the field. Stack. */
  .rd-news form{flex-direction:column;}
  .rd-news button{width:100%;}
  /* Headline beside an 88px thumb leaves too little for the text. */
  .rd-aside article{grid-template-columns:1fr 68px;gap:12px;}
  .rd-aside .rd-thumb{width:68px;height:52px;}
  .rd-btn{padding:10px 12px;font-size:10px;}
  .rd-head-actions{gap:6px;}
}