/* EV Exec page components for the service, airport, area, fleet, prices,
   reviews, FAQ and quote pages. Values are taken from the homepage's own
   components (section headings, comfort cards, step cards, price table,
   review cards, FAQ, buttons) so these pages read as the same site.
   Header, menus and footer come from chrome.css. Pages are generated by
   scripts/site/build.js; edit the sources there, not the HTML output. */

:root{--bg:#020813;--gold:#d5a538;--line:rgba(255,255,255,.12)}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;overflow-x:hidden;color:#fff;font:400 16px/1.65 Inter,Arial,sans-serif;
  background:radial-gradient(circle at 65% 5%,rgba(48,99,160,.22),transparent 30%),radial-gradient(circle at 25% 20%,rgba(213,165,56,.08),transparent 28%),#020813}
::selection{background:rgba(213,165,56,.4);color:#06101c}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
p{margin:0 0 1em}
h1,h2,h3{margin:0;line-height:1.1}
h1,h2,.serif{font-family:'Cormorant Garamond',Georgia,serif;font-weight:700}
/* Section headings match the homepage's lighter serif. */
h2{font-weight:500}
h3{font-size:1.06rem;font-weight:800}
.gold{color:var(--gold)}
.wrap{max-width:1280px;margin:0 auto;padding:0 24px}
.skip{position:absolute;left:-999px;top:8px;z-index:100;background:var(--gold);color:#06101c;padding:8px 14px;border-radius:8px;font-weight:700}
.skip:focus{left:8px}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.hidden{display:none!important}

/* Buttons: same as the homepage section buttons (rounded-md, px-7 py-4) */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:54px;padding:0 28px;border-radius:7px;font:700 15px/1 Inter,Arial,sans-serif;text-decoration:none;cursor:pointer;border:0;transition:all .28s ease}
.btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.btn-gold{background:linear-gradient(135deg,#f1c56a,#d5a538 55%,#a97918);color:#06101c;box-shadow:0 16px 38px rgba(213,165,56,.18)}
.btn-gold:hover{transform:translateY(-2px);box-shadow:0 22px 55px rgba(213,165,56,.24)}
.btn-dark{border:1px solid rgba(213,165,56,.7);color:#fff;background:rgba(255,255,255,.02)}
.btn-dark:hover{border-color:rgba(213,165,56,.72);color:#d5a538;background:rgba(213,165,56,.06)}
.btn-row{display:flex;flex-wrap:wrap;gap:14px}
@media(max-width:640px){.hero .btn-row .btn,.cta-band .btn{flex:1 1 100%}}

/* Hero: same eyebrow pill, serif heading and spacing as the homepage hero */
.hero{padding:118px 0 44px;background:radial-gradient(circle at 85% 8%,rgba(213,165,56,.10),transparent 32%),radial-gradient(circle at 10% 85%,rgba(48,99,160,.14),transparent 34%)}
@media(max-width:560px){.hero{padding-top:96px}}
.crumbs{font-size:13px;color:rgba(255,255,255,.45);margin-bottom:18px}
.crumbs ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.crumbs li+li::before{content:'/';margin-right:6px;opacity:.5}
.crumbs a{text-decoration:none}.crumbs a:hover{color:var(--gold)}
.hero-grid{display:grid;gap:34px;align-items:center}
@media(min-width:960px){.hero-grid.has-media{grid-template-columns:1.1fr .9fr}}
.pill{display:inline-flex;border-radius:999px;background:rgba(0,0,0,.35);border:1px solid rgba(255,255,255,.1);padding:6px 16px;font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);font-weight:700}
.hero h1{font-size:clamp(2.35rem,5.2vw,3.6rem);line-height:1.04;margin:18px 0 0;text-wrap:balance}
.hero h1 span{color:var(--gold)}
.lead{font-size:1.08rem;color:rgba(255,255,255,.72);margin:16px 0 0;max-width:680px}
.lead a{color:var(--gold)}
.hero .btn-row{margin-top:24px}
.hero-media{border-radius:18px;overflow:hidden;border:1px solid rgba(213,165,56,.22);background:#07111f;aspect-ratio:4/3}
.hero-media img{width:100%;height:100%;object-fit:cover}
.price-chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.chip{padding:10px 16px;border-radius:12px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.04)}
.chip b{display:block;font-size:22px;font-weight:900;color:var(--gold);line-height:1.1}
.chip small{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.5)}

/* Rating / trust row (same as homepage hero) */
.trust{list-style:none;padding:0;margin:20px 0 0;display:flex;flex-wrap:wrap;gap:8px 20px;font-size:14px}
.trust li{display:inline-flex;align-items:center;gap:7px;color:rgba(255,255,255,.82)}
.trust svg{width:16px;height:16px;fill:none;stroke:var(--gold);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.trust a{text-decoration:none}.trust a:hover{text-decoration:underline}
.stars{color:var(--gold);letter-spacing:1px}

/* Sections: centred eyebrow + serif heading, like the homepage */
.section{padding:52px 0}
.section-head{text-align:center;max-width:780px;margin:0 auto 32px}
.eyebrow{display:block;color:var(--gold);font-size:12px;letter-spacing:.24em;text-transform:uppercase;font-weight:700}
.section h2{font-size:clamp(2.1rem,4.4vw,3rem);margin-top:10px}
.intro{color:rgba(255,255,255,.62);margin:14px 0 0;line-height:1.65}
.intro a,.prose a,.note a{color:var(--gold)}
.prose{max-width:780px;margin:0 auto;color:rgba(255,255,255,.68);line-height:1.75}
.prose p:last-child{margin-bottom:0}
.prose strong{color:#fff}

.grid{display:grid;gap:18px}
@media(min-width:640px){.grid.cols-2,.grid.cols-3,.grid.cols-4{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1000px){.grid.cols-3{grid-template-columns:repeat(3,1fr)}.grid.cols-4{grid-template-columns:repeat(4,1fr)}}

/* Cards: homepage comfort-card */
.card{border-radius:18px;padding:26px;background:linear-gradient(180deg,rgba(255,255,255,.065),rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.105);transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease}
.card h3{margin:16px 0 8px}
.card p{color:rgba(255,255,255,.62);font-size:15px;line-height:1.6;margin:0}
.card .icon{width:34px;height:34px;fill:none;stroke:var(--gold);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
a.card{display:block;text-decoration:none}
a.card:hover{transform:translateY(-4px);border-color:rgba(213,165,56,.28);box-shadow:0 24px 70px rgba(0,0,0,.32)}
a.card .more{display:inline-block;margin-top:14px;color:var(--gold);font-size:14px;font-weight:600}

.split{display:grid;gap:28px;align-items:center}
.split .media{border-radius:18px;overflow:hidden;border:1px solid rgba(213,165,56,.22);background:#07111f}
.split .media img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/3}
.split .section-head{text-align:left;margin:0 0 20px}
.split .prose{margin:0}
@media(min-width:960px){.split{grid-template-columns:1fr 1fr;gap:48px}.split.flip .media{order:2}}

.checklist{list-style:none;padding:0;margin:18px 0 0;display:grid;gap:10px}
.checklist li{position:relative;padding-left:28px}
.checklist li::before{content:'';position:absolute;left:2px;top:.45em;width:14px;height:8px;border-left:2px solid var(--gold);border-bottom:2px solid var(--gold);transform:rotate(-45deg)}

/* Steps: homepage step-card */
.steps .card h3{margin-top:0}
.step-number{width:42px;height:42px;border-radius:999px;display:grid;place-items:center;color:var(--gold);border:1px solid rgba(213,165,56,.5);margin-bottom:18px;font-weight:900}

/* Price table: homepage full-price-card */
.price-card{border-radius:18px;overflow:hidden;border:1px solid rgba(213,165,56,.22);background:linear-gradient(180deg,rgba(255,255,255,.072),rgba(255,255,255,.035)),radial-gradient(circle at 82% 0%,rgba(213,165,56,.10),transparent 40%)}
.price-table{width:100%;border-collapse:separate;border-spacing:0}
.price-table th{color:rgba(255,255,255,.72);font-size:12px;letter-spacing:.14em;text-transform:uppercase;text-align:left;padding:18px 20px;background:rgba(255,255,255,.045);border-bottom:1px solid rgba(255,255,255,.10)}
.price-table td{padding:18px 20px;border-bottom:1px solid rgba(255,255,255,.075)}
.price-table tr:last-child td{border-bottom:0}
.price-table tbody tr:nth-child(even) td{background:rgba(255,255,255,.022)}
.price-table td.num{color:var(--gold);font-size:22px;font-weight:900;white-space:nowrap}
.price-table a{text-decoration:none}.price-table a:hover{color:var(--gold)}
.price-note{padding:18px 22px;border-top:1px solid rgba(255,255,255,.08);color:rgba(255,255,255,.64);font-size:14px;margin:0}
@media(max-width:640px){.price-table th,.price-table td{padding:14px 14px}.price-table td.num{font-size:19px}}
.note{font-size:14px;color:rgba(255,255,255,.55);margin-top:14px;text-align:center}

/* Compact price strip on airport / area pages */
.price-strip{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px;padding:24px 28px;border-radius:18px;border:1px solid rgba(213,165,56,.22);background:linear-gradient(180deg,rgba(213,165,56,.07),rgba(255,255,255,.025))}
.price-strip .figs{display:flex;flex-wrap:wrap;gap:12px 34px}
.price-strip .figs div{font-size:14px;color:rgba(255,255,255,.62)}
.price-strip .figs b{display:block;font-size:26px;font-weight:900;color:var(--gold);line-height:1.1}

/* Fleet cards */
.fleet-card{padding:0;overflow:hidden}
.fleet-card .pic{aspect-ratio:1000/789;background:#050c18}
.fleet-card .pic img{width:100%;height:100%;object-fit:cover}
.fleet-card .body{padding:20px 24px 26px}
.fleet-card h3{font-family:'Cormorant Garamond',serif;font-size:1.7rem;font-weight:700;margin:0}
.specs{display:flex;gap:18px;margin:10px 0 12px;font-size:14px;font-weight:600;color:rgba(255,255,255,.8)}
.specs span{display:inline-flex;align-items:center;gap:6px}
.specs svg{width:16px;height:16px;fill:none;stroke:var(--gold);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.fleet-card ul{margin:0;padding-left:18px;color:rgba(255,255,255,.62);font-size:14.5px;line-height:1.75}

/* CO2 calculator (moved from the homepage) */
.calc{max-width:520px;margin:0 auto;text-align:center}
.calc label{display:block;font-size:12px;color:rgba(255,255,255,.6);text-transform:uppercase;letter-spacing:.16em;margin-bottom:12px}
.calc select{width:100%;max-width:320px;min-height:50px;border-radius:7px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.08);color:#fff;font:16px Inter,Arial,sans-serif;padding:0 14px;text-align:center}
.calc select option{color:#06101c}
.calc-number{font-family:'Cormorant Garamond',serif;font-size:4rem;font-weight:700;color:var(--gold);line-height:1;margin-top:22px;transition:opacity .18s,transform .18s}
.calc small{display:block;color:rgba(255,255,255,.6);margin-top:6px}

/* Reviews: homepage review cards + rating box */
.rating-box{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px 26px;margin:0 auto 22px;padding:18px 24px;max-width:760px;border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.035));border:1px solid var(--line)}
.rating-box .score{font-family:'Cormorant Garamond',serif;font-size:3rem;line-height:1;color:var(--gold);font-weight:700}
.rating-box .stars{font-size:20px;letter-spacing:2px}
.rating-box p{margin:2px 0 0;color:rgba(255,255,255,.65);font-size:14px}
.review{margin:0}
.review .who{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.review .avatar{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;font-weight:700;background:rgba(213,165,56,.15);color:var(--gold);border:1px solid rgba(213,165,56,.3);flex-shrink:0}
.review .who b{display:block;font-size:15px}
.review .who small{color:rgba(255,255,255,.45);font-size:12px}
.review .stars{font-size:18px}
.review blockquote{margin:10px 0 0;color:rgba(255,255,255,.66);font-size:15px;line-height:1.6}
.center{text-align:center}
.links-row{display:flex;flex-wrap:wrap;justify-content:center;gap:14px 22px;margin-top:22px;font-weight:600}
.links-row a{color:var(--gold);text-decoration:none}
.links-row a:hover{text-decoration:underline}

/* FAQ: homepage FAQ style */
.faq{max-width:860px;margin:0 auto;display:grid;gap:10px}
.faq details{border-radius:14px;background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.035));border:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;padding:18px 52px 18px 20px;font-weight:600;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:'+';position:absolute;right:20px;top:50%;transform:translateY(-50%);color:var(--gold);font-size:22px;font-weight:400}
.faq details[open] summary::after{content:'\2212'}
.faq .a{padding:0 20px 18px;color:rgba(255,255,255,.66);line-height:1.65}
.faq .a p:last-child{margin-bottom:0}
.faq .a a{color:var(--gold)}

/* Link lists */
.link-list{list-style:none;padding:0;margin:0 auto;display:grid;gap:10px;max-width:1000px}
@media(min-width:640px){.link-list.cols{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1000px){.link-list.cols{grid-template-columns:repeat(3,1fr)}}
.link-list a{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:15px 18px;border:1px solid rgba(255,255,255,.1);border-radius:14px;background:rgba(255,255,255,.035);text-decoration:none;transition:border-color .25s,background .25s}
.link-list a:hover{border-color:rgba(213,165,56,.3);background:rgba(213,165,56,.045)}
.link-list a span{color:var(--gold);font-size:14px;white-space:nowrap}

/* CTA band: homepage "Book Your Transfer" banner */
.cta-band{display:grid;gap:18px;align-items:center;padding:30px;border-radius:18px;border:1px solid var(--line);background:linear-gradient(90deg,rgba(5,9,18,.95),rgba(5,9,18,.7)) center/cover}
.cta-band h2{font-size:clamp(1.9rem,3.8vw,2.5rem);margin:0 0 6px}
.cta-band p{margin:0;color:rgba(255,255,255,.75)}
@media(min-width:860px){.cta-band{grid-template-columns:1fr auto;padding:34px 40px}}

/* Map */
.map-frame{border-radius:18px;overflow:hidden;border:1px solid rgba(213,165,56,.15);height:300px}
.map-frame iframe{width:100%;height:100%;border:0;display:block}

/* Forms (homepage .input) */
.form{display:grid;gap:14px;max-width:900px;margin:0 auto}
.form .row{display:grid;gap:14px}
@media(min-width:640px){.form .row.two{grid-template-columns:1fr 1fr}.form .row.three{grid-template-columns:1fr 1fr 1fr}}
.form label{display:grid;gap:6px;font-size:13.5px;font-weight:600;color:rgba(255,255,255,.8)}
.form input,.form select,.form textarea{width:100%;min-height:48px;border-radius:7px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.08);color:#fff;padding:12px 14px;font:400 16px Inter,Arial,sans-serif;outline:none;transition:border-color .2s,box-shadow .2s,background .2s}
.form textarea{min-height:110px;resize:vertical}
.form select option{color:#06101c}
.form input::placeholder,.form textarea::placeholder{color:rgba(255,255,255,.4)}
.form input:focus,.form select:focus,.form textarea:focus{border-color:rgba(213,165,56,.55);box-shadow:0 0 0 3px rgba(213,165,56,.10);background:rgba(255,255,255,.12)}
.form .check{display:flex;align-items:center;gap:10px;font-weight:500}
.form .check input{width:20px;min-height:20px;height:20px;accent-color:var(--gold)}
.form-msg{min-height:22px;font-size:14px;margin:0;text-align:center}
.form-msg.ok{color:#4ade80}.form-msg.err{color:#f97066}

@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
/* Larger tap areas without changing the look */
.trust a{display:inline-block;padding:9px 0;margin:-9px 0}
.price-table td a{display:inline-block;padding:10px 0;margin:-10px 0}