/* Royal Reserve Limo 2.1.0 — Stability patch
   Shared visual system. Loaded after legacy styles so the release remains low-risk. */
:root{
  --bg:oklch(0.152 0.008 66);
  --bg-deep:oklch(0.118 0.008 66);
  --bg-panel:oklch(0.190 0.010 66);
  --bg-raise:oklch(0.225 0.011 68);
  --ink:oklch(0.935 0.012 82);
  --ink-2:oklch(0.735 0.014 76);
  /* 0.618, not 0.560: the fainter value measured 3.67:1 against the raised
     surface, and this is body-sized caption text that has to clear 4.5:1. */
  --ink-3:oklch(0.618 0.014 72);
  --line:oklch(0.300 0.010 66);
  /* Decorative rules may stay quiet, but this one draws the edge of every text
     field, and a control boundary has to clear 3:1 to be perceivable. */
  --line-2:oklch(0.520 0.012 70);
  --brass:oklch(0.815 0.072 82);
  --brass-deep:oklch(0.720 0.082 74);
  --brass-wash:oklch(0.815 0.072 82 / 0.12);
  --on-brass:oklch(0.185 0.020 70);
  --success:oklch(0.82 0.09 145);
  --danger:oklch(0.74 0.13 32);
  --shadow-sm:0 14px 40px rgba(0,0,0,.18);
  --shadow-lg:0 24px 70px rgba(0,0,0,.22);
  --radius:2px;
  --radius-sm:2px;
  --ff-serif:"Fraunces",Georgia,"Times New Roman",serif;
  --ff-sans:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --maxw:1240px;
  --gutter:clamp(1.25rem, 5vw, 4rem);
  /* 76px matches .portal-header, so both headers are the same height and the
     mobile override below reaches every page. */
  --header-h:76px;
  --ease:cubic-bezier(.22,1,.36,1);
  --dur:.55s;
}
html{scroll-padding-top:calc(var(--header-h) + 18px)}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--ff-sans);font-size:1rem;line-height:1.65;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:inherit}
button,input,select,textarea{font:inherit}
::selection{background:var(--brass-wash);color:var(--ink)}
.wrap{max-width:var(--maxw)}
.section{padding-block:clamp(5.5rem,10vw,9.5rem)}
.h2,.display{letter-spacing:-.02em}
.lede{color:var(--ink-2);line-height:1.55}
.eyebrow{letter-spacing:.24em;color:var(--brass)}

.header{height:var(--header-h);padding-top:env(safe-area-inset-top);transition:background .35s ease,border-color .35s ease,box-shadow .35s ease}
.header.scrolled{background:oklch(0.132 0.008 66 / 0.86);backdrop-filter:blur(14px) saturate(1.1);border-bottom-color:var(--line);box-shadow:none}
/* The lockup now matches the public site: a brass diamond and a letterspaced
   wordmark, instead of a glow with no shape behind it. */
.brand{display:inline-flex;align-items:center;gap:.7rem}
.brand__mark{position:relative;flex:none;width:15px;height:15px;border:1px solid var(--brass);border-radius:0;transform:rotate(45deg);box-shadow:none}
.brand__mark::after{content:"";position:absolute;inset:3px;background:var(--brass)}
.brand__name{font-size:.95rem;font-weight:600;letter-spacing:.26em;text-transform:uppercase}
.nav{gap:1.65rem}
.nav a{font-size:.76rem;letter-spacing:.12em;color:var(--ink-2)}
.header__cta .tel{display:none}
.btn{min-height:48px;border-radius:2px;padding:.95em 1.6em;font-size:.82rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;box-shadow:none;transition:background .35s var(--ease),color .35s var(--ease),border-color .35s var(--ease),transform .35s var(--ease)}
.btn:hover{transform:none}
.btn:active{transform:translateY(1px)}
.btn--brass{background:var(--brass);color:var(--on-brass);border-color:var(--brass);box-shadow:none}
.btn--brass:hover{background:var(--brass-deep);border-color:var(--brass-deep);box-shadow:none}
.btn--ghost{background:transparent;border-color:var(--line-2);color:var(--ink)}
.btn--ghost:hover{background:transparent;border-color:var(--brass);color:var(--brass)}

.hero{min-height:max(760px,100svh);align-items:center}
.hero__media::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,oklch(0.06 0.006 66 / 0.9) 0%,oklch(0.06 0.006 66 / 0.62) 42%,oklch(0.06 0.006 66 / 0.16) 75%),linear-gradient(0deg,oklch(0.118 0.008 66) 0%,transparent 35%)}
.hero__video{filter:none;transform:none;animation:none;will-change:auto}
.hero__veil{background:linear-gradient(180deg,oklch(0.07 0.006 66 / 0.34),transparent 40%,oklch(0.07 0.006 66 / 0.88))}
.hero__inner{padding-top:calc(var(--header-h) + 3rem);padding-bottom:clamp(6rem,13vh,10rem)}
.hero__lockup{opacity:0;animation:heroRise .8s .12s var(--ease) forwards}
.hero__h1{max-width:9ch;font-size:clamp(4rem,9vw,8.7rem);line-height:.92;letter-spacing:-.02em;opacity:0;animation:heroRise 1s .22s var(--ease) forwards}
.hero__h1 em{color:var(--brass);font-weight:300;font-style:italic}
.hero__sub{max-width:610px;font-size:clamp(1.08rem,1.7vw,1.35rem);line-height:1.5;color:var(--ink);opacity:0;animation:heroRise .9s .38s var(--ease) forwards}
.hero__actions{opacity:0;animation:heroRise .9s .5s var(--ease) forwards}
.hero__scroll{opacity:.64;color:var(--ink-2)}
@keyframes heroRise{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}

.trust{background:var(--bg-deep);border-block:1px solid var(--line)}
.trust__grid{max-width:var(--maxw);margin:auto;padding:0 var(--gutter);grid-template-columns:repeat(3,1fr)}
.trust__item{padding:1.55rem 1.25rem;min-height:130px;border-color:var(--line);display:flex;flex-direction:column;justify-content:center;gap:.35rem}
.trust__item .k{color:var(--ink);font-size:.78rem}
.trust__item .v{color:var(--ink-2);font-size:.78rem;line-height:1.5}
.trust__icon{width:28px;height:28px;color:var(--brass);margin-bottom:.35rem}

