/* O Car Rent — support pages: /feedback/, /privacy, /udon-tourism/, /รถเช่าสนามบินอุดร (loaded after oc.css) */

/* Page intro shared by the support pages */
.oc-support-intro { padding-block: var(--oc-s4) var(--oc-s6); }
.oc-support-intro h1 { margin-bottom: var(--oc-s3); }
.oc-support-intro .oc-lead { max-width: 44rem; }
.oc-support-intro .oc-btn-row { margin-top: var(--oc-s5); }

/* Legal prose (privacy policy) */
.oc-legal { max-width: 52rem; color: var(--oc-ink-2); }
.oc-legal p { margin-bottom: var(--oc-s4); }
.oc-legal h2, .oc-legal h3, .oc-legal strong { color: var(--oc-navy); }
.oc-legal h2 { font-size: var(--oc-fs-3); margin-top: var(--oc-s6); }
.oc-legal h3 { font-size: var(--oc-fs-2); margin-top: var(--oc-s5); }
.oc-legal ul, .oc-legal ol { margin: 0 0 var(--oc-s4); padding-left: 1.4rem; }
.oc-legal li + li { margin-top: var(--oc-s1); }
.oc-legal address { font-style: normal; }

/* Travel guide (udon-tourism): sticky index + spot cards. Markup keeps its ocr-* class names. */
.ocr-section-wrapper { display: grid; gap: var(--oc-s5); grid-template-columns: 1fr; align-items: start; }
@media (min-width: 900px) { .ocr-section-wrapper { grid-template-columns: 240px minmax(0, 1fr); gap: var(--oc-s6); } }
.ocr-sidebar-sticky { background: var(--oc-surface); border: 1px solid var(--oc-line); border-radius: var(--oc-r3); padding: var(--oc-s4); }
@media (min-width: 900px) { .ocr-sidebar-sticky { position: sticky; top: calc(var(--oc-header-h) + var(--oc-s4)); max-height: calc(100vh - var(--oc-header-h) - 2 * var(--oc-s4)); overflow-y: auto; } }
.ocr-nav-group { list-style: none; margin: 0; padding: 0; }
.ocr-nav-title { font-size: var(--oc-fs-0); font-weight: 800; color: var(--oc-ink-3); text-transform: uppercase; letter-spacing: 0.06em; margin: var(--oc-s4) 0 var(--oc-s2); padding-top: var(--oc-s3); border-top: 1px solid var(--oc-line-2); }
.ocr-nav-item { margin: 0; }
.ocr-nav-item a { display: flex; align-items: center; gap: var(--oc-s2); min-height: 40px; padding: var(--oc-s1) var(--oc-s2); border-radius: var(--oc-r1); color: var(--oc-navy); font-weight: 600; text-decoration: none; }
.ocr-nav-item a:hover { background: var(--oc-green-50); color: var(--oc-green-800); }
.ocr-nav-icon { font-size: 1.1rem; }
@media (max-width: 899.98px) { .ocr-nav-group { display: flex; flex-wrap: wrap; gap: var(--oc-s2); } .ocr-nav-title { flex-basis: 100%; border: 0; padding-top: var(--oc-s2); margin: var(--oc-s2) 0 0; } .ocr-nav-item a { min-height: 36px; background: var(--oc-surface-2); font-size: var(--oc-fs-0); } }
.ocr-main { min-width: 0; }
.ocr-province-section { scroll-margin-top: calc(var(--oc-header-h) + var(--oc-s4)); margin-bottom: var(--oc-s7); }
.ocr-province-title { font-size: var(--oc-fs-4); margin-bottom: var(--oc-s4); padding-bottom: var(--oc-s2); border-bottom: 3px solid var(--oc-green-700); display: inline-block; }
.ocr-spot-card { display: grid; gap: var(--oc-s4); grid-template-columns: 1fr; background: var(--oc-surface); border: 1px solid var(--oc-line); border-radius: var(--oc-r3); padding: var(--oc-s4); margin-bottom: var(--oc-s4); }
@media (min-width: 600px) { .ocr-spot-card { grid-template-columns: 240px minmax(0, 1fr); align-items: start; } }
.ocr-spot-image { width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; border-radius: var(--oc-r2); background: var(--oc-surface-2); }
.ocr-spot-content { min-width: 0; }
.ocr-spot-title { font-size: var(--oc-fs-2); margin-bottom: var(--oc-s2); }
.ocr-spot-content p { margin-bottom: var(--oc-s2); color: var(--oc-ink-2); }
.ocr-button { display: inline-flex; align-items: center; min-height: var(--oc-tap); padding: 0 var(--oc-s4); margin: var(--oc-s2) 0; border-radius: var(--oc-r2); background: var(--oc-green-700); color: #fff; font-weight: 700; text-decoration: none; }
.ocr-button:hover { background: var(--oc-green-800); color: #fff; }
.ocr-tiein { font-size: var(--oc-fs-0); color: var(--oc-ink-3); margin: var(--oc-s2) 0 0; }

/* Embeds (map / video) on support pages: never wider than the container */
.oc-map { border-radius: var(--oc-r3); overflow: hidden; border: 1px solid var(--oc-line); background: var(--oc-surface-2); }
.oc-map iframe { display: block; width: 100%; max-width: 100%; height: auto; aspect-ratio: 16 / 9; border: 0; }

/* Fleet cards reused on support pages: 4-up only from 1200px, 3-up 900–1199 (keeps model names on one line) */
@media (min-width: 900px) and (max-width: 1199.98px) { .oc-fleet-grid.oc-grid--4 { grid-template-columns: repeat(3, 1fr); } }
.oc-fleet-grid .oc-car-card__title { flex-wrap: wrap; }

/* Airport page */
.oc-airport-hero { background: linear-gradient(180deg, #ffffff 0%, var(--oc-bg) 100%); border-bottom: 1px solid var(--oc-line-2); }
.oc-airport-hero__inner { display: grid; gap: var(--oc-s6); padding-block: var(--oc-s6) var(--oc-s7); align-items: center; }
@media (min-width: 900px) { .oc-airport-hero__inner { grid-template-columns: 1.1fr 1fr; } }
.oc-airport-hero__media { border-radius: var(--oc-r3); overflow: hidden; box-shadow: var(--oc-shadow-3); background: var(--oc-surface-2); }
.oc-airport-hero__media img { width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; }
.oc-airport-steps { counter-reset: s; list-style: none; margin: 0; padding: 0; display: grid; gap: var(--oc-s3); }
.oc-airport-steps li { position: relative; padding: var(--oc-s4) var(--oc-s4) var(--oc-s4) 3.4rem; background: var(--oc-surface); border: 1px solid var(--oc-line); border-radius: var(--oc-r2); }
.oc-airport-steps li::before { counter-increment: s; content: counter(s); position: absolute; left: var(--oc-s4); top: var(--oc-s4); width: 2rem; height: 2rem; border-radius: 50%; background: var(--oc-green-700); color: #fff; font-weight: 800; display: grid; place-items: center; }
.oc-airport-steps strong { display: block; color: var(--oc-navy); margin-bottom: 2px; }
.oc-airport-steps span { color: var(--oc-ink-2); }
.oc-dest-card img { width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; }
.oc-dest-card .oc-card__body p { color: var(--oc-ink-2); margin-bottom: var(--oc-s2); }
.oc-dest-card .oc-small { display: block; color: var(--oc-ink-3); }