/* Global Messen – pagina's buiten home, categorie en product (03-10-2026) */

/* Nooit horizontaal scrollen; lange namen en knoppen mogen afbreken */
body.gm{overflow-x:clip}
.gm-raster>*,.gm-vinden>*{min-width:0}
.gm-kaart h3,.gm-categorie .gm-kop3{overflow-wrap:anywhere}
.gm-knop{max-width:100%;white-space:normal;text-align:center;height:auto;min-height:52px;padding-top:12px;padding-bottom:12px;line-height:1.3}
.gm-paginering .pagination{flex-wrap:wrap}

/* Soorten-tabbladen: op een breed scherm onder elkaar doorlopen, op mobiel vegen */
@media (min-width:861px){
  .gm-filters{flex-wrap:wrap;row-gap:4px;column-gap:28px;overflow:visible}
  .gm-filters a{padding-bottom:14px}
}

/* Productfoto's op mobiel als veegbare strook, zodat titel en prijs meteen in beeld komen */
@media (max-width:860px){
  .gm-galerij{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:8px;margin-left:calc(var(--gm-rand) * -1);margin-right:calc(var(--gm-rand) * -1);padding:0 var(--gm-rand);scrollbar-width:none}
  .gm-galerij::-webkit-scrollbar{display:none}
  .gm-galerij figure,.gm-galerij figure.is-breed{flex:0 0 86%;scroll-snap-align:center;aspect-ratio:5/4}
}

/* ── Algemene pagina-opbouw ──────────────────────── */
.gm-pagina{padding-top:72px;padding-bottom:clamp(64px,9vw,128px);max-width:1440px;margin:0 auto}
.gm-pagina>.gm-kop1,.gm-pagina #content>h1:first-child,.gm-pagina #content>h1{font-size:clamp(36px,5vw,72px);font-weight:600;font-stretch:118%;text-transform:uppercase;line-height:.95;letter-spacing:-.01em;margin:0 0 40px}
.gm-pagina #content h2{font-size:clamp(18px,2vw,24px);margin:40px 0 16px}
.gm-pagina #content h3{font-size:16px;font-stretch:112%;text-transform:uppercase;letter-spacing:.04em;font-weight:600;margin:32px 0 12px}
.gm-pagina>.row{margin-left:-12px;margin-right:-12px}
.gm-pagina p{color:var(--gm-zacht)}
.gm-pagina a:not(.gm-knop):not(.btn):not(.list-group-item){text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(255,255,255,.35)}
.gm-pagina .gm-kruimel a{text-decoration:none!important}
.gm-smal{max-width:860px}
.gm-intro{max-width:640px;font-size:17px;margin:-16px 0 56px}
.gm-klein{font-size:12px;display:inline-block;margin-top:8px;color:var(--gm-grijs)}

/* Kolommen van de layout (bijv. accountmenu) weer tonen op deze pagina's */
.gm #column-left,.gm #column-right{display:block}
.gm #column-right .list-group,.gm #column-left .list-group{border-top:1px solid var(--gm-lijn)}
.gm #column-right .list-group-item,.gm #column-left .list-group-item{background:transparent;border:0;border-bottom:1px solid var(--gm-lijn);padding:14px 0;font-size:13px;font-stretch:112%;letter-spacing:.06em;text-transform:uppercase;color:var(--gm-zacht)}
.gm #column-right .list-group-item:hover,.gm #column-right .list-group-item.active{background:transparent;color:var(--gm-tekst)}

