/* Site scale and composition. Fixed image ratios keep the complete car visible. */
:root {
  --gutter: clamp(24px, 4.2vw, 112px);
  --type-body: clamp(18px, 1vw, 22px);
  --type-ui: clamp(17px, .9vw, 21px);
  --type-small: clamp(15px, .8vw, 18px);
  --type-title: clamp(46px, 3.1vw, 76px);
  --control-height: clamp(60px, 3.2vw, 76px);
}
body {font-size:var(--type-body)}
.container {width:min(2240px,calc(100% - var(--gutter)*2))}
h2 {font-size:var(--type-title);line-height:1.14;letter-spacing:-.05em}
.button {min-height:var(--control-height);font-size:var(--type-ui);padding:18px 28px;gap:24px}
.button .icon,.icon {width:25px;height:25px}
.text-link {font-size:var(--type-ui)}
.icon-button {width:50px;min-width:50px;height:50px}
.site-header,.site-header.is-home {height:clamp(96px,5vw,124px);background:var(--page)}
.wordmark {font-size:clamp(30px,1.6vw,42px);gap:12px}
.wordmark>.icon {width:44px;height:44px}
.wordmark .prime-logo {width:210px;height:40px;display:block}
.desktop-nav,.header-contact {font-size:var(--type-ui)}
.desktop-nav,.desktop-nav ul {gap:clamp(28px,2vw,52px)}
.header-contact .icon {width:22px;height:22px}

/* The interactive hero is styled in hero.css. */

