@import url('https://fonts.googleapis.com/css2?family=DM+Mono&family=Manrope:wght@400;500;600;700;800&family=Playfair+Display:ital,wght@0,600;0,700;1,600;1,700&display=swap');

:root { --ink:#101317; --offwhite:#f5f3ef; --white:#fff; --signal:#ff3b30; --slate:#2e3539; --line:rgba(16,19,23,.17); --max:1240px; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; overflow-x:hidden; background:var(--offwhite); color:var(--ink); font-family:Manrope,Arial,sans-serif; font-size:16px; line-height:1.55; }
a { color:inherit; text-decoration:none; }
img { max-width:100%; display:block; }
.wrap { width:min(calc(100% - 64px),var(--max)); margin-inline:auto; }
.sr-only { clip:rect(0,0,0,0); clip-path:inset(50%); height:1px; overflow:hidden; position:absolute; white-space:nowrap; width:1px; }
.skip-link { position:fixed; z-index:99; transform:translateY(-150%); background:var(--white); padding:.75rem 1rem; left:1rem; top:1rem; font-weight:700; }
.skip-link:focus { transform:translateY(0); }
.announcement { min-height:37px; padding:8px 32px; background:var(--ink); color:#f4f3ef; display:flex; align-items:center; justify-content:center; gap:27px; font-size:11px; font-weight:700; letter-spacing:.02em; }
.announcement p { margin:0; }.announcement a { text-decoration:underline; text-underline-offset:3px; }.announcement-dot { display:inline-block; width:6px; height:6px; margin-right:8px; vertical-align:1px; border-radius:50%; background:var(--signal); }
.site-header { height:84px; display:flex; align-items:center; gap:32px; padding:0 max(32px,calc((100% - var(--max))/2)); position:absolute; top:37px; left:0; right:0; z-index:5; color:var(--white); transition:background .2s,color .2s,top .2s; }
.site-header.is-stuck { position:fixed; top:0; height:70px; background:rgba(16,19,23,.97); box-shadow:0 2px 16px rgba(0,0,0,.18); }
.brand { display:block; width:67px; height:67px; flex:0 0 auto; }.brand img { width:100%; height:100%; object-fit:contain; transform:scale(1.42); transform-origin:center; }.site-nav { margin-left:auto; display:flex; gap:30px; align-items:center; }.site-nav a { font-size:13px; font-weight:700; opacity:.9; }.site-nav a:hover { color:#ff817a; }.header-cta { display:inline-flex; align-items:center; gap:8px; border:1px solid rgba(255,255,255,.6); border-radius:999px; padding:10px 16px; font-size:12px; font-weight:800; white-space:nowrap; }.whatsapp-icon { width:17px; height:17px; flex:0 0 auto; }.header-cta:hover { background:var(--white); color:var(--ink); }.menu-toggle { display:none; }
.hero { min-height:730px; position:relative; overflow:hidden; color:var(--white); background:var(--ink); }.hero::before { content:""; position:absolute; inset:0; opacity:.8; background:radial-gradient(circle at 76% 30%,rgba(255,59,48,.21),transparent 29%),linear-gradient(118deg,#11181c 0%,#101317 59%,#1c242a 100%); }.hero-grid { position:absolute; inset:0; opacity:.18; background-image:linear-gradient(rgba(255,255,255,.16) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.16) 1px,transparent 1px); background-size:74px 74px; mask-image:linear-gradient(to right,black,transparent 81%); }.hero-inner { min-height:730px; position:relative; padding-top:190px; display:grid; grid-template-columns:1.1fr .9fr; align-items:center; }.hero-copy { padding-bottom:62px; }.eyebrow,.section-kicker { font-family:"DM Mono",monospace; font-size:11px; letter-spacing:.11em; line-height:1.4; text-transform:uppercase; font-weight:400; }.eyebrow { color:#e3e4e2; }.eyebrow span { width:25px; height:1px; margin:0 10px 3px 0; display:inline-block; background:var(--signal); }.eyebrow b { font:inherit; }.hero h1,.intro h2,.section-heading h2,.process h2,.about h2,.reviews h2,.contact h2 { margin:17px 0 0; font-size:clamp(54px,6.05vw,91px); line-height:.93; letter-spacing:-.072em; font-weight:800; }.hero h1 em,.about h2 em,.contact h2 em { color:#ff6b62; font-family:"Playfair Display",serif; letter-spacing:-.05em; }.hero-lead { max-width:475px; margin:31px 0 0; font-size:17px; line-height:1.75; color:#e0e1df; }.hero-actions { margin-top:32px; display:flex; align-items:center; gap:28px; }.button { display:inline-flex; align-items:center; gap:24px; padding:15px 18px 15px 20px; font-size:13px; line-height:1; font-weight:800; transition:transform .2s, background .2s; }.button:hover { transform:translateY(-2px); }.button span { font-size:19px; line-height:9px; }.button-primary { background:var(--signal); color:var(--white); }.button-primary:hover { background:#ed2117; }.button-dark { background:var(--ink); color:#fff; }.text-link { font-size:12px; font-weight:800; border-bottom:1px solid currentColor; padding-bottom:4px; }.text-link span { margin-left:7px; font-size:17px; }.proof-row { display:flex; align-items:flex-start; gap:31px; margin-top:69px; }.proof-row div { padding-left:15px; border-left:1px solid rgba(255,255,255,.42); display:flex; flex-direction:column; }.proof-row strong { font-size:20px; line-height:1.1; }.proof-row span { margin-top:5px; color:#bfc2c0; font-size:10px; letter-spacing:.02em; }.hero-visual { height:540px; position:relative; align-self:end; }.photo-frame-hero { position:absolute; right:-42px; bottom:0; height:487px; width:380px; overflow:hidden; clip-path:polygon(11% 0,100% 0,100% 94%,89% 100%,0 100%,0 7%); }.photo-frame-hero::after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,rgba(9,11,13,.48),transparent 50%); }.photo-frame-hero img { height:100%; width:100%; object-fit:cover; object-position:center; }.hero-sticker { position:absolute; right:292px; bottom:114px; width:132px; height:132px; border:1px solid rgba(255,255,255,.47); border-radius:50%; background:#e8e5de; color:var(--ink); display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; line-height:1.12; transform:rotate(-9deg); }.hero-sticker span { text-transform:uppercase; font-family:"DM Mono",monospace; font-size:8px; letter-spacing:.08em; }.hero-sticker strong { margin:3px 0; color:var(--signal); font-family:"Playfair Display",serif; font-size:24px; }.vertical-note { position:absolute; right:-28px; top:1px; margin:0; writing-mode:vertical-rl; font-family:"DM Mono",monospace; font-size:9px; letter-spacing:.13em; color:#9da1a0; }
.intro { padding:142px 0 144px; }.section-kicker { margin:0; color:#707474; }.intro-content { display:grid; grid-template-columns:1.15fr .85fr; gap:80px; margin-top:28px; align-items:end; }.intro h2,.section-heading h2,.process h2,.reviews h2 { font-size:clamp(40px,4.4vw,64px); color:var(--ink); }.intro-content div { max-width:440px; font-size:16px; line-height:1.8; color:#505758; }.intro-content p { margin:0 0 18px; }
.services { padding:110px 0 130px; background:#e6e3dd; }.section-heading { position:relative; display:flex; align-items:end; justify-content:space-between; margin-bottom:52px; }.section-heading h2 { margin-top:20px; }.round-link { width:54px; height:54px; display:grid; place-items:center; background:var(--signal); color:#fff; border-radius:50%; font-size:25px; transition:transform .2s; }.round-link:hover { transform:rotate(45deg); }.service-list { border-top:1px solid var(--line); }.service-card { min-height:170px; padding:25px 0; border-bottom:1px solid var(--line); display:grid; grid-template-columns:90px 1fr; gap:20px; position:relative; transition:padding .2s; }.service-card:hover { padding-left:8px; }.service-number { color:#797e7d; font:11px "DM Mono",monospace; }.service-main { display:grid; grid-template-columns:1.1fr .65fr .38fr; gap:25px; align-items:center; }.service-main h3 { margin:0; font-size:27px; letter-spacing:-.05em; line-height:1.06; }.service-main p { max-width:305px; margin:0; color:#59605f; font-size:13px; line-height:1.65; }.service-main a { justify-self:end; white-space:nowrap; font-size:12px; font-weight:800; border-bottom:1px solid; padding-bottom:4px; }.service-main a span { margin-left:8px; font-size:17px; }.featured { min-height:260px; }.service-image { grid-column:3; grid-row:1; position:absolute; top:20px; right:0; height:220px; width:230px; overflow:hidden; }.service-image img { width:100%; height:100%; object-fit:cover; filter:grayscale(1); transition:filter .3s,transform .4s; }.featured:hover .service-image img { filter:none; transform:scale(1.04); }.featured .service-main { grid-template-columns:1fr .9fr 280px; }
.process { padding:150px 0; display:grid; grid-template-columns:.8fr 1.2fr; gap:10vw; align-items:center; }.process-visual { position:relative; width:min(100%,420px); aspect-ratio:1/1.15; overflow:hidden; clip-path:polygon(0 0,93% 0,100% 7%,100% 100%,7% 100%,0 93%); }.process-visual::after { content:"CARPLAY BRABANT"; position:absolute; bottom:14px; left:14px; color:#fff; font:9px "DM Mono",monospace; letter-spacing:.1em; }.process-visual img { width:100%; height:100%; object-fit:cover; }.process h2 { margin-top:17px; }.process ol { list-style:none; padding:0; margin:38px 0 37px; }.process li { display:grid; grid-template-columns:48px 1fr; gap:19px; padding:18px 0; border-top:1px solid var(--line); }.process li:last-child { border-bottom:1px solid var(--line); }.process li>span { padding-top:3px; color:#8a8e8d; font:10px "DM Mono",monospace; }.process li h3 { margin:0; font-size:15px; letter-spacing:-.02em; }.process li p { margin:4px 0 0; color:#656b6b; font-size:13px; }
.about { padding:126px 0 122px; color:#fff; background:var(--ink); position:relative; overflow:hidden; }.about::after { content:"CPB"; position:absolute; right:-.075em; bottom:-.24em; color:rgba(255,255,255,.03); font-size:330px; font-weight:800; line-height:1; letter-spacing:-.1em; }.about-grid { position:relative; z-index:1; display:grid; grid-template-columns:1.17fr .55fr; justify-content:space-between; gap:50px; }.section-kicker-light { color:#b9bcbb; }.about h2 { font-size:clamp(43px,4.8vw,72px); margin:19px 0 30px; }.about-copy>p:not(.section-kicker) { max-width:548px; color:#c7c9c8; font-size:15px; line-height:1.82; }.about-copy .text-link { margin-top:20px; display:inline-block; }.light { color:#fff; }.about-stat { border-left:1px solid rgba(255,255,255,.38); padding:5px 0 0 30px; align-self:end; }.about-stat strong { font-size:100px; letter-spacing:-.09em; line-height:.82; }.about-stat strong span { color:var(--signal); }.about-stat p { width:190px; margin:20px 0 0; color:#bcc0bf; font-size:13px; line-height:1.65; }
.reviews { padding:140px 0; }.review-intro { width:200px; margin:0 7% 6px 0; color:#636868; font-size:13px; line-height:1.65; }.review-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }.review-grid blockquote { min-height:310px; padding:31px 32px 27px; margin:0; background:#e8e5df; display:flex; flex-direction:column; }.review-grid .review-dark { background:#353e42; color:#fff; }.quote-mark { height:42px; color:var(--signal); font:60px "Playfair Display",serif; line-height:1; }.review-grid blockquote>p { margin:16px 0; font-size:15px; letter-spacing:-.012em; line-height:1.7; }.review-grid footer { margin-top:auto; display:flex; flex-direction:column; }.review-grid footer strong { font-size:13px; }.review-grid footer span { color:#727776; font-size:11px; }.review-dark footer span { color:#c0c5c4; }
.projects { padding:35px 0 0; background:#e6e3dd; }.projects-heading { padding-bottom:28px; display:flex; align-items:center; justify-content:space-between; }.project-grid { display:grid; grid-template-columns:repeat(4,1fr); }.project-grid img { aspect-ratio:1; width:100%; object-fit:cover; filter:grayscale(1); transition:filter .3s; }.project-grid img:hover { filter:grayscale(0); }
.contact { padding:139px 0 145px; color:#fff; background:linear-gradient(135deg,#1b2429,var(--ink)); }.contact-inner { text-align:center; display:flex; flex-direction:column; align-items:center; }.contact h2 { margin-top:20px; font-size:clamp(49px,5.9vw,85px); }.contact-inner>p:not(.section-kicker) { max-width:460px; color:#c5c9c8; font-size:16px; line-height:1.7; margin:27px 0 31px; }
.site-footer { background:#0b0d0f; color:#e8e7e2; }.footer-grid { padding:73px 0 66px; display:grid; grid-template-columns:2.2fr 1fr 1.25fr .8fr; gap:30px; }.footer-logo { width:86px; height:86px; object-fit:contain; margin:-12px 0 15px -8px; }.footer-grid p { color:#b1b4b2; font-size:12px; line-height:1.75; margin:0; }.footer-grid a { display:block; width:max-content; margin:0 0 9px; font-size:12px; font-weight:700; }.footer-grid a:hover { color:#ff817a; }.footer-label { margin-bottom:15px!important; color:#fff!important; font:10px "DM Mono",monospace!important; letter-spacing:.1em; text-transform:uppercase; }.footer-bottom { padding:20px 0; border-top:1px solid rgba(255,255,255,.16); display:flex; justify-content:space-between; color:#898d8c; font-size:10px; }.footer-bottom p { margin:0; }.footer-bottom div { display:flex; gap:20px; }.whatsapp-float { position:fixed; z-index:10; right:max(16px,env(safe-area-inset-right)); bottom:max(16px,env(safe-area-inset-bottom)); display:flex; align-items:center; gap:9px; padding:10px 15px 10px 11px; border-radius:999px; background:#25d366; box-shadow:0 5px 20px rgba(0,0,0,.19); color:#fff; font-size:12px; font-weight:800; }.whatsapp-float .whatsapp-icon { width:22px; height:22px; }.whatsapp-float:hover { transform:translateY(-2px); }
@media (max-width:850px) { .wrap { width:min(calc(100% - 40px),var(--max)); }.announcement { padding:8px 20px; justify-content:space-between; font-size:9px; gap:10px; }.announcement p { max-width:72%; }.site-header { top:37px; height:69px; padding:0 20px; }.brand { width:62px;height:62px; }.site-nav { display:none; position:absolute; top:69px; left:0; right:0; padding:21px 20px; background:var(--ink); flex-direction:column; align-items:flex-start; gap:16px; }.site-nav.open { display:flex; }.header-cta { margin-left:auto; font-size:0; border:0; padding:9px; }.header-cta span { font-size:19px; }.menu-toggle { display:flex; border:0; background:transparent; padding:10px 0 10px 8px; gap:5px; flex-direction:column; }.menu-toggle i { height:1px; width:22px; background:#fff; display:block; }.hero { min-height:735px; }.hero-inner { min-height:735px; display:block; padding-top:144px; }.hero-copy { position:relative; z-index:2; padding-bottom:0; }.hero h1 { font-size:clamp(51px,15vw,70px); }.hero-lead { max-width:425px; font-size:15px; }.hero-actions { gap:20px; }.proof-row { margin-top:40px; gap:18px; }.proof-row strong { font-size:16px; }.proof-row span { font-size:8px; }.hero-visual { position:absolute; right:-67px; bottom:0; width:235px; height:390px; opacity:.73; }.photo-frame-hero { right:0; bottom:0; height:355px; width:235px; }.hero-sticker { width:96px; height:96px; right:184px; bottom:107px; }.hero-sticker strong { font-size:18px; }.hero-sticker span { font-size:6px; }.vertical-note { display:none; }.intro { padding:85px 0; }.intro-content { display:block; margin-top:23px; }.intro h2 { font-size:45px; margin-bottom:32px; }.services { padding:78px 0; }.section-heading { margin-bottom:34px; }.section-heading h2 { font-size:42px; }.service-card { grid-template-columns:35px 1fr; padding:20px 0; }.service-main,.featured .service-main { display:block; padding-right:0; }.service-main h3 { font-size:23px; }.service-main p { margin:14px 0; font-size:12px; }.service-main a { display:inline-block; margin-top:2px; }.featured { padding-bottom:201px; min-height:0; }.service-image { top:auto; bottom:0; right:0; width:calc(100% - 55px); height:175px; }.process { padding:80px 0; grid-template-columns:1fr; gap:47px; }.process-visual { width:100%; max-width:none; height:250px; aspect-ratio:auto; }.process h2 { font-size:42px; }.about { padding:82px 0; }.about-grid { grid-template-columns:1fr; gap:50px; }.about h2 { font-size:43px; }.about-stat { padding-left:20px; }.about-stat strong { font-size:80px; }.reviews { padding:84px 0; }.reviews .section-heading { display:block; }.review-intro { width:auto; margin:19px 0 0; }.review-grid { grid-template-columns:1fr; gap:10px; }.review-grid blockquote { min-height:245px; }.project-grid { grid-template-columns:repeat(2,1fr); }.contact { padding:87px 0; }.contact h2 { font-size:54px; }.footer-grid { padding:55px 0 35px; grid-template-columns:1fr 1fr; gap:38px 20px; }.footer-grid>div:first-child { grid-column:span 2; }.footer-bottom { padding:17px 0; display:block; }.footer-bottom div { margin-top:9px; }.whatsapp-float { right:13px; bottom:13px; }.whatsapp-float span { display:none; }.whatsapp-float { padding:12px; width:48px; height:48px; justify-content:center; } }
@media (max-width:390px) { .hero-actions { align-items:flex-start; flex-direction:column; gap:16px; }.proof-row { gap:11px; }.proof-row div { padding-left:9px; }.intro h2,.section-heading h2,.process h2 { font-size:39px; } }

/* De eerste dienst heeft geen afbeelding meer; houd daarom op mobiel geen lege afbeeldingsruimte vrij. */
@media (max-width:850px) { .service-card.featured.no-service-image { padding-bottom:20px; } }

.compatibility { padding:138px 0 122px; background:#f5f3ef; }.compatibility-heading { display:grid; grid-template-columns:1.18fr .82fr; gap:70px; align-items:end; }.compatibility-heading h2 { margin:18px 0 0; font-size:clamp(42px,4.7vw,68px); line-height:.95; letter-spacing:-.065em; }.compatibility-heading>p { max-width:380px; margin:0 0 5px; color:#59605f; font-size:14px; line-height:1.75; }.brand-selector { display:grid; grid-template-columns:repeat(3,1fr); margin-top:61px; border-bottom:1px solid var(--line); }.brand-tab { padding:0 20px 19px 0; border:0; border-bottom:2px solid transparent; background:transparent; color:#777c7b; cursor:pointer; font:700 14px Arial,sans-serif; text-align:left; transition:color .2s,border-color .2s; }.brand-tab:not(:first-child) { padding-left:20px; }.brand-tab span { display:block; margin-top:6px; color:#858a89; font:10px ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing:.02em; }.brand-tab.is-active { border-color:var(--signal); color:var(--ink); }.brand-tab.is-active span { color:#525756; }.brand-panels { padding-top:42px; }.brand-panel-title { display:grid; grid-template-columns:.7fr 1.35fr 1fr; gap:35px; padding-bottom:36px; border-bottom:1px solid var(--line); }.panel-label { margin:0; color:#717675; font:10px ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing:.09em; line-height:1.45; text-transform:uppercase; }.brand-panel-title h3 { margin:0; font-size:25px; line-height:1.1; letter-spacing:-.045em; }.brand-panel-title>p:not(.panel-label) { margin:0; color:#5d6362; font-size:13px; line-height:1.7; }.compat-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; padding:31px 0 28px; border-bottom:1px solid var(--line); }.compat-grid>div { padding-right:30px; }.compat-grid>div+div { padding-left:30px; border-left:1px solid var(--line); }.compat-grid ul { margin:16px 0 0; padding:0; list-style:none; }.compat-grid li { position:relative; padding:7px 0 7px 16px; border-bottom:1px solid rgba(16,19,23,.09); color:#454b4b; font-size:13px; line-height:1.45; }.compat-grid li::before { content:"+"; position:absolute; left:0; color:var(--signal); font-weight:bold; }.panel-footer { display:flex; justify-content:space-between; align-items:center; gap:35px; padding-top:27px; }.panel-footer p { max-width:540px; margin:0; color:#656a69; font-size:12px; line-height:1.7; }.panel-footer strong { color:var(--ink); }.model-list-wrap { padding:31px 0 28px; border-bottom:1px solid var(--line); }.model-list { margin-top:16px; display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid rgba(16,19,23,.1); border-left:1px solid rgba(16,19,23,.1); }.model-list span { min-height:75px; padding:12px; display:flex; flex-direction:column; justify-content:center; border-right:1px solid rgba(16,19,23,.1); border-bottom:1px solid rgba(16,19,23,.1); color:var(--ink); font-size:12px; font-weight:700; line-height:1.3; }.model-list small { margin-top:4px; color:#707574; font-size:9px; font-weight:400; line-height:1.35; }.brand-disclaimer { max-width:850px; margin:58px 0 0; color:#7d8281; font-size:10px; line-height:1.65; }
@media (max-width:850px) { .compatibility { padding:82px 0; }.compatibility-heading { display:block; }.compatibility-heading h2 { font-size:42px; }.compatibility-heading>p { margin-top:23px; }.brand-selector { display:block; margin-top:37px; }.brand-tab { width:100%; display:block; padding:15px 0!important; border-bottom:1px solid var(--line); }.brand-tab.is-active { border-bottom:2px solid var(--signal); }.brand-panels { padding-top:31px; }.brand-panel-title { display:block; padding-bottom:27px; }.brand-panel-title h3 { margin:13px 0 14px; font-size:22px; }.compat-grid { display:block; padding:0; }.compat-grid>div { padding:25px 0; }.compat-grid>div+div { padding-left:0; border-left:0; border-top:1px solid var(--line); }.panel-footer { display:block; padding-top:25px; }.panel-footer .button { margin-top:19px; }.model-list-wrap { padding:24px 0; }.model-list { grid-template-columns:repeat(2,1fr); }.model-list span { min-height:69px; font-size:11px; }.brand-disclaimer { margin-top:38px; } }

.detail-hero { position:relative; min-height:530px; overflow:hidden; color:#fff; background:#111519; }.detail-hero::before { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(16,19,23,.98) 0%,rgba(16,19,23,.84) 42%,rgba(16,19,23,.23) 100%); z-index:1; }.detail-hero::after { content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.12) 1px,transparent 1px); background-size:75px 75px; opacity:.14; z-index:1; }.detail-hero-image { position:absolute; inset:0 0 0 47%; background:center/cover no-repeat; filter:grayscale(.45); }.retrofit-hero .detail-hero-image { background-image:url('assets/audi-interior.jpg'); }.repair-hero .detail-hero-image { background-image:url('assets/carplay-cupra.jpeg'); background-position:center 68%; }.detail-hero-inner { position:relative; z-index:2; min-height:530px; display:flex; flex-direction:column; justify-content:center; padding:145px 0 64px; }.detail-hero .eyebrow { margin:0; }.detail-hero h1 { max-width:800px; margin:18px 0 0; font-size:clamp(51px,6.1vw,88px); line-height:.93; letter-spacing:-.075em; }.detail-hero h1 em { color:#ff6b62; font-family:Georgia,serif; }.detail-hero p:not(.eyebrow) { width:min(100%,530px); margin:29px 0 0; color:#e0e2e0; font-size:16px; line-height:1.75; }.detail-summary { padding:112px 0 110px; }.detail-summary-grid { display:grid; grid-template-columns:1fr 1fr; gap:105px; }.detail-summary h2 { margin:18px 0 0; font-size:clamp(39px,4.3vw,62px); line-height:.96; letter-spacing:-.065em; }.detail-summary-copy { max-width:510px; color:#525958; font-size:16px; line-height:1.82; }.detail-summary-copy p { margin:0 0 19px; }.detail-badges { display:grid; grid-template-columns:repeat(3,1fr); margin-top:67px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }.detail-badge { padding:23px 20px 22px 0; }.detail-badge+.detail-badge { padding-left:20px; border-left:1px solid var(--line); }.detail-badge strong { display:block; font-size:13px; }.detail-badge span { display:block; margin-top:5px; color:#737877; font-size:11px; line-height:1.45; }.detail-solutions { padding:108px 0 120px; background:#e6e3dd; }.detail-solutions-heading { display:flex; align-items:end; justify-content:space-between; gap:40px; margin-bottom:39px; }.detail-solutions-heading h2 { margin:18px 0 0; font-size:clamp(39px,4.3vw,62px); line-height:.96; letter-spacing:-.065em; }.detail-solutions-heading>p { width:320px; margin:0; color:#606665; font-size:13px; line-height:1.7; }.solution-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:17px; }.solution-card { min-height:340px; padding:34px; background:#f6f4ef; display:flex; flex-direction:column; }.solution-index { color:#787d7c; font:10px ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing:.1em; }.solution-card h3 { max-width:390px; margin:49px 0 0; font-size:32px; line-height:1.05; letter-spacing:-.055em; }.solution-card p:not(.solution-index) { max-width:410px; margin:15px 0 0; color:#5c6261; font-size:13px; line-height:1.72; }.solution-price { margin-top:auto; padding-top:24px; color:#ff3b30; font-size:16px; font-weight:800; }.solution-price small { display:block; margin-top:3px; color:#777b7a; font-size:10px; font-weight:400; }.parts-layout { display:grid; grid-template-columns:1.1fr .9fr; gap:17px; }.parts-list { padding:34px; background:#f6f4ef; }.parts-list h3 { margin:17px 0 23px; font-size:32px; line-height:1.05; letter-spacing:-.055em; }.parts-list ul { display:grid; grid-template-columns:repeat(2,1fr); gap:0 27px; padding:0; margin:0; list-style:none; }.parts-list li { padding:11px 0; border-top:1px solid var(--line); color:#434949; font-size:13px; }.parts-list li::before { content:"+"; color:#ff3b30; font-weight:bold; margin-right:9px; }.parts-aside { min-height:100%; padding:34px; color:#fff; background:#333c40; }.parts-aside h3 { margin:17px 0; font-size:28px; line-height:1.07; letter-spacing:-.055em; }.parts-aside p:not(.panel-label) { color:#d2d6d5; font-size:13px; line-height:1.75; }.detail-cta { padding:112px 0; color:#fff; background:#111519; }.detail-cta-inner { display:flex; justify-content:space-between; align-items:center; gap:50px; }.detail-cta h2 { margin:16px 0 0; font-size:clamp(40px,4.8vw,67px); line-height:.95; letter-spacing:-.065em; }.detail-cta h2 em { color:#ff6b62; font-family:Georgia,serif; }.detail-cta-inner>p { max-width:360px; color:#c5c8c7; font-size:14px; line-height:1.75; }
@media (max-width:850px) { .detail-hero { min-height:590px; }.detail-hero::before { background:linear-gradient(0deg,rgba(16,19,23,.98) 8%,rgba(16,19,23,.72) 66%,rgba(16,19,23,.34) 100%); }.detail-hero-image { inset:0; background-position:center!important; }.detail-hero-inner { min-height:590px; padding:147px 0 55px; justify-content:flex-end; }.detail-hero h1 { font-size:52px; }.detail-hero p:not(.eyebrow) { font-size:14px; }.detail-summary { padding:79px 0; }.detail-summary-grid { display:block; }.detail-summary h2 { font-size:41px; margin-bottom:29px; }.detail-summary-copy { font-size:14px; }.detail-badges { grid-template-columns:1fr; margin-top:40px; }.detail-badge,.detail-badge+.detail-badge { padding:16px 0; border-left:0; }.detail-badge+.detail-badge { border-top:1px solid var(--line); }.detail-solutions { padding:78px 0; }.detail-solutions-heading { display:block; margin-bottom:29px; }.detail-solutions-heading h2 { font-size:41px; }.detail-solutions-heading>p { width:auto; margin-top:21px; }.solution-grid,.parts-layout { grid-template-columns:1fr; }.solution-card { min-height:285px; padding:27px; }.solution-card h3,.parts-list h3 { margin-top:36px; font-size:27px; }.parts-list,.parts-aside { padding:27px; }.parts-list ul { grid-template-columns:1fr; }.detail-cta { padding:80px 0; }.detail-cta-inner { display:block; }.detail-cta h2 { font-size:44px; }.detail-cta-inner>p { margin:22px 0 28px; } }
.home-page .compatibility { display:none; }
.featured.no-service-image { min-height:210px; }.featured.no-service-image .service-main { grid-template-columns:1.1fr .75fr .35fr; }.brand-tags { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-top:39px; }.brand-tags .panel-label { width:100%; margin-bottom:4px; }.brand-tags span { padding:7px 10px; border:1px solid var(--line); color:#303636; font-size:11px; font-weight:700; }
@media (max-width:850px) { .featured.no-service-image { min-height:0; }.featured.no-service-image .service-main { display:block; }.brand-tags { margin-top:30px; } }
.brand-showcase { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:60px; }.brand-family { min-height:215px; padding:29px; background:#e5e2dc; }.brand-family h3 { max-width:480px; margin:32px 0 11px; font-size:26px; line-height:1.1; letter-spacing:-.05em; }.brand-family p:not(.panel-label) { margin:0; color:#5b6160; font-size:12px; }.brand-family .brand-tags { margin-top:18px; }.brand-family-dark { color:#fff; background:#353e42; }.brand-family-dark .panel-label,.brand-family-dark p:not(.panel-label) { color:#d2d6d5; }.brand-family-dark .brand-tags span { border-color:rgba(255,255,255,.3); color:#fff; }.activation-models { margin-top:17px; padding:31px; background:#f6f4ef; }.activation-models .model-list { margin-bottom:0; }.solution-card .button { margin-top:auto; align-self:flex-start; }.solution-card .text-link { margin-top:auto; align-self:flex-start; }
@media (max-width:850px) { .brand-showcase { grid-template-columns:1fr; margin-top:38px; gap:9px; }.brand-family { min-height:0; padding:25px; }.brand-family h3 { margin-top:25px; font-size:23px; }.activation-models { margin-top:9px; padding:24px; } }

.activation-check { padding:116px 0; background:#f5f3ef; }.activation-check-heading { display:flex; align-items:end; justify-content:space-between; gap:40px; margin-bottom:43px; }.activation-check-heading h2 { margin:18px 0 0; font-size:clamp(39px,4.3vw,62px); line-height:.96; letter-spacing:-.065em; }.activation-check-heading h2 em { color:var(--signal); font-family:Georgia,serif; }.activation-check-heading>p { width:350px; margin:0; color:#606665; font-size:13px; line-height:1.7; }.checker-shell { max-width:930px; margin:0 auto; }.checker-card { padding:42px; background:#e6e3dd; border-top:3px solid var(--signal); }.checker-progress { display:flex; gap:7px; margin-bottom:31px; }.checker-progress span { display:block; width:35px; height:3px; background:#c8c5be; }.checker-progress .is-active { background:var(--signal); }.checker-eyebrow { margin:0; color:#747978; font:10px ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing:.1em; text-transform:uppercase; }.checker-card h3 { max-width:620px; margin:16px 0 0; font-size:clamp(31px,4vw,50px); line-height:.98; letter-spacing:-.065em; }.checker-copy { max-width:550px; margin:18px 0 0; color:#555c5b; font-size:14px; line-height:1.75; }.checker-choice-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:9px; margin-top:34px; }.checker-choice-grid button { min-height:95px; padding:16px; border:1px solid rgba(16,19,23,.18); background:#f6f4ef; color:var(--ink); cursor:pointer; display:flex; flex-direction:column; align-items:flex-start; justify-content:space-between; text-align:left; font:800 17px/1.1 Manrope,Arial,sans-serif; transition:transform .18s,background .18s,color .18s; }.checker-choice-grid button:hover,.checker-choice-grid button:focus-visible { outline:0; background:var(--ink); color:#fff; transform:translateY(-2px); }.checker-choice-grid button>span { align-self:flex-end; color:var(--signal); font-size:20px; }.checker-periods { grid-template-columns:repeat(3,1fr); }.checker-periods button,.checker-usb button { min-height:140px; }.checker-choice-grid small { margin-top:10px; color:#666c6b; font:11px/1.5 Manrope,Arial,sans-serif; }.checker-choice-grid button:hover small,.checker-choice-grid button:focus-visible small { color:#d4d7d6; }.checker-audi-models { grid-template-columns:repeat(5,1fr); }.checker-audi-models button { min-height:82px; }.checker-audi-models .checker-other { grid-column:span 2; }.checker-usb { grid-template-columns:repeat(3,1fr); }.checker-form { display:grid; grid-template-columns:1fr 1fr; gap:18px; align-items:end; margin-top:34px; }.checker-form label { display:block; margin-bottom:6px; color:#636968; font:10px ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing:.08em; text-transform:uppercase; }.checker-form input { width:100%; min-height:52px; padding:12px 13px; border:1px solid rgba(16,19,23,.22); border-radius:0; background:#f6f4ef; color:var(--ink); font:14px Manrope,Arial,sans-serif; }.checker-model-readonly { min-height:52px; padding:10px 13px; border:1px solid rgba(16,19,23,.22); background:#f6f4ef; }.checker-model-readonly label { margin-bottom:2px; }.checker-model-readonly strong { display:block; font-size:14px; }.checker-form .button { grid-column:1/-1; justify-self:start; margin-top:8px; border:0; cursor:pointer; }.checker-selected { grid-column:1/-1; margin:0; color:#555c5b; font-size:12px; }.checker-back { margin-top:28px; border:0; border-bottom:1px solid currentColor; padding:0 0 3px; background:transparent; color:#555b5a; cursor:pointer; font:800 12px Manrope,Arial,sans-serif; }.checker-result { margin-top:32px; padding:27px 29px; background:#f6f4ef; }.checker-result-label { margin:0; color:#6c7170; font:10px ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing:.09em; text-transform:uppercase; }.checker-result ul { display:grid; gap:10px; margin:17px 0 24px; padding:0; list-style:none; }.checker-result li { position:relative; padding-left:20px; color:#444b4a; font-size:13px; line-height:1.55; }.checker-result li::before { content:'+'; position:absolute; left:0; color:var(--signal); font-weight:800; }.checker-result .button { border:0; }.checker-note { margin:15px 0 0; color:#747a79; font-size:11px; }.checker-price { margin:0 0 22px; color:#535a58; font-size:14px; }.checker-price strong { color:var(--signal); font-size:20px; }.checker-result-not-possible { border-left:3px solid #a24a42; }.checker-result-possible { border-left:3px solid #26885b; }.checker-noscript { margin:20px 0 0; color:#626766; font-size:13px; }
@media (max-width:850px) { .activation-check { padding:78px 0; }.activation-check-heading { display:block; margin-bottom:29px; }.activation-check-heading h2 { font-size:41px; }.activation-check-heading>p { width:auto; margin-top:20px; }.checker-card { padding:26px; }.checker-choice-grid,.checker-periods,.checker-usb { grid-template-columns:1fr 1fr; gap:8px; }.checker-choice-grid button,.checker-periods button,.checker-usb button { min-height:100px; font-size:15px; }.checker-audi-models { grid-template-columns:repeat(3,1fr); }.checker-audi-models .checker-other { grid-column:span 3; }.checker-form { grid-template-columns:1fr; gap:14px; }.checker-form .button,.checker-selected { grid-column:auto; }.checker-result { padding:22px; } }
@media (max-width:430px) { .checker-choice-grid,.checker-periods,.checker-usb,.checker-audi-models { grid-template-columns:1fr; }.checker-audi-models .checker-other { grid-column:auto; }.checker-choice-grid button,.checker-periods button,.checker-usb button { min-height:78px; }.checker-card { padding:21px; } }

/* Mobiele afwerking: duidelijke header, geen tekst over de hero-foto en ruime tikvlakken. */
@media (max-width:850px) {
  .announcement { min-height:44px; padding:7px 20px; justify-content:flex-start; }
  .announcement p { max-width:none; line-height:1.45; }
  .announcement > a { display:none; }
  .site-header { top:44px; }
  .site-header.is-stuck { top:0; }
  .site-nav { z-index:2; }
  .header-cta { width:44px; height:44px; margin-left:auto; justify-content:center; border:0; border-radius:50%; padding:0; background:#25d366; color:#fff; }
  .header-cta:hover { background:#1ebe5d; color:#fff; }
  .header-cta .header-cta-label { display:none; }
  .header-cta .whatsapp-icon { width:23px; height:23px; }
  .hero { min-height:0; }
  .hero-inner { min-height:0; display:flex; flex-direction:column; align-items:stretch; padding:144px 0 0; }
  .hero-copy { width:100%; }
  .hero-visual { position:relative; right:auto; bottom:auto; align-self:stretch; width:100%; height:235px; margin-top:36px; opacity:1; }
  .photo-frame-hero { right:0; bottom:0; width:min(78vw,310px); height:235px; }
  .hero-sticker { right:auto; left:9px; bottom:24px; width:84px; height:84px; }
  .hero-sticker strong { font-size:16px; }
  .button { max-width:100%; gap:12px; }
  .button span { flex:0 0 auto; }
  .whatsapp-float { width:52px; height:52px; padding:0; justify-content:center; }
  .whatsapp-float span { display:none; }
  .whatsapp-float .whatsapp-icon { width:25px; height:25px; }
}

@media (max-width:430px) {
  .wrap { width:min(calc(100% - 32px),var(--max)); }
  .detail-hero h1 { font-size:clamp(42px,14vw,52px); }
  .detail-hero-inner { padding:136px 0 38px; }
  .detail-hero p:not(.eyebrow) { margin-top:22px; }
  .hero h1 { font-size:clamp(47px,14vw,60px); }
  .hero-lead { margin-top:25px; }
  .hero-visual { height:215px; margin-top:30px; }
  .photo-frame-hero { height:215px; }
  .panel-footer .button, .detail-cta .button, .solution-card .button { width:100%; justify-content:space-between; }
}

/* Lokale informatiepagina's: gewone, inhoudelijke pagina's zonder extra belasting voor de homepage. */
.local-hero { min-height:550px; }.local-hero::before { background:linear-gradient(110deg,rgba(16,19,23,.99),rgba(20,27,30,.9)),radial-gradient(circle at 74% 34%,rgba(255,59,48,.34),transparent 26%); }.local-intro { padding:116px 0; background:#f5f3ef; }.local-intro-grid { display:grid; grid-template-columns:1fr 1fr; gap:100px; }.local-intro h2,.local-section-heading h2,.local-faq h2 { margin:18px 0 0; font-size:clamp(40px,4.4vw,63px); line-height:.96; letter-spacing:-.065em; }.local-intro h2 em,.local-section-heading h2 em { color:var(--signal); font-family:Georgia,serif; }.local-intro-grid>div:last-child { max-width:520px; color:#555c5b; font-size:15px; line-height:1.82; }.local-intro-grid p { margin:0 0 18px; }.local-intro .button { margin-top:10px; }.local-services { padding:108px 0 118px; background:#e6e3dd; }.local-section-heading { display:flex; align-items:end; justify-content:space-between; gap:45px; margin-bottom:39px; }.local-section-heading>p { width:345px; margin:0; color:#5c6261; font-size:13px; line-height:1.72; }.local-card-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:15px; }.local-card-grid article { min-height:235px; padding:30px; background:#f6f4ef; }.local-card-grid span { color:#7c817f; font:10px "DM Mono",monospace; letter-spacing:.1em; }.local-card-grid h3 { margin:42px 0 11px; font-size:25px; line-height:1.08; letter-spacing:-.05em; }.local-card-grid p { margin:0; color:#5d6362; font-size:13px; line-height:1.72; }.local-faq { padding:110px 0 118px; background:#f5f3ef; }.local-faq h2 { margin-bottom:35px; }.local-faq details { max-width:850px; padding:21px 0; border-top:1px solid var(--line); }.local-faq details:last-child { border-bottom:1px solid var(--line); }.local-faq summary { cursor:pointer; font-size:16px; font-weight:800; letter-spacing:-.025em; }.local-faq details p { max-width:670px; margin:14px 0 0; color:#5e6463; font-size:14px; line-height:1.75; }.local-faq summary::marker { color:var(--signal); }.area-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }.area-card { min-height:238px; padding:28px; background:#f6f4ef; display:flex; flex-direction:column; transition:background .2s,color .2s,transform .2s; }.area-card:hover { background:#101317; color:#fff; transform:translateY(-3px); }.area-card>span { color:#787d7c; font:10px "DM Mono",monospace; letter-spacing:.1em; }.area-card h3 { margin:37px 0 9px; font-size:28px; letter-spacing:-.055em; }.area-card p { margin:0; color:#5c6261; font-size:12px; line-height:1.7; }.area-card:hover p { color:#d0d4d3; }.area-card b { margin-top:auto; font-size:12px; }.area-card i { margin-left:8px; color:var(--signal); font-size:18px; font-style:normal; }
@media (max-width:850px) { .local-hero { min-height:590px; }.local-intro,.local-services,.local-faq { padding:78px 0; }.local-intro-grid { display:block; }.local-intro h2 { margin-bottom:29px; }.local-section-heading { display:block; margin-bottom:29px; }.local-section-heading>p { width:auto; margin-top:20px; }.local-card-grid,.area-grid { grid-template-columns:1fr; gap:9px; }.local-card-grid article { min-height:0; padding:26px; }.local-card-grid h3 { margin-top:28px; }.local-faq h2 { margin-bottom:27px; }.local-faq details { padding:18px 0; } }

@media (max-width:850px) { .services .section-heading { display:grid; grid-template-columns:minmax(0,1fr) auto; column-gap:16px; row-gap:16px; align-items:end; }.services .section-heading .section-kicker { grid-column:1/-1; }.services .section-heading h2 { grid-column:1; margin:0; }.services .section-heading .round-link { grid-column:2; grid-row:2; } }