/* ============================================================
   India Golden Triangle Tours — Homepage (ChatGPT-structure rebuild)
   Self-contained stylesheet: no Bootstrap / Font Awesome dependency.
   Shares the same brand palette + fonts as css/redesign.css so the
   homepage stays visually consistent with the packages/detail pages.
   ============================================================ */

:root{
  --ink:        #1f2a24;
  --ink-soft:   #4b564f;
  --paper:      #ffffff;
  --paper-soft: #f7f5f0;
  --line:       #e7e2d8;
  --brand:      #c2571b;
  --brand-dark: #a3480f;
  --accent:     #17573f;
  --accent-soft:#e9f2ee;
  --gold:       #caa24a;
  --shadow:     0 10px 30px rgba(31,42,36,.10);
  --shadow-sm:  0 4px 14px rgba(31,42,36,.08);
  --radius:     14px;
  --radius-sm:  8px;
}

*{ box-sizing:border-box; }
body{ margin:0; font-family:'Inter',-apple-system,"Segoe UI",Roboto,sans-serif; color:var(--ink); background:var(--paper); line-height:1.5; }
h1,h2,h3{ font-family:'Fraunces',Georgia,'Times New Roman',serif; font-weight:600; color:var(--ink); margin:0 0 10px; }
p{ margin:0 0 12px; }
a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; }
ul{ margin:0; padding:0; list-style:none; }

.container-xl{ max-width:1240px; margin:0 auto; padding:0 20px; }

