/* =========================================================
   TEXELBORG — LIGGING
   Stap 2D / Fix174 hercontrole

   Architectuur:
   - sitebrede basis blijft in style.css (container, page-hero, content,
     typography, algemene kaartbasis en centrale tb-tokens);
   - uitsluitend Ligging-componenten staan hier;
   - historische Ligging-fixlagen uit style.css zijn hier samengebracht;
   - responsive toestand wordt alleen toegevoegd wanneer Ligging zelf
     ander gedrag nodig heeft.
   ========================================================= */

/* ---------- Ligging: basis / desktop ---------- */
.location-page .page-hero{
  padding-top:var(--tb-flow-hero-top);
  padding-bottom:var(--tb-flow-hero-bottom);
}

.location-page section.content{
  padding:var(--tb-space-lg) 0;
}

.location-page .page-hero + section.content{
  padding-top:var(--tb-flow-first-top);
}

/* Dit waren eerder hoog-specifieke body:has()-correcties in style.css. */
.location-page section.content + section.soft.content,
.location-page section.soft.content + section.content{
  padding-top:38px;
}

.location-page .section-head{
  margin-bottom:22px;
}

/* ---------- Ligging-intro + kaart ---------- */
.location-page .location-split{
  display:grid;
  grid-template-columns:52fr 48fr;
  gap:var(--tb-space-xl);
  align-items:start;
}

.location-page .location-split p{
  margin:0 0 14px;
}

.location-page .location-split .notice{
  margin-top:20px;
}

.location-page .location-split .map{
  height:100%;
  min-height:480px;
  box-shadow:0 15px 40px rgba(23,63,87,.1);
}

.location-page .map-frame{
  background:#fff;
  border:1px solid var(--line);
  border-radius:18px;
  padding:var(--tb-space-sm);
  box-shadow:0 12px 35px rgba(23,63,87,.07);
  overflow:hidden;
}

.location-page .map-frame .map{
  display:block;
  width:100%;
  height:100%;
  border:0;
  border-radius:12px;
}

/* ---------- Parkplattegrond ---------- */
.location-page .park-map-section > .section-head,
.location-page .park-map-section > .park-map-card{
  width:100%;
  max-width:none;
  margin-left:0;
  margin-right:0;
}

.location-page .park-map-section > .section-head{
  display:block;
}

.location-page .park-map-section > .section-head > p{
  margin:0 0 4px;
  text-align:left;
}

.location-page .park-map-section .section-head{
  margin-bottom:var(--tb-space-sm);
}

.location-page .park-map-wrap{
  padding-bottom:var(--tb-space-md);
}

.location-page .park-map-wrap + .travel-section{
  padding-top:14px;
}

.location-page .park-map-card.park-map-simple{
  display:block;
  width:100%;
  max-width:none;
  margin:0;
  background:#fff;
  border:1px solid rgba(18,72,96,.14);
  border-radius:18px;
  padding:6px;
  box-shadow:0 8px 22px rgba(25,58,70,.06);
  overflow:hidden;
}

.location-page .park-map-card.park-map-simple > a:first-child{
  display:block;
  padding:0;
  margin:0;
  border:0;
  background:transparent;
  border-radius:0;
  box-shadow:none;
  overflow:hidden;
}

.location-page .park-map-card.park-map-simple img{
  display:block;
  width:100%;
  max-width:100%;
  max-height:none;
  height:auto;
  margin-inline:auto;
}

.location-page .park-map-card.park-map-simple > a:first-child img{
  margin:0;
  border:0;
  border-radius:12px;
  box-shadow:none;
  background:#f7f2e7;
  object-fit:contain;
}

/* ---------- Vervoer ---------- */
.location-page .travel-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
  margin-top:0;
}

.location-page .travel-card{
  padding:var(--tb-space-lg);
  border:1px solid var(--line);
  border-radius:18px;
  background:#fff;
  box-shadow:0 10px 30px rgba(23,63,87,.055);
}

.location-page .travel-card h3{
  font-family:var(--font-display);
  font-size:var(--h3-size,24px);
  font-weight:600;
  letter-spacing:-.006em;
  margin-top:0;
}

.location-page .travel-card a{
  font-weight:700;
  color:var(--navy);
}

.location-page .travel-note{
  margin-top:18px;
}

/* ---------- Tablet: structurele kolomwissel ---------- */
@media(max-width:900px){
  .location-page .location-split{
    grid-template-columns:1fr;
  }

  .location-page .location-split .map{
    min-height:420px;
  }

  .location-page .travel-grid{
    grid-template-columns:1fr;
  }
}

/* ---------- Compact: smalle tablet / mobiel ---------- */
@media(max-width:760px){

  .location-page section.content{
    padding:22px 0;
  }

  .location-page .page-hero + section.content{
    padding-bottom:20px;
  }

  .location-page .location-split{
    gap:20px;
  }

  .location-page .location-split > div > .eyebrow{
    margin:0 0 10px;
  }

  .location-page .location-split > div > h2{
    margin:0 0 20px;
    line-height:1.08;
  }

  .location-page .location-split > div > p{
    margin:0 0 var(--tb-space-md);
  }

  .location-page .location-split > div > p:last-of-type{
    margin-bottom:0;
  }

  .location-page .location-split .notice{
    margin-top:22px;
  }

  .location-page > header{
    top:0;
    z-index:100;
  }

  .location-page .park-map-wrap{
    padding-top:var(--tb-space-md);
  }

  .location-page .travel-section .section-head{
    display:block;
    margin-bottom:18px;
  }

  .location-page .travel-section .section-head h2{
    margin-bottom:var(--tb-space-xs);
  }

  .location-page .travel-section .section-head > p{
    margin:0;
    max-width:none;
    text-align:left;
  }

  .location-page .park-map-card.park-map-simple{
    padding:5px;
  }

  .location-page .travel-grid{
    gap:var(--tb-space-sm);
  }
}

/* ---------- Mobiel staand / smaller breedte ---------- */
@media(max-width:700px){
  .location-page section.content + section.soft.content,
  .location-page section.soft.content + section.content{
    padding-top:40px;
  }

  .location-page .section-head{
    margin-bottom:18px;
  }

  .location-page .park-map-section > .section-head > p{
    margin-top:10px;
  }

  .location-page .travel-note{
    margin-top:var(--tb-space-md);
  }

  .location-page .map-frame{
    padding:var(--tb-space-xs);
  }

  .location-page > header{
    background:#fcfaf5;
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
    box-shadow:0 1px 0 rgba(23,63,87,.10);
  }

  .location-page .travel-section .section-head{
    margin-bottom:var(--tb-space-sm);
  }
}

/* ---------- Extra smal mobiel ---------- */
@media(max-width:560px){
  .location-page .location-split .map{
    min-height:340px;
  }
}

/* Lage landscape-telefoons hebben geen eigen Ligging-override nodig:
   zij gebruiken de breedte-breakpoints hierboven. De centrale
   orientation/height hook blijft sitebreed in style.css beschikbaar. */