/* ============================================================================
   XUConseil — wide-screen cap.  Added 16 September 2026.
   Loaded LAST, after proto.css and mobile.css, on every page.

   The site had no upper bound. At 2560 the content held both edges of the
   window and about 1000px of empty ivoire opened in the middle of 04-service.
   This caps the CONTENT at 1680px centred, and leaves the full-screen heroes
   running to the real edges of the screen, which is what they are for.

   Two variables carry it, and no HTML changes are needed:

   --gut    the horizontal gutter. Above 1680 it absorbs the surplus width, so
            every gutter, grid and padding on the site moves inward together
            and the content ends up centred in a 1680 box.

   --bleed  how far a body photograph overhangs the text column. It does NOT
            grow. Above 1680 that means body images stop at the edge of the
            content box rather than at the edge of the screen.

   The reason --bleed is fixed is not taste: the photography is cut at a long
   edge of 1800 (see images.md). A body image allowed to run to 2560 is being
   upscaled to 142% and goes visibly soft on a large monitor. The two heroes
   are cut at 2200-2600 and can hold the full width, so they are not expressed
   through --bleed and are unaffected by this file.

   Below 1681px the --gut rule does nothing, and --bleed is identical to --gut
   at both tiers (63 desktop, 22 phone), so nothing changes at any width the
   site was reviewed at.
   ========================================================================== */
:root{--bleed:63px}
@media (max-width:1023px){
  :root{--bleed:22px}
}
@media (min-width:1681px){
  :root{
    /* 63px is the design gutter at 1440; beyond 1680 the surplus splits evenly
       either side. 100vw rather than 100%: --gut is read on :root, where a
       percentage resolves against the initial containing block. html has
       overflow-x:clip site-wide, so the scrollbar's few px can never scroll. */
    --gut: calc(63px + (100vw - 1680px) / 2);
  }
  /* The same reasoning, for the image bands that are not expressed through
     --gut at all: the case-study bleeds, the insights article hero, the NDA
     hero and the Ageless film frame are body-level blocks at width:100%, so
     they follow the window rather than the content box. Capped here to the
     same 1680 so a case page does not upscale an 1800px asset to 2560.

     NOT listed, on purpose: .hero-full on 01-home, .ab-open on 02-about and
     .stage on 14-contact. Those are the full-screen heroes, their sources are
     cut at 2200-2600, and they are meant to hold the window. */
  .bleed, .art-hero, .ndahero, figure.film{
    max-width:1680px;
    margin-inline:auto;
  }
}