.book{position:relative;background:var(--bg-deep)}
.book::before{content:"";position:absolute;inset:0;background:none;pointer-events:none}
.quote-engine{grid-template-columns:minmax(0,1.55fr) minmax(310px,.72fr);gap:1.65rem}
.booking-card,.estimate-card{border:1px solid var(--line);background:var(--bg-panel);border-radius:var(--radius);box-shadow:var(--shadow-lg);overflow:visible}
.booking-card{padding:clamp(1.15rem,3vw,2.25rem)}
.estimate-card{top:calc(var(--header-h) + 24px);padding:1.75rem;background:var(--bg-panel)}
.assistant-box{border:1px solid var(--line);background:var(--bg-raise);border-radius:var(--radius-sm);padding:1.1rem}
.assistant-mode{border-radius:2px;padding:.3rem .55rem;background:var(--brass-wash);color:var(--brass)}
.assistant-row input{border-radius:2px}
.live-trip-summary{top:calc(var(--header-h) + 12px);border-radius:2px;border-color:var(--line);background:var(--bg-panel);box-shadow:none}
.trip-tabs{gap:.4rem;margin:1.35rem 0;grid-template-columns:repeat(3,1fr)}
.trip-tab{border-radius:2px;min-height:45px;border:1px solid var(--line);background:transparent;color:var(--ink-2);font-size:.76rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase}
.trip-tab:hover{border-color:var(--line-2);color:var(--ink)}
.trip-tab[aria-selected=true]{border-color:var(--brass);color:var(--brass);background:var(--brass-wash);box-shadow:none}
.trip-type-notice{border-radius:2px;border-left:0;border:1px solid var(--line);background:var(--bg-raise);padding:.85rem 1rem}
.form-step{animation:stepEnter .45s var(--ease)}
@keyframes stepEnter{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.step-head{padding-bottom:1.1rem;margin-bottom:1.1rem;border-bottom:1px solid var(--line)}
.step-title{font-size:clamp(1.45rem,2.5vw,2rem)}
.step-dot{border-radius:2px;background:var(--line-2)}
.step-dot.active,.step-dot.done{background:var(--brass)}
.field label{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2);font-weight:600}
.field input,.field select,.field textarea,.assistant-row input{min-height:52px;border-radius:2px;border:1px solid var(--line-2);background:var(--bg-deep);color:var(--ink);padding:.9rem 1rem;transition:border-color .2s ease,box-shadow .2s ease,background .2s ease}
.field textarea{min-height:120px;resize:vertical}
.field input::placeholder,.assistant-row input::placeholder{color:var(--ink-3)}
.field input:hover,.field select:hover,.field textarea:hover,.assistant-row input:hover{border-color:var(--line-2)}
.field input:focus,.field select:focus,.field textarea:focus,.assistant-row input:focus{outline:none;border-color:var(--brass);box-shadow:0 0 0 3px var(--brass-wash);background:var(--bg-deep)}
.address-input-wrap input{padding-left:2.8rem}
.address-pin{color:var(--brass)}
.address-suggestions{border-radius:2px;border-color:var(--line-2);background:var(--bg-panel);box-shadow:var(--shadow-lg)}
.address-suggestion{min-height:58px}
.airport-shortcuts button{border-radius:2px;min-height:34px;padding:.35rem .75rem;border:1px solid var(--line);background:transparent;color:var(--ink-2)}
.airport-shortcuts button:hover{border-color:var(--brass);color:var(--brass)}
.swap-addresses{border-radius:2px;width:44px;height:44px;border:1px solid var(--line);background:transparent;color:var(--brass)}
.swap-addresses:hover{border-color:var(--brass);background:var(--brass-wash)}
#routeMap{border-radius:2px;overflow:hidden;min-height:330px;border-color:var(--line);background:var(--bg-deep)}
.route-actions{align-items:center}
.route-status{line-height:1.5;color:var(--ink-2)}
.route-status.success{color:var(--success)}
.route-status.error{color:var(--danger)}
.choice-grid{gap:1rem}
.choice-card{border-radius:2px;padding:1.2rem;min-height:130px;border:1px solid var(--line);background:var(--bg-panel);transition:border-color .3s ease,background .3s ease}
.choice-card:hover{transform:none;border-color:var(--line-2);box-shadow:none}
.choice-card:has(input:checked){border-color:var(--brass);background:var(--brass-wash);box-shadow:none}
.tip-panel,.checkout-review,.payment-option,.policy-check{border-radius:2px;background:var(--bg-raise)}
.tip-option{border-radius:2px;min-height:42px;display:flex;align-items:center;justify-content:center;border:1px solid var(--line);color:var(--ink-2)}
.tip-option.selected{border-color:var(--brass);background:var(--brass-wash);color:var(--brass);box-shadow:none}
.checkout-review{padding:1.25rem;border-color:var(--line);background:var(--bg-raise)}
.checkout-review__route{position:relative;padding-left:1.65rem}
.checkout-review__route::before{content:"";position:absolute;left:.35rem;top:.35rem;bottom:1.2rem;width:1px;background:linear-gradient(var(--brass),transparent)}
.checkout-review__route::after{content:"";position:absolute;left:.08rem;top:.25rem;width:.55rem;height:.55rem;border:2px solid var(--brass);border-radius:50%;background:var(--bg-panel)}
.checkout-review__total strong,.estimate-total strong{font-variant-numeric:tabular-nums}
.form-nav{gap:.8rem;padding-top:1.1rem}
.form-alert{border-radius:2px;border:1px solid var(--danger);background:oklch(0.74 0.13 32 / 0.1);color:oklch(0.86 0.08 32)}
.secure-note{border-radius:2px;background:oklch(0.82 0.09 145 / 0.08);border-color:oklch(0.82 0.09 145 / 0.32);color:var(--success)}
.confirm{border-radius:var(--radius);padding:clamp(2rem,5vw,4rem);background:var(--bg-panel);border:1px solid var(--line-2)}

