/* ============================================================
   NYAKALLA ADVENTURE TOURS — Main Stylesheet
   Lennox Digital Systems © 2026
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700;800;900&family=Inter:wght@300;400;500;600&display=swap');

:root {
  --dark:      #0a0f1e;
  --dark-2:    #111827;
  --dark-3:    #1a2232;
  --accent:    #e8a020;
  --accent-h:  #f5b835;
  --white:     #ffffff;
  --grey:      #6b7280;
  --light:     #f4f6f9;
  --border-d:  rgba(255,255,255,0.08);
  --radius:    10px;
  --shadow:    0 4px 24px rgba(0,0,0,0.12);
  --trans:     all 0.3s ease;
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { font-family:'Inter',system-ui,sans-serif; color:#333; background:#fff; overflow-x:hidden; }
img  { max-width:100%; height:auto; display:block; }
a    { text-decoration:none; color:inherit; }

/* ── TYPOGRAPHY ── */
h1,h2,h3,h4 { font-family:'Montserrat',sans-serif; font-weight:800; line-height:1.2; }
h1 { font-size:clamp(2.2rem,5vw,3.8rem); }
h2 { font-size:clamp(1.7rem,3vw,2.5rem); }
h3 { font-size:clamp(1.05rem,2vw,1.35rem); font-weight:700; }