.section-shell {padding-block:clamp(72px,5vw,120px)}
.section-heading {margin-bottom:clamp(36px,3vw,64px);gap:36px}
.section-heading>p,.centered>p {font-size:var(--type-body);line-height:1.55}
.heading-sun,.faq-sun {display:none}
.catalog {margin:0;border-radius:0;padding-top:24px}
.category-tabs {gap:16px;margin-bottom:18px}
.category-tabs button {min-height:var(--control-height);font-size:var(--type-ui);padding:18px 24px}
.catalog-toolbar {gap:16px}
.catalog-toolbar>button,.toolbar-city {min-height:var(--control-height);font-size:var(--type-ui);padding:16px 22px}
.catalog-toolbar .icon {width:23px;height:23px}
.toolbar-city select {font-size:var(--type-ui)}
.catalog-toolbar>button span {font-size:inherit}
.catalog-status {font-size:var(--type-small);margin:28px 0 24px}
.car-grid {gap:clamp(24px,1.6vw,40px)}
.car-card {padding:18px}
.car-card-link {display:flex;flex-direction:column;height:100%}
.car-image {aspect-ratio:3/2}
.car-category {font-size:var(--type-small);padding:8px 12px;top:16px;left:16px}
.car-card-head {margin:24px 8px 10px;gap:16px}
.car-card h3 {font-size:clamp(23px,1.22vw,30px);line-height:1.35}
.car-card-head>span {font-size:var(--type-small)}
.car-meta {font-size:var(--type-small);margin-inline:8px}
.car-price {margin:auto 8px 22px;padding-top:26px}
.car-price strong {font-size:clamp(30px,1.65vw,40px)}
.car-price span {font-size:var(--type-small)}
.car-action {min-height:var(--control-height);font-size:var(--type-ui);padding:16px 20px}
.benefit-grid {grid-template-rows:clamp(280px,17vw,400px) clamp(280px,17vw,400px);gap:24px}
.benefit>div,.benefit-protect>div,.benefit-route>div {padding:32px}
.benefit h3 {font-size:clamp(24px,1.4vw,34px);line-height:1.3}
.benefit p {font-size:var(--type-small);max-width:28em;margin-top:14px}
.benefit-protect img,.benefit-route img {height:90%}
.benefit-book img {mask-image:linear-gradient(to bottom,transparent 0%,transparent 18%,#000 42%)}
.round-arrow {width:60px;height:60px}
.process-grid {gap:56px}
.process-grid h3 {font-size:clamp(24px,1.35vw,32px)}
.process-grid p {font-size:var(--type-body);max-width:30em}
.step-number {font-size:64px;margin-bottom:28px}
.requirements {font-size:var(--type-small);padding:30px 36px;margin-top:52px}
.requirements .icon {width:23px;height:23px}
.journey-section {height:clamp(720px,38vw,980px)}
.journey-section>img {object-position:center}
.journey-copy {width:clamp(560px,30vw,760px);padding:48px;background:#fffffff5;backdrop-filter:none}
.journey-copy h2 {font-size:clamp(42px,2.3vw,58px);line-height:1.2}
.journey-copy p {font-size:var(--type-body)}
.wordmark-small {font-size:var(--type-small)}
.help-panel {min-height:480px}
.help-copy {padding:clamp(36px,3vw,72px)}
.help-copy h2 {font-size:var(--type-title)}
.help-copy p {font-size:var(--type-body);line-height:1.6}
.faq-layout {gap:clamp(60px,5vw,120px)}
.faq-intro p,.faq-list summary,.faq-list details>p {font-size:var(--type-body)}
.faq-list details {padding:28px 0}
.faq-list details>p {max-width:42em}
.faq-plus {width:44px;height:44px}
.site-footer {padding-block:64px 32px}
.footer-top>p {font-size:var(--type-body)}
.footer-bottom {font-size:var(--type-small);padding-top:32px}
.demo-disclosure {font-size:14px;line-height:1.7;margin-top:28px}

/* Detail pages and dialogs share the same comfortable interface scale. */
.breadcrumb {font-size:var(--type-small)}
.car-title h1,.page-main h1 {font-size:var(--type-title)}
.car-title>span {font-size:var(--type-small)}
.car-detail-layout {grid-template-columns:minmax(0,1.35fr) minmax(460px,1fr);gap:40px}
.booking-column {top:24px}
.booking-form {padding:32px}
.booking-top {font-size:var(--type-small)}
.booking-step h2 {font-size:clamp(32px,2vw,46px);line-height:1.25}
.booking-field {font-size:var(--type-small);margin-top:22px}
.booking-field>input,.booking-field>select,.booking-field>textarea,.booking-field>.range-control {font-size:var(--type-ui);min-height:var(--control-height);padding:16px 18px}
.booking-intro,.extra-row strong,.consent-row,.booking-success p {font-size:var(--type-ui)}
.extra-row small,.small-note,.booking-demo-note,.mileage-note p {font-size:var(--type-small)}
.extra-row {padding:22px 0}
.extra-row input,.consent-row input,.check-row input {width:24px;height:24px}
.summary-top>span,.deposit-line,.price-details,.quote-line {font-size:var(--type-small)}
.summary-top>strong {font-size:clamp(32px,2vw,48px)}
.booking-actions {gap:16px}
.booking-actions .button,.booking-success .button,.dialog-actions .button {font-size:var(--type-ui)}
.mileage-note strong {font-size:var(--type-ui)}
.mileage-note span,.form-error {font-size:var(--type-small)}
.related-cars h2 {font-size:var(--type-title)}
#gallery-position {font-size:var(--type-small);padding:8px 14px}
.info-panel {padding:36px}
.info-panel h2 {font-size:clamp(30px,1.9vw,44px);line-height:1.25}
.car-description,.conditions-list,.rate-table>div {font-size:var(--type-body)}
.spec-grid strong {font-size:var(--type-body)}
.spec-grid span {font-size:var(--type-small)}
.gallery-thumbnails {gap:16px}
.gallery-arrow {width:52px;height:52px}
.calendar-dialog {width:min(1040px,calc(100% - 48px));padding:36px;max-height:calc(100dvh - 48px)}
.dialog-heading h2 {font-size:clamp(30px,2vw,44px)}
.calendar-hint,.calendar-times label,.calendar-times input {font-size:var(--type-small)}
.month-title {font-size:22px}
.week-day {font-size:16px}
.calendar-day {font-size:19px;min-height:48px}
.filter-dialog {width:min(620px,100%);padding:36px}
.filter-body legend {font-size:24px}
.check-row,.price-limit,.price-limit input {font-size:var(--type-ui)}
.contact-dialog {width:720px;padding:40px}
.contact-dialog>p,.contact-detail {font-size:var(--type-body)}
.menu-dialog nav {font-size:30px}
.menu-dialog>p {font-size:var(--type-body)}
.menu-top .wordmark {font-size:30px}
.page-content {font-size:var(--type-body);max-width:960px}
.page-content h2 {font-size:clamp(30px,2vw,44px)}

@media (min-width:1800px) {
  .booking-form {padding:40px}
}
@media (max-width:1200px) {
  .car-detail-layout {grid-template-columns:minmax(0,1.1fr) minmax(400px,1fr);gap:24px}
  .catalog-toolbar {grid-template-columns:1.25fr 1.1fr .7fr .7fr}
  .catalog-toolbar #sort-toggle span {display:none}
}
@media (max-width:1000px) {
  :root {--gutter:28px;--type-body:18px;--type-ui:17px;--type-small:15px;--type-title:44px;--control-height:60px}
  .site-header {height:90px}
  .desktop-nav {display:none}
  .menu-toggle {display:flex;width:48px;height:48px}
  .section-heading {margin-bottom:32px}
  .section-heading>p {font-size:17px}
  .car-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
  .category-tabs {overflow:auto;margin-inline:calc(-1*var(--gutter));padding-inline:var(--gutter);padding-bottom:6px;gap:12px;scrollbar-width:none}
  .category-tabs button {flex:none;font-size:17px;min-height:56px;padding:16px 24px}
  .catalog-toolbar {grid-template-columns:1.2fr 1.2fr 60px 60px;gap:12px}
  .catalog-toolbar>button {padding:16px}
  .catalog-toolbar>button:not(.toolbar-date) span {display:none}
  .catalog-toolbar .toolbar-date,.toolbar-city select {font-size:16px}
  .car-card {padding:14px}
  .car-card h3 {font-size:22px}
  .car-card-head {margin-top:20px}
  .car-price strong {font-size:32px}
  .car-action {font-size:16px;padding:16px}
  .benefit-grid {grid-template-columns:1fr 1fr;grid-template-rows:290px 290px}
  .benefit-car {display:none}
  .benefit-book {grid-column:1}
  .benefit-protect,.benefit-route {grid-column:2}
  .benefit>div,.benefit-protect>div,.benefit-route>div {padding:26px}
  .benefit h3 {font-size:24px}
  .process-grid {gap:28px}
  .process-grid h3 {font-size:23px}
  .process-grid p {font-size:17px}
  .requirements {gap:20px;font-size:16px;align-items:start}
  .journey-copy {width:520px;padding:36px}
  .journey-copy h2 {font-size:38px}
  .journey-copy p {font-size:18px}
  .help-copy h2 {font-size:38px}
  .help-copy p {font-size:18px}
  .help-panel {grid-template-columns:1.2fr 1fr;min-height:440px}
  .help-copy .button {font-size:17px}
  .faq-layout {gap:40px}
  .faq-list summary,.faq-list details>p,.faq-intro p {font-size:17px}
  .footer-top .wordmark {font-size:36px}
  .footer-top>.button {font-size:17px}
  .car-detail-layout {grid-template-columns:1fr}
  .car-mobile-booking-slot:not(:empty) {margin-top:28px}
  .info-panel h2 {font-size:30px}
}
@media (min-width:851px) and (max-width:1000px) {
  .booking-column {position:static;max-width:760px}
}
@media (min-width:701px) and (max-width:1000px) {
}
@media (max-width:850px) {
  .booking-form {padding:28px}
  .booking-step h2 {font-size:32px}
  .mobile-booking-bar {padding:14px var(--gutter) calc(14px + env(safe-area-inset-bottom,0px))}
  .mobile-booking-bar strong {font-size:28px}
  .mobile-booking-bar>div>span {font-size:14px}
  .mobile-booking-bar .button {min-height:56px;font-size:17px}
  .single-voyage_car {padding-bottom:112px}
}
@media (max-width:700px) {
  :root {--gutter:20px;--type-body:17px;--type-ui:16px;--type-small:14px;--type-title:34px;--control-height:58px}
  .site-header {height:80px}
  .wordmark {font-size:27px;gap:8px}
  .wordmark>.icon {width:32px;height:32px}
  .wordmark .prime-logo {width:158px;height:auto}
  .header-contact {font-size:0;width:44px;height:44px;border-color:var(--border)}
  .header-actions {gap:10px}
  .menu-toggle {width:44px;height:44px;border-color:var(--border)}
  .section-shell {padding-block:56px}
  .catalog {padding-top:0}
  .section-heading {margin-bottom:28px}
  .section-heading.centered {text-align:left}
  .centered h2 {font-size:34px;line-height:1.2}
  .heading-sun {display:none}
  .section-heading>p,.centered>p {font-size:17px;margin-top:20px}
  .section-heading>.text-link {font-size:16px;margin-top:20px}
  .category-tabs {gap:10px;margin-bottom:12px}
  .category-tabs button {font-size:16px;min-height:52px;padding:14px 20px}
  .catalog-toolbar {grid-template-columns:minmax(0,1fr) 56px 56px;gap:10px}
  .catalog-toolbar .toolbar-date {grid-column:1/-1;min-height:56px}
  .catalog-toolbar .toolbar-city {grid-column:1;min-height:56px;padding:14px 12px}
  .catalog-toolbar>button:not(.toolbar-date) {width:56px;height:56px;min-height:56px;padding:15px}
  .toolbar-city select {font-size:15px}
  .catalog-status {font-size:14px;margin:22px 0 18px}
  .catalog-status>span:last-child {display:none}
  .car-grid {grid-template-columns:1fr;gap:24px}
  .car-card {padding:14px}
  .car-image {aspect-ratio:3/2}
  .car-category {font-size:13px;top:12px;left:12px;padding:7px 10px}
  .car-card h3 {font-size:24px}
  .car-card-head {margin:22px 6px 10px}
  .car-card-head>span,.car-meta {font-size:14px}
  .car-meta {margin-inline:6px}
  .car-price {margin:24px 6px 20px;padding-top:0}
  .car-price strong {font-size:34px}
  .car-price span {font-size:15px}
  .car-action {font-size:16px;min-height:58px;padding:16px}
  .benefits .section-heading h2 {font-size:34px}
  .benefit-grid {display:flex;flex-direction:column;gap:20px}
  .benefit {min-height:310px}
  .benefit-book {height:480px}
  .benefit>div,.benefit-protect>div,.benefit-route>div {padding:26px}
  .benefit h3 {font-size:24px}
  .benefit p {font-size:16px;line-height:1.5}
  .benefit-protect img,.benefit-route img {height:85%}
  .benefit-car {display:none}
  .process-grid {grid-template-columns:1fr;gap:32px}
  .process-grid li {padding-left:64px}
  .step-number {font-size:40px}
  .process-grid h3 {font-size:23px}
  .process-grid p {font-size:17px}
  .requirements {padding:24px;font-size:15px;gap:20px}
  .journey-section {height:auto;border-radius:24px;display:flex;flex-direction:column;background:var(--surface)}
  .journey-section>img {aspect-ratio:3/2;height:auto;object-fit:cover}
  .journey-section>.container {position:static;display:block;padding-block:28px}
  .journey-copy {padding:0;background:none;width:100%}
  .journey-copy h2 {font-size:34px;margin-block:20px}
  .journey-copy p {font-size:17px;max-width:100%}
  .wordmark-small {font-size:16px}
  .journey-copy .text-link {font-size:17px}
  .help-panel {grid-template-columns:1fr;min-height:0}
  .help-copy {padding:28px}
  .help-copy h2 {font-size:32px}
  .help-copy p {font-size:17px}
  .help-copy .button {font-size:16px;padding-inline:18px}
  .help-image {height:260px;margin-top:-20px}
  .faq-layout {display:block}
  .faq-intro h2 {font-size:34px}
  .faq-intro p,.faq-intro .text-link {font-size:17px}
  .faq-list summary,.faq-list details>p {font-size:17px}
  .faq-list details>p {padding-right:0}
  .faq-list details {padding:24px 0}
  .faq-plus {width:40px;height:40px}
  .site-footer {padding:40px 0 28px}
  .footer-top {gap:24px}
  .footer-top>p,.footer-top>.button {font-size:17px}
  .footer-bottom {font-size:15px;gap:24px}
  .footer-bottom nav {gap:16px 24px}
  .demo-disclosure {font-size:13px}
  .page-main h1,.car-title h1 {font-size:34px}
  .car-title>span,.breadcrumb {font-size:14px}
  .booking-form {padding:24px}
  .booking-top {font-size:14px}
  .booking-step h2 {font-size:30px}
  .booking-field {font-size:15px}
  .booking-field>input,.booking-field>select,.booking-field>textarea,.booking-field>.range-control {font-size:16px;min-height:58px;padding:14px 16px}
  .booking-intro,.extra-row strong,.consent-row {font-size:16px}
  .extra-row small,.small-note,.booking-demo-note {font-size:14px}
  .summary-top>strong {font-size:32px}
  .summary-top>span,.deposit-line,.price-details,.quote-line {font-size:14px}
  .summary-top {gap:16px;flex-wrap:wrap}
  .extra-row {gap:16px}
  .info-panel {padding:24px}
  .info-panel h2 {font-size:26px}
  .car-description,.conditions-list,.rate-table>div {font-size:16px}
  .rate-table>div {gap:20px}
  .spec-grid strong {font-size:17px}
  .spec-grid span {font-size:14px}
  .info-panel .text-link {font-size:16px}
  .mobile-booking-bar {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:16px;padding:14px 20px calc(14px + env(safe-area-inset-bottom,0px))}
  .mobile-booking-bar strong {font-size:clamp(22px,6.5vw,26px)}
  .mobile-booking-bar>div>span {font-size:13px}
  .mobile-booking-bar .button {width:100%;font-size:16px;min-height:58px;min-width:0;padding:14px;gap:10px}
  .related-cars .car-grid {grid-template-columns:1fr}
  .related-cars h2 {font-size:32px}
  .page-content {font-size:17px}
  .page-content h2 {font-size:27px}
  .calendar-dialog {width:100%;max-width:100%;height:100dvh;max-height:100dvh;margin:0;padding:24px 20px;border-radius:0}
  .calendar-dialog[open] {display:flex;flex-direction:column}
  .calendar-months {display:flex;flex-direction:column;overflow:auto;flex:1;min-height:0;gap:28px}
  .calendar-dialog .dialog-heading h2,.dialog-heading h2 {font-size:24px}
  .calendar-hint {font-size:16px;margin-bottom:20px}
  .month-title {font-size:20px}
  .week-day {font-size:15px}
  .calendar-day {font-size:17px;min-height:42px}
  .calendar-times input,.calendar-times label {font-size:16px}
  .calendar-times label {display:block}
  .calendar-times input {width:100%;margin-top:8px;min-height:48px}
  .dialog-actions {display:flex;gap:12px;justify-content:space-between}
  .dialog-actions .button {font-size:16px;min-height:56px;padding:16px;gap:10px}
  .filter-dialog {width:100%;padding:26px 20px}
  .check-row,.price-limit,.price-limit input {font-size:17px}
  .contact-dialog {max-width:calc(100% - 28px);padding:26px}
  .contact-dialog .dialog-heading h2 {font-size:25px}
  .contact-dialog>p,.contact-dialog .button {font-size:17px}
  .booking-success h2 {font-size:28px}
  .booking-success p {font-size:17px}
}
/* A long pickup form must scroll fully into view on laptop screens. */
@media(min-width:1001px) and (max-height:1199px){.booking-column{position:static}}

/* Preserve the existing specification styling while fitting the engine field. */
.spec-grid.has-engine{grid-template-columns:repeat(auto-fit,minmax(min(120px,100%),1fr))}

/* Align the Kia cover and hero with the fleet's right-facing Creta. */
img[src*="/images/ceed.webp"],img[src*="/images/hero-ceed.webp"]{scale:-1 1}

/* Rental requirements: three light, aligned points instead of a filled strip. */
.rental-process .requirements{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:center;gap:48px;list-style:none;padding:0;margin:60px 0 0;background:transparent;border-radius:0;font-size:var(--type-ui)}
.requirements li{display:flex;align-items:center;gap:18px;min-width:0;line-height:1.45}
.requirements .requirement-icon{display:grid;place-items:center;flex:0 0 56px;width:56px;height:56px;background:var(--brand-field);border-radius:50%;color:var(--ink)}
.requirements .requirement-icon .icon{width:28px;height:28px}
.requirements li>span:last-child{max-width:25ch}
@media(max-width:1000px){.rental-process .requirements{grid-template-columns:1fr;gap:24px;margin-top:44px}.requirements li>span:last-child{max-width:none}}
@media(max-width:700px){.rental-process .requirements{margin-top:36px;font-size:17px;gap:20px}.requirements li{gap:16px}.requirements .requirement-icon{flex-basis:48px;width:48px;height:48px}.requirements .requirement-icon .icon{width:25px;height:25px}}