.visual-services,.fleet,.rates,.experience{background:transparent}
.sec-head--split{gap:clamp(2rem,8vw,7rem)}
.service-photo-grid{gap:1.25rem}
.service-photo{border-radius:var(--radius);overflow:hidden;min-height:500px;box-shadow:none;border:1px solid var(--line);transition:transform .55s var(--ease),border-color .55s var(--ease)}
.service-photo:hover{transform:translateY(-4px);border-color:var(--line-2)}
.service-photo::before{transition:background .55s ease}
.service-photo:hover::before{background:linear-gradient(180deg,oklch(0.07 0.006 66 / 0.08),oklch(0.07 0.006 66 / 0.88))}
.service-photo>div{padding:2rem}
.fleet-showcase{border-radius:var(--radius);overflow:hidden;border-color:var(--line);box-shadow:none;background:var(--bg-panel)}
.fleet-showcase__image{transition:transform 1s var(--ease),filter .5s ease;filter:saturate(.75) contrast(1.04)}
.fleet-showcase:hover .fleet-showcase__image{transform:scale(1.035);filter:saturate(.9) contrast(1.05)}
.fleet__grid--three{grid-template-columns:repeat(2,minmax(0,1fr));max-width:none}
.veh{border-radius:var(--radius);overflow:hidden;border-color:var(--line);background:var(--bg-panel);box-shadow:none;transition:transform .45s var(--ease),border-color .35s ease}
.veh:hover{transform:translateY(-4px);box-shadow:none;border-color:var(--line-2)}
.veh__media{height:340px;overflow:hidden;transition:transform .8s var(--ease);filter:saturate(.68) contrast(1.06)}
.veh:hover .veh__media{transform:scale(1.025);filter:saturate(.86) contrast(1.04)}
.veh__body{padding:1.5rem}
.veh__class{border-radius:2px;background:oklch(0.118 0.008 66 / 0.78);color:var(--brass)}
.veh__specs{border-block-color:var(--line)}
.amenity-row span{border-radius:2px;background:var(--bg-raise);color:var(--ink-2)}
.coverage-cards,.promise-grid{gap:1rem}
.coverage-cards article,.promise-grid article{border-radius:var(--radius);background:var(--bg-panel);border:1px solid var(--line);padding:1.6rem;transition:transform .35s var(--ease),border-color .35s ease}
.coverage-cards article:hover,.promise-grid article:hover{transform:translateY(-4px);border-color:var(--line-2)}
.steps{gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.step{background:var(--bg-panel);padding:2rem}
.rates__wrap{border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:var(--bg-panel)}
.rates__table{margin:0}
.rates__table th,.rates__table td{padding:1.25rem 1.35rem}
.faq-list{border-top-color:var(--line)}
.faq-item{border-bottom-color:var(--line)}
.faq-q{font-family:var(--ff-serif);font-size:clamp(1rem,1.3vw,1.18rem);padding:1.35rem 0}
.faq-a p{color:var(--ink-2)}
.footer{background:var(--bg-deep);border-top:1px solid var(--line)}
.footer__top{gap:4rem}
.callbar{background:oklch(0.118 0.008 66 / 0.94);backdrop-filter:blur(12px);border-top-color:var(--line)}
.callbar a{min-height:50px}

.reveal{transform:translateY(26px);opacity:0;transition:opacity .8s var(--ease),transform .8s var(--ease)}
.reveal.in{transform:none;opacity:1}

/* Portal and utility pages */
.portal-shell{min-height:100svh;background:var(--bg);color:var(--ink);font-family:var(--ff-sans)}
.portal-header{height:76px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 clamp(1rem,5vw,4rem);background:var(--bg-deep);position:sticky;top:0;z-index:20}
.portal-main{width:min(1120px,100%);margin:auto;padding:clamp(2rem,6vw,5rem) clamp(1rem,5vw,3rem)}
/* Flat, not floating: every portal page had been overriding the drop shadow
   away individually, so the shadow lives nowhere and is declared once here. */
.portal-card{background:var(--bg-panel);border:1px solid var(--line);border-radius:var(--radius);padding:clamp(1.2rem,4vw,2.2rem);box-shadow:none}
.portal-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:2px;overflow:hidden;margin:1.5rem 0}
.portal-detail{background:var(--bg-raise);padding:1.1rem}
.portal-detail label{display:block;font-size:.68rem;text-transform:uppercase;letter-spacing:.14em;color:var(--ink-2);margin-bottom:.35rem}
.portal-detail strong{display:block;overflow-wrap:anywhere}
.portal-actions{display:flex;flex-wrap:wrap;gap:.75rem}
.portal-badge{display:inline-flex;align-items:center;border:1px solid var(--line-2);color:var(--brass);border-radius:2px;padding:.4rem .75rem;font-size:.7rem;text-transform:uppercase;letter-spacing:.12em;font-weight:600}
.portal-input{width:100%;min-height:52px;border-radius:2px;border:1px solid var(--line-2);background:var(--bg-deep);color:var(--ink);padding:.85rem 1rem}
.portal-input:focus{outline:none;border-color:var(--brass);box-shadow:0 0 0 3px var(--brass-wash)}
/* inline-flex, not the browser default: this class is used on <a> as well
   as <button>, and an anchor is display:inline, where min-height is ignored
   and vertical padding paints outside the line box without growing the
   parent. Inside a panel with overflow:hidden that clipped the button in
   half. */
.portal-button{display:inline-flex;align-items:center;justify-content:center;text-align:center;min-height:48px;border:1px solid var(--brass);border-radius:2px;padding:.85rem 1.25rem;background:var(--brass);color:var(--on-brass);font-size:.82rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;cursor:pointer}
.portal-button:hover{background:var(--brass-deep);border-color:var(--brass-deep)}
.portal-button.secondary{background:transparent;border:1px solid var(--line-2);color:var(--ink)}
.portal-button.secondary:hover{border-color:var(--brass);color:var(--brass)}