/* ---------- Buttons ---------- */
.btn{ display:inline-flex; align-items:center; gap:8px; padding:12px 22px; border-radius:999px; font-size:14px; font-weight:600; border:1px solid transparent; cursor:pointer; }
.btn-primary{ background:var(--brand); color:#fff; }
.btn-primary:hover{ background:var(--brand-dark); }
.btn-light{ background:rgba(255,255,255,.14); color:#fff; border-color:rgba(255,255,255,.55); }
.btn-light:hover{ background:rgba(255,255,255,.24); }
.text-link{ font-size:13.5px; font-weight:600; color:var(--brand); white-space:nowrap; }
.text-link:hover{ text-decoration:underline; }

/* ---------- Header (shares real .gt-topbar / .gt-header markup + rules
   from css/redesign.css — this block only adds the homepage's working
   mobile nav toggle, since the shared header has never had one) ---------- */
.navbar-toggle-gt{
  background:none; border:1px solid var(--line); border-radius:8px; font-size:20px;
  padding:4px 10px; cursor:pointer; color:var(--ink); line-height:1.4;
}
.gt-nav-mobile{ display:none; flex-direction:column; padding:10px 20px 16px; border-top:1px solid var(--line); gap:2px; }
.gt-nav-mobile a{ padding:10px 4px; font-size:14px; font-weight:500; color:var(--ink-soft); border-bottom:1px solid var(--line); }
.gt-nav-mobile a:last-child{ border-bottom:none; }
.gt-nav-mobile a.nav-cta{ margin-top:8px; background:var(--brand); color:#fff; border-radius:999px; text-align:center; border-bottom:none; }
.gt-nav-mobile.gt-open{ display:flex; }
@media (min-width:992px){ .gt-nav-mobile{ display:none !important; } }

/* ---------- Hero ---------- */
.hero{ position:relative; background:linear-gradient(rgba(23,32,26,.62),rgba(23,32,26,.72)),url('../images/gt-taj.jpg') center/cover; color:#fff; padding:86px 0 76px; }
.hero-grid{ display:flex; gap:36px; align-items:center; justify-content:space-between; }
.hero-content{ max-width:560px; flex:1 1 420px; }
.eyebrow{ text-transform:uppercase; letter-spacing:.14em; font-size:12px; font-weight:700; color:var(--gold); margin-bottom:14px; }
.hero h1{ color:#fff; font-size:clamp(30px,4.6vw,46px); line-height:1.12; margin-bottom:16px; }
.hero p{ color:#eef1ee; font-size:15.5px; max-width:520px; margin-bottom:24px; }
.hero-actions{ display:flex; gap:12px; flex-wrap:wrap; margin-bottom:16px; }
.hero-note{ font-size:12.5px; color:#d9dfda; letter-spacing:.02em; }

/* Compact callback-request card, sitting over the hero photo alongside the
   headline (real backend, same Model/form_script_small.php "small enquiry
   form" endpoint the package-detail pages already use - just names1/emails1/
   phones1, no invented fields). Distinct field ids from the #plan form
   further down the page since both forms now live on the same document. */
.hero-quote-card{
  flex:0 0 336px; max-width:100%; background:rgba(255,255,255,.98); color:var(--ink);
  border-radius:var(--radius); padding:22px 22px 20px; box-shadow:0 24px 48px rgba(13,18,15,.35);
}
.hero-quote-card h3{ font-size:16.5px; margin:0 0 4px; color:var(--ink); }
.hero-quote-card .hint{ font-size:12px; color:var(--ink-soft); margin:0 0 14px; line-height:1.5; }
.hero-quote-card .hq-field{ margin-bottom:10px; }
.hero-quote-card .hq-field input{
  width:100%; height:42px; border-radius:var(--radius-sm); border:1px solid var(--line);
  padding:0 12px; font-size:13.5px; color:var(--ink); font-family:inherit;
}
.hero-quote-card .hq-consent{ display:flex; gap:7px; align-items:flex-start; font-size:10.5px; line-height:1.5; color:var(--ink-soft); margin:8px 0 12px; }
.hero-quote-card .hq-consent input{ margin-top:2px; flex:0 0 auto; }
.hero-quote-card button{ width:100%; height:44px; }
.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

@media (max-width: 860px){
  .hero-grid{ flex-direction:column; align-items:stretch; }
  .hero-quote-card{ flex:1 1 auto; }
}

/* ---------- Quick search bar ---------- */
.quick-bar{ background:var(--paper-soft); border-bottom:1px solid var(--line); padding:22px 0; }
.quick-card{ display:flex; gap:10px; flex-wrap:wrap; background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:12px; box-shadow:var(--shadow-sm); }
.quick-card input, .quick-card select{ flex:1 1 200px; height:46px; border-radius:var(--radius-sm); border:1px solid var(--line); padding:0 14px; font-size:13.5px; color:var(--ink); font-family:inherit; }
.quick-card .btn{ flex:0 0 auto; height:46px; padding:0 24px; }

/* ---------- Section shell ---------- */
.section{ padding:64px 0; }
.section-soft{ background:var(--paper-soft); }
.section-head{ display:flex; justify-content:space-between; align-items:flex-end; gap:20px; flex-wrap:wrap; margin-bottom:30px; }
.section-kicker{ text-transform:uppercase; letter-spacing:.12em; font-size:11.5px; font-weight:700; color:var(--brand); margin-bottom:8px; }
.section-head h2{ font-size:clamp(22px,3vw,30px); margin-bottom:8px; }
.section-intro{ color:var(--ink-soft); font-size:14px; max-width:640px; }

/* ---------- Journey grid ---------- */
.journey-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:22px; }
.journey-card{ background:#fff; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-sm); display:flex; flex-direction:column; }
.journey-image{ position:relative; height:170px; }
.journey-image img{ width:100%; height:100%; object-fit:cover; }
.journey-badge{ position:absolute; top:10px; left:10px; background:rgba(23,32,26,.82); color:#fff; font-size:11px; font-weight:600; padding:5px 10px; border-radius:999px; }
.journey-body{ padding:16px; display:flex; flex-direction:column; flex:1; }
.journey-meta{ font-size:11.5px; color:var(--brand); font-weight:600; text-transform:uppercase; letter-spacing:.04em; margin-bottom:6px; }
.journey-body h3{ font-size:15.5px; margin-bottom:8px; line-height:1.3; }
.journey-body p{ font-size:13px; color:var(--ink-soft); flex:1; margin-bottom:14px; }
.journey-foot{ display:flex; justify-content:space-between; align-items:center; gap:10px; border-top:1px dashed var(--line); padding-top:12px; }
.price{ font-size:13px; font-weight:700; color:var(--ink); line-height:1.3; }
.price small{ display:block; font-weight:400; font-size:11px; color:var(--ink-soft); }
.search-empty{ display:none; text-align:center; padding:40px 20px; color:var(--ink-soft); font-size:14px; border:1px dashed var(--line); border-radius:var(--radius); margin-top:10px; }
.search-empty.gt-visible{ display:block; }

/* ---------- Stats ---------- */
.stats{ display:flex; flex-wrap:wrap; text-align:center; }
.stat{ flex:1 1 220px; padding:14px; display:flex; flex-direction:column; gap:6px; }
.stat strong{ font-family:'Fraunces',serif; font-size:22px; color:var(--brand); }
.stat span{ font-size:13px; color:var(--ink-soft); }

/* ---------- Destinations grid ---------- */
.dest-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.dest{ position:relative; display:block; height:200px; border-radius:var(--radius); overflow:hidden; background-size:cover; background-position:center; box-shadow:var(--shadow-sm); }
.dest::before{ content:""; position:absolute; inset:0; background:linear-gradient(rgba(23,32,26,0),rgba(15,20,17,.82)); }
.dest-content{ position:absolute; left:0; right:0; bottom:0; padding:16px; color:#fff; }
.dest-content h3{ color:#fff; font-size:16px; margin-bottom:2px; }
.dest-content p{ font-size:12.5px; color:#e6e9e5; margin:0; }

/* ---------- Guest videos ---------- */
.video-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.video-card{ background:#fff; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-sm); }
.video-card iframe{ width:100%; aspect-ratio:16/9; border:0; display:block; }
.video-label{ padding:10px 14px; font-size:12.5px; color:var(--ink-soft); font-weight:600; }

/* ---------- Split (Welcome) ---------- */
.split{ display:flex; gap:48px; align-items:center; flex-wrap:wrap; }
.split-image{ flex:1 1 380px; min-height:360px; border-radius:var(--radius); background:url('../images/b-6.jpg') center/cover; box-shadow:var(--shadow); }
.split .copy{ flex:1 1 420px; min-width:280px; }
.split .copy p{ color:var(--ink-soft); font-size:14px; line-height:1.75; }
.check-list{ margin:18px 0 22px; display:flex; flex-direction:column; gap:10px; }
.check-list li{ display:flex; gap:10px; align-items:flex-start; font-size:13.5px; color:var(--ink-soft); }
.check-list li i{ font-style:normal; color:var(--brand); font-weight:700; }

/* ---------- Enquiry / plan section ---------- */
.enquiry-wrap{ display:flex; gap:40px; align-items:flex-start; flex-wrap:wrap; }
.enquiry-info{ flex:1 1 340px; min-width:280px; }
.enquiry-info p{ color:var(--ink-soft); font-size:14px; }
.contact-points{ display:flex; flex-direction:column; gap:12px; margin-top:20px; }
.contact-point{ display:flex; align-items:center; gap:10px; font-size:14px; font-weight:600; }
.contact-point i{ font-style:normal; width:30px; height:30px; border-radius:50%; background:var(--accent-soft); color:var(--accent); display:flex; align-items:center; justify-content:center; flex:0 0 auto; }
.form-card{ flex:1 1 460px; min-width:300px; background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:26px; box-shadow:var(--shadow); }
.form-card h3{ font-size:18px; margin-bottom:4px; }
.form-card .hint{ font-size:12.5px; color:var(--ink-soft); margin-bottom:18px; }
.form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.form-field{ display:flex; flex-direction:column; gap:6px; }
.form-field.full{ grid-column:1 / -1; }
.form-field label{ font-size:12px; font-weight:600; color:var(--ink-soft); }
.form-field input, .form-field select, .form-field textarea{ border:1px solid var(--line); border-radius:var(--radius-sm); padding:10px 12px; font-size:13.5px; font-family:inherit; color:var(--ink); }
.form-field textarea{ resize:vertical; min-height:70px; }
.consent{ display:flex; gap:8px; align-items:flex-start; font-size:11.5px; color:var(--ink-soft); font-weight:400; }
.consent input{ margin-top:2px; }
.enquiry-note{ font-size:11.5px; color:var(--ink-soft); margin-top:10px; }

/* ---------- Footer ---------- */
.site-footer{ background:var(--accent); color:#dfe8e2; padding:52px 0 20px; }
.footer-grid{ display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:32px; margin-bottom:24px; }
.footer-grid h3{ color:#fff; font-size:15px; margin-bottom:12px; }
.footer-grid p{ font-size:13px; color:#c9d5cd; line-height:1.7; }
.footer-grid ul{ display:flex; flex-direction:column; gap:8px; }
.footer-grid a{ font-size:13px; color:#c9d5cd; }
.footer-grid a:hover{ color:#fff; text-decoration:underline; }
.footer-notice{ font-size:11.5px; color:#b7c5bd; border-top:1px solid rgba(255,255,255,.14); padding-top:16px; margin-bottom:14px; line-height:1.7; }
.footer-bottom{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; font-size:12px; color:#b7c5bd; border-top:1px solid rgba(255,255,255,.14); padding-top:14px; }
.footer-bottom a{ color:#b7c5bd; }
.footer-bottom a:hover{ color:#fff; }

/* ---------- Floating actions ---------- */
.floating-actions{ position:fixed; right:18px; bottom:18px; display:flex; flex-direction:column; gap:10px; z-index:60; }
.float-btn{ width:48px; height:48px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:20px; color:#fff; background:var(--accent); box-shadow:var(--shadow); }
.float-btn.whatsapp{ background:#25D366; }

/* ---------- Responsive ---------- */
@media (max-width:980px){
  .journey-grid{ grid-template-columns:repeat(2,1fr); }
  .dest-grid{ grid-template-columns:repeat(2,1fr); }
  .video-grid{ grid-template-columns:repeat(2,1fr); }
  .footer-grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:760px){
  .journey-grid{ grid-template-columns:1fr 1fr; }
  .dest-grid{ grid-template-columns:1fr; }
  .video-grid{ grid-template-columns:1fr; }
  .split{ flex-direction:column; }
  .form-grid{ grid-template-columns:1fr; }
  .footer-grid{ grid-template-columns:1fr; }
  .enquiry-wrap{ flex-direction:column; }
}
@media (max-width:480px){
  .journey-grid{ grid-template-columns:1fr; }
  .hero{ padding:64px 0 56px; }
}
