/*
Theme Name: Takeldienst247
Theme URI: https://takeldienst247.nl/
Author: Takeldienst247.nl
Author URI: https://takeldienst247.nl/
Description: Conversiegerichte, volledig aanpasbare WordPress-website voor een 24/7 takeldienst.
Version: 1.0.0
Requires at least: 6.2
Requires PHP: 7.4
Text Domain: takeldienst247
*/

:root { --td-primary:#0F1E36; --td-accent:#F59E0B; --td-emergency:#DC2626; --td-success:#16A34A; --td-text:#0B1C30; --td-muted:#64748B; --td-surface:#F8F9FF; --td-subtle:#F8FAFC; --td-border:#E2E8F0; --td-charcoal:#111827; --td-shadow:0 1px 3px rgba(15,30,54,.08),0 1px 2px rgba(15,30,54,.06); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--td-surface); color:var(--td-text); font-family:'Manrope',system-ui,sans-serif; font-size:16px; line-height:1.5; padding-bottom:0; }
body.admin-bar .td247-header { top:32px; }
a { color:inherit; text-decoration:none; }
a:focus-visible, button:focus-visible { outline:3px solid var(--td-accent); outline-offset:3px; }
img { max-width:100%; height:auto; }
button { font:inherit; }
.td247-container { width:min(1200px,calc(100% - 2rem)); margin-inline:auto; }
.td247-mobile-only { display:none; }
.screen-reader-text,.td247-skip-link { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.td247-skip-link:focus { clip:auto; width:auto; height:auto; margin:0; top:8px; left:8px; z-index:100; padding:10px 14px; background:#fff; color:var(--td-primary); }
.material-symbols-outlined { font-family:'Material Symbols Outlined'; font-weight:normal; font-style:normal; font-size:1.25em; line-height:1; letter-spacing:normal; text-transform:none; display:inline-block; white-space:nowrap; word-wrap:normal; direction:ltr; -webkit-font-feature-settings:'liga'; -webkit-font-smoothing:antialiased; font-feature-settings:'liga'; }
.td247-whatsapp-icon { width:20px; height:20px; flex:none; object-fit:contain; }

.td247-emergency-bar { position:relative; z-index:20; padding:9px 0; color:#fff; background:var(--td-emergency); font-size:13px; }
.td247-emergency-inner { display:flex; justify-content:space-between; align-items:center; gap:16px; }
.td247-emergency-inner p { display:flex; align-items:center; gap:8px; margin:0; }
.td247-pulse-dot,.td247-dot { display:inline-block; width:9px; height:9px; flex:none; border-radius:50%; }
.td247-pulse-dot { background:#fff; animation:td247-pulse 2s ease-in-out infinite; }
.td247-dot-amber { background:var(--td-accent); animation:td247-pulse 2s ease-in-out infinite; }
.td247-dot-red { background:var(--td-emergency); animation:td247-pulse 2s ease-in-out infinite; }
.td247-emergency-link { display:inline-flex; align-items:center; gap:6px; padding:6px 12px; border-radius:999px; color:var(--td-emergency); background:#fff; font-weight:800; font-size:12px; text-transform:uppercase; letter-spacing:.04em; }
.td247-header { position:sticky; top:0; z-index:15; background:#fff; border-bottom:1px solid var(--td-border); box-shadow:0 1px 3px rgba(15,30,54,.04); }
.td247-header-inner { display:flex; min-height:78px; align-items:center; justify-content:space-between; gap:24px; }
.td247-brand { display:flex; align-items:center; flex:none; }
.td247-brand img { display:block; width:auto; max-width:230px; height:50px; object-fit:contain; }
.td247-desktop-nav { margin-left:auto; }
.td247-menu { display:flex; align-items:center; gap:28px; margin:0; padding:0; list-style:none; }
.td247-menu a { color:var(--td-primary); font-weight:700; font-size:14px; transition:color .15s ease; }
.td247-menu a:hover { color:var(--td-emergency); }
.td247-header-actions { display:flex; align-items:center; gap:10px; }
.td247-button { display:inline-flex; min-height:42px; align-items:center; justify-content:center; gap:8px; padding:10px 16px; border:0; border-radius:8px; font-weight:800; font-size:14px; line-height:1.2; cursor:pointer; transition:transform .15s ease,background .15s ease,box-shadow .15s ease; }
.td247-button:hover { transform:translateY(-1px); box-shadow:0 5px 12px rgba(15,30,54,.12); }
.td247-button-danger { background:var(--td-emergency); color:#fff; }
.td247-button-danger:hover { background:#b91c1c; }
.td247-button-whatsapp { background:var(--td-success); color:#fff; }
.td247-button-whatsapp:hover { background:#15803d; }
.td247-button-large { min-height:48px; flex:0 1 auto; padding:11px 14px; font-size:14px; }
.td247-menu-toggle { display:none; width:42px; height:42px; padding:0; border:1px solid var(--td-border); border-radius:8px; color:var(--td-primary); background:var(--td-subtle); cursor:pointer; }
.td247-mobile-menu { border-top:1px solid var(--td-border); background:#fff; padding:20px 0; }
.td247-mobile-menu .td247-menu { flex-direction:column; align-items:stretch; gap:0; margin-bottom:18px; }
.td247-mobile-menu .td247-menu li { border-bottom:1px solid var(--td-border); }
.td247-mobile-menu .td247-menu a { display:block; padding:13px 0; }

.td247-hero { overflow:hidden; border-bottom:1px solid var(--td-border); background:#fff; }
.td247-hero-grid { display:grid; grid-template-columns:minmax(0,7fr) minmax(340px,5fr); gap:44px; align-items:center; padding-top:64px; padding-bottom:64px; }
.td247-hero-content { display:flex; flex-direction:column; align-items:flex-start; gap:20px; }
.td247-status-badge,.td247-status-pill,.td247-cta-badge { display:inline-flex; align-items:center; gap:9px; border-radius:999px; font-size:12px; font-weight:800; letter-spacing:.03em; }
.td247-status-badge { padding:8px 13px; border:1px solid var(--td-accent); background:#fffbeb; }
.td247-hero h1 { max-width:750px; margin:0; color:var(--td-primary); font-size:clamp(2.1rem,4vw,3.55rem); line-height:1.12; letter-spacing:-.045em; font-weight:800; }
.td247-lead { max-width:710px; margin:0; color:#334155; font-size:18px; line-height:1.6; }
.td247-dispatch-card { width:100%; padding:24px; border:1px solid var(--td-border); border-radius:14px; background:var(--td-subtle); box-shadow:var(--td-shadow); }
.td247-dispatch-head { display:flex; align-items:center; justify-content:space-between; gap:16px; padding-bottom:16px; border-bottom:1px solid var(--td-border); }
.td247-dispatch-head h2 { display:flex; align-items:center; gap:9px; margin:0; color:var(--td-primary); font-size:18px; line-height:1.3; }
.td247-dispatch-head h2 .material-symbols-outlined { color:var(--td-emergency); }
.td247-status-pill { padding:7px 10px; border:1px solid rgba(220,38,38,.2); color:var(--td-emergency); background:rgba(220,38,38,.08); white-space:nowrap; }
.td247-action-row { display:flex; gap:12px; margin-top:16px; }
.td247-proof-list { display:flex; flex-wrap:wrap; gap:10px 18px; padding-top:16px; margin-top:16px; border-top:1px solid rgba(226,232,240,.8); color:#334155; font-size:12px; }
.td247-proof-list span,.td247-trust-row span { display:inline-flex; align-items:center; gap:5px; }
.td247-proof-list .material-symbols-outlined,.td247-trust-row .material-symbols-outlined { color:var(--td-success); font-size:17px; }
.td247-trust-row { display:flex; flex-wrap:wrap; gap:9px; }
.td247-trust-row span { padding:8px 10px; border:1px solid var(--td-border); border-radius:7px; background:#fff; color:var(--td-primary); font-size:12px; font-weight:800; box-shadow:var(--td-shadow); }
.td247-trust-row span:nth-child(2) .material-symbols-outlined { color:var(--td-accent); }
.td247-trust-row span:nth-child(3) .material-symbols-outlined { color:var(--td-primary); }
.td247-hero-media { min-width:0; }
.td247-hero-image-wrap { position:relative; min-height:480px; overflow:hidden; border-radius:18px; background:var(--td-charcoal); box-shadow:0 12px 30px rgba(15,30,54,.13); }
.td247-hero-image-wrap:after { position:absolute; inset:0; z-index:1; content:''; pointer-events:none; background:linear-gradient(180deg,rgba(15,30,54,.1),transparent 40%,rgba(15,30,54,.86)); }
.td247-hero-image { width:100%; height:100%; min-height:480px; object-fit:cover; transition:transform .4s ease; }
.td247-hero-image-wrap:hover .td247-hero-image { transform:scale(1.03); }
.td247-image-response { position:absolute; z-index:2; top:16px; left:16px; display:inline-flex; align-items:center; gap:8px; padding:9px 12px; border:1px solid rgba(255,255,255,.12); border-radius:8px; color:#fff; background:rgba(15,30,54,.88); font-size:12px; font-weight:800; }
.td247-image-card { position:absolute; z-index:2; right:16px; bottom:16px; left:16px; display:flex; align-items:center; gap:12px; padding:13px; border:1px solid var(--td-border); border-radius:12px; background:rgba(255,255,255,.95); }
.td247-image-card div { display:flex; flex-direction:column; min-width:0; }
.td247-image-card strong { color:var(--td-primary); font-size:13px; }
.td247-image-card small { color:var(--td-muted); font-size:11px; }
.td247-image-card b { margin-left:auto; padding:5px 8px; border-radius:5px; color:#fff; background:var(--td-primary); font-size:11px; white-space:nowrap; }
.td247-icon-square { display:inline-flex; width:44px; height:44px; flex:none; align-items:center; justify-content:center; border-radius:10px; }
.td247-icon-amber { color:var(--td-primary); background:rgba(245,158,11,.18); }
.td247-icon-red { color:var(--td-emergency); background:rgba(220,38,38,.1); }
.td247-icon-navy { color:var(--td-primary); background:rgba(15,30,54,.1); }
.td247-icon-green { color:var(--td-success); background:rgba(22,163,74,.1); }

.td247-usp-section { padding:32px 0; border-bottom:1px solid var(--td-border); background:var(--td-subtle); }
.td247-usp-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.td247-usp-card { display:flex; gap:12px; padding:18px; border:1px solid var(--td-border); border-radius:12px; background:#fff; }
.td247-usp-card h2 { margin:0 0 3px; color:var(--td-primary); font-size:15px; line-height:1.35; }
.td247-usp-card p { margin:0; color:#475569; font-size:13px; line-height:1.5; }
.td247-section { padding:68px 0; border-bottom:1px solid var(--td-border); background:#fff; }
.td247-section-subtle { background:var(--td-subtle); }
.td247-section-heading { margin-bottom:40px; }
.td247-section-heading-split { display:grid; grid-template-columns:minmax(0,1fr) minmax(280px,420px); align-items:end; gap:36px; }
.td247-section-heading-centered { max-width:760px; margin-right:auto; margin-left:auto; text-align:center; }
.td247-eyebrow { display:block; margin-bottom:9px; color:var(--td-accent); font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.12em; }
.td247-eyebrow-red { color:var(--td-emergency); }
.td247-section h2 { margin:0; color:var(--td-primary); font-size:clamp(1.75rem,3vw,2.35rem); line-height:1.2; letter-spacing:-.03em; }
.td247-section-heading p { margin:0; color:#475569; font-size:16px; line-height:1.6; }
.td247-services-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.td247-service-card { display:flex; min-height:390px; flex-direction:column; justify-content:space-between; padding:26px; border:1px solid var(--td-border); border-radius:15px; background:var(--td-subtle); transition:box-shadow .2s ease,transform .2s ease; }
.td247-service-card:hover { transform:translateY(-3px); box-shadow:0 12px 24px rgba(15,30,54,.09); }
.td247-service-icon { display:inline-flex; width:48px; height:48px; align-items:center; justify-content:center; margin-bottom:18px; border-radius:11px; color:#fff; background:var(--td-primary); }
.td247-service-icon-1,.td247-service-icon-5 { background:var(--td-emergency); }
.td247-service-icon-3 { color:var(--td-primary); background:var(--td-accent); }
.td247-service-icon-4 { background:#334155; }
.td247-service-card h3 { margin:0 0 8px; color:var(--td-primary); font-size:19px; line-height:1.35; }
.td247-service-card p { margin:0 0 18px; color:#475569; font-size:14px; line-height:1.6; }
.td247-service-card ul { display:grid; gap:8px; margin:0; padding:0; list-style:none; color:#1e293b; font-size:12px; }
.td247-service-card li { display:flex; gap:7px; align-items:flex-start; }
.td247-service-card li .material-symbols-outlined { color:var(--td-success); font-size:16px; }
.td247-service-footer { display:flex; align-items:center; justify-content:space-between; gap:12px; padding-top:18px; margin-top:22px; border-top:1px solid var(--td-border); }
.td247-service-footer a { display:inline-flex; align-items:center; gap:3px; color:var(--td-emergency); font-size:12px; font-weight:800; }
.td247-service-footer a:hover { text-decoration:underline; }
.td247-gallery-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.td247-gallery-card { overflow:hidden; border:1px solid var(--td-border); border-radius:12px; background:#fff; box-shadow:var(--td-shadow); }
.td247-gallery-image { position:relative; aspect-ratio:4/3; overflow:hidden; background:var(--td-primary); }
.td247-gallery-image img { width:100%; height:100%; object-fit:cover; transition:transform .3s ease; }
.td247-gallery-card:hover img { transform:scale(1.04); }
.td247-gallery-image span { position:absolute; top:10px; right:10px; padding:5px 8px; border-radius:5px; color:#fff; background:rgba(15,30,54,.85); font-size:10px; font-weight:800; text-transform:capitalize; }
.td247-gallery-copy { padding:14px; }
.td247-gallery-copy > div { display:flex; align-items:flex-start; justify-content:space-between; gap:8px; }
.td247-gallery-copy h3 { margin:0; color:var(--td-primary); font-size:14px; line-height:1.35; }
.td247-gallery-copy strong { color:var(--td-success); font-size:10px; text-align:right; }
.td247-gallery-copy p { margin:7px 0 0; color:#64748B; font-size:11px; line-height:1.5; }
.td247-gallery-callout { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:20px; margin-top:36px; border-radius:14px; color:#fff; background:var(--td-primary); }
.td247-gallery-callout-copy { display:flex; align-items:center; gap:13px; }
.td247-gallery-callout h3 { margin:0 0 3px; color:#fff; font-size:15px; }
.td247-gallery-callout p { margin:0; color:#cbd5e1; font-size:12px; }
.td247-process-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.td247-process-card { padding:24px; border:1px solid var(--td-border); border-radius:12px; background:var(--td-subtle); }
.td247-step-number { display:flex; width:40px; height:40px; align-items:center; justify-content:center; margin-bottom:15px; border-radius:50%; color:#fff; background:var(--td-primary); font-weight:800; }
.td247-process-card h3 { margin:0 0 7px; color:var(--td-primary); font-size:17px; }
.td247-process-card p { margin:0; color:#475569; font-size:13px; line-height:1.6; }
.td247-cta { position:relative; overflow:hidden; padding:68px 0; color:#fff; background:var(--td-charcoal); }
.td247-cta-inner { display:flex; flex-direction:column; align-items:center; text-align:center; }
.td247-cta-badge { margin-bottom:14px; padding:7px 11px; border:1px solid rgba(220,38,38,.45); color:#fca5a5; background:rgba(220,38,38,.14); }
.td247-cta h2 { max-width:850px; margin:0 0 12px; color:#fff; font-size:clamp(1.9rem,4vw,3rem); line-height:1.15; letter-spacing:-.035em; }
.td247-cta p { max-width:650px; margin:0; color:#cbd5e1; font-size:17px; line-height:1.6; }
.td247-action-row-centered { width:min(100%,680px); justify-content:center; margin-top:28px; }
.td247-cta-points { display:flex; flex-wrap:wrap; justify-content:center; gap:10px 24px; margin-top:24px; color:#94a3b8; font-size:12px; }
.td247-footer { color:#fff; background:var(--td-charcoal); border-top:1px solid #1e293b; }
.td247-footer-inner { display:flex; align-items:center; justify-content:space-between; gap:32px; padding:36px 0 28px; }
.td247-footer-brand { max-width:520px; }
.td247-footer-logo { display:inline-flex; padding:6px 10px; margin-bottom:10px; border-radius:7px; background:#fff; }
.td247-footer-logo img { width:auto; height:38px; object-fit:contain; }
.td247-footer-brand p { margin:0; color:#94a3b8; font-size:12px; }
.td247-footer-links { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px 22px; color:#cbd5e1; font-size:13px; }
.td247-footer-links a:hover { color:#fff; text-decoration:underline; }
.td247-footer-links .td247-footer-phone { color:var(--td-accent); font-weight:800; }
.td247-footer-bottom { display:flex; justify-content:space-between; gap:20px; padding:16px 0 24px; border-top:1px solid #1e293b; color:#64748b; font-size:11px; }
.td247-mobile-callbar { display:none; }
.td247-entry { padding:22px 0; border-bottom:1px solid var(--td-border); }
.td247-entry h2 { font-size:1.5rem; }

@keyframes td247-pulse { 0%,100%{transform:scale(.9);opacity:.8} 50%{transform:scale(1.15);opacity:.35} }
@media (max-width:1023px) {
    .td247-desktop-nav { display:none; }
    .td247-menu-toggle { display:inline-flex; align-items:center; justify-content:center; }
    .td247-hero-grid { grid-template-columns:1fr; gap:34px; }
    .td247-hero-media { width:min(100%,620px); margin:auto; }
    .td247-usp-grid { grid-template-columns:repeat(2,1fr); }
    .td247-services-grid { grid-template-columns:repeat(2,1fr); }
    .td247-gallery-grid { grid-template-columns:repeat(2,1fr); }
    .td247-process-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:700px) {
    body { padding-bottom:70px; }
    body.admin-bar .td247-header { top:46px; }
    .td247-container { width:min(100% - 2rem,1200px); }
    .td247-emergency-inner { flex-direction:column; gap:8px; text-align:center; }
    .td247-emergency-inner p { justify-content:center; flex-wrap:wrap; }
    .td247-emergency-link { font-size:11px; }
    .td247-header-inner { min-height:66px; }
    .td247-brand img { max-width:170px; height:42px; }
    .td247-header-actions { gap:6px; }
    .td247-desktop-only { display:none !important; }
    .td247-mobile-only { display:inline; }
    .td247-header-actions > .td247-button { min-height:40px; padding:9px 12px; }
    .td247-hero-grid { padding-top:36px; padding-bottom:40px; }
    .td247-hero-content { gap:16px; }
    .td247-hero h1 { font-size:2.2rem; }
    .td247-lead { font-size:16px; }
    .td247-dispatch-card { padding:18px; }
    .td247-dispatch-head { align-items:flex-start; flex-direction:column; gap:10px; }
    .td247-action-row .td247-button-large { width:100%; }
    .td247-proof-list { flex-direction:column; }
    .td247-trust-row { flex-direction:column; align-items:stretch; width:100%; }
    .td247-hero-image-wrap,.td247-hero-image { min-height:330px; }
    .td247-usp-grid,.td247-services-grid,.td247-gallery-grid,.td247-process-grid { grid-template-columns:1fr; }
    .td247-usp-grid { gap:10px; }
    .td247-usp-card { padding:14px; }
    .td247-section { padding:48px 0; }
    .td247-section-heading,.td247-section-heading-split { display:block; margin-bottom:28px; }
    .td247-section-heading-split > p { margin-top:14px; }
    .td247-service-card { min-height:0; padding:21px; }
    .td247-gallery-callout,.td247-footer-inner,.td247-footer-bottom { align-items:flex-start; flex-direction:column; }
    .td247-gallery-callout .td247-button { width:100%; }
    .td247-footer-inner { gap:22px; }
    .td247-footer-links { justify-content:flex-start; }
    .td247-footer-bottom { gap:7px; }
    .td247-cta { padding:48px 0; }
    .td247-cta p { font-size:15px; }
    .td247-mobile-callbar { position:fixed; z-index:30; right:0; bottom:0; left:0; display:flex; gap:8px; padding:8px; border-top:1px solid rgba(255,255,255,.1); background:rgba(15,30,54,.97); box-shadow:0 -4px 20px rgba(15,30,54,.2); }
    .td247-mobile-whatsapp,.td247-mobile-call { display:flex; height:46px; align-items:center; justify-content:center; border-radius:9px; color:#fff; font-weight:800; }
    .td247-mobile-whatsapp { width:46px; flex:none; background:var(--td-success); }
    .td247-mobile-whatsapp .td247-whatsapp-icon { width:23px; height:23px; }
    .td247-mobile-call { flex:1; gap:7px; background:var(--td-emergency); font-size:13px; }
}