/*
Theme Name: DE-MONT
Description: Motyw strony firmy saperskiej DE-MONT. Motywem przewodnim jest biała przekątna z logo.
Version: 1.1.0
Requires PHP: 8.0
Text Domain: demont
*/

/* Fonts are self-hosted so no visitor data goes to a third party. */
@font-face{font-family:"Big Shoulders Display";font-weight:700;font-display:swap;src:url(fonts/big-shoulders-display-latin-700.woff2) format("woff2");unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2122}
@font-face{font-family:"Big Shoulders Display";font-weight:700;font-display:swap;src:url(fonts/big-shoulders-display-latin-ext-700.woff2) format("woff2");unicode-range:U+0100-02AF,U+1E00-1EFF}
@font-face{font-family:"Libre Franklin";font-weight:400;font-display:swap;src:url(fonts/libre-franklin-latin-400.woff2) format("woff2");unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2122}
@font-face{font-family:"Libre Franklin";font-weight:400;font-display:swap;src:url(fonts/libre-franklin-latin-ext-400.woff2) format("woff2");unicode-range:U+0100-02AF,U+1E00-1EFF}
@font-face{font-family:"Libre Franklin";font-weight:600;font-display:swap;src:url(fonts/libre-franklin-latin-600.woff2) format("woff2");unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2122}
@font-face{font-family:"Libre Franklin";font-weight:600;font-display:swap;src:url(fonts/libre-franklin-latin-ext-600.woff2) format("woff2");unicode-range:U+0100-02AF,U+1E00-1EFF}

:root{
  --biel:#fff;
  --beton:#f1f1ee;
  --czerwien:#d0000f;
  --czerwien-ciemna:#a4000c;
  --stal:#5a5e5b;
  --stal-jasna:#a8aba8;
  --linia:#d3d4cf;
  --gutter:clamp(1.25rem,5vw,6rem);
  --max:92rem;
  --sekcja:clamp(4.5rem,10vw,9rem);
  --display:"Big Shoulders Display","Arial Narrow",Impact,sans-serif;
  --body:"Libre Franklin","Helvetica Neue",Arial,sans-serif;
  /* One treatment for photos from many old cameras, so they read as one archive. */
  --foto:grayscale(1) contrast(1.12) brightness(.94);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:6rem}
