@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@500;600;700&family=Work+Sans:wght@400;500;600;700&display=swap');

:root{
  --white:#ffffff;
  --bg-soft:#F6F8F3;
  --ink:#1B2A20;
  --forest:#1B4332;
  --forest-dark:#123024;
  --clay:#8B5E34;
  --sage:#7C9473;
  --sage-line:#D9E4D3;
  --sun:#F2B24A;
  --wa:#25D366;
  --wa-dark:#1DA851;
  --radius:14px;
  --shadow:0 10px 30px -12px rgba(27,42,32,0.18);
  --container:1200px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--white);
  color:var(--ink);
  font-family:'Work Sans',system-ui,sans-serif;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,.display{
  font-family:'Oswald',sans-serif;
  text-transform:uppercase;
  letter-spacing:0.02em;
  color:var(--forest-dark);
  margin:0;
}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}
.container{max-width:var(--container);margin:0 auto;padding:0 24px;}
.eyebrow{
  font-family:'Work Sans',sans-serif;
  font-weight:600;
  letter-spacing:0.14em;
  text-transform:uppercase;
  font-size:12.5px;
  color:var(--clay);
}
:focus-visible{outline:3px solid var(--sun);outline-offset:2px;}

/* ---------- Topbar ---------- */
.topbar{
  position:sticky;top:0;z-index:50;
  background:var(--white);
  border-bottom:1px solid var(--sage-line);
}
.topbar-inner{
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 0;
}
.brand{display:flex;align-items:center;gap:10px;}
.brand img{height:42px;width:auto;}
.brand-text{
  font-family:'Oswald',sans-serif;font-weight:700;font-size:19px;
  text-transform:uppercase;letter-spacing:0.02em;color:var(--forest-dark);
  line-height:1.1;
}
.brand-text small{
  display:block;font-family:'Work Sans',sans-serif;text-transform:none;
  font-weight:500;font-size:11.5px;letter-spacing:0.02em;color:var(--sage);
}
.nav-actions{display:flex;align-items:center;gap:14px;}
.social-icon{
  width:36px;height:36px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:var(--bg-soft);color:var(--forest);
  border:1px solid var(--sage-line);
  transition:transform .15s ease, background .15s ease;
}
.social-icon:hover{background:var(--sage-line);transform:translateY(-2px);}
.social-icon svg{width:18px;height:18px;}
.btn-wa-top{
  display:inline-flex;align-items:center;gap:8px;
  background:var(--wa);color:#fff;font-weight:600;font-size:14px;
  padding:10px 16px;border-radius:999px;
  box-shadow:0 6px 16px -6px rgba(37,211,102,.55);
}
.btn-wa-top:hover{background:var(--wa-dark);}

