/* =====================================================================
   PARKING WAYS - theme v3 (7-Oct-2026)
   Layout/rhythm airportparkingreservations.com jaisa: teal + lime, Arial
   ki bold caps headings, Barlow (Expressway ka free hamshakal) buttons/UI.
   Ye file BASE hai - rebuilt pages par site.css ki jagah yahi load hoti hai.
   Naye components ka prefix "ap-" (purane site.css classes se takraao nahi).
   ===================================================================== */

:root {
    --ink: #0e242b;          /* body text, footer bg */
    --teal: #0a475a;         /* primary dark: panels, buttons ka text, table head */
    --teal-2: #3b6c7b;       /* teal hover */
    --teal-tint: #e7eff1;    /* halka teal pas-manzar */
    --lime: #b4e076;         /* primary CTA */
    --lime-2: #c3e691;       /* CTA hover */
    --lime-tint: #eef7e2;    /* calendar band / selected rows */
    --off: #fbfcf9;          /* teal par likha text */
    --bg-soft: #f3f6f6;      /* alt sections */
    --line: #e7e9ea;
    --line-2: #cfd3d5;
    --field: #b7bdbf;        /* input border */
    --muted: #5b6b70;
    --link: #1c75bc;
    --star: #f5b301;
    --max: 1224px;
    --gut: 16px;
    --r: 8px;
    --r-sm: 4px;
    --shadow-head: 0 8px 16px rgba(40, 44, 74, .04);
    --shadow-card: 0 4px 18px rgba(14, 36, 43, .08);
    --shadow-pop: 0 18px 44px rgba(14, 36, 43, .18);
    --font: Arial, Helvetica, sans-serif;
    --font-ui: 'Barlow', 'Barlow Fallback', Arial, sans-serif;

    /* purane components (range-cal, checkout, help) ke vars yahin se rang lete hain */
    --blue: #0a475a;
    --red: #0a475a;
    --dark: #0e242b;
    --bg: #ffffff;
    --white: #ffffff;
    --radius: 8px;
    --shadow: 0 10px 30px rgba(14, 36, 43, .12);
    --accent: #eef7e2;
    --apb-primary: #0a475a;
    --apb-navy: #0a475a;
    --apb-heading: #0e242b;
    --apb-text: #0e242b;
    --apb-muted: #5b6b70;
    --apb-line: #e7e9ea;
    --apb-soft: #eef7e2;
    --apb-surface: #ffffff;
}

/* Barlow site ke andar se (10-Oct, owner ne download ki ijazat di) - font-display: optional: preload ki hui
   file pehli tasveer tak na pohnchi to us page par fallback hi rehta hai, beech me font kabhi nahi badalta.
   Fallback = Arial, Barlow 600 ke naap par (UI text ki chaurai 89.2%, ascent/descent Barlow jaisa). */
@font-face { font-family: 'Barlow'; font-style: normal; font-weight: 500; font-display: optional; src: url('/assets/fonts/barlow-500.woff2') format('woff2'); }
@font-face { font-family: 'Barlow'; font-style: normal; font-weight: 600; font-display: optional; src: url('/assets/fonts/barlow-600.woff2') format('woff2'); }
@font-face { font-family: 'Barlow'; font-style: normal; font-weight: 700 800; font-display: optional; src: url('/assets/fonts/barlow-700.woff2') format('woff2'); }
@font-face {
    font-family: 'Barlow Fallback';
    src: local('Arial');
    size-adjust: 89.2%;
    ascent-override: 112.2%;
    descent-override: 22.4%;
    line-gap-override: 0%;
}