@media(max-width:1050px){
  .nav{display:none}.burger{display:flex}.quote-engine{grid-template-columns:1fr}.estimate-card{position:relative;top:auto}
}
@media(max-width:760px){
  :root{--header-h:68px;--gutter:1rem}.section{padding-block:4.8rem}.header__cta>.btn{display:none}.burger{border-radius:2px}.brand__name{font-size:.82rem}.hero{min-height:820px}.hero__inner{padding-bottom:7rem}.hero__h1{font-size:clamp(3.7rem,17vw,5.6rem)}.hero__sub{font-size:1.02rem}.hero__actions{display:grid;grid-template-columns:1fr;max-width:320px}.hero__actions .btn{width:100%}.hero__scroll{display:none}
  .quote-engine{gap:1rem}.booking-card{padding:1rem;border-radius:2px}.live-trip-summary{position:relative;top:auto;display:grid}.summary-total{text-align:left}.trip-tabs{grid-template-columns:1fr}.trip-tab{width:100%}.assistant-row{grid-template-columns:1fr}.location-grid.address-grid{grid-template-columns:1fr}.swap-addresses{justify-self:center;transform:rotate(90deg);margin:-.25rem 0}.form__row.two,.choice-grid{grid-template-columns:1fr}.form-nav{display:grid;grid-template-columns:1fr}.form-nav .btn{width:100%}.route-actions{align-items:stretch;display:grid}.route-actions .btn{width:100%}#routeMap{min-height:250px}.checkout-review__head,.checkout-review__total{flex-direction:column;align-items:flex-start}.tip-options{grid-template-columns:repeat(2,1fr)}.estimate-card{padding:1.25rem}.sec-head--split{grid-template-columns:1fr}.service-photo-grid,.fleet__grid--three,.coverage-cards,.promise-grid{grid-template-columns:1fr}.service-photo{min-height:430px}.fleet-showcase{grid-template-columns:1fr}.fleet-showcase__image{min-height:300px}.veh__media{height:280px}.rates__table th,.rates__table td{padding:1rem;min-width:150px}.footer__top{grid-template-columns:1fr}.portal-grid{grid-template-columns:1fr}.portal-actions{display:grid}.portal-actions>*{width:100%}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition-duration:.01ms!important}.reveal{opacity:1;transform:none}.hero__video{transform:none}}

/* Mobile interaction safeguards */
@media (max-width: 760px) {
  .airport-shortcuts button,
  .arrowlink {
    min-height: 44px;
  }
  .arrowlink {
    display: inline-flex;
    align-items: center;
  }
}

/* Royal Reserve Limo 2.1.0 — Stability patch and responsive corrections */
html,body{width:100%;max-width:100%;overflow-x:clip}
*,*::before,*::after{box-sizing:border-box}
img,video,iframe,canvas,svg{max-width:100%}
button,input,select,textarea{min-width:0;max-width:100%;font:inherit}
.wrap,.quote-engine,.booking-card,.estimate-card,.form-step,.field,.checkout-review,.portal-card{min-width:0}
.hero__proof{display:flex;flex-wrap:wrap;gap:.65rem 1.2rem;margin-top:1.2rem;color:var(--ink-2);font-size:.72rem;text-transform:uppercase;letter-spacing:.14em;opacity:0;animation:heroRise .9s .58s var(--ease) forwards}
.hero__proof span{display:inline-flex;align-items:center;gap:.45rem}.hero__proof span::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--brass)}
.hero__lockup{display:flex;align-items:center;gap:.7rem;color:var(--brass);font-size:.72rem;letter-spacing:.24em;text-transform:uppercase}.hero__lockup svg{width:22px}
.hero__h1{max-width:12ch}
.live-trip-summary{position:relative!important;top:auto!important;z-index:2;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1rem;align-items:center;margin-bottom:1rem;overflow:hidden}
.live-trip-summary strong,.live-trip-summary span,.checkout-review strong,.estimate-card strong{overflow-wrap:anywhere;word-break:normal}
.stops-panel{margin:1rem 0;border:1px solid var(--line);border-radius:2px;padding:1rem;background:var(--bg-raise)}
.stops-panel__head{display:flex;align-items:center;justify-content:space-between;gap:1rem}.stops-panel__head>div{display:grid;gap:.15rem}.stops-panel__head span,.stops-fee{color:var(--ink-2);font-size:.78rem}.btn--compact{min-height:40px;padding:.6rem 1rem}
.stops-list{display:grid;gap:.75rem;margin-top:.85rem}.stop-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;gap:.55rem;align-items:center}.stop-index{width:28px;height:28px;border-radius:2px;display:grid;place-items:center;border:1px solid var(--line-2);color:var(--brass);font-size:.72rem}.stop-input{width:100%;min-height:48px;border-radius:2px;border:1px solid var(--line-2);background:var(--bg-deep);color:var(--ink);padding:.8rem .9rem}.stop-action{width:40px;height:40px;border:1px solid var(--line);border-radius:2px;background:transparent;color:var(--ink-2);cursor:pointer}.stop-action:hover{border-color:var(--brass);color:var(--brass)}
.checkout-review__route{display:grid;gap:.45rem}.checkout-itinerary{display:grid;gap:.65rem;margin-top:.65rem}.checkout-leg{border:1px solid var(--line);border-radius:2px;padding:.8rem;background:var(--bg-deep)}.checkout-leg span{display:block;color:var(--brass);font-size:.66rem;text-transform:uppercase;letter-spacing:.12em}.checkout-leg strong{display:block;margin-top:.2rem}.checkout-leg small{display:block;color:var(--ink-2);margin-top:.2rem}
.estimate-route b{display:block;white-space:normal;overflow-wrap:anywhere}
.portal-button,.portal-header a,.arrowlink{text-decoration:none}
.portal-button.danger{background:transparent;border:1px solid oklch(0.74 0.13 32 / 0.5);color:var(--danger)}
.portal-button:disabled,.btn:disabled{opacity:.55;cursor:not-allowed;transform:none}
.portal-toast{position:fixed;right:1.25rem;top:92px;z-index:999;max-width:360px;padding:1rem 1.1rem;border:1px solid var(--line-2);border-radius:2px;background:var(--bg-panel);box-shadow:var(--shadow-lg);color:var(--ink);transform:translateY(-12px);opacity:0;pointer-events:none;transition:.25s var(--ease)}.portal-toast.show{opacity:1;transform:none}.portal-toast.success{border-color:oklch(0.82 0.09 145 / 0.5)}.portal-toast.error{border-color:oklch(0.74 0.13 32 / 0.55)}

@media(max-width:1050px){
  .quote-engine{grid-template-columns:minmax(0,1fr)}
  .estimate-card{position:relative!important;top:auto!important;width:100%}
}
@media(max-width:760px){
  html{scroll-padding-top:76px}
  body{overflow-x:clip!important;padding-bottom:0!important}
  .wrap{width:100%;max-width:100%;padding-inline:1rem!important}
  .header>.wrap{padding-inline:1rem!important}
  .mobile-menu{inset:var(--header-h) 0 auto 0!important;width:100%!important;max-width:none!important;padding:1.15rem 1rem 1.35rem!important;gap:.2rem!important;background:var(--bg-deep)!important;overflow-y:auto;max-height:calc(100svh - var(--header-h))}
  .mobile-menu a:not(.btn){min-height:48px!important;padding:.72rem .2rem!important;font-size:1rem!important;letter-spacing:.02em!important}
  .mobile-menu .btn{width:100%!important;min-height:52px!important;margin-top:.55rem!important;white-space:nowrap!important;padding:.8rem 1rem!important;font-size:.78rem!important}
  .burger[aria-expanded="true"] span{background:transparent}.burger[aria-expanded="true"] span::before,.burger[aria-expanded="true"] span::after{top:0}.burger[aria-expanded="true"] span::before{transform:rotate(45deg)}.burger[aria-expanded="true"] span::after{transform:rotate(-45deg)}
  .hero{min-height:760px!important;align-items:flex-end!important}.hero__media::after{background:linear-gradient(180deg,oklch(0.07 0.006 66 / 0.35),oklch(0.07 0.006 66 / 0.82) 58%,oklch(0.118 0.008 66) 100%)!important}.hero__video{object-position:62% center!important;filter:none!important;transform:none!important;animation:none!important}.hero__inner{width:100%;padding:calc(var(--header-h) + 5.5rem) 0 5.25rem!important}.hero__lockup{font-size:.62rem}.hero__h1{font-size:clamp(3.2rem,15vw,4.7rem)!important;line-height:.95!important;max-width:10ch!important}.hero__sub{max-width:34ch!important}.hero__proof{display:grid;gap:.45rem;margin-top:1rem}.hero__actions{max-width:none!important;width:100%!important}.hero__actions .btn{white-space:nowrap}
  
  .book .wrap{padding-inline:.75rem!important}.book__aside{padding-inline:.25rem}.quote-engine,.booking-card,.estimate-card,.assistant-box,.live-trip-summary,.checkout-review{width:100%!important;max-width:100%!important}
  .booking-card{padding:.85rem!important;overflow:hidden!important}.assistant-box{padding:.85rem!important}.assistant-row:not([hidden]){display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:.65rem!important}.assistant-row .btn{width:100%!important}.assistant-row input{width:100%!important}
  .live-trip-summary{grid-template-columns:minmax(0,1fr)!important;padding:.9rem!important}.summary-total{text-align:left!important}.trip-tabs:not([hidden]){display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:.35rem!important}.trip-tab{width:100%!important;min-width:0!important;padding:.65rem .25rem!important;font-size:.68rem!important;letter-spacing:.06em!important;white-space:nowrap!important}
  .location-grid.address-grid:not([hidden]){display:grid!important;grid-template-columns:minmax(0,1fr)!important;width:100%!important}.address-field,.address-input-wrap,.address-input-wrap input{width:100%!important;max-width:100%!important}.swap-addresses{transform:rotate(90deg)!important;margin:.15rem auto!important}.address-suggestions{left:0!important;right:0!important;width:100%!important;max-width:100%!important}
  .stops-panel__head{align-items:flex-start;flex-direction:column}.stops-panel__head .btn{width:100%}.stop-row{grid-template-columns:auto minmax(0,1fr) auto}.stop-row .move-stop{display:none}
  #routeMap{width:100%!important;max-width:100%!important;min-height:250px!important}.route-actions{width:100%!important}.route-actions>*{max-width:100%!important}
  .form__row:not([hidden]),.form__row.two:not([hidden]),.choice-grid:not([hidden]),.form-nav:not([hidden]){display:grid!important;grid-template-columns:minmax(0,1fr)!important;width:100%!important}.field,.field input,.field select,.field textarea{width:100%!important;max-width:100%!important}.choice-card{width:100%!important;max-width:100%!important;min-width:0!important;overflow:hidden}.choice-card small{display:block;white-space:normal;overflow-wrap:anywhere}
  .tip-options:not([hidden]){display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;width:100%!important}.tip-option{width:100%!important;min-width:0!important}.checkout-review__lines>div:not([hidden]),.estimate-line:not([hidden]){display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:.75rem!important}.checkout-review__lines strong,.estimate-line strong{text-align:right;overflow-wrap:anywhere}.checkout-review__route{padding-left:1.25rem!important}.policy-check{align-items:flex-start!important}.policy-check span{overflow-wrap:anywhere}
  .estimate-card{overflow:hidden!important;padding:1rem!important}.estimate-card *{max-width:100%}.estimate-disclaimer{font-size:.78rem!important}
  .service-photo,.veh,.fleet-showcase,.coverage-cards article,.promise-grid article{width:100%!important;max-width:100%!important}
  .portal-main{padding:1.25rem .75rem 2.5rem!important}.portal-card{padding:1rem!important;border-radius:2px!important}.portal-header{height:68px;padding-inline:1rem}.portal-header .brand__name{font-size:.82rem}.portal-header .arrowlink{font-size:.72rem}.portal-grid{grid-template-columns:minmax(0,1fr)!important}.portal-detail{padding:.8rem!important}.portal-actions{grid-template-columns:minmax(0,1fr)!important}.portal-toast{left:.75rem;right:.75rem;top:78px;max-width:none}
}

