/* The header only carries its page-transition name while a page change is running (html.vt-nav, set in the
   inline head script). A permanent name would stop the Explore menu's glass blur from working. */
header{view-transition-name:none}
html.vt-nav header{view-transition-name:site-header}
/* The header's glass blur lives on a layer behind it, not on the header itself: a blurred parent
   would stop the Explore menu (inside the header) from blurring what is behind it. */
body header{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
header:before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none}
.concept-home header:not(.is-scrolled):before{backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px)}
.agency-home header.is-scrolled:before{backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}

/* Header "Explore" dropdown (all pages): a small glass strip of round photo icons that drop in one by one. */
.nav-explore{position:relative}
.nav-explore>summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:5px;font-size:14px;white-space:nowrap;user-select:none;position:relative}
.nav-explore>summary::-webkit-details-marker{display:none}
.nav-explore>summary svg{width:13px;height:13px;transition:transform .25s}
.nav-explore[open]>summary svg{transform:rotate(180deg)}
.nav-explore>summary:after{content:'';position:absolute;bottom:-6px;left:0;right:18px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .3s}
.nav-explore>summary:hover:after,.nav-explore[open]>summary:after{transform:scaleX(1)}

.nav-explore-panel{position:absolute;z-index:40;top:calc(100% + 14px);left:50%;transform:translateX(-50%);display:flex;gap:0;padding:12px 8px 10px;
 background:linear-gradient(180deg,#1a3a7099,#0b22507a);border:1px solid #ffffff4d;border-radius:24px;
 box-shadow:0 18px 44px -14px #06204a80,inset 0 1px 0 #ffffff40;backdrop-filter:blur(26px) saturate(1.7);-webkit-backdrop-filter:blur(26px) saturate(1.7);animation:explore-in .2s ease-out}
header .navlinks .nav-explore-item{position:relative;display:flex;flex-direction:column;align-items:center;gap:7px;width:94px;margin:0 10px;padding:6px 2px 4px;border-radius:14px;color:#fff;text-decoration:none;white-space:normal;text-align:center;
 animation:explore-drop .34s cubic-bezier(.3,1.4,.5,1) both}
header .navlinks .nav-explore-item:nth-child(2){animation-delay:.04s}
header .navlinks .nav-explore-item:nth-child(3){animation-delay:.08s}
header .navlinks .nav-explore-item:nth-child(4){animation-delay:.12s}
header .navlinks .nav-explore-item:nth-child(5){animation-delay:.16s}
header .navlinks .nav-explore-item:hover,header .navlinks .nav-explore-item:hover *{text-decoration:none}
header .navlinks .nav-explore-item:focus-visible{outline:2px solid #2b68c4;outline-offset:0}
/* Thin glass divider between items. */
header .navlinks .nav-explore-item+.nav-explore-item:before{content:'';position:absolute;left:-11px;top:8px;bottom:8px;width:2px;background:linear-gradient(90deg,#0b225066 0 1px,#ffffff73 1px 2px);-webkit-mask-image:linear-gradient(180deg,transparent,#000 22%,#000 78%,transparent);mask-image:linear-gradient(180deg,transparent,#000 22%,#000 78%,transparent)}
.nav-explore-label{color:#fff;text-shadow:0 1px 3px #0b2250cc}

/* Glossy round photo icon */
.nav-explore-icon{position:relative;display:block;width:52px;height:52px;border-radius:50%;overflow:hidden;
 box-shadow:0 6px 14px -4px #0b2d6680,0 0 0 2px #fff,0 0 0 3px #c9d9f2;transition:transform .2s,box-shadow .2s}
.nav-explore-icon img{display:block;width:100%;height:100%;object-fit:cover}
.nav-explore-icon:after{content:'';position:absolute;inset:0;border-radius:50%;pointer-events:none;
 background:linear-gradient(160deg,#ffffffa6 0%,#ffffff26 34%,#fff0 50%),radial-gradient(circle at 50% 120%,#0b2d6640,#0000 60%)}
.nav-explore-item:hover .nav-explore-icon,.nav-explore-item:focus-visible .nav-explore-icon{transform:translateY(-2px) scale(1.06);box-shadow:0 10px 18px -4px #0b2d6699,0 0 0 2px #fff,0 0 0 3px #2b68c4}
.nav-explore-label{font-size:11.5px;line-height:1.25;font-weight:600;letter-spacing:0}

@keyframes explore-in{from{opacity:0;translate:0 -6px}}
@keyframes explore-drop{from{opacity:0;transform:translateY(-10px) scale(.85)}}

/* Phones: same strip, centred under the menu row, icons slightly smaller. */
@media(max-width:700px){
 .nav-explore{position:static}
 .nav-explore-panel{top:calc(100% - 4px);padding:10px 4px 8px;border-radius:20px;max-width:calc(100vw - 16px)}
 header .navlinks .nav-explore-item{width:68px;margin:0 6px}
 header .navlinks .nav-explore-item+.nav-explore-item:before{left:-7px}
 .nav-explore-icon{width:44px;height:44px}
 .nav-explore-label{font-size:11px}
}
@media(prefers-reduced-motion:reduce){.nav-explore-panel,header .navlinks .nav-explore-item{animation:none}.nav-explore>summary svg,.nav-explore>summary:after,.nav-explore-icon{transition:none}}

/* Wide letter-spacing breaks Devanagari and CJK characters apart; the small section labels use it site-wide. */
:is(:lang(ne),:lang(hi),:lang(zh-CN),:lang(ja),:lang(ko)) :is(.eyebrow,.tag){letter-spacing:0!important}
/* Small phones: keep Home · Travel packages · Explore · Services · Booking on one line where the words allow. */
@media(max-width:430px){
 header .navlinks,.concept-home header .navlinks{gap:8px 11px!important}
 header .navlinks>a,header .nav-explore>summary{font-size:13px}
 header .navlinks>a.button{padding:6px 12px!important;font-size:13px}
}

/* Peak & Lake icon set (tools/icons.py): duotone navy line, light-blue fill, gold accent. */
.ic .f{fill:#d3e2fa}.ic .w{fill:#fff}.ic .g{fill:#e3a33c}
.ic .l,.ic .gl,.ic .wl{fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.ic .l{stroke:#0f3479}.ic .gl{stroke:#e3a33c;stroke-width:1.6}.ic .wl{stroke:#fff}
/* On the dark footer: light line, translucent fill. */
.pl-footer .ic .f{fill:#ffffff26}.pl-footer .ic .l{stroke:#e4eeff}.pl-footer .ic .w{fill:#0b2250}

/* Only the contact strip may carry the "contact-strip" transition name; other ".top" classes (map and chart points) must not. */
.top:not(body>.top){view-transition-name:none}

/* WhatsApp + email beside the logo (owner, 2026-09-29): two small glass rows on wide screens,
   two round glass buttons on phones. Colour follows the header (white on the photo, dark when scrolled). */
.hdr-contact{display:flex;flex-direction:column;gap:5px;margin:0 auto 0 18px;padding-left:16px;border-left:1px solid color-mix(in srgb,currentColor 28%,transparent);min-width:0}
.hdr-contact a{display:inline-flex;align-items:center;gap:7px;color:inherit;text-decoration:none;font:600 12.5px/1.2 Arial,sans-serif;letter-spacing:.2px;white-space:nowrap;opacity:.95;transition:opacity .2s,transform .2s}
.hdr-contact a:hover{opacity:1;transform:translateX(2px)}
.hdr-contact a:hover span{text-decoration:underline;text-underline-offset:3px}
.hdr-contact img,.hdr-contact svg{flex:none;width:18px;height:18px}
.hdr-contact svg{fill:#ffffff30;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
header.is-scrolled .hdr-contact svg,body:not(.concept-home) .hdr-contact svg{fill:#1a55b814;stroke:#1a55b8}
@media(max-width:1100px){.hdr-contact a{font-size:11.5px}}
@media(max-width:650px){
 .hdr-contact{flex-direction:row;gap:4px;margin-left:auto;margin-right:0;padding-left:0;border:0}
 .hdr-contact span{display:none}
 .hdr-contact a{width:28px;height:28px;justify-content:center;border-radius:50%;background:linear-gradient(145deg,#ffffff40,#ffffff14);border:1px solid #ffffff66;box-shadow:inset 0 1px 0 #ffffff80,0 4px 10px -6px #0008;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
 header.is-scrolled .hdr-contact a,body:not(.concept-home) .hdr-contact a{background:#fff;border-color:#dce5f4}
 .hdr-contact img,.hdr-contact svg{width:16px;height:16px}
 .brand small{font-size:8px;letter-spacing:.3px}
 .brand{gap:7px}
 header .lang,.concept-home header .lang{margin-left:0;max-width:72px;padding:6px 2px;font-size:11.5px}
 header nav.wrap{column-gap:6px}
}
@media(max-width:380px){.hdr-contact a{width:26px;height:26px}.hdr-contact img,.hdr-contact svg{width:15px;height:15px}header .lang,.concept-home header .lang{max-width:62px;font-size:11px}.brand small{letter-spacing:0}.brand-emblem{transform:scale(.9);margin:0 -2px}}
header nav.wrap>.brand{margin-right:0}
@media(min-width:651px){header nav.wrap>.lang{margin-left:0}}

/* ---------- Touch & motion on every page (owner, 2026-09-29: "always, on everything, start to end") ----------
   Press: anything you can tap shrinks a touch and springs back, with a soft light ripple from the finger.
   Hover (mouse only): cards and buttons lift. Scroll: blocks glide up into place as they arrive. */
:where(.button,button,.cat-chip,.hr-card,.card,.service-tile,.destination-tile,.route-card,.pk-acc>summary,.pk-drop-q>summary,.pk-day>summary,.hs-item,.navlinks>a,.hdr-contact a,.nav-explore-item,.pk-hl-tiles li,.pk-facts-bar li,.featured-trip){
 transition:transform .22s cubic-bezier(.2,.8,.2,1),box-shadow .22s ease,background-color .2s ease,filter .2s ease;-webkit-tap-highlight-color:transparent}
:where(.button,button,.cat-chip,.hr-card,.card,.service-tile,.destination-tile,.route-card,.hs-item,.navlinks>a,.hdr-contact a,.nav-explore-item,.featured-trip):active{transform:scale(.96)}
:where(.pk-acc>summary,.pk-drop-q>summary,.pk-day>summary):active{transform:scale(.985)}
@media(hover:hover) and (pointer:fine){
 :where(.blog-card,.hr-card,.card,.service-tile,.destination-tile,.route-card,.pk-hl-tiles li,.featured-trip):hover{transform:translateY(-4px);box-shadow:0 22px 40px -22px #0b2d66aa}
 :where(.button,.cat-chip):hover{transform:translateY(-2px);filter:brightness(1.05)}
}
.tap-ripple{position:absolute;border-radius:50%;pointer-events:none;background:radial-gradient(circle,#ffffffb3 0%,#ffffff40 45%,transparent 70%);transform:scale(0);opacity:1;animation:tap-ripple .6s ease-out forwards;z-index:3;mix-blend-mode:soft-light}
.tap-ripple.on-light{background:radial-gradient(circle,#1a55b840 0%,#1a55b81a 45%,transparent 70%);mix-blend-mode:normal}
@keyframes tap-ripple{to{transform:scale(1);opacity:0}}
.pl-reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease var(--pl-delay,0s),transform .7s cubic-bezier(.2,.7,.2,1) var(--pl-delay,0s)}
.pl-reveal.is-in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.pl-reveal{opacity:1;transform:none;transition:none}.tap-ripple{display:none}
 :where(.button,button,.cat-chip,.hr-card,.card):active{transform:none}}