/* ===== Routes — базовая сетка секций этой страницы ===== */
.section { padding: clamp(2rem, 4vw, 4rem) 0; }

/* ---------- S1: Ringdijkroute ---------- */
.ringdike-route .route-grid{
  width: min(1100px, 92vw);
  margin: 0 auto;
  display: grid; gap: 1.25rem; grid-template-columns: 1fr;
}
.route-text{
  background:#fff; border:1px solid rgba(15,23,42,.08); border-radius:.9rem;
  padding:1rem 1.1rem; color:#1f2937; box-shadow:0 12px 30px rgba(0,0,0,.08);
}
.stats{ display:grid; gap:.25rem; margin: .6rem 0 0 0; color:#334155; }
.stats li strong{ font-weight:700; }
.elev{ display:flex; gap:6px; margin-top:.6rem; }
.elev span{
  flex:1 1 auto; height:8px; background:rgba(15,23,42,.08); border-radius:999px; overflow:hidden;
  position:relative;
}
.elev span::after{
  content:""; position:absolute; left:0; top:0; bottom:0; width:var(--w,50%);
  background:linear-gradient(90deg,#0f172a,#334155);
}
.route-media{ display:grid; gap:1rem; grid-template-columns:1fr; }
.r-card{
  background:#fff; padding:.6rem .6rem 1rem; border-radius:.75rem;
  box-shadow:0 12px 30px rgba(0,0,0,.08); text-align:center;
}
.r-card figcaption{ margin-top:.45rem; color:#475569; }

@media (min-width:880px){
  .ringdike-route .route-grid{ grid-template-columns:1.1fr .9fr; align-items:start; }
  .route-media{ grid-template-columns:repeat(2,1fr); }
}

/* ---------- S2: Kerkepad-lus ---------- */
.churchpath-loop .church-grid{
  width:min(1100px,92vw); margin:0 auto;
  display:grid; gap:1.25rem; grid-template-columns:1fr;
}
.waypoints{
  background:#fff; border:1px solid rgba(15,23,42,.08); border-radius:.9rem;
  padding:1rem 1.1rem; box-shadow:0 12px 30px rgba(0,0,0,.08);
}
.waypoints ol{ margin:0; padding:0; list-style:none; counter-reset: wp; display:grid; gap:.4rem; }
.waypoints li{ position:relative; padding-left:1.6rem; color:#334155; }
.waypoints li::before{
  counter-increment: wp; content: counter(wp);
  position:absolute; left:0; top:.15rem; width:1.1rem; height:1.1rem;
  border-radius:50%; background:#0f172a; color:#fff; font-size:.75rem; font-weight:700; display:grid; place-items:center;
}
.waypoints em{ color:#64748b; font-style:italic; margin-left:.25rem; }

.church-text{
  background:#fff; border:1px solid rgba(15,23,42,.08); border-radius:.9rem;
  padding:1rem 1.1rem; color:#1f2937; box-shadow:0 12px 30px rgba(0,0,0,.08);
}
.church-media{ display:grid; gap:1rem; grid-template-columns:1fr; }
.c-card{
  background:#fff; padding:.6rem .6rem 1rem; border-radius:.75rem;
  box-shadow:0 12px 30px rgba(0,0,0,.08); text-align:center;
}
.c-card figcaption{ margin-top:.45rem; color:#475569; }

@media (min-width:880px){
  .churchpath-loop .church-grid{ grid-template-columns:.9fr 1.1fr; align-items:start; }
  .church-media{ grid-template-columns:repeat(2,1fr); }
}

/* ---------- S3: Wind & Water ---------- */
.windwater-trio .ww-grid{
  width:min(1100px,92vw); margin:0 auto;
  display:grid; gap:1.25rem; grid-template-columns:1fr;
}
.ww-text{
  background:#fff; border:1px solid rgba(15,23,42,.08); border-radius:.9rem;
  padding:1rem 1.1rem; color:#1f2937; box-shadow:0 12px 30px rgba(0,0,0,.08);
}
.ww-media{ display:grid; gap:1rem; grid-template-columns:1fr; }
.ww-card{
  background:#fff; padding:.6rem .6rem 1rem; border-radius:.75rem;
  box-shadow:0 12px 30px rgba(0,0,0,.08); text-align:center;
}
.ww-card figcaption{ margin-top:.45rem; color:#475569; }

/* внутренняя пунктирная линия — безопасна для контейнера */
.ww-route{ position:relative; height:120px; }
.ww-route svg{ position:absolute; inset:0; width:100%; height:100%; }
.dashline{
  fill:none; stroke:#0f172a; stroke-width:3; stroke-dasharray:6 8; stroke-linecap:round;
  animation: route-dash 3s linear infinite;
}
@keyframes route-dash{ to{ stroke-dashoffset:-160; } }

@media (min-width:880px){
  .windwater-trio .ww-grid{ grid-template-columns:1.05fr .95fr; align-items:start; }
  .ww-media{ grid-template-columns:repeat(2,1fr); }
}

/* Подстраховка против горизонтального скролла */
html, body, .site-main { overflow-x: hidden; }
/* ---------- S4: Vaartlint ---------- */
.vaart-ribbon .vaart-grid{
  width:min(1100px,92vw); margin:0 auto;
  display:grid; gap:1.25rem; grid-template-columns:1fr;
}
.vaart-text{
  background:#fff; border:1px solid rgba(15,23,42,.08); border-radius:.9rem;
  padding:1rem 1.1rem; color:#1f2937; box-shadow:0 12px 30px rgba(0,0,0,.08);
}
.points{ margin:.6rem 0 0 0; padding:0; list-style:none; display:grid; gap:.25rem; color:#334155; }
.points strong{ font-weight:700; }

/* сегментная полоса с «подсветкой» */
.vaart-bar{ display:flex; gap:6px; margin-top:.6rem; }
.vaart-bar .seg{
  flex:1 1 0; height:8px; background:rgba(15,23,42,.08); border-radius:999px; position:relative; overflow:hidden;
}
.vaart-bar .seg::after{
  content:""; position:absolute; inset:0; width:0;
  background:linear-gradient(90deg,#0f172a,#334155);
  animation: seg-fill 1.2s ease forwards;
}
.vaart-bar .seg.b::after{ animation-delay:.15s; }
.vaart-bar .seg.c::after{ animation-delay:.3s; }
@keyframes seg-fill{ to{ width:100%; } }

.vaart-media{ display:grid; gap:1rem; grid-template-columns:1fr; }
.v-card{
  background:#fff; padding:.6rem .6rem 1rem; border-radius:.75rem;
  box-shadow:0 12px 30px rgba(0,0,0,.08); text-align:center;
}
.v-card figcaption{ margin-top:.45rem; color:#475569; }

@media (min-width:880px){
  .vaart-ribbon .vaart-grid{ grid-template-columns:1.05fr .95fr; align-items:start; }
  .vaart-media{ grid-template-columns:repeat(2,1fr); }
}

/* ---------- S5: Pauzeplaatsen ---------- */
.pause-places .pause-grid{
  width:min(1100px,92vw); margin:0 auto;
  display:grid; gap:1.25rem; grid-template-columns:1fr;
}
.pause-text{
  background:#fff; border:1px solid rgba(15,23,42,.08); border-radius:.9rem;
  padding:1rem 1.1rem; color:#1f2937; box-shadow:0 12px 30px rgba(0,0,0,.08);
}
.pause-text .tiny{ color:#64748b; font-size:.95rem; margin:.4rem 0 0 0; }

.pause-media{ display:grid; gap:1rem; grid-template-columns:1fr; }
.p-card{
  background:#fff; padding:.6rem .6rem 1rem; border-radius:.75rem;
  box-shadow:0 12px 30px rgba(0,0,0,.08); text-align:center; position:relative; overflow:hidden;
}
.p-card figcaption{ margin-top:.45rem; color:#475569; }
/* мягкий «дыхательный» хинт */
.hint::after{
  content:""; position:absolute; inset:-2px; border-radius:.85rem;
  box-shadow:0 0 0 0 rgba(15,23,42,.08);
  animation: breathe 2.8s ease-in-out infinite;
}
@keyframes breathe{
  0%,100%{ box-shadow:0 0 0 0 rgba(15,23,42,.08); }
  50%{ box-shadow:0 0 0 8px rgba(15,23,42,.06); }
}

@media (min-width:880px){
  .pause-places .pause-grid{ grid-template-columns:1.05fr .95fr; align-items:start; }
  .pause-media{ grid-template-columns:repeat(2,1fr); }
}

/* ---------- S6: Dijkpanorama ---------- */
.dike-panorama .pan-grid{
  width:min(1100px,92vw); margin:0 auto;
  display:grid; gap:1.25rem; grid-template-columns:1fr;
}
.pan-text{
  background:#fff; border:1px solid rgba(15,23,42,.08); border-radius:.9rem;
  padding:1rem 1.1rem; color:#1f2937; box-shadow:0 12px 30px rgba(0,0,0,.08);
}
/* плавная подчёркнутая линия текста при появлении */
.flowline{
  background: linear-gradient(0deg, rgba(15,23,42,.2), rgba(15,23,42,.2)) no-repeat 0 100%/0 2px;
  transition: background-size 900ms ease;
}
.reveal-on-scroll.in-view .flowline{ background-size:100% 2px; }

.pan-media{ display:grid; gap:1rem; grid-template-columns:1fr; }
.pan-card{
  background:#fff; padding:.6rem .6rem 1rem; border-radius:.75rem;
  box-shadow:0 12px 30px rgba(0,0,0,.08); text-align:center;
}
.pan-card figcaption{ margin-top:.45rem; color:#475569; }

@media (min-width:880px){
  .dike-panorama .pan-grid{ grid-template-columns:1.1fr .9fr; align-items:start; }
  .pan-media{ grid-template-columns:repeat(2,1fr); }
}

/* страховка от горизонтального скролла */
html, body, .site-main { overflow-x: hidden; }
/* ---------- S7: Knooppuntenkaart ---------- */
.junction-map .junction-grid{
  width:min(1100px,92vw); margin:0 auto;
  display:grid; gap:1.25rem; grid-template-columns:1fr;
}
.junction-text{
  background:#fff; border:1px solid rgba(15,23,42,.08); border-radius:.9rem;
  padding:1rem 1.1rem; color:#1f2937; box-shadow:0 12px 30px rgba(0,0,0,.08);
}
.tips{ margin:.6rem 0 0 0; padding:0; list-style:none; display:grid; gap:.25rem; color:#334155; }
.junction-media{ display:grid; gap:1rem; grid-template-columns:1fr; }
.j-card{
  position:relative;
  background:#fff; padding:.6rem .6rem 1rem; border-radius:.75rem;
  box-shadow:0 12px 30px rgba(0,0,0,.08); text-align:center; overflow:hidden;
}
.j-card figcaption{ margin-top:.45rem; color:#475569; }
/* Пульсирующий маркер — внутри карточки, без переполнения */
.pin-pulse::after, .pin-pulse::before{
  content:""; position:absolute; width:8px; height:8px; border-radius:50%;
  background:#0f172a; right:14px; top:14px;
}
.pin-pulse::before{
  width:8px; height:8px; box-shadow:0 0 0 0 rgba(15,23,42,.25);
  animation:pulse 2.2s ease-in-out infinite;
}
@keyframes pulse{
  0%{ box-shadow:0 0 0 0 rgba(15,23,42,.22); }
  70%{ box-shadow:0 0 0 10px rgba(15,23,42,.0); }
  100%{ box-shadow:0 0 0 0 rgba(15,23,42,.0); }
}
@media (min-width:880px){
  .junction-map .junction-grid{ grid-template-columns:1.05fr .95fr; align-items:start; }
  .junction-media{ grid-template-columns:repeat(2,1fr); }
}

/* ---------- S8: Seizoensadvies ---------- */
.season-advice .season-grid{
  width:min(1100px,92vw); margin:0 auto;
  display:grid; gap:1.25rem; grid-template-columns:1fr;
}
.season-text{
  background:#fff; border:1px solid rgba(15,23,42,.08); border-radius:.9rem;
  padding:1rem 1.1rem; color:#1f2937; box-shadow:0 12px 30px rgba(0,0,0,.08);
}
.season-head{ margin:.25rem 0 .25rem 0; font-weight:700; }
.season-head.spring{ color:#166534; }
.season-head.autumn{ color:#92400e; }

.season-media{ display:grid; gap:1rem; grid-template-columns:1fr; }
.s-card{
  background:#fff; padding:.6rem .6rem 1rem; border-radius:.75rem;
  box-shadow:0 12px 30px rgba(0,0,0,.08); text-align:center;
}
.s-card figcaption{ margin-top:.45rem; color:#475569; }
/* мягкое свечение оттенка сезона */
.glow-spring img{ filter:saturate(1.05) hue-rotate(-6deg); transition:filter .3s ease; }
.glow-autumn img{ filter:saturate(1.05) hue-rotate(12deg); transition:filter .3s ease; }
.s-card:hover img{ filter:saturate(1.15) hue-rotate(0deg); }

@media (min-width:880px){
  .season-advice .season-grid{ grid-template-columns:1.05fr .95fr; align-items:start; }
  .season-media{ grid-template-columns:repeat(2,1fr); }
}

/* ---------- S9: Bruggenboek ---------- */
.bridges-book .bridges-grid{
  width:min(1100px,92vw); margin:0 auto;
  display:grid; gap:1.25rem; grid-template-columns:1fr;
}
.bridges-text{
  background:#fff; border:1px solid rgba(15,23,42,.08); border-radius:.9rem;
  padding:1rem 1.1rem; color:#1f2937; box-shadow:0 12px 30px rgba(0,0,0,.08);
}
.rule{ 
  background: linear-gradient(0deg, rgba(15,23,42,.2), rgba(15,23,42,.2)) no-repeat 0 100%/0 2px;
  transition: background-size 800ms ease;
}
.reveal-on-scroll.in-view .rule{ background-size:100% 2px; }

.bridges-media{ display:grid; gap:1rem; grid-template-columns:1fr; }
.b-card{
  background:#fff; padding:.6rem .6rem 1rem; border-radius:.75rem;
  box-shadow:0 12px 30px rgba(0,0,0,.08); text-align:center;
}
.b-card figcaption{ margin-top:.45rem; color:#475569; }

@media (min-width:880px){
  .bridges-book .bridges-grid{ grid-template-columns:1.05fr .95fr; align-items:start; }
  .bridges-media{ grid-template-columns:repeat(2,1fr); }
}

/* Страховка */
html, body, .site-main{ overflow-x:hidden; }
/* ---------- S10: Waterstappen ---------- */
.water-steps .wsteps-grid{
  width:min(1100px,92vw); margin:0 auto;
  display:grid; gap:1.25rem; grid-template-columns:1fr;
}
.wsteps-text{
  background:#fff; border:1px solid rgba(15,23,42,.08); border-radius:.9rem;
  padding:1rem 1.1rem; color:#1f2937; box-shadow:0 12px 30px rgba(0,0,0,.08);
}
.wsteps-list{ margin:0; padding:0; list-style:none; display:grid; gap:.6rem; }
.wsteps-list h3{ margin:.1rem 0 .15rem 0; font-size:1.05rem; }
.wsteps-progress{ display:flex; gap:6px; margin-top:.6rem; }
.wsteps-progress .seg{
  flex:1 1 0; height:8px; background:rgba(15,23,42,.08); border-radius:999px; position:relative; overflow:hidden;
}
.reveal-on-scroll.in-view .wsteps-progress .seg::after{
  content:""; position:absolute; inset:0; width:0; background:linear-gradient(90deg,#0f172a,#334155);
  animation: wseg 900ms ease forwards;
}
.reveal-on-scroll.in-view .wsteps-progress .seg.s2::after{ animation-delay:.12s; }
.reveal-on-scroll.in-view .wsteps-progress .seg.s3::after{ animation-delay:.24s; }
.reveal-on-scroll.in-view .wsteps-progress .seg.s4::after{ animation-delay:.36s; }
@keyframes wseg{ to{ width:100%; } }

.wsteps-media{ display:grid; gap:1rem; grid-template-columns:1fr; }
.ws-card{
  background:#fff; padding:.6rem .6rem 1rem; border-radius:.75rem;
  box-shadow:0 12px 30px rgba(0,0,0,.08); text-align:center;
}
.ws-card figcaption{ margin-top:.45rem; color:#475569; }

@media (min-width:880px){
  .water-steps .wsteps-grid{ grid-template-columns:1.05fr .95fr; align-items:start; }
  .wsteps-media{ grid-template-columns:repeat(2,1fr); }
}

/* ---------- S11: Dorpsrand (асимметрия + sticky aside) ---------- */
.village-edge .vedge-grid{
  width:min(1100px,92vw); margin:0 auto;
  display:grid; gap:1.25rem; grid-template-columns:1fr;
}
.vedge-essay{
  background:#fff; border:1px solid rgba(15,23,42,.08); border-radius:.9rem;
  padding:1rem 1.1rem; color:#1f2937; box-shadow:0 12px 30px rgba(0,0,0,.08);
}
.vedge-essay .lead{
  background: linear-gradient(0deg, rgba(15,23,42,.2), rgba(15,23,42,.2)) no-repeat 0 100%/0 2px;
  transition: background-size 900ms ease;
}
.reveal-on-scroll.in-view .vedge-essay .lead{ background-size:100% 2px; }

.vedge-aside{
  background:#fff; border:1px solid rgba(15,23,42,.08); border-radius:.9rem;
  padding:1rem; color:#334155; box-shadow:0 12px 30px rgba(0,0,0,.08);
}
.aside-list{ margin:0; padding:0; list-style:none; display:grid; gap:.3rem; }
.vedge-media{ display:grid; gap:1rem; grid-template-columns:1fr; }
.ve-card{
  background:#fff; padding:.6rem .6rem 1rem; border-radius:.75rem;
  box-shadow:0 12px 30px rgba(0,0,0,.08); text-align:center;
}
.ve-card figcaption{ margin-top:.45rem; color:#475569; }

@media (min-width:880px){
  .village-edge .vedge-grid{
    grid-template-columns:1.1fr .6fr; align-items:start;
  }
  .vedge-aside{ position:sticky; top:calc(var(--header-h) + 20px); }
  .vedge-media{ grid-column:1 / -1; grid-template-columns:repeat(2,1fr); }
}

/* ---------- S12: Stille Lus (темпо-графика) ---------- */
.quiet-loop .qloop-grid{
  width:min(1100px,92vw); margin:0 auto;
  display:grid; gap:1.25rem; grid-template-columns:1fr;
}
.qloop-text{
  background:#fff; border:1px solid rgba(15,23,42,.08); border-radius:.9rem;
  padding:1rem 1.1rem; color:#1f2937; box-shadow:0 12px 30px rgba(0,0,0,.08);
}
.tempo-graph{ margin-top:.6rem; position:relative; height:120px; }
.tempo-graph svg{ position:absolute; inset:0; width:100%; height:100%; }
.tempo-base{ stroke:#cbd5e1; stroke-width:2; fill:none; }
.tempo-wave{
  stroke:#0f172a; stroke-width:3; fill:none; stroke-linecap:round;
  stroke-dasharray: 6 10;
  animation: tempo-move 3s linear infinite;
}
@keyframes tempo-move{ to{ stroke-dashoffset:-160; } }

.qloop-media{ display:grid; gap:1rem; grid-template-columns:1fr; }
.ql-card{
  background:#fff; padding:.6rem .6rem 1rem; border-radius:.75rem;
  box-shadow:0 12px 30px rgba(0,0,0,.08); text-align:center;
}
.ql-card figcaption{ margin-top:.45rem; color:#475569; }

@media (min-width:880px){
  .quiet-loop .qloop-grid{ grid-template-columns:1.05fr .95fr; align-items:start; }
  .qloop-media{ grid-template-columns:repeat(2,1fr); }
}

/* Страховка против горизонтального скролла */
html, body, .site-main{ overflow-x:hidden; }
/* ---------- S13: Kaadekalender ---------- */
.quay-calendar .qcal-grid{
  width:min(1100px,92vw); margin:0 auto;
  display:grid; gap:1.25rem; grid-template-columns:1fr;
}
.qcal-text{
  background:#fff; border:1px solid rgba(15,23,42,.08); border-radius:.9rem;
  padding:1rem 1.1rem; color:#1f2937; box-shadow:0 12px 30px rgba(0,0,0,.08);
}
.qcal-list{ margin:0; padding:0; list-style:none; display:grid; gap:.5rem; }
.qcal-list .mon{
  position:relative; padding:.5rem .75rem .5rem 2.2rem;
  border:1px dashed rgba(15,23,42,.15); border-radius:.6rem; background:#fff;
}
.qcal-list .mon::before{
  content:""; position:absolute; left:.6rem; top:50%; transform:translateY(-50%);
  width:1rem; height:1rem; border-radius:50%;
  box-shadow:0 0 0 0 rgba(15,23,42,.12); background:#0f172a;
  animation: qcal-pulse 2.8s ease-in-out infinite;
}
.qcal-list .mon.jan::before{ background:#1e293b; }
.qcal-list .mon.apr::before{ background:#16a34a; }
.qcal-list .mon.jul::before{ background:#f59e0b; }
.qcal-list .mon.okt::before{ background:#92400e; }
@keyframes qcal-pulse{
  0%,100%{ box-shadow:0 0 0 0 rgba(15,23,42,.12); }
  50%{ box-shadow:0 0 0 8px rgba(15,23,42,.06); }
}
.qcal-media{ display:grid; gap:1rem; grid-template-columns:1fr; }
.qcal-card{
  background:#fff; padding:.6rem .6rem 1rem; border-radius:.75rem;
  box-shadow:0 12px 30px rgba(0,0,0,.08); text-align:center;
}
.qcal-card figcaption{ margin-top:.45rem; color:#475569; }

@media (min-width:880px){
  .quay-calendar .qcal-grid{ grid-template-columns:1.1fr .9fr; align-items:start; }
  .qcal-media{ grid-template-columns:repeat(2,1fr); }
}

/* ---------- S14: Windvensters ---------- */
.wind-windows .wwin-grid{
  width:min(1100px,92vw); margin:0 auto;
  display:grid; gap:1.25rem; grid-template-columns:1fr;
}
.wwin-quotes{
  background:#ffffff; border:1px solid rgba(15,23,42,.08); border-radius:.9rem;
  padding:1rem 1.1rem; box-shadow:0 12px 30px rgba(0,0,0,.08); color:#1f2937;
}
.wwin-quotes .q{ 
  margin:.35rem 0; 
  background: linear-gradient(0deg, rgba(15,23,42,.2), rgba(15,23,42,.2)) no-repeat 0 100%/0 2px;
  transition: background-size 900ms ease;
}
.reveal-on-scroll.in-view .wwin-quotes .q{ background-size:100% 2px; }

.wwin-media{ display:grid; gap:1rem; grid-template-columns:1fr; }
.wwin-card{
  background:#fff; padding:.6rem .6rem 1rem; border-radius:.75rem;
  box-shadow:0 12px 30px rgba(0,0,0,.08); text-align:center; overflow:hidden;
}
.wwin-card img{ border-radius:.5rem; clip-path: inset(0 100% 0 0); transition: clip-path .9s ease; }
.reveal-on-scroll.in-view .wwin-card img{ clip-path: inset(0 0 0 0); }
.wwin-card figcaption{ margin-top:.45rem; color:#475569; }

@media (min-width:880px){
  .wind-windows .wwin-grid{ grid-template-columns:.95fr 1.05fr; align-items:start; }
  .wwin-media{ grid-template-columns:repeat(2,1fr); }
}

/* ---------- S15: Laagland-lus ---------- */
.lowland-loop .lll-grid{
  width:min(1100px,92vw); margin:0 auto;
  display:grid; gap:1.25rem; grid-template-columns:1fr;
}
.lll-text{
  background:#fff; border:1px solid rgba(15,23,42,.08); border-radius:.9rem;
  padding:1rem 1.1rem; color:#1f2937; box-shadow:0 12px 30px rgba(0,0,0,.08);
}
.leadline{
  background: linear-gradient(0deg, rgba(15,23,42,.2), rgba(15,23,42,.2)) no-repeat 0 100%/0 2px;
  transition: background-size 900ms ease;
}
.reveal-on-scroll.in-view .leadline{ background-size:100% 2px; }

/* компас из чистого CSS внутри карточки */
.compass{ display:grid; place-items:center; margin-top:.6rem; }
.rose{
  position:relative; width:140px; height:140px; border-radius:50%;
  border:2px solid rgba(15,23,42,.15);
}
.rose .n,.rose .e,.rose .s,.rose .w{
  position:absolute; font-weight:700; color:#334155; font-size:.9rem;
}
.rose .n{ top:6px; left:50%; transform:translateX(-50%); }
.rose .s{ bottom:6px; left:50%; transform:translateX(-50%); }
.rose .e{ right:6px; top:50%; transform:translateY(-50%); }
.rose .w{ left:6px; top:50%; transform:translateY(-50%); }
.needle{
  position:absolute; left:50%; top:50%; width:2px; height:56px; background:#0f172a; transform-origin:50% 95%;
  transform: translate(-50%,-95%) rotate(-18deg);
  animation: needle-drift 5s ease-in-out infinite alternate;
}
@keyframes needle-drift{
  0%{ transform: translate(-50%,-95%) rotate(-22deg); }
  100%{ transform: translate(-50%,-95%) rotate(8deg); }
}

.lll-media{ display:grid; gap:1rem; grid-template-columns:1fr; }
.lll-card{
  background:#fff; padding:.6rem .6rem 1rem; border-radius:.75rem;
  box-shadow:0 12px 30px rgba(0,0,0,.08); text-align:center;
}
.lll-card figcaption{ margin-top:.45rem; color:#475569; }

@media (min-width:880px){
  .lowland-loop .lll-grid{ grid-template-columns:1.05fr .95fr; align-items:start; }
  .lll-media{ grid-template-columns:repeat(2,1fr); }
}

/* Страховка от горизонтального скролла */
html, body, .site-main{ overflow-x:hidden; }
/* ---------- S16: Pontnoot ---------- */
.pont-note .pont-grid{
  width:min(1100px,92vw); margin:0 auto;
  display:grid; gap:1.25rem; grid-template-columns:1fr;
}
.pont-text{
  background:#fff; border:1px solid rgba(15,23,42,.08); border-radius:.9rem;
  padding:1rem 1.1rem; color:#1f2937; box-shadow:0 12px 30px rgba(0,0,0,.08);
}
.pont-text .leadline{
  background: linear-gradient(0deg, rgba(15,23,42,.2), rgba(15,23,42,.2)) no-repeat 0 100%/0 2px;
  transition: background-size 900ms ease;
}
.reveal-on-scroll.in-view .pont-text .leadline{ background-size:100% 2px; }

.pont-curve{ position:relative; height:140px; margin-top:.6rem; }
.pont-curve svg{ position:absolute; inset:0; width:100%; height:100%; }
.pont-curve .shore{ stroke:#cbd5e1; stroke-width:2; fill:none; }
.pont-curve .arc{
  stroke:#0f172a; stroke-width:3; fill:none; stroke-linecap:round;
  stroke-dasharray:8 10; animation:pont-anim 3s linear infinite;
}
@keyframes pont-anim{ to{ stroke-dashoffset:-180; } }

.pont-media{ display:grid; gap:1rem; grid-template-columns:1fr; }
.pont-card{
  background:#fff; padding:.6rem .6rem 1rem; border-radius:.75rem;
  box-shadow:0 12px 30px rgba(0,0,0,.08); text-align:center;
}
.pont-card figcaption{ margin-top:.45rem; color:#475569; }

@media (min-width:880px){
  .pont-note .pont-grid{ grid-template-columns:1.05fr .95fr; align-items:start; }
  .pont-media{ grid-template-columns:repeat(2,1fr); }
}

/* ---------- S17: Laatste Stilte ---------- */
.last-still .lstill-grid{
  width:min(1100px,92vw); margin:0 auto;
  display:grid; gap:1.25rem; grid-template-columns:1fr;
}
.lstill-essay{
  background:#fff; border:1px solid rgba(15,23,42,.08); border-radius:.9rem;
  padding:1rem 1.1rem; color:#1f2937; box-shadow:0 12px 30px rgba(0,0,0,.08);
}
.underline-reveal{
  background: linear-gradient(0deg, rgba(15,23,42,.2), rgba(15,23,42,.2)) no-repeat 0 100%/0 2px;
  transition: background-size 900ms ease;
}
.reveal-on-scroll.in-view .underline-reveal{ background-size:100% 2px; }

.lstill-media{ display:grid; gap:1rem; grid-template-columns:1fr; }
.lstill-card{
  background:#fff; padding:.6rem .6rem 1rem; border-radius:.75rem;
  box-shadow:0 12px 30px rgba(0,0,0,.08); text-align:center;
}
.lstill-card figcaption{ margin-top:.45rem; color:#475569; }

@media (min-width:880px){
  .last-still .lstill-grid{ grid-template-columns:1.05fr .95fr; align-items:start; }
  .lstill-media{ grid-template-columns:repeat(2,1fr); }
}

/* страховка */
html, body, .site-main{ overflow-x:hidden; }
/* Ringdijkroute — Elev значения без инлайна */
.elev span.b1 { --w: 18%; }
.elev span.b2 { --w: 9%; }
.elev span.b3 { --w: 22%; }
.elev span.b4 { --w: 12%; }
.elev span.b5 { --w: 39%; }