/* Royal Reserve Limo 2.1.0 stability patch — hero visibility, estimate clarity, and checkout consent */
.hero__content{
  width:min(720px,100%);
  padding:clamp(1.35rem,3vw,2.25rem);
  border:1px solid oklch(0.935 0.012 82 / 0.22);
  border-radius:2px;
  background:oklch(0.118 0.008 66 / 0.82);
  box-shadow:var(--shadow-lg);
}
.hero__content .hero__lockup{margin-bottom:1.15rem}
.hero__content .hero__sub{color:var(--ink);max-width:58ch}
.hero__content .hero__actions{margin-top:1.8rem}
.hero__content .hero__actions .btn{min-width:190px;text-align:center}

/* Never hide primary hero content when motion is disabled or animations fail. */
@media(prefers-reduced-motion:reduce){
  .hero__lockup,.hero__h1,.hero__sub,.hero__proof,.hero__actions{
    opacity:1!important;
    transform:none!important;
    animation:none!important;
  }
}

.estimate-card{
  border-color:var(--line);
  box-shadow:var(--shadow-lg);
}
.estimate-card .eyebrow{margin-bottom:.25rem}
.estimate-route{
  padding:1rem 0 1.05rem;
  border-bottom:1px solid var(--line);
}
.estimate-route b{
  color:var(--ink);
  line-height:1.45;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.estimate-route span{display:block;margin-top:.28rem;color:var(--ink-2);font-size:.76rem}
.estimate-lines,.estimate-breakdown{padding-block:.85rem}
.estimate-line{min-height:29px;align-items:center}
.estimate-line strong{white-space:nowrap;overflow-wrap:normal!important;word-break:normal!important}
.estimate-total{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) max-content;
  gap:1rem;
  align-items:center!important;
  padding:1.1rem 0 .25rem!important;
}
.estimate-total span{max-width:14ch;line-height:1.45}
.estimate-total strong{
  min-width:max-content;
  white-space:nowrap!important;
  overflow-wrap:normal!important;
  word-break:keep-all!important;
  line-height:1!important;
  font-family:var(--ff-serif);
  color:var(--brass);
  font-weight:400;
  font-size:clamp(1.85rem,3vw,2.35rem)!important;
}
.estimate-disclaimer{margin-top:1.15rem;color:var(--ink-2);line-height:1.55}

.policy-check{
  position:relative;
  display:grid!important;
  grid-template-columns:24px minmax(0,1fr) auto;
  gap:.8rem;
  align-items:start!important;
  min-height:82px;
  padding:1rem 1.05rem!important;
  border:1px solid var(--line)!important;
  border-radius:2px!important;
  background:var(--bg-raise)!important;
  color:var(--ink-2)!important;
  cursor:pointer;
  transition:border-color .2s ease,background .2s ease,box-shadow .2s ease;
}
.policy-check:hover{border-color:var(--brass)!important;background:var(--brass-wash)!important}
.policy-check:focus-within{border-color:var(--brass)!important;box-shadow:0 0 0 3px var(--brass-wash)}
.policy-check input{
  appearance:none;
  -webkit-appearance:none;
  width:22px!important;
  height:22px!important;
  min-width:22px!important;
  margin:.12rem 0 0!important;
  border:1px solid var(--line-2);
  border-radius:2px;
  background:var(--bg-deep);
  display:grid;
  place-items:center;
  cursor:pointer;
}
.policy-check input::after{
  content:"";
  width:10px;
  height:6px;
  border-left:2px solid var(--on-brass);
  border-bottom:2px solid var(--on-brass);
  transform:rotate(-45deg) scale(0);
  transition:transform .16s ease;
}
.policy-check input:checked{background:var(--brass);border-color:var(--brass)}
.policy-check input:checked::after{transform:rotate(-45deg) scale(1)}
.policy-check__copy{display:block;font-size:.84rem!important;line-height:1.55;overflow-wrap:anywhere}
.policy-check__copy strong{display:block;color:var(--ink);font-size:.9rem;margin-bottom:.2rem}
.policy-check__required{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:25px;
  padding:.18rem .55rem;
  border-radius:2px;
  border:1px solid var(--line-2);
  background:var(--brass-wash);
  color:var(--brass);
  font-size:.64rem;
  font-weight:600;
  letter-spacing:.12em;
  text-transform:uppercase;
  white-space:nowrap;
}
.policy-check__required::before{content:"Required"}
.policy-check:has(input:checked) .policy-check__required{border-color:oklch(0.82 0.09 145 / 0.45);background:oklch(0.82 0.09 145 / 0.1);color:var(--success)}
.policy-check:has(input:checked) .policy-check__required::before{content:"Accepted"}

