/* Public template collection: intentionally scoped outside the editor and setup. */
html[data-theme=light] body.template-gallery-page{--product-bg:#fff;--product-text:#171717;--product-muted:#646464;--bg:#fff;--ink:#171717;--muted:#646464;--lijn:#e3e3e3}
.template-gallery-page .galerij{width:100%;max-width:none;padding:38px 40px 88px;margin:0 auto}
.galerij .galerij-kop{text-align:center;margin:0 auto 28px;max-width:760px}
.galerij .galerij-kop h1{font-family:'Inter',sans-serif;font-size:56px;font-weight:400;line-height:1.03;letter-spacing:-2.6px;margin:0 auto 22px;max-width:700px}
.galerij .galerij-kop>p:not(.gallery-eyebrow){font-size:16px;line-height:1.5;color:var(--muted);max-width:510px;margin:0 auto 28px}
.galerij .gallery-search{position:relative;max-width:660px;margin:auto}
.galerij .gallery-search input[type=search]{width:100%;height:60px;padding:0 20px 0 56px;border:1px solid var(--lijn);border-radius:6px;background:var(--surface);color:var(--ink);font:400 15px 'Inter',sans-serif;box-shadow:0 3px 12px -6px #0002}
.galerij .gallery-search button{position:absolute;left:5px;top:8px;width:44px;height:44px;border:0;background:transparent;color:var(--ink);cursor:pointer;padding:12px}
.galerij .gallery-search svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2}
.galerij .gallery-toolbar{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:34px;min-height:36px;font-size:14px}
.galerij .gallery-toolbar p{margin:0}.galerij .gallery-toolbar>a{display:inline-flex;align-items:center;gap:18px;min-height:44px;padding:10px 14px;border:1px solid var(--lijn);font-size:12px;text-decoration:none;color:var(--ink)}
.galerij .gallery-layout{display:grid;grid-template-columns:200px minmax(0,1fr);column-gap:34px;align-items:start}
.galerij .gallery-sidebar h2{font:500 15px/1.4 'Inter',sans-serif;margin:4px 0 20px}
.galerij .gallery-niches{display:flex;flex-direction:column;gap:2px}
.galerij .gallery-niches a{display:flex;align-items:baseline;justify-content:space-between;gap:10px;padding:6px 0;font-size:15px;line-height:1.4;text-decoration:none;color:var(--muted)}
.galerij .gallery-niches a[aria-current]{color:var(--ink);font-weight:600;text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}
.galerij .gallery-niches a:hover{color:var(--ink);text-decoration:underline;text-underline-offset:4px}
.galerij .gallery-niches a:first-child{margin-bottom:18px}
.galerij .gallery-results{min-width:0;scroll-margin-top:110px}
.galerij .gallery-results>h2{font:500 22px/1.3 'Inter',sans-serif;letter-spacing:-.6px;margin:0 0 22px}
.galerij .raster{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;margin:0;padding:0}
.galerij .raster li{min-width:0}
.galerij .tkaart{display:block;text-decoration:none;color:var(--ink)}
.galerij .tbeeld{display:block;overflow:hidden;border:1px solid var(--lijn);border-radius:8px;background:var(--surface);aspect-ratio:8/5}
.galerij .tbeeld img{display:block;width:100%;height:100%;object-fit:contain;object-position:top;transform:none}
.galerij .tmeta{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-top:14px}
.galerij .tnaam{font-size:15px;font-weight:500;line-height:1.4}.galerij .tpreview{font-size:12px;white-space:nowrap;color:var(--muted)}
.galerij .ttag{display:block;font-size:12px;line-height:1.5;color:var(--muted);margin-top:4px}
.galerij .tkaart:hover .tpreview{text-decoration:underline;text-underline-offset:4px;color:var(--ink)}
.galerij :is(a,button,input,summary):focus-visible{outline:2px solid var(--accent);outline-offset:5px}
.galerij .gallery-mobile-filters{display:none}
.galerij .gallery-query{font-size:13px;margin:-6px 0 22px}.galerij .gallery-query a{display:inline-flex;align-items:center;min-height:44px}.galerij .gallery-query a,.galerij .gallery-empty a{color:var(--ink);text-underline-offset:4px}
.galerij .gallery-empty{padding:65px 0 100px;min-height:300px}.galerij .gallery-empty h3{font-size:24px;font-weight:500;margin:0 0 12px}.galerij .gallery-empty p{color:var(--muted);margin-bottom:20px}.galerij .gallery-empty a{display:inline-block;margin:0 24px 12px 0;min-height:44px}
.galerij .galerij-voet{margin:48px 0 0;font-size:12px;color:var(--muted)}
.galerij .gallery-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:1279px){.template-gallery-page .galerij{padding-inline:30px}.galerij .gallery-layout{grid-template-columns:180px minmax(0,1fr);gap:28px}.galerij .raster{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 24px}}
@media(max-width:899px){.galerij .gallery-layout{display:block}.galerij .gallery-sidebar{display:none}.galerij .gallery-mobile-filters{display:block;margin-bottom:30px;border-block:1px solid var(--lijn)}.galerij .gallery-mobile-filters summary{cursor:pointer;min-height:56px;padding:16px 0;font-size:14px}.galerij .gallery-mobile-filters summary span{float:right;color:var(--muted);max-width:56%;text-align:right}.galerij .gallery-mobile-filters .gallery-niches{padding:8px 0 18px}.galerij .gallery-niches a{min-height:44px;padding:12px 0;font-size:15px}.galerij .gallery-niches a:first-child{margin-bottom:6px}.galerij .gallery-toolbar{margin-bottom:28px}.galerij .galerij-kop h1{font-size:48px;letter-spacing:-2px}.galerij .galerij-kop{margin-bottom:28px}}
@media(max-width:599px){.template-gallery-page .galerij{padding:30px 20px 64px}.galerij .galerij-kop h1{font-size:36px;letter-spacing:-1.5px;line-height:1.08;margin-bottom:24px}.galerij .galerij-kop>p:not(.gallery-eyebrow){font-size:14px;margin-bottom:26px}.galerij .gallery-search input[type=search]{font-size:14px}.galerij .gallery-toolbar{gap:12px;font-size:12px}.galerij .gallery-toolbar>a{font-size:11px;gap:8px;padding:8px}.galerij .gallery-results>h2{font-size:21px}.galerij .raster{grid-template-columns:minmax(0,1fr);gap:32px}.galerij .gallery-mobile-filters summary{font-size:12px}.galerij .tpreview{display:inline-flex;align-items:center;min-height:32px}.galerij .tmeta{margin-top:10px}}

