/* reCAPTCHA v3-badge sitebreed verbergen (attributie-notitie staat bij de formulieren) */
.grecaptcha-badge{ visibility:hidden !important; }

/* Verberg de standaard-Astra-footer (kaal menu + oude copyright) */
#colophon .site-primary-footer-wrap,
#colophon .site-below-footer-wrap { display:none !important; }
#colophon { border:0 !important; }

/* ---- Nieuwe footer ---- */
.da-footer{ background:linear-gradient(180deg,#16305c 0%,#0f2140 100%); color:#c9d4e6; font-size:15px; line-height:1.6; }
.da-footer *{ box-sizing:border-box; }
.da-footer-inner{ max-width:1180px; margin:0 auto; padding:56px 22px 40px; display:grid; grid-template-columns:1.3fr 1fr 1fr 1fr; gap:38px; }
.da-fh{ color:#fff; font-size:16px; font-weight:700; margin:0 0 16px; letter-spacing:.02em; position:relative; padding-bottom:10px; }
.da-fh::after{ content:""; position:absolute; left:0; bottom:0; width:34px; height:3px; background:#f4b400; border-radius:2px; }
.da-flist{ list-style:none; margin:0; padding:0; }
.da-flist li{ margin:0 0 11px; }
.da-footer a{ color:#c9d4e6; text-decoration:none; transition:color .18s; }
.da-footer a:hover{ color:#f4b400; }

.da-fbrand-top{ display:flex; align-items:center; gap:13px; margin-bottom:16px; }
.da-fbrand-top img{ border-radius:50%; background:#fff; padding:2px; flex:0 0 auto; }
.da-fname{ display:block; color:#fff; font-weight:800; font-size:19px; line-height:1.15; }
.da-ftag{ display:block; color:#9fb0c9; font-size:12px; text-transform:uppercase; letter-spacing:.08em; }
.da-fabout{ margin:0 0 18px; color:#aebdd4; font-size:14px; max-width:32ch; }
.da-fsocial{ display:flex; gap:10px; }
.da-fsocial a{ width:38px; height:38px; border-radius:50%; background:rgba(255,255,255,.08); display:inline-flex; align-items:center; justify-content:center; color:#fff; transition:background .18s,transform .18s; }
.da-fsocial a:hover{ background:#f4b400; color:#16305c; transform:translateY(-2px); }

.da-fcontact li{ display:flex; align-items:flex-start; gap:11px; }
.da-fcontact svg{ width:18px; height:18px; flex:0 0 18px; margin-top:3px; color:#f4b400; }
.da-fhours li{ display:flex; justify-content:space-between; gap:12px; border-bottom:1px solid rgba(255,255,255,.08); padding-bottom:9px; }
.da-fhours .da-ftime{ color:#fff; font-weight:600; white-space:nowrap; }
.da-fcta{ display:inline-block; margin-top:18px; background:#f4b400; color:#16305c !important; font-weight:700; padding:11px 20px; border-radius:9px; transition:background .18s,transform .18s; }
.da-fcta:hover{ background:#ffc824; color:#16305c !important; transform:translateY(-2px); }
.da-flinks li{ margin-bottom:9px; }

.da-footer-legal{ border-top:1px solid rgba(255,255,255,.1); }
.da-legal-inner{ max-width:1180px; margin:0 auto; padding:18px 22px; display:flex; flex-wrap:wrap; gap:10px 22px; justify-content:space-between; align-items:center; font-size:13px; color:#93a4bf; }
.da-legal-links{ display:flex; flex-wrap:wrap; gap:6px 18px; }
.da-legal-links a{ color:#93a4bf; font-size:13px; }

@media (max-width:1024px){ .da-footer-inner{ grid-template-columns:1fr 1fr; gap:32px; } }
@media (max-width:560px){
	.da-footer-inner{ grid-template-columns:1fr; padding:40px 20px 28px; gap:28px; }
	.da-legal-inner{ flex-direction:column; align-items:flex-start; text-align:left; }
}

/* ==========================================================================
 * HEADER — premium navy i.p.v. het drukke auto-achtergrondplaatje
 * ========================================================================== */
.ast-primary-header-bar.main-header-bar,
.ast-primary-header-bar{
	background-image:none !important;
	background-color:transparent !important;
	background:linear-gradient(118deg,#0b1d3a 0%,#16305c 55%,#1b3767 100%) !important;
	border-bottom:1px solid rgba(255,255,255,.10) !important;
	box-shadow:0 4px 22px rgba(8,18,38,.34) !important;
}
/* subtiele lichtglans rechtsboven voor diepte (GEEN overflow:hidden — dat knipt de dropdown af) */
.ast-primary-header-bar.main-header-bar{ position:relative; }
.ast-primary-header-bar.main-header-bar::after{
	content:""; position:absolute; inset:0; pointer-events:none; z-index:0;
	background:radial-gradient(130% 200% at 88% -60%, rgba(255,255,255,.10), rgba(255,255,255,0) 55%),
	           linear-gradient(to left, rgba(11,29,58,.55) 0%, rgba(11,29,58,.18) 34%, rgba(11,29,58,0) 62%);
}
/* Sportauto-lineart rechts (zwarte lijnen -> wit via invert + screen-blend) */
.ast-primary-header-bar.main-header-bar::before{
	content:""; position:absolute; top:-6%; bottom:-6%; right:-10px; width:min(700px,54%);
	background:url("https://www.dannyautoschade.nl/wp-content/uploads/2026/08/lineart-sportauto-klein-1.jpg") no-repeat right center / contain;
	filter:invert(1); mix-blend-mode:screen; opacity:.42; pointer-events:none; z-index:0;
	-webkit-mask-image:linear-gradient(to left,#000 60%,transparent 100%);
	mask-image:linear-gradient(to left,#000 60%,transparent 100%);
}
@media (max-width:921px){ .ast-primary-header-bar.main-header-bar::before{ display:none; } }
.ast-primary-header-bar.main-header-bar > *{ position:relative; z-index:1; }

/* Naam + slogan */
#masthead .site-title, #masthead .site-title a{ color:#ffffff !important; font-weight:800 !important; letter-spacing:.01em; }
#masthead .site-description{ color:#9fb4d6 !important; text-transform:uppercase; letter-spacing:.14em; font-size:11px !important; }

/* ---- Logo + bedrijfsnaam: strakke merk-lockup ---- */
/* losse <br>'s in het brand-blok slopen de verticale ritmiek — overal weg */
#masthead .header-info br, #masthead .header-brand br{ display:none !important; }

#masthead .header-title{ color:#ffffff !important; font-weight:800 !important; line-height:1.05 !important; letter-spacing:-.015em !important; text-shadow:0 1px 2px rgba(0,0,0,.25); }
#masthead .header-slogan{ color:#a9bcdc !important; font-weight:600 !important; text-transform:uppercase; letter-spacing:.17em; line-height:1 !important; }

/* logo-embleem: schoon, iets groter, subtiele diepte */
#masthead .custom-logo{ border-radius:50% !important; box-shadow:0 0 0 1px rgba(255,255,255,.20), 0 6px 16px rgba(0,0,0,.32) !important; transition:transform .2s ease; }
#masthead .custom-logo-link:hover .custom-logo{ transform:translateY(-1px) scale(1.02); }

@media (min-width:922px){
	#masthead .header-brand{
		display:flex !important; flex-direction:column; justify-content:center; gap:5px;
		padding-left:18px !important; margin-left:4px;
		border-left:1px solid rgba(255,255,255,.16);
		min-height:60px;
	}
	#masthead .header-title{ font-size:28px !important; }
	#masthead .header-slogan{ font-size:11px !important; }
	#masthead .custom-logo{ width:78px !important; height:auto !important; }
	/* telefoon-pill compacter zodat de lockup rustiger oogt */
	#masthead a.header-tel, #masthead .header-tel a{ font-size:14.5px !important; padding:8px 16px !important; }
	/* de oude site-CSS trok de pill met margin-top:-25px omhoog (was afgestemd op de <br>'s
	   die we nu weghalen) -> reset, anders overlapt hij de slogan */
	#masthead .header-info{ gap:10px !important; align-items:flex-start; }
	/* pill uitlijnen met de bedrijfsnaam (brand heeft 18px padding + 4px marge) */
	#masthead .header-info .header-tel{ margin-top:0 !important; align-self:flex-start; margin-left:22px !important; }
}

/* Mobiele/tablet header (<=921px): telefoon-pill + slogan weg — die overlapten de bedrijfsnaam.
   Bellen kan via de sticky balk en de hero. Titel blijft als schone, enkele regel. */
@media (max-width:921px){
	#masthead .ast-mobile-header-wrap .header-tel,
	#masthead .ast-mobile-header-wrap .header-slogan{ display:none !important; }
	#masthead .ast-mobile-header-wrap .header-info,
	#masthead .ast-mobile-header-wrap .header-brand{ display:flex !important; align-items:center; min-height:0 !important; }
	#masthead .ast-mobile-header-wrap .header-title{ font-size:18px !important; line-height:1.15 !important; white-space:nowrap; }
	#masthead .ast-mobile-header-wrap .custom-logo{ width:52px !important; height:auto !important; }
}

/* Logo-embleem: subtiele gouden ring */
#masthead .custom-logo{ border-radius:50% !important; box-shadow:0 0 0 1px rgba(255,255,255,.18), 0 4px 12px rgba(0,0,0,.28); }

/* Telefoon-pill (gouden call-to-action) */
#masthead a.header-tel, #masthead .header-tel a, #masthead .header-tel{
	background:#ffffff !important; color:#16305c !important; font-weight:700 !important;
	padding:9px 18px !important; border-radius:40px !important; box-shadow:0 3px 12px rgba(0,0,0,.20);
	transition:transform .18s, box-shadow .18s; display:inline-flex !important; align-items:center; gap:7px;
}
#masthead a.header-tel:hover, #masthead .header-tel a:hover{ transform:translateY(-1px); box-shadow:0 6px 16px rgba(0,0,0,.26); }

/* Hoofd-navigatie: gouden hover-underline */
#masthead .main-header-menu > .menu-item > .menu-link{ color:#e9f0fb !important; font-weight:600 !important; position:relative; }
/* compactere nav zodat 7 items op laptopbreedtes op een regel blijven */
@media (min-width:922px){
	#masthead .main-header-menu > .menu-item > .menu-link{ padding-left:11px !important; padding-right:11px !important; font-size:14.5px !important; letter-spacing:-.005em; }
	#masthead .main-header-menu > .menu-item > .menu-link::after{ left:11px; right:11px; }
}
/* smalle laptops/tablets: extra compact zodat de nav niet naar 2 regels breekt */
@media (min-width:922px) and (max-width:1220px){
	#masthead .main-header-menu > .menu-item > .menu-link{ padding-left:8px !important; padding-right:8px !important; font-size:13.5px !important; }
	#masthead .main-header-menu > .menu-item > .menu-link::after{ left:8px; right:8px; }
	#masthead .header-title{ font-size:24px !important; }
	#masthead .custom-logo{ width:66px !important; }
}
#masthead .main-header-menu > .menu-item > .menu-link::after{
	content:""; position:absolute; left:14px; right:14px; bottom:8px; height:2px; background:rgba(255,255,255,.9);
	transform:scaleX(0); transform-origin:left; transition:transform .22s ease;
}
#masthead .main-header-menu > .menu-item:hover > .menu-link,
#masthead .main-header-menu > .current-menu-item > .menu-link,
#masthead .main-header-menu > .current-menu-ancestor > .menu-link{ color:#ffffff !important; }
#masthead .main-header-menu > .menu-item:hover > .menu-link::after{ transform:scaleX(1); }
/* enige gouden touch in de header: de underline van de actieve pagina */
#masthead .main-header-menu > .current-menu-item > .menu-link::after,
#masthead .main-header-menu > .current-menu-ancestor > .menu-link::after{ transform:scaleX(1); background:#f4b400; }

/* Dropdown-submenu's (voor de nette menu-structuur) */
#masthead .main-header-menu .sub-menu{
	background:#0f2140 !important; border-top:3px solid #f4b400 !important; border-radius:0 0 12px 12px !important;
	box-shadow:0 16px 34px rgba(8,18,38,.40) !important; padding:8px 0 !important; min-width:238px !important;
}
#masthead .main-header-menu .sub-menu .menu-link{ color:#d9e2f4 !important; padding:11px 20px !important; font-weight:500 !important; }
#masthead .main-header-menu .sub-menu .menu-item:hover > .menu-link,
#masthead .main-header-menu .sub-menu .current-menu-item > .menu-link{ background:rgba(255,255,255,.07) !important; color:#ffffff !important; }
#masthead .main-header-menu .menu-item-has-children > .menu-link .ast-icon{ color:rgba(255,255,255,.7) !important; }

/* ==========================================================================
 * SERVICE/LOCATIE-PAGINA DESIGN (.da-svc) — één gedeeld systeem, sitebreed
 * ========================================================================== */
body:has(.da-svc) .entry-header,
body:has(.da-svc) .ast-title-bar,
body:has(.da-svc) .ast-single-post-title{ display:none !important; }
.da-svc{ color:#33415a; }
.da-svc *{ box-sizing:border-box; }
.da-svc-hero{ background:linear-gradient(120deg,#0b1d3a 0%,#16305c 58%,#1d3c72 100%); color:#fff; padding:48px 30px; border-radius:16px; margin:0 0 36px; box-shadow:0 12px 34px rgba(11,29,58,.22); }
.da-svc-hero h1{ color:#fff !important; font-size:clamp(27px,4vw,40px); line-height:1.12; margin:0 0 14px; }
.da-svc-hero p{ color:#cfdcf0; font-size:17px; line-height:1.6; max-width:62ch; margin:0 0 22px; }
.da-svc-cta{ display:inline-block; background:#f4b400; color:#16305c !important; font-weight:800; padding:13px 26px; border-radius:10px; text-decoration:none; transition:transform .18s,background .18s; }
.da-svc-cta:hover{ background:#ffc824; transform:translateY(-2px); color:#16305c !important; }
.da-svc-lead{ font-size:18px; line-height:1.75; color:#33415a; max-width:72ch; margin:0 0 8px; }
.da-svc h2{ color:#16305c; font-size:clamp(21px,2.6vw,26px); margin:36px 0 14px; }
.da-svc h3{ color:#16305c; }
.da-svc p{ line-height:1.75; }
.da-svc-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin:22px 0; }
.da-svc-card{ background:#f6f8fc; border:1px solid #e6ecf5; border-radius:12px; padding:22px; }
.da-svc-card h3{ margin:0 0 8px; font-size:17px; }
.da-svc-card p{ margin:0; font-size:14.5px; color:#516079; }
.da-svc-steps{ counter-reset:s; list-style:none; padding:0; margin:22px 0; }
.da-svc-steps li{ position:relative; padding:2px 0 20px 56px; }
.da-svc-steps li strong{ color:#16305c; }
.da-svc-steps li::before{ counter-increment:s; content:counter(s); position:absolute; left:0; top:0; width:38px; height:38px; background:#16305c; color:#fff; border-radius:50%; display:flex; align-items:center; justify-content:center; font-weight:700; }
.da-svc-check{ list-style:none; padding:0; margin:18px 0; }
.da-svc-check li{ padding-left:30px; position:relative; margin-bottom:11px; line-height:1.55; }
.da-svc-check li::before{ content:"\2713"; position:absolute; left:0; top:0; color:#f4b400; font-weight:800; }
.da-svc-ctaband{ background:linear-gradient(120deg,#16305c,#1d3c72); color:#fff; border-radius:14px; padding:32px 28px; text-align:center; margin:38px 0 10px; }
.da-svc-ctaband h2{ color:#fff; margin:0 0 10px; }
.da-svc-ctaband p{ color:#cfdcf0; margin:0 0 20px; }
.da-svc-faq{ margin:22px 0; }
.da-svc-faq details{ border:1px solid #e6ecf5; border-radius:10px; padding:14px 18px; margin-bottom:12px; background:#fff; }
.da-svc-faq summary{ font-weight:700; color:#16305c; cursor:pointer; }
.da-svc-faq details p{ margin:10px 0 0; color:#516079; }
.da-svc-related{ display:flex; flex-wrap:wrap; gap:10px; margin-top:14px; }
.da-svc-related a{ background:#eef2f9; color:#16305c !important; padding:9px 15px; border-radius:8px; text-decoration:none; font-weight:600; font-size:14px; transition:background .18s; }
.da-svc-related a:hover{ background:#f4b400; }
/* Beeld-componenten */
.da-svc-figure{ margin:26px 0; }
.da-svc-figure img{ width:100%; height:auto; display:block; border-radius:14px; box-shadow:0 10px 28px rgba(11,29,58,.16); }
.da-svc-figure figcaption{ margin-top:9px; font-size:13.5px; color:#6b7a93; }
.da-svc-split{ display:grid; grid-template-columns:1fr 1fr; gap:26px; align-items:center; margin:30px 0; }
/* vaste hoogte i.p.v. height:100% — dat klapt dicht in een grid met align-items:center */
.da-svc-split img{ width:100%; height:300px; object-fit:cover; display:block; border-radius:14px; box-shadow:0 10px 28px rgba(11,29,58,.16); }
.da-svc-split h2{ margin-top:0; }
.da-svc-ba{ display:grid; grid-template-columns:1fr 1fr; gap:18px; margin:26px 0; }
.da-svc-ba figure{ margin:0; }
.da-svc-ba img{ width:100%; height:230px; object-fit:cover; display:block; border-radius:12px; box-shadow:0 8px 22px rgba(11,29,58,.14); }
.da-svc-ba figcaption{ margin-top:8px; font-size:13px; font-weight:700; color:#16305c; text-transform:uppercase; letter-spacing:.06em; }
@media (max-width:800px){
	.da-svc-grid{ grid-template-columns:1fr; } .da-svc-hero{ padding:34px 22px; }
	.da-svc-split{ grid-template-columns:1fr; } .da-svc-split img{ height:220px; }
	.da-svc-ba{ grid-template-columns:1fr; } .da-svc-ba img{ height:200px; }
}

/* ==========================================================================
 * SAMENHANG: oude pagina-stijlen (.da-phero / .da-sp / .da-lhero / .da-related)
 * optrekken naar dezelfde designtaal als de nieuwe .da-svc-pagina's.
 * ========================================================================== */

/* Hero's: zelfde gradient, radius en schaduw als .da-svc-hero */
.da-phero{
	background:linear-gradient(120deg,#0b1d3a 0%,#16305c 58%,#1d3c72 100%) !important;
	border-radius:16px !important;
	box-shadow:0 12px 34px rgba(11,29,58,.22) !important;
}
.da-lhero{
	background:linear-gradient(120deg,#16305c 0%,#1d3c72 100%) !important;
	border-radius:16px !important;
	box-shadow:0 10px 26px rgba(11,29,58,.18) !important;
}

/* Knoppen: van 30px-pillen naar de rustige 10px-radius van .da-svc-cta */
.da-phero .g, .da-sp .b1, .da-rating-strip a[class]{
	background:#f4b400 !important; color:#16305c !important; font-weight:800 !important;
	border-radius:10px !important; box-shadow:none !important;
	transition:transform .18s, background .18s !important;
}
.da-phero .g:hover, .da-sp .b1:hover{ background:#ffc824 !important; transform:translateY(-2px); }
.da-phero .o, .da-sp .b2{
	border-radius:10px !important; border:1px solid rgba(255,255,255,.55) !important;
	font-weight:700 !important; transition:background .18s, transform .18s !important;
}
.da-phero .o:hover, .da-sp .b2:hover{ background:rgba(255,255,255,.12) !important; transform:translateY(-2px); }

/* Kaarten: zelfde rustige vlak-op-vlak stijl als .da-svc-card */
.da-sp .card{
	background:#f6f8fc !important; border:1px solid #e6ecf5 !important;
	border-radius:12px !important; box-shadow:none !important;
}

/* Stapnummers: zelfde navy cirkel als .da-svc-steps */
.da-sp .num{ background:#16305c !important; color:#fff !important; border-radius:50% !important; font-weight:700 !important; }

/* CTA-band: zelfde gradient/radius als .da-svc-ctaband */
.da-sp .cta2{
	background:linear-gradient(120deg,#16305c,#1d3c72) !important;
	border-radius:14px !important; box-shadow:none !important;
}

/* Checklist-vinkjes in dezelfde gouden accentkleur */
.da-sp .chk li::before, .da-sp .c::before{ color:#f4b400 !important; }

/* "Meer van Danny Autoschade": van witte blokken naar dezelfde pillen als .da-svc-related */
.da-related a{
	background:#eef2f9 !important; color:#16305c !important;
	border-radius:8px !important; padding:9px 15px !important;
	font-weight:600 !important; font-size:14px !important; box-shadow:none !important;
	border:0 !important; transition:background .18s !important;
}
.da-related a:hover{ background:#f4b400 !important; color:#16305c !important; }
.da-related{ display:flex !important; flex-wrap:wrap; gap:10px !important; }

/* Gedeelde koptypografie op alle pagina's */
.da-sp h2, .da-svc h2{ color:#16305c; letter-spacing:-.01em; }

/* ---- Compacte mobiele CTA-balk (.da-mbar) ---- */
.da-mbar{ padding:7px 8px !important; gap:8px !important; background:#0f2140 !important; box-shadow:0 -3px 14px rgba(0,0,0,.22) !important; border-top:1px solid rgba(255,255,255,.08) !important; }
.da-mbar a{ height:auto !important; min-height:0 !important; padding:9px 6px !important; font-size:12.5px !important; font-weight:600 !important; gap:7px !important; border-radius:10px !important; flex-direction:row !important; align-items:center !important; justify-content:center !important; line-height:1 !important; }
.da-mbar a svg{ width:17px !important; height:17px !important; min-width:17px !important; flex:0 0 17px !important; }
/* zorg dat de footer-legalbalk niet achter de sticky balk verdwijnt op mobiel */
@media (max-width:921px){
	.da-footer-legal{ padding-bottom:64px; }
	/* jump-up-knop + WhatsApp-float boven de sticky CTA-balk tillen zodat ze niet bedekt worden */
	#ast-scroll-top{ bottom:70px !important; }
	.joinchat.joinchat--left,
	.joinchat{ bottom:74px !important; }
}

/* Procesrij: drie foto's naast elkaar met bijschrift (bv. afplakken -> grondlaag -> gespoten) */
.da-proces{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin:26px 0; }
.da-proces figure{ margin:0; }
.da-proces img{ width:100%; height:210px; object-fit:cover; display:block; border-radius:12px; box-shadow:0 8px 22px rgba(11,29,58,.14); }
.da-proces figcaption{ margin-top:9px; font-size:13px; font-weight:700; color:#16305c; }
.da-proces .stap{ display:inline-block; background:#16305c; color:#fff; width:22px; height:22px; border-radius:50%; text-align:center; line-height:22px; font-size:12px; margin-right:7px; }
@media (max-width:800px){ .da-proces{ grid-template-columns:1fr; } .da-proces img{ height:220px; } }

/* ==========================================================================
 * BASISREGELS die eerder per pagina inline stonden (blok "da-header-enh").
 * Die inline-blokken zijn verwijderd; hier horen ze thuis — sitebreed en gecachet.
 * ========================================================================== */

/* Vaste header op desktop */
@media (min-width:922px){
	#masthead{ position:-webkit-sticky; position:sticky; top:0; z-index:999; }
}

/* Mobiele CTA-balk: alleen op mobiel, vast onderaan */
.da-mbar{ display:none; }
@media (max-width:921px){
	.da-mbar{ display:flex; position:fixed; left:0; right:0; bottom:0; z-index:9998; }
	.da-mbar a{ flex:1 1 0; display:flex; align-items:center; justify-content:center; text-decoration:none; }
	.da-mbar .call{ background:#16305c; color:#fff; }
	.da-mbar .wa{ background:#25d366; color:#fff; }
	.da-mbar .quote{ background:#f4b400; color:#3a2c00; }
}

/* Mobiel uitklapmenu: Astra geeft een lichtgrijze achtergrond, onze links zijn wit
   -> onleesbaar. Daarom hier expliciet donker maken (hoge specificiteit nodig). */
@media (max-width:921px){
	#masthead .ast-mobile-header-wrap .main-header-menu,
	#masthead .ast-mobile-header-wrap .main-navigation{ background:#0f2246 !important; }
	#masthead .ast-mobile-header-wrap .main-header-menu .menu-item .menu-link{
		color:#ffffff !important; border-top:1px solid rgba(255,255,255,.10) !important;
	}
	#masthead .ast-mobile-header-wrap .main-header-menu .menu-item .menu-link:hover,
	#masthead .ast-mobile-header-wrap .main-header-menu .current-menu-item > .menu-link{
		color:#f4b400 !important; background:rgba(255,255,255,.06) !important;
	}
	#masthead .main-header-menu-toggle{ border:1.5px solid rgba(255,255,255,.55); border-radius:9px; outline:none; }
}

/* ==========================================================================
 * Header-actieknop — concurrenten (Schadenet, ASN) hebben er ook een.
 * ========================================================================== */
@media (min-width:922px){
	/* het laatste menu-item wordt een knop i.p.v. een linkje */
	#masthead .main-header-menu > .da-nav-cta > .menu-link{
		background:#f4b400; color:#16305c !important; font-weight:800 !important;
		border-radius:9px; padding:9px 18px !important; margin-left:10px;
		transition:background .18s, transform .18s;
	}
	#masthead .main-header-menu > .da-nav-cta > .menu-link:hover{ background:#ffc824; transform:translateY(-1px); }
	#masthead .main-header-menu > .da-nav-cta > .menu-link::after{ display:none; }  /* geen onderstreping op een knop */

	/* naam en telefoon naast elkaar i.p.v. gestapeld -> lagere, strakkere header */
	#masthead .header-info{ flex-direction:row !important; align-items:center; gap:16px !important; }
	#masthead .header-info .header-tel{ margin-left:0 !important; }
}

/* op mobiel blijft het een gewoon menu-item, maar wel duidelijk gemarkeerd */
@media (max-width:921px){
	#masthead .ast-mobile-header-wrap .main-header-menu > .da-nav-cta > .menu-link{
		color:#f4b400 !important; font-weight:800 !important;
	}
}

/* Header compacter zodat logo, naam, telefoon en 8 menu-items op een regel passen */
@media (min-width:922px){
	#masthead .custom-logo{ width:64px !important; }
	#masthead .header-title{ font-size:24px !important; }
	#masthead .main-header-menu > .menu-item > .menu-link{ padding-left:9px !important; padding-right:9px !important; font-size:14px !important; }
	#masthead .main-header-menu > .menu-item > .menu-link::after{ left:9px; right:9px; }
	#masthead .main-header-menu > .da-nav-cta > .menu-link{ padding:8px 15px !important; font-size:14px !important; }
}

/* Smallere desktopschermen: telefoon-pill uit de header halen zodat het menu
   op een regel past. Bellen kan via de knop, de hero en de mobiele balk. */
@media (min-width:922px) and (max-width:1399px){
	#masthead .header-info .header-tel{ display:none !important; }
	#masthead .main-header-menu > .menu-item > .menu-link{ padding-left:7px !important; padding-right:7px !important; font-size:13.5px !important; }
	#masthead .main-header-menu > .menu-item > .menu-link::after{ left:7px; right:7px; }
	#masthead .main-header-menu > .da-nav-cta > .menu-link{ padding:8px 13px !important; }
	#masthead .header-title{ font-size:22px !important; }
	#masthead .custom-logo{ width:56px !important; }
}

/* Smalle desktopschermen (tot 1200px): alleen het logo tonen, geen bedrijfsnaam.
   Anders past het menu van 8 items niet op een regel. Schadenet doet hetzelfde. */
@media (min-width:922px) and (max-width:1199px){
	#masthead .header-brand{ display:none !important; }
	#masthead .custom-logo{ width:52px !important; }
}

/* Telefoon-pill verticaal midden in de balk (stond nog op flex-start uit de
   tijd dat naam en telefoon onder elkaar stonden). */
@media (min-width:922px){
	#masthead .header-info .header-tel{ align-self:center !important; margin-top:0 !important; margin-bottom:0 !important; }
}
