/* Pottenbakkerij Steengoed (ambacht B)
   Skelet: N5 transparante kop over foto · H12 kom van bovenaf in het midden · R2 redactionele kolommen.
   Kleuren uit de glazuren: haverwit, klei, tenmoku, ijzerrood, celadon. */

body.s-ambacht-b {
  --klei: #f3ece2; --klei2: #ebe2d4; --papier: #faf6ef; --inkt: #2b201a; --inkt2: #5a4a3f;
  --rood: #9a4a2c; --rood-d: #7d3a21; --tenmoku: #2e1d16; --celadon: #a9bba9; --celadon-l: #e1e7de; --celadon-d: #46604c;
  --haver: #e6dccb; --lijn: #d6c8b4; --kop-h: 104px;
  --a: #9a4a2c; --a2: #a9bba9; --bg2: #e9dfd1; --img-r: 0;
  --serif: "Young Serif", Georgia, serif; --cursief: "Instrument Serif", Georgia, serif; --sans: "Instrument Sans", system-ui, sans-serif;
  background: var(--papier); color: var(--inkt); font: 400 17px/1.7 var(--sans);
  -webkit-font-smoothing: antialiased; overflow-x: hidden;
}
body.s-ambacht-b *, body.s-ambacht-b *::before, body.s-ambacht-b *::after { box-sizing: border-box; }
body.s-ambacht-b a { color: inherit; }
body.s-ambacht-b h1, body.s-ambacht-b h2, body.s-ambacht-b h3 { font-family: var(--serif); font-weight: 400; letter-spacing: -.012em; margin: 0; text-wrap: balance; }
body.s-ambacht-b p { margin: 0 0 1em; }
body.s-ambacht-b ul, body.s-ambacht-b ol { margin: 0; padding: 0; list-style: none; }
body.s-ambacht-b figure { margin: 0; }
body.s-ambacht-b .sg-w { width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 40px; }
body.s-ambacht-b .noot { font-size: 14px; color: var(--inkt2); margin-top: 14px; }
body.s-ambacht-b .ph { min-height: 0; }
body.s-ambacht-b .ph-cap { font-family: var(--sans); }
body.s-ambacht-b figcaption { font: italic 400 16px/1.4 var(--cursief); color: var(--inkt2); margin-top: 12px; }

/* Knoppen: rechthoekig, kapitalen; leeslink zoals "lees verder" in een tijdschrift */
body.s-ambacht-b .sg-knop { display: inline-block; background: var(--rood); color: #fff; text-decoration: none; border: 1.5px solid var(--rood); cursor: pointer;
  font: 600 13px/1 var(--sans); letter-spacing: .16em; text-transform: uppercase; padding: 18px 28px; border-radius: 0; transition: background .2s, color .2s; }
