@font-face {
  font-family: Inter;
  src: url('/fonts/inter.woff2') format('woff2');
  font-weight: 400 750;
  font-display: swap;
}

@font-face {
  font-family: 'Noto Sans Thai';
  src: url('/fonts/noto-sans-thai.woff2') format('woff2');
  font-weight: 400 800;
  font-display: swap;
}

@font-face {
  font-family: 'Noto Sans Devanagari';
  src: url('/fonts/noto-sans-devanagari.woff2') format('woff2');
  font-weight: 400 800;
  font-display: swap;
}

:root {
  --yellow: #f5c65b;
  --yellow-hover: #efb83d;
  --dark: #193834;
  --dark-deep: #102e2b;
  --ink: #203b38;
  --muted: #5b706c;
  --line: #dfe9e5;
  --soft: #f4f8f6;
  --green: #147568;
  --pine: #124d45;
  --gold: #9b691d;
  --sunwash: #f9fbf8;
  --green-soft: #e9f4ef;
  --white: #fff;
  --radius: 20px;
  --shadow: 0 12px 34px #173f3510;
  --card-shadow: 0 3px 8px #173f3505, 0 12px 30px #173f3512;
  --ease-out: cubic-bezier(.2, .75, .25, 1);
  --sans: Inter, system-ui, sans-serif;
}