@media(max-width:760px){
  .hero__content{padding:1.2rem;border-radius:2px;background:oklch(0.118 0.008 66 / 0.9)}
  .hero__content .hero__actions{grid-template-columns:1fr!important}
  .hero__content .hero__actions .btn{width:100%;min-width:0}
  .estimate-total{grid-template-columns:minmax(0,1fr) max-content!important}
  .policy-check{grid-template-columns:24px minmax(0,1fr)!important}
  .policy-check__required{grid-column:2;justify-self:start;margin-top:.15rem}
}

/* Royal Reserve Limo 2.1.0 stability patch — cohesive layout and accessibility polish */
:focus-visible{outline:2px solid var(--brass);outline-offset:3px}
.section{padding-block:clamp(4.25rem,7vw,6.75rem)}
.section>.wrap{display:grid;gap:clamp(1.75rem,3vw,2.75rem)}
.sec-head{max-width:68ch}
.sec-head--split{width:100%;max-width:none;align-items:start;gap:clamp(2rem,6vw,5rem)}
.sec-head--split>.lede{max-width:58ch;margin-top:.2rem}
#how .steps{margin-top:0;grid-template-columns:repeat(3,minmax(0,1fr));border-radius:2px}
#how .step{min-height:260px;padding:clamp(1.4rem,2.8vw,2.25rem);display:flex;flex-direction:column;justify-content:flex-start}
#how .step__title{margin-top:auto}
#how .step__desc{max-width:34ch}
#rates .rates__wrap{margin-top:0;border-radius:2px;box-shadow:none}
#rates .rates__table{margin-top:0}
#rates .rates__table caption{padding:1rem 1.2rem;margin:0;border-bottom:1px solid var(--line);background:var(--bg-raise)}
#rates .rates__fine{margin:0;max-width:none;padding:1rem 1.15rem;border:1px solid var(--line);border-radius:2px;background:var(--bg-panel);line-height:1.65}
.checkout-itinerary:empty{display:none}
.checkout-leg--stops ol{margin:.55rem 0 0;padding-left:1.2rem;color:var(--ink-2)}
.checkout-leg--stops li+li{margin-top:.32rem}
.estimate-route b{-webkit-line-clamp:3}
.policy-check.invalid{border-color:oklch(0.74 0.13 32 / 0.75)!important;background:oklch(0.74 0.13 32 / 0.08)!important;box-shadow:0 0 0 3px oklch(0.74 0.13 32 / 0.1)}
.policy-error{display:block;min-height:1.15rem;margin:.4rem 0 0;color:var(--danger);font-size:.78rem;line-height:1.45}
.callbar{transition:transform .28s var(--ease),opacity .28s var(--ease)}
body.booking-visible .callbar{transform:translateY(calc(110% + env(safe-area-inset-bottom)));opacity:0;pointer-events:none}
.live-trip-summary__main,.summary-route,.estimate-route{min-width:0}
#liveSummaryRoute,#summaryRoute{overflow-wrap:anywhere;word-break:normal}

@media(max-width:900px){
  #how .steps{grid-template-columns:1fr}
  #how .step{min-height:auto}
  #how .step__title{margin-top:1rem}
  .sec-head--split{grid-template-columns:1fr!important;gap:1.15rem}
}
@media(max-width:760px){
  .section{padding-block:4.2rem}
  .section>.wrap{gap:1.6rem}
  #how .steps{gap:1px}
  #how .step{padding:1.35rem}
  #rates .rates__wrap{border-radius:2px}
  #rates .rates__table th,#rates .rates__table td{min-width:0!important;padding:.85rem .75rem!important}
  #rates .rates__table th:nth-child(2),#rates .rates__table td:nth-child(2){display:none}
  #rates .rates__table .price{font-size:1.05rem}
  .estimate-route b{-webkit-line-clamp:4}
  .callbar{grid-template-columns:1fr 1fr}
}


/* Royal Reserve Limo 2.1.0 final stability pass — shared utilities and last-mile polish */
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.rates__wrap{overflow:hidden!important}
.rates__table caption{color:var(--ink-2)!important;font-weight:500}
.rates__table tbody tr:last-child td{border-bottom:0}
.rates__table .veh-name{line-height:1.45}
.rates__table .price{font-family:var(--ff-serif);color:var(--brass)}
.footer__social a{display:inline-flex;min-height:42px;align-items:center}
.portal-card,.booking-card,.estimate-card,.checkout-review,.detail-section{isolation:isolate}
@media(max-width:760px){
  .rates__wrap{overflow-x:auto!important;-webkit-overflow-scrolling:touch}
  .rates__table{min-width:0!important;table-layout:fixed}
  .rates__table th:first-child,.rates__table td:first-child{width:58%}
  .rates__table th:last-child,.rates__table td:last-child{width:42%}
  .footer__social{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;width:100%}
  .footer__social a{justify-content:center;border:1px solid var(--line);border-radius:2px;padding:.65rem .75rem}
}


/* Royal Reserve Limo 2.1.0 stability and polish */
.schedule-error{min-height:1.35rem;margin:.55rem 0 0;color:var(--danger);font-size:.78rem}
#summaryRoute,.estimate-route b{display:block!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important;-webkit-line-clamp:unset!important;line-clamp:unset!important;max-width:none!important;overflow-wrap:anywhere!important;line-height:1.5}
.checkout-leg--party{background:var(--bg-raise);border-color:var(--line-2)}
.portal-toast{z-index:1300!important;min-width:min(360px,calc(100vw - 2rem));font-weight:600}
.reservation-total small,.info-item small{display:block;margin-top:.35rem;color:var(--ink-2);font-size:.76rem;font-weight:400}
#how,#rates{padding-block:clamp(4rem,6.5vw,6.25rem)}
#how .sec-head,#rates .sec-head{margin-bottom:clamp(1.75rem,3vw,2.5rem)}
#rates .rates__wrap{width:100%}
@media(max-width:760px){.portal-toast{min-width:0}.status-track:has(.status-stage:nth-child(3):last-child){grid-template-columns:repeat(3,1fr)}}


/* Royal Reserve Limo 2.1 responsive workflow and interaction polish */
.return-fields:not(.show),.hourly-fields:not(.show){display:none!important}
.field.schedule-invalid .err{display:none!important}
#chooseVehicleButton:disabled,#submitBooking:disabled{opacity:.44!important;filter:saturate(.35);cursor:not-allowed!important;box-shadow:none!important}
.current-status-card{position:relative;overflow:hidden}
.current-status-card::after{content:"";position:absolute;inset:auto -20% -70% 35%;height:180px;background:none;pointer-events:none}
@media(prefers-reduced-motion:no-preference){.form-step.active{animation:royalreservelimoStepIn .42s cubic-bezier(.22,1,.36,1)}.portal-card,.booking-card,.estimate-card{animation:royalreservelimoCardIn .5s cubic-bezier(.22,1,.36,1) both}@keyframes royalreservelimoStepIn{from{opacity:.15;transform:translateY(12px)}to{opacity:1;transform:none}}@keyframes royalreservelimoCardIn{from{opacity:.3;transform:translateY(8px)}to{opacity:1;transform:none}}}