/* Formulieren in Global-stijl */
.gm-formulier{display:grid;gap:22px;max-width:560px}
.gm-veld{display:grid;gap:8px}
.gm-veld label{font-size:11px;font-weight:500;font-stretch:118%;letter-spacing:.16em;text-transform:uppercase;color:var(--gm-grijs);margin:0}
.gm-veld input,.gm-veld textarea,.gm-veld select{width:100%;background:transparent;border:1px solid var(--gm-lijn);border-radius:0;color:var(--gm-tekst);font-family:var(--gm-font);font-size:15px;padding:14px 16px;outline:none;transition:border-color .2s}
.gm-veld input:focus,.gm-veld textarea:focus{border-color:var(--gm-tekst)}
.gm-formulier .gm-knop{justify-self:start;min-width:200px}
.gm .alert{background:var(--gm-vlak);color:var(--gm-tekst);border:1px solid var(--gm-lijn);border-left:3px solid var(--gm-tekst);padding:16px 20px;margin-bottom:28px}
.gm .alert-danger{border-left-color:#E0796B}
.gm .alert-success{border-left-color:#7FB685}
.gm .form-group.required .control-label::before,.gm .required .control-label::before{color:#E0796B}
.gm .checkbox label,.gm .radio label{color:var(--gm-zacht)}
.gm .buttons{display:flex;justify-content:space-between;gap:12px;margin-top:32px}
.gm .buttons .pull-right,.gm .buttons .pull-left{float:none}
.gm .input-group-addon{background:var(--gm-vlak);color:var(--gm-zacht);border-color:var(--gm-lijn);border-radius:0}
.gm .img-thumbnail{background:var(--gm-tegel);border:0;border-radius:0;padding:4px}
.gm .table{color:var(--gm-tekst)}
.gm .table>thead>tr>td{font-size:11px;font-stretch:118%;letter-spacing:.14em;text-transform:uppercase;color:var(--gm-grijs);font-weight:500}
.gm .table>tbody>tr>td{vertical-align:middle}
.gm .table img{background:var(--gm-tegel)}
.gm .well{padding:32px}
.gm .well h2{margin-top:0}

/* Twee kolommen (inloggen) */
.gm-twee{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,7vw,120px)}
.gm-twee>section{border-top:1px solid var(--gm-lijn);padding-top:28px}
.gm-twee .gm-kop3{margin-bottom:24px}

/* Contact */
.gm-contact{display:grid;grid-template-columns:5fr 7fr;gap:clamp(40px,7vw,120px);align-items:start}
.gm-contact__gegevens dd{color:var(--gm-zacht)}
.gm-contact__gegevens dd a{color:var(--gm-tekst)}
.gm-locaties{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.gm-locatie{border-top:1px solid var(--gm-lijn);padding-top:20px}
.gm-locatie p{margin:10px 0 0;font-size:14px}

/* Sitemap en merkenlijst */
.gm-sitemap{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:40px}
.gm-sitemap section{border-top:1px solid var(--gm-lijn);padding-top:20px}
.gm-sitemap h2{margin:0 0 16px}
.gm-sitemap h2 a{text-decoration:none!important}
.gm-sitemap ul{list-style:none;margin:0;padding:0;display:grid;gap:10px;font-size:15px}
.gm-sitemap ul a{text-decoration:none!important}
.gm-sitemap ul a:hover{text-decoration:underline!important}

/* 404 en meldingen met beeld */
.gm-melding{position:relative;min-height:min(80vh,760px);display:flex;align-items:flex-end;overflow:hidden;background:var(--gm-vlak)}
.gm-melding>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.45}
.gm-melding__inhoud{position:relative;padding-top:120px;padding-bottom:clamp(48px,8vh,96px)}
.gm-melding .gm-kop1{margin:16px 0 20px}
.gm-melding p{color:var(--gm-zacht);max-width:520px;margin:0 0 36px;font-size:17px}

/* Vergelijken */
.gm #product-compare .table td:first-child{color:var(--gm-grijs);width:20%}

/* Winkelwagen (b_qcheckout) */
.gm .bt-empty{background:var(--gm-vlak);color:var(--gm-zacht);border:1px solid var(--gm-lijn);border-radius:0}

@media (max-width:860px){
  .gm-twee,.gm-contact{grid-template-columns:1fr}
  .gm-locaties{grid-template-columns:1fr}
  .gm-pagina{padding-top:48px}
  .gm .form-horizontal .control-label{text-align:left}
}

/* Verkooppunten (hp_store_location) */
.gm #hp-store-location .section-kicker{color:var(--gm-grijs);font-stretch:118%;letter-spacing:.18em;text-transform:uppercase;font-size:11px}
.gm #hp-store-location .section-title{color:var(--gm-tekst);font-family:var(--gm-font);font-stretch:118%;text-transform:uppercase;font-weight:600;font-size:clamp(30px,4vw,52px);letter-spacing:-.005em}
.gm #hp-store-location .section-subtitle{color:var(--gm-zacht)}
.gm #hp-store-location .qsl-land{border-radius:0;font-family:var(--gm-font);font-stretch:112%;letter-spacing:.08em;text-transform:uppercase;font-size:11px}
.gm #hp-store-location .qsl-land.is-actief{background:var(--gm-tekst);color:var(--gm-zwart);border-color:var(--gm-tekst)}
.gm #hp-store-location .qsl-search-input{border-radius:0}
.gm #hp-store-location .store-item{border-radius:0}

/* Foto's in tekstpagina's, bijv. Over Global (12-10-2026) */
.gm-artikel__tekst .gm-beeld,.gm-artikel__tekst .gm-beelden{margin:44px 0}
.gm-artikel__tekst .gm-beeld:first-child{margin-top:0}
.gm-artikel__tekst figure{margin:0;overflow:hidden}
.gm-artikel__tekst figure img{display:block;width:100%;height:auto;margin:0;object-fit:cover;background:var(--gm-vlak);aspect-ratio:4/5;transition:transform .8s cubic-bezier(.2,.6,.2,1)}
.gm-artikel__tekst .gm-beeld--breed figure img{aspect-ratio:3/2}
.gm-artikel__tekst figcaption{font-size:11px;font-weight:500;font-stretch:112%;letter-spacing:.14em;text-transform:uppercase;color:var(--gm-grijs);padding-top:12px}
.gm-beelden{display:grid;gap:12px}
.gm-beelden--2{grid-template-columns:1fr 1fr}
.gm-beelden--3{grid-template-columns:repeat(3,1fr)}
@media (hover:hover){.gm-artikel__tekst figure:hover img{transform:scale(1.03)}}
@media (min-width:1140px){
  .gm-artikel__tekst .gm-beeld--breed,.gm-artikel__tekst .gm-beelden{width:min(1080px,calc(100vw - 2 * var(--gm-rand)))}
}
@media (max-width:600px){
  .gm-beelden{gap:8px}
  .gm-beelden--3{grid-template-columns:1fr 1fr}
  .gm-beelden--3 figure:first-child{grid-column:span 2}
  .gm-beelden--3 figure:first-child img{aspect-ratio:3/2}
}
