/* ==========================================================================
   RV LAYOUT, DESKTOP GEOMETRY  -  rv-layout-desktop-7.css
   Loaded after tokens-7, rv-blocks-3, petrol-chrome-34 and petrol-v12-3, and
   before rv-layout-mobile-6.css (which is entirely @media (max-width:1024px),
   so the two can never collide).

   WHY THIS FILE EXISTS
   The site had grown four independent container systems, each with its own
   idea of how wide the page is:

     .rv2-wrap    homepage and the sitewide footer, sized from --shell
     .rv-shell    the design system section blocks, max-width --rv-container
     .rv-g-*      guides and designed page bodies, hardcoded bleed padding
     .container   Woodmart, max-width 1860px from theme options

   They resolved to five different inner rails: 1120px, 1240px, 1660px,
   1820px and 1830px, and on archive templates the product grid was pushed a
   further 250px right by the sidebar column while the bands above and below
   it started at the viewport edge. Nothing lined up with anything.

   v6 CHANGES THE WIDTH OF THAT RAIL, NOT THE AGREEMENT.
   v5 unified everything but capped the rail at 1360px and centred it, which
   left 312px of dead ground down each side of a 1920 monitor. The site is a
   full bleed design: the rail now runs edge to edge with a fixed 40px gutter
   and no centre cap at any width. Every system still shares one left edge.

   Geometry, stacking and contrast only. No colour is invented, no type scale,
   spacing scale, component or content is changed.

   DESKTOP ONLY. Everything is inside @media (min-width: 1025px).
   ========================================================================== */

