/* Bounded admin variables preserve the existing red, white and charcoal design. */
:root { font-family:var(--site-font,Arial,sans-serif); font-size:var(--site-font-size,16px); }
body { isolation:isolate; background:var(--paper); }
h1,h2,h3,h4 { font-family:var(--heading-font,Arial,sans-serif); }
h1 { font-size:calc(clamp(2.65rem,5.25vw,5.3rem) * var(--heading-scale,1)); }
h2 { font-size:calc(clamp(2rem,3.25vw,3.45rem) * var(--heading-scale,1)); }
h3 { font-size:calc(1.45rem * var(--heading-scale,1)); }
.header { height:auto; min-height:var(--header-height,116px); padding:0; background:var(--header-background,#f3f4f5); }
.header-inner { display:flex; align-items:center; gap:30px; min-height:inherit; width:min(calc(100% - 2 * var(--gutter) - 32px),var(--header-width,1360px)); margin:auto; padding:12px 0 4px; }
.desktop-nav,.header-contact { font-size:var(--nav-size,15px); }
.button { font-size:var(--button-size,15px); }
.desktop-nav { gap:clamp(14px,1.7vw,28px); }
.mobile-nav nav { top:100%; background:var(--header-background,#f3f4f5); }
/* A small white tint lightens the configured header without rewriting CMS data. */
.header,.mobile-nav nav { background-image:linear-gradient(#ffffff40,#ffffff40); }
/* Keep the eyebrow's line box unchanged; transforms never move nearby content. */
.red-line { height:2px; transform-origin:center; transition:transform var(--hover-duration,220ms) var(--hover-easing,ease-out); }
.particle-field { position:fixed; inset:0; z-index:-1; pointer-events:none; clip-path:inset(var(--particle-top,116px) 0 0); }
.particle-field canvas { display:block; width:100%; height:100%; }
/* Transparent reading areas reveal the background; imagery and cards retain their surfaces. */
.product-card,.equipment-card { background:color-mix(in srgb,var(--paper) 88%,transparent); }
.prose,.page-intro,.section { min-width:0; }
.cms-content { display:flow-root; contain:paint; max-width:100%; overflow-wrap:anywhere; }
.cms-content img { max-width:100%; height:auto; }
.cms-content table { display:block; max-width:100%; overflow:auto; border-collapse:collapse; }
.cms-content td,.cms-content th { border:1px solid var(--line); padding:10px; }
.cms-content pre { padding:20px; background:var(--soft); overflow:auto; }
.cms-content blockquote { margin:24px 0; padding-left:24px; border-left:3px solid var(--red); }
.cms-content a { color:var(--red); }
.cms-content details { padding:16px; border:1px solid var(--line); }
body :is(a[href],button:not(:disabled),summary,[role=button]):not(.skip-link) {
  transition:transform var(--hover-duration,220ms) var(--hover-easing,ease-out),color var(--hover-duration,220ms) var(--hover-easing,ease-out),background-color var(--hover-duration,220ms) var(--hover-easing,ease-out),border-color var(--hover-duration,220ms) var(--hover-easing,ease-out);
  transform-origin:center;
}
/* Inline prose links need a transformable box, without changing card/nav layout. */
.prose a,.footer-bottom a,.hero-foot a,.pagination a { display:inline-block; }
@media(hover:hover) and (pointer:fine) {
  .red-line:hover { transform:scale(1.08,1.25); }
  body :is(a[href],button:not(:disabled),summary,[role=button]):not(.skip-link):hover { transform:scale(var(--hover-scale,1.025)); }
  /* Only one transform when an interactive card contains another control. */
  a:hover :is(button,a) { transform:none; }
}
:where(a[href],button:not(:disabled),summary):focus-visible { outline-offset:5px; }
@media(max-width:1150px) {
  .header { min-height:var(--header-mobile-height,88px); }
  .header-inner { width:calc(100% - 2 * var(--gutter)); gap:16px; }
  .desktop-nav,.header-contact { display:none; }
  .mobile-nav { display:block; margin-left:auto; }
  .mobile-nav summary { cursor:pointer; padding:12px; font-size:var(--nav-size,15px); }
  .mobile-nav nav { position:absolute; top:100%; left:0; right:0; padding:20px var(--gutter); display:flex; flex-direction:column; gap:12px; border-bottom:1px solid var(--line); max-height:calc(100dvh - var(--header-mobile-height)); overflow:auto; }
  .mobile-nav nav a { padding:10px 0; font-size:var(--nav-size,15px); }
}
@media(max-width:440px) {
  .hero-content h1,h1 { font-size:calc(2.6rem * var(--heading-scale,1)); }
  .brand { font-size:1.2rem; gap:8px; }
}
@media(prefers-reduced-motion:reduce) {
  .red-line { transform:none!important; transition:none!important; }
  :where(a,button,summary,[role=button]) { transform:none!important; transition:none!important; }
  .particle-field { display:none; }
}
@media print { .particle-field { display:none; } }
/* Preserve the original city without enlarging its pixels on wide desktop screens.
 * A separately uploaded hero is allowed to use the whole width of the viewport. */
@media(min-width:1536px) {
  .hero-image.hero-bundled { left:auto; right:0; width:1536px; }
}