/* Royal Reserve Limo 2.1 visual vehicle selection */
.choice-card{padding:0!important;overflow:hidden;min-height:320px!important;display:grid!important;grid-template-rows:160px 1fr;isolation:isolate}
.choice-card__photo{display:block;background-position:center;background-size:cover;filter:saturate(.72) contrast(1.04);transition:transform .55s var(--ease),filter .35s ease}
.choice-card--sedan .choice-card__photo{background-image:linear-gradient(180deg,transparent 55%,oklch(0.118 0.008 66 / 0.8)),url('https://images.unsplash.com/photo-1764089859665-7d417664c5de?auto=format&fit=crop&fm=jpg&ixlib=rb-4.1.0&q=78&w=1200')}
.choice-card--suv .choice-card__photo{background-image:linear-gradient(180deg,transparent 55%,oklch(0.118 0.008 66 / 0.8)),url('https://images.pexels.com/photos/23319054/pexels-photo-23319054.jpeg?auto=compress&cs=tinysrgb&w=1200')}
.choice-card__body{display:block;padding:1.1rem 1.15rem 1.2rem;background:var(--bg-panel)}
.choice-card__eyebrow{display:block;color:var(--brass);font-size:.65rem;letter-spacing:.16em;text-transform:uppercase;margin-bottom:.45rem}
.choice-card__capacity{display:flex;flex-wrap:wrap;gap:.45rem;margin-top:.85rem}.choice-card__capacity span{border:1px solid var(--line);border-radius:2px;color:var(--ink-2);font-size:.68rem;padding:.38rem .55rem}
.choice-card:hover .choice-card__photo,.choice-card:has(input:checked) .choice-card__photo{transform:scale(1.035);filter:saturate(.9) contrast(1.07)}
.choice-card:has(input:focus-visible){outline:2px solid var(--brass);outline-offset:3px}
@media(max-width:620px){.choice-card{grid-template-rows:145px 1fr;min-height:300px!important}}

/* ------------------------------------------------------------------ selects
   Every dropdown gets the same brass chevron. The browser default is drawn
   for a light form control, reads as a grey smudge against this palette, and
   looks different on Windows, macOS and Android, so one control appeared as
   three different products. background-image is forced because several page
   stylesheets set the background shorthand afterwards, which would otherwise
   reset the arrow away. */
select{
  appearance:none;-webkit-appearance:none;-moz-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.75 6 6.25 11 1.75' fill='none' stroke='%23dabf8d' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")!important;
  background-repeat:no-repeat!important;
  background-position:right 0.95rem center!important;
  background-size:12px 8px!important;
  padding-right:2.6rem!important;
}
select::-ms-expand{display:none}
select:disabled{opacity:.55}

/* ------------------------------------------------- date and time pickers
   A calendar you can see and a time you assemble, instead of two native
   controls that look different on every platform and hide AM/PM behind a
   spinner segment. The value lives in a hidden input; this is the surface. */
/* "optional" beside a label, for a field that is required on one service and
   not on another. */
.field__optional{color:var(--ink-3);font-size:.62rem;letter-spacing:.1em;text-transform:lowercase}

.picker{position:relative}
/* The trigger has to be the same height as a text input, because it sits in a
   row beside them. It was not: a button lays its label out on the inherited
   1.65 line-height while an input uses its own, so the trigger came out 4px
   taller, which pushed the whole row down and left the Date label sitting
   above its neighbours. Same line-height, same floor, same box. */
.picker__trigger{
  display:flex;align-items:center;width:100%;min-height:55px;
  border:1px solid var(--line-2);border-radius:2px;background:var(--bg-deep);
  color:var(--ink);padding:.9rem 1rem;font:inherit;text-align:left;cursor:pointer;
  /* After font:inherit, not before: the font shorthand resets line-height. */
  line-height:normal;
  transition:border-color .2s ease,box-shadow .2s ease;
}
.picker__trigger:hover{border-color:var(--brass)}
.picker__trigger:focus-visible{outline:none;border-color:var(--brass);box-shadow:0 0 0 3px var(--brass-wash)}
.picker--empty .picker__text{color:var(--ink-3)}
/* A chosen date is longer than "Pickup date", and in a narrow column it used to
   wrap onto a second line and make one field taller than the rest of the row.
   It rides on one line and clips with an ellipsis instead. */
.picker__text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* The panel opens over the page rather than under the field, so no section that
   clips its own contents can cut the calendar in half. */
