/* S.E.M Auto's | statische website, 2026 | zelfstandig te hosten */
:root{--accent:#04a8c6;--accent-dark:#087b91;--ink:#181b1d;--text:#52575a;--gray:#353738;--line:#e2e4e5;--container:1288px;--font:"Roboto Condensed","Arial Narrow",Arial,sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:96px}
body{margin:0;font-family:var(--font);font-size:15px;line-height:1.75;color:var(--text);background:#fff;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}a{text-decoration:none;color:inherit}button,input,textarea,select{font:inherit}button{cursor:pointer}h1,h2,h3,h4,p{margin-top:0}h1,h2,h3,h4{line-height:1.22;color:#181818;font-weight:800}
h1,h2,h3{letter-spacing:-.016em}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.container{width:min(var(--container),calc(100% - 64px));margin:auto}.skip-link{position:absolute;left:16px;top:-60px;z-index:99;background:#fff;padding:10px 16px;color:#111}.skip-link:focus{top:10px}
.site-header{height:131px;position:absolute;top:0;left:0;width:100%;z-index:20;background:rgba(0,0,0,.91)}.header-inner{height:100%;display:flex;align-items:flex-start;justify-content:space-between;gap:25px}.brand{display:block;width:158px;flex:none;margin-top:18px}.brand img{width:100%;height:auto}.primary-nav{display:flex;gap:26px;align-items:center;margin-top:17px}.primary-nav a{font-size:14px;line-height:1.5;color:#f5f5f5;text-transform:uppercase;font-weight:500;white-space:nowrap}.primary-nav a:hover,.primary-nav a[aria-current="page"]{color:var(--accent)}.menu-toggle{display:none;align-items:center;gap:9px;color:#fff;background:transparent;border:1px solid #667073;padding:10px 15px;text-transform:uppercase;font-size:13px;font-weight:700}
.site-header.inner-header{position:relative;background:#0d0e0f;height:116px}.inner-header .brand{margin-top:11px}.inner-header .primary-nav{margin-top:22px}
.home-hero{height:min(45.36vw,929px);min-height:640px;background-image:url('peugeot-hero.webp');background-position:center top;background-size:cover;background-repeat:no-repeat;background-color:#24211c;position:relative}.home-hero:after{content:"";position:absolute;inset:131px 0 auto;height:1px;background:rgba(255,255,255,.035);pointer-events:none}
.quick-links{background:#54afb9 url('turquoise-band.webp') center/cover no-repeat;position:relative;padding:16px 0 15px;min-height:205px}.quick-links:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,115,126,.12),rgba(32,188,224,.18));pointer-events:none}.quick-grid{position:relative;display:grid;grid-template-columns:repeat(6,147px);justify-content:start;gap:43px}.quick-card{height:157px;background:#090f12;border:4px solid #050505;border-radius:11px;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 1px 2px #0f1f2440;transition:transform .18s ease,box-shadow .18s ease}.quick-card:hover{transform:translateY(-4px);box-shadow:0 8px 20px #0f1f2450}.quick-card strong{height:46px;flex:none;display:flex;align-items:center;justify-content:center;color:#fff;font-size:14px;font-weight:800;text-transform:uppercase;text-align:center;padding:5px 2px;line-height:1.1}.quick-card img{width:100%;height:calc(100% - 46px);object-fit:cover;object-position:center}
.home-body{padding:43px 0 115px;min-height:425px}.home-cols{display:grid;grid-template-columns:395px 369px;gap:122px;align-items:start}.home-cols h1,.home-cols h2{font-size:26px;color:#111;text-transform:uppercase;line-height:1.2;margin-bottom:22px}.welcome-content{font-size:14px;line-height:1.55}.welcome-content p{margin:0 0 16px}.welcome-content strong{color:#111}.home-contact h2{margin-bottom:26px}.contact-accordion{border-top:1px solid transparent}.accordion-item{border-bottom:1px solid #d9dddf}.accordion-trigger{width:100%;padding:11px 2px;background:none;border:0;text-align:left;display:flex;align-items:center;gap:16px;color:#303030;font-size:12px;text-transform:uppercase;font-weight:700}.plus{background:#34393b;color:white;width:18px;height:18px;display:grid;place-items:center;line-height:1;font-size:16px}.accordion-trigger[aria-expanded="true"] .plus{background:var(--accent)}.accordion-panel{padding:7px 4px 18px 35px;font-size:15px;line-height:1.6}.accordion-panel a{color:#078dad;font-weight:700}.accordion-panel p{margin:0}.mini-action{display:inline-block;margin-top:8px;text-decoration:underline;text-underline-offset:3px}
.site-footer{background:var(--gray);color:#eff0f0;padding:36px 0 44px;border-top:8px solid #d8dadd}.footer-grid{display:grid;grid-template-columns:repeat(4,250px);gap:30px}.footer-heading{text-transform:uppercase;font-size:14px;font-weight:500;color:#f6f6f6;margin:0 0 24px}.footer-logo{width:162px;margin:4px 0 27px}.footer-details{font-size:13px;line-height:1.42;color:#e0e2e3;font-style:normal}.footer-details a:hover,.footer-nav a:hover{color:#6bd6ec}.footer-nav{list-style:none;margin:0;padding:0}.footer-nav li{border-bottom:1px solid #4b5052}.footer-nav a{display:block;padding:7px 0;font-size:13px;text-transform:uppercase;color:#d7d9da}.footer-nav a:before{content:"›";font-size:15px;color:#78c2cf;margin-right:9px}.footer-hours{font-size:13px;line-height:1.4;width:100%;border-collapse:collapse}.footer-hours td{padding:1px 8px 1px 0}.footer-hours td:last-child{white-space:nowrap}.footer-note{font-size:12px;color:#c2c6c8;margin:12px 0 0}.social-links{display:flex;gap:12px;align-items:center}.social-links a{border:1px solid #58747b;display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:3px;color:#71c8df}.social-links a:hover{background:#455355}.footer-bottom{margin-top:36px;padding-top:15px;border-top:1px solid #515557;font-size:12px;color:#bbc2c4;display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px}
/* Binnenpagina's: behoud van het donkere, sobere beeld van de oorspronkelijke site. */
.page-banner{position:relative;background:#151819 url('peugeot-detail.webp') center 44% /cover no-repeat;min-height:295px;display:flex;align-items:center;isolation:isolate}.page-banner:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(3,12,15,.9),rgba(3,12,15,.67) 52%,rgba(3,12,15,.18))}.page-banner .container{padding:58px 0}.page-banner .eyebrow{color:#5ed0df;margin-bottom:8px}.page-banner h1{color:#fff;font-size:clamp(35px,3.5vw,55px);text-transform:uppercase;margin-bottom:12px}.page-banner p{color:#edf0f1;font-size:17px;max-width:650px;margin:0}.eyebrow{text-transform:uppercase;letter-spacing:.1em;font-size:12px;font-weight:800;color:var(--accent-dark);margin:0 0 13px}.content-section{padding:80px 0}.content-section.soft{background:#f7f9f9}.content-section.compact{padding:55px 0}.content-section h2{font-size:clamp(28px,3vw,39px);margin-bottom:23px}.content-section h3{font-size:22px;margin-bottom:10px}.content-section p{font-size:16px;margin:0 0 18px}.content-section p:last-child{margin-bottom:0}.two-cols{display:grid;grid-template-columns:1fr 1fr;gap:84px}.reading{max-width:860px}.reading p{line-height:1.8}.visual{border-radius:5px;overflow:hidden;min-height:320px;background:#ced3d3}.visual img{width:100%;height:100%;min-height:320px;object-fit:cover}.info-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.info-tile{background:#fff;border:1px solid #e4e8e9;padding:27px 26px 30px;border-top:3px solid #13a5ba}.info-tile h3{font-size:21px}.info-tile p{font-size:15px;line-height:1.7}.step-list{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;counter-reset:step}.step{border-top:1px solid #d8dee0;padding-top:21px}.step:before{counter-increment:step;content:"0" counter(step);font-size:28px;font-weight:800;color:#128fa1;display:block;margin-bottom:8px}.step h3{font-size:22px}.step p{font-size:15px;line-height:1.75}.bullet-list{margin:12px 0 0;padding-left:21px}.bullet-list li{margin:8px 0}.button-link{display:inline-flex;align-items:center;justify-content:center;min-height:46px;border-radius:2px;background:#089db6;color:#fff;font-size:14px;font-weight:800;text-transform:uppercase;letter-spacing:.025em;padding:12px 22px;margin-top:13px}.button-link:hover{background:#087d96}.button-link.secondary{background:#fff;color:#151718;border:1px solid #b9c4c7}.button-link.secondary:hover{background:#f2f6f6}.button-row{display:flex;flex-wrap:wrap;gap:12px}.notice{padding:18px 23px;background:#f2f8f8;border-left:3px solid #14a6bc;font-size:15px;line-height:1.65}.notice p{font-size:15px;margin:0}.offer-strip{background:#e9f5f6;padding:34px 0}.offer-strip .container{display:flex;justify-content:space-between;align-items:center;gap:25px}.offer-strip h2{font-size:27px;margin:0 0 6px}.offer-strip p{margin:0}.offer-strip .button-link{margin:0;white-space:nowrap}
.contact-details-page{display:grid;gap:18px}.contact-details-page strong{display:block;color:#121919;font-size:13px;text-transform:uppercase;margin-bottom:3px}.contact-details-page a{color:#057f99;font-weight:700}.map-link{display:block;position:relative;margin-top:27px;min-height:164px;border:1px solid #d4dfe2;background:linear-gradient(135deg,#e1edf0 0 35%,#cadfe5 35% 40%,#e1edf0 40% 64%,#c1d6dd 64% 68%,#e1edf0 68%);padding:35px;text-align:center;color:#1f4149;font-weight:800}.map-link span{display:block;font-size:13px;color:#46666f;font-weight:400}.map-link:hover{border-color:var(--accent)}
.faq{border-top:1px solid var(--line);max-width:840px}.faq details{border-bottom:1px solid var(--line);padding:19px 0}.faq summary{font-weight:800;font-size:18px;cursor:pointer;color:#202729}.faq details p{padding-top:13px;font-size:15px}.hr{height:1px;background:var(--line);margin:30px 0}.stock-placeholder{background:#f8fafa;border:1px solid #dce4e5;padding:34px;display:grid;grid-template-columns:140px 1fr;gap:29px;align-items:center}.stock-placeholder img{width:140px;height:115px;object-fit:cover;border-radius:3px}.stock-placeholder h3{font-size:24px}.stock-placeholder p{font-size:15px}.stock-placeholder .button-link{margin-top:5px}
@media(max-width:1300px){.quick-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:19px}.home-cols{gap:55px;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.footer-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:900px){.site-header{height:95px}.site-header.inner-header{height:95px}.brand,.inner-header .brand{width:125px;margin-top:12px}.primary-nav{gap:14px;margin-top:21px}.primary-nav a{font-size:12px}.home-hero{min-height:520px}.quick-links{min-height:auto}.quick-grid{grid-template-columns:repeat(3,minmax(0,1fr));max-width:600px;margin:auto}.quick-card{height:160px}.home-cols{gap:32px}.home-body{padding-bottom:80px}.footer-grid{grid-template-columns:repeat(2,1fr);row-gap:40px}.two-cols{gap:35px}.info-tiles{gap:14px}.info-tile{padding:22px}.site-header .header-inner{align-items:center}}
@media(max-width:650px){.container{width:calc(100% - 36px)}.site-header,.site-header.inner-header{height:82px}.brand,.inner-header .brand{width:112px;margin:0}.header-inner{align-items:center}.menu-toggle{display:flex}.primary-nav{display:none;position:absolute;left:0;right:0;top:82px;margin:0;padding:13px 18px 18px;background:#111a1d;box-shadow:0 12px 22px #0005;flex-direction:column;align-items:stretch;gap:0}.menu-open .primary-nav{display:flex}.primary-nav a{display:block;padding:11px 6px;border-bottom:1px solid #2e373a;font-size:14px}.home-hero{height:540px;min-height:0;background-position:45% center}.home-hero:before{content:"";position:absolute;inset:82px 0 0;background:linear-gradient(0deg,transparent 50%,rgba(0,0,0,.07))}.quick-links{padding:18px 0}.quick-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.quick-card{height:159px}.quick-card strong{height:44px;font-size:12px}.quick-card img{height:calc(100% - 44px)}.home-body{padding:48px 0 68px;min-height:auto}.home-cols{grid-template-columns:1fr;gap:36px}.home-cols h1,.home-cols h2{font-size:24px}.site-footer{padding:31px 0}.footer-grid{gap:34px 16px}.footer-heading{margin-bottom:18px}.footer-logo{width:130px;margin-bottom:14px}.footer-hours{font-size:11px}.footer-nav a,.footer-details{font-size:11px}.page-banner{min-height:270px;background-position:56% center}.page-banner h1{font-size:37px}.page-banner .container{padding:49px 0}.content-section{padding:55px 0}.two-cols{grid-template-columns:1fr;gap:27px}.info-tiles,.step-list{grid-template-columns:1fr;gap:15px}.offer-strip .container{align-items:flex-start;flex-direction:column;gap:15px}.contact-form{grid-template-columns:1fr}.field{grid-column:1/-1}.stock-placeholder{grid-template-columns:1fr;gap:17px}.stock-placeholder img{width:100%;height:145px}.footer-bottom{margin-top:25px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important}}

/* V3: juiste foto-uitsneden en duidelijke contactpagina zonder formulier. */
.quick-card img{display:block;min-height:0;object-fit:cover;object-position:center center}
.contact-main{padding:70px 0 82px}
.contact-overview{display:grid;grid-template-columns:minmax(0,1fr) minmax(330px,.83fr);gap:clamp(48px,7vw,112px);align-items:start}
.contact-overview h2,.contact-extra h2{font-size:clamp(27px,2.6vw,36px);margin-bottom:18px}
.contact-lead{max-width:600px;line-height:1.8;color:#555f62}
.contact-method-list{margin:25px 0 26px;border-top:1px solid #dbe1e3}
.contact-method{padding:17px 0 17px;border-bottom:1px solid #dbe1e3;display:flex;flex-direction:column;align-items:flex-start;gap:2px}
.method-name{font-size:12px;font-weight:800;letter-spacing:.055em;text-transform:uppercase;color:#687175}
.method-value{font-size:clamp(20px,2.1vw,26px);line-height:1.35;font-weight:700;color:#128ca1;overflow-wrap:anywhere}
.method-value:hover,.text-action:hover{text-decoration:underline;text-underline-offset:4px}
.method-hint{font-size:14px;color:#747d80}
.contact-buttons{display:flex;gap:10px;flex-wrap:wrap}
.contact-buttons .button-link{margin:0}
.visit-panel{background:#f3f7f7;border:1px solid #dce5e6;border-top:4px solid var(--accent);padding:34px 36px 35px}
.visit-panel h2{max-width:400px;margin-bottom:22px}
.visit-panel p{line-height:1.7;margin-bottom:25px}
.visit-address{font-style:normal;display:flex;flex-direction:column;line-height:1.5;font-size:19px;color:#293334;margin-bottom:25px}
.visit-address strong{color:#151b1d;font-size:21px;margin-bottom:4px}
.route-action{display:flex;align-items:center;gap:13px;border:1px solid #bfcdd0;background:#fff;padding:15px 16px;color:#087f96;transition:background .15s ease,border-color .15s ease}
.route-action:hover{background:#e7f4f6;border-color:#85bcc6}
.route-action>span:not(.route-arrow){display:flex;flex-direction:column;line-height:1.2}
.route-action strong{font-size:16px}
.route-action small{font-size:12px;font-weight:400;color:#637276;margin-top:5px}
.route-arrow{font-size:27px;line-height:1;margin-left:auto}
.contact-extras-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(50px,8vw,130px);align-items:start}
.contact-opening-hours{border-collapse:collapse;max-width:475px;width:100%;font-size:16px;color:#343e41}
.contact-opening-hours tr{border-bottom:1px solid #dce4e6}
.contact-opening-hours th,.contact-opening-hours td{padding:9px 0;text-align:left;font-weight:400}
.contact-opening-hours td{text-align:right;font-weight:600;white-space:nowrap}
.hours-note{font-size:13px!important;line-height:1.6;color:#657275;margin-top:16px!important;max-width:500px}
.contact-appointment>p:not(.eyebrow){max-width:500px;line-height:1.75}
.text-action{display:inline-flex;gap:12px;align-items:center;margin-top:2px;color:#087f96;text-transform:uppercase;font-weight:800;font-size:14px}
.text-action span{font-size:27px;line-height:1}
.contact-social-row{display:flex;flex-wrap:wrap;gap:12px 18px;margin-top:35px;padding-top:16px;border-top:1px solid #dce4e6;font-size:14px}
.contact-social-row span{font-weight:800;text-transform:uppercase;color:#252e30}
.contact-social-row a{color:#087f96;font-weight:700}
.contact-social-row a:hover{text-decoration:underline}
@media(max-width:900px){.contact-overview{grid-template-columns:1fr 1fr;gap:28px}.visit-panel{padding:27px 23px}}
@media(max-width:650px){.contact-main{padding:50px 0 58px}.contact-overview,.contact-extras-grid{grid-template-columns:1fr;gap:42px}.visit-panel{padding:27px 24px}.contact-extras-grid{gap:44px}.contact-overview h2,.contact-extra h2{font-size:28px}.contact-buttons .button-link{min-height:44px}}
/* De hero-bron is een screenshot van de oude site. Een ondoorzichtige header
   voorkomt doorschijnen van het oude ingebakken logo en menu. */
.site-header:not(.inner-header){background:#090a0b}
