/* FIX 2 — Centered page with rails in a guaranteed empty gutter.
   Content is capped to a max width and centered; the rails only appear once the window is wide
   enough to fit content + rails + a real gap, and they sit OUTSIDE the content. Overlap becomes
   mathematically impossible. Loaded AFTER style.css as an override. */
.nav,.hero,.strip,.trustbar,.gearband,.section,.footer{
  max-width:1160px;margin-left:auto;margin-right:auto}
@media(min-width:1600px){
  /* neutralise the base reserved gutter; use a normal small inner padding */
  .nav,.hero,.strip,.section,.footer{padding-left:32px;padding-right:32px}
  .gearband,.trustbar{margin-left:auto;margin-right:auto}
}
.side-rail{display:none}

/* LAPTOP TIER (1280-1659px): compact rails pinned to the window edges. The content column is
   capped at calc(100vw - 372px), which reserves 186px per side (incl. scrollbar); a 12px-inset
   150px rail needs only 162px, so overlap stays impossible. Body-prefixed selectors outrank
   page-level styles. */
@media(min-width:1280px) and (max-width:1659.98px){
  body .nav,body .hero,body .strip,body .trustbar,body .gearband,body .section,body .footer{
    max-width:min(1160px,calc(100vw - 372px));padding-inline:28px}
  body .guide-hero,body .callout,body .steps-wrap{max-width:min(1080px,calc(100vw - 372px))}
  body .support-wrap,body .rev-wrap{max-width:min(820px,calc(100vw - 372px))}
  .side-rail{display:flex;flex-direction:column;gap:10px;position:fixed;top:96px;width:150px;z-index:6}
  .side-rail.left{left:12px}
  .side-rail.right{right:12px}
  .side-rail .rail-card{padding:12px 10px 11px}
  .side-rail .rail-emoji{font-size:32px;margin-bottom:6px}
  .side-rail .rail-name{font-size:13px}
  .side-rail .rail-sub{font-size:10.5px;margin:2px 0 8px}
  .side-rail .rail-btn{font-size:10.5px;padding:7px 10px}
}

@media(min-width:1660px){
  /* gutter each side = (100vw-1160)/2 ≥ 250px here, so a 200px rail always clears the content */
  .side-rail{display:flex;flex-direction:column;gap:14px;position:fixed;top:104px;width:200px;z-index:6}
  .side-rail.left{left:calc((100vw - 1160px)/2 - 220px)}
  .side-rail.right{right:calc((100vw - 1160px)/2 - 220px)}
}