@import 'floating-back.css';

/* ==========================================================================
   JOURNEYS WITH KISHAN — UNIFIED GLOBAL FOOTER STYLESHEET
   Consistent, premium luxury layout across ALL pages (Desktop + Tablet + Mobile)
   ========================================================================== */

:root{
  --footer-bg: #1f1f1f;
  --footer-ink: #0a0a0a;
  --footer-text: rgba(255,255,255,.6);
  --footer-text-muted: rgba(255,255,255,.45);
  --footer-title: rgba(255,255,255,.9);
  --footer-border: rgba(255,255,255,.08);
}

/* ==========================================
   BASE FOOTER CONTAINER
   ========================================== */
.footer,
footer.footer{
  background: var(--footer-bg);
  color: #fff;
  padding: 0 var(--gutter, clamp(20px, 4vw, 56px));
  position: relative;
  overflow: hidden;
  border-top: 1px solid var(--footer-border);
  box-sizing: border-box;
}

.footer::before,
footer.footer::before{
  display: none;
}

.footer .footer__container,
.footer__container{
  max-width: var(--max, 1280px);
  margin: 0 auto;
  box-sizing: border-box;
}

/* ==========================================
   TOP SECTION — Large Brand Closing Statement
   ========================================== */
.footer .footer__top,
.footer__top{
  background: var(--footer-ink);
  text-align: center;
  margin: 0 calc(var(--gutter, clamp(20px, 4vw, 56px)) * -1);
  padding: clamp(48px, 6vw, 76px) var(--gutter, clamp(20px, 4vw, 56px)) clamp(38px, 5vw, 58px);
  border-bottom: 1px solid rgba(255,255,255,.14);
  box-sizing: border-box;
}

.footer .footer__eyebrow,
.footer__eyebrow{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  font-family: var(--font-label, var(--fl, 'Cinzel', Georgia, serif));
  font-weight: 400;
  font-size: 11px;
  letter-spacing: 3.2px;
  text-transform: uppercase;
  color: rgba(255,255,255,.5);
  margin-bottom: 18px;
}

.footer .footer__eyebrow::before,
.footer .footer__eyebrow::after,
.footer__eyebrow::before,
.footer__eyebrow::after{
  content: '';
  width: 28px;
  height: 1px;
  background: rgba(255,255,255,.28);
}

.footer .footer__brand-title,
.footer .footer__top-title,
.footer__brand-title,
.footer__top-title{
  font-family: var(--font-display, var(--fd, 'Cormorant Garamond', Georgia, serif));
  font-weight: 300;
  font-style: italic;
  font-size: clamp(32px, 4.8vw, 58px);
  line-height: 1.08;
  letter-spacing: -1px;
  color: #fff;
  margin: 0 auto 16px;
  max-width: 740px;
}

.footer .footer__sub,
.footer .footer__top-sub,
.footer__sub,
.footer__top-sub{
  font-family: var(--font-body, var(--fb, 'Montserrat', system-ui, sans-serif));
  font-size: 13.5px;
  line-height: 1.65;
  color: rgba(255,255,255,.6);
  max-width: 500px;
  margin: 0 auto 26px;
}

.footer .footer__cta,
.footer .footer__top-cta,
.footer__cta,
.footer__top-cta{
  display: inline-block;
  font-family: var(--font-body, var(--fb, 'Montserrat', system-ui, sans-serif));
  font-weight: 500;
  font-size: 11px;
  letter-spacing: 2.6px;
  text-transform: uppercase;
  color: #0a0a0a;
  background: #fff;
  padding: 14px 34px;
  border: 1px solid #fff;
  text-decoration: none;
  transition: all .4s cubic-bezier(0.65, 0, 0.35, 1);
}

.footer .footer__cta:hover,
.footer .footer__top-cta:hover,
.footer__cta:hover,
.footer__top-cta:hover{
  background: transparent;
  color: #fff;
  letter-spacing: 2.9px;
}

/* ==========================================
   MIDDLE GRID — 4-Column Layout
   ========================================== */
.footer .footer__grid,
.footer__grid{
  display: grid;
  grid-template-columns: 1.3fr 1fr 1fr 1.3fr;
  gap: clamp(30px, 3.8vw, 56px);
  padding: clamp(46px, 5.2vw, 68px) 0;
  border-bottom: 1px solid var(--footer-border);
  align-items: start;
  box-sizing: border-box;
}