*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; }
body {
    font-family: var(--font);
    font-size: 16px;
    line-height: 1.5;
    color: var(--ink);
    background: #fff;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    min-width: 320px;
}
img { max-width: 100%; display: block; }
a { color: var(--link); text-decoration: none; }
a:hover { text-decoration: underline; }
button, input, select, textarea { font: inherit; color: inherit; }
ul, ol { list-style: none; }
main ul.ap-list, main .ap-prose ul { list-style: disc; padding-left: 1.25rem; }
main .ap-prose ol { list-style: decimal; padding-left: 1.25rem; }
:focus-visible { outline: 3px solid var(--lime); outline-offset: 2px; }
.sr-only { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.ap-wrap { width: 100%; max-width: calc(var(--max) + 2 * var(--gut)); margin: 0 auto; padding: 0 var(--gut); }
@media (min-width: 768px) { :root { --gut: 24px; } }

/* preloader (site.js isse hatata hai) */
#preloader { display: none !important; }

/* ---------------- typography ---------------- */
.ap-title {
    font: 700 1.5rem/1.75rem var(--font);
    text-transform: uppercase;
    color: var(--ink);
    margin-bottom: 8px;
    text-wrap: balance;
}
.ap-sub { font-size: 1rem; line-height: 1.5rem; color: var(--ink); margin-bottom: 1.5rem; max-width: 72ch; }
.ap-h2 { font: 700 1.75rem/2.1rem var(--font); color: var(--ink); margin-bottom: 1rem; text-wrap: balance; }
.ap-h3 { font: 700 1.25rem/1.6rem var(--font); color: var(--ink); margin-bottom: .5rem; }
@media (min-width: 1024px) {
    .ap-title { font-size: 3rem; line-height: 3.25rem; margin-bottom: 16px; }
    .ap-sub { margin-bottom: 2rem; }
    .ap-h2 { font-size: 2.25rem; line-height: 2.6rem; }
}
.ap-prose { font-size: 1rem; line-height: 1.6; max-width: 80ch; }
.ap-prose p + p, .ap-prose p + ul, .ap-prose ul + p { margin-top: 1rem; }
.ap-prose h3 { font: 700 1.25rem/1.5 var(--font); margin: 1.5rem 0 .5rem; }
.ap-prose a { text-decoration: underline; }

/* ---------------- buttons (APR btn-brand) ---------------- */
.ap-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 10px;
    height: 48px; padding: 11.5px 24px 12.5px;
    border-radius: var(--r); border: 0;
    font: 600 1rem/1.5rem var(--font-ui);
    text-transform: uppercase; letter-spacing: .02em;
    cursor: pointer; white-space: nowrap; text-decoration: none !important;
    transition: background-color .15s, color .15s, border-color .15s;
}
.ap-btn i { font-size: .8em; }
.ap-btn--primary { background: var(--lime); color: var(--teal); }
.ap-btn--primary:hover { background: var(--lime-2); color: var(--teal); }
.ap-btn--primary:active { outline: 4px solid var(--lime); }
.ap-btn--primary:disabled { background: var(--line); color: #869195; cursor: default; }
.ap-btn--secondary { background: transparent; color: var(--teal); border: 2px solid currentColor; }
.ap-btn--secondary:hover { color: var(--teal-2); }
.ap-btn--inverted { background: transparent; color: var(--off); border: 2px solid currentColor; }
.ap-btn--inverted:hover { color: var(--line); }
.ap-btn--block { width: 100%; }
.ap-link-cta { display: inline-flex; align-items: center; gap: 8px; font: 600 1rem/1.5rem var(--font-ui); text-transform: uppercase; color: var(--teal); letter-spacing: .02em; }
.ap-link-cta:hover { color: var(--teal-2); text-decoration: none; }
.ap-link-cta i { font-size: .8em; }

/* ---------------- header ---------------- */
.ap-header { position: sticky; top: 0; z-index: 1000; background: #fff; box-shadow: var(--shadow-head); }
.ap-header .ap-wrap { display: flex; align-items: center; gap: 24px; height: 56px; }
@media (min-width: 1024px) { .ap-header .ap-wrap { height: 80px; } }
.ap-logo { display: inline-flex; align-items: center; gap: 10px; color: var(--ink); text-decoration: none !important; flex: 0 0 auto; }
.ap-logo img, .ap-logo svg { width: 34px; height: 34px; flex: 0 0 auto; display: block; }
.ap-logo-words { display: flex; flex-direction: column; line-height: 1; }
.ap-logo-words b { font: 700 1.3rem/1 var(--font-ui); letter-spacing: .08em; color: var(--ink); text-transform: uppercase; }
.ap-logo-words b span { color: var(--teal); }
.ap-logo-words small { font: 500 .62rem/1 var(--font-ui); letter-spacing: .26em; color: var(--muted); text-transform: uppercase; margin-top: 4px; }
@media (min-width: 1024px) {
    .ap-logo img, .ap-logo svg { width: 40px; height: 40px; }
    .ap-logo-words b { font-size: 1.55rem; }
    .ap-logo-words small { font-size: .68rem; }
}

.ap-header .hamburger {
    margin-left: auto; width: 44px; height: 44px; border: 0; background: transparent;
    color: var(--ink); font-size: 1.35rem; cursor: pointer; display: inline-flex; align-items: center; justify-content: center;
}
#primaryNav { margin-left: auto; }
#primaryNav > ul { display: flex; align-items: center; gap: 28px; }
#primaryNav > ul > li { position: relative; }
#primaryNav .nav-link {
    display: inline-flex; align-items: center; gap: 6px;
    font: 700 1rem/1.5rem var(--font); color: var(--ink); text-decoration: none; white-space: nowrap;
}
#primaryNav .nav-link:hover { color: var(--teal); }
#primaryNav .nav-caret { font-size: .7rem; transition: transform .15s; }
#primaryNav .sub-menu {
    display: none; position: absolute; top: calc(100% + 18px); left: -16px; min-width: 280px; padding: 8px;
    background: #fff; border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--shadow-pop); z-index: 1200;
}
#primaryNav .sub-menu::before { content: ""; position: absolute; left: 0; right: 0; top: -20px; height: 20px; }
#primaryNav .has-menu:hover > .sub-menu, #primaryNav .has-menu.is-open > .sub-menu, #primaryNav .has-menu:focus-within > .sub-menu { display: block; }
#primaryNav .has-menu:hover > .nav-link .nav-caret, #primaryNav .has-menu.is-open > .nav-link .nav-caret { transform: rotate(180deg); }
#primaryNav .sub-menu a { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 6px; font: 500 .9rem/1.25rem var(--font); color: var(--ink); white-space: nowrap; text-decoration: none; }
#primaryNav .sub-menu a i { width: 16px; text-align: center; color: var(--teal); }
#primaryNav .sub-menu a:hover { background: var(--bg-soft); color: var(--teal); }
#primaryNav .nav-cta {
    display: inline-flex; align-items: center; height: 48px; padding: 0 20px; border: 2px solid var(--ink); border-radius: var(--r);
    font: 600 1rem/1 var(--font-ui); text-transform: uppercase; letter-spacing: .02em; color: var(--ink); text-decoration: none; white-space: nowrap;
}
#primaryNav .nav-cta:hover { background: var(--ink); color: #fff !important; }
#primaryNav .nav-cta { background: transparent; color: var(--ink) !important; box-shadow: none; }
#primaryNav .nav-cta::before { content: none !important; }