/* ---------- Hero / Banner slider ---------- */
.hero{position:relative;background:var(--forest-dark);overflow:hidden;}
.slider{position:relative;height:min(62vw,460px);min-height:280px;}
.slide{
  position:absolute;inset:0;opacity:0;transition:opacity .8s ease;
}
.slide.is-active{opacity:1;}
.slide img{width:100%;height:100%;object-fit:cover;}
.slide-caption{
  position:absolute;left:0;right:0;bottom:0;
  padding:34px 24px 46px;
  background:linear-gradient(180deg, rgba(18,48,36,0) 0%, rgba(18,48,36,.82) 78%);
  color:#fff;
}
.slide-caption .container{max-width:var(--container);}
.slide-caption h2{color:#fff;font-size:clamp(22px,3.4vw,38px);}
.slide-caption p{margin:6px 0 0;font-size:15px;color:#DCEADD;max-width:520px;}
.slider-dots{
  position:absolute;bottom:16px;left:0;right:0;
  display:flex;justify-content:center;gap:8px;z-index:5;
}
.slider-dots button{
  width:9px;height:9px;border-radius:50%;border:none;background:rgba(255,255,255,.45);
  cursor:pointer;padding:0;transition:background .2s, width .2s;
}
.slider-dots button.is-active{background:#fff;width:26px;border-radius:6px;}
.trail-strip{
  height:5px;width:100%;
  background:repeating-linear-gradient(90deg,var(--sun) 0 18px, transparent 18px 30px);
}

/* ---------- Section heading ---------- */
.section{padding:56px 0;}
.section-bg{background:var(--bg-soft);}
.section-head{
  display:flex;align-items:flex-end;justify-content:space-between;gap:24px;
  margin-bottom:28px;flex-wrap:wrap;
}
.section-head h2{font-size:clamp(24px,3vw,34px);}
.section-head p{max-width:560px;color:#48584B;font-size:15px;line-height:1.6;margin:8px 0 0;}
.count-pill{
  font-family:'Oswald',sans-serif;font-weight:600;color:var(--forest);
  background:var(--sage-line);border-radius:999px;padding:6px 16px;font-size:14px;
  white-space:nowrap;
}

/* ---------- Filter bar ---------- */
.filter-bar{
  background:var(--white);border:1px solid var(--sage-line);
  border-radius:var(--radius);box-shadow:var(--shadow);
  padding:20px;margin-bottom:34px;
}
.filter-grid{
  display:grid;grid-template-columns:repeat(3,1fr) auto;gap:14px;align-items:end;
}
.field label{
  display:block;font-size:12px;font-weight:600;letter-spacing:.06em;
  text-transform:uppercase;color:var(--clay);margin-bottom:6px;
}
.field select{
  width:100%;padding:11px 12px;border-radius:9px;border:1px solid var(--sage-line);
  background:var(--white) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="8"><path d="M1 1l5 5 5-5" stroke="%231B4332" stroke-width="2" fill="none"/></svg>') no-repeat right 12px center;
  appearance:none;font-family:'Work Sans',sans-serif;font-size:14px;color:var(--ink);
}
.field select:focus{border-color:var(--forest);}
.btn-search{
  background:var(--forest);color:#fff;border:none;border-radius:9px;
  padding:12px 26px;font-weight:600;font-size:14px;cursor:pointer;
  transition:background .15s ease;white-space:nowrap;
}
.btn-search:hover{background:var(--forest-dark);}

/* ---------- Tour grid ---------- */
.tour-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:22px;
}
.tour-card{
  background:var(--white);border:1px solid var(--sage-line);border-radius:var(--radius);
  overflow:hidden;display:flex;flex-direction:column;
  box-shadow:0 1px 0 rgba(0,0,0,.02);
  transition:transform .18s ease, box-shadow .18s ease;
}
.tour-card:hover{transform:translateY(-5px);box-shadow:var(--shadow);}
.tour-media{position:relative;aspect-ratio:4/3;background:var(--bg-soft);overflow:hidden;}
.tour-media img{width:100%;height:100%;object-fit:cover;}
.tour-badge{
  position:absolute;top:12px;left:12px;background:rgba(27,67,50,.92);color:#fff;
  font-size:11px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;
  padding:5px 10px;border-radius:999px;
}
.tour-body{padding:16px 18px 18px;display:flex;flex-direction:column;gap:10px;flex:1;}
.tour-body h3{
  font-size:16.5px;line-height:1.3;text-transform:none;font-weight:700;
  color:var(--forest-dark);letter-spacing:0;
}
.tour-meta{
  display:flex;align-items:center;gap:6px;color:var(--sage);
  font-size:13px;font-weight:500;
}
.tour-meta svg{width:14px;height:14px;flex-shrink:0;}
.tour-foot{
  margin-top:auto;display:flex;align-items:center;justify-content:space-between;
  padding-top:10px;border-top:1px dashed var(--sage-line);
}
.tour-price{font-family:'Oswald',sans-serif;font-weight:600;font-size:15.5px;color:var(--forest-dark);}
.tour-price span{display:block;font-family:'Work Sans',sans-serif;font-weight:400;font-size:11px;color:var(--sage);text-transform:none;}
.btn-detail{
  font-size:13px;font-weight:600;color:var(--forest);
  border:1.5px solid var(--forest);border-radius:999px;padding:8px 16px;
  transition:background .15s ease, color .15s ease;
}
.btn-detail:hover{background:var(--forest);color:#fff;}
.empty-state{
  text-align:center;padding:60px 20px;color:var(--sage);
  border:1px dashed var(--sage-line);border-radius:var(--radius);
}

/* ---------- Tour detail ---------- */
.detail-wrap{display:grid;grid-template-columns:1.3fr 1fr;gap:40px;align-items:start;}
.detail-media img{border-radius:var(--radius);width:100%;aspect-ratio:4/3;object-fit:cover;box-shadow:var(--shadow);}
.detail-info h1{font-size:clamp(24px,3vw,32px);text-transform:none;margin-bottom:10px;}
.detail-chips{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:18px;}
.chip{
  font-size:12.5px;font-weight:600;padding:6px 14px;border-radius:999px;
  background:var(--bg-soft);color:var(--forest);border:1px solid var(--sage-line);
}
.detail-price{
  font-family:'Oswald',sans-serif;font-size:26px;color:var(--forest-dark);margin:6px 0 20px;
}
.detail-price span{font-family:'Work Sans',sans-serif;font-size:13px;color:var(--sage);text-transform:none;}
.detail-desc{color:#3d4a3f;line-height:1.75;font-size:15px;margin-bottom:26px;}
.btn-wa-lg{
  display:inline-flex;align-items:center;gap:10px;background:var(--wa);color:#fff;
  font-weight:700;font-size:15px;padding:15px 26px;border-radius:12px;
  box-shadow:0 10px 24px -10px rgba(37,211,102,.6);
}
.btn-wa-lg:hover{background:var(--wa-dark);}
.back-link{display:inline-flex;align-items:center;gap:6px;color:var(--clay);font-weight:600;font-size:13.5px;margin-bottom:22px;}

/* ---------- Floating WA button ---------- */
.fab-wa{
  position:fixed;right:20px;bottom:20px;z-index:60;
  background:var(--wa);color:#fff;width:58px;height:58px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 12px 26px -8px rgba(37,211,102,.65);
  animation:pulse 2.6s ease-in-out infinite;
}
.fab-wa svg{width:28px;height:28px;}
@keyframes pulse{
  0%,100%{box-shadow:0 12px 26px -8px rgba(37,211,102,.65);}
  50%{box-shadow:0 12px 26px -4px rgba(37,211,102,.95),0 0 0 8px rgba(37,211,102,.12);}
}

/* ---------- Footer ---------- */
footer{background:var(--forest-dark);color:#DCEADD;padding:44px 0 24px;margin-top:40px;}
.footer-grid{display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap;align-items:flex-start;}
.footer-brand{display:flex;align-items:center;gap:10px;}
.footer-brand img{height:38px;filter:brightness(0) invert(1);}
.footer-brand span{font-family:'Oswald',sans-serif;font-size:18px;text-transform:uppercase;color:#fff;font-weight:700;}
.footer-social{display:flex;gap:10px;}
.footer-social a{
  width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.08);
  display:flex;align-items:center;justify-content:center;
}
.footer-social a:hover{background:rgba(255,255,255,.18);}
.footer-social svg{width:18px;height:18px;}
.footer-bottom{
  margin-top:30px;padding-top:20px;border-top:1px solid rgba(255,255,255,.12);
  font-size:12.5px;color:#9DB6A3;text-align:center;
}

/* ---------- Reveal on scroll ---------- */
.reveal{opacity:0;transform:translateY(16px);transition:opacity .5s ease, transform .5s ease;}
.reveal.is-visible{opacity:1;transform:none;}
@media (prefers-reduced-motion: reduce){
  .reveal{opacity:1;transform:none;}
  .fab-wa{animation:none;}
  .slide{transition:none;}
}

/* ---------- Mobile ---------- */
.menu-toggle{display:none;}
@media (max-width:900px){
  .filter-grid{grid-template-columns:1fr 1fr;}
  .btn-search{grid-column:1/-1;}
  .tour-grid{grid-template-columns:repeat(2,1fr);}
  .detail-wrap{grid-template-columns:1fr;}
}
@media (max-width:620px){
  .filter-grid{grid-template-columns:1fr;}
  .tour-grid{grid-template-columns:1fr;}
  .section-head{flex-direction:column;align-items:flex-start;}
  .nav-actions .btn-wa-top span{display:none;}
}