/* A quiet editorial introduction; the collection remains the main event. */
.galerij .galerij-kop .gallery-eyebrow{font:500 11px/1.4 'Inter',sans-serif;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin:0 0 18px}
.galerij .galerij-kop h1 em{font-family:Georgia,'Times New Roman',serif;font-weight:400;letter-spacing:-1.8px;color:#245b46}
html[data-theme=dark] .galerij .galerij-kop h1 em{color:#a8d7b5}
@media(max-width:599px){.galerij .galerij-kop .gallery-eyebrow{margin-bottom:14px}.galerij .galerij-kop h1 em{letter-spacing:-1px}}

/* Wide "Design it for me" banner after the first row, like Squarespace's Blueprint AI tile: desktop only. */
.galerij .gallery-promo{display:none}
@media(min-width:1280px){
.galerij .gallery-promo{display:block;grid-column:1/-1}
.galerij .gpromo{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:375px;overflow:hidden;border-radius:8px;color:#fff;background:#1d1b19 url('/static/self-build/niche/creative_studio/09.webp') center 60%/cover}
.galerij .gpromo::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#0f0e0dd9 0%,#0f0e0d99 50%,#0f0e0d4d 100%)}
.galerij .gpromo-tekst{position:relative;display:flex;flex-direction:column;align-items:flex-start;padding:44px 44px 44px;max-width:560px}
.galerij .gpromo h3{font:400 clamp(26px,2.1vw,32px)/1.08 'Inter',sans-serif;letter-spacing:-.6px;margin:0 0 20px}
.galerij .gpromo p{font-size:clamp(15px,1.15vw,17px);line-height:1.45;margin:0 0 28px;color:#f3f1ee}
.galerij .gpromo-knop{display:inline-flex;align-items:center;gap:14px;margin-top:auto;min-height:54px;padding:0 22px;background:#fff;color:#111;font:500 12px/1 'Inter',sans-serif;letter-spacing:.08em;text-transform:uppercase;text-decoration:none}
.galerij .gpromo-knop svg{width:20px;height:20px;fill:currentColor}
.galerij .gpromo-knop:hover{background:#ecebe8}
.galerij .gpromo-knop:focus-visible{outline:2px solid #fff;outline-offset:4px}
.galerij .gpromo-collage{position:relative;font-family:Georgia,'Times New Roman',serif;color:#1b1a17}
.galerij .gpromo-frame{position:absolute;left:14%;right:5%;top:44px;bottom:-1px;border:1px solid #ffffff40;border-bottom:0;border-radius:6px 6px 0 0;background:#ffffff1f;backdrop-filter:blur(2px)}
.galerij .gpromo-frame i{position:absolute;top:16px;height:8px;border-radius:2px;background:#ffffff40}
.galerij .gpromo-frame i:first-child{left:14px;width:56px}.galerij .gpromo-frame i:last-child{right:14px;width:84px}
.galerij .gpromo-koppen{position:absolute;left:0;top:74px;display:grid;gap:7px;width:118px;padding:7px;background:#fff;border-radius:3px;box-shadow:0 10px 30px -10px #0008}
.galerij .gpromo-koppen b{display:block;padding:8px 9px;background:#efedea;font-weight:400;font-size:13px;line-height:1.1}
.galerij .gpromo-koppen b:last-child{font-size:15px}
.galerij .gpromo-koppen small{display:block;margin-top:3px;font:400 6px/1.2 Georgia,serif}
.galerij .gpromo-paletten{position:absolute;left:-2%;bottom:30px;display:grid;gap:7px;padding:8px;background:#fff;border-radius:3px;box-shadow:0 10px 30px -10px #0008}
.galerij .gpromo-paletten>span{display:flex;border:1px solid #0001;border-radius:2px;overflow:hidden}
.galerij .gpromo-paletten i{width:22px;height:17px}
.galerij .gpromo-pagina{position:absolute;right:9%;top:96px;display:grid;grid-template-columns:46% 1fr;align-items:center;gap:8%;width:56%;padding:9px;background:#fff;border-radius:3px;box-shadow:0 18px 40px -14px #0009}
.galerij .gpromo-pagina img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;display:block}
.galerij .gpromo-pagina b{display:block;font-weight:400;font-size:clamp(14px,1.15vw,18px);line-height:1.05;margin-bottom:8px}
.galerij .gpromo-pagina small{display:block;font:400 6.5px/1.35 'Inter',sans-serif;color:#555;margin-bottom:10px;max-width:120px}
.galerij .gpromo-pagina i{display:inline-block;padding:3px 9px;border-radius:9px;background:#1b1a17;color:#fff;font:500 6px/1.2 'Inter',sans-serif}
}

/* Further wide tiles further down the collection; same frame, own colour and collage. */
@media(min-width:1280px){
.galerij .gpromo-licht{background:#efe9df;color:#1b1a17}
.galerij .gpromo-licht::before,.galerij .gpromo-video::before,.galerij .gpromo-domein::before{display:none}
.galerij .gpromo-licht p{color:#3d3a35}
.galerij .gpromo-licht .gpromo-knop{background:#1b1a17;color:#fff}.galerij .gpromo-licht .gpromo-knop:hover{background:#3a3833}
.galerij .gpromo-licht .gpromo-knop:focus-visible{outline-color:#1b1a17}
.galerij .gpromo-waaier img{position:absolute;width:62%;height:auto;aspect-ratio:8/5;object-fit:cover;border-radius:4px;box-shadow:0 18px 40px -16px #0007;border:1px solid #0000000f}
.galerij .gpromo-waaier img:nth-child(1){left:2%;top:84px;transform:rotate(-6deg)}
.galerij .gpromo-waaier img:nth-child(2){left:19%;top:60px;z-index:1}
.galerij .gpromo-waaier img:nth-child(3){left:35%;top:92px;transform:rotate(5deg)}
.galerij .gpromo-label{position:absolute;z-index:2;left:22%;top:34px;padding:6px 10px;background:#1b1a17;color:#fff;border-radius:999px;font:500 11px/1.2 'Inter',sans-serif}
.galerij .gpromo-video{background:#141a24;height:375px}
.galerij .gpromo-video p{color:#d6dbe4}
.galerij .gpromo-films{display:grid;grid-template-columns:1.9fr 1fr;grid-template-rows:1fr 1fr;gap:12px;padding:40px 44px 40px 0}
.galerij .gpromo-film{position:relative;display:block;overflow:hidden;border-radius:6px;background:#000;box-shadow:0 14px 30px -14px #000}
.galerij .gpromo-film.groot{grid-row:1/3}
.galerij .gpromo-film img{display:block;width:100%;height:100%;object-fit:cover;opacity:.85}
.galerij .gpromo-film i{position:absolute;left:50%;top:50%;width:40px;height:40px;margin:-20px 0 0 -20px;border-radius:50%;background:#fff}
.galerij .gpromo-film.groot i{width:58px;height:58px;margin:-29px 0 0 -29px}
.galerij .gpromo-film i::after{content:"";position:absolute;left:39%;top:30%;border-left:13px solid #141a24;border-block:8px solid transparent}
.galerij .gpromo-film.groot i::after{border-left-width:18px;border-block-width:11px}
.galerij .gpromo-domein{background:#1f3a2e}
.galerij .gpromo-domein p{color:#dce8e0}
.galerij .gpromo-transfer{display:flex;align-items:center;justify-content:center;padding:36px 44px 36px 0;font-family:'Inter',sans-serif}
.galerij .gpromo-kaart{display:block;width:min(100%,400px);padding:26px;background:#fff;border-radius:8px;box-shadow:0 22px 50px -20px #000a;color:#1b1a17}
.galerij .gpromo-kaart>b{display:block;font-size:18px;font-weight:500;letter-spacing:-.3px;margin-bottom:14px}
.galerij .gpromo-veld{display:flex;justify-content:space-between;align-items:center;padding:6px 6px 6px 12px;border:1px solid #d9d6d0;border-radius:5px;font-size:13px;color:#555;margin-bottom:18px}
.galerij .gpromo-veld i{font-style:normal;padding:7px 12px;border-radius:4px;background:#1f3a2e;color:#fff;font-size:12px}
.galerij .gpromo-kaart ol{list-style:none;margin:0;padding:0;display:grid;gap:10px;font-size:13px}
.galerij .gpromo-kaart ol li{display:flex;align-items:center;gap:10px}
.galerij .gpromo-kaart em{display:inline-grid;place-items:center;flex:none;width:22px;height:22px;border-radius:50%;background:#e4eee7;color:#1f3a2e;font:600 11px/1 'Inter',sans-serif}
}

/* Hover steps through the whole template: slide .7s, pause, next part. */
.galerij .tbeeld{position:relative}
.galerij .tbeeld .tvol{position:absolute;left:0;top:0;width:100%;height:auto;object-fit:fill;transition:translate .8s ease-in-out}
.galerij .tbeeld.schuift .tvol{translate:0 var(--reis);transition:translate .7s cubic-bezier(.65,0,.35,1)}
@media(prefers-reduced-motion:reduce){.galerij .tbeeld .tvol{display:none}}