body{margin:0;background:var(--beton);color:#000;font:400 1.0625rem/1.7 var(--body);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
img{display:block;max-width:100%;height:auto}
h1,h2,h3{font-family:var(--display);font-weight:700;line-height:.98;letter-spacing:.002em;margin:0;text-wrap:balance}
p{margin:0 0 1.1em}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:.2em}
a:hover{color:var(--czerwien)}
:focus-visible{outline:3px solid var(--czerwien);outline-offset:3px}
.skip{position:absolute;left:-999px;top:0;z-index:100;background:#fff;padding:.75rem 1rem}
.skip:focus{left:0}
.wrap{max-width:calc(var(--max) + 2*var(--gutter));margin-inline:auto;padding-inline:var(--gutter)}

/* Przyciski */
.btn{display:inline-block;padding:1rem 1.6rem;font:600 1.0625rem/1.2 var(--body);text-decoration:none;border:0;cursor:pointer;transition:background-color .15s,color .15s}
.btn--tel{background:var(--czerwien);color:#fff}
.btn--tel:hover{background:var(--czerwien-ciemna);color:#fff}
.btn--txt{padding:1rem 0;color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.3em;background:none}
.btn--txt:hover{color:#fff;text-decoration-thickness:2px}
.btn--line{background:none;color:#000;box-shadow:inset 0 0 0 1px #000}
.btn--line:hover{background:#000;color:#fff}

/* Nagłówek: biały, bo logo jest czarno-czerwone */
.top{position:sticky;top:0;z-index:50;background:#fff}
.top__in{display:flex;align-items:center;gap:2rem;min-height:5rem}
.logo{display:flex;align-items:center;gap:.7rem;text-decoration:none;color:#000;font:700 1.75rem/1 var(--display);letter-spacing:.015em;margin-right:auto;white-space:nowrap}
.logo:hover{color:#000}
.logo svg{width:2.85rem;height:1.9rem;flex:none}
.nav ul{display:flex;gap:1.6rem;list-style:none;margin:0;padding:0}
.nav a{font-size:.9375rem;text-decoration:none;white-space:nowrap;padding:.4rem 0;display:block}
.nav a:hover{color:var(--czerwien)}
.nav .current-menu-item>a{box-shadow:inset 0 -2px 0 var(--czerwien)}
.tel-top{font-weight:600;font-size:1.0625rem;text-decoration:none;color:var(--czerwien);white-space:nowrap;padding:.5rem 0}
.tel-top:hover{color:var(--czerwien-ciemna)}
.menu{display:none}
.menu summary{list-style:none;cursor:pointer;font-weight:600;padding:.5rem 0}
.menu__zamknij,.menu[open] .menu__otworz{display:none}
.menu[open] .menu__zamknij{display:inline}
.menu__panel{display:none}
.menu summary::-webkit-details-marker{display:none}
@media (max-width:78rem){
  .nav--wide{display:none}
  .menu{display:block}
  .menu[open] .menu__panel{display:block;position:fixed;inset:5rem 0 0;background:#fff;overflow:auto;padding:.5rem var(--gutter) 2rem}
  body:has(.menu[open]){overflow:hidden}
  .menu .nav ul{display:block}
  .menu .nav a{font:700 clamp(2rem,8vw,2.75rem)/1 var(--display);padding:.85rem 0;border-bottom:1px solid var(--linia);white-space:normal}
  .menu__panel .btn{display:block;text-align:center;margin-top:1.75rem}
  .nav .current-menu-item>a{box-shadow:none;color:var(--czerwien)}
}
@media (max-width:30rem){
  .top__in{gap:1rem;min-height:4rem}
  .menu[open] .menu__panel{inset:4rem 0 0}
  .logo{font-size:1.4rem;gap:.45rem}
  .logo svg{width:2.1rem;height:1.4rem}
  .tel-top{font-size:1rem}
}

/* Hero: przekątna z logo dzieli zdjęcie i pole z tekstem */
.hero{position:relative;background:#000;color:#fff;overflow:hidden;display:flex;align-items:flex-end;min-height:min(calc(100vh - 5rem),60rem)}
.hero__cut,.hero__photo{position:absolute;inset:0}
.hero__cut{background:#fff;clip-path:polygon(26.1% 0,100% 0,100% 100%)}
.hero__photo{clip-path:polygon(27% 0,100% 0,100% 98.6%)}
.hero__photo img{position:absolute;left:32%;top:-5%;width:68%;height:105%;max-width:none;object-fit:cover;object-position:30% 50%;filter:var(--foto)}
.hero__txt{position:relative;width:100%;padding-block:3rem clamp(3rem,7vh,5.5rem)}
.hero h1{font-size:clamp(3.5rem,7vw,7.75rem);line-height:.9;max-width:8.6em}
.hero__lead{font-size:clamp(1.0625rem,1.25vw,1.25rem);line-height:1.6;max-width:31rem;margin:1.75rem 0 2rem;color:#e4e4e1}
.hero__cta{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem 1.5rem}
@media (prefers-reduced-motion:no-preference){
  .hero--home .hero__photo,.hero--home .hero__cut{animation:cut-in .8s cubic-bezier(.2,.7,.2,1) both}
  @keyframes cut-in{from{clip-path:polygon(100% 0,100% 0,100% 0)}}
}

/* Hero podstron */
.hero--page{min-height:clamp(28rem,66vh,40rem)}
.hero--page h1{font-size:clamp(2.9rem,6vw,6.25rem);line-height:.93;max-width:10em}
.hero--page .hero__lead{margin-bottom:0;max-width:34rem}
.hero--page .hero__cut{clip-path:polygon(41.2% 0,100% 0,100% 91.2%)}
.hero--page .hero__photo{clip-path:polygon(42% 0,100% 0,100% 90%)}
.hero--page .hero__photo img{left:42%;top:0;width:58%;height:100%;object-position:50% 40%}
.hero--plain{min-height:clamp(22rem,52vh,32rem)}
.hero--plain .hero__txt{padding-block:clamp(3rem,8vh,5rem) clamp(2.5rem,6vh,4.5rem)}
.hero--plain::before{content:"";position:absolute;inset:0;background:#fff;clip-path:polygon(65.2% 0,66% 0,100% 72%,100% 74.6%)}
.hero--plain .hero__flag{position:absolute;inset:0;background:var(--czerwien);clip-path:polygon(66% 0,100% 0,100% 72%)}
@media (max-width:52rem){
  .hero,.hero--page,.hero--plain{display:block;min-height:0}
  .hero--home .hero__photo,.hero--home .hero__cut{animation:none}
  .hero__cut,.hero__photo{position:relative;inset:auto;display:block}
  .hero__photo,.hero--page .hero__photo{height:62vw;min-height:13rem;clip-path:polygon(0 0,100% 0,100% 100%,0 42%)}
  .hero__photo img,.hero--page .hero__photo img{position:static;width:100%;height:100%;object-position:50% 50%}
  .hero__cut,.hero--page .hero__cut{position:absolute;top:0;left:0;right:0;height:calc(62vw + .35rem);min-height:13.35rem;clip-path:polygon(0 0,100% 0,100% 100%,0 42%)}
  .hero__txt{padding-block:1.75rem 3rem}
  .hero--plain .hero__txt{padding-block:3rem}
  .hero--plain::before{clip-path:polygon(70.4% 0,72% 0,100% 44%,100% 48%)}
  .hero--plain .hero__flag{clip-path:polygon(72% 0,100% 0,100% 44%)}
  .hero h1{font-size:clamp(3.1rem,15vw,4.75rem)}
  .hero--page h1{font-size:clamp(2.7rem,11.5vw,4.25rem)}
}

/* Sekcje */
.sec{padding-block:var(--sekcja)}
.sec--white{background:#fff}
.sec--czarna{background:#000;color:#fff}
.sec h2{font-size:clamp(2.75rem,6vw,6rem);line-height:.95}
.sec--czarna .wrap{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:clamp(2rem,6vw,6rem)}
.big{grid-column:2;font-size:clamp(1.5rem,2.5vw,2.4rem);line-height:1.3;margin:0;letter-spacing:-.008em}
@media (max-width:52rem){.sec--czarna .wrap{display:block}}
.big a{white-space:nowrap}
.big a:hover{color:#fff;text-decoration-thickness:2px}

/* Usługi: wielkie wiersze, zdjęcie i czerń pojawiają się po najechaniu */
.uslugi{list-style:none;margin:clamp(2.5rem,5vw,4.5rem) calc(-1*var(--gutter)) 0;padding:0;border-top:1px solid #000}
.uslugi li{border-bottom:1px solid #000}
.uslugi a{position:relative;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,4fr) 15rem;gap:clamp(1.5rem,4vw,4rem);align-items:center;min-height:10.5rem;padding:1.5rem var(--gutter);text-decoration:none;color:#000;transition:background-color .2s,color .2s}
.uslugi h3{font-size:clamp(2.25rem,4vw,4rem);line-height:.98}
.uslugi p{margin:0}
.uslugi img{width:15rem;height:6.5rem;object-fit:cover;opacity:0;clip-path:polygon(14% 0,100% 0,100% 100%,0 100%,0 22%);transition:opacity .2s;filter:var(--foto)}
@media (hover:hover){
  .uslugi a:hover,.uslugi a:focus-visible{background:#000;color:#fff}
  .uslugi a:hover img,.uslugi a:focus-visible img{opacity:1;filter:none}
}
.uslugi__znak{display:none}
@media (max-width:75rem) and (hover:hover){
  .uslugi a{grid-template-columns:minmax(0,5fr) minmax(0,4fr)}
  .uslugi img{display:none}
}
@media (hover:none){
  .uslugi img{opacity:1}
  .uslugi__znak{display:block;position:relative;overflow:hidden;width:15rem;height:6.5rem;background:#000}
  .uslugi__znak::before{content:"";position:absolute;inset:0;background:#fff;clip-path:polygon(26% 0,30% 0,100% 88%,100% 100%)}
  .uslugi__znak::after{content:"";position:absolute;inset:0;background:var(--czerwien);clip-path:polygon(30% 0,100% 0,100% 88%)}
}

/* Uprawnienia */
.upr{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2rem,6vw,6rem);align-items:start}
.upr h2{position:sticky;top:7rem}
.upr ul{list-style:none;margin:.4rem 0 0;padding:0}
.upr li{padding:1.15rem 0;border-top:1px solid var(--linia);font-size:clamp(1.0625rem,1.3vw,1.25rem);line-height:1.45}
.upr li:first-child{border-top:0;padding-top:0}
@media (max-width:52rem){.upr{grid-template-columns:1fr}.upr h2{position:static}}

/* Zdjęcia na stronie głównej: od krawędzi do krawędzi */
.sec--teren{padding-bottom:0}
.teren{display:grid;grid-template-columns:1.5fr 1fr 1fr;margin-top:clamp(2.5rem,5vw,4.5rem)}
.teren figure{margin:0}
.teren a{display:block}
.teren img{width:100%;height:clamp(16rem,34vw,34rem);object-fit:cover;filter:var(--foto);transition:filter .3s}
.teren figcaption{font-size:.875rem;color:var(--stal);padding:.75rem 1rem 0}
.sec__link{margin:0;padding-block:clamp(2rem,4vw,3.5rem) var(--sekcja);font-weight:600}
@media (hover:hover){.teren img:hover,.mozaika img:hover{filter:none}}
@media (max-width:52rem){
  .teren{grid-template-columns:1fr 1fr}
  .teren figure:first-child{grid-column:1/-1}
  .teren img{height:46vw}
  .teren figure:first-child img{height:66vw}
}

/* Treść podstron: nagłówek po lewej, treść po prawej */
.entry{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:clamp(2rem,6vw,6rem);align-items:start;padding-block:clamp(3.5rem,7vw,7rem) var(--sekcja)}
/* Element defaults come first so the section-spacing rules below can override them. */
.entry h3{font-size:clamp(1.6rem,2.4vw,2.25rem);margin:1.75em 0 .5em}
.entry ul,.entry ol{padding-left:1.25em;margin:0 0 1.2em}
.entry li{margin-bottom:.55em}
.entry li::marker{color:var(--czerwien);font-weight:600}
.entry a{font-weight:600}
.entry figure{margin:0 0 1.5rem}
.entry figcaption{font-size:.875rem;color:var(--stal);margin-top:.6rem}
.entry img{width:100%;filter:var(--foto)}
.entry>*{grid-column:2;min-width:0;max-width:44rem}
.entry>h2{grid-column:1;grid-row:span 8;align-self:start;font-size:clamp(2.1rem,3.6vw,3.5rem);line-height:1;margin:clamp(3rem,6vw,5.5rem) 0 0;max-width:none}
.entry>h2+*{margin-top:clamp(3rem,6vw,5.5rem)}
.entry>h2:first-child,.entry>figure:first-child+h2,.entry>.alert+figure+h2{margin-top:0}
.entry>h2:first-child+*,.entry>figure:first-child+h2+*,.entry>.alert+figure+h2+*{margin-top:0}
.entry>figure:first-child+h2{margin-top:0}
.entry>figure:first-child{margin-bottom:clamp(3rem,6vw,5rem)}
.entry>figure img{width:auto;max-width:100%;filter:grayscale(1) brightness(.88)}
@media (max-width:52rem){
  .entry{display:block}
  .entry>h2{margin:clamp(3rem,10vw,4rem) 0 1rem}
  .entry>h2+*{margin-top:0}
  .entry>figure:first-child+h2{margin-top:0}
}

.entry>.alert{grid-column:1/-1;max-width:none;background:#000;color:#fff;padding:clamp(1.75rem,4vw,3.5rem);margin:0 0 clamp(3rem,6vw,5rem);position:relative;overflow:hidden}
.entry>.alert::after{content:"";position:absolute;top:0;right:0;width:clamp(5rem,16vw,15rem);height:100%;background:var(--czerwien);clip-path:polygon(0 0,100% 0,100% 100%)}
.entry>.alert>*{position:relative;z-index:1}
.entry>.alert h2{font-size:clamp(2.1rem,4vw,3.75rem);margin:0 0 .5em;line-height:1;padding-right:clamp(3.5rem,14vw,12rem)}
.entry>.alert p{margin:0;max-width:40rem;padding-right:clamp(3rem,14vw,12rem);font-size:clamp(1.0625rem,1.4vw,1.3rem)}
.entry>.alert a{color:#fff}
.entry>.alert+figure{margin-bottom:clamp(3rem,6vw,5rem)}

/* Realizacje */
.entry>.mozaika{grid-column:1/-1;max-width:none;margin:clamp(2.5rem,5vw,4rem) 0 0}
.mozaika>.wp-block-group__inner-container{display:grid;grid-template-columns:repeat(6,1fr);gap:.5rem}
.mozaika figure{margin:0;grid-column:span 2}
.mozaika figure:nth-child(1),.mozaika figure:nth-child(2),.mozaika figure:nth-child(6),.mozaika figure:nth-child(7){grid-column:span 3}
.entry .mozaika img{height:clamp(12rem,26vw,28rem);object-fit:cover;transition:filter .3s}
@media (max-width:40rem){
  .mozaika>.wp-block-group__inner-container{display:block}
  .mozaika figure{margin-bottom:1rem}
  .entry .mozaika img{height:auto;aspect-ratio:3/2}
}

/* Pozostałe usługi */
.inne{background:#fff;padding-block:clamp(3.5rem,7vw,6rem)}
.inne h2{font-size:clamp(2.1rem,3.6vw,3.5rem)}
.inne ul{list-style:none;margin:clamp(1.5rem,3vw,2.5rem) 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:0 clamp(1.5rem,3vw,3rem)}
.inne li{border-top:1px solid #000}
.inne a{display:block;padding:1rem 0 1.5rem;font:700 clamp(1.6rem,2.4vw,2.25rem)/1 var(--display);text-decoration:none}
@media (max-width:52rem){.inne ul{grid-template-columns:1fr}.inne li:last-child{border-bottom:1px solid #000}}

/* Kontakt: logo w skali całej sekcji */
.cta{position:relative;background:#000;color:#fff;overflow:hidden}
.cta::before{content:"";position:absolute;inset:0;background:var(--czerwien);clip-path:polygon(60% 0,100% 0,100% 88%)}
.cta::after{content:"";position:absolute;inset:0;background:#fff;clip-path:polygon(59.2% 0,60% 0,100% 88%,100% 90%)}
.cta .wrap{position:relative;z-index:1;padding-block:clamp(4.5rem,9vw,8.5rem)}
.cta h2{font-size:clamp(1.9rem,3vw,3rem)}
.cta__tel{display:inline-block;font:700 clamp(3.75rem,12vw,12rem)/.95 var(--display);text-decoration:none;color:#fff;margin:.15em 0 .22em;white-space:nowrap}
.cta__tel:hover{color:#fff}
.cta p{margin:0;max-width:28rem;color:#e4e4e1}
.cta a:not(.cta__tel):hover{color:#fff;text-decoration-thickness:2px}
@media (max-width:52rem){
  .cta::before{clip-path:polygon(76% 0,100% 0,100% 30%)}
  .cta::after{display:none}
}

/* Stopka łączy się z sekcją kontaktu */
.stopka{background:#000;color:#fff;padding-block:clamp(2.5rem,5vw,4.5rem) 1.75rem;font-size:.9375rem}
.stopka__g{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,3.5fr) minmax(0,3.5fr);gap:2.5rem clamp(2rem,6vw,6rem);border-top:1px solid #3a3a3a;padding-top:clamp(2rem,4vw,3rem)}
.stopka h2{font-size:1.5rem;margin-bottom:.85rem}
.stopka ul{list-style:none;margin:0;padding:0}
.stopka li{margin-bottom:.35rem}
.stopka a{text-decoration:none}
.stopka a:hover{color:#fff;text-decoration:underline}
.stopka address{font-style:normal}
.stopka small{display:block;margin-top:clamp(2rem,4vw,3rem);color:var(--stal-jasna);font-size:.875rem}
@media (max-width:52rem){.stopka__g{grid-template-columns:1fr}}

/* Kontakt */
.entry>.kontakt-dane{list-style:none;padding:0}
.entry>.kontakt-dane li{padding:1.1rem 0;border-top:1px solid #000;margin:0;font-size:clamp(1.0625rem,1.5vw,1.375rem);line-height:1.4}
.kontakt-dane strong{display:block;font-size:.9375rem;color:var(--stal);font-weight:400;margin-bottom:.15rem}
.pole{margin-bottom:1.25rem}
.pole label{display:block;font-weight:600;font-size:.9375rem;margin-bottom:.3rem}
.pole input,.pole textarea{width:100%;padding:.75rem .85rem;font:inherit;background:#fff;border:1px solid #8b8e8a;border-radius:0}
.pole input:focus,.pole textarea:focus{border-color:#000;outline:2px solid #000;outline-offset:0}
.pole-2{display:grid;grid-template-columns:1fr 1fr;gap:0 1.25rem}
@media (max-width:36rem){.pole-2{grid-template-columns:1fr}}
.zgoda{display:flex;gap:.65rem;align-items:flex-start;margin:0 0 1.5rem;font-size:.9375rem}
.zgoda input{width:1.2rem;height:1.2rem;margin:.2rem 0 0;flex:none;accent-color:var(--czerwien)}
.pulapka{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.komunikat{padding:1rem 1.15rem;margin-bottom:1.5rem;font-weight:600;background:#fff;box-shadow:inset .3rem 0 0 #000}
.komunikat--blad{box-shadow:inset .3rem 0 0 var(--czerwien)}
.mapa-box iframe{display:block;width:100%;height:26rem;border:0}
.mapa-box p{font-size:.9375rem;color:var(--stal);margin-top:.85rem}

.nw{white-space:nowrap}
.uslugi--proste a{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}
@media (max-width:40rem){.uslugi--proste a{grid-template-columns:minmax(0,1fr)}}

/* ---------- Telefon: nic nie może zależeć od najechania kursorem ---------- */

a,button,summary,label{-webkit-tap-highlight-color:transparent}

/* Reakcja na dotyk zamiast hovera */
.uslugi a:active{background:#000;color:#fff}
.btn--tel:active,.pasek__tel:active{background:var(--czerwien-ciemna);color:#fff}
.inne a:active{color:var(--czerwien)}
@media (hover:none){.teren img:active,.mozaika img:active{filter:none}}

/* Pasek kontaktu: główna akcja zawsze pod kciukiem */
.pasek{display:none}

@media (max-width:52rem){
  html{scroll-padding-bottom:5rem}
  body{padding-bottom:calc(4.25rem + env(safe-area-inset-bottom))}
  .pasek{display:flex;gap:.5rem;position:fixed;left:0;right:0;bottom:0;z-index:40;background:#000;padding:.5rem .5rem calc(.5rem + env(safe-area-inset-bottom))}
  .pasek a{display:flex;align-items:center;justify-content:center;min-height:3.25rem;font-weight:600;text-decoration:none;white-space:nowrap}
  .pasek__tel{flex:1 1 auto;background:var(--czerwien);color:#fff;font-size:1.0625rem}
  .pasek__mail{flex:0 0 5.5rem;background:#fff;color:#000}
  .pasek a:hover{color:inherit}
  .pasek__tel:hover{color:#fff}
  /* The keyboard would otherwise push the bar over the field being filled in. */
  body:has(input[type=text]:focus,input[type=email]:focus,input[type=tel]:focus,textarea:focus) .pasek{display:none}

  /* Numer i przyciski są w pasku, więc góra strony może oddychać */
  .tel-top,.hero__cta{display:none}
  .hero__lead{margin-bottom:0}
  .hero__txt{padding-block:1.5rem 2.75rem}
  .menu summary{padding:.75rem 0 .75rem .75rem}

  /* Usługi: każdy wiersz ma obraz widoczny bez dotykania */
  .uslugi{border-top:0;margin-top:2rem}
  .uslugi li{border-bottom:0;margin-bottom:2.25rem}
  .uslugi li:last-child{margin-bottom:0}
  .uslugi a,.uslugi--proste a{display:flex;flex-direction:column;align-items:stretch;gap:0;min-height:0;padding:0}
  .uslugi img,.uslugi__znak{order:-1;flex:none;display:block;position:relative;overflow:hidden;width:100%;height:56vw;max-height:26rem;opacity:1;background:#000;clip-path:polygon(0 0,100% 0,100% 100%,0 76%)}
  .uslugi__znak::before{content:"";position:absolute;inset:0;background:#fff;clip-path:polygon(26% 0,29% 0,100% 80%,100% 88%)}
  .uslugi__znak::after{content:"";position:absolute;inset:0;background:var(--czerwien);clip-path:polygon(29% 0,100% 0,100% 80%)}
  .uslugi h3{padding-inline:var(--gutter);margin-top:.6rem;font-size:clamp(2.25rem,10vw,3.25rem)}
  .uslugi p{padding-inline:var(--gutter);margin-top:.5rem}
  .uslugi a:active{background:none;color:var(--czerwien)}
  .uslugi--proste{margin-inline:0}
  .uslugi--proste h3,.uslugi--proste p{padding-inline:0}

  /* Zdjęcia z terenu: przewijane palcem, kolejne wystaje, żeby było widać, że jest więcej */
  .sec--teren{padding-top:clamp(3.5rem,14vw,5rem)}
  .teren{display:flex;gap:.5rem;margin-top:1.75rem;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--gutter);padding-inline:var(--gutter);overscroll-behavior-x:contain;scrollbar-width:none}
  .teren::-webkit-scrollbar{display:none}
  .teren figure,.teren figure:first-child{flex:0 0 84%;grid-column:auto;scroll-snap-align:start}
  .teren img,.teren figure:first-child img{height:auto;aspect-ratio:4/5}
  .teren figcaption{padding:.6rem 0 0}
  .sec__link{padding-block:1.75rem 3.5rem}

  /* Zdjęcia w treści od krawędzi do krawędzi */
  .entry>figure{max-width:none;margin:1.25rem calc(-1*var(--gutter)) 2rem}
  .entry>figure img{width:100%;filter:var(--foto)}
  .entry>figure figcaption{padding-inline:var(--gutter)}
  .entry>.mozaika{margin:1.5rem calc(-1*var(--gutter)) 0}
  .mozaika>.wp-block-group__inner-container{display:block}
  .mozaika figure{margin-bottom:1.25rem}
  .entry .mozaika img,.entry .mozaika figure:nth-child(1) img{height:auto;aspect-ratio:3/2}
  .mozaika figcaption{padding-inline:var(--gutter)}

  /* Palec: wygodne pola dotyku */
  .stopka li{margin:0}
  .stopka li a{display:block;padding:.6rem 0}
  .stopka address{line-height:2.1}
  .inne a{padding:1.15rem 0 1.25rem}
  .formularz-wrap .btn,.mapa-box .btn{display:block;width:100%;text-align:center}
  .zgoda{padding:.25rem 0;align-items:center}
  .zgoda input{width:1.5rem;height:1.5rem;margin:0}
  .entry>.kontakt-dane a{display:block;padding:.3rem 0}
  .stopka address a{display:inline-block;padding:.2rem 0}
  .cta .wrap{padding-block:3.5rem}
}
