@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--navy:#0e1a24;--navy2:#152530;--gold:#c7a777;--cream:#f5f3ef;--ink:#192630;--muted:#617078;--line:#dce0df;--white:#fff}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font:16px/1.6 'DM Sans',sans-serif;color:var(--ink);background:var(--cream)}h1,h2,h3,p{margin-top:0}h1,h2,h3,.brand,.button{font-family:Manrope,sans-serif}h1{font-size:clamp(2.6rem,6vw,5.2rem);letter-spacing:-.055em;line-height:1.08}h2{font-size:clamp(2rem,3.5vw,3.25rem);letter-spacing:-.045em;line-height:1.17}h3{font-size:1.22rem;line-height:1.3}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit}button{cursor:pointer}img{display:block;max-width:100%}.wrap{width:min(1180px,calc(100% - 44px));margin:auto}.demo{background:var(--gold);color:#151d20;text-align:center;font-size:.83rem;font-weight:700;padding:9px 18px}.header{background:var(--navy);color:white;position:sticky;top:0;z-index:10;border-bottom:1px solid #ffffff18}.header-inner{height:82px;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{display:flex;align-items:center;gap:12px;font-weight:800;font-size:1.14rem;letter-spacing:-.035em;line-height:1.1}.mark{width:42px;height:42px;border:1.5px solid var(--gold);display:grid;place-items:center;color:var(--gold);font-size:1.1rem;letter-spacing:-.12em;flex:none}.brand small{display:block;color:var(--gold);font-family:'DM Sans',sans-serif;font-size:.66rem;letter-spacing:.21em;text-transform:uppercase;margin-top:4px}.nav{display:flex;align-items:center;gap:35px}.nav a:not(.button){font-size:.91rem;font-weight:600;color:#d9e1e2}.nav a:hover,.nav a[aria-current=page]{color:var(--gold)}.button{display:inline-flex;align-items:center;justify-content:center;gap:11px;min-height:52px;padding:12px 25px;background:var(--gold);border:1px solid var(--gold);font-size:.88rem;font-weight:800;color:#14202a;transition:background .2s,transform .2s}.button:hover{background:#e0bf8d;transform:translateY(-1px)}.button-outline{background:transparent;color:white;border-color:#ffffff77}.button-outline:hover{background:#ffffff15}.nav .button{min-height:44px;padding:10px 19px}.menu-toggle{display:none;color:white;background:none;border:1px solid #ffffff55;padding:8px 12px}.eyebrow{text-transform:uppercase;letter-spacing:.2em;font-size:.75rem;font-weight:800;color:var(--gold);margin-bottom:17px}.hero{position:relative;color:white;background:linear-gradient(90deg,#0d1924 0%,#0d1924d6 35%,#0d192466 70%,#0d192430),url('/assets/taxi-hero.webp') center/cover;min-height:650px;display:flex;align-items:center}.hero-content{position:relative;padding:95px 0 100px}.hero h1{max-width:710px}.hero p.lead{max-width:540px;font-size:1.16rem;color:#e0e6e7}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:33px}.trust{display:flex;gap:28px;flex-wrap:wrap;margin-top:58px;color:#e8eceb;font-size:.85rem}.trust span:before{content:'✓';color:var(--gold);font-weight:900;margin-right:9px}.section{padding:95px 0}.section-white{background:#fff}.section-dark{background:var(--navy);color:white}.section-top{display:flex;justify-content:space-between;align-items:end;gap:28px;margin-bottom:38px}.section-top p{max-width:410px;color:var(--muted);margin-bottom:5px}.section-dark .section-top p{color:#b9c4c8}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.card{background:#fff;border:1px solid var(--line);padding:34px;min-height:270px;display:flex;flex-direction:column}.card .icon{font-size:1.55rem;color:#ad8856;margin-bottom:28px}.card p{color:var(--muted);margin:0}.card h3{margin-bottom:8px}.row-link{color:#ad8856;font-weight:800;margin-top:auto;padding-top:30px}.feature{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}.feature-visual{min-height:440px;background:linear-gradient(130deg,#1c303c,#0e1a24);color:var(--gold);display:flex;flex-direction:column;justify-content:space-between;padding:44px}.feature-visual .round{align-self:flex-end;border:1px solid #c7a77766;border-radius:50%;width:185px;height:185px;display:grid;place-items:center;font:800 5rem Manrope}.feature-visual strong{font:700 clamp(1.7rem,3vw,2.7rem)/1.18 Manrope;color:#fff;max-width:370px;letter-spacing:-.04em}.feature ul{padding:0;list-style:none}.feature li{border-bottom:1px solid #d3d8d6;padding:15px 0}.feature li:before{content:'✓';color:#a98350;font-weight:900;margin-right:15px}.callout{display:flex;justify-content:space-between;align-items:center;gap:25px;background:#d9c4a4;padding:40px 48px}.callout h2{font-size:clamp(1.5rem,3vw,2.3rem);margin-bottom:8px}.callout p{margin:0}.callout .button{background:var(--navy);border-color:var(--navy);color:white;white-space:nowrap}.footer{background:#0b151e;color:#bbc8cc;padding:68px 0 26px}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1.4fr;gap:35px}.footer .brand{color:white}.footer p{max-width:340px}.footer h3{font-size:.95rem;color:white}.footer a{display:block;margin:9px 0}.footer a:hover{color:var(--gold)}.footer-bottom{margin-top:55px;padding-top:20px;border-top:1px solid #ffffff20;font-size:.82rem;display:flex;justify-content:space-between;gap:15px}.page-hero{background:var(--navy);color:white;padding:78px 0 90px}.page-hero h1{max-width:800px;margin-bottom:18px}.page-hero p:last-child{max-width:650px;color:#c1cdd0;font-size:1.08rem}.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.price{background:#fff;padding:34px;border:1px solid var(--line)}.price span{display:block;font-size:.82rem;color:var(--muted);font-weight:700}.price strong{display:block;font:800 clamp(2.2rem,4vw,3.5rem) Manrope;color:var(--navy);letter-spacing:-.05em;margin:18px 0 4px}.note{margin-top:22px;color:var(--muted);font-size:.91rem}.airport{display:grid;grid-template-columns:repeat(2,1fr);gap:15px}.airport article{border:1px solid var(--line);background:white;padding:29px 33px;display:flex;justify-content:space-between;gap:20px;align-items:center}.airport h3{margin:0}.airport a{font-weight:800;color:#906d40;white-space:nowrap}.payment{display:flex;gap:10px;flex-wrap:wrap}.payment span{border:1px solid #ffffff50;padding:10px 17px}.booking{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(300px,.8fr);gap:55px;align-items:start}.form-panel{background:#fff;border:1px solid var(--line);padding:40px}.form-panel h2{font-size:1.6rem}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:19px}.field.wide{grid-column:1/-1}.field label{display:block;font-weight:700;font-size:.88rem;margin-bottom:7px}.field input,.field select,.field textarea{width:100%;border:1px solid #cbd3d3;background:#fff;border-radius:0;padding:13px 14px;min-height:49px;color:var(--ink)}.field textarea{min-height:108px;resize:vertical}.field :focus{outline:2px solid #9d7947;outline-offset:1px}.form-panel .button{margin-top:24px}.form-panel .note{margin-bottom:0}.aside{background:var(--navy);color:#fff;padding:38px}.aside p{color:#c6d0d2}.aside .contact{border-top:1px solid #ffffff25;padding:18px 0;overflow-wrap:anywhere}.aside .contact strong{display:block;color:#fff}.aside .contact span{color:var(--gold)}.success{display:none;background:#e5efe9;border-left:4px solid #3c805e;padding:18px;margin-top:20px}.success.show{display:block}.section-intro{max-width:650px;color:var(--muted)}@media(max-width:850px){.nav{display:none;position:absolute;top:100%;left:0;right:0;background:var(--navy);padding:15px 22px 25px;flex-direction:column;align-items:stretch;gap:14px;border-top:1px solid #ffffff30}.nav.open{display:flex}.menu-toggle{display:block}.cards,.price-grid{grid-template-columns:1fr 1fr}.booking{grid-template-columns:1fr}.feature{gap:35px}}@media(max-width:610px){.wrap{width:min(100% - 34px,1180px)}.header-inner{height:69px}.brand{font-size:.98rem}.mark{width:37px;height:37px}.hero{min-height:650px;background:linear-gradient(180deg,#0d1924c9,#0d1924aa 54%,#0d1924ed),url('/assets/taxi-hero.webp') 62% center/cover}.hero-content{padding:80px 0}.trust{gap:12px;flex-direction:column;margin-top:40px}.section{padding:65px 0}.section-top{display:block}.cards,.price-grid,.airport,.feature,.footer-grid,.form-grid{grid-template-columns:1fr}.card{min-height:225px}.feature-visual{min-height:300px}.feature-visual .round{width:110px;height:110px;font-size:3rem}.callout{display:block;padding:28px}.callout .button{margin-top:20px}.footer-bottom{display:block}.page-hero{padding:58px 0 67px}.airport article{padding:24px;align-items:start}.form-panel{padding:25px}.field.wide{grid-column:auto}}

