/* =========================================================
   BLUE MOUNTAIN TRAILS — design tokens
   Palette:  pine #16301F | forest #2F5C3C | mist #E9EFE6
             cream #FAF7EF | ink #22261C | amber #C6892E
   Display face: 'Fraunces'  Body: 'Work Sans'  Utility: 'Space Mono'
   ========================================================= */
:root{
  --pine:      #16301F;
  --forest:    #2F5C3C;
  --forest-2:  #3E7A4F;
  --mist:      #E9EFE6;
  --cream:     #FAF7EF;
  --ink:       #22261C;
  --ink-soft:  #4B5346;
  --amber:     #C6892E;
  --amber-soft:#E7C48B;
  --line:      #D9D3C1;
  --white:     #FFFFFF;

  --font-display: 'Fraunces', 'Georgia', serif;
  --font-body: 'Work Sans', -apple-system, sans-serif;
  --font-mono: 'Space Mono', monospace;

  --radius: 4px;
  --shadow-soft: 0 12px 32px -16px rgba(22,48,31,0.28);
  --shadow-card: 0 8px 24px -12px rgba(22,48,31,0.22);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-family: var(--font-body);
  color: var(--ink);
  background: var(--cream);
  margin:0;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%; display:block;}
a{color:inherit; text-decoration:none;}
h1,h2,h3,h4{
  font-family: var(--font-display);
  color: var(--pine);
  margin:0 0 .5em;
  line-height:1.12;
  font-weight:600;
}
p{margin:0 0 1em;}
.container{width:100%; max-width:1180px; margin:0 auto; padding:0 24px;}

