/* Black + orange dress code (client request 2026-11-11). Loaded after logo.css; remove the <link> to go back to the light look. */
:root{
  --white:#0b0b0b;     /* page background */
  --paper:#161616;     /* alternate sections */
  --ink:#ffffff;       /* headings, strong text */
  --ink-2:#d4d4d4;     /* body text */
  --muted:#a3a3a3;     /* 7.6:1 on #0b0b0b */
  --line:#2c2c2c;
  --or-text:#f04e23;   /* 5.4:1 on #0b0b0b */
  --or-deep:#f04e23;
}
.btn-or{color:#000}
.btn-or:hover{background:#fff;color:#000}
.btn-ink:hover,.btn-white:hover,.socials a:hover{color:#000}
header{background:rgba(11,11,11,.97)}
header.scrolled{box-shadow:0 6px 24px rgba(0,0,0,.6)}
.band{background:var(--or)}
.svc:hover{background:#1d1714}
.step{border-top-color:var(--or)}
.dark{background:#000}
.dark .kicker,.box h3{color:var(--or)}
.box{border-color:#2c2c2c}
.about-logo::before,.about-logo::after{background:var(--or)}
.map-consent::before{filter:grayscale(1) invert(1) contrast(.9);opacity:.35}
.map-inner{background:rgba(11,11,11,.92)}
footer{background:#000;border-top:4px solid var(--or)}
footer a:hover{color:var(--or)}
.award{border:1px solid #2c2c2c}
@media (max-width:1060px){.menu{background:#0b0b0b;box-shadow:0 14px 30px rgba(0,0,0,.6)}}

/* services: full photos with the text over the bottom of the photo (all screen sizes) */
.svc-list{grid-template-columns:repeat(3,1fr);gap:16px;background:none;border:0}
.svc{display:block;position:relative;overflow:hidden;background:#000}
.svc img{aspect-ratio:4/3;height:auto;transition:transform .4s}
.svc:hover img{transform:scale(1.04)}
.svc:hover{background:#000}
.svc-body{position:absolute;left:0;right:0;bottom:0;padding:72px 22px 20px;background:linear-gradient(to top,rgba(0,0,0,.92) 0%,rgba(0,0,0,.78) 55%,rgba(0,0,0,0) 100%)}
.svc h3{color:#fff;margin:2px 0 4px}
.svc p{color:#e2e2e2;font-size:.94rem}
@media (max-width:1060px){.svc-list{grid-template-columns:1fr 1fr}}
@media (max-width:700px){
  .svc-list{grid-template-columns:1fr;gap:12px}
  .svc-body{padding:64px 18px 16px}
  .svc p{font-size:.92rem}
}

/* machinery: same look as services (full photo, caption over the bottom) */
.machine{position:relative;overflow:hidden;background:#000;border-bottom:0}
.machine img{transition:transform .4s}
.machine:hover img{transform:scale(1.04)}
.machine figcaption{position:absolute;left:0;right:0;bottom:0;padding:64px 20px 18px;background:linear-gradient(to top,rgba(0,0,0,.92) 0%,rgba(0,0,0,.78) 55%,rgba(0,0,0,0) 100%)}
.machine b{color:#fff;font-size:1.1rem}
.machine span{color:#e2e2e2}
@media (max-width:1060px){.fleet{gap:16px}}
@media (max-width:700px){.fleet{gap:12px}}

/* hero photo: keep the excavator in frame */
.hero-photo img{object-position:48% center}

/* 7th service: wide card across the row */
.svc-wide{grid-column:1/-1}
.svc-wide img{aspect-ratio:21/8;object-position:center 60%}
.svc-wide .svc-body{max-width:none}
.svc-wide p{max-width:640px}
@media (max-width:700px){.svc-wide img{aspect-ratio:4/3}}

/* service cards: cross-fading photos (js/slides.js) */
.svc .slide{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1.2s ease,transform .4s}
.svc .slide.on{opacity:1}

/* containers: same photo cards as services */
.cont-list .svc-num{font-size:1rem;color:var(--or)}
.cont-note{margin-top:22px;color:#b3b3b3;font-size:.95rem}

/* menu with Galerie: keep items on one line on narrower desktops */
.menu a{white-space:nowrap}
@media (min-width:1061px) and (max-width:1240px){.menu{gap:18px}}
@media (min-width:1061px) and (max-width:1160px){.menu{gap:13px}}
@media (min-width:1061px) and (max-width:1110px){.menu{gap:9px}}