:root {
  --blue: #006faa;
  --hero-blue: #1768b9;
  --cyan: #087b96;
  --green: #008900;
  --yellow: #fff02c;
  --ice: #eff8fb;
  --ink: #172934;
  --text-muted: #405560;
  --font-japanese: "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Noto Sans JP", "Yu Gothic", Meiryo, system-ui, sans-serif;
  --type-label: .8125rem;
  --type-detail: .9375rem;
  --type-card: clamp(1.125rem, 1.85vw, 1.5rem);
  --type-section: clamp(1.5rem, 3vw, 2.375rem);
  --header: 132px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--header) + 18px); }
body { margin: 0; color: var(--ink); background: #fff; font: 1rem/1.72 var(--font-japanese); overflow-wrap: anywhere; }
h1, h2, h3, p { margin-top: 0; }
a { color: inherit; text-decoration: none; }
a:hover { text-decoration: underline; text-underline-offset: .2em; }
a:focus-visible, button:focus-visible, summary:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 3px solid #ec871e; outline-offset: 4px; }
button { font: inherit; cursor: pointer; }
[hidden] { display: none !important; }
.wide { width: min(1230px, calc(100% - 8vw)); margin-inline: auto; }
.site-header { position: sticky; top: 0; z-index: 5; background: #fff; box-shadow: 0 2px 4px #142b4320; }
.utility { background: var(--blue); color: white; }
.utility > div { display: flex; align-items: center; justify-content: space-between; min-height: 54px; font-size: var(--type-label); }
.utility > div > div { display: flex; gap: 32px; }
.main-nav { min-height: 78px; display: flex; align-items: center; justify-content: space-between; gap: clamp(10px, 2vw, 29px); }
.brand { flex-shrink: 0; display: inline-grid; line-height: 1.15; }
.brand > span { font-size: .7rem; letter-spacing: .18em; }
.brand strong { font-size: clamp(1.4rem, 2.4vw, 2.25rem); letter-spacing: .02em; font-weight: 950; background: linear-gradient(165deg, #111 45%, #087ea5 46% 65%, #111 66%); color: #121212; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.desktop-nav { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; column-gap: clamp(8px, 1.5vw, 24px); row-gap: 4px; font-size: clamp(.78rem, 1.16vw, 1rem); font-weight: 700; }
.desktop-nav a { white-space: nowrap; }
.line { background: var(--green); color: white; display: inline-flex; align-items: center; justify-content: center; gap: 12px; padding: 10px 15px; font-weight: 850; line-height: 1.25; text-align: center; min-height: 44px; }
.line:hover { background: #077d00; text-decoration: none; }
.line-mark { position: relative; flex: none; display: grid; place-content: center; width: 30px; aspect-ratio: 1; background: white; color: #047600; border-radius: 50%; font: 950 8px/1 system-ui, sans-serif; }
.line-mark::after { content: ""; position: absolute; bottom: -1px; left: 7px; border: 5px solid transparent; border-top-color: white; border-bottom: 0; transform: rotate(22deg); }
.header-line { flex-shrink: 0; font-size: var(--type-detail); }
.mobile-menu, .mobile-bar { display: none; }

.hero { position: relative; isolation: isolate; min-height: clamp(440px, 35.5vw, 590px); overflow: hidden; background: var(--hero-blue); padding: 13px 12px 14px; display: flex; flex-direction: column; align-items: center; justify-content: space-between; }
.hero-photos { position: absolute; inset: 0; z-index: -3; display: flex; justify-content: space-between; }
.hero-photos > div { position: relative; width: 38%; }
.hero-photos img { display: block; width: 100%; height: 100%; object-fit: cover; }
.hero-left img { object-position: 50% 55%; }
.hero-right img { object-position: 47% 43%; transform: translateX(28px) scale(1.07); transform-origin: left center; }
.hero-photos > div::after { content: ""; position: absolute; inset: 0; background: #0079b43d; }
.hero::before { content: ""; position: absolute; z-index: -2; inset: 0 26% 0; background: var(--hero-blue); clip-path: polygon(0 0,100% 0,91% 100%,9% 100%); }
.hero-center { position: relative; text-align: center; color: white; width: min(100%, 700px); }
.hero-kicker { font-weight: 750; font-size: clamp(.95rem, 1.5vw, 1.4rem); letter-spacing: .045em; margin: 0 0 3px; }
.hero h1 { color: white; font-size: clamp(3.15rem, 5.25vw, 5.45rem); font-weight: 1000; letter-spacing: -.04em; line-height: 1.02; margin: 0 0 3px; transform: skew(-5deg); text-shadow: 0 2px 1px #105095; }
.hero h1 span { display: block; font-size: .57em; letter-spacing: -.055em; line-height: 1.26; }
.hero-fare { display: flex; justify-content: center; align-items: center; gap: 16px; margin-top: 3px; }
.hero-fare > span { font-weight: 950; font-size: clamp(1.15rem, 2.15vw, 2rem); line-height: 1.16; text-align: right; text-shadow: 2px 3px #105095; }
.hero-fare strong { font-weight: 1000; color: var(--yellow); font-size: clamp(5.35rem, 8.4vw, 9.2rem); letter-spacing: -.065em; transform: skew(-7deg); line-height: .96; text-shadow: 4px 5px 0 #073d7c; }
.hero-fare small { font-size: .51em; margin-left: .11em; }
.hero-strap { margin: 8px 0 0; color: var(--yellow); font-size: clamp(1.06rem, 1.8vw, 1.65rem); font-weight: 950; text-shadow: 2px 2px #0a457e; }
.hero-fine { margin: 2px 0 9px; font-size: var(--type-label); line-height: 1.5; }
.snow { position: absolute; width: 100%; height: min(39%, 193px); bottom: 0; z-index: -1; pointer-events: none; }
.hero-bottom { width: min(890px, 83%); display: grid; grid-template-columns: .82fr 1.18fr; align-items: stretch; gap: 12px; margin-bottom: 4px; }
.hero-offer { background: white; border: 4px solid #8bc6eb; border-radius: 20px 20px 11px 11px; box-shadow: 0 4px 0 #075c9c76; }
.hero-offer { display: grid; justify-items: center; align-content: center; padding: 0 8px 7px; color: #063f78; font-size: clamp(.8rem, 1.24vw, 1.12rem); text-align: center; }
.hero-offer span { background: #fa890a; color: #241a00; padding: 1px 12px; margin-top: -12px; font-weight: 900; clip-path: polygon(0 0,100% 0,96% 50%,100% 100%,0 100%,4% 50%); }
.hero-offer b { font-size: 1.24em; }
.hero-offer-note { font-size: var(--type-label); font-weight: 700; }
.image-caption { position: absolute; bottom: 2px; right: 8px; color: #112d46; background: #ffffffdb; padding: 0 4px; font-size: .62rem; }
.section-action { text-align: center; }
.big-line { width: min(500px, 100%); border: 4px solid white; box-shadow: 0 5px 12px #25872546; border-radius: 99px; position: relative; min-height: 86px; padding: 12px 44px 12px 66px; font-size: clamp(1.2rem, 2.15vw, 1.875rem); }
.big-line .line-mark { position: absolute; left: 16px; width: 52px; font-size: 13px; }
.big-line .line-mark::after { left: 12px; border-width: 9px 6px 0; bottom: -2px; }

.section { padding-block: clamp(56px, 7.5vw, 104px); }
.section-head { text-align: center; margin: 0 auto clamp(27px, 4vw, 56px); }
.section-head p { margin: 0 auto 8px; font-size: clamp(.88rem, 1.3vw, 1.125rem); font-weight: 750; color: #075d7b; }
.section-head h2 { position: relative; isolation: isolate; width: fit-content; max-width: calc(100% - 38px); margin: 0 auto; padding: 9px clamp(9px, 2vw, 28px); border-block: 3px solid #2193ac; background: white; font-size: var(--type-section); line-height: 1.26; font-weight: 850; }
.section-head h2::before, .section-head h2::after { content: ""; position: absolute; z-index: -1; top: 4px; bottom: -7px; width: 25px; background: #2193ac; clip-path: polygon(0 0,100% 0,100% 3px,15% 3px,56% 50%,15% calc(100% - 3px),100% calc(100% - 3px),100% 100%,0 100%,43% 50%); }
.section-head h2::before { left: -21px; }
.section-head h2::after { right: -21px; transform: scaleX(-1); }
.intro-grid { display: grid; grid-template-columns: repeat(4,1fr); max-width: 940px; margin-inline: auto; gap: 12px; }
.intro-grid a { display: grid; justify-items: center; text-align: center; padding: 18px 5px; border: 1px solid #b8d7e4; background: #fff; }
.intro-grid svg { width: 48px; fill: none; stroke: var(--cyan); stroke-width: 2.8; stroke-linecap: round; stroke-linejoin: round; }
.intro-grid strong { color: #086a88; font-size: clamp(1.35rem, 3.5vw, 2.75rem); font-weight: 950; line-height: 1.25; }
.intro-grid span { font-size: var(--type-detail); font-weight: 750; }
.points, .pale { background: var(--ice); }
.feature-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 28px; }
.feature { position: relative; background: white; border: 1px solid #b8d7e4; }
.feature-no { position: absolute; z-index: 1; top: 10px; left: -1px; background: var(--blue); color: white; font-weight: 900; padding: 3px 15px; }
.photo { display: grid; place-items: center; position: relative; isolation: isolate; overflow: hidden; aspect-ratio: var(--ratio, 2.25); background: linear-gradient(145deg,#f7fcfd,#dfedf4); color: #3b6171; text-align: center; }
.photo::after { content: ""; position: absolute; inset: 13px; border: 1px dashed #9bbdca; pointer-events: none; }
.frame-label { font-size: .82rem; font-weight: 750; padding: 6px; }
.frame-label svg { display: block; width: 30px; margin: 0 auto 5px; stroke: currentColor; stroke-width: 1.4; fill: none; }
.photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.photo:has(img)::after, .photo:has(img) .frame-label { display: none; }
.feature > div:last-child { padding: 17px 22px 18px; }
.feature h3, .area-card h3 { margin: 0 0 6px; font-size: var(--type-card); font-weight: 850; line-height: 1.35; }
.feature p, .area-card p { margin: 0 0 5px; }
.feature a, .area-card a { color: #096c8a; font-weight: 850; }
.steps { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); list-style: none; counter-reset: step; gap: 4px; padding: 0; margin: 5px 0 0; font-size: var(--type-label); line-height: 1.45; }
.steps li { background: var(--ice); text-align: center; padding: 5px 2px; }
.steps li::before { counter-increment: step; content: '0' counter(step); display: block; color: #096c8a; font-weight: 900; }
.section-action { margin-top: 38px; }
.plan-links { max-width: 870px; margin: 0 auto 40px; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.plan-links a { display: flex; align-items: center; justify-content: space-between; gap: 5px 12px; border: 2px solid #2189a8; padding: 10px 14px; color: #08708b; }
.plan-links a span { font-size: var(--type-detail); font-weight: 850; }
.fleet-title { color: #076c88; border-left: 5px solid var(--cyan); padding-left: 10px; margin-bottom: 18px; font-size: var(--type-card); font-weight: 850; }
.car-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; }
.car-card { border: 4px solid #c5c5c5; border-radius: 19px; display: flex; flex-direction: column; padding: clamp(10px, 1.6vw, 20px); }
.car-head { display: flex; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; gap: 4px 8px; min-height: 42px; }
.car-head h3 { color: #08708b; font-size: var(--type-card); margin: 0; line-height: 1.25; font-weight: 850; }
.car-head span { padding: 3px 9px; border-radius: 99px; background: #151515; color: white; font-size: var(--type-label); font-weight: 750; }
.car-photo { --ratio: 1.45; margin: 8px 0 15px; background: #f5f9fa; }
.car-photo img { object-fit: contain; }
.car-rates { margin: 0; color: #096c8a; font-weight: 850; }
.car-rates div { display: flex; justify-content: center; align-items: baseline; gap: 12px; padding: 3px 0; }
.car-rates dt { font-size: var(--type-detail); flex-shrink: 0; }
.car-rates dd { font-size: var(--type-detail); margin: 0; }
.car-note { margin: 7px 0 12px; color: var(--text-muted); font-size: var(--type-label); text-align: center; line-height: 1.5; }
.tags { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px; margin: auto 0 9px; }
.tags span { padding: 3px 7px; background: #087893; color: white; font-size: .74rem; font-weight: 800; }
.quote-link { text-align: center; color: #086b86; font-weight: 850; font-size: var(--type-detail); text-decoration: underline; text-underline-offset: .18em; }
.section-note { margin: 12px 0 0; font-size: var(--type-detail); color: var(--text-muted); }
.area-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; }
.area-card { border: 1px solid #c2dce5; background: white; text-align: center; }
.area-card > div:last-child { padding: 15px; }
.area-card strong { color: #086b86; font-size: clamp(2.25rem, 5vw, 3.85rem); line-height: 1.2; white-space: nowrap; }
.area-card strong small { font-size: .56em; margin-left: .1em; }
.scene-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; }
.scene-grid article { border: 1px solid #d2e4ea; }
.scene-grid article > div:last-child { padding: 12px 16px; }
.scene-grid b { color: #086b86; font-weight: 900; }
.scene-grid h3 { margin: 0; font-size: var(--type-card); line-height: 1.35; font-weight: 850; }
.scene-grid p { margin: 0; font-size: var(--type-detail); color: var(--text-muted); }
.faq { max-width: 900px; }
.faq h3 { border-bottom: 2px solid var(--cyan); margin: 30px 0 10px; }
.faq details { padding: 9px 0; border-bottom: 1px solid #d3e4ea; }
.faq summary { cursor: pointer; list-style: none; font-weight: 800; font-size: clamp(1rem, 1.5vw, 1.125rem); padding: 4px 0; }
.faq summary::-webkit-details-marker, .mobile-menu summary::-webkit-details-marker { display: none; }
.faq summary::before, .faq details p::before { content: 'Q'; display: inline-grid; place-items: center; width: 26px; aspect-ratio: 1; margin-right: 8px; background: var(--cyan); color: white; font-weight: 850; }
.faq details p { margin: 9px 0 0; color: var(--text-muted); }
.faq details p::before { content: 'A'; background: #e3eff5; color: #096b88; }
.footer { padding: 40px 0 18px; background: #056495; color: white; }
.footer-grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr; gap: 20px; }
.footer-grid h2 { margin: 0 0 6px; font-size: 1rem; }
.footer-grid a { display: block; }
.footer .brand strong { background: none; color: white; -webkit-text-fill-color: currentColor; }
.footer-base { margin-top: 24px; padding-top: 10px; border-top: 1px solid #9bc6da; display: flex; justify-content: space-between; gap: 10px; font-size: var(--type-label); }

@media (max-width: 880px) {
  :root { --header: 64px; }
  .wide { width: calc(100% - 32px); }
  .utility, .desktop-nav, .header-line { display: none; }
  .main-nav { min-height: 64px; }
  .mobile-menu { display: block; }
  .mobile-menu summary { list-style: none; cursor: pointer; text-align: center; font-size: .64rem; font-weight: 850; line-height: 1.12; }
  .mobile-menu summary span { display: block; font-size: 1.4rem; }
  .mobile-menu nav { position: absolute; top: 100%; left: 0; right: 0; max-height: 75vh; overflow: auto; background: white; box-shadow: 0 4px 9px #0b335d3d; padding: 6px 16px; }
  .mobile-menu nav a { display: block; border-bottom: 1px solid #d5e7ef; padding: 9px 6px; font-weight: 750; }
  .mobile-bar { display: block; position: fixed; z-index: 4; bottom: 0; left: 0; right: 0; text-align: center; background: #ffffffed; border-top: 1px solid #b8d7e4; padding: 6px 12px calc(6px + env(safe-area-inset-bottom)); }
  .mobile-bar .line { width: min(100%,450px); border-radius: 99px; padding: 6px 13px; }
  .footer { padding-bottom: 75px; }
}
@media (max-width: 600px) {
  .brand strong { font-size: 1.59rem; }
  .brand > span { font-size: .65rem; }
  .hero { min-height: 402px; padding: 12px 7px 9px; }
  .hero-photos { top: 66px; bottom: 36px; }
  .hero-photos > div { width: 36%; }
  .hero-left img { object-position: 45% 53%; }
  .hero-right img { object-position: 26% 43%; transform: none; }
  .hero-photos > div::after { background: #0079b466; }
  .hero::before { inset-inline: 19%; clip-path: polygon(0 0,100% 0,91% 100%,9% 100%); }
  .hero-center { width: 100%; }
  .hero-kicker { font-size: .9rem; }
  .hero h1 { font-size: clamp(2.85rem, 12.6vw, 4.7rem); }
  .hero-fare { margin-top: 9px; gap: 8px; }
  .hero-fare strong { font-size: 5.45rem; }
  .hero-strap { margin-top: 9px; font-size: 1rem; }
  .hero-fine { max-width: none; margin-inline: auto; font-size: .75rem; }
  .hero-bottom { width: min(94%,400px); grid-template-columns: 1fr; gap: 7px; margin-bottom: 4px; }
  .hero-offer { border-width: 3px; border-radius: 9px; }
  .hero-offer { grid-template-columns: auto auto; align-items: center; justify-content: space-around; gap: 0 4px; padding: 2px 4px; font-size: .69rem; }
  .hero-offer span { margin: 0; padding: 1px 5px; clip-path: none; }
  .hero-offer-note { grid-column: 1 / -1; font-size: .72rem; line-height: 1.35; }
  .big-line { min-height: 58px; font-size: 1.125rem; padding-inline: 39px; }
  .big-line .line-mark { width: 32px; left: 10px; font-size: 8px; }
  .big-line .line-mark::after { left: 6px; border-width: 5px 5px 0; }
  .intro-name { display: block; font-size: .82em; }
  .intro-dot { display: none; }
  .intro-grid { grid-template-columns: 1fr 1fr; gap: 8px; }
  .intro-grid a { padding: 10px 4px; }
  .intro-grid svg { width: 34px; }
  .intro-grid span { font-size: .8125rem; }
  .feature-grid { grid-template-columns: 1fr; gap: 14px; }
  .car-grid, .scene-grid, .area-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
  .car-card { border-width: 2px; border-radius: 12px; padding: 8px; }
  .car-head { min-height: 45px; }
  .car-head h3 { font-size: 1rem; }
  .car-head span, .tags span { font-size: .75rem; padding: 2px 5px; }
  .car-rates div { gap: 4px; }
  .car-rates dt { font-size: .8125rem; }
  .car-rates dd { font-size: var(--type-label); }
  .car-note, .quote-link { font-size: .8125rem; }
  .car-photo { margin: 5px 0 8px; }
  .frame-label { font-size: .72rem; }
  .plan-links { margin-bottom: 24px; gap: 8px; }
  .plan-links a { display: grid; padding: 6px 8px; font-size: .78rem; }
  .plan-links a span { font-size: .8125rem; }
  .area-card .photo, .scene-grid .photo { --ratio: 1.6; }
  .area-card > div:last-child, .scene-grid article > div:last-child { padding: 8px; }
  .area-card h3, .scene-grid h3 { font-size: 1rem; }
  .area-card p, .area-card a, .scene-grid p { font-size: .8125rem; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .footer-grid > div:first-child { grid-column: 1 / -1; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}

.hero-offer b strong { color: #0966ac; font-size: 1.55em; white-space: nowrap; }
.feature .photo img { object-position: center 52%; }
.feature .photo[data-photo="feature-airport"] img,
.feature .photo[data-photo="feature-line"] img { object-position: center 65%; }
.season-line { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 12px; margin: -6px 0 22px; font-size: .9rem; font-weight: 800; }
.season-line select { color: #075e76; background: #fff; border: 1px solid #78a8bb; border-radius: 5px; font: inherit; padding: 6px 12px; }
.season-line a, .inline-links a { color: #076b86; font-weight: 800; text-decoration: underline; text-underline-offset: .2em; }
.car-photo { background: #fafafa; }
.car-rates strong { font-size: clamp(1.375rem, 2.7vw, 2.375rem); line-height: 1.1; white-space: nowrap; font-weight: 900; }
.car-rates dd small { font-size: var(--type-label); }
.car-rates dd.rate-quote { font-size: var(--type-detail); }
.duration-kicker { margin-bottom: 8px; font-size: var(--type-detail); }
.table-scroll { overflow-x: auto; background: white; border: 1px solid #b8d7e4; border-radius: 7px; }
.rate-table { width: 100%; border-collapse: collapse; text-align: right; font-size: 1rem; }
.rate-table th, .rate-table td { padding: 11px clamp(8px, 2vw, 20px); border-bottom: 1px solid #d4e5ea; }
.rate-table thead { background: var(--blue); color: white; }
.rate-table th:first-child { text-align: left; }
.rate-table td { font-weight: 800; white-space: nowrap; }
.rate-table tbody tr:nth-child(even) { background: #f7fbfc; }
.rate-table tbody tr:last-child > * { border-bottom: 0; }
.rate-table td a { color: #076b86; }
.inline-links { display: flex; flex-wrap: wrap; gap: 5px 18px; margin-top: 12px; font-size: var(--type-detail); }
.coverage-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 15px; }
.coverage-grid article { border: 2px solid #b5d9e5; padding: 15px; background: #f4fafd; }
.coverage-grid article span { color: #076b86; font-weight: 850; font-size: var(--type-label); }
.coverage-grid h3 { margin: 4px 0; font-size: var(--type-card); font-weight: 850; }
.coverage-grid strong { color: #076b86; font-size: clamp(1.18rem, 2.35vw, 1.8rem); }
.coverage-grid strong small { font-size: .52em; }
.coverage-grid p { font-size: var(--type-detail); margin: 5px 0 0; }

@media (max-width: 600px) {
  .coverage-grid { grid-template-columns: 1fr; gap: 8px; }
  .coverage-grid article { padding: 10px; }
  .car-rates div { align-items: center; flex-wrap: wrap; }
  .car-rates div:first-child { display: grid; justify-items: center; gap: 0; }
  .quote-link span { display: none; }
  .car-rates dd.rate-quote { font-size: .8125rem; }
  .car-rates dd small { font-size: .75rem; }
  .rate-table { font-size: clamp(.75rem, 3vw, .94rem); }
  .rate-table th, .rate-table td { padding: 8px 4px; }
}

.skip-link { position: fixed; z-index: 7; top: 5px; left: 5px; padding: 8px 12px; background: #fff; color: var(--blue); transform: translateY(-150%); }
.skip-link:focus { transform: translateY(0); }
.quick-links { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); max-width: 800px; gap: 8px; margin-top: 20px; }
.quick-links a { display: grid; place-items: center; min-height: 44px; border: 1px solid #b8d7e4; background: var(--ice); padding: 3px; text-align: center; font-weight: 800; color: #075d7b; font-size: var(--type-detail); }
.route-panel { margin-top: 22px; padding: clamp(12px, 2.2vw, 24px); background: #fff; border: 1px solid #b8d7e4; }
.route-panel h3 { margin: 0 0 3px; font-size: clamp(1.1rem, 2vw, 1.38rem); }
.route-panel p { margin-bottom: 12px; font-size: var(--type-detail); color: var(--text-muted); }
.route-options { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px; }
.route-options a { display: grid; align-content: center; gap: 4px; padding: 10px 5px; border: 1px solid #acd5e4; background: var(--ice); text-align: center; }
.route-options a:hover { background: #dceff6; }
.route-options span { font-size: var(--type-detail); font-weight: 750; }
.route-options strong { font-size: clamp(1.375rem, 2.55vw, 2rem); line-height: 1.2; color: #075d7b; font-weight: 900; white-space: nowrap; }
.route-options small { font-size: var(--type-label); color: #075d7b; font-weight: 750; }
.airport-check { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 12px; }
.airport-check > div { padding: 8px 12px; border-left: 4px solid var(--cyan); background: #fff; }
.airport-check h3 { margin: 0 0 2px; font-size: .95rem; color: #075d7b; }
.airport-check p { margin: 0; font-size: var(--type-detail); }
.faq details a { color: #075d7b; text-decoration: underline; text-underline-offset: .2em; }

@media (max-width: 600px) {
  .quick-links { grid-template-columns: repeat(2,minmax(0,1fr)); margin-top: 14px; gap: 5px; }
  .quick-links a { font-size: .9rem; }
  .route-options { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 5px; }
  .route-options span { font-size: .8125rem; }
  .airport-check { grid-template-columns: 1fr; }
}

@media (max-width: 360px) {
  .big-line { padding-inline: 45px 15px; font-size: 1.0625rem; }
  .hero-offer span { padding-inline: 3px; font-size: .59rem; white-space: nowrap; }
  .intro-name { font-size: .77em; }
  .area-card strong { font-size: 1.78rem; white-space: nowrap; }
}

.hero-offer b small { font-size: .62em; }
.hero-fare strong, .hero-offer b strong, .car-rates strong,
.rate-table td, .area-card strong, .route-options strong, .coverage-grid strong {
  font-variant-numeric: tabular-nums lining-nums;
}

@media (max-width: 600px) {
  .section-head h2 { word-break: auto-phrase; }
  .car-rates dd:has(strong) { display: flex; align-items: baseline; justify-content: center; gap: 1px 4px; flex-wrap: wrap; }
  .car-rates dd.rate-quote { line-height: 1.35; }
  .hero-offer b small { grid-column: auto; }
}
@media (max-width: 360px) {
  .car-rates dd:has(strong) { flex-direction: column; align-items: center; }
  .route-options strong { font-size: 1.25rem; }
}

.hero-bottom { align-items: center; }
.hero-bottom .big-line { width: 100%; }
.car-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.car-head { align-content: flex-start; margin-top: 10px; }
.quick-links a { border-radius: 8px; }

@media (max-width: 1080px) {
  .car-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* The homepage leads with a photo collage and a light message panel. */
.monthly-home { --header: 86px; }
.monthly-home .main-nav { min-height: 86px; }
.hero { width: min(1230px, calc(100% - 8vw)); margin: 18px auto 0; min-height: 0; padding: clamp(75px, 9vw, 140px) 12px 28px; background: #edf6fb; }
.hero::before { content: none; }
.hero-photos { inset: 0; gap: 7px; }
.hero-photos > div { width: 29%; }
.hero-photos > div::after { content: none; }
.hero-right img { transform: none; }
.hero-mosaic { position: absolute; inset: 0 29%; z-index: -2; display: grid; grid-template: repeat(2,minmax(0,1fr)) / repeat(2,minmax(0,1fr)); gap: 7px; padding-inline: 7px; }
.hero-mosaic img { display: block; width: 100%; height: 100%; object-fit: cover; }
.hero-center { width: min(580px, 69%); background: #fffffff5; color: #14364f; padding: 16px 16px 14px; box-shadow: 0 6px 24px #16324730; }
.hero h1 { color: #075481; transform: none; text-shadow: none; font-size: clamp(2.7rem, 5vw, 4.9rem); }
.hero-fare > span { text-shadow: none; }
.hero-fare strong { color: #a34e00; text-shadow: none; transform: none; font-size: clamp(4.1rem, 6vw, 6.4rem); }
.hero-chips { display: flex; justify-content: center; flex-wrap: wrap; gap: 5px; padding: 0; margin: 9px 0; list-style: none; }
.hero-chips li { background: #075481; color: white; padding: 3px 13px; border-radius: 30px; font-size: .85rem; font-weight: 800; }
.hero-fine { margin: 0; }
.hero-bottom { margin: 16px 0 0; width: min(680px, 95%); }
.hero-offer { border-color: #ecd29d; }
.hero-offer span { background: #f0c366; }
.section-head h2 { text-wrap: balance; }
@media (max-width: 700px) {
  .monthly-home { --header: 62px; }
  .monthly-home .main-nav { min-height: 62px; }
  .hero { width: calc(100% - 16px); margin-top: 8px; padding: 64px 8px 27px; }
  .hero-center { width: min(400px, 96%); padding: 12px 7px; }
  .hero-mosaic { inset-inline: 30%; gap: 4px; padding-inline: 4px; }
  .hero-photos > div { width: 30%; }
}

.monthly-home { --cyan: #16604b; }
.monthly-home .site-header { box-shadow: 0 3px 12px #182b2420; }
.monthly-home .desktop-nav a { color: #245c47; }
.monthly-home .header-line { border-radius: 6px; }
.monthly-home .hero { min-height: clamp(430px, 46vw, 590px); justify-content: center; padding: 68px 12px 105px; }
.monthly-home .hero-mosaic { inset: 0; grid-template: repeat(4, minmax(0, 1fr)) / repeat(6, minmax(0, 1fr)); padding: 0; background: white; gap: 7px; }
.hero-mosaic img:nth-child(1) { grid-area: 1 / 1 / 3 / 3; object-position: center 53%; }
.hero-mosaic img:nth-child(2) { grid-area: 1 / 3 / 2 / 5; }
.hero-mosaic img:nth-child(3) { grid-area: 1 / 5 / 2 / 7; }
.hero-mosaic img:nth-child(4) { grid-area: 3 / 1 / 5 / 2; }
.hero-mosaic img:nth-child(5) { grid-area: 4 / 2 / 5 / 4; }
.hero-mosaic img:nth-child(6) { grid-area: 2 / 3 / 4 / 5; }
.hero-mosaic img:nth-child(7) { grid-area: 4 / 4 / 5 / 5; }
.hero-mosaic img:nth-child(8) { grid-area: 2 / 5 / 5 / 7; object-position: center 40%; }
.monthly-home .hero-center { width: min(610px, 64%); margin-right: 13%; padding: 18px 14px; background: #fffffff5; border: 5px solid white; box-shadow: 0 0 24px #fff9; }
.monthly-home .hero h1, .monthly-home .hero-fare > span { color: #16543d; }
.monthly-home .hero h1 span { color: #8f4706; }
.monthly-home .hero-fare strong { color: #9e440b; }
.hero-booking { position: relative; margin-top: -66px; }
.hero-badges { display: flex; justify-content: center; gap: clamp(8px, 2vw, 24px); margin: 0 auto 17px; }
.hero-badges a { display: grid; justify-items: center; align-content: center; text-align: center; width: clamp(100px, 15vw, 178px); aspect-ratio: 1; padding: 5px; border: 5px double #9a641a; border-radius: 50%; background: radial-gradient(circle at 38% 26%, #fffbe7, #f5d48d 72%, #d89a3f); color: #332510; box-shadow: 0 4px 9px #4d360e40; line-height: 1.15; }
.hero-badges span { font-size: clamp(.63rem, 1.1vw, .89rem); font-weight: 750; }
.hero-badges strong { margin-block: 4px; color: #842b1a; font-size: clamp(.97rem, 2.6vw, 2.05rem); letter-spacing: -.045em; white-space: nowrap; }
.hero-badges strong small { font-size: .55em; }
.hero-badges b { background: #775018; color: white; padding: 3px 5px; border-radius: 3px; font-size: clamp(.62rem, 1vw, .83rem); }
.monthly-home .car-card { border: 1px solid #b7c9bf; border-radius: 6px; padding: 10px; box-shadow: 0 3px 12px #10382512; }
.monthly-home .car-head h3 { color: #19543e; }
.monthly-home .section-head h2 { color: #184735; border: 0; background: transparent; }
.monthly-home .section-head h2::before { content: none; }
.monthly-home .section-head h2::after { inset: auto 0 0; width: 54px; height: 3px; margin-inline: auto; clip-path: none; background: #bf8a3e; }
.monthly-home .faq summary { position: relative; padding-right: 28px; }
.monthly-home .faq summary::after { content: "+"; position: absolute; right: 4px; color: #16604b; }
.monthly-home .faq details[open] summary::after { content: "−"; }

@media (max-width: 700px) {
  .monthly-home .hero { min-height: 390px; padding: 66px 8px 79px; }
  .monthly-home .hero-center { width: min(360px, 95%); margin: 0; padding: 12px 7px; }
  .monthly-home .hero-mosaic { gap: 4px; }
  .hero-booking { margin-top: -48px; width: calc(100% - 16px); }
  .hero-badges { gap: 5px; }
  .hero-badges a { width: min(30vw, 126px); border-width: 4px; }
}

/* Compact lineup, editorial sections, and the reference page's interaction cues. */
.monthly-home { --gold: #a96c23; --forest: #184735; }
.monthly-home .quick-links a { background: #f6faf6; border-color: #d4e0d6; color: var(--forest); }
.monthly-home .quick-links a:hover { background: #e7f1e8; }
.vehicle-strip { padding-block: clamp(30px, 5vw, 64px); }
.vehicle-strip .section-head { margin-bottom: 20px; }

.monthly-home .points { background: #edf5ef; }
.gold-text { color: #925511; }
.reason-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: clamp(12px, 2vw, 28px); }
.reason-grid .feature { border: 1px solid #cadccf; border-top: 4px solid #28644b; border-radius: 6px; }
.reason-grid .feature-no { top: 10px; left: 8px; background: #245c47; border-radius: 3px; }
.reason-grid .feature > div:last-child { padding: 13px 15px 16px; }
.reason-grid h3 { color: var(--forest); }
.reason-grid .reason-photo { --ratio: 1.8; }
.reason-banner { width: fit-content; max-width: 100%; margin: 26px auto 0; padding: 10px 24px; border-block: 1px solid #cbaa73; text-align: center; color: var(--forest); }
.reason-banner + .section-action { margin-top: 20px; }

.scene-section { background: #faf7f0; }
.scene-section .section-head { margin-bottom: 13px; }
.gallery-hint { margin: 0 auto 14px; text-align: center; font-size: var(--type-detail); color: var(--text-muted); }
.scene-gallery { position: relative; max-width: 960px; margin-inline: auto; }
.scene-gallery .scene-grid { --scene-gap: clamp(10px, 2vw, 20px); display: grid; grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: calc((100% - var(--scene-gap)) / 2); gap: var(--scene-gap); overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; padding: 3px 3px 9px; }
.scene-grid article { scroll-snap-align: start; min-width: 0; background: white; }
.scene-grid .photo { --ratio: 1.55; }
.scene-controls, .photo-viewer-controls { display: flex; align-items: center; justify-content: center; gap: 14px; margin-top: 12px; }
.scene-controls button, .photo-viewer button { display: grid; place-items: center; width: 44px; min-height: 44px; padding: 0; border-radius: 50%; border: 1px solid #a5bdae; background: white; color: var(--forest); font-size: 1.7rem; line-height: 1; }
.scene-controls button:hover:not(:disabled), .photo-viewer button:hover { color: white; background: var(--forest); }
.scene-controls button:disabled { opacity: .42; cursor: default; }
a.photo:focus-visible { outline-offset: -3px; }
a.photo:hover img { filter: brightness(.92); }
.zoom-label { position: absolute; bottom: 8px; right: 8px; padding: 1px 8px; border-radius: 24px; background: #133a2ce8; color: white; font-size: .92rem; font-weight: 850; }
.photo-viewer { width: min(850px, calc(100% - 26px)); max-height: calc(100dvh - 26px); border: 0; border-radius: 10px; padding: 12px; background: #f7faf8; color: var(--forest); }
.photo-viewer::backdrop { background: #0b211ce3; }
.photo-viewer-bar { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 8px; }
.photo-viewer-bar p { margin: 0; font-weight: 800; }
.photo-viewer img { display: block; width: 100%; max-height: min(68dvh, 600px); object-fit: contain; background: white; }
body:has(.photo-viewer[open]) { overflow: hidden; }

.booking-steps .section-head { margin-bottom: 20px; }
.steps-panel { max-width: 760px; margin-inline: auto; }
.steps-panel .steps li { padding: 9px 4px; border: 1px solid #d5e4d9; background: #f1f7f1; font-size: clamp(.76rem, 1.4vw, 1rem); font-weight: 750; }
.steps-panel .steps li::before { color: #925511; }
.coverage-section { background: #f4f8f4; border-block: 1px solid #dbe8de; }
.coverage-section .coverage-grid article { background: white; border-top: 4px solid #28644b; }
.monthly-home .faq summary { padding-block: 9px; }
.monthly-home .faq summary:hover { background: #f2f8f3; }
.monthly-home .faq details[open] summary { color: var(--forest); }
.monthly-home .faq details[open] p { padding: 8px 10px; background: #f4f7f4; }
.final-booking { text-align: center; }
.final-booking p { margin-bottom: 8px; color: var(--forest); font-weight: 800; }
.monthly-home .footer { background: #183d2e; }

.monthly-home .big-line { isolation: isolate; overflow: hidden; border-color: #fff; background: linear-gradient(180deg,#179a2c,#087114); box-shadow: 0 5px 0 #09571b, 0 8px 19px #20663b44; }
.monthly-home .big-line::after { content: ""; position: absolute; z-index: -1; inset: 0; transform: translateX(-120%); background: linear-gradient(105deg,transparent 33%,#ffffff80 49%,transparent 63%); pointer-events: none; }
.monthly-home .big-line:hover, .monthly-home .big-line:focus-visible { background: linear-gradient(180deg,#199c2c,#086414); }
.monthly-home .big-line:active { translate: 0 2px; box-shadow: 0 3px 0 #09571b; }

@media (prefers-reduced-motion: no-preference) {
  .monthly-home .hero-booking .big-line::after { animation: button-sheen 2.25s ease-out 2; }
  .monthly-home .big-line:is(:hover,:focus-visible)::after { animation: button-sheen-interaction .7s ease-out; }
  .monthly-home .hero-booking .big-line:is(:hover,:focus-visible)::after { animation: button-sheen-interaction .7s ease-out; }
  .hero-badges a, .monthly-home .big-line { transition: translate .17s ease, box-shadow .17s ease; }
  .hero-badges a:is(:hover,:focus-visible) { translate: 0 -3px; }
  .scene-gallery .scene-grid { scroll-behavior: smooth; }
  @keyframes button-sheen { 0%, 22% { transform: translateX(-120%); } 63%, 100% { transform: translateX(120%); } }
  @keyframes button-sheen-interaction { from { transform: translateX(-120%); } to { transform: translateX(120%); } }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}
@media (max-width: 700px) {
  .reason-grid { grid-template-columns: 1fr; max-width: 480px; margin-inline: auto; }
  .scene-gallery .scene-grid { grid-auto-columns: 87%; }
  .photo-viewer img { max-height: 64dvh; }
}

/* Keep the primary action within easy reach and enlarge secondary tap targets. */
.monthly-home .hero { min-height: clamp(390px, 37vw, 465px); padding-block: 38px 76px; }
.hero-booking > .section-action { margin-top: 16px; }
.hero-booking .big-line { min-height: 64px; }
.hero-booking .big-line .line-mark { width: 42px; }
.hero-badges a { width: clamp(100px, 14vw, 152px); }
.season-line select, .season-line a, .car-card .quote-link, .area-card a:not(.photo) { min-height: 44px; }
.season-line a, .car-card .quote-link, .area-card a:not(.photo) { display: inline-flex; align-items: center; }
.car-card .quote-link { justify-content: center; gap: 4px; padding-inline: 3px; border: 1px solid #bdd9c6; border-radius: 5px; background: #f2f8f3; color: #184735; }
.car-card .quote-link:hover { background: #e1f0e5; }
.area-card a:not(.photo) { text-decoration: underline; text-underline-offset: .18em; }
.monthly-home .mobile-menu summary { display: grid; place-content: center; width: 48px; min-height: 44px; }

@media (max-width: 880px) {
  html.monthly-home { scroll-padding-bottom: calc(68px + env(safe-area-inset-bottom)); }
}
@media (max-width: 700px) {
  .monthly-home .hero { min-height: 330px; padding-block: 36px 61px; }
  .hero-badges { margin-bottom: 10px; }
  .hero-badges a { width: min(30vw, 112px); }
  .hero-booking .big-line { min-height: 58px; }
  .hero-booking .big-line .line-mark { width: 32px; }
  .hero-booking > .section-action { margin-top: 12px; }
}
@media (max-width: 420px) {
  .monthly-home .car-grid { grid-template-columns: 1fr; gap: 12px; }
  .car-card .car-photo { --ratio: 2.12; }
  .car-card .car-head { min-height: 0; margin-bottom: 5px; }
  .car-card .car-rates div:first-child { display: flex; gap: 6px; }
  .car-card .car-rates dd:has(strong) { flex-direction: row; align-items: baseline; }
  .car-card .car-rates dd.rate-quote { font-size: .9rem; }
  .mobile-menu nav a { min-height: 44px; }
}

.fleet-toolbar, .fleet-navigation {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 4px 12px;
  flex-wrap: wrap;
}
.fleet-toolbar { margin-bottom: 8px; }
.fleet-toolbar .season-line { margin: 0; }
.fleet-compare {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: var(--forest);
  font-size: var(--type-detail);
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: .2em;
}
.monthly-home .fleet-track {
  --fleet-gap: clamp(10px, 1.5vw, 18px);
  display: grid;
  grid-template-columns: none;
  grid-auto-flow: column;
  grid-auto-columns: calc((100% - 2 * var(--fleet-gap)) / 3.1);
  gap: var(--fleet-gap);
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scroll-snap-type: x mandatory;
  scroll-padding-inline: 4px;
  padding: 4px 4px 9px;
}
.fleet-track:focus-visible { outline: 2px solid var(--cyan); outline-offset: 2px; }
.fleet-track .car-card {
  min-width: 0;
  scroll-snap-align: start;
  scroll-margin-block-start: 84px;
}
.fleet-track .car-card:target { border-color: var(--cyan); }
.fleet-track .car-photo { aspect-ratio: 2.12; margin: 0 0 7px; }
.fleet-track .car-head { align-items: center; min-height: 0; margin: 0 0 4px; }
.fleet-track .car-head h3 { font-size: clamp(1rem, 1.6vw, 1.32rem); }
.fleet-track .car-rates { margin-top: auto; }
.fleet-track .car-rates div:first-child { display: flex; justify-content: center; gap: 4px 9px; }
.fleet-track .car-rates dd:has(strong) { display: inline; }
.fleet-track .tags { margin: 3px 0; }
.fleet-detail summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 44px;
  gap: 6px;
  padding-inline: 7px;
  list-style: none;
  cursor: pointer;
  color: var(--forest);
  font-weight: 750;
  font-size: .85rem;
}
.fleet-detail summary::-webkit-details-marker { display: none; }
.fleet-detail summary::after { content: "+"; font-size: 1.05rem; }
.fleet-detail[open] summary::after { content: "−"; }
.fleet-detail .car-note { margin: 3px 0 7px; }
.fleet-navigation { margin: 0 0 6px; }
.fleet-hint { margin: 0; font-size: var(--type-detail); color: var(--text-muted); }
.fleet-hint strong { color: var(--forest); }
.rate-table th a { color: #075d7b; text-decoration: underline; text-underline-offset: .18em; }
.rate-table th a:hover { color: var(--forest); }
.fleet-controls { display: flex; align-items: center; gap: 7px; }
.fleet-controls button {
  min-width: 44px;
  min-height: 44px;
  border: 1px solid #a5bdae;
  border-radius: 22px;
  background: #fff;
  color: var(--forest);
  font-weight: 800;
}
.fleet-controls button[data-fleet-step] { padding: 0; font-size: 1.55rem; line-height: 1; }
.fleet-controls .fleet-play { padding-inline: 10px; font-size: .8rem; }
.fleet-controls button:hover { background: #edf5ef; }

@media (prefers-reduced-motion: no-preference) {
  .monthly-home .fleet-track { scroll-behavior: smooth; }
}
@media (max-width: 900px) {
  .monthly-home .fleet-track { grid-auto-columns: calc((100% - var(--fleet-gap)) / 2.15); }
}
@media (max-width: 600px) {
  .monthly-home .fleet-track { grid-auto-columns: min(82%, 355px); }
  .fleet-track .car-photo { aspect-ratio: 2.25; }
  .fleet-toolbar { gap: 0; }
  .fleet-navigation { justify-content: space-between; }
  .fleet-hint span { display: none; }
}

.duration-toolbar {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 2px 12px;
  margin-bottom: 8px;
}
.duration-toolbar .duration-kicker, .duration-toolbar .season-line { margin: 0; }
.duration-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.duration-actions a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 9px 12px;
  border-radius: 6px;
  text-align: center;
  font-size: var(--type-detail);
  font-weight: 850;
}
.duration-actions .estimate-link { gap: 6px; border: 1px solid #acc8b8; background: white; color: var(--forest); }
.duration-actions .estimate-link:hover { background: #e9f3ec; }
@media (max-width: 600px) {
  .duration-actions a { flex: 1 1 220px; }
  .rate-table th, .rate-table td { padding-inline: 7px; }
}

.coverage-section .coverage-grid article.snow-cover {
  border-color: #bf8a3e;
  background: #fffbf1;
}
.snow-cover h3 { color: #614119; }
.snow-cover a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: var(--forest);
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: .18em;
}
@media (min-width: 601px) {
  .coverage-section .coverage-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1080px) {
  .coverage-section .coverage-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

.options-section .coverage-grid article { background: white; border-top: 4px solid #28644b; }
.rate-table td[data-days="3"] { color: #145447; background: #eaf6ef; }