/* ---------- utility / labels ---------- */
.eyebrow{
  font-family: var(--font-mono);
  font-size:.72rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color: var(--amber);
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin-bottom:14px;
}
.eyebrow::before{
  content:"";
  width:26px; height:1px;
  background: var(--amber);
  display:inline-block;
}
.btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-family: var(--font-mono);
  font-size:.78rem;
  letter-spacing:.06em;
  text-transform:uppercase;
  padding:14px 26px;
  border-radius: var(--radius);
  border:1px solid transparent;
  cursor:pointer;
  transition: all .25s ease;
}
.btn-amber{
  background: #0f310e;
  color: var(--white);
}
.btn-amber:hover{ background:#0f310e; transform:translateY(-2px); box-shadow: var(--shadow-card);
color:#fff;
}
.btn-outline{
  border-color: #63ad30;
  color:#fff;
}
.btn-outline:hover{ background:#63ad30;color:#fff; }
.btn-pine{
  background: #63ad30;
  color:#fff;
}
.btn-pine:hover{ background: #63ad30; color:#fff; transform:translateY(-2px); box-shadow: var(--shadow-card);}

/* =========================================================
   NAV
   ========================================================= */
.site-header{
  position:sticky; top:0; z-index:1000;
  background: #6bab2a;
  backdrop-filter: blur(6px);
  border-bottom:1px solid rgba(255,255,255,.08);
}
.nav-wrap{
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 0;
}
.brand{
  display:flex; align-items:center; gap:10px;
  font-family: var(--font-display);
  color:#fff; font-size:1.28rem; font-weight:600; letter-spacing:.01em;
}
.brand .mark{
  width:34px; height:34px;
  flex:0 0 auto;
}
.brand small{
  display:block;
  font-family: var(--font-mono);
  font-size:.58rem; letter-spacing:.16em;
  color: var(--amber-soft); font-weight:400; text-transform:uppercase;
}
.nav-links{
  display:flex; align-items:center; gap:36px;
  list-style:none; margin:0; padding:0;
}
.nav-links a{
  color: #fff;
  font-size:.92rem;
  font-weight:500;
  position:relative;
  padding:4px 0;
}
.nav-links a::after{
  content:"";
  position:absolute; left:0; bottom:-2px;
  width:0; height:2px; background: #0a320f;
  transition:width .25s ease;
}
.nav-links a:hover::after, .nav-links a.active::after{ width:100%; }
.nav-links a.active{ color:#fff; }
.nav-cta{ display:flex; align-items:center; gap:18px; }
.nav-toggle{
  display:none; background:none; border:0; cursor:pointer; padding:6px;
}
.nav-toggle span{
  display:block; width:24px; height:2px; background:#fff; margin:5px 0;
}

@media (max-width: 940px){
  .nav-links{
    position:fixed; inset:64px 0 0 0; background: var(--pine);
    flex-direction:column; justify-content:flex-start; padding:36px 24px;
    gap:22px; transform:translateX(100%); transition:transform .3s ease;
  }
  .nav-links.open{ transform:translateX(0); }
  .nav-toggle{ display:block; }
  .nav-cta .btn-amber{ display:none; }
}

/* =========================================================
   HERO with hairpin road motif
   ========================================================= */
.hero{
  position:relative;
  min-height:88vh;
  display:flex; align-items:flex-end;
  background: linear-gradient(180deg, rgba(16,32,20,.35), rgba(15,26,17,.86)), var(--hero-img, none);
  background-size:cover; background-position:center;
  color:#fff;
  overflow:hidden;
}
.hero-inner{
  position:relative; z-index:2;
  padding: 120px 0 90px;
  width:100%;
}
.hero-road{
  position:absolute; right:-40px; top:0; height:100%; width:46%;
  opacity:.55; z-index:1; pointer-events:none;
}
.hero h1{
  color:#fff;
  font-size: clamp(2.4rem, 5vw, 4rem);
  max-width:780px;
  margin-bottom:.3em;
}
.hero .lede{
  max-width:520px; color: rgba(255,255,255,.86); font-size:1.05rem;
}
.hero-stats{
  display:flex; gap:40px; margin-top:44px; flex-wrap:wrap;
}
.hero-stats div strong{
  display:block; font-family: var(--font-display); font-size:1.9rem; color:var(--amber-soft);
}
.hero-stats div span{
  font-family: var(--font-mono); font-size:.68rem; letter-spacing:.1em; text-transform:uppercase;
  color: rgba(255,255,255,.7);
}
.hero-actions{ display:flex; gap:16px; margin-top:38px; flex-wrap:wrap; }

/* page header (non-home hero) */
.page-head{
  position:relative;
  padding: 150px 0 70px;
  color:#fff;
      background: linear-gradient(180deg, rgba(16, 32, 20, .55), rgb(15 26 17 / 0%)), var(--hero-img, none);
  background-size:cover; background-position:center;
}
.page-head h1{ color:#fff; font-size:clamp(2.1rem,4vw,3.1rem); margin-bottom:.25em;}
.page-head .lede{ max-width:560px; color:rgba(255,255,255,.85); }
.breadcrumb{
  font-family: var(--font-mono); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase;
  color: var(--amber-soft); margin-bottom:16px;
}
.breadcrumb a{ color: rgba(255,255,255,.7); }

/* =========================================================
   SECTIONS
   ========================================================= */
   .sectionbanner{ padding: 0px 0; }
section{ padding: 50px 0; }
.section-cream{ background: var(--cream); }
.section-mist{ background: var(--mist);    padding-bottom: 50px; }
.section-pine{ background: var(--pine); color:#fff; }
.section-pine h2{ color:#fff; }
.section-head{ max-width:640px; margin-bottom:56px; }
.section-head.center{ margin-left:auto; margin-right:auto; text-align:center; }

/* ---------- highlight ticks ---------- */
.tick-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:2px;
  background: var(--line);
  border:1px solid var(--line);
}
.tick{
  background: var(--cream); padding:30px 26px;
}
.tick .num{ font-family:var(--font-mono); color:var(--amber); font-size:.75rem; letter-spacing:.1em;}
.tick h4{ margin:.4em 0 .3em; font-size:1.05rem;}
.tick p{ color: var(--ink-soft); font-size:.92rem; margin:0;}
@media (max-width:820px){ .tick-grid{ grid-template-columns:1fr;} }

/* ---------- destination / package cards ---------- */
.card-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
@media (max-width:980px){ .card-grid{ grid-template-columns:repeat(2,1fr);} }
@media (max-width:640px){ .card-grid{ grid-template-columns:1fr;} }

.pkg-card{
  background:#fff; border:1px solid var(--line); border-radius: var(--radius);
  overflow:hidden; transition: transform .3s ease, box-shadow .3s ease;
  display:flex; flex-direction:column;
}
.pkg-card:hover{ transform: translateY(-6px); box-shadow: var(--shadow-soft); }
.pkg-media{ position:relative; height:220px; overflow:hidden; }
.pkg-media img{ width:100%; height:100%; object-fit:cover; transition: transform .5s ease; }
.pkg-card:hover .pkg-media img{ transform: scale(1.06); }
.pkg-badge{
  position:absolute; top:14px; left:14px;
  background: var(--pine); color:#fff;
  font-family: var(--font-mono); font-size:.66rem; letter-spacing:.08em; text-transform:uppercase;
  padding:6px 12px; border-radius:2px;
}
.pkg-body{ padding:24px 24px 26px; display:flex; flex-direction:column; gap:10px; flex:1;}
.pkg-body .route{ font-family:var(--font-mono); font-size:.7rem; letter-spacing:.08em; color:var(--forest-2); text-transform:uppercase;}
.pkg-body h3{ font-size:1.28rem; margin:0;}
.pkg-body p{ color:var(--ink-soft); font-size:.92rem; margin:0;}
.pkg-foot{
  margin-top:auto; display:flex; align-items:center; justify-content:space-between;
  padding-top:14px;padding:10px; border-top:1px dashed var(--line);
}
.pkg-price{ font-family:var(--font-display); color:var(--pine); font-size:1.15rem;}
.pkg-price span{ font-family:var(--font-mono); font-size:.68rem; color:var(--ink-soft); display:block;}
.pkg-link{ font-size:.85rem; font-weight:600; color:var(--forest); display:inline-flex; align-items:center; gap:6px;}
.pkg-link:after{ content:"→"; transition:transform .2s ease;}
.pkg-link:hover:after{ transform:translateX(4px);}

/* ---------- itinerary / hairpin road timeline ---------- */
.itinerary{ position:relative; }
.day-block{
  display:grid; grid-template-columns:120px 1fr; gap:34px;
  padding: 42px 0; border-bottom:1px solid var(--line);
  position:relative;
}
.day-block:last-child{ border-bottom:0; }
.day-marker{ position:relative; }
.day-marker .bend{
  font-family:var(--font-mono); font-size:.68rem; color:var(--amber); letter-spacing:.08em;
}
.day-marker .no{
  font-family:var(--font-display); font-size:2.6rem; color:var(--pine); line-height:1;
}
.day-marker .no span{ color:var(--amber);}
.day-content h3{ font-size:1.5rem; margin-bottom:.2em;}
.day-content .sub{ color:var(--forest-2); font-family:var(--font-mono); font-size:.75rem; letter-spacing:.06em; text-transform:uppercase; margin-bottom:16px; display:block;}
.stop-list{ display:grid; grid-template-columns:repeat(2,1fr); gap:10px 28px; list-style:none; padding:0; margin:0 0 18px; }
.stop-list li{ font-size:.94rem; color:var(--ink-soft); padding-left:20px; position:relative;}
.stop-list li::before{
  content:""; position:absolute; left:0; top:9px; width:9px; height:9px;
  border:2px solid var(--forest-2); border-radius:50%;
}
@media (max-width:760px){
  .day-block{ grid-template-columns:1fr; gap:10px;}
  .stop-list{ grid-template-columns:1fr;}
}

/* ---------- gallery ---------- */
.gallery-grid{
  display:grid; grid-template-columns: repeat(4,1fr); grid-auto-rows:190px; gap:14px;
}
.gallery-grid a{ overflow:hidden; border-radius:2px; position:relative; display:block;}
.gallery-grid img{ width:100%; height:100%; object-fit:cover; transition:transform .5s ease;}
.gallery-grid a:hover img{ transform:scale(1.08);}
.g-tall{ grid-row: span 2; }
.g-wide{ grid-column: span 2; }
@media (max-width:900px){ .gallery-grid{ grid-template-columns:repeat(2,1fr); grid-auto-rows:160px;} .g-wide{grid-column:span 2;} }
@media (max-width:560px){ .gallery-grid{ grid-template-columns:1fr; } .g-wide,.g-tall{grid-column:span 1; grid-row:span 1;} }
.gallery-cap{
  position:absolute; left:0; right:0; bottom:0; padding:10px 14px;
  background:linear-gradient(0deg, rgba(16,32,20,.82), transparent);
  color:#fff; font-family:var(--font-mono); font-size:.68rem; letter-spacing:.06em; text-transform:uppercase;
}

/* ---------- testimonials ---------- */
.quote-card{
  background:#fff; border:1px solid var(--line); padding:32px 28px; border-radius:var(--radius);
  height:100%;
}
.quote-card .stars{ color:var(--amber); letter-spacing:2px; margin-bottom:14px; font-size:.9rem;}
.quote-card p{ color: var(--ink-soft); font-style:italic; }
.quote-who{ display:flex; align-items:center; gap:12px; margin-top:18px;}
.quote-who .initial{
  width:40px; height:40px; border-radius:50%; background:var(--mist); color:var(--pine);
  display:flex; align-items:center; justify-content:center; font-family:var(--font-display); font-weight:600;
}
.quote-who strong{ display:block; font-size:.92rem; color:var(--pine);}
.quote-who span{ font-family:var(--font-mono); font-size:.68rem; color:var(--ink-soft); letter-spacing:.05em;}

/* ---------- about / values ---------- */
.split{
  display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center;
}
@media (max-width:860px){ .split{ grid-template-columns:1fr; gap:34px;} }
.split img{ border-radius:var(--radius); box-shadow: var(--shadow-soft); }

.stat-strip{
  display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid rgba(255,255,255,.18); border-bottom:1px solid rgba(255,255,255,.18);
}
.stat-strip div{ padding:34px 20px; text-align:center; border-left:1px solid rgba(255,255,255,.18);}
.stat-strip div:first-child{ border-left:0;}
.stat-strip strong{ display:block; font-family:var(--font-display); font-size:2.2rem; color:var(--amber-soft);}
.stat-strip span{ font-family:var(--font-mono); font-size:.68rem; letter-spacing:.08em; text-transform:uppercase; color:rgba(255,255,255,.75);}
@media (max-width:760px){ .stat-strip{ grid-template-columns:repeat(2,1fr);} .stat-strip div:nth-child(3){border-left:0;} }

/* ---------- team ---------- */
.team-card{ text-align:center; }
.team-card img{ border-radius:50%; width:150px; height:150px; object-fit:cover; margin:0 auto 16px; }
.team-card h4{ margin-bottom:2px;}
.team-card span{ font-family:var(--font-mono); font-size:.7rem; letter-spacing:.06em; color:var(--forest-2); text-transform:uppercase;}

/* ---------- forms ---------- */
.form-card{
  background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:36px;
  box-shadow: var(--shadow-card);
}
.form-row{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
@media (max-width:600px){ .form-row{ grid-template-columns:1fr; } }
.field{ margin-bottom:18px; }
.field label{
  display:block; font-family:var(--font-mono); font-size:.68rem; letter-spacing:.08em; text-transform:uppercase;
  color: var(--ink-soft); margin-bottom:8px;
}
.field input, .field select, .field textarea{
  width:100%; border:1px solid var(--line); border-radius:2px; padding:12px 14px;
  font-family: var(--font-body); font-size:.94rem; background:var(--cream); color:var(--ink);
}
.field input:focus, .field select:focus, .field textarea:focus{
  outline:2px solid var(--forest-2); outline-offset:1px; background:#fff;
}
.form-note{ font-size:.8rem; color:var(--ink-soft); margin-top:10px; }
.form-success{
  display:none; background:var(--mist); border:1px solid var(--forest-2); color:var(--pine);
  padding:14px 16px; border-radius:var(--radius); font-size:.9rem; margin-bottom:18px;
}

/* ---------- contact info strip ---------- */
.info-list{ list-style:none; margin:0; padding:0; }
.info-list li{
  display:flex; gap:16px; padding:20px 0; border-bottom:1px solid var(--line);
}
.info-list li:last-child{ border-bottom:0; }
.info-list .ico{
  width:40px; height:40px; border-radius:50%; background:var(--mist); flex:0 0 auto;
  display:flex; align-items:center; justify-content:center; color:var(--forest); font-family:var(--font-mono); font-size:.8rem;
}
.info-list strong{ display:block; color:var(--pine); font-size:.95rem; }
.info-list span{ color:var(--ink-soft); font-size:.88rem; }

/* ---------- FAQ accordion ---------- */
.faq-item{ border-bottom:1px solid var(--line); }
.faq-q{
  width:100%; text-align:left; background:none; border:0; padding:20px 0;
  display:flex; justify-content:space-between; align-items:center; cursor:pointer;
  font-family: var(--font-display); font-size:1.05rem; color:var(--pine);
}
.faq-q .plus{ font-family:var(--font-mono); color:var(--amber); font-size:1.2rem; transition:transform .25s ease;}
.faq-item.open .plus{ transform:rotate(45deg); }
.faq-a{ max-height:0; overflow:hidden; transition:max-height .3s ease; }
.faq-a p{ padding-bottom:20px; color:var(--ink-soft); margin:0;}

/* ---------- CTA band ---------- */
.cta-band{
  background: var(--pine); color:#fff; border-radius:var(--radius);
  padding:56px 48px; display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap;
  position:relative; overflow:hidden;
}
.cta-band h3{ color:#fff; margin-bottom:.2em; font-size:1.7rem;}
.cta-band p{ color:rgba(255,255,255,.78); margin:0;}

/* ---------- footer ---------- */
.site-footer{ background: var(--pine); color: rgba(255,255,255,.78); padding-top:70px; }
.footer-grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1.2fr; gap:40px; padding-bottom:50px; }
@media (max-width:860px){ .footer-grid{ grid-template-columns:repeat(2,1fr);} }
@media (max-width:520px){ .footer-grid{ grid-template-columns:1fr;} }
.footer-grid h5{
  font-family:var(--font-mono); font-size:.7rem; letter-spacing:.1em; text-transform:uppercase;
  color:var(--amber-soft); margin-bottom:18px;
}
.footer-grid ul{ list-style:none; margin:0; padding:0; }
.footer-grid li{ margin-bottom:10px; font-size:.9rem; }
.footer-grid a:hover{ color:#fff; }
.footer-brand p{ font-size:.9rem; max-width:280px; }
.social-row{ display:flex; gap:12px; margin-top:14px; }
.social-row a{
  width:34px; height:34px; border:1px solid rgba(255,255,255,.25); border-radius:50%;
  display:flex; align-items:center; justify-content:center; font-size:.75rem;
}
.social-row a:hover{ background:var(--amber); border-color:var(--amber); }
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.15); padding:20px 0; font-size:.8rem;
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;
}

/* ---------- whatsapp enquiry ---------- */
.pkg-foot{ flex-wrap:wrap; row-gap:10px; }
.whatsapp-chip{
  display:inline-flex; align-items:center; gap:6px;
  font-family:var(--font-mono); font-size:.68rem; letter-spacing:.05em; text-transform:uppercase;
  color:#128C4A; border:1px solid #25D366; background:#EAF9F0;
  padding:8px 14px; border-radius:20px; transition:all .2s ease; white-space:nowrap;
}
.whatsapp-chip svg{ width:14px; height:14px; flex:0 0 auto; }
.whatsapp-chip:hover{ background:#25D366; color:#fff; border-color:#25D366; transform:translateY(-1px); }
.btn-whatsapp {
    background: #25D366;
    color: #fff;
    padding: 10px 30px;
    border-color: #25D366;
    font-size: 14px;
    margin: 0 auto;
    margin-top: 20px;
}
.btn-whatsapp:hover {
    background: #25D366;
    color: #fff;
    padding: 10px 30px;
    border-color: #25D366;
    font-size: 14px;
}
.btn-whatsapp svg{ width:16px; height:16px; }

/* ---------- south india coverage (packages page) ---------- */
.region-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:2px; background:var(--line); border:1px solid var(--line); margin-top:8px; }
.region-block{ background:#fff; padding:26px 24px; }
.region-block h4{ font-family:var(--font-mono); font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; color:var(--forest-2); margin-bottom:14px; }
.region-block ul{ list-style:none; margin:0; padding:0; columns:2; column-gap:20px; }
.region-block li{ font-size:.85rem; color:var(--ink-soft); padding:4px 0; break-inside:avoid; }
@media (max-width:900px){ .region-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:620px){ .region-grid{ grid-template-columns:1fr; } .region-block ul{ columns:1; } }

.service-tags{ display:flex; flex-wrap:wrap; gap:10px; margin-top:20px; }
.service-tags span{
  font-family:var(--font-mono); font-size:.7rem; letter-spacing:.05em; text-transform:uppercase;
  background:var(--mist); color:var(--forest); padding:8px 14px; border-radius:20px;
}
.coverage-band{
  background:var(--pine); border-radius:var(--radius); padding:36px 40px; margin-top:40px;
  display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap; color:#fff;
}
.coverage-band h3{ color:#fff; margin-bottom:.2em; font-size:1.35rem; }
.coverage-band p{ color:rgba(255,255,255,.78); margin:0; }
.coverage-band .phone{ font-family:var(--font-display); color:var(--amber-soft); font-size:1.2rem; }

/* ---------- enquiry strip (home page) ---------- */
.enquiry-strip{ background:var(--pine); color:#fff; padding:18px 0; }
.enquiry-strip .container p{
 text-align: center;
}
.enquiry-strip p{ margin:0; font-size:.92rem; }
.enquiry-strip strong{ color:var(--amber-soft); }
.enquiry-strip .strip-actions{ display:flex; gap:12px; flex-wrap:wrap; }

/* ---------- back to top ---------- */
.back-top{
  position:fixed; right:24px; bottom:24px; width:46px; height:46px; border-radius:50%;
  background:var(--pine); color:#fff; display:flex; align-items:center; justify-content:center;
  opacity:0; pointer-events:none; transition:opacity .25s ease, transform .25s ease; z-index:900; cursor:pointer; border:0;
}
.back-top.show{ opacity:1; pointer-events:auto; }
.back-top:hover{ background:var(--amber); transform:translateY(-3px); }

/* ---------- misc ---------- */
.divider-road{ height:64px; width:100%; }
.reveal{ opacity:0; transform:translateY(18px); transition:opacity .6s ease, transform .6s ease; }
.reveal.in{ opacity:1; transform:translateY(0); }

::selection{ background: var(--amber-soft); color: var(--pine); }

.btn-whatsapp2 {
    background: #25D366;
    color: #fff;
    padding: 10px 30px;
    border-color: #25D366;
    font-size: 14px;
    border-radius: 50px;
    margin: 0 auto;
    margin-top: 10px;
}