/* Ansie se bestellingsblad: 'n rustige, menslike skoolwerk-voorkant. */
.inhoud:has(.bestel-lander){
  width:min(100%,1040px);
  max-width:1040px;
  padding:24px clamp(18px,5vw,56px) 88px;
}
.bestel-lander{
  --lander-sag:#667080;
  --lander-lyn:#e4ded1;
  --lander-vel:#f3efe6;
  --lander-aksent:#d8a747;
}
.bestel-held{
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(280px,.92fr);
  gap:clamp(24px,4vw,52px);
  align-items:center;
  position:relative;
  padding:28px 0 26px;
  border-bottom:1px solid var(--lander-lyn);
}
.bestel-held-kopie{min-width:0}
.bestel-held .eyebrow,
.bestel-voordele .eyebrow{
  margin:0 0 9px;
  color:#8d6729;
  font-size:10px;
  letter-spacing:.15em;
}
.bestel-held h1{
  max-width:17ch;
  margin:0 0 12px;
  font-size:clamp(30px,5.2vw,46px);
  line-height:1.06;
  letter-spacing:-.045em;
}
.bestel-inleiding{
  max-width:56ch;
  margin:0 0 10px;
  color:var(--lander-sag);
  font-size:15px;
  line-height:1.55;
}
.bestel-gehoor{
  max-width:52ch;
  margin:0 0 14px;
  color:var(--lander-sag);
  font-size:13px;
  line-height:1.5;
}
.bestel-afbakening{
  width:fit-content;
  margin:0 0 16px;
  padding:7px 11px;
  color:#725523;
  background:#f5efdf;
  border-left:2px solid var(--lander-aksent);
  font-size:12px;
  font-weight:600;
}
.bestel-held .knop{
  width:auto;
  min-height:54px;
  padding:14px 20px;
  box-shadow:0 5px 0 rgba(19,88,51,.12);
}
.bestel-heldbeeld{
  min-width:0;
  overflow:hidden;
  margin:0;
  border:1px solid var(--lander-lyn);
  border-radius:18px;
  background:var(--lander-vel);
  box-shadow:0 12px 32px rgba(52,45,32,.1);
}
.bestel-heldbeeld picture,.bestel-heldbeeld img{
  display:block;
  width:100%;
}
.bestel-heldbeeld img{
  height:auto;
  aspect-ratio:3/2;
  object-fit:cover;
  object-position:center 48%;
}
.bestel-voorwaarde{
  max-width:54ch;
  margin:10px 0 0;
  color:var(--lander-sag);
  font-size:12px;
  line-height:1.5;
}
.bestel-voorbeeld-skakel{
  display:block;
  width:fit-content;
  padding:12px 0 4px;
  color:var(--ink);
  font-size:14px;
  font-weight:600;
  text-underline-offset:4px;
}
#werk-voorbeelde{scroll-margin-top:24px}
.bestel-lander .werk-voorbeelde{
  margin:21px 0 27px;
  padding:20px 0 18px;
  border-top:0;
  border-bottom:1px solid var(--lander-lyn);
}
.bestel-lander .werk-voorbeelde-kop{margin-bottom:15px}
.bestel-lander .werk-voorbeelde-etiket{
  color:#8d6729;
  font-size:9px;
  letter-spacing:.15em;
}
.bestel-lander .werk-voorbeelde-kop h2{
  margin:0 0 5px;
  font-size:22px;
}
.bestel-lander .werk-voorbeelde-kop > p:last-child{
  max-width:48ch;
  font-size:13px;
  line-height:1.45;
}
.bestel-lander .werk-voorbeeld-wenk{
  color:var(--ink);
  font-size:11.5px;
}
.bestel-lander .werk-voorbeeld-lys{
  gap:14px;
  padding:2px 3px 14px;
  scrollbar-color:#cbbd9f var(--lander-vel);
}
.bestel-lander .werk-voorbeeld{
  flex-basis:34%;
}
.bestel-lander .werk-voorbeeld-bladsy{
  border-color:#ded6c8;
  border-radius:12px;
  box-shadow:0 4px 14px rgba(50,43,31,.09);
}
.bestel-lander .werk-voorbeeld-bladsy img{background:#f1eee7}
.bestel-lander .werk-voorbeeld-byskrif{padding:9px 10px}
.bestel-lander .werk-voorbeeld-vordering{background:#e9e1d4}
.bestel-lander .werk-voorbeeld-vordering span{background:#a87a31}
.bestel-lander .werk-voorbeeld-nota{
  margin-top:12px;
  border-color:#d8a747;
}
.bestel-lander .werk-voorbeeld-beheer{gap:5px}
.bestel-lander .werk-voorbeeld-nav{
  width:40px;
  height:40px;
  border-color:#ded6c8;
}
.bestel-voordele{
  display:grid;
  grid-template-columns:minmax(150px,.78fr) minmax(0,1.5fr);
  gap:8px 28px;
  align-items:start;
  padding:24px 0 22px;
  border-bottom:1px solid var(--lander-lyn);
}
.bestel-voordele-kop h2{
  max-width:12ch;
  font-size:21px;
  line-height:1.18;
}
.bestel-voordele-lys{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:11px 18px;
  list-style:none;
}
.bestel-voordele > p{
  grid-column:1/-1;
  margin:2px 0 0;
  color:var(--lander-sag);
  font-size:12px;
  line-height:1.5;
}
.bestel-voordele-lys li{
  display:grid;
  grid-template-columns:26px minmax(0,1fr);
  gap:8px;
  align-items:start;
  color:var(--ink);
  font-size:13px;
  line-height:1.45;
}
.voordeel-merker{
  display:grid;
  place-items:center;
  width:24px;
  height:24px;
  border:1px solid #dfd2b8;
  border-radius:50%;
  color:#8d6729;
  font:600 9px var(--data);
}

/* Pryse en bestellingsomvang bly deel van dieselfde eenvoudige leesroete. */
.bestel-lander .vip-pryse{
  padding:10px 0 0;
}
.bestel-lander .vip-prys-rooster{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}
.bestel-lander .vip-prys-kaart{
  padding:20px;
  background:var(--lander-vel);
  border:1px solid var(--lander-lyn);
  border-radius:14px;
}
.bestel-lander .vip-prys-bedrag{font-size:32px}
.bestel-lander .vip-prys-kaart .knop{font-size:14px}
.bestel-lander .vip-stappe{
  padding:24px 0;
  border-top:1px solid var(--lander-lyn);
  border-bottom:1px solid var(--lander-lyn);
}
.bestel-lander .vip-stappe ol{padding:0}
.bestel-lander .vip-stappe li{padding:12px 0 12px 42px}
.bestel-lander .vip-stappe li::before{top:12px;width:30px}
.bestel-onder-cta{margin-top:22px}

@media(max-width:620px){
  .inhoud:has(.bestel-lander){padding:12px 18px 72px}
  .bestel-held{
    grid-template-columns:1fr;
    gap:16px;
    padding:19px 0 18px;
  }
  .bestel-held h1{max-width:19ch;font-size:clamp(29px,8vw,36px)}
  .bestel-inleiding{font-size:14px;line-height:1.48;margin-bottom:13px}
  .bestel-gehoor{font-size:12.5px;margin-bottom:11px}
  .bestel-afbakening{margin-bottom:13px}
  .bestel-held .knop{width:100%;padding:13px 12px;font-size:15px}
  .bestel-voorwaarde{font-size:13px;margin-top:8px}
  .bestel-heldbeeld{border-radius:14px}
  .bestel-heldbeeld img{aspect-ratio:1.45/1;object-position:center 48%}
  .bestel-lander .werk-voorbeelde{margin:16px 0 22px;padding:16px 0 15px}
  .bestel-lander .werk-voorbeelde-kop h2{font-size:20px}
  .bestel-lander .werk-voorbeeld-karrousel-kop{align-items:center}
  .bestel-lander .werk-voorbeeld-lys{gap:11px}
  .bestel-lander .werk-voorbeeld{flex-basis:72%}
  .bestel-lander .werk-voorbeeld-bladsy{border-radius:11px}
  .bestel-lander .werk-voorbeeld-byskrif{padding:8px}
  .bestel-lander .werk-voorbeeld-titel{font-size:12px}
  .bestel-voordele{
    display:block;
    padding:18px 0 17px;
  }
  .bestel-voordele-kop{display:flex;align-items:baseline;gap:10px;margin-bottom:11px}
  .bestel-voordele .eyebrow{flex:none;margin:0;font-size:9px}
  .bestel-voordele-kop h2{max-width:none;font-size:18px}
  .bestel-voordele-lys{grid-template-columns:1fr;gap:10px}
  .bestel-voordele-lys li{grid-template-columns:21px minmax(0,1fr);gap:9px;font-size:14px;line-height:1.45}
  .bestel-voordele > p{margin-top:12px;font-size:12px}
  .voordeel-merker{width:20px;height:20px;font-size:8px}
  .bestel-lander .vip-prys-rooster{grid-template-columns:1fr}
  .bestel-lander .vip-prys-kaart{padding:17px}
}
@media(prefers-reduced-motion:reduce){
  .bestel-lander .knop{transition:none}
}