@media (min-width: 1024px) {
    .ap-header .hamburger { display: none; }
}
@media (max-width: 1023.98px) {
    #primaryNav {
        display: none; position: fixed; top: 56px; left: 0; right: 0; bottom: 0; overflow-y: auto;
        background: #fff; padding: 12px var(--gut) 32px; border-top: 1px solid var(--line); margin: 0;
    }
    #primaryNav.open { display: block; }
    #primaryNav > ul { flex-direction: column; align-items: stretch; gap: 0; }
    #primaryNav > ul > li { border-bottom: 1px solid var(--line); padding: 6px 0; }
    #primaryNav .nav-link { padding: 10px 0; width: 100%; justify-content: space-between; }
    #primaryNav .nav-caret { display: none; }
    #primaryNav .sub-menu { position: static; display: block; box-shadow: none; border: 0; padding: 0 0 6px 8px; min-width: 0; }
    #primaryNav .sub-menu::before { content: none; }
    #primaryNav .sub-menu a { white-space: normal; padding: 9px 6px; }
    #primaryNav > ul > li:last-child { border-bottom: 0; padding-top: 16px; }
    #primaryNav .nav-cta { width: 100%; justify-content: center; }
}

/* ---------------- breadcrumb ---------------- */
.ap-crumbs { padding: 24px 0 8px; font-size: .875rem; color: var(--ink); }
.ap-crumbs ol { display: flex; flex-wrap: wrap; align-items: center; gap: 0 12px; margin: -11px 0; }
.ap-crumbs li { display: inline-flex; align-items: center; gap: 12px; white-space: nowrap; min-height: 44px; }
.ap-crumbs li:last-child { white-space: normal; }
.ap-crumbs li:not(:last-child)::after { content: "\f054"; font: 900 .7rem/1 "Font Awesome 6 Free"; color: var(--ink); }
.ap-crumbs a { color: #4b5b60; display: inline-flex; align-items: center; min-height: 44px; }
/* QA2 (7-Oct): crumb links = 44px tap target; ol ka -11px margin page ki height pehle jitni rakhta hai.
   li nowrap + chevron pichhle item ke BAAD (::after): lambi patti me nayi line kabhi chevron se shuru nahi hoti */
.ap-crumbs [aria-current] { color: var(--ink); }

/* ---------------- sections ---------------- */
.ap-section { padding: 48px 0; }
@media (min-width: 1024px) { .ap-section { padding: 64px 0; } }
.ap-section--soft { background: var(--bg-soft); }
.ap-section--tight { padding-top: 24px; }
.ap-center { text-align: center; }
.ap-center .ap-sub { margin-left: auto; margin-right: auto; }

/* ---------------- hero + search card ---------------- */
.ap-hero {
    position: relative; color: var(--off); background: var(--teal) center/cover no-repeat;
    padding: 24px 0 24px;
}
.ap-hero::before { content: ""; position: absolute; inset: 0; background: rgba(10, 71, 90, .96); }
@media (min-width: 768px) {
    .ap-hero { padding: 56px 0 48px; }
    .ap-hero::before { background: linear-gradient(rgba(14, 36, 43, .38), rgba(14, 36, 43, .52)); }
}
.ap-hero > .ap-wrap { position: relative; z-index: 1; }
/* hero apne andar ke airport-dropdown / calendar ko kabhi na kaate (page CSS overflow:hidden laga de tab bhi),
   aur neeche wale sections ke upar rahe taake khula menu unke peeche na chhupe */
.ap-hero, .apt-hero, .pwh-hero { overflow: visible !important; z-index: 5; }
/* owner (10-Oct): page kabhi sideways scroll na kare - hero ke andar ki koi cheez (blur placeholder, shadow, popup)
   dayen/bayen bahar na nikle; upar/neeche (airport list, calendar) pehle jaisa khula. overflow-x:clip + y:visible jaiz hai. */
.ap-hero, .apt-hero, .pwh-hero { overflow-x: clip !important; overflow-y: visible !important; }
html, body { overflow-x: clip; }
.ap-hero .pwsrch, .apt-hero .pwsrch { position: relative; z-index: 20; }
.ap-hero-head { text-align: center; margin-bottom: 20px; }
.ap-hero-kicker { font: 700 1.125rem/1.4 var(--font); text-transform: uppercase; color: var(--off); }
.ap-hero h1, .ap-hero .ap-hero-title { font: 700 1.875rem/2.25rem var(--font); text-transform: uppercase; color: var(--off); text-wrap: balance; }
.ap-hero .ap-hero-lead { font: 400 1rem/1.5 var(--font); color: var(--off); margin-top: 8px; }
@media (min-width: 1024px) {
    .ap-hero-kicker { font-size: 2.5rem; line-height: 3rem; }
    .ap-hero h1, .ap-hero .ap-hero-title { font-size: 2.5rem; line-height: 3rem; }
    .ap-hero .ap-hero-title--xl { font-size: 4rem; line-height: 4.5rem; }
    .ap-hero .ap-hero-lead { font-size: 1.25rem; }
}
.ap-trust { display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 10px 24px; margin-top: 20px; }
.ap-trust li { display: inline-flex; align-items: center; gap: 8px; font: 600 1rem/1.5rem var(--font-ui); color: var(--off); }
.ap-trust i { color: var(--lime); font-size: 1rem; }
@media (max-width: 767.98px) { .ap-trust { display: grid; grid-template-columns: 1fr 1fr; } }

/* search card: purane JS hooks (form.pwsrch, .pwf-*) wahi, shakl APR ki */
.ap-search.pwsrch {
    display: grid; grid-template-columns: 1fr; gap: 12px; max-width: none; margin: 0;
    background: #fff; border-radius: var(--r); box-shadow: none; padding: 16px; text-align: left; color: var(--ink);
}
.ap-search .pwf-row { display: grid; grid-template-columns: 1fr; gap: 12px; }
.ap-search .pwf-label { display: block; font: 400 .875rem/1.25rem var(--font); color: var(--ink); margin-bottom: 4px; }
.ap-search .pwf-box {
    position: relative; display: flex; align-items: center; min-height: 48px; background: #fff;
    border: 1px solid var(--field); border-radius: var(--r); box-shadow: none; transition: border-color .15s, box-shadow .15s;
}
.ap-search .pwf-box:focus-within { border-color: var(--teal); box-shadow: 0 0 0 3px rgba(10, 71, 90, .15); }
.ap-search .pwf-box > i:first-child { color: var(--ink); font-size: 1.05rem; margin: 0 8px 0 14px; }
.ap-search .pwf-box input, .ap-search .pwf-box select { border: 0; background: transparent; outline: none; font: 400 1rem/1.2 var(--font); color: var(--ink); min-width: 0; }
.ap-search .pwf-box input::placeholder { color: #6b7a7f; }
.ap-search .pwf-combo > input[type=text] { flex: 1; height: 46px; padding: 0 36px 0 16px; }
.ap-search .pwf-combo > i:first-child { display: none; }
.ap-search .pwf-chev { position: absolute; right: 14px; color: var(--ink); font-size: .8rem; pointer-events: none; }
.ap-search .pwf-date { flex: 1; height: 46px; cursor: pointer; padding-right: 8px; overflow: hidden; text-overflow: ellipsis; }
.ap-search .pwf-box > .pwf-time { display: none; }  /* sirf field row me; calendar popup ke andar times dikhen */
.ap-search .apb-rcal .pwf-time, .apb-rcal-times .pwf-time { display: block; }
.ap-search .pwf-btn {
    width: 100%; height: 48px; margin: 0; border: 0; border-radius: var(--r);
    background: var(--lime); color: var(--teal);
    font: 600 1rem/1.5rem var(--font-ui); text-transform: uppercase; letter-spacing: .02em;
    display: inline-flex; align-items: center; justify-content: center; gap: 10px; cursor: pointer; filter: none;
}
.ap-search .pwf-btn:hover:not(:disabled) { background: var(--lime-2); filter: none; }
.ap-search .pwf-btn:disabled { background: var(--lime); color: var(--teal); opacity: .6; cursor: not-allowed; }
.ap-search .pwf-btn i { font-size: .8em; order: 2; }
.ap-search .pwf-menu { position: absolute; z-index: 60; left: -1px; right: -1px; top: calc(100% + 6px); padding: 6px; background: #fff; border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--shadow-pop); max-height: min(360px, 60vh); overflow: auto; }
.ap-search .pwf-menu li { padding: 10px 12px; border-radius: 6px; cursor: pointer; display: flex; flex-direction: column; gap: 2px; }
.ap-search .pwf-menu li b { color: var(--ink); font-weight: 700; font-size: .95rem; }
.ap-search .pwf-menu li small { color: var(--muted); font-size: .8rem; }
.ap-search .pwf-menu li:hover, .ap-search .pwf-menu li.is-active { background: var(--lime-tint); }
.ap-search .pwf-menu li[hidden] { display: none; }
@media (min-width: 1024px) {
    .ap-search.pwsrch { grid-template-columns: 1.2fr 2fr auto; align-items: end; gap: 16px; padding: 20px; }
    .ap-search .pwf-row { grid-template-columns: 1fr 1fr; gap: 16px; }
    .ap-search .pwf-btn { width: auto; padding: 0 24px; }
}

/* ---------------- teal panel (Why book / How it works) ---------------- */
.ap-panel { background: var(--teal); color: var(--off); border-radius: var(--r); padding: 40px 24px; position: relative; overflow: hidden; }
.ap-panel .ap-title, .ap-panel .ap-sub, .ap-panel .ap-h3 { color: var(--off); }
@media (min-width: 1024px) { .ap-panel { padding: 64px; } }
.ap-panel--flush { border-radius: 0; }

.ap-features { display: grid; grid-template-columns: 1fr; gap: 28px; margin-top: 24px; }
.ap-feature { display: grid; grid-template-columns: 64px 1fr; gap: 16px; align-items: start; }
.ap-feature-ico { width: 64px; height: 64px; color: var(--lime); font-size: 3rem; line-height: 1; display: inline-flex; align-items: center; justify-content: center; }
.ap-feature-ico.is-light { color: var(--off); }
.ap-feature h3 { font: 700 1.25rem/1.75rem var(--font); color: var(--off); margin-bottom: 4px; }
.ap-feature p { font-size: 1rem; line-height: 1.5rem; color: var(--off); }
@media (min-width: 768px) {
    .ap-features { grid-template-columns: repeat(3, 1fr); gap: 32px; }
    .ap-feature { grid-template-columns: 1fr; text-align: center; justify-items: center; }
    .ap-feature-ico { width: 100px; height: 100px; font-size: 5.5rem; margin-bottom: 12px; }
}

.ap-steps { display: grid; grid-template-columns: 1fr; gap: 24px; margin: 24px 0 32px; counter-reset: s; }
.ap-step { display: grid; grid-template-columns: 56px 1fr; gap: 12px; align-items: start; }
.ap-step-num { font: 700 4.5rem/1 var(--font); color: var(--lime); }
.ap-step h3 { font: 700 1.125rem/1.6rem var(--font); color: var(--off); margin-bottom: 4px; }
.ap-step p { font-size: 1rem; line-height: 1.5rem; color: var(--off); }
@media (min-width: 768px) {
    .ap-steps { grid-template-columns: repeat(3, 1fr); gap: 16px; }
    .ap-step { grid-template-columns: 1fr; text-align: center; justify-items: center; position: relative; }
    .ap-step-num { font-size: 6rem; margin-bottom: 20px; }
    .ap-step:not(:last-child)::after { content: ""; position: absolute; top: 48px; left: calc(50% + 48px); right: calc(-50% + 48px); border-top: 1px dashed rgba(251, 252, 249, .7); }
}

/* ---------------- cards ---------------- */
.ap-card { background: #fff; border: 1px solid rgba(0, 0, 0, .125); border-radius: var(--r); overflow: hidden; display: flex; flex-direction: column; }
.ap-card--shadow { border-color: var(--line); box-shadow: var(--shadow-card); }
.ap-card-img { position: relative; aspect-ratio: 392 / 200; overflow: hidden; background: var(--bg-soft); }
.ap-card-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .15s cubic-bezier(.4, 0, .2, 1); }
.ap-card:hover .ap-card-img img { transform: scale(1.04); }
.ap-card-img--shade::before { content: ""; position: absolute; inset: 0; background: rgba(0, 0, 0, .25); z-index: 1; }
.ap-card-overlay { position: absolute; inset: 0; z-index: 2; display: flex; align-items: center; justify-content: center; text-align: center; padding: 12px; font: 700 2.25rem/1.1 var(--font); color: #fff; text-transform: uppercase; text-shadow: 0 2px 10px rgba(0, 0, 0, .35); }
.ap-card-body { padding: 24px 24px 0; flex: 1; }
.ap-card-body h3 { font: 900 1.25rem/1.75rem var(--font); color: var(--ink); margin-bottom: 8px; }
.ap-card-body p { font-size: 1rem; line-height: 1.5rem; color: var(--ink); }
.ap-card-foot { padding: 24px; }
.ap-grid-3 { display: grid; grid-template-columns: 1fr; gap: 16px; }
@media (min-width: 768px) { .ap-grid-3 { grid-template-columns: repeat(2, 1fr); gap: 24px; } }
@media (min-width: 1024px) { .ap-grid-3 { grid-template-columns: repeat(3, 1fr); } }
.ap-grid-2 { display: grid; grid-template-columns: 1fr; gap: 16px; }
@media (min-width: 900px) { .ap-grid-2 { grid-template-columns: 1fr 1fr; } }

/* stars */
.ap-stars { display: inline-flex; gap: 2px; color: var(--star); font-size: 1.05rem; line-height: 1; }
.ap-stars .is-off { color: #c9ced6; }
.ap-rating { display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: .875rem; }
.ap-rating b { font-weight: 600; }

/* ---------------- tables ---------------- */
.ap-table-wrap { overflow-x: auto; overflow-y: hidden; position: relative; }
/* owner (7-Oct): sideways scroll wale dibbon me kabhi khari (vertical) scrollbar na aaye - overflow-x:auto
   akela ho to browser overflow-y ko bhi auto bana deta hai, aur 1-2px (sr-only caption, focus ring,
   dotted border) par table ke bagal me upar/neeche wala scrollbar nikal aata tha */
.lp-rates-wrap, .pg-tabs ul, .hc-tabs ul, .hc-cats ul, .pwh-car-track, .lp-car-track, .lp-tabs ul { overflow-y: hidden; }
.lp-rates-wrap { position: relative; }
.ap-table { width: 100%; border-collapse: collapse; font-size: 1rem; min-width: 560px; }
.ap-table th { background: var(--teal); color: var(--off); font-weight: 700; text-align: left; padding: 6px 8px; }
.ap-table td { background: var(--off); padding: 4px 8px; border-bottom: 1px dotted var(--teal); }
.ap-table td a { color: var(--link); }
.ap-note { font-size: .7rem; color: var(--ink); margin-top: 6px; }

/* ---------------- FAQ (title left, accordion right) ---------------- */
.ap-faqwrap { display: grid; grid-template-columns: 1fr; gap: 16px; }
@media (min-width: 1024px) { .ap-faqwrap { grid-template-columns: 360px 1fr; gap: 56px; } }
.ap-faq { border-top: 1px solid var(--line-2); }
.ap-faq details { border-bottom: 1px solid var(--line-2); }
.ap-faq summary {
    list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 16px;
    padding: 20px 0; font: 700 1rem/1.5rem var(--font); color: var(--ink);
}
.ap-faq summary::-webkit-details-marker { display: none; }
.ap-faq summary::after { content: "\f078"; font: 900 .85rem/1 "Font Awesome 6 Free"; color: var(--ink); transition: transform .15s; flex: 0 0 auto; }
.ap-faq details[open] summary::after { transform: rotate(180deg); }
.ap-faq .ap-faq-a { padding: 0 0 20px; font-size: 1rem; line-height: 1.6; color: var(--ink); }
.ap-faq .ap-faq-a p + p { margin-top: .75rem; }

/* ---------------- CTA band ---------------- */
.ap-cta { background: var(--teal); color: var(--off); text-align: center; padding: 48px 0; }
.ap-cta .ap-title { color: var(--off); }
.ap-cta p { font-size: 1.125rem; line-height: 1.6; margin: 0 auto 24px; max-width: 60ch; }
@media (min-width: 1024px) { .ap-cta { padding: 64px 0; } .ap-cta p { font-size: 1.25rem; } }
.ap-cta--soft { background: var(--bg-soft); color: var(--ink); }
.ap-cta--soft .ap-title { color: var(--ink); }

/* ---------------- link grid (Our most popular airports) ---------------- */
.ap-linkgrid h2 { font: 700 1.25rem/1.75rem var(--font); text-transform: uppercase; margin-bottom: 20px; }
.ap-linkgrid ul { display: grid; grid-template-columns: repeat(2, 1fr); gap: 4px 24px; }
@media (min-width: 768px) { .ap-linkgrid ul { grid-template-columns: repeat(4, 1fr); } }
.ap-linkgrid a { font-size: .875rem; line-height: 1.6; color: var(--link); }

/* ---------------- footer ---------------- */
.ap-footer { background: var(--ink); color: var(--off); padding: 40px 0 24px; font-size: 1rem; }
.ap-footer a { color: #b9c3c6; text-decoration: none; }
.ap-footer a:hover { color: #fff; text-decoration: underline; }
.ap-fgrid { display: grid; grid-template-columns: 1fr; gap: 0; }
@media (min-width: 768px) { .ap-fgrid { grid-template-columns: repeat(2, 1fr); gap: 32px 24px; } }
@media (min-width: 1024px) { .ap-fgrid { grid-template-columns: repeat(4, 1fr) 1.15fr; } }
.ap-footer details, .ap-footer summary { background: none; border: 0; border-radius: 0; box-shadow: none; margin: 0; padding: 0; }
.ap-fcol summary { list-style: none; display: flex; align-items: center; justify-content: space-between; font: 600 1rem/1.5rem var(--font); color: var(--off); padding: 14px 0; cursor: pointer; }
.ap-fcol summary::-webkit-details-marker { display: none; }
.ap-fcol summary::after { content: "\f077"; font: 900 .8rem/1 "Font Awesome 6 Free"; transition: transform .15s; }
.ap-fcol:not([open]) summary::after { transform: rotate(180deg); }
.ap-fcol ul { display: grid; gap: 6px; padding-bottom: 12px; }
.ap-fcol li a { font-size: 1rem; line-height: 1.5rem; }
@media (min-width: 768px) {
    .ap-fcol summary { pointer-events: none; padding: 0 0 16px; }
    .ap-fcol summary::after { display: none; }
}
/* phone: accordion rows alag dikhen, brand block un se chipka na ho */
@media (max-width: 767.98px) {
    .ap-fcol { border-bottom: 1px solid rgba(251, 252, 249, .14); }
    .ap-fcol ul { padding: 0 0 14px 2px; }
    .ap-fbrand { margin-top: 28px; }
}
.ap-fbrand p { color: #b9c3c6; font-size: .9rem; line-height: 1.5; margin: 6px 0 14px; max-width: 34ch; }
.ap-fbrand .ap-logo-words b { color: #fff; }
.ap-fbrand .ap-logo-words b span { color: var(--lime); }
.ap-fbrand .ap-logo-words small { color: #b9c3c6; }
.ap-fpay-label { display: inline-flex; align-items: center; gap: 8px; font: 600 .8rem/1 var(--font-ui); letter-spacing: .08em; text-transform: uppercase; color: var(--lime); margin-bottom: 10px; }
.ap-fpay { display: flex; gap: 8px; flex-wrap: wrap; }
.ap-fpay svg { width: 44px; height: 28px; border-radius: 4px; }
.ap-fbottom { display: flex; flex-direction: column; gap: 14px; border-top: 1px solid rgba(251, 252, 249, .5); margin-top: 32px; padding-top: 24px; font-size: .875rem; color: #b9c3c6; }
.ap-fbottom nav { display: flex; flex-wrap: wrap; gap: 0 24px; margin: -10px 0; }
.ap-fbottom nav a { display: inline-flex; align-items: center; min-height: 44px; }
@media (min-width: 768px) { .ap-fbottom { flex-direction: row; justify-content: space-between; align-items: center; } }

/* utilities */
.ap-mt-0 { margin-top: 0 !important; }
.ap-mb-0 { margin-bottom: 0 !important; }
.ap-hide-sm { display: none; }
@media (min-width: 768px) { .ap-hide-sm { display: revert; } .ap-only-sm { display: none !important; } }

/* page-to-page: View Transitions (owner, 7-Oct) - help tabs aur baqi links par page badalne ka
   safed jhatka nahi; header aur help tab-row apni jagah tike rehte hain, sirf andar ka hissa fade. */
@view-transition { navigation: auto; }
.ap-header { view-transition-name: pw-header; }
.hc-tabs { view-transition-name: pw-hc-tabs; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: .16s; }
::view-transition-group(pw-header), ::view-transition-group(pw-hc-tabs) { animation-duration: 0s; }
@media (prefers-reduced-motion: reduce) { @view-transition { navigation: none; } }

/* lime buttons: saaf border (owner, 7-Oct) - har lime CTA ke gird 2px teal kinara, taake safed/halke
   pas-manzar par button ki had saaf dikhe (Reserve parking, Find your space, Pay/Confirm, Done, Book) */
.ap-btn--primary, .ap-search .pwf-btn, .pwf-btn, .apb-rcal-done, .pw-co-pay, .pw-help-submit, .pw-res-btn, .pw-btn-solid, .lp-rate-btn {
    border: 2px solid var(--teal) !important;
}
.ap-btn--primary:hover, .ap-search .pwf-btn:hover:not(:disabled), .apb-rcal-done:hover, .pw-co-pay:hover:not(:disabled), .pw-help-submit:hover, .lp-rate-btn:hover {
    border-color: var(--teal-2) !important;
}
.ap-btn--primary:disabled, .ap-search .pwf-btn:disabled, .pw-co-pay:disabled { border-color: rgba(10, 71, 90, .45) !important; }

/* lime buttons: text thora bara (owner, 7-Oct) - 16px -> 17.5px, weight 700; zyada nahi */
.ap-btn--primary, .ap-search .pwf-btn, .pw-co-pay, .pw-help-submit, .pw-res-btn, .pw-btn-solid { font-size: 1.09rem !important; font-weight: 700 !important; }
.apb-rcal-done, .pwsrch .apb-rcal-done { font-size: 1rem !important; font-weight: 700 !important; }
.lp-rate-btn { font-size: .95rem !important; font-weight: 700 !important; }