.picker-overlay{
  position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;
  padding:1.25rem;background:oklch(0.12 0.008 66 / 0.72);
  animation:pickerFade .16s ease-out;
}
.picker-overlay[hidden]{display:none}
@keyframes pickerFade{from{opacity:0}to{opacity:1}}
.picker-is-open{overflow:hidden}
.picker__panel{
  position:relative;max-height:calc(100dvh - 2.5rem);overflow:auto;
  border:1px solid var(--line-2);border-radius:2px;background:var(--bg-raise);
  box-shadow:0 34px 90px rgba(0,0,0,.6);padding:1.1rem;
  animation:pickerRise .2s cubic-bezier(.16,1,.3,1);
}
@keyframes pickerRise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.picker__close{
  width:34px;height:34px;flex:none;border:1px solid var(--line-2);border-radius:2px;
  background:transparent;color:var(--ink-2);font-size:1.2rem;line-height:1;cursor:pointer;
  transition:border-color .2s ease,color .2s ease;
}
.picker__close:hover{border-color:var(--brass);color:var(--ink)}
.picker__close:focus-visible{outline:none;border-color:var(--brass);box-shadow:0 0 0 3px var(--brass-wash)}
.picker__head{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-bottom:.75rem}
.picker__title{color:var(--ink-3);font-size:.66rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.picker__nav{
  width:34px;height:34px;flex:none;border:1px solid var(--line-2);border-radius:2px;
  background:transparent;color:var(--brass);font-size:1.1rem;line-height:1;cursor:pointer;
}
.picker__nav:hover:not(:disabled){border-color:var(--brass);background:var(--brass-wash)}
.picker__nav:disabled{opacity:.35;cursor:not-allowed}

/* Two months at once where there is room, one on a phone. */
.cal__months{display:flex;gap:1.5rem}
.cal__month{color:var(--ink);font-family:var(--ff-serif);font-size:1.05rem;margin-bottom:.5rem;text-align:center}
.cal__grid{border-collapse:collapse}
.cal__grid th{
  width:38px;padding:.3rem 0;color:var(--ink-3);font-size:.62rem;
  font-weight:600;letter-spacing:.1em;text-transform:uppercase;
}
.cal__grid td{padding:1px}
.cal__day{
  width:38px;height:38px;border:1px solid transparent;border-radius:2px;
  background:transparent;color:var(--ink);font:inherit;font-size:.9rem;cursor:pointer;
}
.cal__day:hover:not(:disabled){border-color:var(--brass);color:var(--brass)}
.cal__day:focus-visible{outline:2px solid var(--brass);outline-offset:1px}
.cal__day.is-outside{color:var(--ink-3)}
.cal__day.is-today{border-color:var(--line-2)}
.cal__day.is-selected{background:var(--brass);color:var(--on-brass);border-color:var(--brass);font-weight:600}
.cal__day:disabled{color:oklch(0.40 0.008 66);cursor:not-allowed}

/* The time is three short lists rather than a spinner, so AM and PM are words
   that are chosen rather than a segment that is typed past. */
/* A rolodex, not three lists of buttons.

   The value you are choosing sits still in a band across the middle and the
   numbers roll under it, which is the thing a physical dial does and the
   reason it reads as a time rather than a form. The band is drawn once across
   all three columns; each column is a scroll-snap track whose padding is
   exactly half its height, so the first and last entries can reach the centre.
   --wheel-h and --wheel-item are read by the script when it scrolls a value
   into place, so the geometry is defined in one place only. */
.wheels{
  --wheel-h:210px; --wheel-item:42px;
  position:relative;display:flex;gap:.35rem;align-items:stretch;justify-content:center;
  border:1px solid var(--line);border-radius:2px;background:var(--bg-deep);padding:.35rem;
}
/* The band. Behind the numbers, and never in the way of a tap. */
.wheels::before{
  content:"";position:absolute;left:.35rem;right:.35rem;top:50%;height:var(--wheel-item);
  transform:translateY(-50%);border-radius:2px;
  background:var(--brass-wash);border-block:1px solid var(--brass);
  pointer-events:none;z-index:0;
}
/* Numbers fade as they roll away from the band. */
.wheels::after{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:2;border-radius:2px;
  background:linear-gradient(var(--bg-deep),transparent 26%,transparent 74%,var(--bg-deep));
}
.wheels__colon{align-self:center;color:var(--ink-2);font-size:1.15rem;z-index:1}
.wheel{
  position:relative;z-index:1;
  height:var(--wheel-h);overflow-y:auto;scroll-behavior:smooth;
  scroll-snap-type:y mandatory;overscroll-behavior:contain;
  /* Half the track, less half an item: what lets the top and bottom entries
     sit in the middle band instead of stopping at the edge. */
  padding-block:calc((var(--wheel-h) - var(--wheel-item)) / 2);
  display:flex;flex-direction:column;min-width:66px;
  scrollbar-width:none;
}
.wheel::-webkit-scrollbar{display:none}
.wheel__item{
  flex:none;height:var(--wheel-item);scroll-snap-align:center;scroll-snap-stop:always;
  display:flex;align-items:center;justify-content:center;
  border:0;background:transparent;color:var(--ink-3);font:inherit;font-size:1.05rem;
  cursor:pointer;text-align:center;
  transition:color .18s ease,transform .18s ease;
}
.wheel__item:hover{color:var(--ink)}
/* The chosen value is the one in the band, so it is weighted rather than
   boxed: a second highlight on top of the band would fight with it. */
.wheel__item.is-on{color:var(--ink);font-weight:600;font-size:1.15rem}
.wheel__item:focus-visible{outline:2px solid var(--brass);outline-offset:-2px;border-radius:2px}
@media (prefers-reduced-motion:reduce){
  .wheel{scroll-behavior:auto}
  .wheel__item{transition:none}
}
.picker__foot{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-top:.8rem}
.picker__preview{color:var(--ink);font-family:var(--ff-serif);font-size:1.1rem}
.picker__save{
  min-height:44px;border:1px solid var(--brass);border-radius:2px;background:var(--brass);
  color:var(--on-brass);padding:.6rem 1.3rem;font-size:.78rem;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;cursor:pointer;
}
.picker__save:hover{background:var(--brass-deep);border-color:var(--brass-deep)}

@media(max-width:760px){
  /* One month, and the panel rises from the bottom edge, which is where a
     thumb already is. */
  .cal__months{gap:0}
  .cal__months .cal:nth-child(2){display:none}
  .picker-overlay{align-items:flex-end;padding:0}
  .picker__panel{
    width:100%;max-height:88dvh;border-width:1px 0 0;border-radius:14px 14px 0 0;padding:1rem .9rem 1.4rem;
    animation:pickerSheet .24s cubic-bezier(.16,1,.3,1);
  }
  .cal__grid{width:100%;table-layout:fixed}
  .cal__grid th,.cal__day{width:100%}
  /* 44px, not 42: the smallest target a thumb should be asked to hit, and the
     calendar is the densest grid of targets on the site. */
  .cal__day{height:44px;font-size:1rem}
  /* The dial's geometry is derived from --wheel-h, so overriding height alone
     left the padding computed for a 210px track inside a 200px one: the
     selected value no longer lined up with the band it is supposed to sit in.
     Change the variable and the padding, the snap points and the band all
     follow. */
  .wheels{--wheel-h:200px}
}
@keyframes pickerSheet{from{transform:translateY(100%)}to{transform:none}}

/* A real price on the vehicle card, rather than a rate that has nothing to do
   with the trip being booked. */
.rate--priced{display:flex;flex-direction:column;align-items:flex-end;line-height:1.2}
.rate--priced [data-rate-unit]{color:var(--ink-3);font-family:var(--ff-sans);font-size:.66rem;letter-spacing:.08em;text-transform:uppercase}

/* ------------------------------------------------------------- reviews
   Offered once a trip is finished. Stars are buttons rather than a select,
   because a rating is one tap and a dropdown is three. 44px targets: this is
   read on a phone, usually just after getting out of the car. */
.review-form{display:grid;gap:.9rem}
.review-pick{display:flex;gap:.35rem}
.review-star-btn{
  width:44px;height:44px;border:1px solid var(--line-2);border-radius:2px;
  background:transparent;color:var(--line-2);font-size:1.4rem;line-height:1;cursor:pointer;
  transition:color .18s ease,border-color .18s ease,background .18s ease;
}
.review-star-btn:hover{border-color:var(--brass);color:var(--brass)}
.review-star-btn.is-on{color:var(--brass);border-color:var(--brass);background:var(--brass-wash)}
.review-star-btn:focus-visible{outline:2px solid var(--brass);outline-offset:2px}
.review-done{display:grid;gap:.6rem}
.review-stars{display:flex;gap:.2rem;font-size:1.3rem;color:var(--line-2)}
.review-star.is-on{color:var(--brass)}
.review-comment{margin:0;color:var(--ink-2);line-height:1.6;overflow-wrap:anywhere}
