/* Global */
html { font-size: 13px !important; }
.site-content,.content-area,.entry-content,main,.container,.wrapper,.page-content { max-width: 1400px !important; margin-left: auto !important; margin-right: auto !important; }

/* ===== HEADER ===== */
.site-header { padding: 0.3rem 0 !important; box-shadow: 0 1px 3px rgba(0,0,0,0.08) !important; }
.site-header nav { align-items: center !important; }
.site-header .logo { padding: 0 !important; margin: 0 !important; line-height: 0 !important; }
.site-header .logo a { display: flex !important; align-items: center !important; }
.logo-svg { height: 42px !important; width: auto !important; }
.site-header .nav-links a,.site-header nav a { font-size: 0.85rem !important; font-weight: 500 !important; letter-spacing: 0.3px !important; padding: 0.3rem 0.7rem !important; }
.site-header .nav-links a:hover,.site-header nav a:hover { color: #9B140F !important; }
.site-header .current-menu-item a,.site-header .nav-links a.active { color: #9B140F !important; }
@media (max-width: 768px) { .logo-svg { height: 36px !important; } }
.site-description,.site-tagline,.custom-logo-tagline,header .tagline,.header-tagline { display: none !important; }
.logo,.logo a,.logo svg { overflow: visible !important; clip-path: none !important; }
header,.site-header,#masthead,.header-inner,.nav-wrapper,nav { overflow: visible !important; clip-path: none !important; }

/* Contact form */
.contact-form input[type="text"],.contact-form input[type="email"],.contact-form input[type="tel"],.contact-form select,.contact-form textarea { width: 100% !important; padding: 10px !important; border: 1px solid #ccc !important; border-radius: 4px !important; font-size: 1rem !important; margin-top: 0.4rem !important; box-sizing: border-box !important; display: block !important; }
.contact-form .form-group { margin-bottom: 1rem !important; }
.contact-form label { font-weight: 600 !important; display: block !important; margin-bottom: 0.3rem !important; }

/* Leanforms buttons */
.card a[href*="leanforms"] { display: inline-block !important; background: #8B0000 !important; color: #fff !important; padding: 12px 24px !important; border-radius: 5px !important; text-decoration: none !important; font-weight: bold !important; margin-top: 1rem !important; text-align: center !important; width: 100% !important; box-sizing: border-box !important; transition: background 0.3s !important; }
.card a[href*="leanforms"]:hover { background: #a00000 !important; }

/* Spacing */
.section-header { margin-bottom: 3rem !important; }
.section-header + .cards-grid,.section-header + .job-listing { margin-top: 2rem !important; }
.cards-grid + .section-header,.job-listing + .section-header,.info-box + .section-header,.benefits-section + .section-header,.values-section + .section-header { margin-top: 5rem !important; }
.info-box { max-width: 100% !important; width: 100% !important; }
.mission-section { max-width: 100% !important; width: 100% !important; box-sizing: border-box !important; }

/* Cards */
.card { cursor: default !important; transition: none !important; border: 1px solid #e0e0e0 !important; box-shadow: none !important; }
.card:hover { transform: none !important; box-shadow: none !important; border: 1px solid #e0e0e0 !important; outline: none !important; background: inherit !important; }

/* ===== HERO BADGES ===== */
.hero-badges-left { position: absolute !important; left: 2.5rem !important; top: 50% !important; transform: translateY(-50%) !important; z-index: 10 !important; display: flex !important; flex-direction: column !important; gap: 0.6rem !important; }
.hero-badges-left a { display: block !important; background: rgba(155,20,15,0.85) !important; color: #fff !important; padding: 0.55rem 1.1rem !important; border-radius: 6px !important; font-size: 0.82rem !important; font-weight: 700 !important; text-decoration: none !important; letter-spacing: 0.5px !important; border: 1px solid rgba(255,255,255,0.15) !important; white-space: nowrap !important; }
.hero-badges-left a:hover { background: rgba(155,20,15,1) !important; }
@media (max-width: 1100px) {
  .hero-badges-left { position: static !important; transform: none !important; flex-direction: row !important; flex-wrap: wrap !important; justify-content: center !important; margin: 0 auto 1.5rem !important; padding: 0 1rem !important; gap: 0.5rem !important; max-width: 750px !important; }
  .hero h1 { font-size: 2.2rem !important; }
}
@media (max-width: 600px) {
  .hero-badges-left a { font-size: 0.65rem !important; padding: 0.3rem 0.6rem !important; }
  .hero h1 { font-size: 1.6rem !important; }
}

/* ===== HERO SCROLL INDICATOR ===== */
.hero-scroll-indicator { position: absolute; bottom: 2rem; left: 50%; transform: translateX(-50%); z-index: 10; opacity: 0.7; animation: hero-bounce 2s ease infinite; }
@keyframes hero-bounce { 0%,20%,50%,80%,100% { transform: translateX(-50%) translateY(0); } 40% { transform: translateX(-50%) translateY(8px); } 60% { transform: translateX(-50%) translateY(4px); } }
@media (max-width: 900px) { .step-arrow { display: none !important; } }

/* ===== CERTIFICATEN ===== */
.cert-details { border: 1px solid #e0e0e0; border-radius: 12px; overflow: hidden; margin-bottom: 1rem; transition: border-color 0.2s; }
.cert-details:hover { border-color: #9B140F; box-shadow: 0 4px 20px rgba(155,20,15,0.1); }
.cert-details summary { padding: 1.8rem 2rem; cursor: pointer; list-style: none; position: relative; }
.cert-details summary::-webkit-details-marker { display: none; }
.cert-details summary::after { content: '▼'; position: absolute; right: 2rem; top: 50%; transform: translateY(-50%); color: #9B140F; font-size: 0.9rem; transition: transform 0.2s; }
.cert-details[open] summary::after { transform: translateY(-50%) rotate(180deg); }
.cert-details[open] { border-color: #9B140F; }
.cert-details-content { padding: 0 2rem 2rem; border-top: 1px solid #eee; }
.download-btn { display: inline-block; background: #9B140F; color: #fff !important; padding: 0.7rem 1.5rem; border-radius: 8px; text-decoration: none; font-weight: 600; margin-top: 0.5rem; margin-right: 0.5rem; font-size: 0.9rem; }
.download-btn:hover { background: #7D0F0C; }
.download-btn-dark { background: #333 !important; }
.download-btn-dark:hover { background: #555 !important; }

/* ===== SERVICE: VERTICALE FLOW ===== */
.sf-flow { max-width: 1000px; margin: 0 auto; }
.sf-step { display: grid; grid-template-columns: 100px 1fr; gap: 0; align-items: start; margin-bottom: 0; }
.sf-left { display: flex; flex-direction: column; align-items: center; }
.sf-icon { width: 72px; height: 72px; border-radius: 50%; background: rgba(155,20,15,0.08); flex-shrink: 0; z-index: 2; background-repeat: no-repeat; background-position: center; background-size: 32px 32px; }
.sf-icon-1 { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24' fill='none' stroke='%239B140F' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z'/%3E%3Cpolyline points='14 2 14 8 20 8'/%3E%3Cline x1='16' y1='13' x2='8' y2='13'/%3E%3Cline x1='16' y1='17' x2='8' y2='17'/%3E%3C/svg%3E"); }
.sf-icon-2 { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24' fill='none' stroke='%239B140F' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3Cpath d='M8 11l2 2 4-4'/%3E%3C/svg%3E"); }
.sf-icon-3 { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24' fill='none' stroke='%239B140F' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 11.08V12a10 10 0 1 1-5.93-9.14'/%3E%3Cpolyline points='22 4 12 14.01 9 11.01'/%3E%3C/svg%3E"); }
.sf-line { width: 3px; background: #e0e0e0; flex-grow: 1; min-height: 40px; }
.sf-arrow-down { width: 20px; height: 20px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M10 2v14M4 12l6 6 6-6' stroke='%239B140F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: center; margin: 0.3rem 0; }
.sf-right { padding: 0.8rem 0 2rem 2rem; }
.sf-badge { display: inline-block; background: #9B140F; color: #fff; font-size: 0.75rem; font-weight: 700; padding: 0.25rem 0.9rem; border-radius: 50px; margin-bottom: 0.8rem; }
.sf-title { font-size: 1.4rem; font-weight: 700; color: #1a1a1a; margin-bottom: 0.5rem; }
.sf-desc { font-size: 1rem; color: #555; line-height: 1.6; margin-bottom: 1.2rem; max-width: 550px; }
.sf-detail-wrapper { position: relative; padding-left: 2rem; border-left: 2px dashed #9B140F; }
.sf-detail { border: 1px solid #e0e0e0; border-radius: 12px; overflow: hidden; transition: border-color 0.2s, box-shadow 0.2s; }
.sf-detail:hover { border-color: #9B140F; box-shadow: 0 2px 12px rgba(155,20,15,0.08); }
.sf-detail summary { padding: 1.2rem 1.5rem; cursor: pointer; list-style: none; position: relative; font-weight: 600; color: #1a1a1a; font-size: 1rem; padding-right: 3rem; }
.sf-detail summary::-webkit-details-marker { display: none; }
.sf-detail summary::after { content: '▼'; position: absolute; right: 1.5rem; top: 50%; transform: translateY(-50%); color: #9B140F; font-size: 0.8rem; transition: transform 0.2s; }
.sf-detail[open] summary::after { transform: translateY(-50%) rotate(180deg); }
.sf-detail[open] { border-color: #9B140F; }
.sf-detail-content { padding: 0 1.5rem 1.5rem; }
.sf-detail-content p { color: #555; line-height: 1.7; font-size: 0.95rem; margin-bottom: 0.8rem; }
/* Waarde iconen */
.sf-val-icon { width: 52px; height: 52px; border-radius: 10px; background-color: rgba(155,20,15,0.08); background-repeat: no-repeat; background-position: center; background-size: 24px 24px; margin: 0 auto 1.2rem; }
.sf-val-speed { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%239B140F' stroke-width='1.8'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpolyline points='12 6 12 12 16 14'/%3E%3C/svg%3E"); }
.sf-val-trust { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%239B140F' stroke-width='1.8'%3E%3Cpath d='M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z'/%3E%3C/svg%3E"); }
.sf-val-trans { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%239B140F' stroke-width='1.8'%3E%3Cpath d='M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E"); }
.sf-val-trace { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%239B140F' stroke-width='1.8'%3E%3Cpath d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z'/%3E%3Cpolyline points='14 2 14 8 20 8'/%3E%3Cline x1='16' y1='13' x2='8' y2='13'/%3E%3Cline x1='16' y1='17' x2='8' y2='17'/%3E%3C/svg%3E"); }
@media (max-width: 700px) {
  .sf-step { grid-template-columns: 60px 1fr; }
  .sf-icon { width: 56px; height: 56px; background-size: 24px 24px; }
  .sf-right { padding-left: 1rem; }
  .sf-title { font-size: 1.2rem; }
  .sf-detail-wrapper { padding-left: 1rem; }
}

/* ===== DIENSTEN PAGINA ===== */
.dienst-icon { width: 56px; height: 56px; border-radius: 12px; background-color: rgba(155,20,15,0.08); background-repeat: no-repeat; background-position: center; background-size: 28px 28px; margin-bottom: 1.2rem; }
/* Moersleutel/druk */
.dienst-icon-druk { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 24 24' fill='none' stroke='%239B140F' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94l-3.76 3.76z'/%3E%3C/svg%3E"); }
/* Container/tank */
.dienst-icon-tank { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 24 24' fill='none' stroke='%239B140F' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 12A10 10 0 0 0 12 2v10z'/%3E%3Cpath d='M12 2a10 10 0 0 0 0 20 10 10 0 0 0 10-10'/%3E%3Cline x1='12' y1='12' x2='12' y2='22'/%3E%3C/svg%3E"); }
/* Globe/extern */
.dienst-icon-tpi { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 24 24' fill='none' stroke='%239B140F' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cline x1='2' y1='12' x2='22' y2='12'/%3E%3Cpath d='M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z'/%3E%3C/svg%3E"); }
/* Sub-type iconen (inline, klein) */
.sub-item { display: flex; align-items: flex-start; gap: 1rem; margin-bottom: 1.2rem; padding: 1rem 1.2rem; background: #f9f9f9; border-radius: 8px; }
.sub-icon { width: 36px; height: 36px; border-radius: 8px; background-color: rgba(155,20,15,0.08); background-repeat: no-repeat; background-position: center; background-size: 18px 18px; flex-shrink: 0; }
/* Plus/nieuwbouw */
.sub-icon-new { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%239B140F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='12' y1='5' x2='12' y2='19'/%3E%3Cline x1='5' y1='12' x2='19' y2='12'/%3E%3C/svg%3E"); }
/* Refresh/herkeuring */
.sub-icon-recheck { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%239B140F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='23 4 23 10 17 10'/%3E%3Cpath d='M20.49 15a9 9 0 1 1-2.12-9.36L23 10'/%3E%3C/svg%3E"); }
/* Wrench/reparatie */
.sub-icon-repair { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%239B140F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94l-3.76 3.76z'/%3E%3C/svg%3E"); }
/* Edit/wijziging */
.sub-icon-change { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%239B140F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7'/%3E%3Cpath d='M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z'/%3E%3C/svg%3E"); }
/* Arrow-right/intrede */
.sub-icon-entry { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%239B140F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 3h4a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-4'/%3E%3Cpolyline points='10 17 15 12 10 7'/%3E%3Cline x1='15' y1='12' x2='3' y2='12'/%3E%3C/svg%3E"); }
/* Award/conformiteit */
.sub-icon-cert { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%239B140F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='7'/%3E%3Cpolyline points='8.21 13.89 7 23 12 20 17 23 15.79 13.88'/%3E%3C/svg%3E"); }
/* Gebruikers/TPI */
.sub-icon-users { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%239B140F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cpath d='M23 21v-2a4 4 0 0 0-3-3.87'/%3E%3Cpath d='M16 3.13a4 4 0 0 1 0 7.75'/%3E%3C/svg%3E"); }
.sub-item-text h4 { font-size: 1rem; font-weight: 700; color: #1a1a1a; margin-bottom: 0.3rem; }
.sub-item-text p { font-size: 0.9rem; color: #555; line-height: 1.6; margin: 0; }

/* ===== GOOGLE MAPS FULL WIDTH ===== */
.maps-fullwidth { width: 100vw !important; position: relative !important; left: 50% !important; right: 50% !important; margin-left: -50vw !important; margin-right: -50vw !important; margin-top: 3rem !important; margin-bottom: 3rem !important; }
.maps-fullwidth iframe { width: 100% !important; height: 400px !important; display: block !important; border: 0 !important; }