/* ── UTILITY ── */
.container  { max-width:1180px; margin:0 auto; padding:0 5%; }
.section    { padding:88px 0; }
.section-dark { background:var(--dark-2); color:#fff; }
.section-alt  { background:var(--light); }
.text-accent  { color:var(--accent); }
.text-center  { text-align:center; }

.section-label {
  display:inline-block;
  font-size:0.68rem; font-weight:700;
  letter-spacing:0.22em; text-transform:uppercase;
  color:var(--accent); margin-bottom:10px;
}
.section-sub {
  font-size:1rem; color:var(--grey);
  max-width:580px; line-height:1.75;
  margin:12px auto 52px;
}
.section-dark .section-sub { color:#9ca3af; }

/* ── BUTTONS ── */
.btn {
  display:inline-flex; align-items:center; gap:8px;
  padding:13px 26px; border-radius:6px;
  font-family:'Montserrat',sans-serif; font-weight:700;
  font-size:0.82rem; letter-spacing:0.06em;
  cursor:pointer; border:none; transition:var(--trans);
  white-space:nowrap;
}
.btn-primary { background:var(--accent); color:var(--dark); }
.btn-primary:hover { background:var(--accent-h); transform:translateY(-2px); box-shadow:0 8px 24px rgba(232,160,32,0.35); }
.btn-outline { background:transparent; color:#fff; border:2px solid rgba(255,255,255,0.4); }
.btn-outline:hover { border-color:#fff; background:rgba(255,255,255,0.1); }
.btn-ghost { background:transparent; color:var(--dark); border:2px solid #dde1e7; }
.btn-ghost:hover { border-color:var(--accent); color:var(--accent); }
.btn-sm { padding:10px 20px; font-size:0.78rem; }

/* ── NAVBAR ── */
.navbar {
  position:fixed; top:0; width:100%; z-index:1000; height:70px;
  display:flex; align-items:center; justify-content:space-between;
  padding:0 5%;
  background:rgba(10,15,30,0.94);
  backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
  border-bottom:1px solid rgba(232,160,32,0.18);
  transition:var(--trans);
}
.nav-logo { display:flex; flex-direction:column; line-height:1; }
.nav-logo .logo-main { font-family:'Montserrat',sans-serif; font-weight:900; font-size:1.25rem; color:#fff; letter-spacing:0.1em; }
.nav-logo .logo-sub  { font-size:0.55rem; letter-spacing:0.28em; color:var(--accent); text-transform:uppercase; margin-top:2px; }

.nav-links { display:flex; align-items:center; gap:4px; list-style:none; }
.nav-links a {
  font-family:'Montserrat',sans-serif; font-weight:600;
  font-size:0.75rem; letter-spacing:0.07em; text-transform:uppercase;
  color:rgba(255,255,255,0.78); padding:8px 12px; border-radius:5px; transition:var(--trans);
}
.nav-links a:hover, .nav-links a.active { color:#fff; background:rgba(255,255,255,0.08); }
.nav-links .nav-cta { background:var(--accent); color:var(--dark) !important; margin-left:8px; }
.nav-links .nav-cta:hover { background:var(--accent-h); }

.nav-toggle { display:none; background:none; border:none; cursor:pointer; padding:4px; }
.nav-toggle span { display:block; width:22px; height:2px; background:#fff; margin:4px 0; transition:var(--trans); }

/* ── HERO ── */
.hero {
  position:relative; height:100vh; min-height:620px;
  display:flex; align-items:center; overflow:hidden;
}
.hero-bg {
  position:absolute; inset:0;
  background-size:cover; background-position:center; background-attachment:fixed;
}
.hero-bg::after {
  content:''; position:absolute; inset:0;
  background:linear-gradient(130deg, rgba(10,15,30,0.88) 0%, rgba(10,15,30,0.5) 55%, rgba(10,15,30,0.72) 100%);
}
.hero-content { position:relative; z-index:1; color:#fff; max-width:680px; }
.hero-eyebrow {
  display:inline-flex; align-items:center; gap:10px;
  background:rgba(232,160,32,0.12); border:1px solid rgba(232,160,32,0.35);
  color:var(--accent); font-size:0.68rem; font-weight:700;
  letter-spacing:0.22em; text-transform:uppercase;
  padding:7px 18px; border-radius:100px; margin-bottom:22px;
}
.hero h1 { margin-bottom:18px; text-shadow:0 2px 24px rgba(0,0,0,0.4); }
.hero h1 span { color:var(--accent); }
.hero-desc { font-size:1.05rem; line-height:1.75; color:rgba(255,255,255,0.82); margin-bottom:34px; max-width:540px; }
.hero-actions { display:flex; gap:12px; flex-wrap:wrap; }
.hero-scroll {
  position:absolute; bottom:28px; left:50%; transform:translateX(-50%);
  display:flex; flex-direction:column; align-items:center; gap:6px;
  color:rgba(255,255,255,0.45); font-size:0.65rem; letter-spacing:0.18em; text-transform:uppercase; z-index:1;
  animation:heroScroll 2.2s ease-in-out infinite;
}
.hero-scroll::after { content:''; display:block; width:1px; height:36px; background:rgba(255,255,255,0.3); }
@keyframes heroScroll { 0%,100%{opacity:0.5;transform:translateX(-50%) translateY(0)} 50%{opacity:1;transform:translateX(-50%) translateY(-8px)} }

/* ── STATS BAR ── */
.stats-bar { background:var(--accent); padding:22px 5%; }
.stats-bar .inner { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; max-width:1180px; margin:0 auto; }
.stat-item { text-align:center; }
.stat-num   { font-family:'Montserrat',sans-serif; font-size:2rem; font-weight:900; color:var(--dark); line-height:1; }
.stat-label { font-size:0.68rem; font-weight:700; color:rgba(10,15,30,0.65); letter-spacing:0.12em; text-transform:uppercase; margin-top:5px; }

/* ── SECTION INTRO ── */
.section-intro { max-width:620px; margin:0 auto 56px; text-align:center; }

/* ── TOUR CARDS (3-col grid) ── */
.tours-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:26px; }
.tour-card {
  background:#fff; border-radius:12px; overflow:hidden;
  box-shadow:0 2px 16px rgba(0,0,0,0.07); border:1px solid #eaecef;
  transition:var(--trans);
}
.tour-card:hover { transform:translateY(-6px); box-shadow:0 16px 40px rgba(0,0,0,0.14); }
.card-img { position:relative; height:215px; overflow:hidden; }
.card-img img { width:100%; height:100%; object-fit:cover; transition:transform 0.5s ease; }
.tour-card:hover .card-img img { transform:scale(1.06); }
.card-badge {
  position:absolute; top:13px; left:13px;
  background:var(--accent); color:var(--dark);
  font-size:0.65rem; font-weight:700; letter-spacing:0.1em; text-transform:uppercase;
  padding:4px 10px; border-radius:4px;
}
.card-diff {
  position:absolute; top:13px; right:13px;
  background:rgba(10,15,30,0.72); color:#fff;
  font-size:0.65rem; font-weight:600; padding:4px 10px; border-radius:4px;
}
.card-body { padding:20px 22px; }
.card-body h3 { margin-bottom:8px; color:var(--dark); font-size:1.05rem; }
.card-meta {
  display:flex; gap:14px; font-size:0.75rem; color:var(--grey);
  margin-bottom:10px; flex-wrap:wrap;
}
.card-meta span { display:flex; align-items:center; gap:4px; }
.card-desc { font-size:0.86rem; color:#555; line-height:1.65; margin-bottom:18px; }
.card-footer-row {
  display:flex; align-items:center; justify-content:space-between;
  border-top:1px solid #eee; padding-top:15px;
}
.card-price { font-family:'Montserrat',sans-serif; font-weight:900; color:var(--accent); font-size:1.2rem; }
.card-price small { font-size:0.7rem; font-weight:500; color:var(--grey); }

/* ── FEATURES ── */
.features-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:28px; }
.feature-card { text-align:center; padding:32px 18px; }
.feature-icon { font-size:2.6rem; margin-bottom:14px; }
.feature-card h3 { font-size:0.95rem; margin-bottom:10px; color:#fff; }
.feature-card p  { font-size:0.84rem; color:#9ca3af; line-height:1.65; }

/* ── GALLERY ── */
.gallery-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  grid-template-rows:repeat(2,230px);
  gap:10px;
}
.gallery-item { overflow:hidden; border-radius:8px; }
.gallery-item:first-child { grid-column:1; grid-row:1/3; }
.gallery-item img { width:100%; height:100%; object-fit:cover; transition:transform 0.5s ease; }
.gallery-item:hover img { transform:scale(1.05); }

/* ── TESTIMONIALS ── */
.testimonials-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.testimonial-card {
  background:var(--dark-3); border-radius:12px; padding:26px;
  border:1px solid var(--border-d); position:relative;
}
.testimonial-card::before {
  content:'\201C'; position:absolute; top:14px; right:22px;
  font-size:4rem; color:var(--accent); opacity:0.25; font-family:Georgia,serif; line-height:1;
}
.stars { color:var(--accent); font-size:0.88rem; margin-bottom:10px; letter-spacing:2px; }
.testimonial-card p { font-size:0.87rem; color:#d1d5db; line-height:1.72; margin-bottom:18px; font-style:italic; }
.reviewer { display:flex; align-items:center; gap:12px; }
.reviewer-avatar {
  width:40px; height:40px; border-radius:50%; flex-shrink:0;
  background:var(--accent); display:flex; align-items:center; justify-content:center;
  font-family:'Montserrat',sans-serif; font-weight:900; color:var(--dark); font-size:0.95rem;
}
.reviewer-name   { font-weight:700; color:#fff; font-size:0.88rem; }
.reviewer-origin { font-size:0.73rem; color:#6b7280; }

/* ── CTA SECTION ── */
.cta-section {
  background:linear-gradient(140deg, var(--dark) 0%, var(--dark-3) 100%);
  padding:100px 5%; text-align:center; position:relative; overflow:hidden;
}
.cta-section::before {
  content:''; position:absolute; top:-50%; left:-50%; width:200%; height:200%;
  background:radial-gradient(circle, rgba(232,160,32,0.06) 0%, transparent 60%);
  pointer-events:none;
}
.cta-section .container { position:relative; z-index:1; }
.cta-section h2 { color:#fff; margin-bottom:14px; }
.cta-section p  { color:#9ca3af; font-size:1rem; margin-bottom:34px; }

/* ── FOOTER ── */
footer { background:var(--dark); color:#9ca3af; padding:60px 0 24px; border-top:1px solid var(--border-d); }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1.4fr; gap:44px; margin-bottom:44px; }
.footer-logo .logo-main { font-family:'Montserrat',sans-serif; font-weight:900; font-size:1.3rem; color:#fff; letter-spacing:0.1em; }
.footer-logo .logo-sub  { font-size:0.56rem; letter-spacing:0.28em; color:var(--accent); text-transform:uppercase; }
.footer-logo p { font-size:0.86rem; line-height:1.72; margin-top:14px; }

.footer-col h4 {
  font-family:'Montserrat',sans-serif; font-size:0.72rem; font-weight:700;
  letter-spacing:0.18em; text-transform:uppercase; color:#fff; margin-bottom:16px;
}
.footer-col ul { list-style:none; }
.footer-col ul li { margin-bottom:8px; }
.footer-col ul li a { font-size:0.86rem; transition:var(--trans); }
.footer-col ul li a:hover { color:var(--accent); }
.contact-line { display:flex; align-items:flex-start; gap:10px; margin-bottom:10px; font-size:0.86rem; }

.footer-bottom {
  border-top:1px solid var(--border-d); padding-top:22px;
  display:flex; justify-content:space-between; align-items:center; font-size:0.78rem;
}
.footer-bottom a { color:var(--accent); }

/* ── PAGE HERO (inner pages) ── */
.page-hero {
  padding:150px 5% 80px;
  background:linear-gradient(140deg, var(--dark) 0%, var(--dark-3) 100%);
  position:relative; overflow:hidden; color:#fff; text-align:center;
}
.page-hero-bg {
  position:absolute; inset:0;
  background-size:cover; background-position:center;
  opacity:0.12;
}
.page-hero .container { position:relative; z-index:1; }
.page-hero h1 { margin-bottom:14px; }
.page-hero p  { color:#9ca3af; font-size:1rem; max-width:540px; margin:0 auto; }
.breadcrumb { display:flex; justify-content:center; gap:8px; font-size:0.78rem; margin-bottom:16px; color:rgba(255,255,255,0.5); }
.breadcrumb a { color:var(--accent); }

/* ── TOURS PAGE — full cards ── */
.tours-full-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:28px; }
.tour-card-full {
  background:#fff; border-radius:12px; overflow:hidden;
  box-shadow:0 2px 16px rgba(0,0,0,0.07); border:1px solid #eaecef;
  transition:var(--trans);
}
.tour-card-full:hover { transform:translateY(-4px); box-shadow:0 14px 36px rgba(0,0,0,0.13); }
.tour-card-full .tcard-img { height:220px; overflow:hidden; position:relative; }
.tour-card-full .tcard-img img { width:100%; height:100%; object-fit:cover; transition:transform 0.5s ease; }
.tour-card-full:hover .tcard-img img { transform:scale(1.05); }
.tour-card-full .tcard-body { padding:26px; }
.tour-card-full h3 { color:var(--dark); margin-bottom:8px; }
.tour-highlights { list-style:none; margin:12px 0 16px; }
.tour-highlights li {
  font-size:0.82rem; color:#555; padding:3px 0;
  display:flex; align-items:center; gap:8px;
}
.tour-highlights li::before { content:'✓'; color:var(--accent); font-weight:700; flex-shrink:0; }
.tcard-footer { display:flex; align-items:center; justify-content:space-between; border-top:1px solid #eee; padding-top:16px; margin-top:8px; }

/* ── ABOUT PAGE ── */
.about-story { display:grid; grid-template-columns:1fr 1fr; gap:72px; align-items:center; }
.story-img   { border-radius:12px; overflow:hidden; height:430px; }
.story-img img { width:100%; height:100%; object-fit:cover; }
.story-content h2 { margin-bottom:20px; }
.story-content p  { color:#555; line-height:1.82; margin-bottom:14px; font-size:0.94rem; }

.team-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:22px; }
.team-card  { text-align:center; }
.team-photo { width:100%; height:200px; border-radius:10px; overflow:hidden; margin-bottom:14px; }
.team-photo img { width:100%; height:100%; object-fit:cover; }
.team-card h3   { font-size:0.95rem; color:var(--dark); margin-bottom:4px; }
.team-role  { font-size:0.75rem; color:var(--accent); font-weight:700; text-transform:uppercase; letter-spacing:0.1em; margin-bottom:5px; }
.team-exp   { font-size:0.8rem; color:var(--grey); }

.values-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.value-card {
  background:var(--dark-3); border-radius:10px; padding:28px;
  border:1px solid var(--border-d); text-align:center;
}
.value-card .val-icon { font-size:2.2rem; margin-bottom:12px; }
.value-card h3 { color:#fff; font-size:0.95rem; margin-bottom:10px; }
.value-card p  { font-size:0.84rem; color:#9ca3af; line-height:1.65; }

/* ── ENQUIRE PAGE ── */
.enquire-layout { display:grid; grid-template-columns:1.7fr 1fr; gap:56px; align-items:start; }
.enquire-form-wrap {
  background:#fff; border-radius:14px; padding:40px;
  box-shadow:0 4px 32px rgba(0,0,0,0.08); border:1px solid #eaecef;
}
.enquire-form-wrap h2 { margin-bottom:6px; color:var(--dark); font-size:1.5rem; }
.enquire-form-wrap > p { color:var(--grey); font-size:0.88rem; margin-bottom:28px; }

.form-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.form-group { margin-bottom:18px; }
.form-label { display:block; font-size:0.78rem; font-weight:600; color:#444; margin-bottom:6px; letter-spacing:0.02em; }
.form-control {
  width:100%; padding:11px 14px;
  border:1.5px solid #dde1e7; border-radius:7px;
  font-size:0.9rem; font-family:inherit; color:#333;
  background:#fafbfc; transition:var(--trans);
}
.form-control:focus { outline:none; border-color:var(--accent); background:#fff; box-shadow:0 0 0 3px rgba(232,160,32,0.12); }
textarea.form-control { resize:vertical; min-height:110px; }
select.form-control { cursor:pointer; }

.form-submit { margin-top:6px; }

.contact-sidebar { color:#fff; }
.contact-sidebar h3 { margin-bottom:22px; }
.contact-card {
  display:flex; gap:16px; margin-bottom:18px;
  padding:20px; background:var(--dark-3);
  border-radius:10px; border:1px solid var(--border-d);
}
.contact-card .cc-icon { font-size:1.5rem; flex-shrink:0; line-height:1; }
.contact-card h4 { font-size:0.82rem; font-weight:700; color:#fff; margin-bottom:4px; }
.contact-card p  { font-size:0.82rem; color:#9ca3af; line-height:1.6; }
.whatsapp-btn {
  display:flex; align-items:center; gap:10px; justify-content:center;
  background:#25D366; color:#fff; font-weight:700; font-size:0.86rem;
  padding:13px 24px; border-radius:8px; margin-top:24px;
  transition:var(--trans);
}
.whatsapp-btn:hover { background:#1ebe5a; transform:translateY(-2px); }

/* ── RESPONSIVE ── */
@media (max-width:1024px) {
  .tours-grid      { grid-template-columns:repeat(2,1fr); }
  .features-grid   { grid-template-columns:repeat(2,1fr); }
  .footer-grid     { grid-template-columns:1fr 1fr; gap:32px; }
  .team-grid       { grid-template-columns:repeat(2,1fr); }
  .about-story     { grid-template-columns:1fr; gap:40px; }
  .enquire-layout  { grid-template-columns:1fr; }
}

@media (max-width:768px) {
  .nav-links {
    display:none; position:fixed; top:70px; left:0; width:100%;
    background:rgba(10,15,30,0.97); flex-direction:column;
    padding:16px; gap:4px; border-top:1px solid var(--border-d);
  }
  .nav-links.open { display:flex; }
  .nav-toggle     { display:block; }
  .tours-grid     { grid-template-columns:1fr; }
  .testimonials-grid { grid-template-columns:1fr; }
  .stats-bar .inner  { grid-template-columns:repeat(2,1fr); }
  .gallery-grid {
    grid-template-columns:repeat(2,1fr);
    grid-template-rows:auto;
  }
  .gallery-item:first-child { grid-column:1/-1; grid-row:auto; height:220px; }
  .tours-full-grid { grid-template-columns:1fr; }
  .values-grid { grid-template-columns:1fr; }
  .form-row    { grid-template-columns:1fr; }
  .hero-bg     { background-attachment:scroll; }
}

@media (max-width:480px) {
  .section      { padding:60px 0; }
  .hero-actions { flex-direction:column; align-items:flex-start; }
  .footer-grid  { grid-template-columns:1fr; gap:28px; }
  .footer-bottom { flex-direction:column; gap:8px; text-align:center; }
  .team-grid    { grid-template-columns:1fr 1fr; }
}

/* ── ENQUIRE PAGE — updated layout ── */
.enquire-form-panel {
  background:#fff; border-radius:14px; padding:40px;
  box-shadow:0 4px 32px rgba(0,0,0,0.08); border:1px solid #eaecef;
}
.enquire-form-panel h2 { color:var(--dark); font-size:1.5rem; margin-bottom:6px; }

.enquire-sidebar { display:flex; flex-direction:column; gap:20px; }

.sidebar-card {
  background:#f9fafb; border-radius:12px; padding:22px;
  border:1px solid #eaecef;
}
.sidebar-card h3 { font-size:1rem; color:var(--dark); margin-bottom:12px; }
.sidebar-card .contact-line { margin-bottom:8px; }

.next-steps {
  list-style:none; counter-reset:steps;
}
.next-steps li {
  counter-increment:steps;
  display:flex; align-items:baseline; gap:12px;
  font-size:0.86rem; color:#555; padding:5px 0;
  border-bottom:1px solid #eee;
}
.next-steps li:last-child { border-bottom:none; }
.next-steps li::before {
  content:counter(steps);
  min-width:22px; height:22px; border-radius:50%;
  background:var(--accent); color:var(--dark);
  font-family:'Montserrat',sans-serif; font-weight:900; font-size:0.72rem;
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}

.includes-list { list-style:none; }
.includes-list li { font-size:0.86rem; color:#555; padding:5px 0; display:flex; align-items:center; gap:8px; border-bottom:1px solid #f3f4f6; }
.includes-list li:last-child { border-bottom:none; }

/* bikes grid responsive */
@media (max-width:768px) {
  .bikes-grid { grid-template-columns:1fr !important; }
  .enquire-layout { grid-template-columns:1fr; }
}