@media (min-width: 1025px) {

/* --------------------------------------------------------------------------
   1. ONE RAIL, EDGE TO EDGE

   --rv-gutter  40px, the only inset from the viewport edge, at every width
   --rv-container / --rv-container-wide  100%, i.e. no centre cap ever engages

   Content width is therefore (viewport - 80px) at 1280, 1440, 1920, 2560 and
   beyond, and the content left edge is 40px everywhere. The gutter is a fixed
   px value on purpose: a percentage or a max-width would reopen the empty
   margins this file exists to remove.
   -------------------------------------------------------------------------- */

:root {
  --rv-gutter:           40px;
  --rv-container:        100%;
  --rv-container-wide:   100%;

  /* Bled sections re-inset their own text; this is that inset. Now simply the
     gutter, because there is no centre cap left to compute a half measure
     against. */
  --rv-bleed-pad:        var(--rv-gutter);

  /* Reading measure for long prose. Applied to the PARAGRAPH inside the wide
     rail, never to the rail itself - see section 5. */
  --rv-measure-prose:    820px;

  /* Long form post bodies. Deliberately more generous than the standfirst
     measure above: at 1440 the article column is narrower than this, so the
     cap does not engage at all and nothing visibly changes. It only bites on
     a wide monitor, where an 18px line would otherwise run to 126 characters. */
  --rv-measure-article:  990px;
}

/* The homepage rv2 system sizes from --shell, declared on the .rv2 wrapper. */
body.rv-petrol .rv2 { --shell: calc(100% - (var(--rv-gutter) * 2)); }

/* --------------------------------------------------------------------------
   2. THE WOODMART CONTAINER JOINS THE RAIL

   max-width is removed outright rather than raised, so no monitor size can
   ever reintroduce a centred column. The bar keeps its full bleed background;
   only the text inside it is inset by the gutter.

   The homepage content container is excluded: its Elementor body is a full
   width canvas whose sections bleed on their own and whose rail comes from
   --shell above. The header is added back explicitly below, because the
   header is site chrome and belongs on the rail on every template.
   -------------------------------------------------------------------------- */

body.rv-petrol:not(.home) .container,
body.rv-petrol .whb-row .container {
  max-width: none;
  padding-inline: var(--rv-gutter);
  margin-inline: auto;
}

/* Woodmart reuses .container inside the header dropdown panels. Those panels
   size themselves (a 220px menu card), so a 40px site gutter inside one left
   its links a 98px column. The site rail stops at the panel edge. */
body.rv-petrol .wd-dropdown .container,
body.rv-petrol .wd-dropdown-menu .container,
body.rv-petrol .wd-sub-menu .container {
  padding-inline: 0;
}

/* --------------------------------------------------------------------------
   3. THE HARDCODED BLEED INSETS MOVE ONTO THE SHARED GUTTER

   These sections bleed to the viewport and then re-inset their own text. Each
   had a different half measure baked in (560px, 620px, 830px), which is why a
   guide, a category hero and a section block each started at a different x on
   the same site. Their bleed margin is pinned too: the original
   calc(50% - 50vw) mixes a scrollbar-exclusive percentage with a
   scrollbar-inclusive vw and lands a few px left of true zero, which would
   put their text a few px off the rail everything else uses.
   -------------------------------------------------------------------------- */

body.rv-petrol .rv-g-hero,
body.rv-petrol .rv-g-sec--dark,
body.rv-petrol .rv-g-sec--tint,
body.rv-petrol .rv-c-hero,
body.rv-petrol .rv-c-trust {
  margin-inline: calc(var(--rv-gutter) * -1);
  padding-inline: var(--rv-bleed-pad);
}

/* --------------------------------------------------------------------------
   4. DESIGNED BANDS BLEED ON EVERY SIDEBARLESS TEMPLATE

   The old rule opted in by body class (rv-brand-page, rv-shop-page). The 404
   template carries neither, so its petrol bands rendered boxed inside the
   content column with the page ground showing down both sides. Keyed off the
   absence of a sidebar instead, so it is right by construction and archives
   that do have a sidebar stay excluded.

   The bleed is now exactly minus one gutter rather than 100vw. Section 2 left
   .container with no max-width, so cancelling its padding lands the band on
   the viewport edge precisely, with no scrollbar rounding and nothing
   overhanging the document.
   -------------------------------------------------------------------------- */

body.rv-petrol main.wd-content-layout:not(:has(.wd-sidebar)) > .site-content > .rv-sec,
body.rv-petrol main.wd-content-layout:not(:has(.wd-sidebar)) .entry-content > .rv-sec {
  width: auto;
  max-width: none;
  margin-inline: calc(var(--rv-gutter) * -1);
}

body.rv-petrol main.wd-content-layout:not(:has(.wd-sidebar)):has(.rv-sec) {
  overflow-x: clip;
}

/* --------------------------------------------------------------------------
   5. LONG PROSE KEEPS A READING MEASURE, THE RAIL STAYS WIDE

   Snippet 26 prints the entire category term description - several thousand
   words with its own subheadings - inside div.rv-lede. .rv-lede is the design
   system one sentence standfirst and is clamped to 62ch, so the description
   rendered as a 707px column stranded on the left of the band.

   v5 fixed that by narrowing the shell. That was the wrong lever: it centred
   the page. The measure belongs on the PARAGRAPH, not on the rail. The shell
   stays full width, the block stays on the shared left edge, and only the
   text lines are held to a readable length.

   Applied to every child so the heading, prose and list right edges agree
   instead of each resolving its own ch against its own font size.
   -------------------------------------------------------------------------- */

body.rv-petrol .rv-sec > .rv-shell > .rv-lede--long,
body.rv-petrol .rv-sec > .rv-shell > .rv-lede:has(p + p) {
  max-width: none;
}

body.rv-petrol .rv-sec > .rv-shell > .rv-lede--long > *,
body.rv-petrol .rv-sec > .rv-shell > .rv-lede:has(p + p) > * {
  max-width: var(--rv-measure-prose);
}

/* --------------------------------------------------------------------------
   6. THE HOMEPAGE HERO AND FORGE

   Both inset with calc((100vw - var(--shell)) / 2), meaning to land on the
   shell edge. The hero never did. --shell is a percentage expression, and a
   percentage inside a custom property resolves against the element that USES
   it, not the one that declares it. The panel is a 655px grid child, so 100%
   was 655px, --shell collapsed and the padding came out at 425px instead of
   72px - the headline sat a third of the way across the hero, off every rail
   on the site.

   Both are pinned to the gutter directly, with no percentage and no vw in the
   chain, so neither can drift again.
   -------------------------------------------------------------------------- */

body.rv-petrol .rv2-hero__panel {
  padding-inline-start: var(--rv-gutter);
}

body.rv-petrol .rv2-forge {
  padding-inline-end: var(--rv-gutter);
}

/* --------------------------------------------------------------------------
   7. INVISIBLE TEXT IN THE CATEGORY DESCRIPTION

   Ported from section 14 of rv-layout-mobile-6.css, which fixed this below
   1025px and left the desktop half here by arrangement. The fault was never
   mobile only - it is identical at every width.

   Snippet 26 prints the whole term description inside .rv-lede on a full
   bleed petrol band (#062930). A short standfirst was all that block ever
   held, so only <p> was ever given a colour. The descriptions are now long
   articles with their own subheadings and inline links, and every one of
   those falls through to the page default ink:

     h2, h3   #1A1F1E on #062930   contrast 1.09:1
     a        #333333 on #062930   contrast 1.22:1
     one <a>  #062930 on #062930   contrast 1.00:1

   NO NEW COLOUR IS INTRODUCED. These are the two tokens the design system
   already uses on this exact ground: --rv-bone for a heading (what .rv-h2
   resolves to on a petrol band) and --rv-bone plus an underline for a link,
   the underline being what separates it from --rv-bone-muted body text.
   Identical selectors and identical declarations to the mobile file, so the
   two halves cannot disagree across the 1024/1025 boundary.
   -------------------------------------------------------------------------- */

body.rv-petrol .rv-sec--petrol .rv-lede h2,
body.rv-petrol .rv-sec--petrol .rv-lede h3,
body.rv-petrol .rv-sec--petrol .rv-lede h4,
body.rv-petrol .rv-sec--petrol .rv-lede h5,
body.rv-petrol .rv-sec--petrol .rv-lede h6 {
  color: var(--rv-bone);
}

body.rv-petrol .rv-sec--petrol .rv-lede a:not(.rv-btn),
body.rv-petrol .rv-sec--petrol .rv-lede li,
body.rv-petrol .rv-sec--petrol .rv-lede strong,
body.rv-petrol .rv-sec--petrol .rv-lede em,
body.rv-petrol .rv-sec--petrol .rv-lede span:not([class]),
body.rv-petrol .rv-sec--petrol .rv-lede td,
body.rv-petrol .rv-sec--petrol .rv-lede th {
  color: var(--rv-bone);
}

body.rv-petrol .rv-sec--petrol .rv-lede a:not(.rv-btn) {
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* --------------------------------------------------------------------------
   8. LONG FORM POST BODIES KEEP A LINE LENGTH

   Widening the rail widened the article column with it: on a 1920 monitor a
   post body ran 1361px, which at 18px is 126 characters per line. The
   readable ceiling is about 85. Same principle as section 5 - the measure
   goes on the PARAGRAPH, left aligned on the rail, never on the rail itself,
   so the page does not go back to being a centred column.

   Tables, figures and .rv-table-wrap are deliberately NOT listed: they keep
   the full column width so the 52 row state table and the rune table are not
   squeezed into a text measure.
   -------------------------------------------------------------------------- */

body.rv-petrol.single-post .wd-entry-content > p,
body.rv-petrol.single-post .wd-entry-content > ul,
body.rv-petrol.single-post .wd-entry-content > ol,
body.rv-petrol.single-post .wd-entry-content > blockquote,
body.rv-petrol.single-post .wd-entry-content > h2,
body.rv-petrol.single-post .wd-entry-content > h3,
body.rv-petrol.single-post .wd-entry-content > h4 {
  max-width: var(--rv-measure-article);
}

/* --------------------------------------------------------------------------
   9. WIDE TABLES SCROLL INSIDE THEMSELVES

   The 51 row state table and the rune table are wider than a reading column.
   They already sit in .rv-table-wrap / .rv-tablewrap; this guarantees the
   wrapper is the thing that scrolls, so a wide table can never push the page
   wide now that the rail runs to the viewport edge.
   -------------------------------------------------------------------------- */

body.rv-petrol .rv-table-wrap,
body.rv-petrol .rv-tablewrap {
  overflow-x: auto;
  max-width: 100%;
}

/* --------------------------------------------------------------------------
   10. NOT DONE HERE, ON PURPOSE

   The sticky buy bar (.rv-buybar) is display:none above 1024px, so it is a
   phone component only. Its z-index token resolves to 20, under the theme
   back to top button (350) and the off canvas layers (400 and 500). That is a
   real stacking bug, but a MOBILE one, and rv-layout-mobile-6.css owns it.
   Nothing about it belongs behind a min-width query where it can never apply.
   -------------------------------------------------------------------------- */

} /* end @media (min-width: 1025px) */