body.s-ambacht-b .sg-knop:hover { background: var(--rood-d); border-color: var(--rood-d); }
body.s-ambacht-b .sg-knop.licht { background: transparent; color: #fff; border-color: #ffffffb0; }
body.s-ambacht-b .sg-knop.licht:hover { background: #fff; color: var(--tenmoku); }
body.s-ambacht-b .leeslink { font: italic 400 21px/1.3 var(--cursief); text-decoration: none; border-bottom: 1.5px solid var(--rood); padding-bottom: 2px; white-space: nowrap; }
body.s-ambacht-b .leeslink:hover { color: var(--rood); }
body.s-ambacht-b .leeslink.licht { color: #fff; border-color: #f0b597; }
body.s-ambacht-b .leeslink.licht:hover { color: #f0b597; }

/* ── Kop: transparant over de foto ── */
body.s-ambacht-b .sg-kop { position: relative; z-index: 70; height: var(--kop-h); color: #fff; }
body.s-ambacht-b main > :first-child { margin-top: calc(-1 * var(--kop-h)); }
body.s-ambacht-b .kop-balk { display: flex; align-items: center; gap: 36px; height: 100%; }
body.s-ambacht-b .merk { display: flex; align-items: center; gap: 12px; text-decoration: none; color: #fff; flex-shrink: 0; }
body.s-ambacht-b .merk-vorm { width: 44px; height: 44px; stroke-width: 3; color: #f0b597; }
body.s-ambacht-b .merk-naam { font: 400 29px/1 var(--serif); display: flex; flex-direction: column; text-shadow: 0 1px 12px #0004; }
body.s-ambacht-b .merk-naam small { font: 600 10px/1 var(--sans); letter-spacing: .26em; text-transform: uppercase; margin-top: 7px; color: #f3e6d6; }
body.s-ambacht-b .hoofdmenu { margin-left: auto; display: flex; align-items: center; gap: 34px; }
body.s-ambacht-b .hoofdmenu ul { display: flex; gap: 28px; }
body.s-ambacht-b .hoofdmenu ul a { text-decoration: none; font-size: 15.5px; font-weight: 600; padding: 6px 0; border-bottom: 1.5px solid transparent; text-shadow: 0 1px 10px #0005; }
body.s-ambacht-b .hoofdmenu ul a:hover, body.s-ambacht-b .hoofdmenu ul a[aria-current] { border-color: #f0b597; }
body.s-ambacht-b .menu-onder { display: flex; align-items: center; gap: 24px; }
body.s-ambacht-b .kop-site { font: italic 400 18px/1 var(--cursief); text-decoration: none; border-bottom: 1px solid #ffffff80; padding-bottom: 2px; white-space: nowrap; }
body.s-ambacht-b .kop-site:hover, body.s-ambacht-b .kop-site[aria-current] { border-color: #f0b597; color: #f0b597; }
body.s-ambacht-b .menu-onder .sg-knop { padding: 13px 18px; font-size: 12px; }
body.s-ambacht-b .menu-tel, body.s-ambacht-b .menu-schakel, body.s-ambacht-b .menu-knop { display: none; }

/* ── Hero: foto vol in beeld, kom in het midden, letters eromheen ── */
body.s-ambacht-b .hero { position: relative; min-height: max(820px, 100vh); display: flex; align-items: center; color: #fff; overflow: hidden; background: var(--tenmoku); }
body.s-ambacht-b .hero-foto { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
body.s-ambacht-b .hero-waas, body.s-ambacht-b .pk-waas { position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(60% 55% at 50% 52%, #2e1d16a8, #2e1d16d0 70%), linear-gradient(#2e1d16cc, transparent 22%); }
body.s-ambacht-b .hero .hero-inhoud { position: relative; text-align: center; padding-top: calc(var(--kop-h) + 30px); padding-bottom: 70px; }
body.s-ambacht-b .hero-boven { font: 600 12px/1.3 var(--sans); letter-spacing: .3em; text-transform: uppercase; color: #f0d6c4; margin-bottom: 26px; }
body.s-ambacht-b .hero-kern { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 36px; }
body.s-ambacht-b .hero-kern h1 { display: contents; }
body.s-ambacht-b .h-l, body.s-ambacht-b .h-r { font: 400 clamp(38px, 4.3vw, 60px)/1.05 var(--serif); letter-spacing: -.02em; grid-row: 1; text-wrap: balance; }
body.s-ambacht-b .h-l { grid-column: 1; text-align: right; }
body.s-ambacht-b .h-r { grid-column: 3; text-align: left; color: #f3c3a6; }
body.s-ambacht-b .komring { grid-column: 2; grid-row: 1; position: relative; width: 420px; aspect-ratio: 1; display: grid; place-items: center; }
body.s-ambacht-b .ring { position: absolute; inset: 0; width: 100%; height: 100%; animation: sg-draai 90s linear infinite; }
body.s-ambacht-b .ring text { font: 600 13px var(--sans); letter-spacing: .2em; fill: #f3e6d6; }
@keyframes sg-draai { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { body.s-ambacht-b .ring { animation: none; } }
body.s-ambacht-b .kb-kom { display: block; width: 74%; aspect-ratio: 1; border-radius: 50%;
  background:
    radial-gradient(circle at 31% 27%, #3d2b1fbb 0 1px, transparent 1.6px) 0 0 / 47px 53px,
    radial-gradient(circle at 67% 71%, #3d2b1fbb 0 1.4px, transparent 2px) 7px 4px / 71px 61px,
    radial-gradient(circle at 52% 18%, #3d2b1f99 0 .9px, transparent 1.4px) 3px 13px / 29px 37px,
    radial-gradient(circle at 12% 88%, #3d2b1f88 0 .8px, transparent 1.3px) 19px 5px / 43px 31px,
    repeating-radial-gradient(circle at 50% 50%, #ffffff12 0 2px, transparent 2px 9px, #00000010 9px 10px, transparent 10px 15px),
    radial-gradient(circle closest-side, #6f8c78 0, #8aa591 26%, #a8bca8 58%, #bccbb8 82%, #9d8a6c 87.5%, #7a5a3f 89.5%, #d6c3a4 92.5%, #e2d3b8 96%, #c2ab8c 100%);
  box-shadow: 0 40px 60px -24px #000c, 0 8px 14px -6px #0008; }
body.s-ambacht-b .hero-lead { max-width: 560px; margin: 34px auto 0; font-size: 19px; color: #f1e7da; }
body.s-ambacht-b .hero-acties { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 18px 34px; margin-top: 32px; }
body.s-ambacht-b .hero-label { margin: 46px 0 0; font: italic 400 16px/1.3 var(--cursief); color: #d9c8b5; }

/* ── Rubriek: dubbele lijn, rubrieknaam, kop en inleiding ── */
body.s-ambacht-b .sg-sec { padding: 104px 0; }
body.s-ambacht-b .rubriek { margin-bottom: 48px; max-width: 820px; }
body.s-ambacht-b .rb-naam { margin: 0 0 22px; border-top: 4px double var(--inkt); padding-top: 12px; font: 600 12px/1.3 var(--sans); letter-spacing: .22em; text-transform: uppercase; color: var(--rood); }
body.s-ambacht-b .rubriek h2, body.s-ambacht-b .rubriek h1 { font-size: clamp(34px, 4.2vw, 56px); line-height: 1.06; }
body.s-ambacht-b .standfirst { font: italic 400 clamp(21px, 2vw, 26px)/1.4 var(--cursief); color: var(--inkt2); margin: 20px 0 0; max-width: 680px; }
body.s-ambacht-b .rubriek.licht .rb-naam { border-color: #e6dccb; color: #f0b597; }
body.s-ambacht-b .rubriek.licht h2 { color: #fff; }
body.s-ambacht-b .rubriek.licht .standfirst { color: #d9cdbb; }

/* Kolommen, initiaal, citaat */
body.s-ambacht-b .kolommen { columns: 2; column-gap: 56px; column-rule: 1px solid var(--lijn); }
body.s-ambacht-b .kolommen.drie { columns: 3; }
body.s-ambacht-b .kolommen > * { break-inside: avoid; }
body.s-ambacht-b .kolommen a { text-decoration-color: var(--rood); text-decoration-thickness: 1.5px; text-underline-offset: 4px; }
body.s-ambacht-b .initiaal::first-letter { float: left; font: 400 5.1em/.82 var(--serif); color: var(--rood); margin: 6px 12px 0 0; }
body.s-ambacht-b .citaat { column-span: all; margin: 26px 0 34px; padding: 26px 0; border-top: 1px solid var(--rood); border-bottom: 1px solid var(--rood);
  font: italic 400 clamp(26px, 3vw, 38px)/1.25 var(--cursief); color: var(--inkt); text-align: center; text-wrap: balance; }
body.s-ambacht-b .citaat cite { display: block; margin-top: 12px; font: 600 11.5px/1.3 var(--sans); font-style: normal; letter-spacing: .2em; text-transform: uppercase; color: var(--rood); }
body.s-ambacht-b .citaat.klein { font-size: 25px; text-align: left; padding: 18px 0; }

/* ── Home: opening ── */
body.s-ambacht-b .opening .sg-w { position: relative; }
body.s-ambacht-b .opening .kolommen { max-width: 900px; }
body.s-ambacht-b .marge-vormen { position: absolute; right: 40px; top: 210px; display: grid; gap: 26px; }
body.s-ambacht-b .marge-vormen svg { width: 92px; height: 92px; color: var(--rood); opacity: .8; }

/* Glazuren */
body.s-ambacht-b .glazuren { background: var(--tenmoku); color: var(--haver); }
body.s-ambacht-b .proeven { display: grid; grid-template-columns: repeat(6, 1fr); gap: 26px; margin-bottom: 56px; }
body.s-ambacht-b .proeven figcaption { color: #cdbfac; font-size: 15.5px; margin-top: 14px; }
body.s-ambacht-b .proeven figcaption b { display: block; font: 400 21px/1.2 var(--serif); color: #fff; margin-bottom: 3px; }
body.s-ambacht-b .proef { --g1: #efe6d4; --g2: #d9cdb6; --sp: #3a281cd0; position: relative; display: block; width: 100%; aspect-ratio: 3 / 4; border-radius: 5px 5px 3px 3px; overflow: hidden;
  background:
    radial-gradient(circle at 13% 21%, var(--sp) 0 1.1px, transparent 1.7px) 0 0 / 37px 43px,
    radial-gradient(circle at 71% 64%, var(--sp) 0 1.5px, transparent 2.1px) 5px 9px / 53px 47px,
    radial-gradient(circle at 42% 83%, var(--sp) 0 .9px, transparent 1.4px) 11px 3px / 29px 31px,
    radial-gradient(circle at 88% 12%, var(--sp) 0 .8px, transparent 1.3px) 17px 21px / 41px 23px,
    radial-gradient(90% 60% at 50% 100%, #00000026, transparent 70%),
    linear-gradient(170deg, var(--g1) 0%, var(--g2) 100%);
  box-shadow: inset 0 0 0 1px #ffffff14, 0 18px 30px -18px #000; }
body.s-ambacht-b .proef::before { content: ""; position: absolute; inset: auto 0 0 0; height: 22%;
  background: radial-gradient(circle at 40% 40%, #6b513b 0 1px, transparent 1.6px) 0 0 / 14px 12px, linear-gradient(#cdb89c, #c3ad90);
  border-top: 2px solid color-mix(in srgb, var(--g2) 70%, #000); }
body.s-ambacht-b .proef::after { content: ""; position: absolute; inset: 0; background: radial-gradient(120% 70% at 30% 10%, #ffffff40, transparent 55%); pointer-events: none; }
body.s-ambacht-b .proef i { position: absolute; top: 12%; left: 50%; width: 12px; height: 12px; margin-left: -6px; border-radius: 50%; background: var(--tenmoku); box-shadow: inset 0 2px 2px #0008; }
body.s-ambacht-b .proef-haverwit { --g1: #f3ebdc; --g2: #ddd0b9; }
body.s-ambacht-b .proef-celadon { --g1: #c5d3c0; --g2: #8fa794; }
body.s-ambacht-b .proef-ijzerrood { --g1: #b4603b; --g2: #7e3a20; }
body.s-ambacht-b .proef-tenmoku { --g1: #6a3f26; --g2: #1d120d; --sp: #c98a5a99; }
body.s-ambacht-b .proef-as { --g1: #b9b89d; --g2: #7f8169; }
body.s-ambacht-b .proef-kobalt { --g1: #3e5585; --g2: #1d2847; --sp: #d9e0ee55; }
body.s-ambacht-b .gl-tekst { max-width: 680px; font-size: 18px; color: #e2d6c4; }
body.s-ambacht-b .gl-tekst p { margin-bottom: 26px; }

/* Agenda */
body.s-ambacht-b .lessen { background: var(--klei); }
body.s-ambacht-b .les-rooster { display: grid; grid-template-columns: 7fr 5fr; gap: 72px; align-items: start; }
body.s-ambacht-b .les-beeld { margin-top: 120px; }
body.s-ambacht-b .les-foto { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }
body.s-ambacht-b .agenda { border-top: 1px solid var(--inkt); }
body.s-ambacht-b .ag-rij { display: grid; grid-template-columns: 150px 1fr auto; gap: 20px; align-items: baseline; padding: 20px 0; border-bottom: 1px solid var(--lijn); }
body.s-ambacht-b .ag-datum { font: italic 400 22px/1.2 var(--cursief); color: var(--rood); }
body.s-ambacht-b .ag-wat b { display: block; font: 400 20px/1.3 var(--serif); }
body.s-ambacht-b .ag-wat small { font-size: 14px; color: var(--inkt2); }
body.s-ambacht-b .ag-plek { font: 600 11.5px/1.3 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--celadon-d); white-space: nowrap; }
body.s-ambacht-b .ag-rij.bijna .ag-plek { color: var(--rood); }
body.s-ambacht-b .ag-rij.vol .ag-plek, body.s-ambacht-b .ag-rij.vol .ag-wat b { color: var(--inkt2); }
body.s-ambacht-b .ag-rij.vol .ag-wat b { text-decoration: line-through; text-decoration-color: var(--lijn); }
body.s-ambacht-b .les-voet { margin-top: 30px; color: var(--inkt2); display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; }

/* Horeca */
body.s-ambacht-b .breed-beeld { margin-bottom: 64px; }
body.s-ambacht-b .breed-foto { width: 100%; aspect-ratio: 21 / 9; object-fit: cover; }
body.s-ambacht-b .hor-rooster { display: grid; grid-template-columns: 4fr 5fr 3fr; gap: 48px; align-items: start; }
body.s-ambacht-b .hor-rooster .rubriek h2 { font-size: clamp(32px, 3.4vw, 46px); }
body.s-ambacht-b .kolommen.smal { columns: 1; }
body.s-ambacht-b .keukens { font: italic 400 21px/1.45 var(--cursief); color: var(--inkt); border-top: 1px solid var(--lijn); padding-top: 16px; }
body.s-ambacht-b .kader { background: var(--celadon-l); padding: 28px 26px 30px; border-top: 4px double var(--celadon-d); }
body.s-ambacht-b .kader-kop { font: 600 12px/1.3 var(--sans); letter-spacing: .2em; text-transform: uppercase; color: var(--celadon-d); margin-bottom: 12px; }
body.s-ambacht-b .kader li { display: flex; flex-direction: column; padding: 10px 0; border-bottom: 1px solid #c3cfbf; font-size: 15px; }
body.s-ambacht-b .kader li b { font-weight: 600; color: var(--inkt); }
body.s-ambacht-b .kader li span { color: var(--inkt2); }
body.s-ambacht-b .kader .leeslink, body.s-ambacht-b .kader .sg-knop { margin-top: 22px; }
body.s-ambacht-b .kader-noot { font-size: 14px; color: var(--inkt2); margin: 12px 0 0; }

/* Interview */
body.s-ambacht-b .interview { background: var(--klei); }
body.s-ambacht-b .iv-rooster { display: grid; grid-template-columns: 5fr 6fr; gap: 72px; align-items: start; }
body.s-ambacht-b .iv-foto { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; }
body.s-ambacht-b .iv-beeld { position: sticky; top: 40px; }
body.s-ambacht-b .qa { margin-bottom: 26px; }
body.s-ambacht-b .qa .vraag { font: 400 20px/1.35 var(--serif); color: var(--rood); margin-bottom: 6px; }
body.s-ambacht-b .qa p:not(.vraag) { color: var(--inkt2); }
body.s-ambacht-b .interview .citaat.klein { margin: 10px 0 30px; }

/* Praktisch */
body.s-ambacht-b .praktisch { background: var(--rood); color: #fbefe7; padding: 84px 0; }
body.s-ambacht-b .pr-rooster { display: grid; grid-template-columns: 5fr 4fr 4fr; gap: 56px; align-items: start; }
body.s-ambacht-b .praktisch .rb-naam { border-color: #fbd9c6; color: #fbd9c6; }
body.s-ambacht-b .praktisch h2 { font-size: clamp(30px, 3vw, 40px); line-height: 1.12; color: #fff; margin-bottom: 16px; }
body.s-ambacht-b .praktisch .sg-knop { background: var(--papier); color: var(--rood-d); border-color: var(--papier); margin-top: 8px; }
body.s-ambacht-b .praktisch .sg-knop:hover { background: #fff; }
body.s-ambacht-b .praktisch .tijden div, body.s-ambacht-b .praktisch .adres li { border-color: #ffffff3a; }
body.s-ambacht-b .praktisch .tijden dt, body.s-ambacht-b .praktisch .adres span { color: #fbd9c6; }

/* tijden + adres */
body.s-ambacht-b .tijden { margin: 0; }
body.s-ambacht-b .tijden div, body.s-ambacht-b .adres li { display: grid; grid-template-columns: 1fr; padding: 11px 0; border-bottom: 1px solid var(--lijn); }
body.s-ambacht-b .tijden div:first-child, body.s-ambacht-b .adres li:first-child { border-top: 1px solid var(--lijn); }
body.s-ambacht-b .praktisch .tijden div:first-child, body.s-ambacht-b .praktisch .adres li:first-child { border-top-color: #ffffff3a; }
body.s-ambacht-b .tijden dt, body.s-ambacht-b .adres span { font: 600 11.5px/1.6 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--inkt2); }
body.s-ambacht-b .tijden dd { margin: 0; }
body.s-ambacht-b .adres a { text-decoration: none; }
body.s-ambacht-b .adres a:hover { text-decoration: underline; }

/* ── Voet: plank met vormen + colofon ── */
body.s-ambacht-b .sg-voet { background: var(--tenmoku); color: #e2d6c4; font-size: 15.5px; }
body.s-ambacht-b .voet-plank { padding-top: 64px; }
body.s-ambacht-b .plank { display: flex; align-items: flex-end; gap: 2%; border-bottom: 2px solid #6e4c3a; }
body.s-ambacht-b .plank-vorm { flex: 1; height: auto; max-height: 104px; color: #c79a80; stroke-width: 1.7; margin-bottom: -8px; }
body.s-ambacht-b .voet-colofon { text-align: center; padding-top: 56px; }
body.s-ambacht-b .voet-naam { font: 400 clamp(56px, 9vw, 120px)/1 var(--serif); color: #fff; margin: 0 0 10px; letter-spacing: -.03em; }
body.s-ambacht-b .voet-motto { font: italic 400 22px/1.4 var(--cursief); color: #d9c8b5; margin-bottom: 48px; }
body.s-ambacht-b .voet-kolommen { display: grid; grid-template-columns: repeat(3, 1fr); gap: 48px; text-align: left; border-top: 4px double #6e4c3a; padding-top: 34px; padding-bottom: 46px; }
body.s-ambacht-b .voet-kop { font: 600 11.5px/1.3 var(--sans); letter-spacing: .2em; text-transform: uppercase; color: #f0b597; margin-bottom: 14px; }
body.s-ambacht-b .voet-links li { margin-bottom: 7px; }
body.s-ambacht-b .voet-links a { text-decoration: none; }
body.s-ambacht-b .voet-links a:hover { color: #fff; text-decoration: underline; text-underline-offset: 4px; }
body.s-ambacht-b .sg-voet .tijden div, body.s-ambacht-b .sg-voet .adres li { border-color: #ffffff1f; padding: 8px 0; }
body.s-ambacht-b .sg-voet .tijden dt, body.s-ambacht-b .sg-voet .adres span { color: #b9a894; }
body.s-ambacht-b .voet-onder { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px 30px; padding: 22px 0 28px; border-top: 1px solid #ffffff1f; font-size: 13px; color: #b9a894; text-align: left; }
body.s-ambacht-b .voet-onder a { color: #f0b597; }

/* ── Paginakop van subpagina's: foto, waas, vorm en titel in het midden ── */
body.s-ambacht-b .paginakop { position: relative; min-height: 560px; display: flex; align-items: center; color: #fff; text-align: center; overflow: hidden; background: var(--tenmoku); }
body.s-ambacht-b .pk-foto { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
body.s-ambacht-b .paginakop .pk-midden { position: relative; padding-top: calc(var(--kop-h) + 20px); padding-bottom: 72px; max-width: 900px; }
body.s-ambacht-b .pk-schijf { display: inline-grid; place-items: center; width: 112px; height: 112px; border-radius: 50%; border: 1px solid #ffffff55; margin-bottom: 22px;
  background: repeating-radial-gradient(circle, #ffffff0d 0 1px, transparent 1px 7px); }
body.s-ambacht-b .pk-vorm { width: 66px; height: 66px; color: #f3c3a6; }
body.s-ambacht-b .kruimel { font: 600 11.5px/1.3 var(--sans); letter-spacing: .2em; text-transform: uppercase; color: #e6d3c2; margin-bottom: 18px !important; }
body.s-ambacht-b .kruimel a { text-decoration: none; }
body.s-ambacht-b .kruimel a:hover { text-decoration: underline; }
body.s-ambacht-b .paginakop h1 { font-size: clamp(38px, 5vw, 66px); line-height: 1.05; margin-bottom: 18px; }
body.s-ambacht-b .pk-stand { font: italic 400 clamp(20px, 2vw, 25px)/1.4 var(--cursief); color: #f1e7da; max-width: 640px; margin: 0 auto; }

/* ── Diensten ── */
body.s-ambacht-b .inhoud-lijst { background: var(--klei); border-bottom: 1px solid var(--lijn); }
body.s-ambacht-b .inhoud-lijst ul { display: grid; grid-template-columns: repeat(4, 1fr); }
body.s-ambacht-b .inhoud-lijst a { display: grid; grid-template-columns: 44px 1fr; gap: 2px 14px; align-items: center; padding: 26px 20px; text-decoration: none; border-left: 1px solid var(--lijn); height: 100%; }
body.s-ambacht-b .inhoud-lijst li:first-child a { border-left: 0; padding-left: 0; }
body.s-ambacht-b .inhoud-lijst span { font: 400 19px/1.2 var(--serif); }
body.s-ambacht-b .inhoud-lijst small { grid-column: 2; font-size: 13.5px; color: var(--inkt2); line-height: 1.4; }
body.s-ambacht-b .inhoud-lijst a:hover span { color: var(--rood); }
body.s-ambacht-b .io-vorm { width: 44px; height: 44px; color: var(--rood); grid-row: span 2; stroke-width: 2.6; }
body.s-ambacht-b .dienst { scroll-margin-top: 40px; }
body.s-ambacht-b .dienst + .dienst { border-top: 1px solid var(--lijn); }
body.s-ambacht-b .dienst:nth-of-type(even) { background: var(--klei); }
body.s-ambacht-b .dienst-kop { position: relative; max-width: 860px; margin-bottom: 40px; padding-right: 120px; }
body.s-ambacht-b .dienst-kop h2 { font-size: clamp(32px, 4vw, 52px); line-height: 1.08; }
body.s-ambacht-b .dienst-vorm { position: absolute; right: 0; top: 30px; width: 96px; height: 96px; color: var(--rood); }
body.s-ambacht-b .dienst-beeld { margin-bottom: 52px; }
body.s-ambacht-b .dienst-foto { width: 100%; aspect-ratio: 2.4 / 1; object-fit: cover; }
body.s-ambacht-b .dienst-rooster { display: grid; grid-template-columns: 7fr 4fr; gap: 64px; align-items: start; }
body.s-ambacht-b .dienst .initiaal { font-size: 19px; }
body.s-ambacht-b .kenmerken { display: grid; gap: 4px; margin-top: 8px; }
body.s-ambacht-b .kenmerken li { padding-left: 26px; position: relative; color: var(--inkt2); }
body.s-ambacht-b .kenmerken li::before { content: ""; position: absolute; left: 0; top: .72em; width: 14px; height: 1.5px; background: var(--rood); }
body.s-ambacht-b .dienst .kader li { flex-direction: row; justify-content: space-between; gap: 16px; }
body.s-ambacht-b .dienst .kader li b { white-space: nowrap; }
body.s-ambacht-b .proces { background: var(--klei2); }
body.s-ambacht-b .stappen p { margin-bottom: 18px; }
body.s-ambacht-b .stappen b { font: 400 21px/1.3 var(--serif); color: var(--rood); display: block; margin-bottom: 4px; }

/* ── Prijzen ── */
body.s-ambacht-b .pr-agenda .agenda { max-width: 960px; }
body.s-ambacht-b .lessen-sec { background: var(--klei); }
body.s-ambacht-b .les-item { margin-bottom: 34px; }
body.s-ambacht-b .les-item h3 { font-size: 23px; line-height: 1.2; margin-bottom: 4px; }
body.s-ambacht-b .li-meta { font-size: 14px; color: var(--inkt2); margin-bottom: 10px !important; padding-bottom: 10px; border-bottom: 1px solid var(--lijn); display: flex; justify-content: space-between; gap: 12px; }
body.s-ambacht-b .li-meta b { color: var(--rood); font-size: 16px; white-space: nowrap; }
body.s-ambacht-b .les-item p:last-child { color: var(--inkt2); }
body.s-ambacht-b .gr-rooster { display: grid; grid-template-columns: 7fr 5fr; gap: 72px; align-items: start; }
body.s-ambacht-b .gr-foto { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }
body.s-ambacht-b .prijsrijen { border-top: 1px solid var(--inkt); }
body.s-ambacht-b .prijsrijen li { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 20px 0; border-bottom: 1px solid var(--lijn); }
body.s-ambacht-b .prijsrijen b { display: block; font: 400 21px/1.3 var(--serif); }
body.s-ambacht-b .prijsrijen small { font-size: 14px; color: var(--inkt2); }
body.s-ambacht-b .prijsrijen em { font: italic 400 24px/1 var(--cursief); color: var(--rood); white-space: nowrap; }
body.s-ambacht-b .lijsten-sec { background: var(--celadon-l); }
body.s-ambacht-b .lijst-rooster { display: grid; grid-template-columns: 1fr 1fr; gap: 0; }
body.s-ambacht-b .prijslijst { padding: 10px 48px 10px 0; }
body.s-ambacht-b .prijslijst + .prijslijst { padding: 10px 0 10px 48px; border-left: 1px solid #c3cfbf; }
body.s-ambacht-b .lijst-vorm { width: 72px; height: 72px; color: var(--celadon-d); margin: 0 0 10px -6px; }
body.s-ambacht-b .prijslijst h2 { font-size: 32px; margin-bottom: 20px; }
body.s-ambacht-b .prijslijst li { display: flex; align-items: baseline; gap: 10px; padding: 9px 0; }
body.s-ambacht-b .prijslijst li i { flex: 1; border-bottom: 1.5px dotted #9fae9c; transform: translateY(-4px); }
body.s-ambacht-b .prijslijst li b { font-weight: 600; white-space: nowrap; }
body.s-ambacht-b .inbegrepen .kolommen p b { font-family: var(--serif); font-weight: 400; color: var(--rood); }

/* ── Over ons ── */
body.s-ambacht-b .verhaal .kolommen { max-width: 980px; }
body.s-ambacht-b .team-sec { background: var(--klei); }
body.s-ambacht-b .persoon { margin-bottom: 20px; }
body.s-ambacht-b .ps-vorm { width: 76px; height: 76px; color: var(--rood); margin: 0 0 12px -6px; }
body.s-ambacht-b .persoon h3 { font-size: 26px; }
body.s-ambacht-b .ps-rol { font: italic 400 19px/1.3 var(--cursief); color: var(--rood); margin: 4px 0 12px; }
body.s-ambacht-b .persoon p:last-child { color: var(--inkt2); }
body.s-ambacht-b .ft-rooster { display: grid; grid-template-columns: 7fr 4fr; gap: 56px; align-items: start; }
body.s-ambacht-b .ft-foto { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
body.s-ambacht-b .feiten .kader li { flex-direction: row; justify-content: space-between; gap: 14px; }
body.s-ambacht-b .feiten .kader li b { text-align: right; }

/* ── Contact ── */
body.s-ambacht-b .ct-rooster { display: grid; grid-template-columns: 5fr 6fr; gap: 72px; align-items: start; }
body.s-ambacht-b .ct-zij .rubriek h2 { font-size: clamp(30px, 3.2vw, 44px); }
body.s-ambacht-b .ct-tel { margin: 10px 0 26px; }
body.s-ambacht-b .ct-tel a { font: 400 38px/1 var(--serif); text-decoration: none; border-bottom: 2px solid var(--rood); }
body.s-ambacht-b .ct-tel a:hover { color: var(--rood); }
body.s-ambacht-b .ct-gegevens { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
body.s-ambacht-b .formulier { background: var(--klei); padding: 44px; border-top: 4px double var(--inkt); }
body.s-ambacht-b .formulier fieldset { border: 0; padding: 0; margin: 0 0 32px; min-width: 0; }
body.s-ambacht-b .formulier legend { font: 400 25px/1.2 var(--serif); padding: 0; margin-bottom: 18px; }
body.s-ambacht-b .formulier .velden { display: grid; grid-template-columns: 1fr 1fr; gap: 18px 20px; }
body.s-ambacht-b .formulier label { display: flex; flex-direction: column; gap: 7px; font: 600 11.5px/1.3 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--inkt2); min-width: 0; }
body.s-ambacht-b .formulier label.vol { grid-column: 1 / -1; }
body.s-ambacht-b .formulier input, body.s-ambacht-b .formulier select, body.s-ambacht-b .formulier textarea {
  font: 400 16px/1.4 var(--sans); color: var(--inkt); background: var(--papier); border: 0; border-bottom: 1.5px solid #b9a894; border-radius: 0; padding: 12px 4px; width: 100%; min-width: 0;
  text-transform: none; letter-spacing: 0; }
body.s-ambacht-b .formulier input:focus, body.s-ambacht-b .formulier select:focus, body.s-ambacht-b .formulier textarea:focus { outline: 2px solid var(--rood); outline-offset: 2px; }
body.s-ambacht-b .vragen-sec { background: var(--klei); }
body.s-ambacht-b .vragen .qa { margin-bottom: 22px; }

/* min-width voor alle roosters */
body.s-ambacht-b [class*="-rooster"] > * { min-width: 0; }
body.s-ambacht-b .ods-wrap h1 { margin-bottom: 20px; }

/* ── Tablet ── */
@media (max-width: 1100px) {
  body.s-ambacht-b .hoofdmenu, body.s-ambacht-b .hoofdmenu ul { gap: 20px; }
  body.s-ambacht-b .kop-site { display: none; }
  body.s-ambacht-b .komring { width: 340px; }
  body.s-ambacht-b .proeven { grid-template-columns: repeat(3, 1fr); }
  body.s-ambacht-b .marge-vormen { display: none; }
  body.s-ambacht-b .hor-rooster { grid-template-columns: 1fr 1fr; }
  body.s-ambacht-b .hor-rooster .rubriek { grid-column: 1 / -1; }
  body.s-ambacht-b .kolommen.drie { columns: 2; }
  body.s-ambacht-b .inhoud-lijst ul { grid-template-columns: 1fr 1fr; }
  body.s-ambacht-b .inhoud-lijst li:nth-child(3) a { border-left: 0; padding-left: 0; }
  body.s-ambacht-b .inhoud-lijst li:nth-child(n+3) a { border-top: 1px solid var(--lijn); }
}

/* ── Menu als overlay vanaf 980 ── */
@media (max-width: 980px) {
  body.s-ambacht-b { --kop-h: 84px; }
  body.s-ambacht-b .menu-knop { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; width: 56px; height: 52px; margin-left: auto; cursor: pointer; position: relative; z-index: 3; color: #fff; }
  body.s-ambacht-b .menu-knop span { display: block; width: 26px; height: 2px; background: currentColor; transition: transform .2s; }
  body.s-ambacht-b .menu-knop b { font: 600 10px/1 var(--sans); letter-spacing: .2em; text-transform: uppercase; margin-top: 3px; }
  body.s-ambacht-b .menu-schakel { display: block; position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
  body.s-ambacht-b .menu-schakel:focus-visible + .menu-knop { outline: 2px solid #f0b597; }
  body.s-ambacht-b .menu-schakel:checked + .menu-knop { position: fixed; top: 14px; right: 16px; }
  body.s-ambacht-b .menu-schakel:checked + .menu-knop span:first-child { transform: translateY(3.5px) rotate(45deg); }
  body.s-ambacht-b .menu-schakel:checked + .menu-knop span:nth-child(2) { transform: translateY(-3.5px) rotate(-45deg); }
  body.s-ambacht-b .hoofdmenu { display: none; position: fixed; inset: 0; z-index: 2; margin: 0; padding: 90px 28px 40px; background: var(--tenmoku); overflow-y: auto;
    flex-direction: column; align-items: stretch; gap: 0; }
  body.s-ambacht-b .menu-schakel:checked ~ .hoofdmenu { display: flex; }
  body.s-ambacht-b .hoofdmenu ul { flex-direction: column; gap: 0; }
  body.s-ambacht-b .hoofdmenu ul a { display: block; padding: 14px 0; font: 400 34px/1.15 var(--serif); border-bottom: 1px solid #ffffff22; text-shadow: none; }
  body.s-ambacht-b .hoofdmenu ul a[aria-current] { color: #f3c3a6; border-color: #ffffff22; }
  body.s-ambacht-b .menu-onder { flex-direction: column; align-items: flex-start; gap: 22px; margin-top: 30px; }
  body.s-ambacht-b .menu-onder .kop-site { display: inline-block; font-size: 22px; }
  body.s-ambacht-b .menu-tel { display: block; margin: 0; color: #d9c8b5; font-size: 15px; }
  body.s-ambacht-b .menu-tel a { color: #fff; font-weight: 600; }
}

/* ── Mobiel ── */
@media (max-width: 820px) {
  body.s-ambacht-b { font-size: 16.5px; }
  body.s-ambacht-b .sg-w { padding: 0 20px; }
  body.s-ambacht-b .sg-sec { padding: 72px 0; }
  body.s-ambacht-b .merk-naam { font-size: 25px; }
  body.s-ambacht-b .merk-naam small { font-size: 9px; letter-spacing: .2em; }
  body.s-ambacht-b .merk-vorm { width: 38px; height: 38px; }
  body.s-ambacht-b .hero { min-height: 0; }
  body.s-ambacht-b .hero .hero-inhoud { padding-bottom: 56px; }
  body.s-ambacht-b .hero-boven { font-size: 10.5px; letter-spacing: .22em; margin-bottom: 18px; }
  body.s-ambacht-b .hero-kern { grid-template-columns: 1fr; gap: 18px; justify-items: center; }
  body.s-ambacht-b .h-l, body.s-ambacht-b .h-r { grid-column: 1; text-align: center; font-size: 38px; }
  body.s-ambacht-b .h-l { grid-row: 1; }
  body.s-ambacht-b .komring { grid-column: 1; grid-row: 2; width: min(300px, 82vw); }
  body.s-ambacht-b .h-r { grid-row: 3; }
  body.s-ambacht-b .ring text { font-size: 15px; }
  body.s-ambacht-b .hero-lead { font-size: 17px; margin-top: 22px; }
  body.s-ambacht-b .hero-label { margin-top: 30px; }
  body.s-ambacht-b .rubriek { margin-bottom: 34px; }
  body.s-ambacht-b .kolommen, body.s-ambacht-b .kolommen.drie { columns: 1; }
  body.s-ambacht-b .citaat { font-size: 25px; }
  body.s-ambacht-b .proeven { grid-template-columns: repeat(2, 1fr); gap: 30px 18px; }
  body.s-ambacht-b .les-rooster, body.s-ambacht-b .hor-rooster, body.s-ambacht-b .iv-rooster, body.s-ambacht-b .pr-rooster,
  body.s-ambacht-b .dienst-rooster, body.s-ambacht-b .gr-rooster, body.s-ambacht-b .lijst-rooster, body.s-ambacht-b .ft-rooster,
  body.s-ambacht-b .ct-rooster { grid-template-columns: 1fr; gap: 40px; }
  body.s-ambacht-b .les-beeld { margin-top: 0; }
  body.s-ambacht-b .les-foto, body.s-ambacht-b .iv-foto, body.s-ambacht-b .gr-foto { aspect-ratio: 4 / 3.6; }
  body.s-ambacht-b .iv-beeld { position: static; }
  body.s-ambacht-b .ag-rij { grid-template-columns: 1fr auto; gap: 4px 14px; }
  body.s-ambacht-b .ag-datum { grid-column: 1; }
  body.s-ambacht-b .ag-plek { grid-column: 2; grid-row: 1; justify-self: end; }
  body.s-ambacht-b .ag-wat { grid-column: 1 / -1; }
  body.s-ambacht-b .breed-beeld { margin-bottom: 40px; }
  body.s-ambacht-b .breed-foto { aspect-ratio: 4 / 3; }
  body.s-ambacht-b .praktisch { padding: 64px 0; }
  body.s-ambacht-b .pr-rooster { gap: 30px; }
  body.s-ambacht-b .voet-plank { padding-top: 48px; }
  body.s-ambacht-b .plank-vorm:nth-child(n+6) { display: none; }
  body.s-ambacht-b .voet-kolommen { grid-template-columns: 1fr; gap: 32px; }
  body.s-ambacht-b .voet-motto { font-size: 19px; margin-bottom: 36px; }
  body.s-ambacht-b .paginakop { min-height: 460px; }
  body.s-ambacht-b .paginakop .pk-midden { padding-bottom: 56px; }
  body.s-ambacht-b .pk-schijf { width: 88px; height: 88px; }
  body.s-ambacht-b .pk-vorm { width: 52px; height: 52px; }
  body.s-ambacht-b .inhoud-lijst a, body.s-ambacht-b .inhoud-lijst li:first-child a, body.s-ambacht-b .inhoud-lijst li:nth-child(3) a { padding: 16px 10px; border-left: 0; grid-template-columns: 34px 1fr; }
  body.s-ambacht-b .inhoud-lijst li:nth-child(even) a { border-left: 1px solid var(--lijn); }
  body.s-ambacht-b .inhoud-lijst small { display: none; }
  body.s-ambacht-b .inhoud-lijst span { font-size: 16px; }
  body.s-ambacht-b .io-vorm { width: 34px; height: 34px; grid-row: auto; }
  body.s-ambacht-b .dienst-kop { padding-right: 0; }
  body.s-ambacht-b .dienst-vorm { position: static; width: 70px; height: 70px; margin: 0 0 10px -6px; display: block; }
  body.s-ambacht-b .dienst-foto { aspect-ratio: 4 / 3; }
  body.s-ambacht-b .dienst-beeld { margin-bottom: 36px; }
  body.s-ambacht-b .prijslijst, body.s-ambacht-b .prijslijst + .prijslijst { padding: 0; border-left: 0; }
  body.s-ambacht-b .prijslijst + .prijslijst { border-top: 1px solid #c3cfbf; padding-top: 34px; }
  body.s-ambacht-b .prijslijst li b { white-space: normal; text-align: right; max-width: 55%; }
  body.s-ambacht-b .ct-gegevens { grid-template-columns: 1fr; }
  body.s-ambacht-b .formulier { padding: 28px 20px; }
  body.s-ambacht-b .formulier .velden { grid-template-columns: 1fr; }
}
body.s-ambacht-b .ods-wrap > :first-child { padding-top: calc(var(--kop-h) + 48px) !important; }