/* Column titles */
.footer .footer__col-title,
.footer .footer__col h5,
.footer .footer__grid > div > h4,
.footer__col-title{
  font-family: var(--font-label, var(--fl, 'Cinzel', Georgia, serif));
  font-weight: 500;
  font-size: 11px;
  letter-spacing: 2.8px;
  text-transform: uppercase;
  color: var(--footer-title);
  margin: 0 0 18px;
  line-height: 1.3;
}

/* Navigation lists */
.footer .footer__list,
.footer .footer__col ul,
.footer__list{
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 11px;
}

.footer .footer__list li,
.footer .footer__col ul li{
  margin: 0;
  padding: 0;
}

.footer .footer__list li a,
.footer .footer__list li span,
.footer .footer__col ul a,
.footer .footer__list a,
.footer .footer__list span,
.footer__list li a,
.footer__list li span{
  font-family: var(--font-body, var(--fb, 'Montserrat', system-ui, sans-serif));
  font-weight: 400;
  font-size: 13px;
  line-height: 1.5;
  letter-spacing: .2px;
  color: var(--footer-text);
  text-decoration: none;
  transition: color .3s ease, letter-spacing .3s ease;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.footer .footer__list li a:hover,
.footer .footer__col ul a:hover,
.footer .footer__list a:hover,
.footer__list li a:hover{
  color: #fff;
  letter-spacing: .4px;
}

/* About column */
.footer .footer__about-text,
.footer .footer__about,
.footer .footer__col p,
.footer__about-text,
.footer__about{
  font-family: var(--font-body, var(--fb, 'Montserrat', system-ui, sans-serif));
  font-size: 13px;
  line-height: 1.7;
  color: var(--footer-text);
  margin: 0 0 16px;
}

.footer .footer__protect,
.footer__protect{
  display: flex;
  flex-direction: column;
  gap: 8px;
  font-family: var(--font-label, var(--fl, 'Cinzel', Georgia, serif));
  font-size: 10px;
  letter-spacing: 2.2px;
  text-transform: uppercase;
  color: var(--footer-text-muted);
}

.footer .footer__protect-item,
.footer__protect-item{
  display: flex;
  align-items: center;
  gap: 8px;
}

.footer .footer__protect-item::before,
.footer__protect-item::before{
  content: '✓';
  color: rgba(255,255,255,.7);
  font-size: 11px;
  font-weight: 300;
}

/* Contact column */
.footer .footer__contact a,
.footer .footer__contact span,
.footer .footer__contact-item,
.footer__contact a,
.footer__contact span{
  display: inline-flex;
  align-items: center;
  gap: 9px;
  font-size: 13px;
  color: var(--footer-text);
  text-decoration: none;
}

.footer .footer__contact a:hover,
.footer__contact a:hover{
  color: #fff;
}

.footer .footer__contact-icon,
.footer__contact-icon{
  width: 14px;
  height: 14px;
  opacity: .55;
  flex-shrink: 0;
}

/* Social icons & title */
.footer .footer__social-title,
.footer__social-title{
  font-family: var(--font-label, var(--fl, 'Cinzel', Georgia, serif));
  font-weight: 500;
  font-size: 11px;
  letter-spacing: 2.8px;
  text-transform: uppercase;
  color: var(--footer-title);
  margin: 22px 0 14px;
}

.footer .footer__social,
.footer__social{
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 18px;
}

.footer .footer__social a,
.footer__social a{
  width: 44px;
  height: 44px;
  border: none;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  position: relative;
  overflow: hidden;
  box-shadow: 0 4px 14px rgba(0,0,0,.35);
  transition: transform .35s ease, box-shadow .35s ease, filter .35s ease;
  flex-shrink: 0;
  text-decoration: none;
}

.footer .footer__social a:hover,
.footer__social a:hover{
  transform: translateY(-3px) scale(1.06);
  filter: brightness(1.1);
  box-shadow: 0 8px 20px rgba(0,0,0,.45);
}

.footer .footer__social svg,
.footer__social svg{
  width: 22px;
  height: 22px;
  fill: #fff;
  position: relative;
  z-index: 1;
}

/* Social brand backgrounds */
.footer .footer__social a[aria-label="Instagram"],
.footer__social a[aria-label="Instagram"]{
  background: transparent !important;
  box-shadow: 0 4px 14px rgba(217,46,127,.38);
  padding: 0 !important;
  overflow: visible;
}
.footer .footer__social a[aria-label="Instagram"] svg,
.footer__social a[aria-label="Instagram"] svg.footer__ig-icon {
  width: 100% !important;
  height: 100% !important;
  display: block;
  border-radius: 50%;
}
.footer .footer__social a[aria-label="Facebook"],
.footer__social a[aria-label="Facebook"]{
  background: #1877F2;
  box-shadow: 0 4px 14px rgba(24,119,242,.35);
}
.footer .footer__social a[aria-label="WhatsApp"],
.footer__social a[aria-label="WhatsApp"]{
  background: #25D366;
  box-shadow: 0 4px 14px rgba(37,211,102,.35);
}
.footer .footer__social a[aria-label="LinkedIn"],
.footer__social a[aria-label="LinkedIn"]{
  background: #0A66C2;
  box-shadow: 0 4px 14px rgba(10,102,194,.35);
}
.footer .footer__social a[aria-label="YouTube"],
.footer__social a[aria-label="YouTube"]{
  background: #FF0000;
  box-shadow: 0 4px 14px rgba(255,0,0,.30);
}
.footer .footer__social a[aria-label="Email"],
.footer__social a[aria-label="Email"]{
  background: linear-gradient(135deg, #d4a574 0%, #b8895a 100%);
  box-shadow: 0 4px 14px rgba(184,137,90,.30);
}

/* Newsletter text */
.footer .footer__newsletter,
.footer__newsletter{
  font-family: var(--font-body, var(--fb, 'Montserrat', system-ui, sans-serif));
  font-size: 12px;
  line-height: 1.65;
  color: var(--footer-text-muted);
  letter-spacing: .3px;
  margin: 0;
}

.footer .footer__newsletter em,
.footer__newsletter em{
  font-style: italic;
  font-family: var(--font-display, var(--fd, 'Cormorant Garamond', Georgia, serif));
  font-size: 14px;
  color: rgba(255,255,255,.75);
}

/* ==========================================
   BOTTOM BAR — Copyright, Legal Links, Credit
   ========================================== */
.footer .footer__bottom,
.footer__bottom{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 22px 0 26px;
  flex-wrap: wrap;
  box-sizing: border-box;
}

.footer .footer__copyright,
.footer__copyright{
  font-family: var(--font-body, var(--fb, 'Montserrat', system-ui, sans-serif));
  font-size: 11.5px;
  letter-spacing: .3px;
  color: var(--footer-text-muted);
  margin: 0;
}

.footer .footer__legal,
.footer__legal{
  display: flex;
  align-items: center;
  gap: 22px;
  list-style: none;
  padding: 0;
  margin: 0;
}

.footer .footer__legal a,
.footer__legal a{
  font-family: var(--font-body, var(--fb, 'Montserrat', system-ui, sans-serif));
  font-size: 11px;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: rgba(255,255,255,.5);
  text-decoration: none;
  transition: color .3s ease;
}

.footer .footer__legal a:hover,
.footer__legal a:hover{
  color: #fff;
}

.footer .footer__credit,
.footer__credit{
  font-family: var(--font-body, var(--fb, 'Montserrat', system-ui, sans-serif));
  font-size: 10.5px;
  letter-spacing: 1.3px;
  text-transform: uppercase;
  color: rgba(255,255,255,.32);
  margin: 0;
}

/* Standalone single-line footer (used on blog pages) */
.foot,
footer.foot{
  padding: clamp(28px, 4vw, 40px) var(--gutter, 20px) calc(24px + env(safe-area-inset-bottom, 0px));
  background: var(--footer-ink);
  color: rgba(255,255,255,.65);
  font-size: 11.5px;
  line-height: 1.6;
  text-align: center;
  letter-spacing: .4px;
  border-top: 1px solid var(--footer-border);
}

.foot a,
footer.foot a{
  color: rgba(255,255,255,.85);
  text-decoration: underline;
  transition: color .3s ease;
}

.foot a:hover,
footer.foot a:hover{
  color: #fff;
}


/* ==========================================
   RESPONSIVE: TABLET (<= 980px)
   ========================================== */
@media (max-width: 980px){
  .footer .footer__grid,
  .footer__grid{
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 36px 30px !important;
    padding: 38px 0 !important;
  }
  .footer .footer__bottom,
  .footer__bottom{
    padding: 20px 0 24px;
  }
}


/* ==========================================
   RESPONSIVE: MOBILE (<= 640px)
   Compact, balanced, perfectly aligned layout
   ========================================== */
@media (max-width: 640px){
  /* TOP — compact luxury brand statement */
  .footer .footer__top,
  .footer__top{
    padding: clamp(36px, 8vw, 50px) var(--gutter, 20px) clamp(28px, 6vw, 40px) !important;
    margin: 0 calc(var(--gutter, 20px) * -1) !important;
  }
  .footer .footer__eyebrow,
  .footer__eyebrow{
    font-size: 10px !important;
    letter-spacing: 2.6px !important;
    gap: 8px !important;
    margin-bottom: 12px !important;
  }
  .footer .footer__eyebrow::before,
  .footer .footer__eyebrow::after,
  .footer__eyebrow::before,
  .footer__eyebrow::after{
    width: 18px !important;
  }
  .footer .footer__brand-title,
  .footer .footer__top-title,
  .footer__brand-title,
  .footer__top-title{
    font-size: clamp(26px, 7.5vw, 36px) !important;
    letter-spacing: -0.8px !important;
    line-height: 1.14 !important;
    margin-bottom: 12px !important;
  }
  .footer .footer__sub,
  .footer .footer__top-sub,
  .footer__sub,
  .footer__top-sub{
    font-size: 12.5px !important;
    line-height: 1.6 !important;
    margin: 0 auto 20px !important;
    max-width: 360px !important;
  }
  .footer .footer__cta,
  .footer .footer__top-cta,
  .footer__cta,
  .footer__top-cta{
    padding: 12px 26px !important;
    font-size: 10.5px !important;
    letter-spacing: 2.2px !important;
  }

  /* GRID — balanced 2-column layout for navigation across ALL pages */
  .footer .footer__grid,
  .footer__grid{
    grid-template-columns: repeat(2, 1fr) !important;
    row-gap: 26px !important;
    column-gap: 16px !important;
    padding: 28px 0 24px !important;
    text-align: center;
  }

  /* Column 1: About — spans full width */
  .footer .footer__grid > div:first-child,
  .footer .footer__grid > .footer__col:first-child,
  .footer__col--about{
    grid-column: 1 / -1 !important;
  }
  .footer .footer__grid > div:first-child .footer__col-title,
  .footer .footer__col--about .footer__col-title{
    margin-bottom: 10px !important;
  }
  .footer .footer__about-text,
  .footer .footer__about,
  .footer .footer__grid > div:first-child p,
  .footer__about-text,
  .footer__about{
    max-width: 420px !important;
    margin: 0 auto 12px !important;
    font-size: 12.5px !important;
    line-height: 1.6 !important;
  }
  .footer .footer__protect,
  .footer__protect{
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
  }

  /* Columns 2 & 3: Explore and Destinations — clean balanced 2 columns */
  .footer .footer__grid > div:nth-child(2),
  .footer .footer__grid > div:nth-child(3),
  .footer .footer__grid > .footer__col:nth-child(2),
  .footer .footer__grid > .footer__col:nth-child(3),
  .footer__col:nth-child(2),
  .footer__col:nth-child(3){
    text-align: left !important;
    padding-left: clamp(4px, 3vw, 24px) !important;
  }
  .footer .footer__grid > div:nth-child(2) .footer__col-title,
  .footer .footer__grid > div:nth-child(3) .footer__col-title,
  .footer .footer__grid > div:nth-child(2) h4,
  .footer .footer__grid > div:nth-child(3) h4,
  .footer .footer__grid > div:nth-child(2) h5,
  .footer .footer__grid > div:nth-child(3) h5,
  .footer .footer__grid > .footer__col:nth-child(2) .footer__col-title,
  .footer .footer__grid > .footer__col:nth-child(3) .footer__col-title{
    margin-bottom: 10px !important;
    font-size: 10.5px !important;
    letter-spacing: 2.4px !important;
  }
  .footer .footer__grid > div:nth-child(2) .footer__list,
  .footer .footer__grid > div:nth-child(3) .footer__list,
  .footer .footer__grid > div:nth-child(2) ul,
  .footer .footer__grid > div:nth-child(3) ul,
  .footer .footer__grid > .footer__col:nth-child(2) .footer__list,
  .footer .footer__grid > .footer__col:nth-child(3) .footer__list{
    align-items: flex-start !important;
    gap: 8px !important;
  }
  .footer .footer__grid > div:nth-child(2) li a,
  .footer .footer__grid > div:nth-child(3) li a,
  .footer .footer__grid > div:nth-child(2) ul a,
  .footer .footer__grid > div:nth-child(3) ul a,
  .footer .footer__grid > .footer__col:nth-child(2) .footer__list li a,
  .footer .footer__grid > .footer__col:nth-child(3) .footer__list li a{
    font-size: 12.5px !important;
    letter-spacing: .2px !important;
  }

  /* Column 4: Contact & Social — spans full width across bottom */
  .footer .footer__grid > div:nth-child(4),
  .footer .footer__grid > .footer__col:nth-child(4),
  .footer__col--contact,
  .footer__col--contact{
    grid-column: 1 / -1 !important;
    margin-top: 2px !important;
    text-align: center !important;
  }
  .footer .footer__grid > div:nth-child(4) .footer__col-title,
  .footer .footer__col--contact .footer__col-title{
    margin-bottom: 10px !important;
    font-size: 10.5px !important;
    letter-spacing: 2.4px !important;
  }
  .footer .footer__contact,
  .footer .footer__grid > div:nth-child(4) ul,
  .footer__contact{
    align-items: center !important;
    gap: 8px !important;
  }
  .footer .footer__contact a,
  .footer .footer__contact span,
  .footer .footer__contact-item,
  .footer .footer__grid > div:nth-child(4) li a,
  .footer .footer__grid > div:nth-child(4) li span,
  .footer__contact a,
  .footer__contact span{
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    font-size: 12px !important;
    text-align: center !important;
  }
  .footer .footer__contact-icon,
  .footer__contact-icon{
    width: 13px !important;
    height: 13px !important;
  }

  /* Social title & row of 6 icons */
  .footer .footer__social-title,
  .footer__social-title{
    margin-top: 18px !important;
    margin-bottom: 10px !important;
    font-size: 10.5px !important;
    letter-spacing: 2.4px !important;
    text-align: center !important;
  }
  .footer .footer__social,
  .footer__social{
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-wrap: nowrap !important;
    gap: clamp(5px, 2vw, 11px) !important;
    width: 100% !important;
    margin: 0 auto 14px !important;
  }
  .footer .footer__social a,
  .footer__social a{
    width: clamp(34px, 9.2vw, 44px) !important;
    height: clamp(34px, 9.2vw, 44px) !important;
    flex: 0 0 auto !important;
  }
  .footer .footer__social svg,
  .footer__social svg{
    width: clamp(16px, 4.6vw, 22px) !important;
    height: clamp(16px, 4.6vw, 22px) !important;
  }

  /* Newsletter */
  .footer .footer__newsletter,
  .footer__newsletter{
    text-align: center !important;
    max-width: 300px !important;
    margin: 0 auto !important;
    font-size: 11.5px !important;
    line-height: 1.55 !important;
    color: var(--footer-text-muted) !important;
  }

  /* Bottom bar — copyright, legal links, designer credit */
  .footer .footer__bottom,
  .footer__bottom{
    flex-direction: column !important;
    text-align: center !important;
    gap: 10px !important;
    padding: 16px 0 28px !important;
  }
  /* Floating WhatsApp clearance for pages with wa-fab */
  body:has(.wa-fab) .footer .footer__bottom,
  body:has(.wa-fab) .footer__bottom{
    padding-bottom: 84px !important;
  }
  .footer .footer__copyright,
  .footer__copyright{
    font-size: 11px !important;
    line-height: 1.5 !important;
    color: var(--footer-text-muted) !important;
    max-width: 320px !important;
    margin: 0 auto !important;
  }
  .footer .footer__legal,
  .footer__legal{
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 8px 18px !important;
    padding: 0 !important;
    margin: 0 !important;
  }
  .footer .footer__legal a,
  .footer__legal a{
    font-size: 10.5px !important;
    letter-spacing: 1.2px !important;
  }
  .footer .footer__credit,
  .footer__credit{
    font-size: 10px !important;
    letter-spacing: 1.2px !important;
    color: rgba(255,255,255,.32) !important;
  }

  .foot,
  footer.foot{
    padding: 18px var(--gutter, 16px) 28px !important;
    font-size: 11px !important;
    line-height: 1.65 !important;
  }
}