:root[lang="th"] { --sans: 'Noto Sans Thai', Inter, sans-serif; }
:root[lang="hi"] { --sans: 'Noto Sans Devanagari', Inter, sans-serif; }

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: white; font-family: var(--sans); font-size: 16px; line-height: 1.6; }
h1, h2, h3, p, ul, ol, figure { margin: 0; }
h1, h2, h3 { font-weight: 750; line-height: 1.16; }
h1, h2 { letter-spacing: -.041em; text-wrap: balance; }
:lang(th) h1, :lang(th) h2, :lang(hi) h1, :lang(hi) h2 { letter-spacing: -.012em; line-height: 1.25; }
h2 { font-size: clamp(1.8rem, 3.5vw, 2.65rem); }
h3 { font-size: 1.16rem; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
button, input, select, textarea { color: inherit; font: inherit; }
button, select, summary { cursor: pointer; }
button { background: none; border: 0; }
address { font-style: normal; }
summary { list-style: none; }
summary::-webkit-details-marker { display: none; }
[hidden] { display: none !important; }
:focus-visible { outline: 3px solid var(--green); outline-offset: 4px; }
:target { scroll-margin-top: 112px; }
main:focus { outline: none; }
.icon { display: inline-block; flex: none; vertical-align: middle; }
.wrap { width: min(92%, 1480px); margin-inline: auto; }
@media (min-width: 1750px) { .wrap { width: min(86%, 1680px); } }
.section { padding-block: clamp(48px, 5vw, 76px); }
.sr-only, .skip-link:not(:focus) { position: absolute; width: 1px; height: 1px; overflow: hidden; padding: 0; clip-path: inset(50%); white-space: nowrap; }
.skip-link:focus { position: fixed; z-index: 50; top: 12px; left: 12px; padding: 8px 16px; border-radius: 8px; background: var(--yellow); }

.site-header { position: sticky; top: -37px; z-index: 10; }
.utility { background: var(--dark-deep); color: #f4f8f6; font-size: .81rem; font-weight: 650; }
.utility-inner, .utility-actions, .utility a, .utility summary { display: flex; align-items: center; gap: 8px; }
.utility-inner { min-height: 37px; justify-content: space-between; }
.utility-actions { gap: 17px; }
.utility-actions > a { padding-left: 16px; border-left: 1px solid #ffffff30; white-space: nowrap; }
.utility a:hover, .utility summary:hover { text-decoration: underline; text-underline-offset: 4px; }
.language-menu { position: relative; }
.language-menu summary { min-height: 36px; }
.language-panel { position: absolute; z-index: 5; top: calc(100% + 4px); right: 0; min-width: 145px; padding: 6px; border: 1px solid var(--line); border-radius: 14px; background: white; color: var(--ink); box-shadow: var(--shadow); }
.language-panel a { min-height: 39px; justify-content: space-between; padding: 7px 10px; border-radius: 6px; }
.language-panel a[aria-current="page"] { background: var(--green-soft); color: var(--green); }
.language-panel a[lang="th"] { font-family: 'Noto Sans Thai', var(--sans); }
.language-panel a[lang="hi"] { font-family: 'Noto Sans Devanagari', var(--sans); }

.masthead { background: #fffffff7; color: var(--ink); border-bottom: 1px solid var(--line); box-shadow: 0 4px 18px #173f3506; backdrop-filter: blur(16px); }
.header-inner { min-height: 86px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.brand { flex: none; display: block; width: fit-content; padding: 1px 4px; }
.brand img { width: 98px; height: 79px; object-fit: contain; }
.desktop-nav { display: flex; align-items: center; gap: clamp(13px, 2.2vw, 34px); font-size: .9rem; font-weight: 650; }
.desktop-nav > a, .desktop-nav > details > summary { min-height: 42px; display: flex; align-items: center; white-space: nowrap; }
.desktop-nav > a:hover, .desktop-nav > details > summary:hover, .desktop-nav .nav-active, .desktop-nav > a[aria-current="page"] { color: var(--green); text-decoration: underline; text-decoration-color: var(--yellow); text-decoration-thickness: 3px; text-underline-offset: 7px; }
.desktop-nav .nav-tours > summary { gap: 5px; }
.desktop-nav details, .mobile-nav { position: relative; }
.nav-search > summary, .mobile-nav > summary { width: 42px; display: grid !important; place-items: center; border: 1px solid var(--line); border-radius: 50%; background: var(--green-soft); }
.nav-panel { position: absolute; top: calc(100% + 8px); right: 0; z-index: 4; width: max-content; max-width: min(420px, 86vw); min-width: 235px; padding: 9px; border: 1px solid var(--line); border-radius: 12px; box-shadow: 0 18px 40px #0003; background: white; color: var(--ink); }
.nav-panel a { display: flex; align-items: center; gap: 7px; padding: 8px 10px; border-radius: 7px; font-weight: 650; }
.nav-panel a:hover, .nav-panel a[aria-current="page"] { background: var(--green-soft); color: var(--green); }
.nav-overview a { justify-content: space-between; border-bottom: 1px solid var(--line); margin-bottom: 5px; }
.nav-destinations { display: grid; grid-template-columns: 1fr 1fr; }
.nav-destinations .icon { color: var(--green); }
.search-panel { display: flex; gap: 6px; padding: 10px; }
.search-panel input { min-width: 0; width: clamp(130px, 22vw, 260px); padding: 8px 10px; }
.search-panel .button { min-height: 42px; padding-inline: 13px; }
.mobile-actions { display: none; }

.button {
  display: inline-flex;
  width: fit-content;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 47px;
  padding: 12px 21px;
  border: 1px solid transparent;
  border-radius: 999px;
  font-size: .9rem;
  font-weight: 750;
  line-height: 1.28;
  text-align: center;
  transition: background .24s, border-color .24s, box-shadow .24s, transform .3s var(--ease-out);
}
.button:hover { transform: translateY(-3px); }
.button:active { transform: translateY(0) scale(.98); }
.button > .icon { transition: transform .3s var(--ease-out); }
.button:hover > .icon:last-child:not(:first-child) { transform: translateX(3px); }
.button--yellow { background: linear-gradient(135deg, #f9d780, var(--yellow)); color: var(--dark-deep); box-shadow: 0 4px 14px #ac7f1820; }
.button--yellow:hover { background: linear-gradient(135deg, #f9d780, var(--yellow-hover)); box-shadow: 0 8px 22px #ac7f1830; }
.button--line { border-color: #c9dbd4; background: #ffffffd9; color: var(--pine); }
.button--line:hover { border-color: var(--green); background: var(--green-soft); box-shadow: 0 6px 18px #173f3510; }
.button--glass { border-color: #ffffff6b; background: #ffffff12; color: white; }
.button--glass:hover { border-color: #ffffffbd; background: #ffffff26; }
.button:disabled { cursor: default; opacity: .65; transform: none; }
.kicker { display: flex; align-items: center; gap: 7px; font-size: .71rem; font-weight: 750; letter-spacing: .105em; line-height: 1.4; text-transform: uppercase; color: var(--green); }
:lang(th) .kicker, :lang(hi) .kicker { letter-spacing: .014em; }

.hero { position: relative; overflow: hidden; background: white; color: var(--pine); isolation: isolate; }
.hero-stage { position: relative; display: grid; align-items: center; height: clamp(500px, 41vw, 630px); }
.hero-stage::after { position: absolute; inset: 0; content: ''; background: linear-gradient(90deg, white 0%, white 24%, #ffffffe8 35%, #ffffff45 51%, transparent 63%); }
.hero-video { position: absolute; inset: 0 0 0 auto; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.hero.is-paused::before { animation-play-state: paused; }
.hero-wave { position: absolute; z-index: 3; bottom: -1px; width: 100%; height: 35px; pointer-events: none; }
.hero-wave path[stroke] { stroke: var(--yellow); }
.hero-content { position: relative; z-index: 2; padding: 24px 0 87px; }
.hero .button--glass { background: #ffffffdf; color: var(--pine); border-color: #b8cdbf; }
.hero .button--glass:hover { background: white; }
.hero-content > * { animation: hero-arrival .9s var(--ease-out) both; }
.hero-content > :nth-child(2) { animation-delay: .12s; }
.hero-content > :nth-child(3) { animation-delay: .24s; }
.hero-content > :nth-child(4) { animation-delay: .36s; }
@keyframes hero-arrival { from { opacity: 0; translate: -48px 0; } to { opacity: 1; translate: 0 0; } }
.hero-content .kicker { margin-bottom: 14px; color: var(--green); }
.hero-content h1 { max-width: 720px; color: var(--pine); font-size: clamp(2.8rem, 4.65vw, 4.65rem); font-weight: 750; line-height: 1.05; text-wrap: initial; }
:lang(th) .hero-content h1, :lang(hi) .hero-content h1 { line-height: 1.18; }
.hero-content h1 strong { color: var(--gold); font-weight: inherit; }
.hero-content > p:not(.kicker) { max-width: 445px; margin-top: 18px; color: #253f34; font-size: clamp(.94rem, 1.28vw, 1.09rem); line-height: 1.65; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 24px; }
.hero-controls { position: absolute; z-index: 3; bottom: 48px; left: 0; right: 0; display: flex; align-items: center; justify-content: flex-end; pointer-events: none; }
.hero-controls button { display: grid; pointer-events: auto; place-items: center; width: 43px; height: 43px; border: 1px solid #ffffff80; border-radius: 50%; color: var(--pine); background: #fffdf3ed; box-shadow: 0 5px 14px #13211735; transition: transform .18s, background .18s; }
.hero-controls button:hover { transform: translateY(-2px); color: var(--dark); background: var(--yellow); border-color: var(--yellow); }
[data-hero-pause][aria-pressed="false"] .icon:last-child,
[data-hero-pause][aria-pressed="true"] .icon:first-child { display: none; }
.finder { position: relative; z-index: 4; display: grid; grid-template-columns: 1.18fr 1fr .9fr 1.1fr auto; align-items: stretch; gap: 8px; width: min(92%, 1250px); margin-top: -35px; padding: 12px; border: 1px solid var(--line); border-radius: 24px; background: white; box-shadow: 0 14px 44px #173f3517; }
.finder > label { display: flex; align-items: start; min-width: 0; gap: 8px; padding: 2px 10px; }
.finder > label + label { border-left: 1px solid var(--line); }
.finder > label > .icon { margin-top: 2px; color: var(--green); }
.finder > label > span { display: grid; flex: 1; min-width: 0; gap: 4px; color: var(--pine); font-size: .77rem; font-weight: 750; }
.finder select, .finder input { width: 100%; min-width: 0; min-height: 33px; padding: 3px 7px; border: 1px solid var(--line); border-radius: 9px; background: var(--soft); color: var(--ink); font-size: .87rem; font-weight: 650; }
.finder .button { align-self: center; width: 100%; min-width: 142px; padding-inline: 16px; border-radius: 99px; }

.section-heading { display: flex; justify-content: space-between; align-items: end; gap: 24px; margin-bottom: 22px; }
.section-heading .kicker { width: fit-content; margin-bottom: 9px; padding: 4px 10px; border-radius: 99px; background: var(--green-soft); }
.section-heading h2 { color: var(--pine); }
.section-heading h2::after { display: block; width: 54px; height: 3px; margin-top: 11px; border-radius: 12px; background: linear-gradient(90deg, var(--yellow), #f5c65b30); content: ''; }
.section-heading p:not(.kicker) { max-width: 600px; margin-top: 8px; color: var(--muted); }
.section-heading > a { flex: none; }
.destination-track { position: relative; display: flex; gap: 15px; overflow-x: auto; padding: 5px 4px 26px; margin: -5px -4px -20px; scrollbar-width: none; }
.destination-track::-webkit-scrollbar { display: none; }
.destination-track .destination-card { flex: 0 0 calc((100% - 45px) / 4); }
.destination-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 17px; }
.destination-grid--related { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.destination-card { position: relative; display: block; overflow: hidden; isolation: isolate; min-width: 0; aspect-ratio: 1.04; border-radius: var(--radius); background: var(--dark); }
.destination-grid .destination-card { aspect-ratio: 1.35; }
.destination-card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .3s ease; }
.destination-card::after { position: absolute; inset: 0; z-index: 1; content: ''; background: linear-gradient(180deg, #10171c09 25%, #10171c46 53%, #10171cef 100%); }
.destination-card:hover img, .destination-card:focus-visible img { transform: scale(1.07); }
.destination-card:hover .destination-arrow, .destination-card:focus-visible .destination-arrow { transform: translate(2px, -2px); }
.destination-caption { position: absolute; z-index: 2; left: 17px; right: 15px; bottom: 16px; color: white; }
.destination-caption p { font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .075em; }
:lang(th) .destination-caption p, :lang(hi) .destination-caption p { letter-spacing: .015em; }
.destination-caption h3 { margin-top: 2px; font-size: clamp(1.34rem, 2.8vw, 2.25rem); letter-spacing: -.035em; }
:lang(th) .destination-caption h3, :lang(hi) .destination-caption h3 { letter-spacing: 0; }
.destination-arrow { position: absolute; z-index: 2; top: 12px; right: 12px; width: 37px; height: 37px; display: grid; place-items: center; border-radius: 50%; background: #fffffff2; color: var(--dark); transition: background .18s, transform .18s; }
.destination-card:hover .destination-arrow { background: var(--yellow); }

.scenic-surface, .scenic-page { position: relative; isolation: isolate; }
.scenic-surface::before, .scenic-page::before {
  position: absolute; z-index: -1; inset: 0; pointer-events: none; content: '';
  background: var(--scenery) var(--scene-position, center) / cover no-repeat;
  opacity: var(--scene-opacity, .08); mask-image: linear-gradient(180deg, transparent, black 24%, black 76%, transparent);
}
.scenic-page { background: linear-gradient(180deg, #f2f8f5, white 560px); }
.scenic-page::before { inset: 245px 0 auto; height: min(660px, 55vh); opacity: .07; }
.destinations-section { margin-top: -46px; padding-top: 46px; background: linear-gradient(180deg, var(--sunwash), white); --scene-position: center 55%; --scene-opacity: .08; }
.stats-band { border-block: 1px solid #ffffff20; background: var(--pine); color: white; }
.stats-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; padding-block: 24px; }
.stats-grid > div { display: grid; justify-items: center; align-content: start; gap: 3px; text-align: center; }
.stats-grid > div + div { border-left: 1px solid #ffffff26; }
.stats-grid .icon { color: var(--yellow); }
.stats-grid strong { color: white; font-size: clamp(1.8rem, 3.1vw, 2.6rem); font-weight: 750; line-height: 1.25; font-variant-numeric: tabular-nums; }
.stats-grid span { font-size: .87rem; }
.experience-section { background: #f2f7f4; border-top: 1px solid var(--line); --scene-opacity: .06; }
.experience-section .section { padding-block: 37px 49px; }
.experience-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
.experience-card { position: relative; isolation: isolate; display: flex; flex-direction: column; justify-content: end; align-items: start; gap: 7px; min-height: 193px; padding: 13px; overflow: hidden; border-radius: var(--radius); color: white; background: var(--pine); box-shadow: var(--shadow); }
.experience-photo { position: absolute; z-index: -2; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .36s ease; }
.experience-card::before { position: absolute; z-index: -1; inset: 0; background: linear-gradient(180deg, #0626150a 12%, #06261540 36%, #082d1ce8 100%); content: ''; }
.experience-card:hover .experience-photo, .experience-card:focus-visible .experience-photo { transform: scale(1.095); }
.experience-card .service-icon { width: 34px; height: 34px; background: #fff8cf; color: var(--pine); }
.experience-card strong { line-height: 1.27; font-size: 1.03rem; }
.experience-card > span:last-child { display: flex; align-items: center; justify-content: space-between; gap: 6px; width: 100%; font-size: .81rem; color: #fff4c7; }
.experience-card > span:last-child .icon { color: var(--yellow); transition: transform .18s; }
.experience-card:hover > span:last-child .icon { transform: translate(2px, -2px); }
.why-section { background: linear-gradient(115deg, #f8faf7, #edf5f1); --scene-opacity: .06; }
.why-layout { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); align-items: center; gap: clamp(20px, 4vw, 52px); }
.why-layout > div > .button { margin-top: 18px; }
.why-photo { position: relative; overflow: hidden; aspect-ratio: 1.22; border-radius: 20px 34% 32% 20px; border-right: 5px solid var(--yellow); box-shadow: var(--shadow); }
.why-photo img { width: 100%; height: 100%; object-fit: cover; }
.why-photo figcaption { position: absolute; bottom: 16px; left: 16px; display: flex; align-items: center; gap: 5px; padding: 5px 10px; border-radius: 9px; background: #fffef4; color: var(--pine); font-size: .86rem; font-weight: 750; }
.why-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding: 0; list-style: none; }
.why-grid li { display: flex; align-items: start; gap: 11px; padding: 16px; border: 1px solid var(--line); border-radius: 13px; background: #fffefaee; box-shadow: 0 4px 10px #32492f0e; }
.why-grid h3 { margin-bottom: 3px; font-size: 1.02rem; }
.why-grid p { color: var(--muted); font-size: .88rem; }
/* Added only after the observer is ready; content stays visible without JavaScript. */
.reveal-pending { opacity: 0; }
.reveal-pending:focus-within { opacity: 1; }
.feature-section { background: white; border-block: 1px solid var(--line); --scene-opacity: .05; --scene-position: center 58%; }
.services-section { background: #f1f7f3; --scene-opacity: .05; }
.journey-section { background: #fbf9f2; --scene-opacity: .04; }
.journey-steps { position: relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; padding: 0; list-style: none; }
.journey-steps::before { position: absolute; top: 35px; left: 8%; right: 8%; border-top: 2px dashed #d5c39b; content: ''; }
.journey-steps li { position: relative; }
.journey-steps a { display: grid; align-content: start; justify-items: start; gap: 8px; height: 100%; padding: 14px 16px; border: 1px solid var(--line); border-radius: var(--radius); background: #fffffff4; box-shadow: var(--shadow); transition: border-color .2s, transform .3s var(--ease-out); }
.journey-steps a:hover { border-color: #b6cdc3; transform: translateY(-3px); }
.journey-steps strong { display: flex; align-items: center; gap: 8px; color: var(--pine); }
.journey-steps a > span:last-child { font-size: .9rem; color: var(--muted); }
.journey-icon { position: relative; display: grid; width: 47px; height: 47px; place-items: center; border-radius: 50%; background: #f9edce; color: var(--green); }
.journey-icon b { position: absolute; top: -4px; right: -5px; display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; background: var(--green); color: white; font-size: .69rem; }
.journey-steps a:hover .journey-icon { background: var(--yellow); }
.tour-grid, .vehicle-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 19px; }
.tour-card { display: flex; flex-direction: column; min-width: 0; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius); background: white; transition: border-color .24s, box-shadow .3s, transform .35s var(--ease-out); }
.tour-card:hover { border-color: #b6cdc3; transform: translateY(-5px); }
.tour-picture { display: block; position: relative; overflow: hidden; aspect-ratio: 1.7; background: #dce6e7; }
.tour-picture img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.tour-card:hover .tour-picture img, .tour-card:focus-within .tour-picture img { transform: scale(1.065); }
.tour-picture:focus-visible { outline-offset: -3px; }
.tour-picture > span { position: absolute; top: 12px; left: 12px; display: flex; align-items: center; gap: 4px; padding: 5px 10px; border-radius: 999px; background: #fffffff2; color: var(--ink); font-size: .74rem; font-weight: 700; }
.tour-picture > span .icon { color: var(--green); }
.tour-card-body { display: flex; flex: 1; flex-direction: column; align-items: flex-start; gap: 9px; padding: 17px; }
.tour-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 12px; color: var(--muted); font-size: .75rem; font-weight: 650; }
.tour-meta span:first-child { display: inline-flex; align-items: center; gap: 5px; color: var(--green); }
.tour-card h3 { font-size: clamp(1.06rem, 1.7vw, 1.34rem); letter-spacing: -.022em; }
.tour-card h3 a:hover { text-decoration: underline; text-underline-offset: 3px; }
.tour-card-body > p { flex: 1; color: var(--muted); font-size: .89rem; line-height: 1.55; }
.tour-card .button { min-height: 40px; margin-top: 3px; padding: 8px 12px; font-size: .82rem; }
.service-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.service-card, .contact-method { display: flex; align-items: center; gap: 14px; padding: 18px; border: 1px solid var(--line); border-radius: var(--radius); background: white; }
.service-card { position: relative; isolation: isolate; min-height: 154px; overflow: hidden; background: linear-gradient(125deg, #e8f2ec, #f3f7f2 64%); border-color: #d5e4dc; transition: border-color .24s, box-shadow .3s, transform .35s var(--ease-out); }
.service-photo { position: absolute; z-index: -1; top: 0; right: 0; width: 47%; height: 100%; object-fit: cover; clip-path: polygon(12% 0, 100% 0, 100% 100%, 0 100%); filter: saturate(1.13) contrast(1.03); transition: transform .35s; }
.service-copy { max-width: calc(55% - 52px); }
.service-card:hover { border-color: #9bbdae; transform: translateY(-4px); }
.service-card:hover .service-photo { transform: scale(1.055); }
.service-icon { display: grid; flex: none; place-items: center; width: 45px; height: 45px; border-radius: 14px; background: var(--green-soft); color: var(--green); }
.service-card .service-icon { background: var(--green); color: white; }
.service-copy strong, .service-copy > span { display: block; }
.service-copy strong { color: var(--pine); font-size: 1.12rem; }
.service-copy > span { color: #344638; font-size: .9rem; }
.service-card > .icon, .contact-method > .icon { margin-left: auto; color: var(--green); }
.service-card > .icon { flex: none; width: 35px; height: 35px; padding: 8px; border-radius: 50%; background: #fffdf1; }

.trip-callout { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 27px 31px; margin-bottom: 61px; border-radius: var(--radius); background: #eaf3ed; color: var(--ink); }
.trip-callout .kicker { color: var(--green); }
.trip-callout h2 { margin-top: 6px; font-size: clamp(1.7rem, 3vw, 2.35rem); }
.trip-callout p:not(.kicker) { margin-top: 6px; color: var(--muted); }
.trip-callout .button { flex: none; }
.site-footer { border-top: 3px solid var(--yellow); background: white; color: var(--ink); }
.footer-main { display: grid; grid-template-columns: 1fr .85fr 1.1fr; gap: 26px; padding-block: 39px 30px; }
.footer-brand .brand img { width: 97px; height: 78px; }
.footer-brand p { margin-top: 10px; font-size: .87rem; color: var(--muted); }
.site-footer h2 { margin-bottom: 10px; color: var(--ink); font-size: 1rem; letter-spacing: 0; }
.site-footer nav, .site-footer address { display: grid; gap: 6px; color: var(--ink); font-size: .86rem; }
.site-footer address > * { display: flex; align-items: center; gap: 8px; overflow-wrap: anywhere; }
.site-footer .icon { color: var(--green); }
.site-footer a:hover { text-decoration: underline; text-underline-offset: 3px; }
.footer-bottom { display: flex; justify-content: space-between; gap: 11px; padding-block: 14px; border-top: 1px solid var(--line); font-size: .76rem; color: var(--muted); }

.page-banner { position: relative; overflow: hidden; isolation: isolate; background: #eef5f0; color: var(--pine); border-bottom: 3px solid var(--yellow); }
.banner-photo { position: absolute; inset: 0 0 0 auto; width: min(69%, 1160px); height: 100%; object-fit: cover; object-position: 50% 55%; mask-image: linear-gradient(90deg, transparent, black 31%); }
.page-banner--team { background: white; }
.page-banner--team .banner-inner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: clamp(22px, 4vw, 56px); width: min(92%, 1190px); }
.page-banner--team .banner-copy > :is(h1, .banner-description) { max-width: 100%; }
.team-banner-photo { width: 100%; max-width: 540px; height: auto; justify-self: end; border-radius: var(--radius); box-shadow: var(--card-shadow); }
.page-banner::after { position: absolute; inset: 0; z-index: 1; content: ''; background: linear-gradient(90deg, #f5faf6f7 0%, #eef5f0e5 30%, #eef5f094 49%, transparent 71%); }
.page-banner--team::after { content: none; }
.banner-inner { position: relative; z-index: 2; min-height: 268px; padding-block: 26px 34px; }
.breadcrumbs { margin-bottom: 20px; color: #3c5548; font-size: .77rem; }
.breadcrumbs ol { display: flex; flex-wrap: wrap; gap: 5px 8px; padding: 0; list-style: none; }
.breadcrumbs li:not(:first-child)::before { margin-right: 8px; color: #668471; content: '/'; }
.breadcrumbs a:hover { text-decoration: underline; }
.banner-inner .kicker { color: var(--green); margin-bottom: 6px; }
.banner-inner h1 { max-width: min(60%, 860px); color: var(--pine); font-size: clamp(2.15rem, 4.35vw, 4.1rem); text-wrap: initial; }
.banner-description { max-width: min(58%, 620px); margin-top: 10px; color: #29473a; font-size: clamp(.92rem, 1.3vw, 1.05rem); }
.banner-facts { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 13px; }
.banner-facts span { display: inline-flex; align-items: center; gap: 6px; padding: 5px 8px; border: 1px solid #b9d3c1; border-radius: 6px; background: #fffef6cf; font-size: .79rem; }
.banner-inner .button { margin-top: 17px; }
.catalogue-section { padding-top: 37px; }
.catalogue-filters { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; padding: 11px; border: 1px solid var(--line); border-radius: 11px; background: var(--soft); }
.catalogue-filters > label { min-width: 170px; }
.catalogue-filters input, .catalogue-filters select, .search-panel input, .request-form input, .request-form select, .request-form textarea { min-height: 43px; border: 1px solid #d1dadd; border-radius: 7px; background: white; }
.catalogue-filters input, .catalogue-filters select { width: 100%; padding: 8px 10px; font-size: .89rem; }
.catalogue-filters .filter-search { position: relative; flex: 1; min-width: 180px; }
.filter-search svg { position: absolute; top: 12px; left: 10px; color: var(--green); pointer-events: none; }
.filter-search input { padding-left: 36px; }
.text-button { min-height: 43px; padding-inline: 8px; font-size: .83rem; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.result-count { padding-block: 13px; color: var(--muted); font-size: .86rem; font-weight: 650; }
.empty-state { padding: 34px 17px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--soft); text-align: center; }
.empty-state .icon { color: var(--green); }
.empty-state h2 { margin: 7px 0; font-size: 1.55rem; }
.empty-state p { margin-bottom: 14px; color: var(--muted); }
.related { padding-top: 0; }

.detail-layout { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(340px, .8fr); align-items: start; gap: clamp(22px, 5vw, 62px); padding-block: 38px 58px; }
.detail-content { display: grid; gap: 24px; min-width: 0; }
.detail-section { padding: 17px 18px 20px; border: 1px solid var(--line); border-radius: var(--radius); background: #fffefaeb; }
.detail-section h2, .request-panel h2, .contact-info h2 { margin-bottom: 8px; font-size: clamp(1.55rem, 2.6vw, 2.08rem); }
.detail-section h3 { margin: 16px 0 7px; font-size: 1.05rem; }
.detail-section p { color: var(--muted); }
.detail-note { margin-top: 10px; font-size: .87rem; }
.timeline { margin: 15px 0 0 5px; padding: 0; list-style: none; }
.timeline li { position: relative; display: grid; grid-template-columns: minmax(95px, 125px) 1fr; gap: 13px; padding: 0 0 15px 17px; border-left: 1px solid #c5d4d2; }
.timeline li::before { position: absolute; top: 7px; left: -5px; width: 9px; height: 9px; border: 1px solid #a88b19; border-radius: 50%; background: var(--yellow); content: ''; }
.timeline li:last-child { padding-bottom: 0; border-color: transparent; }
.timeline strong, .timeline p { font-size: .94rem; }
.line-list { display: grid; gap: 7px; list-style: none; padding: 0; }
.line-list li { display: flex; align-items: flex-start; gap: 8px; }
.line-list .icon { margin-top: 3px; color: var(--green); }
.transfer-note { display: flex; align-items: flex-start; gap: 10px; margin-top: 13px; padding: 12px; border-radius: 8px; background: var(--green-soft); }
.transfer-note .icon { margin-top: 2px; color: var(--green); }
.transfer-note p { font-size: .9rem; }

.request-panel { min-width: 0; padding: 21px; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); background: white; }
.request-panel-top { padding-bottom: 14px; border-bottom: 1px solid var(--line); margin-bottom: 14px; }
.request-panel-top .kicker { margin-bottom: 7px; }
.request-panel-top p:not(.kicker) { color: var(--muted); font-size: .89rem; }
.request-form { display: grid; gap: 13px; }
.request-form label { display: grid; align-content: start; gap: 5px; min-width: 0; font-size: .86rem; font-weight: 700; }
.request-form input, .request-form select, .request-form textarea { display: block; width: 100%; min-width: 0; padding: 8px 10px; color: var(--ink); font-size: .91rem; font-weight: 500; }
.request-form textarea { resize: vertical; }
.form-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.guest-controls { display: grid; gap: 6px; padding: 0; margin: 0; border: 0; min-width: 0; }
.guest-controls legend { padding: 0 0 4px; font-size: .87rem; font-weight: 750; }
.guest-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 5px 0; }
.guest-row + .guest-row { border-top: 1px solid #edf0f1; }
.stepper { display: grid; align-items: center; grid-template-columns: 38px 42px 38px; }
.stepper button { display: grid; place-items: center; width: 38px; height: 38px; border: 1px solid #c9d9d3; border-radius: 7px; color: var(--green); background: white; }
.stepper button:hover { background: var(--green-soft); }
.stepper button:disabled { color: #85938f; background: #f4f6f6; cursor: default; }
.stepper input[type="number"] { min-height: 36px; appearance: textfield; padding-inline: 1px; border: 0; text-align: center; font-weight: 700; }
.stepper input::-webkit-inner-spin-button, .stepper input::-webkit-outer-spin-button { appearance: none; }
.special-request summary { display: flex; align-items: center; gap: 5px; width: fit-content; font-size: .85rem; font-weight: 700; color: var(--green); }
.special-request[open] summary .icon { transform: rotate(45deg); }
.special-request[open] textarea { margin-top: 6px; }
.request-summary { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 12px; padding: 9px 10px; border: 1px solid #e0ebe3; border-radius: 8px; background: var(--green-soft); }
.request-summary span { display: inline-flex; align-items: center; gap: 5px; font-size: .8rem; }
.request-summary .icon { color: var(--green); }
.request-form > .button { width: 100%; }
.form-help { color: var(--muted); font-size: .76rem; line-height: 1.45; }
.request-dialog { width: min(550px, calc(100% - 30px)); max-height: calc(100% - 28px); padding: 0; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: 0 20px 62px #0004; color: var(--ink); }
.request-dialog::backdrop { background: #111b22b9; }
.dialog-inner { position: relative; padding: 22px; }
.dialog-close { position: absolute; top: 11px; right: 11px; }
.icon-button { display: grid; place-items: center; width: 38px; height: 38px; border: 1px solid var(--line); border-radius: 50%; }
.icon-button:hover { background: var(--soft); }
.dialog-inner h2 { margin: 6px 41px 8px 0; font-size: 1.85rem; }
.dialog-inner > p:not(.kicker) { color: var(--muted); font-size: .89rem; }
.dialog-inner dl { display: grid; gap: 4px; max-height: 34vh; overflow: auto; padding: 10px; border-radius: 8px; background: var(--soft); }
.dialog-inner dl div { display: grid; grid-template-columns: minmax(84px, .4fr) 1fr; gap: 7px; overflow-wrap: anywhere; font-size: .85rem; }
.dialog-inner dt { font-weight: 700; }
.dialog-inner dd { margin: 0; white-space: pre-wrap; }
.dialog-actions { display: flex; flex-wrap: wrap; gap: 7px; }
.dialog-inner .form-help { margin-top: 8px; }
.dialog-inner .form-help:empty { display: none; }

.vehicle-card { padding: 17px; border: 1px solid var(--line); border-radius: var(--radius); background: #fffef7; box-shadow: var(--shadow); }
.vehicle-seats { margin-top: 8px; color: var(--green); font-size: .79rem; font-weight: 700; }
.vehicle-card h3 { margin: 3px 0 5px; }
.vehicle-card > p:last-child { color: var(--muted); font-size: .9rem; }
.transport-vehicles { padding-block: 35px 3px; }
.route-list { display: grid; gap: 8px; margin-top: 12px; }
.route-card { padding: 9px 11px; border: 1px solid var(--line); border-radius: 8px; }
.route-card summary { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 8px; }
.route-card summary .icon { color: var(--green); }
.route-card summary strong, .route-card summary small { display: block; }
.route-card summary small { color: var(--muted); font-size: .78rem; }
.route-card p { margin: 8px 0 2px; font-size: .9rem; }
.route-card table { width: 100%; margin-top: 7px; border-collapse: collapse; font-size: .86rem; text-align: left; }
.route-card td, .route-card th { padding: 4px 7px; border-bottom: 1px solid var(--line); }
.route-card th { background: var(--soft); }

.contact-layout { gap: clamp(21px, 4.1vw, 53px); grid-template-columns: minmax(0, .91fr) minmax(340px, 1.09fr); }
.company-name { margin-bottom: 12px; color: var(--muted); }
.contact-info address { display: grid; gap: 8px; }
.contact-method { padding: 11px; min-width: 0; }
.destination-card, .experience-card, .tour-card, .service-card, .journey-steps a,
.why-grid li, .detail-section, .request-panel, .vehicle-card, .contact-method,
.trip-callout { box-shadow: var(--card-shadow); }
.tour-card:is(:hover, :focus-within), .service-card:is(:hover, :focus-visible) {
  box-shadow: 0 5px 12px #173f350a, 0 18px 36px #173f3520;
}
.contact-method > div { min-width: 0; }
.contact-method > div > span { display: block; font-size: .75rem; color: var(--muted); }
.contact-method a, .contact-method strong { display: inline-block; overflow-wrap: anywhere; font-weight: 700; }
.contact-method a:hover { text-decoration: underline; text-underline-offset: 3px; }
.faq details { border-bottom: 1px solid var(--line); }
.faq details:last-child { border-bottom: 0; }
.faq summary { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding-block: 10px; font-size: .9rem; font-weight: 700; }
.faq details[open] summary .icon { transform: rotate(45deg); }
.faq p { padding-bottom: 8px; font-size: .87rem; }
.booking-steps { display: grid; gap: 11px; list-style: none; padding: 0; }
.booking-steps li { display: flex; gap: 9px; align-items: flex-start; }
.booking-steps li span { display: grid; flex: none; place-items: center; width: 27px; height: 27px; border-radius: 6px; background: var(--yellow); font-weight: 750; }
.credits li { margin-bottom: 8px; }
.credits a { text-decoration: underline; text-underline-offset: 3px; }

@media (max-width: 990px) {
  .wrap, .finder { width: calc(100% - 54px); }
  .desktop-nav { gap: 15px; }
  .desktop-nav > a, .desktop-nav > details { font-size: .83rem; }
  .hero-content h1 { max-width: 620px; }
  .tour-grid, .vehicle-grid { gap: 13px; }
  .tour-card-body { padding: 13px; }
  .section { padding-block: 49px; }
  .catalogue-section { padding-top: 31px; }
  .related { padding-top: 0; }
  .transport-vehicles { padding-bottom: 3px; }
}

@media (max-width: 850px) {
  .finder { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .finder .button { grid-column: 1 / -1; }
  .finder > label:nth-child(3) { border-left: 0; }
  .header-inner { min-height: 72px; }
  .brand img { width: 73px; height: 59px; }
  .desktop-nav { display: none; }
  .mobile-actions { display: flex; align-items: center; gap: 9px; }
  .mobile-actions > a, .mobile-nav > summary { min-height: 44px; border: 1px solid var(--green); background: var(--green); color: white; }
  .mobile-actions > a { display: inline-flex; align-items: center; padding: 8px 15px; border-radius: 999px; font-size: .82rem; font-weight: 700; }
  .mobile-actions > a:hover, .mobile-actions > a[aria-current="page"], .mobile-nav > summary:hover, .mobile-nav[open] > summary { background: var(--pine); border-color: var(--pine); }
  .mobile-nav > summary { width: 44px; }
  .mobile-nav .nav-panel { min-width: 205px; }
  .hero-stage { height: 480px; }
  .destination-track .destination-card { flex-basis: calc((100% - 32px) / 3.12); }
  .detail-layout { gap: 19px; grid-template-columns: minmax(0, 1fr) minmax(286px, .9fr); }
  .request-panel { padding: 14px; }
  .timeline li { display: block; }
}

@media (max-width: 680px) {
  .wrap, .finder { width: calc(100% - 30px); }
  .site-header { top: -35px; }
  .utility-inner { min-height: 35px; gap: 5px; }
  .utility-actions { gap: 7px; }
  .utility-actions > a { padding-left: 7px; }
  .utility { font-size: .72rem; }
  .utility-phone { gap: 3px !important; }
  .utility .icon { width: 14px; }
  .header-inner { min-height: 68px; }
  .brand img { width: 66px; height: 54px; }
  .hero-stage { height: 505px; }
  .hero-stage { align-items: end; }
  .hero-wave { display: none; }
  .hero-video { height: 72%; bottom: auto; object-position: 67% center; }
  .hero-stage::after { background: linear-gradient(180deg, transparent 35%, #ffffff35 43%, #fffffff2 58%, white 69%); }
  .destinations-section { margin-top: -31px; padding-top: 31px; }
  .hero-content { padding: 13px 0 64px; }
  .hero-content h1 { font-size: clamp(2.15rem, 8.2vw, 3.25rem); }
  .hero-content .kicker { margin-bottom: 7px; }
  .hero-content > p:not(.kicker) { margin-top: 8px; font-size: .89rem; }
  .hero-actions { margin-top: 13px; gap: 6px; }
  .hero-actions .button { min-height: 38px; padding: 7px 9px; font-size: .79rem; }
  .hero-actions .icon { width: 15px; }
  .hero-controls { bottom: 14px; }
  .hero-controls button { width: 36px; height: 36px; }
  .hero-controls .icon { width: 18px; }
  .finder { gap: 14px; margin-top: 14px; padding: 15px; border-radius: 18px; }
  .finder > label { display: block; position: relative; padding: 0; }
  .finder > label + label { border-left: 0; }
  .finder > label > span { gap: 6px; font-size: .82rem; }
  .finder > label > .icon { position: absolute; top: 1px; left: 0; width: 17px; height: 17px; margin: 0; }
  .finder-label { min-height: 19px; padding-inline-start: 23px; line-height: 1.4; }
  .finder select, .finder input { min-height: 44px; font-size: 1rem; }
  .finder .button { min-height: 48px; margin-top: 2px; }
  .section { padding-block: 36px; }
  .section-heading { align-items: start; flex-direction: column; gap: 9px; margin-bottom: 16px; }
  .section-heading p:not(.kicker) { font-size: .88rem; }
  .section-heading > a { min-height: 39px; padding: 7px 10px; font-size: .8rem; }
  .destination-track { gap: 8px; }
  .destination-track .destination-card { flex-basis: 61%; }
  .destination-grid, .destination-grid--related { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .destination-card, .destination-grid .destination-card { aspect-ratio: 1.02; border-radius: 16px; }
  .destination-caption { left: 10px; right: 8px; bottom: 10px; }
  .destination-caption p { font-size: .6rem; }
  .destination-caption h3 { font-size: 1.35rem; }
  .destination-arrow { top: 8px; right: 8px; width: 28px; height: 28px; }
  .destination-arrow .icon { width: 15px; }
  .tour-grid, .service-grid, .vehicle-grid { grid-template-columns: 1fr; gap: 11px; }
  .stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 7px; padding-block: 18px; }
  .stats-grid > div:nth-child(3) { border-left: 0; }
  .experience-section .section { padding-block: 25px 34px; }
  .experience-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
  .experience-card { min-height: 157px; padding: 10px; }
  .experience-card:last-child { grid-column: 1 / -1; min-height: 124px; }
  .why-grid, .why-layout, .journey-steps { grid-template-columns: 1fr; gap: 9px; }
  .why-photo { aspect-ratio: 1.77; border-radius: 16px 28% 28% 16px; }
  .journey-steps::before { display: none; }
  .service-card { min-height: 135px; gap: 9px; }
  .service-card .service-icon { width: 34px; height: 34px; }
  .service-photo { width: 40%; }
  .service-copy { max-width: calc(60% - 34px); }
  .tour-card h3 { font-size: 1.16rem; }
  .tour-picture { aspect-ratio: 1.92; }
  .service-card, .vehicle-card { padding: 12px; }
  .trip-callout { flex-direction: column; align-items: start; padding: 17px; margin-bottom: 35px; }
  .trip-callout p:not(.kicker) { font-size: .88rem; }
  .footer-main { grid-template-columns: 1fr; gap: 17px; padding-block: 23px; }
  .banner-photo { width: 100%; mask-image: none; object-position: center; }
  .page-banner--team .banner-inner { grid-template-columns: minmax(0, 1fr); gap: 15px; width: calc(100% - 30px); min-height: 0; }
  .team-banner-photo { justify-self: start; }
  .page-banner::after { background: linear-gradient(90deg, #f5faf6f5 0%, #eef5f0dc 35%, #eef5f0a1 68%, #eef5f044 100%); }
  .banner-inner h1, .banner-description { max-width: 100%; }
  .banner-inner { min-height: 232px; padding-block: 18px 22px; }
  .breadcrumbs { margin-bottom: 11px; }
  .catalogue-section { padding-top: 25px; }
  .catalogue-filters { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; padding: 7px; }
  .catalogue-filters > label, .catalogue-filters .filter-search { min-width: 0; }
  .filter-search { grid-column: 1 / -1; }
  .catalogue-filters input, .catalogue-filters select { font-size: 1rem; }
  .related { padding-top: 0; }
  .detail-layout { grid-template-columns: 1fr; gap: 16px; padding-block: 23px 34px; }
  .detail-content { gap: 14px; }
  .request-form input, .request-form select, .request-form textarea { font-size: 1rem; }
  .transport-vehicles { padding-bottom: 3px; }
}

@media (max-width: 360px) {
  .finder { grid-template-columns: minmax(0, 1fr); }
}

@media (prefers-reduced-motion: reduce) {
  .reveal-pending { opacity: 1; }
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
  .hero-controls [data-hero-pause] { display: none; }
}