/* ===== Himalayan Safar — PREMIUM ===== */
:root{
  --navy:#20061D;
  --navy-rgb:32, 6, 29;
  --navy-2:#3D0B37;
  --orange:#DA627D;
  --orange-rgb:218, 98, 125;
  --orange-2:#FFA5AB;
  --berry:#A53860;
  --green:#1fa055;
  --green-2:#27b562;
  --cream:#FFE5EC;
  --ink:#20061D;
  --muted:#7A5B6F;
  --line:rgba(255,255,255,.14);
  --line-d:#F3CBD6;
  --radius:20px;
  --maxw:1240px;
  --font:"Plus Jakarta Sans",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  --serif:"Fraunces",Georgia,"Times New Roman",serif;
  --shadow:0 30px 80px -30px rgba(0,0,0,.5);
  --ease:cubic-bezier(.22,.61,.36,1);
}
*{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none!important}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
body{font-family:var(--font);color:var(--ink);background:var(--cream);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
em{font-style:italic}
.container{width:100%;max-width:var(--maxw);margin:0 auto;padding:0 24px}
::selection{background:var(--orange);color:#fff}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font-weight:700;font-size:.95rem;border:none;cursor:pointer;border-radius:999px;padding:.8rem 1.4rem;transition:transform .3s var(--ease),box-shadow .3s,background .3s,color .3s;white-space:nowrap;font-family:var(--font)}
.btn:active{transform:translateY(1px)}
.btn-primary{background:linear-gradient(135deg,var(--btn-primary-1,var(--orange)),var(--btn-primary-2,var(--orange-2)));color:var(--btn-text,#fff);box-shadow:0 12px 28px -6px rgba(var(--orange-rgb),.85)}
.btn-primary:hover{transform:translateY(-3px);box-shadow:0 18px 36px -6px rgba(var(--orange-rgb),.98)}
.btn-green{background:linear-gradient(135deg,var(--green),var(--green-2));color:#fff;box-shadow:0 14px 30px -12px rgba(31,160,85,.85)}
.btn-green:hover{transform:translateY(-3px)}
.btn-glass{background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.3);backdrop-filter:blur(10px)}
.btn-glass:hover{background:rgba(255,255,255,.2)}
.btn-lg{padding:1rem 1.9rem;font-size:1.05rem}
.btn-block{width:100%}
.btn.sm{padding:.6rem 1rem;font-size:.86rem}

/* Glass */
.glass{background:rgba(255,255,255,.08);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.16)}

/* Preloader */
.preloader{position:fixed;inset:0;z-index:999;background:var(--navy);display:flex;align-items:center;justify-content:center;transition:opacity .8s var(--ease),visibility .8s}
.preloader.done{opacity:0;visibility:hidden;pointer-events:none}
.pre-inner{display:flex;flex-direction:column;align-items:center;gap:1rem;color:#fff}
.pre-mark{font-size:2.6rem;animation:floaty 2.2s ease-in-out infinite}
.pre-brand{font-family:var(--serif);font-size:1.7rem;letter-spacing:.02em}
.pre-brand b{color:var(--orange)}
.pre-line{width:160px;height:2px;background:rgba(255,255,255,.15);border-radius:2px;overflow:hidden}
.pre-line i{display:block;height:100%;width:40%;background:var(--orange);animation:load 1.1s var(--ease) infinite}
@keyframes load{0%{transform:translateX(-100%)}100%{transform:translateX(350%)}}
@keyframes floaty{50%{transform:translateY(-10px)}}

/* Cursor glow */
.cursor-glow{position:fixed;top:0;left:0;width:380px;height:380px;border-radius:50%;pointer-events:none;z-index:1;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(var(--glow-rgb,var(--orange-rgb)),.28),transparent 65%);mix-blend-mode:screen;opacity:0;transition:opacity .4s}

/* Nav */
.nav{position:fixed;top:0;left:0;right:0;z-index:100;transition:background .4s,box-shadow .4s,padding .4s;padding:6px 0}
.nav.solid{background:rgba(var(--navy-rgb),.88);backdrop-filter:blur(16px);box-shadow:0 10px 30px -18px rgba(0,0,0,.6)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;height:72px}
.brand{display:flex;align-items:center;gap:.6rem}
.brand-mark{font-size:1.7rem}
.brand-text{display:flex;flex-direction:column;line-height:1.05;font-family:var(--serif);font-weight:600;color:#fff;font-size:1.2rem}
.brand-text strong{color:var(--orange)}
.brand-text small{font-family:var(--font);font-size:.6rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.7);margin-top:3px}
.nav-links{display:flex;gap:1.8rem;align-items:center}
.nav-links a{color:rgba(255,255,255,.88);font-weight:600;font-size:.95rem;position:relative;padding:6px 0}
.nav-links a:not(.nav-dropdown-item)::after{content:"";position:absolute;left:0;bottom:-2px;width:0;height:2px;background:var(--orange);transition:width .3s var(--ease)}
.nav-links a:not(.nav-dropdown-item):hover{color:#fff}
.nav-links a:not(.nav-dropdown-item):hover::after{width:100%}
.nav-dropdown{position:relative;display:inline-flex;align-items:center}
.nav-caret{font-style:normal;font-size:.7rem;margin-left:4px;transition:transform .25s ease;display:inline-block;opacity:.85}
.nav-dropdown:hover .nav-caret{transform:rotate(180deg);color:var(--orange-2)}
.nav-dropdown-menu{position:absolute;top:calc(100% + 10px);left:50%;transform:translateX(-50%) translateY(8px);min-width:210px;background:rgba(var(--navy-rgb),.97);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(var(--orange-rgb),.32);border-radius:14px;padding:8px 0;box-shadow:0 22px 50px -12px rgba(0,0,0,.75);opacity:0;visibility:hidden;transition:all .25s var(--ease);z-index:220;display:flex;flex-direction:column}
.nav-dropdown-menu::before{content:"";position:absolute;top:-6px;left:50%;transform:translateX(-50%) rotate(45deg);width:12px;height:12px;background:rgba(var(--navy-rgb),.97);border-left:1px solid rgba(var(--orange-rgb),.32);border-top:1px solid rgba(var(--orange-rgb),.32)}
.nav-dropdown:hover .nav-dropdown-menu,.nav-dropdown:focus-within .nav-dropdown-menu{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.nav-dropdown-item{padding:9px 18px!important;color:rgba(255,255,255,.9)!important;font-weight:600!important;font-size:.88rem!important;display:flex!important;align-items:center!important;white-space:nowrap;transition:all .2s ease!important;border-left:3px solid transparent}
.nav-dropdown-item::after{display:none!important}
.nav-dropdown-item:hover{background:rgba(var(--orange-rgb),.16)!important;color:var(--orange-2,#FFA5AB)!important;border-left-color:var(--orange);padding-left:22px!important}
.nav-cta{display:flex;gap:.6rem;align-items:center}
.hamburger{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:8px}
.hamburger span{width:24px;height:2px;background:#fff;border-radius:2px;transition:.3s}

/* Hero */
.hero{position:relative;min-height:100svh;display:flex;flex-direction:column;justify-content:center;color:#fff;overflow:hidden;isolation:isolate}
.hero-media{position:absolute;inset:0;z-index:-2;overflow:hidden;background:var(--navy)}
.hero-clip{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.06);transition:opacity 1.6s var(--ease),transform 7s linear;filter:saturate(1.14) contrast(1.09) brightness(1.04)}
.hero-clip.active{opacity:1;transform:scale(1.14)}
.hero-progress{position:absolute;left:0;bottom:0;height:3px;width:0;background:linear-gradient(90deg,var(--orange),var(--orange-2));z-index:2;box-shadow:0 0 12px rgba(var(--orange-rgb),.8)}
.hero-grad{position:absolute;inset:0;background:linear-gradient(180deg,rgba(var(--hero-overlay-top-rgb,var(--navy-rgb)),calc(var(--hero-overlay-opacity, 0.75) * 0.96)) 0%,rgba(var(--hero-overlay-top-rgb,var(--navy-rgb)),calc(var(--hero-overlay-opacity, 0.75) * 0.46)) 35%,rgba(var(--hero-overlay-bottom-rgb,var(--navy-rgb)),calc(var(--hero-overlay-opacity, 0.75) * 0.73)) 70%,rgba(var(--hero-overlay-bottom-rgb,var(--navy-rgb)),calc(var(--hero-overlay-opacity, 0.75) * 1.25)) 100%),linear-gradient(110deg,rgba(var(--hero-overlay-top-rgb,var(--navy-rgb)),.6),transparent 60%)}
.hero-noise{position:absolute;inset:0;opacity:.5;background:linear-gradient(120deg,transparent,rgba(var(--orange-rgb),.12) 80%)}
.hero-content{position:relative;max-width:880px;padding-top:80px}
.hero-eyebrow{display:inline-flex;align-items:center;gap:.5rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;font-size:.76rem;color:rgba(255,255,255,.94);margin-bottom:1.2rem;background:rgba(var(--orange-rgb),.14);border:1px solid rgba(var(--orange-rgb),.4);border-radius:5px;padding:.45rem .95rem;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.hero-title{font-family:var(--serif);font-weight:600;font-size:clamp(2.8rem,8vw,6.2rem);line-height:.98;letter-spacing:-.02em}
.hero-title .line{display:block;overflow:hidden}
.hero-title .line>span{display:block;will-change:transform}
.hero-title .line.line-3{font-size:clamp(1.4rem,2.8vw,2.2rem);font-weight:500;letter-spacing:-.01em;line-height:1.25;margin-top:.4rem;color:rgba(255,255,255,.94)}
.hero-title em{color:var(--heading-accent,var(--orange-2));font-style:italic}
.hero-sub{max-width:580px;margin:1.6rem 0 2rem;font-size:clamp(1rem,1.5vw,1.18rem);color:var(--text-dark,rgba(255,255,255,.9));text-align:justify;text-justify:inter-word;word-wrap:break-word;overflow-wrap:break-word;hyphens:auto}
.hero-actions{display:flex;gap:1rem;flex-wrap:wrap}
.hero-stats{position:absolute;bottom:38px;right:24px;display:flex;align-items:center;gap:1.4rem;padding:1.1rem 1.6rem;border-radius:18px}
.hero-stats strong{font-family:var(--serif);font-size:1.9rem;color:var(--orange-2);display:block;line-height:1}
.hero-stats span{font-size:.72rem;color:rgba(255,255,255,.8)}
.hero-stats .div{width:1px;height:34px;background:rgba(255,255,255,.2)}
.scroll-cue{position:absolute;bottom:30px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:.5rem;font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.75)}
.scroll-cue span{width:24px;height:38px;border:2px solid rgba(255,255,255,.5);border-radius:14px;position:relative}
.scroll-cue span::before{content:"";position:absolute;top:7px;left:50%;transform:translateX(-50%);width:4px;height:8px;background:#fff;border-radius:2px;animation:wheel 1.6s infinite}
@keyframes wheel{0%{opacity:0;top:7px}40%{opacity:1}80%{opacity:0;top:20px}}

/* Marquee Ribbon - Continuous Infinite Scroll Left-to-Right Across Screen */
.marquee{background:var(--navy);color:#fff;overflow:hidden;padding:1.15rem 0;border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08);position:relative;width:100%;display:flex;align-items:center;user-select:none}
.marquee-track{display:flex;width:max-content;white-space:nowrap;font-family:var(--serif);font-size:1.35rem;font-weight:600;text-transform:uppercase;letter-spacing:0.14em;align-items:center;animation:marqueeScroll 34s linear infinite;will-change:transform}
.marquee:hover .marquee-track{animation-play-state:paused}
.marquee-group{display:flex;align-items:center;gap:2rem;padding-right:2rem;flex-shrink:0}
.marquee-group span{display:inline-flex;align-items:center;gap:1.8rem;color:var(--text-dark,rgba(255,255,255,.94))}
.marquee-group i{color:var(--orange);font-style:normal;font-size:1.05rem;opacity:.95}
@keyframes marqueeScroll{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}

/* Sections */
.section{padding:110px 0;position:relative}
.section-dark{background:var(--navy);color:var(--text-dark,#fff)}
.section-cream{background:#fff8f0}
.section-head{text-align:center;max-width:680px;margin:0 auto 60px}
.eyebrow{display:inline-block;font-weight:700;letter-spacing:.18em;text-transform:uppercase;font-size:.74rem;color:var(--orange);margin-bottom:.7rem}
.eyebrow.light{color:var(--heading-accent,var(--orange-2))}
.section-head h2,h2{font-family:var(--serif);font-weight:600;font-size:clamp(2rem,4.2vw,3.2rem);line-height:1.08;letter-spacing:-.01em;color:var(--navy)}
.section-dark h2{color:var(--text-dark,#fff)}
h2 em{color:var(--heading-accent,var(--orange));font-style:italic}
.section-head p,
.section-subtitle,
.sec-subtitle,
.section-sub{color:var(--muted);margin-top:.8rem;font-size:1.05rem;text-align:center!important;margin-left:auto;margin-right:auto}
.section-dark .section-head p{color:var(--text-dark,rgba(255,255,255,.78));opacity:.85}

/* Intro & 4 Pillars */
.intro-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:60px;align-items:center}
.intro-text h2{margin:.3rem 0 1rem}
.intro-text>p{color:var(--muted);font-size:1.08rem;max-width:540px}
.intro-points{display:grid;grid-template-columns:repeat(2, 1fr);gap:1.25rem;margin-top:2rem}
.intro-points .ip{display:flex!important;flex-direction:column;background:#ffffff;border:1px solid rgba(2,1,10,.08);border-radius:14px;padding:16px 18px;box-shadow:0 4px 16px rgba(0,0,0,.03);opacity:1!important;visibility:visible!important;transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}
.intro-points .ip:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,.07);border-color:rgba(243,156,18,.35)}
.intro-points .ip span{font-family:var(--serif);font-size:1.35rem;color:var(--orange);font-weight:700;line-height:1;display:inline-block;margin-bottom:6px}
.intro-points .ip h4, .intro-points .ip h3.ip-title{font-size:1.02rem;font-weight:700;margin:0 0 6px;color:var(--navy);line-height:1.3}
.intro-points .ip p{font-size:.9rem;color:var(--muted);line-height:1.5;margin:0}

/* 2:3 Aspect Ratio Auto-Fit Image Box & Centered Badge */
.intro-media-wrap {
  width: 100%;
  max-width: 440px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.intro-media {
  position: relative;
  width: 100%;
  aspect-ratio: 2 / 3 !important;
  border-radius: var(--radius, 22px);
  border: 1.5px solid rgba(2, 1, 10, 0.08);
  box-shadow: 0 20px 48px -12px rgba(2, 1, 10, 0.14);
  padding: 0 !important;
  background: #02010a;
  overflow: hidden;
  transition: transform 0.35s ease, box-shadow 0.35s ease;
  display: block;
}

.intro-media:hover {
  transform: translateY(-4px);
  box-shadow: 0 26px 56px -12px rgba(2, 1, 10, 0.2);
}

.intro-media .parallax-wrap {
  width: 100%;
  height: 100%;
  display: block;
  overflow: hidden;
}

.intro-media .parallax-wrap img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center;
  max-height: none !important;
  scale: 1 !important;
  display: block;
  margin: 0;
  border-radius: inherit;
  transition: transform 0.4s ease;
}

.intro-media:hover .parallax-wrap img {
  transform: scale(1.04);
}

.intro-badge-container {
  width: 100%;
  display: flex;
  justify-content: center;
  margin-top: 18px;
}

.intro-badge {
  position: static !important;
  left: auto !important;
  bottom: auto !important;
  background: var(--navy, #02010a) !important;
  color: #ffffff !important;
  font-weight: 700;
  font-size: 0.9rem;
  padding: 0.75rem 1.4rem;
  border-radius: 999px;
  border: 1.5px solid rgba(243, 156, 18, 0.5) !important;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.18);
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
  letter-spacing: 0.02em;
  text-align: center;
  margin: 0 auto;
  transition: all 0.3s ease;
}

.intro-badge:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.28);
  border-color: rgba(243, 156, 18, 0.8) !important;
}

@media (max-width: 768px) {
  .intro-media-wrap {
    max-width: 380px;
  }
  .intro-badge {
    font-size: 0.82rem;
    padding: 0.6rem 1.1rem;
  }
}
@media (max-width: 540px) {
  .intro-points {
    grid-template-columns: 1fr;
    gap: 0.9rem;
  }
}

/* Experiences */
.exp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;perspective:1400px}
.exp-card{position:relative;background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;transform-style:preserve-3d;transition:transform .25s var(--ease),box-shadow .35s;will-change:transform}
.exp-card:hover{box-shadow:0 40px 80px -30px rgba(0,0,0,.6)}
.exp-card.featured{border:1.5px solid var(--orange)}
.exp-flag{position:absolute;top:14px;right:14px;z-index:3;background:var(--orange);color:#fff;font-size:.72rem;font-weight:800;padding:.35rem .8rem;border-radius:999px;transform:translateZ(40px)}
.exp-img{height:230px;background:var(--img) center/cover no-repeat;transition:transform .6s var(--ease)}
.exp-card:hover .exp-img{transform:scale(1.04)}
.exp-slides{position:relative;overflow:hidden}
.exp-slides .es{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1.1s var(--ease);filter:saturate(1.08) contrast(1.04)}
.exp-slides .es.active{opacity:1}
.es-dots{position:absolute;left:50%;bottom:10px;transform:translateX(-50%);display:flex;gap:6px;z-index:2}
.es-dots i{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.5);transition:.3s}
.es-dots i.on{background:var(--orange);width:18px;border-radius:4px}
.exp-body{padding:24px;transform:translateZ(28px)}
.exp-meta{display:flex;gap:.5rem;margin-bottom:.7rem}
.exp-meta .dur{display:inline-flex;align-items:center;gap:.35rem;background:rgba(var(--orange-rgb),.18);color:var(--orange-2);font-weight:700;font-size:.76rem;padding:.3rem .7rem;border-radius:999px}
.exp-meta .dur::before{content:"✓";width:14px;height:14px;display:inline-flex;align-items:center;justify-content:center;background:var(--orange);color:#fff;border-radius:50%;font-size:.6rem;font-weight:900}
.exp-meta .cat{background:rgba(31,160,85,.18);color:var(--green-2);font-weight:700;font-size:.76rem;padding:.3rem .7rem;border-radius:999px}
.exp-meta .cat::before{content:"★ "}
.exp-body h3{font-family:var(--serif);font-size:1.45rem;color:#fff;font-weight:600}
.exp-body>p{color:rgba(255,255,255,.66);font-size:.9rem;margin:.4rem 0 1.1rem}
.exp-foot{display:flex;align-items:center;justify-content:space-between;gap:.6rem;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:1rem}
.exp-foot .price{font-size:.8rem;color:rgba(255,255,255,.6)}
.exp-foot .price strong{display:block;font-family:var(--serif);color:var(--orange-2);font-size:1.3rem}
.exp-btns{display:flex;gap:.5rem}
.exp-custom{margin-top:40px;border-radius:var(--radius);padding:38px;display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;background:linear-gradient(120deg,rgba(var(--orange-rgb),.18),rgba(var(--navy-rgb),.4));border:1px solid var(--line)}
.exp-custom h3{font-family:var(--serif);font-size:1.6rem;color:#fff}
.exp-custom p{color:rgba(255,255,255,.75);margin-top:.3rem;max-width:520px}

/* Coverflow (Destinations Infinite Loop Slider) */
.coverflow{margin-top:38px;overflow:hidden;padding:10px 0 20px;position:relative;width:100%}
.coverflow-stage{position:relative;width:100%;padding:20px 0 32px;overflow:hidden}
.cf-track{display:flex;gap:24px;padding:0;width:max-content;transition:transform .65s cubic-bezier(0.25, 1, 0.5, 1);will-change:transform}
.cf-item{position:relative;flex:0 0 clamp(280px, calc((100vw - 110px) / 3.8), 380px);height:320px;border-radius:var(--radius);overflow:hidden;box-shadow:0 12px 30px -8px rgba(0,0,0,.45);transition:transform .5s cubic-bezier(0.25, 1, 0.5, 1),opacity .5s ease,box-shadow .5s ease,filter .5s ease;opacity:.84;filter:saturate(1.05) contrast(1.04);cursor:pointer;user-select:none}
.cf-item img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s ease}
.cf-item:hover img{transform:scale(1.04)}
.cf-item figcaption{position:absolute;left:0;right:0;bottom:0;padding:50px 20px 20px;background:linear-gradient(180deg,transparent 0%,rgba(32,6,29,.4) 28%,rgba(32,6,29,.88) 65%,rgba(32,6,29,.98) 100%);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;text-align:center;z-index:2;pointer-events:none}
.cf-dest-title{font-family:var(--serif);font-size:1.48rem;font-weight:700;color:#fff;line-height:1.18;text-align:center;margin:0;text-shadow:0 2px 10px rgba(0,0,0,.65)}
.cf-dest-desc{font-size:.84rem;color:rgba(255,255,255,.9);font-family:var(--font);margin:5px auto 0;max-width:320px;text-align:center;line-height:1.35;opacity:.95;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cf-dest-pill{display:inline-flex;align-items:center;justify-content:center;gap:6px;margin-top:10px;font-size:.78rem;font-weight:700;letter-spacing:.02em;background:linear-gradient(135deg,var(--orange),var(--orange-2));color:#fff!important;padding:5px 16px;border-radius:999px;box-shadow:0 4px 14px rgba(0,0,0,.35);text-align:center;text-decoration:none;transition:transform .25s var(--ease),box-shadow .25s;pointer-events:auto}
.cf-dest-pill i{font-style:normal;font-size:.9rem;transition:transform .25s ease}
.cf-dest-pill:hover{transform:scale(1.05);box-shadow:0 6px 18px rgba(224,90,43,.45)}
.cf-dest-pill:hover i{transform:translateX(4px)}
.cf-item.active{opacity:1;transform:scale(1.05);box-shadow:0 24px 60px -15px rgba(224,90,43,.4),0 16px 36px -8px rgba(0,0,0,.5);z-index:6}
.cf-item:not(.active):hover{opacity:1;transform:translateY(-3px)}
.cf-side-btn{position:absolute;top:50%;transform:translateY(-50%);z-index:20;width:52px;height:52px;border-radius:50%;background:rgba(32,6,29,.8);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1.5px solid rgba(255,255,255,.28);color:#fff;font-size:2rem;font-weight:300;line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 12px 30px rgba(0,0,0,.45);transition:all .3s var(--ease);user-select:none;padding-bottom:4px}
.cf-side-btn:hover{background:var(--navy);color:var(--orange-2);border-color:var(--orange-2);transform:translateY(-50%) scale(1.1);box-shadow:0 16px 36px rgba(32,6,29,.6)}
.cf-side-btn:active{transform:translateY(-50%) scale(.96)}
.cf-side-btn.cf-prev{left:18px}
.cf-side-btn.cf-next{right:18px}
.cf-side-overlay{position:absolute;top:0;bottom:0;width:80px;pointer-events:none;z-index:8;opacity:.5}
.cf-side-overlay.left{left:0;background:linear-gradient(90deg,var(--bg,#fff8f0) 0%,transparent 100%)}
.cf-side-overlay.right{right:0;background:linear-gradient(270deg,var(--bg,#fff8f0) 0%,transparent 100%)}
.cf-play{display:flex;align-items:center;gap:.5rem;justify-content:center;margin-top:16px;font-size:.82rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);text-align:center}

/* Parallax band */
.band{position:relative;min-height:60vh;display:flex;align-items:center;justify-content:center;overflow:hidden}
.parallax-band{background-position:center center;background-size:cover;background-attachment:fixed;background-repeat:no-repeat;background-color:var(--navy)}
.band-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(var(--navy-rgb),.75),rgba(var(--navy-rgb),.6))}
.band-quote{position:relative;text-align:center;color:#fff;max-width:840px;padding:40px 20px;z-index:2}
.band-quote h2{color:#fff;font-style:italic;font-weight:500;font-size:clamp(1.8rem,3.6vw,2.7rem);line-height:1.3}
.band-quote span{display:block;margin-top:1.2rem;color:var(--orange-2);font-weight:600;letter-spacing:.04em;font-size:1.05rem}

/* Films & Road Moments (Pure Clean Video Playing Directly) */
.film-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.film-grid .film{position:relative;border-radius:18px;overflow:hidden;background:#000;aspect-ratio:9/16;box-shadow:var(--shadow);transition:transform .35s var(--ease),box-shadow .35s var(--ease);isolation:isolate}
.film-grid .film:hover{transform:translateY(-4px) scale(1.01);box-shadow:0 22px 50px -10px rgba(0,0,0,.7)}
.film-grid .film.big{grid-row:span 2;grid-column:span 2;aspect-ratio:auto}
.film-grid video{width:100%;height:100%;object-fit:cover;display:block;cursor:pointer}
.film .vmute{position:absolute;top:12px;right:12px;z-index:4;pointer-events:auto}
.insta-reel-frame{width:100%;height:100%;min-height:100%;border:none;display:block;background:#000;border-radius:18px}
.yt-reel-frame{width:100%;height:100%;min-height:100%;border:none;display:block;border-radius:18px}
.reel-card-overlay{position:absolute;left:0;right:0;bottom:0;padding:14px 14px 12px;background:linear-gradient(180deg,transparent 0%,rgba(10,4,16,.6) 35%,rgba(8,2,12,.95) 100%);z-index:3;color:#fff;display:flex;align-items:center;justify-content:space-between;gap:8px;pointer-events:auto}
.reel-card-overlay .film-title-text{font-family:var(--serif);font-size:.95rem;line-height:1.2;color:#fff;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:140px}
.reel-direct-link{font-size:.72rem;font-weight:700;color:#fff!important;background:linear-gradient(135deg,#f09433,#dc2743,#bc1888);padding:5px 12px;border-radius:999px;text-decoration:none;white-space:nowrap;box-shadow:0 2px 8px rgba(0,0,0,.4);transition:transform .2s,opacity .2s}
.reel-direct-link:hover{transform:scale(1.06);opacity:.95}
.reddit-card{transition:transform .25s var(--ease),border-color .25s var(--ease)}
.reddit-card:hover{transform:translateY(-3px);border-color:rgba(255,69,0,.4)!important}
.film.placeholder-film{background:#140516;border:1.5px dashed rgba(218,98,125,.4);display:flex;align-items:center;justify-content:center;text-decoration:none;transition:transform .35s var(--ease),border-color .35s,box-shadow .35s}
.film.placeholder-film:hover{transform:translateY(-4px) scale(1.01);border-color:var(--orange-2);box-shadow:0 16px 36px -10px rgba(218,98,125,.35)}
.film.placeholder-film img{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}

@media(max-width:960px){
  .film-grid{grid-template-columns:repeat(2,1fr);gap:14px}
  .film-grid .film.big{grid-row:span 1;grid-column:span 2}
}
@media(max-width:540px){
  .film-grid{grid-template-columns:repeat(2,1fr);gap:10px}
  .film-grid .film.big{grid-column:span 2}
}

/* Masonry */
.masonry{columns:4;column-gap:16px}
.masonry img{width:100%;border-radius:14px;margin-bottom:16px;cursor:pointer;break-inside:avoid;box-shadow:0 14px 30px -22px rgba(0,0,0,.5);transition:transform .4s var(--ease),filter .4s}
.masonry img:hover{transform:scale(1.03);filter:brightness(1.06)}

/* Real Guest Testimonials (Text Cards) */
.testimonials-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;align-items:stretch}
.testimonial-card{position:relative;background:#fff;border:1.5px solid var(--line-d,#F3CBD6);border-radius:20px;padding:32px 28px 26px;display:flex;flex-direction:column;justify-content:space-between;box-shadow:0 16px 40px -20px rgba(32,6,29,.08);transition:transform .35s var(--ease),box-shadow .35s,border-color .35s}
.testimonial-card:hover{transform:translateY(-6px);box-shadow:0 24px 50px -18px rgba(32,6,29,.16);border-color:rgba(var(--orange-rgb,218,98,125),.45)}
.testimonial-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;gap:12px;flex-wrap:wrap}
.testimonial-stars{color:#ffaa00;font-size:1.15rem;letter-spacing:2px;line-height:1}
.testimonial-source-badge{display:inline-flex;align-items:center;gap:6px;background:rgba(66,133,244,.08);border:1px solid rgba(66,133,244,.2);color:#1a73e8;padding:4px 11px;border-radius:999px;font-size:.74rem;font-weight:700;letter-spacing:.02em}
.testimonial-body{position:relative;margin-bottom:24px;flex-grow:1}
.testimonial-quote-icon{font-family:var(--serif,Georgia,serif);font-size:3.2rem;line-height:1;color:var(--orange-2,#FFA5AB);opacity:.55;display:block;margin-bottom:-16px;user-select:none}
.testimonial-quote{font-size:1.02rem;line-height:1.68;color:var(--navy,#20061D);font-weight:500;font-style:normal;margin:0;position:relative;z-index:1}
.testimonial-author-wrap{display:flex;align-items:center;gap:14px;padding-top:18px;border-top:1px solid rgba(32,6,29,.08)}
.testimonial-avatar{width:48px;height:48px;border-radius:50%;background:linear-gradient(135deg,var(--navy,#20061D),var(--berry,#A53860));color:#fff;font-weight:800;font-size:.95rem;letter-spacing:.05em;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 4px 12px -2px rgba(32,6,29,.25)}
.testimonial-author-meta{display:flex;flex-direction:column;min-width:0}
.testimonial-author-meta strong{font-size:1rem;font-weight:700;color:var(--navy,#20061D);line-height:1.3}
.testimonial-author-meta .trip-location{font-size:.82rem;color:var(--muted,#7A5B6F);margin-top:2px;line-height:1.3}
.testimonial-author-meta .verified-badge{display:inline-flex;align-items:center;gap:4px;font-size:.72rem;color:var(--green,#1fa055);font-weight:700;margin-top:3px}
.btn-explore-google{background:#fff;color:var(--navy,#20061D);border:1.5px solid var(--line-d,#F3CBD6);box-shadow:0 8px 24px -10px rgba(32,6,29,.12)}
.btn-explore-google:hover{background:var(--navy,#20061D);color:#fff;border-color:var(--navy,#20061D);transform:translateY(-3px);box-shadow:0 16px 32px -10px rgba(32,6,29,.35)}

/* Video reviews legacy support */
.vreviews{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.vreview{position:relative;border-radius:18px;overflow:hidden;background:#000;aspect-ratio:9/16;box-shadow:0 22px 50px -26px rgba(0,0,0,.55)}
.vreview video{width:100%;height:100%;object-fit:cover;display:block}
.vreview figcaption{position:absolute;left:0;right:0;bottom:0;padding:14px;display:flex;flex-direction:column;gap:1px;background:linear-gradient(transparent,rgba(8,16,26,.85));color:#fff}
.vreview .stars{color:var(--orange-2);font-size:.82rem;letter-spacing:.1em}
.vreview b{font-size:1rem;font-weight:700}
.vreview small{font-size:.76rem;color:rgba(255,255,255,.78)}
.vmute{position:absolute;top:10px;right:10px;z-index:3;width:34px;height:34px;border-radius:50%;border:none;background:rgba(8,16,26,.55);color:#fff;font-size:.9rem;cursor:pointer;backdrop-filter:blur(6px);transition:background .2s,transform .2s}
.vmute:hover{background:var(--orange);transform:scale(1.08)}
.vmute.on{background:var(--orange)}

/* Contact */
.contact-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:54px;align-items:start}
.contact-info h2{color:#fff}
.contact-info>p{color:rgba(255,255,255,.78);margin-top:.7rem}
.contact-list{list-style:none;margin-top:1.8rem;display:flex;flex-direction:column;gap:.8rem}
.contact-list a{display:flex;align-items:center;gap:.8rem;background:rgba(255,255,255,.06);border:1px solid var(--line);padding:.9rem 1.1rem;border-radius:14px;font-weight:600;color:#fff;transition:.25s}
.contact-list a:hover{background:rgba(255,255,255,.12);transform:translateX(5px)}
.contact-list span{color:var(--orange-2);min-width:84px;font-size:.78rem;text-transform:uppercase;letter-spacing:.06em}
.contact-form-wrap{border-radius:var(--radius);padding:34px}
.contact-form-wrap h3{font-family:var(--serif);color:#fff;font-size:1.6rem;margin-bottom:1.1rem}

/* Forms - Unified High-Precision Alignment */
.enquiry-form { width: 100%; }
.enquiry-form .f-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px 18px;
  align-items: start;
  margin-bottom: 14px;
}
.enquiry-form .f-row.f-full {
  grid-template-columns: 1fr !important;
  grid-column: 1 / -1;
  width: 100%;
}
.enquiry-form .f-group {
  display: flex;
  flex-direction: column;
  width: 100%;
  position: relative;
}
.enquiry-form .f-group.f-full {
  width: 100%;
}
.enquiry-form .f-group label {
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-end !important;
  justify-content: space-between !important;
  font-size: 0.81rem;
  font-weight: 700;
  color: var(--navy, #20061D);
  height: 36px;
  margin-bottom: 6px;
  line-height: 1.25;
}
.contact-form-wrap.glass .enquiry-form .f-group label {
  color: #ffffff;
}
.f-lbl-text {
  font-weight: 700;
  color: inherit;
}
.f-opt-badge {
  font-size: 0.72rem;
  font-weight: 600;
  color: #887d75;
  background: rgba(0, 0, 0, 0.05);
  padding: 1px 7px;
  border-radius: 4px;
}
.contact-form-wrap.glass .f-opt-badge {
  color: rgba(255, 255, 255, 0.75);
  background: rgba(255, 255, 255, 0.12);
}
.f-req-star {
  color: #e63946;
  font-weight: 800;
  font-size: 1rem;
}
.enquiry-form input,
.enquiry-form select {
  font-family: var(--font, sans-serif);
  font-size: 0.92rem;
  font-weight: 500;
  color: var(--ink, #20061D);
  border: 1.5px solid var(--line-d, #dfd8cf);
  border-radius: 10px;
  height: 48px;
  padding: 0 14px;
  background: #ffffff;
  width: 100%;
  box-sizing: border-box;
  transition: border-color 0.2s, box-shadow 0.2s;
}
.enquiry-form textarea {
  font-family: var(--font, sans-serif);
  font-size: 0.92rem;
  font-weight: 500;
  color: var(--ink, #20061D);
  border: 1.5px solid var(--line-d, #dfd8cf);
  border-radius: 10px;
  padding: 12px 14px;
  background: #ffffff;
  width: 100%;
  min-height: 95px;
  box-sizing: border-box;
  resize: vertical;
  transition: border-color 0.2s, box-shadow 0.2s;
}
.enquiry-form input:focus,
.enquiry-form textarea:focus,
.enquiry-form select:focus {
  outline: none;
  border-color: var(--orange, #da627d);
  box-shadow: 0 0 0 3px rgba(218, 98, 125, 0.22);
  background: #ffffff;
}
.wa-alt {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  margin-top: 10px;
  font-weight: 700;
  color: #25d366;
  font-size: 0.9rem;
  text-decoration: none;
}
@media (max-width: 680px) {
  .enquiry-form .f-row {
    grid-template-columns: 1fr;
    gap: 12px;
    margin-bottom: 12px;
  }
}

/* Footer */
.footer{background:linear-gradient(180deg,var(--navy),#120210);border-top:1px solid rgba(255,255,255,.1);color:#fff;padding:64px 0 34px}
.footer-inner{display:flex;flex-direction:column}
.footer-grid{display:grid;grid-template-columns:1.35fr 0.9fr 1.05fr 1fr;gap:40px;margin-bottom:48px;text-align:left}
.footer-col h4, .footer-col h3.footer-heading{font-family:var(--serif);font-size:1.15rem;font-weight:700;color:#fff;margin-bottom:18px;position:relative;padding-bottom:10px}
.footer-col h4::after, .footer-col h3.footer-heading::after{content:"";position:absolute;left:0;bottom:0;width:34px;height:2px;background:var(--orange)}
.footer-links{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px}
.footer-links a{color:rgba(255,255,255,.78);font-size:.9rem;font-weight:500;transition:all .2s ease;display:inline-flex;align-items:center;gap:6px}
.footer-links a:hover{color:var(--orange-2,#FFA5AB);transform:translateX(4px)}
.footer-contact-info{display:flex;flex-direction:column;gap:10px;margin-top:16px;font-size:.88rem;color:rgba(255,255,255,.8)}
.footer-contact-info span{display:flex;align-items:flex-start;gap:8px}
.footer-contact-info a{color:rgba(255,255,255,.9);font-weight:600;transition:color .2s}
.footer-contact-info a:hover{color:var(--orange-2)}
.footer-bottom-bar{border-top:1px solid rgba(255,255,255,.08);padding-top:24px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px;font-size:.84rem;color:rgba(255,255,255,.62)}
.footer-bottom-links{display:flex;gap:16px;flex-wrap:wrap}
.footer-bottom-links a{color:rgba(255,255,255,.75);transition:color .2s}
.footer-bottom-links a:hover{color:var(--orange-2)}
.footer-tag{font-family:var(--serif);font-style:italic;color:var(--orange-2);font-size:1.05rem;margin:12px 0}
@media(max-width:1024px){
  .footer-grid{grid-template-columns:1fr 1fr;gap:32px}
}
@media(max-width:760px){
  .footer-grid{grid-template-columns:1fr;gap:28px}
  .footer-bottom-bar{flex-direction:column;text-align:center;justify-content:center}
}

/* Modal */
.modal{position:fixed;inset:0;z-index:300;display:flex;align-items:center;justify-content:center;padding:20px}
.modal[hidden],[hidden]{display:none!important}
.modal-backdrop{position:absolute;inset:0;background:rgba(8,16,26,.7);backdrop-filter:blur(6px);animation:fade .3s}
.modal-card{position:relative;width:100%;max-width:560px;border-radius:22px;padding:32px;max-height:92vh;overflow:auto;background:rgba(255,255,255,.96);animation:pop .4s var(--ease)}
@keyframes fade{from{opacity:0}}
@keyframes pop{from{opacity:0;transform:translateY(24px) scale(.96)}}
.modal-close{position:absolute;top:14px;right:16px;background:var(--cream);border:none;width:34px;height:34px;border-radius:50%;cursor:pointer;font-size:1rem;color:var(--muted)}
.modal-head{text-align:center;margin-bottom:1.2rem}
.modal-head span{font-size:2.2rem}
.modal-head h3{font-family:var(--serif);color:var(--navy);font-size:1.6rem;margin:.2rem 0}
.modal-head p{color:var(--muted);font-size:.92rem}

/* Lightbox */
.lightbox{position:fixed;inset:0;z-index:320;background:rgba(8,14,22,.94);display:flex;align-items:center;justify-content:center;padding:30px}
.lightbox img{max-width:90vw;max-height:88vh;border-radius:12px;box-shadow:0 30px 80px rgba(0,0,0,.7)}
.lb-close{position:absolute;top:18px;right:22px;background:none;border:none;color:#fff;font-size:2rem;cursor:pointer}
.lb-nav{position:absolute;top:50%;transform:translateY(-50%);background:rgba(255,255,255,.12);border:none;color:#fff;font-size:2.4rem;width:54px;height:54px;border-radius:50%;cursor:pointer}
.lb-nav:hover{background:rgba(255,255,255,.26)}
.lb-prev{left:18px}.lb-next{right:18px}

/* Action bar + FAB */
.action-bar{display:none !important;}
.mobile-fixed-footer{display:none;}
.fab-wa{position:fixed;right:18px;bottom:18px;z-index:190;width:56px;height:56px;border-radius:50%;background:#25d366;color:#fff;display:flex;align-items:center;justify-content:center;font-size:1.6rem;box-shadow:0 14px 30px -10px rgba(37,211,102,.8);animation:floaty 2.6s ease-in-out infinite}

/* Reveal defaults (visible if JS/GSAP fails) */
.reveal-up{opacity:1}

/* ===== Responsive ===== */
@media(max-width:1024px){
  .exp-grid{grid-template-columns:1fr 1fr}
  .film-grid{grid-template-columns:repeat(3,1fr)}
  .testimonials-grid{grid-template-columns:repeat(2,1fr)}
  .testimonials-grid > .testimonial-card:last-child{grid-column:span 2}
  .vreviews{grid-template-columns:repeat(2,1fr)}
  .masonry{columns:3}
  .cf-item{flex:0 0 clamp(270px, calc((100vw - 70px) / 2.7), 350px);height:280px}.cf-track{gap:18px;padding:0}
}
@media(max-width:760px){
  .nav-links{display:none!important}
  .hamburger{display:flex}
  .nav-cta .btn-glass,.nav-cta .btn-primary{display:none}
  .hamburger.active span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .hamburger.active span:nth-child(2){opacity:0}
  .hamburger.active span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  .section{padding:72px 0}
  .intro-grid,.contact-grid{grid-template-columns:1fr;gap:36px}
  .intro-points{gap:1rem}
  .exp-grid{grid-template-columns:1fr}
  .testimonials-grid{grid-template-columns:1fr;gap:18px}
  .testimonials-grid > .testimonial-card:last-child{grid-column:auto}
  .testimonial-card{padding:24px 20px 20px}
  .vreviews{grid-template-columns:repeat(2,1fr);gap:12px}
  .film-grid{grid-template-columns:1fr 1fr}
  .film-grid .film.big{grid-row:auto;grid-column:span 2;aspect-ratio:16/10}
  .masonry{columns:2}
  .hero-stats{display:none}
  .parallax-band{background-attachment:scroll}
  .f-row{grid-template-columns:1fr}
  .action-bar{display:none !important}
  .fab-wa{display:none !important}
  .mobile-fixed-footer{display:flex !important}
  .footer{padding-bottom:85px !important}
  .cursor-glow{display:none}
  .cf-item{flex:0 0 clamp(250px, 76vw, 320px);height:250px}.cf-track{gap:14px;padding:0}
  .cf-side-btn{width:42px;height:42px;font-size:1.6rem}
  .cf-side-btn.cf-prev{left:6px}
  .cf-side-btn.cf-next{right:6px}
  .cf-side-overlay{width:50px}
  .cf-dest-title{font-size:1.35rem}
  .cf-dest-desc{font-size:0.78rem;max-width:280px}
}
@media(prefers-reduced-motion:reduce){
  *{animation-duration:.001s!important;transition-duration:.1s!important}
}

/* ===== Multi-Page & SEO Architectural Styles ===== */
.breadcrumbs{display:flex;align-items:center;gap:8px;font-size:.86rem;color:var(--muted);margin-bottom:20px;flex-wrap:wrap}
.breadcrumbs a{color:var(--navy);font-weight:600;transition:color .2s}
.breadcrumbs a:hover{color:var(--orange)}
.breadcrumbs .sep{color:var(--muted);opacity:.6}
.breadcrumbs .cur{color:var(--muted);font-weight:500}

/* Page Hero */
.page-hero{padding:120px 0 50px;background:var(--navy);color:var(--text-dark,#fff);position:relative;overflow:hidden}
.page-hero::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at top right,rgba(var(--orange-rgb),.2),transparent 65%);pointer-events:none}
.page-hero .eyebrow{margin-bottom:.5rem}
.page-hero h1{font-family:var(--serif);font-size:clamp(2.2rem,4.5vw,3.4rem);line-height:1.12;margin-bottom:12px;color:#fff}
.page-hero h1 em{color:var(--heading-accent,var(--orange-2));font-style:italic}
.page-hero p{font-size:clamp(1.02rem,1.6vw,1.15rem);color:rgba(255,255,255,.92);max-width:820px;line-height:1.7;margin:0;text-align:left;text-justify:auto;word-spacing:normal}

/* Section Explore Link Buttons (Homepage) */
.section-footer-link{margin-top:42px;text-align:center;display:flex;justify-content:center}
.btn-explore{display:inline-flex;align-items:center;gap:10px;background:rgba(var(--navy-rgb),.05);color:var(--navy);border:1.5px solid var(--line-d);padding:.8rem 1.6rem;border-radius:999px;font-weight:700;font-size:.95rem;transition:all .3s var(--ease)}
.btn-explore:hover{background:var(--navy);color:#fff;border-color:var(--navy);transform:translateY(-2px);box-shadow:0 12px 24px -10px rgba(var(--navy-rgb),.5)}
.btn-explore i{transition:transform .3s var(--ease);font-style:normal;font-size:1.1rem}
.btn-explore:hover i{transform:translateX(5px)}
.btn-explore-dark{background:rgba(255,255,255,.08);color:#fff;border-color:rgba(255,255,255,.24)}
.btn-explore-dark:hover{background:linear-gradient(135deg,var(--btn-primary-1,var(--orange)),var(--btn-primary-2,var(--orange-2)));color:var(--btn-text,#fff);border-color:transparent;box-shadow:0 12px 24px -10px rgba(var(--orange-rgb),.6)}

/* Destinations Grid Page */
.dest-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:30px}
.dest-card{background:#fff;border-radius:var(--radius);overflow:hidden;border:1px solid var(--line-d);box-shadow:0 14px 34px -18px rgba(0,0,0,.15);transition:transform .35s var(--ease),box-shadow .35s var(--ease);display:flex;flex-direction:column}
.dest-card:hover{transform:translateY(-6px);box-shadow:0 24px 50px -20px rgba(0,0,0,.28)}
.dest-card-media{position:relative;height:240px;overflow:hidden;background:var(--navy)}
.dest-card-media img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.dest-card:hover .dest-card-media img{transform:scale(1.08)}
.dest-card-badge{position:absolute;top:14px;left:14px;background:rgba(var(--navy-rgb),.85);backdrop-filter:blur(6px);color:#fff;font-size:.72rem;font-weight:700;padding:.3rem .75rem;border-radius:999px;letter-spacing:.04em}
.dest-card-body{padding:22px;display:flex;flex-direction:column;flex:1}
.dest-card-body h3{font-family:var(--serif);font-size:1.4rem;color:var(--navy);margin-bottom:6px;font-weight:600}
.dest-subplaces-mini{font-size:.84rem;color:var(--muted);font-weight:600;margin-bottom:12px;line-height:1.4}
.dest-card-desc{font-size:.9rem;color:var(--ink);opacity:.85;line-height:1.55;margin-bottom:18px;flex:1}
.dest-card-foot{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line-d);padding-top:14px;margin-top:auto}
.dest-pkg-count{font-size:.82rem;font-weight:700;color:var(--orange)}

/* Destination Detail Page */
.dest-hero-carousel{position:relative;width:100%;aspect-ratio:16/9;max-height:480px;min-height:220px;height:auto;border-radius:24px;overflow:hidden;margin-bottom:34px;background:var(--navy);box-shadow:var(--shadow)}
.dest-slide{position:absolute;inset:0;opacity:0;transition:opacity 1.2s var(--ease),transform 7s linear;transform:scale(1.04)}
.dest-slide.active{opacity:1;transform:scale(1.1)}
.dest-slide img{width:100%;height:100%;object-fit:cover}
.dest-slide-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,2,12,0.2) 0%,rgba(10,2,12,0.45) 45%,rgba(10,2,12,0.92) 100%)}
.dest-slide-caption{position:absolute;left:clamp(28px,5vw,60px);right:auto;bottom:clamp(28px,4.5vw,46px);z-index:3;color:#fff;text-align:left;display:flex;flex-direction:column;align-items:flex-start;max-width:min(860px,calc(100% - 130px));pointer-events:none}
.dest-slide-caption > *{pointer-events:auto}
.dest-slide-caption .eyebrow{margin-bottom:8px;align-self:flex-start;text-align:left}
.dest-slide-caption h1{font-family:var(--serif);font-size:clamp(2.1rem,4.2vw,3.4rem);line-height:1.12;margin:0 0 8px 0;text-align:left;text-shadow:0 2px 14px rgba(0,0,0,0.65),0 1px 3px rgba(0,0,0,0.8);letter-spacing:-0.01em}
.dest-slide-caption p{margin:0;font-size:clamp(1rem,1.75vw,1.22rem);line-height:1.55;color:rgba(255,255,255,0.95);text-align:left;text-shadow:0 2px 10px rgba(0,0,0,0.7);max-width:720px}
.dest-carousel-nav{position:absolute;right:24px;bottom:24px;z-index:4;display:flex;gap:8px}
.dest-carousel-nav button{width:42px;height:42px;border-radius:50%;border:none;background:rgba(255,255,255,.2);color:#fff;backdrop-filter:blur(8px);cursor:pointer;font-size:1.2rem;display:flex;align-items:center;justify-content:center;transition:background .2s}
.dest-carousel-nav button:hover{background:var(--orange)}

/* Sub places bold strip */
.sub-places-strip{font-weight:700;font-size:1.02rem;letter-spacing:.02em;color:var(--navy);background:rgba(var(--orange-rgb),.09);border-left:4px solid var(--orange);padding:14px 20px;border-radius:10px;margin:24px 0 28px;line-height:1.6}
.sub-places-strip span{color:var(--orange);margin:0 4px}

/* Text Justified Content */
.text-justified{text-align:left;line-height:1.8;font-size:1.04rem;color:var(--ink);margin-bottom:32px}
.text-justified p{margin-bottom:18px}

/* Package Detail Page Layout (3 cols + 1 col) */
.package-layout{display:grid;grid-template-columns:2.9fr 1.1fr;gap:36px;align-items:start;margin-top:30px}
.package-main{background:#fff;border-radius:24px;padding:34px;border:1px solid var(--line-d);box-shadow:0 14px 40px -20px rgba(0,0,0,.08)}
.package-header{margin-bottom:24px}
.package-header h1{font-family:var(--serif);font-size:clamp(1.9rem,3.6vw,2.7rem);color:var(--navy);line-height:1.15;margin:.4rem 0 .8rem}
.pkg-meta-tags{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.pkg-tag{font-size:.78rem;font-weight:700;padding:.32rem .85rem;border-radius:999px;background:rgba(var(--orange-rgb),.12);color:var(--orange)}
.pkg-tag.cat{background:rgba(31,160,85,.14);color:var(--green-2)}
.pkg-tag.star{background:rgba(255,186,0,.15);color:#b37d00}

/* Top Carousel in Package */
.pkg-gallery-hero{position:relative;height:420px;border-radius:18px;overflow:hidden;margin-bottom:30px;background:var(--navy)}
.pkg-gallery-hero img{width:100%;height:100%;object-fit:cover}

/* Pricing Table (2 columns) */
.price-table-wrap{margin:28px 0 34px}
.price-table{width:100%;border-collapse:separate;border-spacing:0;border-radius:14px;overflow:hidden;border:1.5px solid var(--line-d);background:#fff;box-shadow:0 10px 26px -16px rgba(0,0,0,.1)}
.price-table th{background:var(--navy);color:#fff;padding:14px 20px;font-weight:700;text-align:left;font-size:.95rem;letter-spacing:.02em}
.price-table th:last-child{text-align:right}
.price-table td{padding:14px 20px;border-bottom:1px solid var(--line-d);font-size:.95rem;font-weight:600;color:var(--navy)}
.price-table td:last-child{text-align:right}
.price-table tr:last-child td{border-bottom:none}
.price-table tr:nth-child(even){background:rgba(var(--orange-rgb),.03)}
.price-table .price-val{font-weight:800;color:var(--orange);font-size:1.12rem;font-family:var(--serif)}
.price-table .cab-type{display:block;font-size:.78rem;color:var(--muted);font-weight:500;margin-top:2px}

/* Itinerary Timeline */
.itinerary-timeline{display:flex;flex-direction:column;gap:18px;margin:26px 0 36px}
.day-card{background:rgba(var(--navy-rgb),.02);border:1.5px solid var(--line-d);border-radius:16px;padding:22px 24px;transition:border-color .2s}
.day-card:hover{border-color:var(--orange)}
.day-head{display:flex;align-items:center;gap:14px;margin-bottom:12px;flex-wrap:wrap}
.day-badge{background:linear-gradient(135deg,var(--orange),var(--orange-2));color:#fff;font-weight:800;font-size:.82rem;padding:.35rem .9rem;border-radius:999px;letter-spacing:.04em}
.day-head h4{font-family:var(--serif);font-size:1.18rem;color:var(--navy);font-weight:600;margin:0}
.day-card p{font-size:.94rem;color:var(--ink);line-height:1.6;margin-bottom:12px}
.day-tags{display:flex;gap:10px;flex-wrap:wrap;font-size:.78rem;font-weight:700}
.day-stay{color:var(--navy);background:rgba(var(--navy-rgb),.08);padding:.3rem .75rem;border-radius:8px}
.day-meals{color:var(--green-2);background:rgba(31,160,85,.12);padding:.3rem .75rem;border-radius:8px}

/* Inclusions & Exclusions */
.inc-exc-wrap{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin:28px 0 34px}
.inc-card,.exc-card{background:#fff;border-radius:16px;padding:22px 24px;border:1.5px solid var(--line-d)}
.inc-card h4{color:var(--green);font-size:1.15rem;margin-bottom:14px;display:flex;align-items:center;gap:8px}
.exc-card h4{color:#e03e3e;font-size:1.15rem;margin-bottom:14px;display:flex;align-items:center;gap:8px}
.inc-list,.exc-list{list-style:none;display:flex;flex-direction:column;gap:10px}
.inc-list li{font-size:.9rem;color:var(--ink);display:flex;align-items:flex-start;gap:8px;line-height:1.45}
.inc-list li::before{content:"✓";font-weight:900;color:var(--green);min-width:18px}
.exc-list li{font-size:.9rem;color:var(--ink);display:flex;align-items:flex-start;gap:8px;line-height:1.45}
.exc-list li::before{content:"✕";font-weight:900;color:#e03e3e;min-width:18px}

/* Photo Gallery in Package & Destination */
.pkg-photo-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:24px 0 34px}
.pkg-photo-grid img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:12px;cursor:pointer;transition:transform .3s var(--ease),box-shadow .3s}
.pkg-photo-grid img:hover{transform:scale(1.04);box-shadow:0 12px 24px -10px rgba(0,0,0,.35)}

/* Package Sidebar */
.package-sidebar{position:sticky;top:90px;display:flex;flex-direction:column;gap:20px}
.side-card{background:#fff;border-radius:20px;padding:24px;border:1px solid var(--line-d);box-shadow:0 12px 30px -18px rgba(0,0,0,.1)}
.special-offer-card{background:linear-gradient(135deg,var(--navy),var(--navy-2));color:#fff;border-radius:20px;padding:24px;position:relative;overflow:hidden;box-shadow:0 18px 40px -16px rgba(var(--navy-rgb),.5)}
.special-offer-card::after{content:"";position:absolute;top:-40px;right:-40px;width:120px;height:120px;border-radius:50%;background:rgba(var(--orange-rgb),.28);filter:blur(20px)}
.offer-badge{display:inline-block;background:var(--orange);color:#fff;font-size:.7rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding:.3rem .75rem;border-radius:999px;margin-bottom:10px}
.special-offer-card h4{font-family:var(--serif);font-size:1.35rem;line-height:1.2;margin-bottom:8px;color:#fff}
.special-offer-card p{font-size:.84rem;color:rgba(255,255,255,.84);line-height:1.45;margin-bottom:14px}

.trip-points-list{list-style:none;display:flex;flex-direction:column;gap:12px;margin:14px 0}
.trip-points-list li{display:flex;align-items:flex-start;gap:10px;font-size:.88rem;color:var(--ink)}
.trip-points-list li i{color:var(--orange);font-weight:900;font-style:normal;font-size:1rem}
.trip-points-list li strong{color:var(--navy);font-weight:700;min-width:96px}

.sidebar-cta-btns{display:flex;flex-direction:column;gap:10px;margin-top:16px}
.social-share{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.social-share a,.social-share button{background:rgba(var(--navy-rgb),.05);border:1px solid var(--line-d);color:var(--navy);padding:.45rem .85rem;border-radius:999px;font-size:.78rem;font-weight:700;display:inline-flex;align-items:center;gap:5px;cursor:pointer;transition:.2s}
.social-share a:hover,.social-share button:hover{background:var(--navy);color:#fff}

.channel-widget{display:flex;flex-direction:column;gap:10px}
.channel-box{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:12px;border:1px solid var(--line-d);transition:background .2s,transform .2s}
.channel-box:hover{background:rgba(var(--orange-rgb),.05);transform:translateX(4px)}
.channel-icon{font-size:1.6rem}
.channel-info strong{display:block;font-size:.88rem;color:var(--navy)}
.channel-info small{color:var(--muted);font-size:.76rem}

/* Responsive adjustments */
@media(max-width:1024px){
  .dest-grid{grid-template-columns:1fr 1fr}
  .package-layout{grid-template-columns:1fr}
  .package-sidebar{position:static;margin-top:20px}
  .pkg-photo-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:760px){
  .dest-grid{grid-template-columns:1fr}
  .dest-hero-carousel{height:340px}
  .dest-slide-caption{left:20px;bottom:20px;max-width:calc(100% - 100px)}
  .inc-exc-grid{grid-template-columns:1fr}
  .pkg-photo-grid{grid-template-columns:repeat(2,1fr)}
  .package-main{padding:20px}
  .price-table th,.price-table td{padding:10px 12px;font-size:.84rem}
  .season-switch{flex-direction:column}
}

/* Non-Homepage Rich Dark Branded Navigation Bar */
.nav-inner-page{background:var(--navy,#20061D)!important;border-bottom:1px solid rgba(218,98,125,.28);box-shadow:0 12px 35px -15px rgba(0,0,0,.65);padding:10px 0}
.nav-inner-page .nav-links a{color:#fff!important;opacity:.92}
.nav-inner-page .nav-links a:hover{color:var(--orange-2,#FFA5AB)!important;opacity:1}
.nav-inner-page .brand-text{color:#fff!important}
.nav-inner-page .brand-text small{color:rgba(255,255,255,.72)!important}

/* Places Covered Ribbon */
.places-covered-wrap{background:linear-gradient(135deg,rgba(var(--navy-rgb),.04),rgba(var(--orange-rgb),.06));border:1.5px solid rgba(var(--orange-rgb),.25);border-radius:18px;padding:20px;margin:24px 0}
.places-covered-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px;flex-wrap:wrap}
.places-covered-head h4{font-family:var(--serif);font-size:1.18rem;color:var(--navy);display:flex;align-items:center;gap:8px}
.places-chips{display:flex;flex-wrap:wrap;gap:8px}
.place-chip{background:#fff;border:1px solid var(--line-d);color:var(--navy);padding:.4rem .85rem;border-radius:999px;font-size:.82rem;font-weight:700;display:inline-flex;align-items:center;gap:6px;box-shadow:0 4px 12px -6px rgba(0,0,0,.08)}
.place-chip i{color:var(--orange);font-style:normal}

/* Nearby Places Addons (Google Maps Sync) */
.nearby-addons-box{background:#fff;border:1.5px dashed rgba(var(--orange-rgb),.4);border-radius:18px;padding:22px;margin:24px 0}
.nearby-addons-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;flex-wrap:wrap;gap:10px}
.nearby-addons-head h4{font-family:var(--serif);font-size:1.15rem;color:var(--navy);display:flex;align-items:center;gap:8px}
.nearby-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}
.nearby-card{background:rgba(var(--navy-rgb),.02);border:1px solid var(--line-d);border-radius:14px;padding:12px 14px;display:flex;flex-direction:column;gap:5px;transition:all .25s ease}
.nearby-card:hover{background:rgba(var(--orange-rgb),.06);border-color:var(--orange);transform:translateY(-2px)}
.nearby-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.nearby-top strong{font-size:.88rem;color:var(--navy)}
.nearby-km{background:var(--navy);color:#fff;font-size:.72rem;font-weight:800;padding:.2rem .55rem;border-radius:999px;white-space:nowrap}
.nearby-card p{font-size:.78rem;color:var(--muted);line-height:1.4;margin:0}

/* Season / Off-Season Interactive Pricing */
.season-pricing-card{background:#fff;border:1px solid var(--line-d);border-radius:20px;padding:24px;margin:28px 0;box-shadow:0 14px 35px -20px rgba(0,0,0,.1)}
.season-switch{display:flex;gap:10px;background:rgba(var(--navy-rgb),.05);padding:6px;border-radius:16px;margin:18px 0}
.season-tab{flex:1;border:none;background:none;padding:12px 16px;border-radius:12px;cursor:pointer;font-weight:700;font-size:.9rem;color:var(--navy);display:flex;flex-direction:column;align-items:center;gap:4px;transition:all .25s var(--ease)}
.season-tab small{font-size:.72rem;opacity:.8;font-weight:500}
.season-tab.active{background:var(--navy);color:#fff;box-shadow:0 6px 18px -4px rgba(var(--navy-rgb),.4)}
.season-tab.active small{color:var(--orange-2)}
.season-tab:hover:not(.active){background:rgba(var(--navy-rgb),.08)}

/* 3-Hotel-Tier Pricing Table */
.tier-pricing-table{width:100%;border-collapse:collapse;margin:16px 0;border-radius:14px;overflow:hidden;border:1px solid var(--line-d)}
.tier-pricing-table th{background:var(--navy);color:#fff;padding:12px 14px;font-size:.84rem;font-weight:700;text-align:center;letter-spacing:.02em}
.tier-pricing-table th:first-child{text-align:left}
.tier-pricing-table td{padding:14px;border-bottom:1px solid var(--line-d);text-align:center;font-size:.9rem}
.tier-pricing-table td:first-child{text-align:left;font-weight:700;color:var(--navy)}
.tier-badge{display:inline-block;padding:.25rem .65rem;border-radius:999px;font-size:.72rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase}
.tier-essential{background:rgba(60,180,100,.14);color:#1b8a45;border:1px solid rgba(60,180,100,.3)}
.tier-premium{background:rgba(var(--orange-rgb),.14);color:var(--orange);border:1px solid rgba(var(--orange-rgb),.3)}
.tier-luxury{background:rgba(180,100,240,.14);color:#7b2cbf;border:1px solid rgba(180,100,240,.3)}

/* Hotel Section by Days */
.hotel-section-wrap{margin:32px 0}
.hotel-city-card{background:rgba(var(--navy-rgb),.02);border:1px solid var(--line-d);border-radius:18px;padding:20px;margin-bottom:16px}
.hotel-city-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;flex-wrap:wrap;gap:10px}
.hotel-city-head h4{font-family:var(--serif);font-size:1.2rem;color:var(--navy);display:flex;align-items:center;gap:8px}
.hotel-tiers-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.hotel-tier-box{background:#fff;border:1px solid var(--line-d);border-radius:14px;padding:16px;box-shadow:0 6px 16px -8px rgba(0,0,0,.06)}
.hotel-tier-box strong{display:block;font-size:.92rem;color:var(--navy);margin:6px 0 4px}
.hotel-tier-box small{display:block;font-size:.78rem;color:var(--muted);line-height:1.4}
@media(max-width:760px){
  .hotel-tiers-grid{grid-template-columns:1fr}
}

/* Day Itinerary Enhancements */
.itin-dist-badge{background:rgba(var(--orange-rgb),.12);color:var(--orange);border:1px solid rgba(var(--orange-rgb),.28);padding:.25rem .65rem;border-radius:999px;font-size:.74rem;font-weight:700}
.itin-places-today{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin:10px 0;padding:8px 12px;background:rgba(var(--navy-rgb),.03);border-radius:10px;font-size:.82rem}
.itin-places-today strong{color:var(--navy);font-size:.8rem}
.itin-places-today span{color:var(--orange);font-weight:600}
.itin-meta-bar{display:flex;gap:12px;flex-wrap:wrap;margin-top:12px;padding-top:10px;border-top:1px dashed var(--line-d);font-size:.78rem;color:var(--muted)}
.itin-meta-bar span{display:inline-flex;align-items:center;gap:5px;font-weight:600;color:var(--navy)}

/* Destination Hierarchy */
.dest-parent-tabs{display:flex;gap:10px;overflow-x:auto;padding-bottom:12px;margin-bottom:28px}
.dest-parent-tab{background:#fff;border:1.5px solid var(--line-d);color:var(--navy);padding:.6rem 1.2rem;border-radius:999px;font-weight:700;font-size:.88rem;cursor:pointer;white-space:nowrap;transition:all .2s ease}
.dest-parent-tab:hover,.dest-parent-tab.active{background:var(--navy);color:#fff;border-color:var(--navy)}

/* Blog Styles */
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin:32px 0}
.blog-card{background:#fff;border-radius:20px;overflow:hidden;border:1px solid var(--line-d);box-shadow:0 12px 30px -18px rgba(0,0,0,.1);transition:transform .3s var(--ease),box-shadow .3s var(--ease);display:flex;flex-direction:column}
.blog-card:hover{transform:translateY(-6px);box-shadow:0 22px 50px -22px rgba(0,0,0,.18)}
.blog-card-media{position:relative;height:210px;background:var(--navy);overflow:hidden}
.blog-card-media img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.blog-card:hover .blog-card-media img{transform:scale(1.08)}
.blog-card-body{padding:22px;flex:1;display:flex;flex-direction:column;gap:8px}
.blog-card-meta{display:flex;align-items:center;gap:10px;font-size:.76rem;color:var(--muted);font-weight:600}
.blog-card-meta span{color:var(--orange)}
.blog-card h3{font-family:var(--serif);font-size:1.25rem;line-height:1.3;color:var(--navy);margin:4px 0}
.blog-card h3 a{color:inherit;text-decoration:none;transition:color .2s}
.blog-card h3 a:hover{color:var(--orange)}
.blog-card p{font-size:.88rem;color:var(--muted);line-height:1.55;flex:1}
.blog-card-foot{display:flex;align-items:center;justify-content:space-between;padding-top:14px;border-top:1px solid var(--line-d);font-size:.82rem;font-weight:700;color:var(--orange)}

.article-wrap{max-width:840px;margin:0 auto;background:#fff;border-radius:24px;padding:44px;border:1px solid var(--line-d);box-shadow:0 16px 45px -20px rgba(0,0,0,.1)}
.article-header{margin-bottom:28px;padding-bottom:20px;border-bottom:1px solid var(--line-d)}
.article-meta{display:flex;gap:14px;align-items:center;flex-wrap:wrap;color:var(--muted);font-size:.84rem;margin-top:10px}
.article-body{font-size:1.05rem;line-height:1.85;color:var(--ink)}
.article-body h2{font-family:var(--serif);color:var(--navy);font-size:1.65rem;margin:2.2rem 0 1rem;font-weight:700;border-bottom:2px solid rgba(var(--orange-rgb, 243,156,18),0.25);padding-bottom:8px}
.article-body h3{font-family:var(--serif);color:var(--navy);font-size:1.32rem;margin:1.8rem 0 .75rem;font-weight:600}
.article-body h4{font-family:var(--serif);color:var(--navy);font-size:1.12rem;margin:1.4rem 0 .6rem;font-weight:600}
.article-body p{margin-bottom:1.4rem}
.article-body ul,.article-body ol{margin:1rem 0 1.5rem 1.5rem}
.article-body li{margin-bottom:.5rem}
.article-cta{background:linear-gradient(135deg,var(--navy),var(--navy-2));color:#fff;border-radius:20px;padding:32px;margin:36px 0;text-align:center}
.article-cta h3{color:#fff;font-family:var(--serif);font-size:1.6rem;margin-bottom:10px}

@media(max-width:1024px){
  .blog-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:760px){
  .blog-grid{grid-template-columns:1fr}
  .article-wrap{padding:24px}
}

/* Description Text Word Wrap & Justification (All lines start & end at same boundaries) */
.hero-sub,
.text-justified,
.intro-text > p,
.dest-card-desc,
.dest-desc,
.tour-overview p,
.tour-desc-text,
.exp-body > p,
.exp-custom p,
/* .page-hero p removed from justify */
.article-body p,
.special-offer-card p {
  text-align: justify;
  text-justify: inter-word;
  word-wrap: break-word;
  overflow-wrap: break-word;
  hyphens: auto;
}

/* Screen Reader / Google Crawler Accessibility Utility */
.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* ===== Mobile Off-Canvas Drawer Menu ===== */
.canvas-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.72);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  opacity: 0;
  visibility: hidden;
  transition: opacity .32s ease, visibility .32s ease;
  z-index: 100000;
}
.canvas-backdrop.active {
  opacity: 1;
  visibility: visible;
}
.mobile-canvas {
  position: fixed;
  top: 0;
  right: 0;
  width: 86vw;
  max-width: 380px;
  height: 100%;
  height: 100dvh;
  background: var(--navy);
  border-left: 1px solid rgba(255, 255, 255, 0.12);
  box-shadow: -15px 0 45px rgba(0, 0, 0, 0.65);
  z-index: 100001;
  display: none;
  flex-direction: column;
  transform: translateX(105%);
  transition: transform .35s cubic-bezier(0.16, 1, 0.3, 1);
  overflow: hidden;
}
.mobile-canvas.open {
  display: flex !important;
  transform: translateX(0);
}
.canvas-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 20px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.02);
}
.canvas-close {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.2);
  background: rgba(255, 255, 255, 0.06);
  color: #fff;
  font-size: 1.6rem;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all .2s ease;
}
.canvas-close:hover {
  background: rgba(var(--orange-rgb), 0.2);
  border-color: var(--orange);
  color: var(--orange);
}
.canvas-body {
  flex: 1;
  overflow-y: auto;
  padding: 16px 20px;
  -webkit-overflow-scrolling: touch;
}
.canvas-nav {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.canvas-link {
  display: block;
  padding: 12px 14px;
  color: rgba(255, 255, 255, 0.92);
  font-size: 1rem;
  font-weight: 600;
  border-radius: 10px;
  transition: background .2s, color .2s;
  text-decoration: none;
}
.canvas-link:hover, .canvas-link.active {
  background: rgba(var(--orange-rgb), 0.14);
  color: var(--orange-2, #FFA5AB);
}
.canvas-dropdown {
  border-radius: 10px;
  transition: background .2s;
}
.canvas-dropdown-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.canvas-dropdown-toggle .canvas-link {
  flex: 1;
}
.canvas-caret-btn {
  background: transparent;
  border: none;
  color: rgba(255, 255, 255, 0.7);
  padding: 10px 14px;
  font-size: 1.15rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform .25s ease, color .25s ease;
}
.canvas-dropdown.expanded .canvas-arrow {
  transform: rotate(180deg);
  display: inline-block;
  color: var(--orange);
}
.canvas-arrow {
  display: inline-block;
  transition: transform .25s ease;
}
.canvas-submenu {
  display: none;
  flex-direction: column;
  padding: 4px 0 8px 16px;
  margin-left: 12px;
  border-left: 2px solid rgba(var(--orange-rgb), 0.4);
  gap: 3px;
}
.canvas-dropdown.expanded .canvas-submenu {
  display: flex;
}
.canvas-sublink {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  color: rgba(255, 255, 255, 0.82);
  font-size: 0.92rem;
  font-weight: 500;
  border-radius: 8px;
  text-decoration: none;
  transition: all .2s;
}
.canvas-sublink span {
  color: var(--orange);
  font-size: 1.1rem;
  line-height: 1;
}
.canvas-sublink:hover {
  background: rgba(255, 255, 255, 0.05);
  color: #fff;
  padding-left: 16px;
}
.canvas-footer {
  padding: 16px 20px;
  padding-bottom: max(22px, calc(16px + env(safe-area-inset-bottom)));
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(14, 2, 13, 0.95);
  flex-shrink: 0;
}
.canvas-actions {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.btn-canvas-call {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 16px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.18);
  color: #fff;
  text-decoration: none;
  transition: all .2s ease;
}
.btn-canvas-call:hover {
  background: rgba(255, 255, 255, 0.14);
  color: #fff;
  border-color: rgba(255, 255, 255, 0.3);
}
.btn-canvas-wa {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 16px;
  border-radius: 12px;
  background: #25d366;
  border: 1px solid #1ebc57;
  color: #fff;
  text-decoration: none;
  font-weight: 700;
  box-shadow: 0 8px 22px -6px rgba(37, 211, 102, 0.6);
  transition: all .2s ease;
}
.btn-canvas-wa:hover {
  background: #1ebc57;
  color: #fff;
  transform: translateY(-1px);
}
.btn-canvas-call .btn-icon, .btn-canvas-wa .btn-icon {
  font-size: 1.4rem;
  line-height: 1;
}
.btn-canvas-call .btn-text, .btn-canvas-wa .btn-text {
  display: flex;
  flex-direction: column;
  line-height: 1.25;
}
.btn-canvas-call .btn-text small, .btn-canvas-wa .btn-text small {
  font-size: 0.72rem;
  opacity: 0.85;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-weight: 600;
}
.btn-canvas-call .btn-text strong, .btn-canvas-wa .btn-text strong {
  font-size: 0.98rem;
  font-weight: 700;
}

/* =====================================================================
   MOMENTS.PHP — 3-ROW MULTI-CHANNEL SOCIAL HUB & SCROLLABLE FEEDS
   ===================================================================== */
.channels-hub-section {
  padding: 60px 0 95px;
  background-color: #f5f2ff;
  position: relative;
}

/* Responsive Small Social Profile Boxes Grid */
.social-boxes-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 10px;
  align-items: stretch;
}
@media (max-width: 1100px) {
  .social-boxes-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }
}
@media (max-width: 700px) {
  .social-boxes-grid {
    grid-template-columns: 1fr;
    gap: 18px;
  }
}

/* Individual Social Profile Box (Small Box) */
.sp-box {
  background: linear-gradient(180deg, #1d0b24 0%, #110316 100%);
  border: 1.5px solid rgba(0, 0, 0, 0.12);
  border-radius: 20px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.28s ease, border-color 0.28s ease;
  box-shadow: 0 12px 28px -6px rgba(45, 12, 38, 0.25);
  position: relative;
}
.sp-box:hover {
  transform: translateY(-5px);
}

/* Brand Top Accent Stripe */
.sp-brand-bar {
  height: 5px;
  width: 100%;
}
.sp-instagram .sp-brand-bar {
  background: linear-gradient(90deg, #833ab4, #fd1d1d, #fcb045);
}
.sp-youtube .sp-brand-bar {
  background: #ff0000;
}
.sp-facebook .sp-brand-bar {
  background: #1877f2;
}
.sp-linkedin .sp-brand-bar {
  background: #0a66c2;
}
.sp-x .sp-brand-bar, .sp-twitter .sp-brand-bar {
  background: #ffffff;
}
.sp-reddit .sp-brand-bar {
  background: #ff4500;
}
.sp-snapchat .sp-brand-bar {
  background: #fffc00;
}
.sp-custom .sp-brand-bar {
  background: linear-gradient(90deg, var(--rose-1), var(--orange-1));
}

/* Card Outer Border Accents */
.sp-instagram { border-color: rgba(225, 48, 108, 0.35); }
.sp-instagram:hover { border-color: #e1306c; box-shadow: 0 18px 36px -6px rgba(225, 48, 108, 0.35); }

.sp-youtube { border-color: rgba(255, 0, 0, 0.35); }
.sp-youtube:hover { border-color: #ff0000; box-shadow: 0 18px 36px -6px rgba(255, 0, 0, 0.35); }

.sp-facebook { border-color: rgba(24, 119, 242, 0.35); }
.sp-facebook:hover { border-color: #1877f2; box-shadow: 0 18px 36px -6px rgba(24, 119, 242, 0.35); }

.sp-linkedin { border-color: rgba(10, 102, 194, 0.35); }
.sp-linkedin:hover { border-color: #0a66c2; box-shadow: 0 18px 36px -6px rgba(10, 102, 194, 0.35); }

.sp-x, .sp-twitter { border-color: rgba(255, 255, 255, 0.25); }
.sp-x:hover, .sp-twitter:hover { border-color: #ffffff; box-shadow: 0 18px 36px -6px rgba(255, 255, 255, 0.2); }

.sp-reddit { border-color: rgba(255, 69, 0, 0.35); }
.sp-reddit:hover { border-color: #ff4500; box-shadow: 0 18px 36px -6px rgba(255, 69, 0, 0.35); }

.sp-snapchat { border-color: rgba(255, 252, 0, 0.35); }
.sp-snapchat:hover { border-color: #fffc00; box-shadow: 0 18px 36px -6px rgba(255, 252, 0, 0.25); }

.sp-custom { border-color: rgba(218, 98, 125, 0.35); }
.sp-custom:hover { border-color: var(--orange-1); box-shadow: 0 18px 36px -6px rgba(218, 98, 125, 0.35); }

/* Card Body */
.sp-card-body {
  padding: 22px 22px 20px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  flex: 1;
  gap: 16px;
}

/* Header with Icon and Badge */
.sp-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.sp-icon-wrap {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.4rem;
  flex-shrink: 0;
}
.icon-instagram { background: linear-gradient(135deg, #f09433, #dc2743, #bc1888); color: #fff; }
.icon-youtube   { background: #ff0000; color: #fff; }
.icon-facebook  { background: #1877f2; color: #fff; }
.icon-linkedin  { background: #0a66c2; color: #fff; }
.icon-x, .icon-twitter { background: #000; color: #fff; border: 1px solid rgba(255, 255, 255, 0.25); }
.icon-reddit    { background: #ff4500; color: #fff; }
.icon-snapchat  { background: #fffc00; color: #000; }
.icon-custom    { background: linear-gradient(135deg, var(--rose-1), var(--orange-1)); color: #fff; }

.sp-badge {
  font-size: 0.74rem;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 999px;
  letter-spacing: 0.03em;
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.22); box-shadow: 0 4px 14px rgba(0, 0, 0, 0.5);
}
.badge-instagram { background: rgba(225, 48, 108, 0.15); color: #ff8ab6; border-color: rgba(225, 48, 108, 0.3); }
.badge-youtube   { background: rgba(255, 0, 0, 0.15); color: #ff9999; border-color: rgba(255, 0, 0, 0.3); }
.badge-facebook  { background: rgba(24, 119, 242, 0.15); color: #99c7ff; border-color: rgba(24, 119, 242, 0.3); }
.badge-linkedin  { background: rgba(10, 102, 194, 0.15); color: #99caff; border-color: rgba(10, 102, 194, 0.3); }
.badge-x, .badge-twitter { background: rgba(255, 255, 255, 0.12); color: #ffffff; border-color: rgba(255, 255, 255, 0.25); }
.badge-reddit    { background: rgba(255, 69, 0, 0.15); color: #ffaa88; border-color: rgba(255, 69, 0, 0.3); }
.badge-snapchat  { background: rgba(255, 252, 0, 0.15); color: #fffb80; border-color: rgba(255, 252, 0, 0.3); }

/* Info Area */
.sp-info {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.sp-title {
  font-family: var(--serif);
  font-size: 1.22rem;
  color: #fff;
  margin: 0;
  line-height: 1.25;
  font-weight: 700;
}
.sp-handle-row {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 2px;
}
.sp-handle {
  font-size: 0.88rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.7);
}
.handle-instagram { color: #ff8ab6; }
.handle-youtube   { color: #ff9999; }
.handle-facebook  { color: #99c7ff; }
.handle-linkedin  { color: #99caff; }
.handle-x, .handle-twitter { color: #e0e0e0; }
.handle-reddit    { color: #ffaa88; }
.handle-snapchat  { color: #fffb80; }

.sp-verified {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background: #3897f0;
  color: #fff;
  font-size: 0.65rem;
  font-weight: bold;
}
.sp-desc {
  font-size: 0.86rem;
  color: rgba(255, 255, 255, 0.72);
  line-height: 1.48;
  margin: 6px 0 0;
}

/* Footer & Follow Button */
.sp-footer {
  margin-top: 6px;
}
.sp-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  padding: 12px 18px;
  border-radius: 12px;
  font-weight: 700;
  font-size: 0.92rem;
  text-decoration: none;
  transition: transform 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.35);
}
.sp-btn:hover {
  transform: translateY(-2px);
  filter: brightness(1.08);
}
.btn-instagram {
  background: linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);
  color: #fff;
  box-shadow: 0 4px 14px rgba(220, 39, 67, 0.4);
}
.btn-youtube {
  background: #ff0000;
  color: #fff;
  box-shadow: 0 4px 14px rgba(255, 0, 0, 0.4);
}
.btn-facebook {
  background: #1877f2;
  color: #fff;
  box-shadow: 0 4px 14px rgba(24, 119, 242, 0.4);
}
.btn-linkedin {
  background: #0a66c2;
  color: #fff;
  box-shadow: 0 4px 14px rgba(10, 102, 194, 0.4);
}
.btn-x, .btn-twitter {
  background: #000;
  color: #fff;
  border: 1.5px solid rgba(255, 255, 255, 0.35);
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.5);
}
.btn-reddit {
  background: #ff4500;
  color: #fff;
  box-shadow: 0 4px 14px rgba(255, 69, 0, 0.4);
}
.btn-snapchat {
  background: #fffc00;
  color: #000;
  font-weight: 800;
  box-shadow: 0 4px 14px rgba(255, 252, 0, 0.4);
}
.btn-custom {
  background: linear-gradient(90deg, var(--rose-1), var(--orange-1));
  color: #fff;
}

/* Individual Channel Showcase Card */
.channel-card {
  background: linear-gradient(180deg, #1c0a22 0%, #100414 100%);
  border: 2px solid rgba(0, 0, 0, 0.12);
  border-radius: 22px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.3s ease, box-shadow 0.3s ease;
  position: relative;
  box-shadow: 0 16px 36px -10px rgba(118, 48, 70, 0.28);
  height: 530px;
}
.channel-card:hover {
  transform: translateY(-5px);
}

/* Brand Colored Accent Top Stripe */
.channel-brand-stripe {
  height: 6px;
  width: 100%;
}

/* Brand-Specific Colour Schemes for Official Accounts */
/* 1. Instagram */
.channel-card.card-instagram {
  border-color: #e1306c;
  box-shadow: 0 16px 36px -8px rgba(225, 48, 108, 0.32);
}
.channel-card.card-instagram:hover {
  border-color: #fd1d1d;
  box-shadow: 0 24px 50px -6px rgba(225, 48, 108, 0.48);
}
.channel-card.card-instagram .channel-brand-stripe {
  background: linear-gradient(135deg, #833ab4 0%, #fd1d1d 50%, #fcb045 100%);
}
.channel-card.card-instagram .channel-card-head {
  background: linear-gradient(90deg, rgba(225, 48, 108, 0.22) 0%, rgba(28, 10, 34, 0.98) 100%);
  border-bottom: 1px solid rgba(225, 48, 108, 0.3);
}
.channel-card.card-instagram .channel-handle {
  color: #ff8ab6;
}
.channel-card.card-instagram .channel-badge {
  background: linear-gradient(135deg, rgba(225, 48, 108, 0.35), rgba(188, 24, 136, 0.35));
  color: #ffd6e6;
  border: 1px solid rgba(225, 48, 108, 0.5);
}
.channel-card.card-instagram .channel-scroll-feed::-webkit-scrollbar-thumb {
  background: rgba(225, 48, 108, 0.45);
}
.channel-card.card-instagram .channel-scroll-feed::-webkit-scrollbar-thumb:hover {
  background: #e1306c;
}

/* 2. YouTube */
.channel-card.card-youtube {
  border-color: #ff0000;
  box-shadow: 0 16px 36px -8px rgba(255, 0, 0, 0.3);
}
.channel-card.card-youtube:hover {
  border-color: #ff3333;
  box-shadow: 0 24px 50px -6px rgba(255, 0, 0, 0.48);
}
.channel-card.card-youtube .channel-brand-stripe {
  background: #ff0000;
}
.channel-card.card-youtube .channel-card-head {
  background: linear-gradient(90deg, rgba(255, 0, 0, 0.22) 0%, rgba(28, 10, 34, 0.98) 100%);
  border-bottom: 1px solid rgba(255, 0, 0, 0.3);
}
.channel-card.card-youtube .channel-handle {
  color: #ff8585;
}
.channel-card.card-youtube .channel-badge {
  background: rgba(255, 0, 0, 0.32);
  color: #ffcccc;
  border: 1px solid rgba(255, 0, 0, 0.55);
}
.channel-card.card-youtube .channel-scroll-feed::-webkit-scrollbar-thumb {
  background: rgba(255, 0, 0, 0.45);
}
.channel-card.card-youtube .channel-scroll-feed::-webkit-scrollbar-thumb:hover {
  background: #ff0000;
}

/* 3. Facebook */
.channel-card.card-facebook {
  border-color: #1877f2;
  box-shadow: 0 16px 36px -8px rgba(24, 119, 242, 0.3);
}
.channel-card.card-facebook:hover {
  border-color: #3b8cf5;
  box-shadow: 0 24px 50px -6px rgba(24, 119, 242, 0.48);
}
.channel-card.card-facebook .channel-brand-stripe {
  background: #1877f2;
}
.channel-card.card-facebook .channel-card-head {
  background: linear-gradient(90deg, rgba(24, 119, 242, 0.22) 0%, rgba(28, 10, 34, 0.98) 100%);
  border-bottom: 1px solid rgba(24, 119, 242, 0.3);
}
.channel-card.card-facebook .channel-handle {
  color: #8cc0ff;
}
.channel-card.card-facebook .channel-badge {
  background: rgba(24, 119, 242, 0.32);
  color: #d1e7ff;
  border: 1px solid rgba(24, 119, 242, 0.55);
}
.channel-card.card-facebook .channel-scroll-feed::-webkit-scrollbar-thumb {
  background: rgba(24, 119, 242, 0.45);
}
.channel-card.card-facebook .channel-scroll-feed::-webkit-scrollbar-thumb:hover {
  background: #1877f2;
}

/* 4. Reddit */
.channel-card.card-reddit {
  border-color: #ff4500;
  box-shadow: 0 16px 36px -8px rgba(255, 69, 0, 0.3);
}
.channel-card.card-reddit:hover {
  border-color: #ff6830;
  box-shadow: 0 24px 50px -6px rgba(255, 69, 0, 0.48);
}
.channel-card.card-reddit .channel-brand-stripe {
  background: #ff4500;
}
.channel-card.card-reddit .channel-card-head {
  background: linear-gradient(90deg, rgba(255, 69, 0, 0.22) 0%, rgba(28, 10, 34, 0.98) 100%);
  border-bottom: 1px solid rgba(255, 69, 0, 0.3);
}
.channel-card.card-reddit .channel-handle {
  color: #ffa485;
}
.channel-card.card-reddit .channel-badge {
  background: rgba(255, 69, 0, 0.32);
  color: #ffe0d6;
  border: 1px solid rgba(255, 69, 0, 0.55);
}
.channel-card.card-reddit .channel-scroll-feed::-webkit-scrollbar-thumb {
  background: rgba(255, 69, 0, 0.45);
}
.channel-card.card-reddit .channel-scroll-feed::-webkit-scrollbar-thumb:hover {
  background: #ff4500;
}

/* 5. X (Twitter) */
.channel-card.card-x {
  border-color: #2a1523;
  box-shadow: 0 16px 36px -8px rgba(0, 0, 0, 0.38);
}
.channel-card.card-x:hover {
  border-color: #ffffff;
  box-shadow: 0 24px 50px -6px rgba(0, 0, 0, 0.6);
}
.channel-card.card-x .channel-brand-stripe {
  background: linear-gradient(90deg, #111 0%, #fff 50%, #111 100%);
}
.channel-card.card-x .channel-card-head {
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.12) 0%, rgba(28, 10, 34, 0.98) 100%);
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}
.channel-card.card-x .channel-handle {
  color: #d8d8d8;
}
.channel-card.card-x .channel-badge {
  background: rgba(255, 255, 255, 0.18);
  color: #ffffff;
  border: 1px solid rgba(255, 255, 255, 0.4);
}
.channel-card.card-x .channel-scroll-feed::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.35);
}
.channel-card.card-x .channel-scroll-feed::-webkit-scrollbar-thumb:hover {
  background: #ffffff;
}

/* 6. LinkedIn */
.channel-card.card-linkedin {
  border-color: #0a66c2;
  box-shadow: 0 16px 36px -8px rgba(10, 102, 194, 0.3);
}
.channel-card.card-linkedin:hover {
  border-color: #2b84df;
  box-shadow: 0 24px 50px -6px rgba(10, 102, 194, 0.48);
}
.channel-card.card-linkedin .channel-brand-stripe {
  background: #0a66c2;
}
.channel-card.card-linkedin .channel-card-head {
  background: linear-gradient(90deg, rgba(10, 102, 194, 0.22) 0%, rgba(28, 10, 34, 0.98) 100%);
  border-bottom: 1px solid rgba(10, 102, 194, 0.3);
}
.channel-card.card-linkedin .channel-handle {
  color: #82beff;
}
.channel-card.card-linkedin .channel-badge {
  background: rgba(10, 102, 194, 0.32);
  color: #d1e7ff;
  border: 1px solid rgba(10, 102, 194, 0.55);
}
.channel-card.card-linkedin .channel-scroll-feed::-webkit-scrollbar-thumb {
  background: rgba(10, 102, 194, 0.45);
}
.channel-card.card-linkedin .channel-scroll-feed::-webkit-scrollbar-thumb:hover {
  background: #0a66c2;
}

/* 7. Snapchat */
.channel-card.card-snapchat {
  border-color: #fffc00;
  box-shadow: 0 16px 36px -8px rgba(255, 252, 0, 0.35);
}
.channel-card.card-snapchat:hover {
  border-color: #ffffff;
  box-shadow: 0 24px 50px -6px rgba(255, 252, 0, 0.55);
}
.channel-card.card-snapchat .channel-brand-stripe {
  background: #fffc00;
}
.channel-card.card-snapchat .channel-card-head {
  background: linear-gradient(90deg, rgba(255, 252, 0, 0.24) 0%, rgba(28, 10, 34, 0.98) 100%);
  border-bottom: 1px solid rgba(255, 252, 0, 0.35);
}
.channel-card.card-snapchat .channel-handle {
  color: #fffb6b;
}
.channel-card.card-snapchat .channel-badge {
  background: #fffc00;
  color: #000000;
  font-weight: 800;
  border: 1px solid #ffd700;
}
.channel-card.card-snapchat .channel-scroll-feed::-webkit-scrollbar-thumb {
  background: rgba(255, 252, 0, 0.45);
}
.channel-card.card-snapchat .channel-scroll-feed::-webkit-scrollbar-thumb:hover {
  background: #fffc00;
}

/* 8. Custom Channels */
.channel-card.card-custom {
  border-color: var(--rose-1);
  box-shadow: 0 16px 36px -8px rgba(218, 98, 125, 0.3);
}
.channel-card.card-custom:hover {
  border-color: var(--orange-1);
  box-shadow: 0 24px 50px -6px rgba(218, 98, 125, 0.48);
}
.channel-card.card-custom .channel-brand-stripe {
  background: linear-gradient(90deg, var(--rose-1), var(--orange-1));
}
.channel-card.card-custom .channel-card-head {
  background: linear-gradient(90deg, rgba(218, 98, 125, 0.22) 0%, rgba(28, 10, 34, 0.98) 100%);
  border-bottom: 1px solid rgba(218, 98, 125, 0.3);
}
.channel-card.card-custom .channel-handle {
  color: #ffb3c6;
}
.channel-card.card-custom .channel-badge {
  background: rgba(218, 98, 125, 0.32);
  color: #ffe0e9;
  border: 1px solid rgba(218, 98, 125, 0.55);
}

/* Channel Card Header */
.channel-card-head {
  padding: 20px 22px 16px;
  display: flex;
  align-items: center;
  gap: 14px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.channel-avatar {
  width: 52px;
  height: 52px;
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.55rem;
  flex-shrink: 0;
  color: #fff;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.3);
}
.channel-avatar.avatar-instagram {
  background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285aeb 90%);
}
.channel-avatar.avatar-youtube {
  background: #ff0000;
}
.channel-avatar.avatar-facebook {
  background: #1877f2;
}
.channel-avatar.avatar-reddit {
  background: #ff4500;
}
.channel-avatar.avatar-x {
  background: #000;
  border: 1px solid rgba(255, 255, 255, 0.25);
}
.channel-avatar.avatar-linkedin {
  background: #0a66c2;
}
.channel-avatar.avatar-snapchat {
  background: #fffc00;
  color: #000;
}
.channel-avatar.avatar-custom {
  background: linear-gradient(135deg, var(--rose-1), var(--orange-1));
}

.channel-meta {
  flex: 1;
  min-width: 0;
}
.channel-title {
  font-family: var(--serif);
  font-size: 1.15rem;
  font-weight: 700;
  color: #fff;
  margin: 0 0 3px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.channel-handle {
  display: block;
  font-size: 0.82rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.65);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.channel-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-top: 5px;
  font-size: 0.72rem;
  font-weight: 700;
  padding: 3px 9px;
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.08);
  color: #ffda79;
  letter-spacing: 0.03em;
}

/* Card Description Banner */
.channel-desc-bar {
  padding: 12px 22px;
  background: rgba(0, 0, 0, 0.2);
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  font-size: 0.85rem;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.75);
}

/* Scroll Feed Container: 524px scrollable view to directly explore complete account */
.channel-scroll-feed {
  height: 524px;
  flex: 1;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 0;
  display: flex;
  flex-direction: column;
  background: #000;
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 255, 255, 0.2) rgba(255, 255, 255, 0.03);
}
.channel-scroll-feed::-webkit-scrollbar {
  width: 6px;
}
.channel-scroll-feed::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.03);
  border-radius: 999px;
}
.channel-scroll-feed::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.2);
  border-radius: 999px;
}
.channel-scroll-feed::-webkit-scrollbar-thumb:hover {
  background: rgba(255, 255, 255, 0.38);
}

/* Native Stream Windows & Embeds */
.channel-scroll-feed iframe {
  width: 100%;
  border: none;
  display: block;
}

.fb-stream-window iframe {
  width: 100%;
  height: 524px;
}

.x-stream-window iframe {
  width: 100%;
  border: none;
}

.insta-stream-window iframe {
  width: 100%;
  height: 524px;
}

.yt-stream-window, .insta-stream-window, .snapchat-stream-window, .linkedin-stream-window, .reddit-stream-window {
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 255, 255, 0.22) transparent;
}
.yt-stream-window::-webkit-scrollbar,
.insta-stream-window::-webkit-scrollbar,
.snapchat-stream-window::-webkit-scrollbar,
.linkedin-stream-window::-webkit-scrollbar,
.reddit-stream-window::-webkit-scrollbar {
  width: 5px;
}
.yt-stream-window::-webkit-scrollbar-thumb,
.insta-stream-window::-webkit-scrollbar-thumb,
.snapchat-stream-window::-webkit-scrollbar-thumb,
.linkedin-stream-window::-webkit-scrollbar-thumb,
.reddit-stream-window::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.22);
  border-radius: 999px;
}
.yt-stream-window::-webkit-scrollbar-thumb:hover,
.insta-stream-window::-webkit-scrollbar-thumb:hover {
  background: rgba(255, 255, 255, 0.45);
}

.yt-feed-item:hover {
  background: rgba(255, 255, 255, 0.08) !important;
  border-color: rgba(255, 0, 0, 0.45) !important;
  transform: translateX(3px);
}

.direct-stream-window iframe {
  width: 100%;
  height: 100%;
  min-height: 524px;
}

/* Custom Embed Wrapper */
.channel-embed-box {
  width: 100%;
  border-radius: 14px;
  overflow: hidden;
  background: #000;
  border: 1px solid rgba(255, 255, 255, 0.08);
}
.channel-embed-box iframe {
  width: 100%;
  min-height: 350px;
  border: none;
  display: block;
}

/* Stream / Feed Post Item */
.feed-post {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 14px;
  padding: 14px 16px;
  transition: all 0.2s ease;
  position: relative;
}
.feed-post:hover {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.15);
}
.feed-post-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}
.feed-post-tag {
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  padding: 2px 7px;
  border-radius: 4px;
}
.feed-post-time {
  font-size: 0.72rem;
  color: rgba(255, 255, 255, 0.45);
}
.feed-post-text {
  font-size: 0.86rem;
  color: rgba(255, 255, 255, 0.88);
  line-height: 1.52;
  margin: 0 0 10px;
}
.feed-post-stats {
  display: flex;
  gap: 16px;
  font-size: 0.75rem;
  color: rgba(255, 255, 255, 0.5);
  font-weight: 600;
}
.feed-post-stats span {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

/* Scroll Hint Bar */
.scroll-hint-bar {
  text-align: center;
  padding: 6px;
  font-size: 0.73rem;
  color: rgba(255, 255, 255, 0.42);
  background: rgba(255, 255, 255, 0.02);
  border-top: 1px solid rgba(255, 255, 255, 0.04);
  letter-spacing: 0.03em;
}

/* Card Footer with Direct Follow Button */
.channel-card-foot {
  padding: 16px 22px 20px;
  margin-top: auto;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  background: rgba(255, 255, 255, 0.015);
}
.btn-channel-follow {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  padding: 13px 20px;
  border-radius: 12px;
  font-size: 0.92rem;
  font-weight: 700;
  text-decoration: none;
  color: #fff;
  transition: all 0.25s ease;
  box-shadow: 0 8px 20px -6px rgba(0, 0, 0, 0.4);
}
.btn-channel-follow:hover {
  transform: translateY(-2px);
  color: #fff;
  box-shadow: 0 12px 26px -6px rgba(0, 0, 0, 0.6);
}
.btn-follow-instagram {
  background: linear-gradient(135deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);
}
.btn-follow-instagram:hover {
  filter: brightness(1.1);
}
.btn-follow-youtube {
  background: #ff0000;
}
.btn-follow-youtube:hover {
  background: #e60000;
}
.btn-follow-facebook {
  background: #1877f2;
}
.btn-follow-facebook:hover {
  background: #1464cc;
}
.btn-follow-reddit {
  background: #ff4500;
}
.btn-follow-reddit:hover {
  background: #e03d00;
}
.btn-follow-x {
  background: #000;
  border: 1px solid rgba(255, 255, 255, 0.3);
  color: #fff;
}
.btn-follow-x:hover {
  background: #161616;
  border-color: #fff;
}
.btn-follow-linkedin {
  background: #0a66c2;
}
.btn-follow-linkedin:hover {
  background: #08529c;
}
.btn-follow-snapchat {
  background: #fffc00;
  color: #000 !important;
}
.btn-follow-snapchat:hover {
  background: #edea00;
}
.btn-follow-custom {
  background: linear-gradient(135deg, var(--rose-1), var(--orange-1));
}




/* ========================================================
   TOUR PACKAGES REDESIGN (Google SEO & UX Compliant)
   - 3 per row on desktop, 1 per row on mobile
   - Dark gradient image bottom with visible H4 title
   - Days/Nights & 5-Star Reviews
   - Big Rupee Price & Tier Switcher Dropdown
   - Places covered list
   - 3 Inclusion icons with dynamic hotel badge
   - Trio CTA buttons (WhatsApp, Call, Instant Quote)
   - Details button at bottom
   ======================================================== */

.pkg-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
  margin-top: 32px;
}

.pkg-card {
  position: relative;
  width: 100%;
  background: #ffffff;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 10px 32px rgba(32, 6, 29, 0.08);
  border: 1px solid rgba(32, 6, 29, 0.08);
  display: flex;
  flex-direction: column;
  transition: transform 0.3s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.3s ease;
}

.pkg-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 48px rgba(32, 6, 29, 0.16);
  border-color: rgba(218, 98, 125, 0.35);
}

/* Media Header with Dark Bottom Gradient */
.pkg-card-media {
  position: relative;
  height: 240px;
  overflow: hidden;
  background: #20061D;
}

.pkg-card-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.6s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.pkg-card:hover .pkg-card-img {
  transform: scale(1.06);
}

.pkg-card-badge {
  position: absolute;
  top: 14px;
  left: 14px;
  z-index: 3;
  background: linear-gradient(135deg, #da627d, #e67e22);
  color: #ffffff;
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 5px 12px;
  border-radius: 999px;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.3);
}

.pkg-card-gradient {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: flex-end;
  padding: 20px 18px 16px;
  background: linear-gradient(180deg, rgba(32, 6, 29, 0) 0%, rgba(32, 6, 29, 0.45) 40%, rgba(32, 6, 29, 0.96) 100%);
  z-index: 2;
}

/* Package Title strictly using H4 for SEO */
.pkg-card-title {
  margin: 0;
  font-family: var(--serif, 'Playfair Display', Georgia, serif);
  font-size: 1.28rem;
  font-weight: 700;
  line-height: 1.28;
  color: #ffffff;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.7);
}

.pkg-card-title a {
  color: #ffffff;
  text-decoration: none;
  transition: color 0.2s ease;
}

.pkg-card-title a:hover {
  color: #e8a598;
}

/* Card Body */
.pkg-card-body {
  padding: 18px 20px 22px;
  display: flex;
  flex-direction: column;
  flex: 1;
  background: #ffffff;
  color: #20061D;
}

/* Row 1: Duration & Rating */
.pkg-meta-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 12px;
  border-bottom: 1px solid #f0e9e2;
  margin-bottom: 12px;
}

.pkg-duration {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #20061D;
  font-size: 0.88rem;
  font-weight: 700;
}

.pkg-meta-icon {
  font-size: 1rem;
}

.pkg-rating {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 0.86rem;
}

.pkg-stars {
  color: #f39c12;
  letter-spacing: 1px;
  font-size: 0.95rem;
}

.pkg-rating-num {
  font-weight: 800;
  color: #20061D;
  background: #fdf3e2;
  padding: 2px 7px;
  border-radius: 6px;
  font-size: 0.8rem;
}

/* Row 2: Price Left & Tier Dropdown Right */
.pkg-pricing-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 12px;
  margin-bottom: 14px;
}

.pkg-price-col {
  display: flex;
  flex-direction: column;
}

.pkg-price-prefix {
  font-size: 0.75rem;
  font-weight: 600;
  color: #7b6f67;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 2px;
}

.pkg-price-display {
  font-family: var(--serif, 'Playfair Display', Georgia, serif);
  font-size: 1.65rem;
  font-weight: 800;
  color: #20061D;
  line-height: 1;
  letter-spacing: -0.02em;
}

.pkg-tier-col {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

.pkg-tier-label {
  font-size: 0.72rem;
  font-weight: 700;
  color: #7b6f67;
  text-transform: uppercase;
  margin-bottom: 4px;
}

.pkg-tier-select {
  appearance: none;
  -webkit-appearance: none;
  background: #f5f2ed url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%2320061D%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E") no-repeat right 10px center;
  background-size: 9px;
  padding: 7px 28px 7px 12px;
  font-size: 0.82rem;
  font-weight: 700;
  color: #20061D;
  border: 1.5px solid #dcd3c8;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.2s ease;
  max-width: 165px;
}

.pkg-tier-select:focus,
.pkg-tier-select:hover {
  outline: none;
  border-color: #da627d;
  background-color: #ffffff;
  box-shadow: 0 0 0 3px rgba(218, 98, 125, 0.15);
}

/* Row 3: Places Covered */
.pkg-places-row {
  display: flex;
  align-items: flex-start;
  gap: 7px;
  background: #fbf9f6;
  border: 1px dashed #e2dad0;
  padding: 8px 12px;
  border-radius: 10px;
  margin-bottom: 14px;
}

.pkg-places-pin {
  font-size: 0.95rem;
  line-height: 1.3;
}

.pkg-places-text {
  font-size: 0.8rem;
  color: #554840;
  line-height: 1.45;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.pkg-places-text strong {
  color: #20061D;
}

/* Row 4: 3 Inclusions Grid */
.pkg-inclusions-grid {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 16px;
  background: #fdfcfb;
  border: 1px solid #efeae3;
  border-radius: 10px;
  padding: 10px 12px;
}

.pkg-inc-item {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.82rem;
  font-weight: 600;
  color: #3b2c34;
}

.pkg-inc-icon {
  font-size: 0.95rem;
  flex-shrink: 0;
}

.pkg-inc-hotel .pkg-inc-text {
  font-weight: 700;
  color: #da627d;
  transition: color 0.2s ease;
}

/* Row 5: Action Trio Buttons */
.pkg-actions-trio {
  display: grid;
  grid-template-columns: 1fr 1fr 1.3fr;
  gap: 8px;
  margin-bottom: 12px;
}

.pkg-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 9px 8px;
  border-radius: 10px;
  font-size: 0.82rem;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
  border: none;
  transition: all 0.2s ease;
  white-space: nowrap;
}

.pkg-btn-wa {
  background: #25d366;
  color: #ffffff !important;
}

.pkg-btn-wa:hover {
  background: #1eb956;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(37, 211, 102, 0.3);
}

.pkg-btn-call {
  background: #20061D;
  color: #ffffff !important;
}

.pkg-btn-call:hover {
  background: #3a1036;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(32, 6, 29, 0.3);
}

.pkg-btn-quote {
  background: linear-gradient(135deg, #da627d, #e87b64);
  color: #ffffff !important;
}

.pkg-btn-quote:hover {
  background: linear-gradient(135deg, #c74d68, #d46851);
  transform: translateY(-2px);
  box-shadow: 0 4px 14px rgba(218, 98, 125, 0.35);
}

.pkg-btn-icon {
  font-size: 0.95rem;
  line-height: 1;
}

/* Row 6: Bottom View Details */
.pkg-bottom-row {
  text-align: center;
  margin-top: auto;
  padding-top: 6px;
}

.pkg-btn-details {
  display: inline-block;
  font-size: 0.84rem;
  font-weight: 700;
  color: #7b6f67;
  text-decoration: none;
  padding: 6px 14px;
  border-radius: 8px;
  transition: all 0.2s ease;
  width: 100%;
  background: #f7f4ef;
}

.pkg-btn-details:hover {
  color: #20061D;
  background: #ece5dc;
}

.pkg-btn-details i {
  font-style: normal;
  display: inline-block;
  transition: transform 0.2s ease;
}

.pkg-btn-details:hover i {
  transform: translateX(3px);
}

/* ========================================================
   POPUP MODAL (Clean 3-Field + Simple Math Captcha)
   ======================================================== */
.pkg-modal-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(16, 3, 14, 0.78);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.25s ease, visibility 0.25s ease;
}

.pkg-modal-backdrop.is-open {
  opacity: 1;
  visibility: visible;
}

.pkg-modal-dialog {
  position: relative;
  width: 100%;
  max-width: 460px;
  background: #ffffff;
  border-radius: 22px;
  padding: 32px 28px;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.45);
  transform: scale(0.94) translateY(12px);
  transition: transform 0.28s cubic-bezier(0.2, 0.8, 0.2, 1);
  max-height: 94vh;
  overflow-y: auto;
  border: 1px solid rgba(218, 98, 125, 0.2);
}

.pkg-modal-backdrop.is-open .pkg-modal-dialog {
  transform: scale(1) translateY(0);
}

.pkg-modal-close {
  position: absolute;
  top: 16px;
  right: 18px;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: #f4efe9;
  border: none;
  font-size: 1.1rem;
  color: #20061D;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s ease;
}

.pkg-modal-close:hover {
  background: #da627d;
  color: #ffffff;
  transform: rotate(90deg);
}

.pkg-modal-header {
  text-align: center;
  margin-bottom: 20px;
}

.pkg-modal-pill {
  display: inline-block;
  background: rgba(218, 98, 125, 0.12);
  color: #da627d;
  font-size: 0.72rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  padding: 4px 12px;
  border-radius: 999px;
  margin-bottom: 6px;
}

.pkg-modal-title {
  font-family: var(--serif, 'Playfair Display', Georgia, serif);
  font-size: 1.45rem;
  font-weight: 700;
  color: #20061D;
  margin: 4px 0 6px;
  line-height: 1.25;
}

.pkg-modal-subtitle {
  font-size: 0.86rem;
  color: #72645c;
  margin: 0;
  line-height: 1.45;
}

.pkg-modal-alert {
  padding: 10px 14px;
  border-radius: 10px;
  font-size: 0.85rem;
  margin-bottom: 16px;
  line-height: 1.4;
}

.pkg-modal-alert.success {
  background: #e8f8ed;
  border: 1px solid #27b562;
  color: #12723a;
}

.pkg-modal-alert.error {
  background: #fdeeee;
  border: 1px solid #e74c3c;
  color: #a92213;
}

.pkg-modal-field {
  margin-bottom: 15px;
  text-align: left;
}

.pkg-modal-field label {
  display: block;
  font-size: 0.84rem;
  font-weight: 700;
  color: #20061D;
  margin-bottom: 6px;
}

.pkg-modal-field .req {
  color: #e74c3c;
}

.pkg-modal-field input[type="text"],
.pkg-modal-field input[type="tel"],
.pkg-modal-field input[type="number"] {
  width: 100%;
  padding: 11px 14px;
  font-size: 0.95rem;
  border: 1.5px solid #dcd5cb;
  border-radius: 10px;
  background: #fcfbf9;
  color: #20061D;
  box-sizing: border-box;
  transition: all 0.2s ease;
}

.pkg-modal-field input:focus {
  outline: none;
  border-color: #da627d;
  background: #ffffff;
  box-shadow: 0 0 0 3px rgba(218, 98, 125, 0.15);
}

.pkg-hint-text {
  display: block;
  font-size: 0.74rem;
  color: #8b7e75;
  margin-top: 4px;
}

/* Captcha Layout */
.pkg-captcha-box {
  display: flex;
  align-items: center;
  gap: 10px;
}

.pkg-captcha-eq {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #20061D;
  color: #ffffff;
  font-family: monospace;
  font-size: 1.15rem;
  font-weight: 800;
  padding: 10px 16px;
  border-radius: 10px;
  letter-spacing: 2px;
  flex-shrink: 0;
  user-select: none;
}

.pkg-captcha-box input {
  flex: 1;
}

.pkg-captcha-reload {
  width: 42px;
  height: 42px;
  border-radius: 10px;
  background: #f4efe9;
  border: 1.5px solid #dcd5cb;
  color: #20061D;
  font-size: 1.25rem;
  font-weight: 800;
  cursor: pointer;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s ease;
}

.pkg-captcha-reload:hover {
  background: #da627d;
  color: #ffffff;
  border-color: #da627d;
}

.pkg-modal-submit-btn {
  width: 100%;
  background: linear-gradient(135deg, #da627d, #e87b64);
  color: #ffffff;
  font-size: 0.98rem;
  font-weight: 800;
  padding: 14px 20px;
  border: none;
  border-radius: 12px;
  cursor: pointer;
  transition: all 0.2s ease;
  margin-top: 8px;
  box-shadow: 0 8px 22px rgba(218, 98, 125, 0.35);
}

.pkg-modal-submit-btn:hover {
  background: linear-gradient(135deg, #c74d68, #d46851);
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(218, 98, 125, 0.45);
}

.pkg-modal-direct-helpline {
  text-align: center;
  font-size: 0.8rem;
  color: #7b6f67;
  margin-top: 14px;
}

.pkg-modal-direct-helpline a {
  color: #20061D;
  font-weight: 700;
  text-decoration: none;
}

.pkg-modal-direct-helpline a:hover {
  color: #da627d;
}

/* ========================================================
   RESPONSIVE DESIGN (1 Card per row on mobile as requested)
   ======================================================== */
@media (max-width: 992px) {
  .pkg-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }
}

@media (max-width: 767px) {
  .pkg-grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .pkg-card-media {
    height: 220px;
  }
  .pkg-actions-trio {
    grid-template-columns: 1fr 1fr;
  }
  .pkg-btn-quote {
    grid-column: span 2;
    padding: 11px;
  }
  .pkg-modal-dialog {
    padding: 24px 18px;
    border-radius: 18px;
  }
}

/* ============================================================
   Bootstrap 5 Integration Overrides & Harmonic Bridge
   ============================================================ */
.pkg-card, .dest-card, .testimonial-card, .sp-box {
  width: 100%;
}
.navbar-brand.brand {
  padding: 0;
}
.navbar-nav .nav-link {
  padding: 0.5rem 0.85rem;
}
.form-control:focus, .form-select:focus {
  border-color: var(--orange, #da627d);
  box-shadow: 0 0 0 0.25rem rgba(var(--orange-rgb, 218, 98, 125), 0.25);
}


/* Destination Showcase & Directory Styles */
.dest-carousel-nav{position:absolute;inset:0;pointer-events:none;z-index:4;display:flex;align-items:center;justify-content:space-between;padding:0 20px}
.dest-carousel-nav button{pointer-events:auto;width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,0.3);background:rgba(8,2,12,0.55);color:#fff;backdrop-filter:blur(8px);cursor:pointer;font-size:1.6rem;display:flex;align-items:center;justify-content:center;transition:all .25s ease}
.dest-carousel-nav button:hover{background:var(--orange);border-color:var(--orange);transform:scale(1.08)}
.dest-photos-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.dest-photo-card{margin:0;border-radius:16px;overflow:hidden;background:#fff;border:1px solid var(--line-d);box-shadow:0 8px 24px -10px rgba(0,0,0,0.08);cursor:pointer;transition:transform .3s var(--ease),box-shadow .3s}
.dest-photo-card:hover{transform:translateY(-4px);box-shadow:0 18px 36px -12px rgba(0,0,0,0.18)}
.dest-photo-img-wrap{position:relative;width:100%;aspect-ratio:4/3;overflow:hidden;background:var(--navy)}
.dest-photo-img-wrap img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s var(--ease)}
.dest-photo-card:hover .dest-photo-img-wrap img{transform:scale(1.05)}
.dest-photo-overlay{position:absolute;inset:0;background:rgba(8,2,12,0.35);display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .25s}
.dest-photo-overlay span{background:rgba(255,255,255,0.92);color:var(--navy);font-size:0.8rem;font-weight:700;padding:6px 14px;border-radius:999px;letter-spacing:0.04em}
.dest-photo-card:hover .dest-photo-overlay{opacity:1}
.dest-photo-caption{padding:10px 14px 12px;background:#fff;border-top:1px solid var(--line-d)}
.dest-photo-caption strong{font-size:0.88rem;color:var(--navy);display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dest-featured-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-bottom:50px}
.dest-featured-card{background:#fff;border-radius:20px;overflow:hidden;border:1.5px solid var(--line-d);box-shadow:0 14px 34px -14px rgba(0,0,0,0.08);display:flex;flex-direction:column;transition:transform .35s var(--ease),box-shadow .35s,border-color .35s}
.dest-featured-card:hover{transform:translateY(-6px);border-color:var(--orange);box-shadow:0 22px 48px -16px rgba(32,6,29,0.18)}
.dest-featured-media{position:relative;width:100%;height:230px;background:var(--navy);overflow:hidden}
.dest-featured-media img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.dest-featured-card:hover .dest-featured-media img{transform:scale(1.06)}
.dest-featured-badge{position:absolute;top:14px;left:14px;background:rgba(8,2,12,0.75);backdrop-filter:blur(6px);color:#fff;font-size:0.75rem;font-weight:700;padding:4px 10px;border-radius:999px;border:1px solid rgba(255,255,255,0.2)}
.dest-featured-star{position:absolute;top:14px;right:14px;background:linear-gradient(135deg,#ffaa00,#ff7700);color:#fff;font-size:0.72rem;font-weight:800;padding:3px 9px;border-radius:6px;box-shadow:0 4px 12px rgba(255,170,0,0.4)}
.dest-featured-body{padding:22px;display:flex;flex-direction:column;flex:1;justify-content:space-between}
.dest-featured-body h3{font-family:var(--serif);font-size:1.35rem;color:var(--navy);margin:0 0 8px;line-height:1.25}
.dest-featured-body p{font-size:0.9rem;color:var(--muted);line-height:1.55;margin:0 0 16px;flex:1}
.dest-cta-box{background:linear-gradient(135deg,#180416 0%,#270823 50%,#3d0f36 100%);border-radius:24px;padding:48px 36px;border:1px solid rgba(218,98,125,0.3);box-shadow:0 24px 60px -20px rgba(0,0,0,0.5);text-align:center;margin-top:54px;position:relative;overflow:hidden}
.dest-cta-box::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 0%,rgba(255,165,171,0.15),transparent 70%);pointer-events:none}
.dest-cta-box h2{font-family:var(--serif);font-size:clamp(1.9rem,3.8vw,2.7rem);color:#fff;margin:0 0 14px;position:relative;z-index:2}
.dest-cta-box p{color:rgba(255,255,255,0.85);font-size:1.05rem;line-height:1.65;max-width:720px;margin:0 auto 30px;position:relative;z-index:2}
.dest-cta-actions{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;position:relative;z-index:2}
.btn-wa{background:#25d366!important;color:#fff!important;border:none!important;font-weight:700}
.btn-wa:hover{background:#1ebe5d!important;transform:translateY(-2px);box-shadow:0 8px 24px rgba(37,211,102,0.35)}
.dest-custom-pkg-card{text-align:center;padding:48px 24px;background:#fff;border-radius:20px;border:1.5px dashed var(--line-d);box-shadow:0 12px 30px -15px rgba(0,0,0,0.06)}
.dest-custom-pkg-card h3{font-family:var(--serif);font-size:1.45rem;color:var(--navy);margin:0 0 8px}
.dest-custom-pkg-card p{color:var(--muted);font-size:0.95rem;max-width:540px;margin:0 auto}
@media(max-width:960px){.dest-photos-grid{grid-template-columns:repeat(2,1fr);gap:14px}.dest-featured-grid{grid-template-columns:repeat(2,1fr);gap:18px}}
@media(max-width:640px){.dest-photos-grid{grid-template-columns:1fr;gap:12px}.dest-featured-grid{grid-template-columns:1fr;gap:16px}.dest-cta-box{padding:36px 20px}}


/* ========================================================
   REDESIGNED PACKAGES PAGE STYLES (packages.php)
   - Hero Split Layout with Background Image & Embedded Lead Card
   - Desktop Sticky Sidebar with Live Filters & Sticky Offer Banner
   - Space-Saving Mobile Dropdowns & Multi-Select Checkboxes
   - Luxury Bottom Mountain Call to Action (SEO Semantic H1-H2-H3)
   ======================================================== */

.packages-hero {
  position: relative;
  padding: 95px 0 38px;
  background-color: var(--navy, #02010a);
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  color: #fff;
  overflow: hidden;
}

.packages-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(2, 1, 10, 0.92) 0%, rgba(13, 18, 54, 0.88) 55%, rgba(60, 19, 175, 0.72) 100%);
  pointer-events: none;
}

.packages-hero-container {
  position: relative;
  z-index: 2;
}

.packages-hero-grid {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: 32px;
  align-items: center;
}

.packages-hero-copy {
  display: flex;
  flex-direction: column;
}

.packages-hero-copy .eyebrow {
  margin-bottom: 6px;
}

.packages-hero-copy h1 {
  font-family: var(--serif);
  font-size: clamp(1.75rem, 2.9vw, 2.45rem);
  line-height: 1.15;
  margin: 0 0 4px;
  color: #fff;
  letter-spacing: -0.01em;
  white-space: nowrap;
}

.packages-hero-copy h2.hero-subhead {
  font-family: var(--sans, inherit);
  font-size: clamp(1.05rem, 1.6vw, 1.3rem);
  font-weight: 600;
  color: var(--heading-accent, #ff2a85);
  margin: 0 0 10px;
  line-height: 1.25;
  white-space: nowrap;
  letter-spacing: 0.02em;
}

.packages-hero-copy p.lead-desc {
  font-size: clamp(0.92rem, 1.2vw, 1rem);
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.9);
  margin: 0 0 16px;
  max-width: 580px;
}

/* Native Trust Micro-Grid in Hero */
.packages-trust-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
}

.packages-trust-item {
  display: flex;
  align-items: center;
  gap: 10px;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.16);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  padding: 8px 12px;
  border-radius: 12px;
  transition: background 0.25s, transform 0.25s;
}

.packages-trust-item:hover {
  background: rgba(255, 255, 255, 0.13);
  transform: translateY(-2px);
}

.packages-trust-icon {
  font-size: 1.25rem;
  line-height: 1;
  flex-shrink: 0;
}

.packages-trust-text strong {
  display: block;
  font-size: 0.85rem;
  color: #fff;
  margin-bottom: 2px;
}

.packages-trust-text span {
  display: block;
  font-size: 0.74rem;
  color: rgba(255, 255, 255, 0.75);
  line-height: 1.2;
}

/* Hero Embedded Fixed Inquiry Card */
.hero-inquiry-card {
  background: #ffffff;
  border-radius: 20px;
  padding: 22px 20px;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.35), 0 0 0 1px rgba(255, 255, 255, 0.1);
  color: var(--navy, #02010a);
  position: relative;
  z-index: 3;
}

.hero-inquiry-badge {
  display: inline-block;
  background: rgba(60, 19, 175, 0.08);
  color: var(--berry, #3c13af);
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  padding: 4px 10px;
  border-radius: 999px;
  margin-bottom: 6px;
}

.hero-inquiry-card h3 {
  font-family: var(--serif);
  font-size: 1.28rem;
  color: var(--navy, #02010a);
  margin: 0 0 3px;
  line-height: 1.2;
}

.hero-inquiry-card p.form-sub {
  font-size: 0.8rem;
  color: #6c757d;
  margin: 0 0 14px;
}

.hero-form-field {
  margin-bottom: 11px;
}

.hero-form-field label {
  display: block;
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--navy, #02010a);
  margin-bottom: 4px;
}

.hero-form-field label .req {
  color: #e63946;
}

.hero-form-field .form-control,
.hero-form-field .form-select {
  width: 100%;
  padding: 9px 12px;
  border-radius: 10px;
  border: 1.5px solid #dee2e6;
  font-size: 0.88rem;
  color: #212529;
  background-color: #fdfdfd;
  transition: border-color 0.2s, box-shadow 0.2s;
  box-sizing: border-box;
}

.hero-form-field .form-control:focus,
.hero-form-field .form-select:focus {
  outline: none;
  border-color: var(--berry, #3c13af);
  box-shadow: 0 0 0 3px rgba(60, 19, 175, 0.15);
  background-color: #fff;
}

.hero-captcha-row {
  display: flex;
  align-items: center;
  gap: 10px;
}

.hero-captcha-equation {
  font-family: monospace;
  font-size: 1.05rem;
  font-weight: 700;
  background: #f0edf9;
  color: var(--berry, #3c13af);
  padding: 8px 14px;
  border-radius: 10px;
  letter-spacing: 2px;
  flex-shrink: 0;
  border: 1px dashed rgba(60, 19, 175, 0.3);
}

.hero-captcha-input {
  flex: 1;
}

.hero-captcha-reload {
  background: #f8f9fa;
  border: 1px solid #ced4da;
  border-radius: 10px;
  padding: 8px 12px;
  font-size: 1rem;
  cursor: pointer;
  color: #495057;
  transition: all 0.2s;
}

.hero-captcha-reload:hover {
  background: #e9ecef;
  color: #212529;
}

.btn-hero-submit {
  width: 100%;
  background: linear-gradient(135deg, var(--berry, #3c13af) 0%, #7a0035 100%);
  color: #fff;
  border: none;
  border-radius: 12px;
  padding: 13px 20px;
  font-size: 0.98rem;
  font-weight: 700;
  cursor: pointer;
  transition: transform 0.25s, box-shadow 0.25s;
  box-shadow: 0 8px 24px rgba(60, 19, 175, 0.25);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 6px;
}

.btn-hero-submit:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 30px rgba(60, 19, 175, 0.35);
}

.hero-form-helpline {
  margin-top: 14px;
  text-align: center;
  font-size: 0.82rem;
  color: #6c757d;
}

.hero-form-helpline a {
  color: var(--berry, #3c13af);
  font-weight: 700;
  text-decoration: none;
}

.hero-form-helpline a:hover {
  text-decoration: underline;
}

.hero-form-alert {
  padding: 10px 14px;
  border-radius: 10px;
  font-size: 0.88rem;
  margin-bottom: 14px;
  display: none;
}

.hero-form-alert.success {
  display: block;
  background: #d1e7dd;
  color: #0f5132;
  border: 1px solid #badbcc;
}

.hero-form-alert.error {
  display: block;
  background: #f8d7da;
  color: #842029;
  border: 1px solid #f5c2c7;
}

/* ========================================================
   MAIN PACKAGES CATALOG SECTION
   ======================================================== */
.packages-catalog-section {
  padding: 60px 0 80px;
  background: var(--cream, #f5f2ff);
  min-height: 800px;
}

.packages-section-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 32px;
  flex-wrap: wrap;
  gap: 16px;
}

.packages-header-left .eyebrow {
  margin-bottom: 6px;
}

.packages-header-left h2 {
  font-family: var(--serif);
  font-size: clamp(1.8rem, 3.2vw, 2.5rem);
  color: var(--navy, #02010a);
  margin: 0 0 6px;
  line-height: 1.2;
}

.packages-header-left p {
  color: var(--muted, #6c757d);
  font-size: 0.95rem;
  margin: 0;
}

.packages-count-badge {
  background: #fff;
  border: 1.5px solid var(--line-d, rgba(0,0,0,0.1));
  padding: 8px 18px;
  border-radius: 999px;
  font-size: 0.88rem;
  font-weight: 700;
  color: var(--navy, #02010a);
  box-shadow: 0 4px 12px rgba(0,0,0,0.04);
}

/* Desktop Grid Layout: Sticky Sidebar (310px) + Main Content (1fr) */
.packages-catalog-layout {
  display: grid;
  grid-template-columns: 310px 1fr;
  gap: 36px;
  align-items: start;
}

/* Desktop Sticky Sidebar */
.packages-sidebar {
  position: sticky;
  top: 90px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  max-height: calc(100vh - 110px);
  overflow-y: auto;
  padding-right: 6px;
  scrollbar-width: thin;
  scrollbar-color: rgba(60, 19, 175, 0.25) transparent;
}

.packages-sidebar::-webkit-scrollbar {
  width: 5px;
}

.packages-sidebar::-webkit-scrollbar-thumb {
  background-color: rgba(60, 19, 175, 0.25);
  border-radius: 999px;
}

/* Sidebar Filter Box Card */
.sidebar-filter-card {
  background: #ffffff;
  border-radius: 20px;
  padding: 24px 20px;
  border: 1px solid rgba(0, 0, 0, 0.08);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
}

.sidebar-card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 18px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line-d, #eee);
}

.sidebar-card-header h3 {
  font-family: var(--serif);
  font-size: 1.25rem;
  color: var(--navy, #02010a);
  margin: 0;
  display: flex;
  align-items: center;
  gap: 8px;
}

.btn-clear-filters {
  background: none;
  border: none;
  color: var(--heading-accent, #ff2a85);
  font-size: 0.8rem;
  font-weight: 700;
  cursor: pointer;
  padding: 4px 8px;
  border-radius: 6px;
  transition: background 0.2s;
}

.btn-clear-filters:hover {
  background: rgba(255, 42, 133, 0.08);
}

/* Quick Search Input */
.sidebar-search-box {
  margin-bottom: 20px;
  position: relative;
}

.sidebar-search-box input {
  width: 100%;
  padding: 9px 14px 9px 34px;
  border-radius: 12px;
  border: 1.5px solid #dee2e6;
  font-size: 0.88rem;
  box-sizing: border-box;
  background-color: #fafafa;
  transition: all 0.2s;
}

.sidebar-search-box input:focus {
  outline: none;
  border-color: var(--berry, #3c13af);
  background: #fff;
  box-shadow: 0 0 0 3px rgba(60, 19, 175, 0.1);
}

.sidebar-search-icon {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 0.88rem;
  color: #adb5bd;
  pointer-events: none;
}

/* Filter Group */
.filter-group {
  margin-bottom: 22px;
}

.filter-group:last-child {
  margin-bottom: 0;
}

.filter-group-title {
  font-size: 0.82rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #6c757d;
  margin-bottom: 12px;
  display: flex;
  align-items: center;
  gap: 6px;
}

.filter-options-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.filter-checkbox-label {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 0.88rem;
  color: #2b2d42;
  cursor: pointer;
  padding: 4px 6px;
  border-radius: 8px;
  transition: background 0.2s;
  user-select: none;
}

.filter-checkbox-label:hover {
  background: #f8f6fc;
}

.filter-checkbox-label input[type="checkbox"],
.filter-checkbox-label input[type="radio"] {
  accent-color: var(--berry, #3c13af);
  width: 16px;
  height: 16px;
  cursor: pointer;
  margin: 0;
}

.filter-checkbox-label .filter-name {
  flex: 1;
}

.filter-checkbox-label .filter-count {
  font-size: 0.76rem;
  color: #8d99ae;
  background: #f0edf9;
  padding: 2px 7px;
  border-radius: 999px;
  font-weight: 600;
}

/* Sticky Offer Banner in Sidebar */
.sidebar-offer-banner {
  background: linear-gradient(135deg, #180416 0%, #2d0a3d 50%, #4a0d4e 100%);
  border-radius: 20px;
  padding: 24px 20px;
  color: #fff;
  border: 1px solid rgba(255, 42, 133, 0.35);
  box-shadow: 0 14px 34px rgba(45, 10, 61, 0.28);
  position: relative;
  overflow: hidden;
}

.sidebar-offer-banner::before {
  content: "";
  position: absolute;
  top: -40px;
  right: -40px;
  width: 120px;
  height: 120px;
  background: radial-gradient(circle, rgba(255, 42, 133, 0.3) 0%, transparent 70%);
  pointer-events: none;
}

.sidebar-offer-badge {
  display: inline-block;
  background: rgba(255, 42, 133, 0.2);
  border: 1px solid rgba(255, 42, 133, 0.5);
  color: #ffa5c5;
  font-size: 0.72rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  padding: 4px 10px;
  border-radius: 999px;
  margin-bottom: 10px;
}

.sidebar-offer-banner h3 {
  font-family: var(--serif);
  font-size: 1.28rem;
  color: #fff;
  margin: 0 0 8px;
  line-height: 1.25;
}

.sidebar-offer-banner p {
  font-size: 0.85rem;
  color: rgba(255, 255, 255, 0.86);
  line-height: 1.5;
  margin: 0 0 14px;
}

.sidebar-offer-perks {
  list-style: none;
  padding: 0;
  margin: 0 0 16px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.sidebar-offer-perks li {
  font-size: 0.82rem;
  color: #e2d9f3;
  display: flex;
  align-items: center;
  gap: 6px;
}

.sidebar-offer-perks li span.chk {
  color: #25d366;
  font-weight: 800;
}

.btn-sidebar-offer {
  display: block;
  width: 100%;
  background: #25d366;
  color: #fff;
  text-align: center;
  padding: 10px 14px;
  border-radius: 12px;
  font-size: 0.88rem;
  font-weight: 700;
  text-decoration: none;
  transition: transform 0.2s, background 0.2s;
  box-shadow: 0 6px 16px rgba(37, 211, 102, 0.3);
  box-sizing: border-box;
}

.btn-sidebar-offer:hover {
  background: #1ebe5d;
  color: #fff;
  transform: translateY(-2px);
}

.sidebar-offer-tel {
  margin-top: 10px;
  text-align: center;
  font-size: 0.78rem;
  color: rgba(255, 255, 255, 0.7);
}

.sidebar-offer-tel a {
  color: #ffa5c5;
  font-weight: 700;
  text-decoration: none;
}

/* ========================================================
   MAIN CONTENT AREA & PACKAGES GRID
   ======================================================== */
.packages-main-content {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.packages-active-filters-bar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  min-height: 28px;
}

.active-filter-tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #fff;
  border: 1px solid var(--berry, #3c13af);
  color: var(--berry, #3c13af);
  font-size: 0.8rem;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 999px;
  box-shadow: 0 2px 6px rgba(60, 19, 175, 0.08);
}

.active-filter-tag button {
  background: none;
  border: none;
  color: var(--berry, #3c13af);
  font-weight: 700;
  cursor: pointer;
  padding: 0;
  font-size: 0.85rem;
  line-height: 1;
}

/* Grid layout with 2 columns next to sticky sidebar */
.packages-main-content .pkg-grid {
  grid-template-columns: repeat(2, 1fr);
  gap: 26px;
  margin-top: 0;
}

/* Empty State Card */
.packages-empty-state {
  display: none;
  background: #fff;
  border-radius: 20px;
  padding: 60px 30px;
  text-align: center;
  border: 1.5px dashed #cbd5e1;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.04);
}

.packages-empty-state.show {
  display: block;
}

.packages-empty-state .empty-icon {
  font-size: 3rem;
  margin-bottom: 12px;
}

.packages-empty-state h3 {
  font-family: var(--serif);
  font-size: 1.6rem;
  color: var(--navy, #02010a);
  margin: 0 0 8px;
}

.packages-empty-state p {
  color: var(--muted, #6c757d);
  font-size: 0.98rem;
  max-width: 520px;
  margin: 0 auto 24px;
}

.packages-empty-actions {
  display: flex;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
}

/* ========================================================
   MOBILE FILTER BAR & CONTROLS (d-lg-none)
   ======================================================== */
.mobile-filter-bar {
  display: none;
  background: #ffffff;
  border-radius: 18px;
  padding: 16px;
  margin-bottom: 24px;
  border: 1px solid rgba(0, 0, 0, 0.08);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06);
}

.mobile-filter-selects-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin-bottom: 12px;
}

.mobile-filter-select {
  width: 100%;
  padding: 9px 12px;
  border-radius: 10px;
  border: 1.5px solid #dee2e6;
  font-size: 0.82rem;
  font-weight: 600;
  color: #212529;
  background-color: #fafafa;
  box-sizing: border-box;
}

.mobile-filter-select:focus {
  outline: none;
  border-color: var(--berry, #3c13af);
  background-color: #fff;
}

.btn-mobile-checkboxes-toggle {
  width: 100%;
  background: #f0edf9;
  color: var(--berry, #3c13af);
  border: 1px dashed rgba(60, 19, 175, 0.4);
  padding: 10px 14px;
  border-radius: 10px;
  font-size: 0.85rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  transition: all 0.2s;
}

.btn-mobile-checkboxes-toggle:hover {
  background: #e6e0f7;
}

.mobile-checkboxes-drawer {
  display: none;
  padding-top: 14px;
  margin-top: 14px;
  border-top: 1px solid #eee;
}

.mobile-checkboxes-drawer.open {
  display: block;
}

.mobile-drawer-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
  margin-bottom: 14px;
}

.mobile-drawer-footer {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  padding-top: 8px;
}

/* ========================================================
   REDESIGNED LUXURY BOTTOM CALL TO ACTION
   ======================================================== */
.packages-bottom-cta {
  background: linear-gradient(135deg, #02010A 0%, #0D1236 55%, #3C13AF 100%);
  border-radius: 20px;
  padding: 34px 28px;
  color: #fff;
  position: relative;
  overflow: hidden;
  margin-top: 40px;
  box-shadow: 0 16px 40px rgba(2, 1, 10, 0.25);
  border: 1px solid rgba(255, 255, 255, 0.22); box-shadow: 0 4px 14px rgba(0, 0, 0, 0.5);
}

.packages-bottom-cta::before {
  content: "";
  position: absolute;
  top: 0;
  left: 20%;
  width: 60%;
  height: 100%;
  background: radial-gradient(circle, rgba(255, 42, 133, 0.15) 0%, transparent 70%);
  pointer-events: none;
}

.packages-cta-content {
  position: relative;
  z-index: 2;
  text-align: center;
  max-width: 760px;
  margin: 0 auto;
}

.packages-bottom-cta h2 {
  font-family: var(--serif);
  font-size: clamp(1.4rem, 2.5vw, 1.85rem);
  color: #fff;
  line-height: 1.22;
  margin: 0 0 8px;
}

.packages-bottom-cta h2 em {
  color: var(--heading-accent, #ff2a85);
  font-style: italic;
}

.packages-bottom-cta p.cta-desc {
  font-size: 0.92rem;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.88);
  margin: 0 auto 20px;
  max-width: 580px;
}

/* Bottom CTA Actions */
.packages-cta-actions {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.btn-cta-wa {
  background: #25d366;
  color: #fff;
  border: none;
  font-weight: 700;
  font-size: 0.95rem;
  padding: 11px 22px;
  border-radius: 12px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  box-shadow: 0 6px 18px rgba(37, 211, 102, 0.3);
  transition: transform 0.25s, box-shadow 0.25s;
}

.btn-cta-wa:hover {
  background: #1ebe5d;
  color: #fff;
  transform: translateY(-2px);
  box-shadow: 0 10px 24px rgba(37, 211, 102, 0.4);
}

.btn-cta-call {
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
  border: 1.5px solid rgba(255, 255, 255, 0.35);
  backdrop-filter: blur(8px);
  font-weight: 700;
  font-size: 0.95rem;
  padding: 11px 20px;
  border-radius: 12px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: all 0.25s;
}

.btn-cta-call:hover {
  background: rgba(255, 255, 255, 0.22);
  color: #fff;
  transform: translateY(-2px);
  border-color: #fff;
}

.btn-cta-custom {
  background: linear-gradient(135deg, var(--heading-accent, #ff2a85) 0%, #ff5277 100%);
  color: #fff;
  border: none;
  font-weight: 700;
  font-size: 1.05rem;
  padding: 14px 26px;
  border-radius: 14px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  box-shadow: 0 10px 25px rgba(255, 42, 133, 0.3);
  transition: transform 0.25s, box-shadow 0.25s;
}

.btn-cta-custom:hover {
  transform: translateY(-3px);
  box-shadow: 0 15px 35px rgba(255, 42, 133, 0.45);
}

/* ========================================================
   RESPONSIVE BREAKPOINTS (packages.php)
   ======================================================== */
@media (max-width: 1199px) {
  .packages-hero-grid {
    grid-template-columns: 1fr 1fr;
    gap: 32px;
  }
  .packages-catalog-layout {
    grid-template-columns: 280px 1fr;
    gap: 24px;
  }
}

@media (max-width: 991px) {
  .packages-hero {
    padding: 110px 0 50px;
  }
  .packages-hero-grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .packages-trust-grid {
    margin-bottom: 0;
  }
  .packages-catalog-layout {
    grid-template-columns: 1fr;
  }
  .packages-sidebar {
    display: none; /* Hide heavy sidebar on mobile/tablet */
  }
  .mobile-filter-bar {
    display: block; /* Show sleek mobile filter bar */
  }
  .packages-main-content .pkg-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }
  .packages-cta-guarantees {
    grid-template-columns: repeat(2, 1fr);
  }
  .packages-bottom-cta {
    padding: 44px 24px;
  }
}

@media (max-width: 640px) {
  .packages-hero {
    padding: 95px 0 40px;
  }
  .packages-trust-grid {
    grid-template-columns: 1fr;
  }
  .hero-inquiry-card {
    padding: 24px 18px;
  }
  .mobile-filter-selects-row {
    grid-template-columns: 1fr;
  }
  .mobile-drawer-grid {
    grid-template-columns: 1fr;
  }
  .packages-main-content .pkg-grid {
    grid-template-columns: 1fr;
  }
  .packages-cta-guarantees {
    grid-template-columns: 1fr;
  }
  .packages-cta-actions {
    flex-direction: column;
    width: 100%;
  }
  .btn-cta-wa, .btn-cta-call, .btn-cta-custom {
    width: 100%;
    justify-content: center;
  }
}


/* ========================================================
   SINGLE TOUR PACKAGE DETAIL PAGE (package.php)
   - 5-Image Showcase Mosaic (1 Portrait Left + 4 Images Right on White BG)
   - Boxy Destination Nights & Places Box
   - Detailed Day-by-Day Itinerary (Journey time, distance, justified text, meals & transit)
   - Route Map Embed & Inclusions/Exclusions (2 Columns)
   - Nearby Trips Add-on Cards
   - Fixed Sticky Sidebar on PC (Price Dropdown, Quick Inquiry without Captcha, Highlights, Offer Image)
   - Mobile Flow: Itinerary -> Inquiry Card -> Map -> Inclusions -> Nearby
   - 5 Related Tours with 5 Light Pastel Background Colors
   ======================================================== */

/* 5-Image Showcase Mosaic (Fluid & Fully Responsive) */
.pkg-showcase-card {
  background: #ffffff;
  border-radius: 20px;
  padding: 12px;
  border: 1.5px solid var(--line-d, #dee2e6);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
  margin-bottom: 28px;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  overflow: hidden;
}

.pkg-showcase-mosaic {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  width: 100%;
  border-radius: 14px;
  overflow: hidden;
  box-sizing: border-box;
}

.pkg-mosaic-main {
  position: relative;
  width: 100%;
  aspect-ratio: 3 / 2;
  overflow: hidden;
  border-radius: 12px;
  background: #f0f0f0;
  cursor: pointer;
}

.pkg-mosaic-main img {
  width: 100%;
  height: 100%;
  max-width: 100%;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  object-position: center;
  display: block;
  transition: transform 0.4s ease, opacity 0.2s ease;
}

.pkg-mosaic-main:hover img {
  transform: scale(1.02);
}

.pkg-mosaic-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(2, 1fr);
  gap: 10px;
  width: 100%;
  height: 100%;
}

.pkg-mosaic-thumb {
  position: relative;
  width: 100%;
  aspect-ratio: 3 / 2;
  overflow: hidden;
  border-radius: 12px;
  background: #f0f0f0;
  cursor: pointer;
}

.pkg-mosaic-thumb img {
  width: 100%;
  height: 100%;
  max-width: 100%;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  object-position: center;
  display: block;
  transition: transform 0.3s ease, opacity 0.2s;
}

.pkg-mosaic-thumb:hover img {
  transform: scale(1.04);
  opacity: 0.95;
}

/* Lightbox Modal (Enforces clean 3:2 landscape display) */
.pkg-lightbox-modal {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 99999;
  background: rgba(10, 15, 30, 0.94);
  backdrop-filter: blur(8px);
  align-items: center;
  justify-content: center;
  padding: 24px;
}

.pkg-lightbox-modal.active {
  display: flex;
}

.pkg-lightbox-content {
  position: relative;
  max-width: 980px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.pkg-lightbox-img-wrap {
  width: 100%;
  aspect-ratio: 3 / 2;
  max-height: 80vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #000;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 25px 60px rgba(0, 0, 0, 0.6);
  border: 1px solid rgba(255, 255, 255, 0.15);
}

.pkg-lightbox-img-wrap img {
  width: 100%;
  height: 100%;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  display: block;
}

.pkg-lightbox-close {
  position: absolute;
  top: -46px;
  right: 0;
  background: rgba(255, 255, 255, 0.15);
  border: none;
  color: #fff;
  font-size: 20px;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s;
}

.pkg-lightbox-close:hover {
  background: #e74c3c;
}

.pkg-lightbox-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(0, 0, 0, 0.65);
  border: 1px solid rgba(255, 255, 255, 0.25);
  color: #fff;
  font-size: 22px;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
  transition: background 0.2s;
}

.pkg-lightbox-nav:hover {
  background: var(--navy, #1e293b);
}

.pkg-lightbox-prev {
  left: -22px;
}

.pkg-lightbox-next {
  right: -22px;
}

.pkg-lightbox-counter {
  position: absolute;
  bottom: -36px;
  left: 50%;
  transform: translateX(-50%);
  color: rgba(255, 255, 255, 0.85);
  font-size: 0.88rem;
  font-weight: 600;
  letter-spacing: 0.5px;
}

/* Two-Column Tour Page Layout */
.tour-detail-layout {
  display: grid;
  grid-template-columns: 1fr 340px;
  gap: 36px;
  align-items: start;
}

.tour-detail-main {
  min-width: 0;
}

.tour-detail-sidebar {
  position: sticky;
  top: 85px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

/* Header & Meta Ribbons */
.pkg-main-header {
  margin-bottom: 24px;
}

.pkg-main-header h1 {
  font-family: var(--serif, serif);
  font-size: clamp(2rem, 3.4vw, 2.7rem);
  color: var(--navy, #02010a);
  line-height: 1.2;
  margin: 0 0 12px;
}

.pkg-ribbon-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-bottom: 16px;
}

.pkg-ribbon-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 12px;
  border-radius: 8px;
  font-size: 0.82rem;
  font-weight: 700;
  line-height: 1;
}

.pkg-ribbon-duration {
  background: var(--navy, #02010a);
  color: #fff;
}

.pkg-ribbon-distance {
  background: #ecfdf5;
  color: #047857;
  border: 1px solid #a7f3d0;
}

.pkg-ribbon-vehicle {
  background: #e0f2fe;
  color: #0369a1;
  border: 1px solid #bae6fd;
}

.pkg-ribbon-theme {
  background: #f3e8ff;
  color: #7e22ce;
  border: 1px solid #e9d5ff;
}

.pkg-ribbon-rating {
  background: #fef3c7;
  color: #b45309;
  border: 1px solid #fde68a;
}

/* Destination Nights in Boxy Colours */
.pkg-dest-nights-wrap {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-bottom: 18px;
  padding: 12px 16px;
  background: #ffffff;
  border: 1.5px solid var(--line-d, #eee);
  border-radius: 14px;
}

.pkg-dest-nights-label {
  font-size: 0.82rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--muted, #64748b);
  display: flex;
  align-items: center;
  gap: 6px;
}

.pkg-dest-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: 8px;
  font-size: 0.84rem;
  font-weight: 700;
}

.pkg-dest-badge.c1 { background: #eff6ff; color: #1d4ed8; border: 1px solid #bfdbfe; }
.pkg-dest-badge.c2 { background: #fdf2f8; color: #be185d; border: 1px solid #fbcfe8; }
.pkg-dest-badge.c3 { background: #ecfdf5; color: #047857; border: 1px solid #a7f3d0; }
.pkg-dest-badge.c4 { background: #fffbeb; color: #b45309; border: 1px solid #fde68a; }
.pkg-dest-badge.c5 { background: #faf5ff; color: #6b21a8; border: 1px solid #e9d5ff; }

/* Places Included Box with | Separation */
.pkg-places-included-box {
  background: #fafafc;
  border: 1.5px dashed var(--line-d, #cbd5e1);
  border-radius: 12px;
  padding: 12px 16px;
  margin-bottom: 24px;
}

.pkg-places-label {
  font-size: 0.8rem;
  font-weight: 800;
  color: var(--heading-accent, #ff2a85);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 6px;
  display: flex;
  align-items: center;
  gap: 6px;
}

.pkg-places-content {
  font-size: 0.9rem;
  color: #334155;
  line-height: 1.6;
  font-weight: 500;
}

.pkg-places-content span.sep {
  color: #94a3b8;
  margin: 0 8px;
  font-weight: 300;
}

/* Tour Description */
.pkg-overview-text {
  font-size: 1rem;
  line-height: 1.7;
  color: #334155;
  margin-bottom: 36px;
}

/* Day-by-Day Detailed Itinerary */
.pkg-itinerary-section {
  margin-bottom: 40px;
}

.pkg-itin-day-card {
  background: #ffffff;
  border-radius: 16px;
  border: 1.5px solid var(--line-d, #e2e8f0);
  padding: 22px 24px;
  margin-bottom: 20px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.03);
  transition: transform 0.2s, border-color 0.2s;
}

.pkg-itin-day-card:hover {
  border-color: rgba(60, 19, 175, 0.3);
  transform: translateY(-2px);
}

.pkg-day-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 12px;
  padding-bottom: 12px;
  border-bottom: 1px solid #f1f5f9;
}

.pkg-day-title-grp {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.pkg-day-num-badge {
  background: linear-gradient(135deg, var(--navy, #02010a), #3c13af);
  color: #fff;
  font-size: 0.85rem;
  font-weight: 800;
  padding: 5px 12px;
  border-radius: 8px;
  letter-spacing: 0.04em;
}

.pkg-day-heading {
  font-family: var(--serif, serif);
  font-size: 1.25rem;
  color: var(--navy, #02010a);
  margin: 0;
  line-height: 1.25;
}

.pkg-day-travel-stat {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  padding: 5px 12px;
  border-radius: 999px;
  font-size: 0.8rem;
  font-weight: 700;
  color: #475569;
}

.pkg-day-desc {
  font-size: 0.94rem;
  line-height: 1.7;
  color: #334155;
  text-align: justify;
  word-wrap: break-word;
  margin: 0 0 14px;
}

.pkg-day-places-today {
  background: #f1f5f9;
  border-left: 3px solid var(--berry, #3c13af);
  padding: 8px 14px;
  border-radius: 0 8px 8px 0;
  font-size: 0.86rem;
  color: #1e293b;
  margin-bottom: 12px;
}

.pkg-day-places-today strong {
  color: var(--navy, #02010a);
}

.pkg-day-perks-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  padding-top: 10px;
  border-top: 1px dashed #e2e8f0;
}

.pkg-perk-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.78rem;
  font-weight: 700;
  padding: 3px 10px;
  border-radius: 6px;
}

.pkg-perk-meal {
  background: #fef3c7;
  color: #92400e;
  border: 1px solid #fde68a;
}

.pkg-perk-transit {
  background: #ecfdf5;
  color: #065f46;
  border: 1px solid #a7f3d0;
}

/* Route Map */
.pkg-map-wrapper {
  background: #ffffff;
  border-radius: 18px;
  border: 1.5px solid var(--line-d, #e2e8f0);
  overflow: hidden;
  margin-bottom: 40px;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.04);
}

.pkg-map-header {
  padding: 16px 20px;
  border-bottom: 1px solid #e2e8f0;
  background: #f8fafc;
}

.pkg-map-header h3 {
  font-family: var(--serif, serif);
  font-size: 1.25rem;
  color: var(--navy, #02010a);
  margin: 0 0 2px;
}

.pkg-map-header p {
  font-size: 0.82rem;
  color: #64748b;
  margin: 0;
}

.pkg-map-wrapper {
  position: relative;
  isolation: isolate;
}

.pkg-map-frame-box {
  position: relative !important;
  width: 100%;
  height: 420px;
  overflow: hidden !important;
  border-radius: 14px;
  background-color: #f1f5f9;
  isolation: isolate;
}

.pkg-map-frame-box > div {
  position: relative !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 100% !important;
  padding-bottom: 0 !important;
  margin: 0 !important;
}

.pkg-map-frame-box iframe {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  border: none !important;
  border-radius: 14px;
}

/* Inclusions & Exclusions 2-Column Grid */
.pkg-inc-exc-container {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
  margin-bottom: 40px;
}

.pkg-inc-card, .pkg-exc-card {
  background: #ffffff;
  border-radius: 16px;
  padding: 24px 20px;
  border: 1.5px solid var(--line-d, #e2e8f0);
}

.pkg-inc-card { border-top: 4px solid #10b981; }
.pkg-exc-card { border-top: 4px solid #ef4444; }

.pkg-inc-head, .pkg-exc-head {
  font-family: var(--serif, serif);
  font-size: 1.22rem;
  margin: 0 0 16px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.pkg-inc-head { color: #065f46; }
.pkg-exc-head { color: #991b1b; }

.pkg-inc-list, .pkg-exc-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.pkg-inc-list li, .pkg-exc-list li {
  font-size: 0.9rem;
  line-height: 1.5;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  color: #334155;
}

.pkg-inc-list li span.icon { color: #10b981; font-weight: 900; }
.pkg-exc-list li span.icon { color: #ef4444; font-weight: 900; }

/* Nearby Add-On Trips */
.pkg-nearby-wrap {
  margin-bottom: 40px;
}

.pkg-nearby-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 16px;
  margin-top: 14px;
}

.pkg-nearby-card {
  background: #ffffff;
  border: 1.5px solid var(--line-d, #e2e8f0);
  border-radius: 14px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  transition: transform 0.2s, box-shadow 0.2s;
}

.pkg-nearby-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 20px rgba(0,0,0,0.06);
}

.pkg-nearby-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 8px;
  margin-bottom: 6px;
}

.pkg-nearby-top strong {
  font-size: 0.95rem;
  color: var(--navy, #02010a);
}

.pkg-nearby-dist {
  background: #f1f5f9;
  color: #475569;
  font-size: 0.74rem;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 6px;
  white-space: nowrap;
}

.pkg-nearby-card p {
  font-size: 0.85rem;
  color: #64748b;
  line-height: 1.5;
  margin: 0 0 10px;
}

.pkg-nearby-extra-tag {
  font-size: 0.76rem;
  font-weight: 700;
  color: #d97706;
  background: #fffbeb;
  border: 1px dashed #fde68a;
  padding: 4px 8px;
  border-radius: 6px;
  display: inline-block;
}

/* Sidebar Components */
.pkg-sidebar-card {
  background: #ffffff;
  border-radius: 18px;
  padding: 22px;
  border: 1.5px solid var(--line-d, #e2e8f0);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
}

.pkg-sidebar-price-row {
  margin-bottom: 16px;
  padding: 14px 16px;
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(147, 51, 234, 0.08), rgba(219, 39, 119, 0.08));
  border: 1.5px solid rgba(147, 51, 234, 0.22);
}

.pkg-sidebar-price-prefix {
  font-size: 0.8rem;
  color: #7e22ce;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-weight: 800;
  display: block;
  margin-bottom: 4px;
}

.pkg-sidebar-price-val {
  font-family: var(--serif, serif);
  font-size: 2.1rem;
  font-weight: 800;
  color: #9333ea;
  background: linear-gradient(135deg, #7e22ce 0%, #db2777 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  line-height: 1.1;
  display: inline-block;
}

.pkg-sidebar-tier-select {
  width: 100%;
  padding: 8px 12px;
  border-radius: 10px;
  border: 1.5px solid #d8b4fe;
  font-size: 0.85rem;
  font-weight: 600;
  color: #4a044e;
  background-color: #fff;
  margin-top: 8px;
}

/* Quick Inquiry Form (Name, Phone only, NO CAPTCHA) */
.pkg-quick-form {
  background: #f8fafc;
  border-radius: 14px;
  padding: 16px;
  border: 1px solid #e2e8f0;
  margin-bottom: 18px;
}

.pkg-quick-form-title {
  font-family: var(--serif, serif);
  font-size: 1.15rem;
  color: var(--navy, #02010a);
  margin: 0 0 2px;
  line-height: 1.25;
}

.pkg-quick-form-sub {
  font-size: 0.78rem;
  color: #64748b;
  margin: 0 0 12px;
}

.pkg-quick-field {
  margin-bottom: 10px;
}

.pkg-quick-field input {
  width: 100%;
  padding: 9px 12px;
  border-radius: 8px;
  border: 1.5px solid #cbd5e1;
  font-size: 0.86rem;
  box-sizing: border-box;
  background: #fff;
}

.pkg-quick-field input:focus {
  outline: none;
  border-color: #9333ea;
  box-shadow: 0 0 0 3px rgba(147, 51, 234, 0.15);
}

.btn-quick-submit {
  width: 100%;
  background: linear-gradient(135deg, #7e22ce, #db2777);
  color: #fff;
  border: none;
  border-radius: 10px;
  padding: 11px 16px;
  font-size: 0.88rem;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 6px 16px rgba(126, 34, 206, 0.28);
  transition: transform 0.2s, box-shadow 0.2s;
}

.btn-quick-submit:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(126, 34, 206, 0.38);
}

/* Sidebar Contact Buttons (Side by Side in 1 Row: Left WhatsApp, Right Call) */
.pkg-sidebar-contact-btns {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 10px !important;
  margin-bottom: 20px;
}

.btn-sidebar-wa {
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 6px;
  background: #25d366;
  color: #fff !important;
  padding: 11px 8px;
  border-radius: 10px;
  font-size: 0.86rem;
  font-weight: 700;
  text-decoration: none;
  box-shadow: 0 4px 12px rgba(37, 211, 102, 0.25);
  transition: all 0.2s;
  white-space: nowrap;
  text-align: center;
}

.btn-sidebar-wa:hover {
  background: #1ebe5d;
  color: #fff !important;
  transform: translateY(-2px);
}

.btn-sidebar-call {
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 6px;
  background: #ffffff;
  color: var(--navy, #02010a) !important;
  border: 1.5px solid var(--navy, #02010a);
  padding: 10px 8px;
  border-radius: 10px;
  font-size: 0.86rem;
  font-weight: 700;
  text-decoration: none;
  transition: all 0.2s;
  white-space: nowrap;
  text-align: center;
}

.btn-sidebar-call:hover {
  background: var(--navy, #02010a);
  color: #fff !important;
}

/* Trip Highlights */
.pkg-sidebar-highlights {
  margin-bottom: 18px;
}

.pkg-sidebar-highlights h4, .pkg-sidebar-highlights h3 {
  font-family: var(--serif, serif);
  font-size: 1.15rem;
  color: var(--navy, #02010a);
  margin: 0 0 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid #f1f5f9;
}

.pkg-highlights-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.pkg-highlights-list li {
  font-size: 0.84rem;
  line-height: 1.45;
  color: #334155;
  display: flex;
  align-items: flex-start;
  gap: 8px;
}

.pkg-highlights-list li span.chk {
  color: #10b981;
  font-weight: 900;
}

/* Sidebar Themes & Rating Trust Box (Positioned After Trip Highlights) */
.pkg-sidebar-trust-box {
  background: #fdf4ff;
  border: 1.5px solid #f0abfc;
  border-radius: 14px;
  padding: 14px 16px;
  margin-bottom: 20px;
}

.pkg-sidebar-themes-list {
  display: flex;
  flex-direction: column;
  gap: 7px;
  margin-bottom: 12px;
}

.pkg-sidebar-theme-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.86rem;
  font-weight: 700;
  color: #7e22ce;
  background: #fae8ff;
  border: 1px solid #f5d0fe;
  padding: 4px 10px;
  border-radius: 8px;
  width: fit-content;
}

.pkg-sidebar-rating-badge {
  display: flex;
  align-items: center;
  gap: 8px;
  background: #fffbeb;
  border: 1px solid #fde68a;
  border-radius: 8px;
  padding: 6px 12px;
  font-size: 0.86rem;
  font-weight: 800;
}

.pkg-sidebar-rating-badge .stars {
  color: #b45309;
}

.pkg-sidebar-rating-badge .verified-text {
  color: #78350f;
  font-weight: 700;
  font-size: 0.8rem;
}

/* Offer Banner in Sidebar */
.pkg-sidebar-offer-banner {
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 8px 24px rgba(0,0,0,0.08);
  border: 1px solid var(--line-d, #e2e8f0);
}

.pkg-sidebar-offer-banner img {
  width: 100%;
  display: block;
  object-fit: cover;
}

/* Mobile Specific Containers (Hidden on Desktop) */
.pkg-mobile-top-booking,
.pkg-mobile-after-itin {
  display: none;
}

/* Up to 5 Related Travel Packages with Light Pastel Colors */
.pkg-related-section {
  padding: 48px 0 60px;
  background: #ffffff;
  border-top: 1px solid var(--line-d, #eee);
  margin-top: 50px;
}

.pkg-related-section-header {
  text-align: center;
  margin-bottom: 32px;
}

.pkg-related-section-header h2 {
  font-family: var(--serif, serif);
  font-size: clamp(1.8rem, 3.2vw, 2.4rem);
  color: var(--navy, #02010a);
  margin: 0 0 8px;
}

.pkg-related-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 20px;
}
@media (min-width: 992px) {
  .pkg-related-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

.pkg-related-card {
  border-radius: 16px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  padding: 16px;
}

.pkg-related-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.08);
}

/* 5 Distinct Soft Light Pastel Color Themes */
.pkg-related-card.pastel-sky {
  background: #f0f7ff;
  border: 1.5px solid #d0e4fa;
}
.pkg-related-card.pastel-lavender {
  background: #f8f4ff;
  border: 1.5px solid #e8dcff;
}
.pkg-related-card.pastel-peach {
  background: #fff5f2;
  border: 1.5px solid #fedcd2;
}
.pkg-related-card.pastel-mint {
  background: #f0faf4;
  border: 1.5px solid #d2f0df;
}
.pkg-related-card.pastel-amber {
  background: #fffcf0;
  border: 1.5px solid #fdeec6;
}

.pkg-related-media {
  position: relative;
  width: 100%;
  height: 150px;
  border-radius: 12px;
  overflow: hidden;
  margin-bottom: 12px;
}

.pkg-related-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s ease;
}

.pkg-related-card:hover .pkg-related-media img {
  transform: scale(1.06);
}

.pkg-related-duration {
  position: absolute;
  bottom: 8px;
  left: 8px;
  background: rgba(2, 1, 10, 0.8);
  color: #fff;
  font-size: 0.72rem;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 6px;
  backdrop-filter: blur(4px);
}

.pkg-related-body {
  display: flex;
  flex-direction: column;
  flex: 1;
  justify-content: space-between;
}

.pkg-related-title {
  font-family: var(--serif, serif);
  font-size: 1.08rem;
  color: var(--navy, #02010a);
  margin: 0 0 6px;
  line-height: 1.3;
}

.pkg-related-title a {
  color: inherit;
  text-decoration: none;
}

.pkg-related-price {
  font-size: 0.95rem;
  font-weight: 800;
  color: #7e22ce;
  margin: 8px 0 12px;
}

.pkg-related-price small {
  font-size: 0.75rem;
  color: #64748b;
  font-weight: normal;
}

.pkg-related-btn {
  display: block;
  text-align: center;
  background: #ffffff;
  color: var(--navy, #02010a);
  border: 1px solid rgba(0, 0, 0, 0.12);
  padding: 7px 12px;
  border-radius: 8px;
  font-size: 0.82rem;
  font-weight: 700;
  text-decoration: none;
  transition: all 0.2s;
}

.pkg-related-btn:hover {
  background: var(--navy, #02010a);
  color: #fff;
}

/* Mobile Responsive Adjustments */
@media (max-width: 991px) {
  .tour-detail-layout {
    grid-template-columns: 1fr;
  }
  
  .tour-detail-sidebar {
    position: static;
    display: none; /* Hidden from side on mobile; rendered inline after itinerary! */
  }

  .pkg-mobile-top-booking {
    display: block !important;
    margin: 18px 0 24px;
  }

  .pkg-mobile-after-itin {
    display: block !important;
    margin: 24px 0;
  }

  .pkg-mobile-inquiry-block {
    display: none !important;
  }

  .pkg-inc-exc-container {
    grid-template-columns: 1fr;
    gap: 16px;
  }
}

@media (max-width: 768px) {
  .pkg-showcase-card {
    padding: 8px;
    border-radius: 14px;
    margin-bottom: 20px;
  }
  .pkg-showcase-mosaic {
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    border-radius: 10px;
  }
  .pkg-mosaic-grid {
    gap: 8px;
  }
  .pkg-mosaic-main,
  .pkg-mosaic-thumb {
    aspect-ratio: 3 / 2;
    border-radius: 8px;
  }
  .pkg-mosaic-main img,
  .pkg-mosaic-thumb img {
    aspect-ratio: 3 / 2;
    object-fit: cover;
  }
  .pkg-main-header h1 {
    font-size: 1.7rem;
  }
  .pkg-day-header {
    flex-direction: column;
  }
  .pkg-map-frame-box {
    height: 300px !important;
  }
}

@media (max-width: 480px) {
  .pkg-showcase-card {
    padding: 6px;
    border-radius: 12px;
    margin-bottom: 16px;
  }
  .pkg-showcase-mosaic {
    grid-template-columns: 1fr 1fr;
    gap: 6px;
    border-radius: 8px;
  }
  .pkg-mosaic-grid {
    gap: 6px;
  }
  .pkg-mosaic-main,
  .pkg-mosaic-thumb {
    aspect-ratio: 3 / 2;
    border-radius: 6px;
  }
  .pkg-mosaic-main img,
  .pkg-mosaic-thumb img {
    aspect-ratio: 3 / 2;
    object-fit: cover;
  }
}

/* ========================================================
   SITEWIDE FIXED MOBILE FOOTER (WHATSAPP LEFT & CALL RIGHT)
   Visible ONLY on Mobile Devices (<= 768px)
   ======================================================== */
.mobile-fixed-footer {
  display: none;
}

@media (max-width: 768px) {
  .mobile-fixed-footer {
    display: flex !important;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 99999;
    background: #000000 !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-top: 1px solid rgba(255, 255, 255, 0.12);
    box-shadow: 0 -8px 26px rgba(0, 0, 0, 0.7);
    padding: 8px 12px;
    padding-bottom: max(8px, env(safe-area-inset-bottom));
    gap: 10px;
    align-items: center;
    box-sizing: border-box;
  }

  .m-footer-btn {
    flex: 1;
    min-height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border-radius: 12px;
    font-family: var(--sans, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif);
    font-size: 0.96rem;
    font-weight: 700;
    letter-spacing: 0.01em;
    text-decoration: none;
    transition: transform 0.15s ease, opacity 0.15s ease, box-shadow 0.15s ease;
    box-sizing: border-box;
    padding: 10px 14px;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
  }

  .m-footer-btn:active {
    transform: scale(0.97);
    opacity: 0.92;
  }

  /* Left-Aligned WhatsApp Button */
  .m-footer-whatsapp {
    background: linear-gradient(135deg, #0284c7 0%, #0369a1 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 4px 14px rgba(2, 132, 199, 0.45); border: 1px solid rgba(255, 255, 255, 0.2);
    order: 1;
  }

  /* Right-Aligned Call Button */
  .m-footer-call {
    background: linear-gradient(135deg, #180f28 0%, #251238 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 4px 14px rgba(2, 1, 10, 0.28);
    order: 2;
    border: 1px solid rgba(255, 255, 255, 0.22); box-shadow: 0 4px 14px rgba(0, 0, 0, 0.5);
  }

  .m-footer-icon {
    flex-shrink: 0;
    display: block;
  }

  .action-bar {
    display: none !important;
  }

  .fab-wa {
    display: none !important;
  }

  .footer {
    padding-bottom: 85px !important;
  }

  body {
    padding-bottom: 20px;
  }
}


/* Hide floating footer bar when offcanvas mobile menu is open */
body.canvas-open .mobile-fixed-footer {
  opacity: 0 !important;
  pointer-events: none !important;
  transform: translateY(100%) !important;
  transition: transform 0.25s ease, opacity 0.25s ease !important;
}

/* PC Screen Header WhatsApp Instant Quote Button */
.btn-header-wa {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  background: #25D366;
  background: linear-gradient(135deg, #25D366 0%, #128C7E 100%);
  color: #ffffff !important;
  font-weight: 700;
  font-size: 0.92rem;
  letter-spacing: 0.02em;
  padding: 9px 18px;
  border-radius: 999px;
  text-decoration: none !important;
  border: 1px solid rgba(255, 255, 255, 0.3);
  box-shadow: 0 4px 16px rgba(37, 211, 102, 0.42);
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
  white-space: nowrap;
  cursor: pointer;
}
.btn-header-wa:hover {
  background: linear-gradient(135deg, #2ae26d 0%, #169b8c 100%);
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(37, 211, 102, 0.58);
  color: #ffffff !important;
}
@media (max-width: 991px) {
  .nav,
  .nav.solid,
  .nav-inner-page {
    background: #000000 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
    height: 64px !important;
    min-height: 64px !important;
    padding: 0 !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.6) !important;
  }
  .nav-inner {
    height: 64px !important;
    padding: 0 20px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
  }
  .brand {
    display: flex !important;
    align-items: center !important;
    flex-shrink: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
  }
  .brand-logo-img {
    height: 48px !important;
    width: auto !important;
    max-height: 50px !important;
    max-width: 220px !important;
    object-fit: contain !important;
    transform: translateZ(0);
  }
  .nav-links {
    display: none !important;
  }
  .nav-cta {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin-left: auto !important;
    flex-shrink: 0 !important;
  }
  .nav-cta .btn,
  .nav-cta .btn-glass,
  .nav-cta .btn-primary,
  .nav-cta .btn-header-wa {
    display: none !important;
  }
  .hamburger {
    display: flex !important;
    flex-direction: column !important;
    gap: 5px !important;
    padding: 8px 4px !important;
    background: none !important;
    border: none !important;
    cursor: pointer !important;
  }
  .hamburger span {
    width: 24px !important;
    height: 2px !important;
    background: #ffffff !important;
    border-radius: 2px !important;
    display: block !important;
  }
}

@media (max-width: 480px) {
  .nav,
  .nav.solid,
  .nav-inner-page {
    height: 62px !important;
    min-height: 62px !important;
  }
  .nav-inner {
    height: 62px !important;
    /* Equalized spacing: logo has equal balanced padding from left edge and to language menu */
    padding-left: 44px !important;
    padding-right: 12px !important;
  }
  .brand-logo-img {
    height: 44px !important;
    max-height: 46px !important;
    max-width: 195px !important;
  }
  .site-lang-btn {
    padding: 5px 8px !important;
    font-size: 0.78rem !important;
    gap: 4px !important;
  }
  .hamburger {
    padding: 6px 3px !important;
  }
}

@media (max-width: 360px) {
  .nav-inner {
    padding-left: 18px !important;
    padding-right: 8px !important;
  }
  .brand-logo-img {
    height: 40px !important;
    max-height: 42px !important;
    max-width: 170px !important;
  }
}

/* ========================================================
   LOCAL NATIVE MOUNTAIN DIARY (हस्तलिखित पहाड़ी डायरी)
   ======================================================== */
.pkg-local-diary-section {
  margin: 32px 0 28px;
  position: relative;
}

.pkg-local-diary-card {
  position: relative;
  background: #fffdf8;
  background-image:
    radial-gradient(#eddcc8 0.8px, transparent 0.8px),
    linear-gradient(135deg, #fffef9 0%, #faf4e8 100%);
  background-size: 16px 16px, 100% 100%;
  border: 1.5px dashed #d5bca1;
  border-left: 6px solid #a53860;
  border-radius: 18px;
  padding: 30px 32px;
  box-shadow:
    0 16px 36px -10px rgba(61, 11, 55, 0.09),
    0 2px 6px rgba(0, 0, 0, 0.04),
    inset 0 0 50px rgba(245, 230, 208, 0.4);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.pkg-local-diary-card:hover {
  box-shadow:
    0 20px 44px -8px rgba(61, 11, 55, 0.13),
    0 4px 10px rgba(0, 0, 0, 0.06),
    inset 0 0 55px rgba(245, 230, 208, 0.5);
}

.diary-stamp-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(165, 56, 96, 0.08);
  color: #8c244b;
  border: 1px solid rgba(165, 56, 96, 0.32);
  padding: 5px 12px;
  border-radius: 4px;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.4px;
  margin-bottom: 16px;
  text-transform: uppercase;
}

.diary-stamp-badge small {
  opacity: 0.82;
  font-weight: 600;
}

.diary-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 16px;
  margin-bottom: 22px;
  border-bottom: 1px solid rgba(213, 188, 161, 0.55);
  padding-bottom: 18px;
}

.diary-title-wrap {
  flex: 1 1 340px;
}

.diary-main-title {
  font-family: var(--serif, 'Fraunces', serif);
  font-size: 1.62rem;
  font-weight: 700;
  color: #2b0b23;
  margin: 0 0 6px 0;
  line-height: 1.3;
}

.diary-subtitle {
  font-size: 0.9rem;
  color: #7a5843;
  margin: 0;
  line-height: 1.5;
}

/* Language Switcher Buttons for Diary (Crisp Boxy Stamp Look) */
.diary-lang-switch {
  display: inline-flex;
  background: #f0e3d2;
  padding: 3px;
  border-radius: 4px;
  border: 1px solid #dfcfbc;
  gap: 3px;
}

.diary-lang-btn {
  background: transparent;
  border: none;
  padding: 6px 13px;
  border-radius: 3px;
  font-size: 0.84rem;
  font-weight: 700;
  color: #634335;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition: all 0.22s ease;
}

.diary-lang-btn:hover {
  color: #2b0b23;
  background: rgba(255, 255, 255, 0.5);
}

.diary-lang-btn.active {
  background: #ffffff;
  color: #a53860;
  box-shadow: 0 1px 4px rgba(61, 11, 55, 0.12);
  border-radius: 3px;
}

.diary-body-container {
  position: relative;
  min-height: 120px;
}

.diary-content-pane {
  animation: diaryFadeIn 0.3s ease;
}

@keyframes diaryFadeIn {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Authentic Handwritten Kalam Typography */
.diary-handwritten-text {
  font-family: 'Kalam', 'Caveat', cursive, sans-serif;
  font-size: 1.32rem;
  line-height: 2.2;
  color: #23140e;
  text-align: justify;
  text-justify: inter-word;
  word-wrap: break-word;
  overflow-wrap: break-word;
  letter-spacing: 0.2px;
}

.diary-handwritten-text strong {
  font-weight: 700;
  color: #7b1d3f;
  border-bottom: 1.5px dotted rgba(165, 56, 96, 0.4);
}

.diary-handwritten-text p {
  margin: 0 0 16px 0;
  text-align: justify;
  text-justify: inter-word;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.diary-handwritten-text p:last-child {
  margin-bottom: 0;
}

.diary-handwritten-text ul,
.diary-handwritten-text ol {
  margin: 12px 0 18px 24px;
  padding: 0;
}

.diary-handwritten-text li {
  margin-bottom: 8px;
  line-height: 2.1;
}

.diary-handwritten-text blockquote {
  margin: 14px 0;
  padding: 8px 18px;
  border-left: 3px solid #a53860;
  background: rgba(165, 56, 96, 0.05);
  border-radius: 0 8px 8px 0;
}

/* Signature & Footer Stamp */
.diary-footer-sig {
  margin-top: 24px;
  padding-top: 18px;
  border-top: 1px dashed rgba(213, 188, 161, 0.7);
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
}

.diary-signature-text {
  font-family: 'Kalam', cursive, sans-serif;
  font-size: 1.25rem;
  font-weight: 700;
  color: #a53860;
  letter-spacing: 0.3px;
}

.diary-signature-meta {
  font-size: 0.8rem;
  color: #7a5843;
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.diary-verified-stamp {
  background: #eaf4ed;
  color: #256b37;
  border: 1px solid #bce1c7;
  padding: 3px 9px;
  border-radius: 4px;
  font-weight: 700;
  font-size: 0.76rem;
}

@media (max-width: 768px) {
  .pkg-local-diary-card {
    padding: 22px 18px;
    border-radius: 14px;
  }
  .diary-main-title {
    font-size: 1.32rem;
  }
  .diary-handwritten-text {
    font-size: 1.16rem;
    line-height: 2.05;
  }
  .diary-footer-sig {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* ========================================================
   INDIAN LANGUAGES TRANSLATION SWITCHER (Header Dropdown)
   ======================================================== */
.site-lang-wrapper {
  position: relative;
  display: inline-flex;
  align-items: center;
}

.site-lang-btn {
  background: rgba(255, 255, 255, 0.12);
  color: #ffffff;
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-radius: 24px;
  padding: 7px 14px;
  font-size: 0.88rem;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  cursor: pointer;
  transition: all 0.25s ease;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.nav.nav-inner-page.solid .site-lang-btn,
.nav.solid .site-lang-btn {
  background: rgba(var(--navy-rgb, 32, 6, 29), 0.75);
  border-color: rgba(var(--orange-rgb, 218, 98, 125), 0.35);
}

.site-lang-btn:hover,
.site-lang-btn:focus-visible,
.site-lang-wrapper.open .site-lang-btn {
  background: rgba(var(--orange-rgb, 218, 98, 125), 0.25);
  border-color: var(--orange, #da627d);
  color: #ffffff;
  transform: translateY(-1px);
}

.site-lang-btn .lang-globe {
  font-size: 1.05rem;
  line-height: 1;
}

.site-lang-btn .lang-caret {
  font-style: normal;
  font-size: 0.72rem;
  transition: transform 0.25s ease;
}

.site-lang-wrapper.open .site-lang-btn .lang-caret {
  transform: rotate(180deg);
}

.site-lang-menu {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  width: 250px;
  max-height: 380px;
  background: rgba(28, 7, 24, 0.98);
  border: 1px solid rgba(var(--orange-rgb, 218, 98, 125), 0.4);
  border-radius: 14px;
  box-shadow: 0 18px 45px -10px rgba(0, 0, 0, 0.75);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  display: none;
  flex-direction: column;
  overflow: hidden;
  z-index: 9999;
  animation: langMenuDrop 0.22s ease forwards;
}

@keyframes langMenuDrop {
  from { opacity: 0; transform: translateY(-6px); }
  to { opacity: 1; transform: translateY(0); }
}

.site-lang-wrapper.open .site-lang-menu {
  display: flex;
}

.site-lang-header {
  padding: 10px 14px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.04);
}

.site-lang-header span {
  display: block;
  font-size: 0.8rem;
  font-weight: 700;
  color: var(--orange-2, #ffa5ab);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.site-lang-header small {
  font-size: 0.7rem;
  color: rgba(255, 255, 255, 0.65);
}

.site-lang-list {
  overflow-y: auto;
  max-height: 320px;
  padding: 6px 0;
  scrollbar-width: thin;
  scrollbar-color: var(--orange, #da627d) transparent;
}

.site-lang-opt {
  width: 100%;
  background: transparent;
  border: none;
  border-left: 3px solid transparent;
  padding: 8px 14px;
  text-align: left;
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: rgba(255, 255, 255, 0.9);
  cursor: pointer;
  transition: all 0.18s ease;
}

.site-lang-opt:hover {
  background: rgba(var(--orange-rgb, 218, 98, 125), 0.18);
  border-left-color: var(--orange, #da627d);
  color: #ffffff;
  padding-left: 18px;
}

.site-lang-opt.active {
  background: rgba(var(--orange-rgb, 218, 98, 125), 0.25);
  border-left-color: var(--orange-2, #ffa5ab);
  color: var(--orange-2, #ffa5ab);
  font-weight: 700;
}

.site-lang-opt .lang-opt-native {
  font-size: 0.92rem;
  font-weight: 600;
}

.site-lang-opt .lang-opt-sub {
  font-size: 0.72rem;
  color: rgba(255, 255, 255, 0.55);
}

.site-lang-opt.active .lang-opt-sub {
  color: rgba(255, 255, 255, 0.85);
}

/* Suppress Google Translate default top iframe & attribution bar */
.goog-te-banner-frame.skiptranslate,
.goog-te-banner-frame,
iframe.goog-te-banner-frame {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
}

body {
  top: 0px !important;
  position: static !important;
}

#goog-gt-tt,
.goog-te-balloon-frame {
  display: none !important;
}

.goog-text-highlight {
  background: none !important;
  box-shadow: none !important;
}

/* Mobile language button styling inside canvas drawer */
.canvas-lang-section {
  padding: 14px 16px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  margin-bottom: 8px;
}

.canvas-lang-title {
  font-size: 0.76rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--orange-2, #ffa5ab);
  margin-bottom: 8px;
  display: flex;
  align-items: center;
  gap: 6px;
}

.canvas-lang-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 6px;
}

.canvas-lang-pill {
  background: rgba(255, 255, 255, 0.07);
  border: 1px solid rgba(255, 255, 255, 0.15);
  color: #ffffff;
  border-radius: 8px;
  padding: 7px 10px;
  font-size: 0.82rem;
  text-align: left;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  transition: all 0.2s ease;
}

.canvas-lang-pill:hover,
.canvas-lang-pill.active {
  background: rgba(var(--orange-rgb, 218, 98, 125), 0.28);
  border-color: var(--orange, #da627d);
  color: #ffffff;
}

.canvas-lang-pill strong {
  font-size: 0.86rem;
}

.canvas-lang-pill small {
  font-size: 0.68rem;
  opacity: 0.7;
}

@media (max-width: 991px) {
  .site-lang-btn {
    padding: 5px 10px;
    font-size: 0.82rem;
  }
  .site-lang-menu {
    right: -20px;
    width: 230px;
  }
}


/* ===== Team Members Grid & Cards ===== */
.team-section {
  position: relative;
}
.team-grid-4 {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}
.team-grid-3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
}
.team-card {
  background: #ffffff;
  border-radius: var(--radius, 20px);
  border: 1.5px solid rgba(2, 1, 10, 0.08);
  box-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.06);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease;
}
.team-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 42px -12px rgba(0, 0, 0, 0.14);
  border-color: rgba(243, 156, 18, 0.45);
}
.team-card-media {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  background: var(--navy, #02010a);
}
.team-card-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.5s ease;
}
.team-card:hover .team-card-media img {
  transform: scale(1.06);
}
.team-card-badge {
  position: absolute;
  top: 12px;
  right: 12px;
  background: rgba(2, 1, 10, 0.78);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  color: #fff;
  font-size: 0.7rem;
  font-weight: 700;
  padding: 0.3rem 0.65rem;
  border-radius: 999px;
  letter-spacing: 0.03em;
  border: 1px solid rgba(255, 255, 255, 0.22);
}
.team-card-body {
  padding: 20px;
  display: flex;
  flex-direction: column;
  flex: 1;
}
.team-card-name {
  font-family: var(--serif);
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--navy);
  margin: 0 0 4px;
  line-height: 1.25;
}
.team-card-role {
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--orange);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 12px;
  display: block;
}
.team-card-bio {
  font-size: 0.9rem;
  line-height: 1.55;
  color: var(--muted);
  margin: 0 0 16px;
  flex: 1;
}
.team-card-social {
  display: flex;
  align-items: center;
  justify-content: center !important;
  text-align: center;
  gap: 12px;
  padding-top: 16px;
  border-top: 1px solid rgba(2, 1, 10, 0.07);
  margin-top: auto;
  margin-left: auto;
  margin-right: auto;
  flex-wrap: wrap;
  width: 100%;
}
.team-social-icon {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #ffffff !important;
  background: var(--navy);
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.25s ease, filter 0.2s ease;
  text-decoration: none;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
}
.team-social-icon:hover {
  transform: translateY(-2px) scale(1.1);
  filter: brightness(1.15);
}
.team-social-wa {
  width: 44px;
  height: 44px;
  background: #25D366;
  box-shadow: 0 4px 14px rgba(37, 211, 102, 0.42);
}
.team-social-wa svg {
  width: 24px;
  height: 24px;
}
.team-social-wa:hover {
  box-shadow: 0 6px 18px rgba(37, 211, 102, 0.6);
  transform: translateY(-3px) scale(1.14);
}
.team-social-ig { background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%); }
.team-social-fb { background: #1877F2; }
.team-social-li { background: #0A66C2; }
.team-social-tw { background: #000000; }

/* Join Our Mountain Team Callout Banner */
.join-team-banner {
  margin-top: 70px;
  text-align: center;
  background: linear-gradient(135deg, #ffffff 0%, #fffdf8 100%);
  border-radius: 24px;
  border: 1.5px solid rgba(243, 156, 18, 0.32);
  padding: 52px 32px;
  box-shadow: 0 16px 44px -12px rgba(243, 156, 18, 0.12), 0 4px 16px rgba(0, 0, 0, 0.04);
  position: relative;
  overflow: hidden;
}
.join-team-banner::before {
  content: "";
  position: absolute;
  top: -60px;
  right: -60px;
  width: 180px;
  height: 180px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(243, 156, 18, 0.12) 0%, transparent 70%);
  pointer-events: none;
}
.join-avatar-cluster {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 28px;
  gap: 0;
  flex-wrap: wrap;
}
.join-avatar-item {
  width: 62px;
  height: 62px;
  border-radius: 50%;
  border: 3px solid #ffffff;
  overflow: hidden;
  box-shadow: 0 4px 12px rgba(2, 1, 10, 0.15);
  margin-right: -12px;
  position: relative;
  transition: transform 0.25s ease, z-index 0.25s ease;
  background: var(--navy);
}
.join-avatar-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.join-avatar-item:hover {
  transform: translateY(-4px) scale(1.1);
  z-index: 10;
}
.join-avatar-you {
  width: 70px;
  height: 70px;
  border-radius: 50%;
  border: 2.5px dashed var(--orange, #f39c12);
  background: linear-gradient(135deg, rgba(243, 156, 18, 0.15) 0%, rgba(230, 126, 34, 0.25) 100%);
  margin-left: 8px;
  margin-right: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: var(--navy);
  position: relative;
  box-shadow: 0 4px 16px rgba(243, 156, 18, 0.28);
  animation: pulseAvatarYou 2.8s infinite ease-in-out;
  cursor: pointer;
  text-decoration: none;
}
@keyframes pulseAvatarYou {
  0%, 100% {
    box-shadow: 0 0 0 0 rgba(243, 156, 18, 0.4), 0 4px 14px rgba(243, 156, 18, 0.2);
    transform: scale(1);
  }
  50% {
    box-shadow: 0 0 0 8px rgba(243, 156, 18, 0), 0 6px 18px rgba(243, 156, 18, 0.35);
    transform: scale(1.04);
  }
}
.join-avatar-you-plus {
  font-size: 1.15rem;
  font-weight: 900;
  color: var(--orange, #f39c12);
  line-height: 1;
}
.join-avatar-you-txt {
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  color: var(--navy);
  line-height: 1;
  margin-top: 1px;
}
.join-avatar-you-badge {
  position: absolute;
  bottom: -9px;
  background: var(--navy);
  color: #ffffff;
  font-size: 0.58rem;
  font-weight: 700;
  padding: 2px 7px;
  border-radius: 999px;
  white-space: nowrap;
  letter-spacing: 0.03em;
  border: 1.5px solid #ffffff;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.18);
}
.join-perks-list {
  display: flex;
  justify-content: center;
  gap: 20px;
  flex-wrap: wrap;
  margin-top: 24px;
  padding-top: 20px;
  border-top: 1px dashed rgba(2, 1, 10, 0.1);
  font-size: 0.88rem;
  color: var(--navy);
  font-weight: 600;
}
.join-perks-list span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.join-perks-list span strong {
  color: var(--green, #27ae60);
}

@media (max-width: 1024px) {
  .team-grid-4 {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 820px) {
  .team-grid-3 {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 600px) {
  .team-grid-4,
  .team-grid-3 {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .team-card-media {
    aspect-ratio: 4 / 3;
  }
}