.brand-logo{width:65px;height:65px;object-fit:cover;object-position:center;border-radius:50%;background:#000;flex:none}.footer .brand-logo{width:78px;height:78px}.fixed-rates{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.rate-card{background:#fff;border:1px solid var(--line);padding:34px}.rate-card h3{font-size:1.36rem;margin:0 0 20px}.rate-row{display:flex;align-items:baseline;justify-content:space-between;gap:20px;border-top:1px solid var(--line);padding:15px 0}.rate-row span{max-width:385px;color:#4d5b63}.rate-row strong{font:800 1.22rem Manrope;white-space:nowrap;color:var(--navy)}@media(max-width:850px){.fixed-rates{grid-template-columns:1fr}}@media(max-width:610px){.brand-logo{width:52px;height:52px}.footer .brand-logo{width:70px;height:70px}.rate-card{padding:24px}.rate-row{gap:13px}.rate-row strong{font-size:1.05rem}}

/* Maak het originele merkbeeld zichtbaar zonder het bestand te wijzigen. */
.header-inner{height:94px}.header .brand-logo{width:78px;height:78px;box-shadow:0 0 0 1px #c7a7774d}.footer .brand-logo{width:105px;height:105px}.hero{min-height:790px}.hero-content{padding:58px 0 75px}.hero-logo{display:block;width:210px;height:210px;object-fit:cover;object-position:center;border-radius:50%;border:1px solid #c7a77788;background:#000;box-shadow:0 18px 46px #0008;margin:0 0 23px}.hero .eyebrow{margin-bottom:12px}.hero h1{font-size:clamp(2.6rem,5.5vw,4.7rem);max-width:720px}@media(max-width:610px){.header-inner{height:78px}.header .brand-logo{width:62px;height:62px}.footer .brand-logo{width:95px;height:95px}.hero{min-height:740px}.hero-content{padding:52px 0 75px}.hero-logo{width:148px;height:148px;margin-bottom:21px}.hero h1{font-size:clamp(2.5rem,10vw,3.6rem)}}
/* Alleen het oorspronkelijke grijze logo blijft zichtbaar; de zwarte buitenruimte van de bronafbeelding is weggeknipt. */
.brand-logo,.hero-logo{border:0;box-shadow:none;border-radius:0;background:transparent;clip-path:circle(41% at 50% 50%)}
.header .brand-logo{box-shadow:none}
.hero-logo{margin-left:-16px}
@media(max-width:610px){.hero-logo{margin-left:-11px}}

/* Plaats het echte logo op de plekken die in de screenshots zijn aangewezen. */
.header-inner{height:82px}.header .brand{font-size:1.24rem}.page-hero .wrap{display:grid;grid-template-columns:minmax(0,1fr) 280px;align-items:center;gap:55px}.page-hero-logo{width:280px;height:280px;object-fit:cover;object-position:center;clip-path:circle(41% at 50% 50%);justify-self:end}.page-hero-copy{min-width:0}.page-hero-copy h1{max-width:800px}.page-hero-copy p:last-child{max-width:650px}.feature-logo{width:190px;height:190px;object-fit:cover;object-position:center;clip-path:circle(41% at 50% 50%);align-self:flex-end}@media(max-width:850px){.page-hero .wrap{grid-template-columns:minmax(0,1fr) 180px;gap:18px}.page-hero-logo{width:180px;height:180px}}@media(max-width:610px){.header-inner{height:70px}.header .brand{font-size:1.08rem}.page-hero .wrap{grid-template-columns:1fr;gap:10px}.page-hero-logo{width:150px;height:150px;justify-self:start}.feature-logo{width:128px;height:128px}}
/* Kleurpalet gebaseerd op het aangeleverde logo en de huidige taxisite:
   antraciet #222224, grijs #c7c7c7 en helder geel #ffd700. */
:root{--navy:#222224;--navy2:#303032;--gold:#ffd700;--cream:#262729;--ink:#ececed;--muted:#c7c7c7;--line:#515255;--white:#fff}
body{background:var(--cream);color:var(--ink)}
.demo{background:var(--gold);color:#222224}
.header,.page-hero,.section-dark,.aside{background:#222224}
.header{border-bottom-color:#ffffff25}
.nav a:not(.button){color:#e5e5e5}
.nav a:hover,.nav a[aria-current=page]{color:var(--gold)}
.brand small,.eyebrow,.card .icon,.row-link,.airport a,.aside .contact span{color:var(--gold)}
.button{background:var(--gold);border-color:var(--gold);color:#222224}
.button:hover{background:#ffe54d;border-color:#ffe54d;color:#222224}
.button-outline{background:transparent;border-color:var(--gold);color:#fff}
.button-outline:hover{background:#ffd70023;border-color:var(--gold);color:#fff}
.hero{background:#222224;isolation:isolate;overflow:hidden}
.hero:before{content:"";position:absolute;inset:0;background:url('/assets/taxi-hero.webp') center/cover;filter:grayscale(1) brightness(.72) contrast(1.07);z-index:0}
.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#222224f7 0%,#222224dc 39%,#22222460 100%);z-index:1}
.hero-content{z-index:2}
.hero p.lead,.trust{color:#e4e4e4}
.trust span:before,.feature li:before{color:var(--gold)}
.section-white{background:#2d2e30}
.section-top p,.section-intro,.card p,.note,.price span,.rate-row span{color:#c7c7c7}
.section-dark .section-top p,.page-hero p:last-child,.aside p{color:#cecece}
.card,.price,.rate-card,.airport article{background:#38393b;color:#f2f2f2;border-color:#58595b}
.price strong,.rate-row strong{color:var(--gold)}
.feature-visual{background:linear-gradient(135deg,#343537,#1d1e20);color:var(--gold)}
.feature-visual .round{border-color:#ffd70077}
.feature li{border-bottom-color:#56575a}
.callout{background:#3b3c3e;color:#f3f3f3;border-left:4px solid var(--gold)}
.callout .button{background:var(--gold);border-color:var(--gold);color:#222224}
.callout .button:hover{background:#ffe54d}
.airport a{color:var(--gold)}
.payment span{border-color:#ffd70085}
.footer{background:#101010;color:#d1d1d1}
.footer .brand{color:#fff}
.footer a:hover{color:var(--gold)}
.form-panel{background:#363638;border-color:#58595b;color:#f2f2f2}
.field input,.field select,.field textarea{background:#f6f6f6;color:#222224;border-color:#b7b7b7}
.field :focus{outline-color:#ffd700}
.aside .contact strong{color:#fff}
.rate-row{border-top-color:#646568}
@media(max-width:610px){.hero:after{background:linear-gradient(180deg,#222224de 0%,#222224a8 52%,#222224f5 100%)}}

/* Dienstpictogrammen en compacte kaarten voor telefoons. */
.card .icon{display:inline-block;align-self:flex-start;font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif;font-size:2rem;line-height:1.2;margin-bottom:25px}
@media(max-width:610px){.cards{gap:12px}.card{padding:24px;min-height:0}.card .icon{font-size:2.1rem;margin-bottom:18px}.card h3{overflow-wrap:anywhere}.card .row-link{padding-top:22px}}

/* Drie merkbeloftes links van het logo, met ruimte voor het motto. */
.feature-visual{min-height:520px;gap:26px}
.feature-highlights{display:grid;grid-template-columns:minmax(0,1fr) 150px;gap:10px;align-items:center;min-width:0}
.feature-benefits{list-style:none;padding:0;margin:0;min-width:0}
.feature-benefits li{border:0;padding:0 0 13px;margin:0 0 13px;border-bottom:1px solid #ffffff26}
.feature-benefits li:last-child{border-bottom:0;margin-bottom:0;padding-bottom:0}
.feature-benefits li:before{content:none}
.feature-benefits b{display:block;font:800 .96rem/1.25 Manrope,sans-serif;color:var(--gold);margin-bottom:4px}
.feature-benefits span{display:block;font-size:.83rem;line-height:1.45;color:#e2dfd9}
.feature-highlights .feature-logo{width:150px;height:150px;justify-self:end;align-self:center}
.feature-visual>strong{max-width:100%;font-size:clamp(1.6rem,2.65vw,2.35rem)}
@media(max-width:1050px){.feature{grid-template-columns:1fr;gap:34px}.feature-visual{min-height:0}.feature-highlights{grid-template-columns:minmax(0,1fr) 190px}.feature-highlights .feature-logo{width:190px;height:190px}}
@media(max-width:610px){.feature-visual{padding:26px;gap:22px}.feature-highlights{grid-template-columns:minmax(0,1fr) 105px;gap:4px}.feature-highlights .feature-logo{width:105px;height:105px}.feature-benefits b{font-size:.9rem}.feature-benefits span{font-size:.8rem}.feature-visual>strong{font-size:clamp(1.45rem,7vw,2rem)}}
@media(max-width:360px){.feature-highlights{grid-template-columns:1fr}.feature-highlights .feature-logo{grid-row:1;justify-self:center;width:120px;height:120px;margin-bottom:12px}}

/* WhatsApp als directe contactoptie. */
.button-whatsapp{background:#168747;border-color:#168747;color:#fff}
.button-whatsapp:hover{background:#116d39;border-color:#116d39;color:#fff}
.aside .button-whatsapp{width:100%;margin:12px 0 18px;text-align:center;white-space:normal}
@media(max-width:610px){.hero .actions .button{width:100%;justify-content:center}}

/* Direct bellen en mailen op mobiel zonder afwijkende footerafstand. */
.footer-contact a{display:inline;color:inherit;margin:0;overflow-wrap:anywhere}
.footer-contact a:hover,.aside .contact a:hover{text-decoration:underline}
.aside .contact a{color:inherit;text-decoration:underline;text-underline-offset:3px}
/* Taximetertarieven: compacte blokken die aansluiten bij de hoeveelheid tekst. */
.price-grid{width:min(100%,860px);grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.price{padding:19px 22px;min-height:0}
.price strong{font-size:clamp(2rem,3vw,2.55rem);line-height:1.18;margin:7px 0 2px}
.price p{margin:0;font-size:.9rem}
@media(max-width:760px){.price-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:610px){.price-grid{grid-template-columns:1fr;gap:10px}.price{padding:17px 19px}}

/* Schipholprijs direct zichtbaar in de introductie. */
.hero-fare{display:inline-flex;flex-direction:column;align-items:flex-start;gap:1px;max-width:min(100%,580px);padding:13px 19px 14px;margin:0 0 25px;background:#222224ec;border:1px solid #ffd700b8;border-left:5px solid var(--gold);color:#fff;box-shadow:0 10px 28px #0005}
.hero-fare-label{font:800 .78rem/1.35 Manrope,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#fff}
.hero-fare strong{font:800 clamp(1.55rem,2.8vw,2.35rem)/1.15 Manrope,sans-serif;color:var(--gold)}
.hero-fare:hover{border-color:var(--gold);background:#2c2c2e}

/* Rustiger introductie: korte prijsvermelding, tekst na de acties. */
.hero .eyebrow span{display:block}
.hero .actions{margin-top:25px}
.hero p.lead{margin-top:25px;margin-bottom:0}
.hero .hero-motto{margin:19px 0 0}
.hero .trust{margin-top:38px}

/* Op telefoons blijft alle tekst gecentreerd; de desktopopmaak blijft gelijk. */
@media(max-width:850px){
 body{text-align:center}
 .hero h1,.hero p.lead,.page-hero h1,.page-hero-copy p:last-child,.section-top p,.section-intro,.footer p{margin-left:auto;margin-right:auto}
 .hero-logo{margin-left:auto;margin-right:auto}
 .actions,.trust,.payment{justify-content:center}
 .card .icon{align-self:center}
 .footer .brand{justify-content:center}
 .page-hero-logo{justify-self:center}
 .field input,.field textarea,.field select{text-align:center}
 .hero-fare{align-items:center;margin-left:auto;margin-right:auto;border-left:1px solid #ffd700b8;border-top:5px solid var(--gold)}
}
@media(max-width:610px){
 .feature-highlights{grid-template-columns:1fr}
 .feature-highlights .feature-logo{grid-row:1;justify-self:center;width:125px;height:125px}
 .feature-benefits{grid-row:2}
 .rate-row{flex-direction:column;align-items:center;gap:3px}
 .rate-row span{max-width:none}
 .airport article{flex-direction:column;align-items:center}
 .hero-content{padding-top:26px}
 .hero-logo{margin-bottom:4px}
 .hero h1{font-size:clamp(1.75rem,7.3vw,2.25rem)}
 .hero-fare{width:100%;padding:12px 14px;margin-bottom:19px}
 .hero .actions{margin-top:22px}
 .hero p.lead{font-size:1rem;line-height:1.5;margin-top:24px}
 .hero .trust{margin-top:30px}
}
