:root {
  --brand-navy: #0a1230;
  --brand-blue: #5d8fd8;
  --brand-blue-dark: #3567ad;
  --brand-ice: #eef4fc;
  --brand-text: #20283a;
  --brand-muted: #667085;
  --brand-border: #d7dfeb;
  --bs-primary: var(--brand-blue-dark);
  --bs-primary-rgb: 53, 103, 173;
  --bs-link-color: var(--brand-blue-dark);
  --bs-link-hover-color: var(--brand-navy);
  --bs-focus-ring-color: rgba(53, 103, 173, .28);
}

html { scroll-behavior: smooth; scroll-padding-top: 88px; }
body { color: var(--brand-text); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; line-height: 1.65; background: #fff; }
a { text-underline-offset: .16em; }
img { max-width: 100%; height: auto; }
h1, h2, h3, h4 { color: var(--brand-navy); font-weight: 700; letter-spacing: -.025em; }
h2 { margin-bottom: 1rem; }
.skip-link { position: fixed; z-index: 2000; top: .75rem; left: .75rem; padding: .75rem 1rem; background: #fff; color: var(--brand-navy); border-radius: .5rem; }

#topbar { min-height: 42px; display: flex; align-items: center; background: var(--brand-blue); color: #fff; font-weight: 650; }
#topbar a { color: #fff; text-decoration: none; }
.social-link { display: inline-grid; place-items: center; width: 32px; height: 32px; border: 1px solid rgba(255,255,255,.5); border-radius: 50%; transition: background-color .2s ease, transform .2s ease; }
.social-link:hover, .social-link:focus-visible { background: var(--brand-navy); transform: translateY(-1px); }

.navbar { min-height: 78px; background: var(--brand-navy); box-shadow: 0 10px 30px rgba(10,18,48,.14); }
.navbar-brand img { display: block; }
.navbar .nav-link { color: rgba(255,255,255,.82); font-weight: 600; padding: 1.7rem .9rem; border-bottom: 3px solid transparent; }
.navbar .nav-link:hover, .navbar .nav-link:focus-visible, .navbar .nav-link.active { color: #fff; background: rgba(93,143,216,.14); border-bottom-color: var(--brand-blue); }
.navbar-toggler { border-color: rgba(255,255,255,.35); }

section { padding-block: clamp(3rem, 6vw, 5rem); }
.row.no-pad { margin-inline: 0; }
.homebg, .subbg { position: relative; display: flex; align-items: center; min-height: clamp(320px, 48vw, 540px); background-position: center; background-repeat: no-repeat; background-size: cover; isolation: isolate; }
.homebg::before, .subbg::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(10,18,48,.72), rgba(10,18,48,.12)); }
.homebg { background-image: url('../../img/headers/home.jpg'); }
.subbg { min-height: clamp(250px, 34vw, 400px); }
.prijzenbg, .huisregelsbg, .faqbg { background-image: url('../../img/headers/home.jpg'); }
.contactbg { background-image: url('../../img/headers/contact.jpg'); }
.homeheader, .subheader { max-width: 950px; margin: 0 auto; padding: clamp(1.3rem, 4vw, 2.4rem); color: #fff; text-align: center; font-size: clamp(2rem, 5vw, 3.6rem); line-height: 1.12; border: 1px solid rgba(255,255,255,.65); border-radius: 1rem; background: rgba(10,18,48,.65); backdrop-filter: blur(5px); box-shadow: 0 20px 60px rgba(0,0,0,.22); }
.subheader { font-size: clamp(2rem, 4vw, 3rem); }
.parallax-window { min-height: 300px; background: url('../../img/divider/divider1.jpg') center / cover fixed; }

.customlistcheck { list-style: none; padding: 0; }
.customlistcheck li { position: relative; padding: .35rem 0 .35rem 1.75rem; }
.customlistcheck li::before { content: "✓"; position: absolute; left: 0; color: var(--brand-blue-dark); font-weight: 900; }
.contact-card { margin-top: 1.5rem; padding: 1.75rem; border: 1px solid var(--brand-border); border-radius: 1rem; background: var(--brand-ice); }
.picgroupleft, .picgroupmiddle, .picgroupright { padding-inline: .35rem; }
.picgroupleft > .row, .picgroupmiddle > .row, .picgroupright > .row { margin-inline: 0; }
.picgroupleft img, .picgroupmiddle img, .picgroupright img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: .8rem; }

.btn-client, .btn-primary { --bs-btn-color: #fff; --bs-btn-bg: var(--brand-blue-dark); --bs-btn-border-color: var(--brand-blue-dark); --bs-btn-hover-color: #fff; --bs-btn-hover-bg: var(--brand-navy); --bs-btn-hover-border-color: var(--brand-navy); --bs-btn-focus-shadow-rgb: 53,103,173; --bs-btn-active-bg: var(--brand-navy); --bs-btn-active-border-color: var(--brand-navy); padding: .72rem 1.2rem; font-weight: 700; border-radius: .6rem; }
.form-control, .form-select { min-height: 48px; border-color: var(--brand-border); border-radius: .55rem; }
textarea.form-control { min-height: 150px; }
.form-control:focus, .form-select:focus { border-color: var(--brand-blue-dark); box-shadow: 0 0 0 .25rem var(--bs-focus-ring-color); }
.form-group { margin-bottom: 1rem; }
.robo { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; overflow: hidden; }

.prijstabel { overflow: hidden; border-color: var(--brand-border); border-radius: .75rem; }
.prijstabel thead th { color: #fff; background: var(--brand-navy); border-color: rgba(255,255,255,.15); }
.prijstabel tbody tr:nth-child(even) td { background: var(--brand-ice); }
.prijstabel th, .prijstabel td { padding: .9rem; text-align: center; vertical-align: middle; }

.panel { margin-bottom: .75rem; overflow: hidden; border: 1px solid var(--brand-border); border-radius: .75rem; background: #fff; }
.panel-heading { padding: 1rem 1.2rem; background: var(--brand-ice); }
.panel-title { margin: 0; font-size: 1.05rem; }
.panel-body { padding: 1.2rem; }
.panellink { display: block; color: var(--brand-navy); text-decoration: none; }
.panellink:hover .panel-heading { background: #dfeafb; }
.overtreding { margin-top: 1.5rem; padding: 1.25rem; text-align: center; color: #9f1b24; background: #fff2f3; border: 1px solid #efb9bd; border-radius: .75rem; }
.maps { width: 100%; min-height: 375px; border: 0; border-radius: .8rem; }

.site-footer { padding: 3.5rem 0 1.25rem; color: rgba(255,255,255,.84); background: var(--brand-navy); }
.site-footer h2 { color: #fff; }
.site-footer a { color: #fff; }
.site-footer address { font-style: normal; }
.opening-hours { max-width: 290px; }
.opening-hours-wide { max-width: 420px; }
.opening-hours div { display: flex; justify-content: space-between; gap: 1rem; }
.opening-hours dt { font-weight: 500; }
.opening-hours dd { margin: 0; }
.footer-nav { display: grid; justify-content: start; gap: .25rem; }
.footer-bottom { display: flex; justify-content: space-between; gap: 1rem; margin-top: 2.5rem; padding-top: 1rem; border-top: 1px solid rgba(255,255,255,.2); }
.toast-container { right: 0 !important; max-width: 100vw; }

/* Tijdelijke weergavecompatibiliteit voor inhoud die uit Bootstrap 3 is gemigreerd. */
.img-responsive { display: block; max-width: 100%; height: auto; }
.center-block { margin-inline: auto; }
.text-right { text-align: right; }
.btn-block { display: block; width: 100%; }
.pull-right { float: right; }
.hidden-xs { display: none; }
.col-xs-4 { flex: 0 0 auto; width: 33.33333333%; }
.col-xs-12 { flex: 0 0 auto; width: 100%; }
.col-lg-offset-1 { margin-left: 8.33333333%; }
.col-md-offset-3 { margin-left: 25%; }
.col-sm-offset-2 { margin-left: 16.66666667%; }

@media (min-width: 768px) { .hidden-xs { display: block; } }
@media (max-width: 991.98px) {
  .navbar .nav-link { padding: .8rem 0; border-bottom-width: 1px; }
  .navbar-collapse { padding-block: .5rem 1rem; }
  .col-lg-offset-1, .col-md-offset-3 { margin-left: 0; }
}
@media (max-width: 767.98px) {
  section { padding-block: 3rem; }
  .homebg::before, .subbg::before { background: rgba(10,18,48,.55); }
  .parallax-window { min-height: 220px; background-attachment: scroll; }
  .text-right { text-align: left; }
  .footer-bottom { flex-direction: column; }
  .col-sm-offset-2 { margin-left: 0; }
}