@font-face {
  font-family: 'Satoshi';
  src: url('../fonts/Satoshi-Regular.ttf') format('truetype');
  font-style: normal;
  font-weight: 300 500;
  font-display: swap;
}

@font-face {
  font-family: 'Satoshi';
  src: url('../fonts/Satoshi-Bold.ttf') format('truetype');
  font-style: normal;
  font-weight: 600 900;
  font-display: swap;
}

:root {
  --primary: #A44924;
  --secondary: #FCC98F;
  --accent: #FCC98F;
  --background: #FFF8F1;
  --background-soft: #FFECDA;
  --text-dark: #3B2118;
  --text-muted: #76584A;
  --border: #F2D6BE;
  --secondary-hover: #87391F;
  --primary-hover: #6F2F1B;
  --accent-green: var(--secondary-hover);
  --soft-gold: var(--accent);
  --ivory: var(--background-soft);
  --text: var(--text-dark);
  --sand: var(--background-soft);
  --light: var(--background);
  --black: var(--text);
  --white: #FFFFFF;
}

body { color: var(--text); background-color: var(--background); }
body, p, a, button, input, select, textarea, optgroup { font-family: 'Satoshi', Arial, sans-serif; }
h1, h2, h3, h4, h5, h6 { font-family: 'Darkella', Georgia, serif; }

/* Shared premium hero for every inner page. */
.premium-page-hero {
  position: relative;
  isolation: isolate;
  min-height: clamp(430px, 58vh, 620px) !important;
  height: auto !important;
  display: flex;
  align-items: flex-end !important;
  justify-content: flex-start !important;
  overflow: hidden;
  padding: clamp(3rem, 7vw, 6.5rem) clamp(1.25rem, 6vw, 6rem) !important;
  text-align: left !important;
  background: #A44924;
}

.premium-page-hero::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(35,16,8,.12) 0%, rgba(35,16,8,.28) 44%, rgba(35,16,8,.86) 100%);
}

.premium-page-hero::before {
  content: '';
  position: absolute;
  left: clamp(1.25rem, 6vw, 6rem);
  bottom: 0;
  z-index: 3;
  width: clamp(5rem, 10vw, 9rem);
  height: 4px;
  background: #FCC98F;
}

.premium-page-hero > img,
.premium-page-hero > div:first-child img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 1.2s cubic-bezier(.2,.7,.2,1);
}

.premium-page-hero:hover > img,
.premium-page-hero:hover > div:first-child img { transform: scale(1.025); }

.premium-page-hero > .z-10,
.premium-page-hero > .relative,
.premium-page-hero > div:last-child {
  position: relative;
  z-index: 2 !important;
  width: 100%;
  max-width: 1320px;
  margin-right: auto !important;
  margin-left: auto !important;
  text-align: left !important;
}

.premium-page-hero > .absolute.z-10 {
  inset: 0;
  display: flex;
  align-items: flex-end !important;
  justify-content: flex-start !important;
  padding: clamp(3rem, 7vw, 6.5rem) clamp(1.25rem, 6vw, 6rem) !important;
  text-align: left !important;
}

.premium-page-hero h1 {
  max-width: 980px;
  margin-left: 0 !important;
  color: #fff !important;
  font-size: clamp(2.7rem, 6vw, 5.6rem) !important;
  font-weight: 400 !important;
  line-height: 1.02 !important;
  letter-spacing: -.025em;
  text-shadow: 0 4px 28px rgba(0,0,0,.28);
}

.premium-page-hero p {
  max-width: 720px;
  margin-left: 0 !important;
  color: rgba(255,255,255,.84) !important;
  line-height: 1.7 !important;
}

.premium-page-hero p:first-child {
  color: #FCC98F !important;
  font-size: .75rem !important;
  font-weight: 700;
  letter-spacing: .22em;
  text-transform: uppercase;
}

@media (max-width: 767px) {
  .premium-page-hero { min-height: 430px !important; padding: 3.5rem 1.25rem !important; }
  .premium-page-hero > .absolute.z-10 { padding: 3.5rem 1.25rem !important; }
  .premium-page-hero::before { left: 1.25rem; }
}

/* Shared premium safari cards used across home, listings and mountain journeys. */
.kwa-premium-packages { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 1.4rem; }
.kwa-popular-tour-card { position: relative; grid-column: span 4; min-height: 31rem; overflow: hidden; border: 1px solid rgba(164,73,36,.16); border-radius: .35rem; background: #fff !important; box-shadow: 0 16px 45px rgba(89,43,24,.1); transition: transform .55s cubic-bezier(.2,.8,.2,1), box-shadow .35s ease; }
.kwa-premium-packages > .kwa-popular-tour-card:first-child { grid-column: span 8; }
.kwa-popular-tour-card:hover { box-shadow: 0 24px 58px rgba(89,43,24,.18); transform: translateY(-6px); }
.kwa-popular-tour-card img { transition: transform .8s cubic-bezier(.2,.8,.2,1); }
.kwa-popular-tour-card:hover img { transform: scale(1.06); }
.kwa-popular-tour-card .kwa-tour-photo { position: relative; height: 20rem; overflow: hidden; }
.kwa-premium-packages > .kwa-popular-tour-card:first-child .kwa-tour-photo { height: 31rem; }
.kwa-popular-tour-card .kwa-tour-photo::after { position: absolute; inset: 0; background: linear-gradient(180deg, transparent 48%, rgba(49,22,12,.5)); content: ''; }
.kwa-popular-tour-card .kwa-tour-details { position: relative; z-index: 2; min-height: 11rem; background: #fff !important; text-align: left; }
.kwa-premium-packages > .kwa-popular-tour-card:first-child .kwa-tour-details { position: absolute; right: 0; bottom: 0; left: 0; min-height: auto; background: linear-gradient(180deg, transparent, rgba(62,26,13,.94)) !important; color: #fff; }
.kwa-premium-packages > .kwa-popular-tour-card:first-child .kwa-tour-details h3,
.kwa-premium-packages > .kwa-popular-tour-card:first-child .kwa-tour-details p,
.kwa-premium-packages > .kwa-popular-tour-card:first-child .kwa-tour-details div { color: #fff !important; }
.kwa-tour-eyebrow { display: inline-flex; align-items: center; gap: .5rem; color: #A44924; font-size: .68rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
.kwa-tour-eyebrow::before { width: 1.4rem; height: 1px; background: #FCC98F; content: ''; }
.kwa-tour-description { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.kwa-tour-action { display: inline-flex; align-items: center; gap: .55rem; color: #A44924; font-size: .72rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.kwa-tour-action span { transition: transform .25s ease; }
.kwa-popular-tour-card:hover .kwa-tour-action span { transform: translateX(4px); }
@media (max-width: 1023px) {
  .kwa-popular-tour-card, .kwa-premium-packages > .kwa-popular-tour-card:first-child { grid-column: span 6; }
  .kwa-premium-packages > .kwa-popular-tour-card:first-child .kwa-tour-photo { height: 20rem; }
  .kwa-premium-packages > .kwa-popular-tour-card:first-child .kwa-tour-details { position: relative; background: #fff !important; color: inherit; }
  .kwa-premium-packages > .kwa-popular-tour-card:first-child .kwa-tour-details h3 { color: #A44924 !important; }
  .kwa-premium-packages > .kwa-popular-tour-card:first-child .kwa-tour-details p,
  .kwa-premium-packages > .kwa-popular-tour-card:first-child .kwa-tour-details div { color: #76584A !important; }
}
@media (max-width: 639px) {
  .kwa-premium-packages { display: flex; gap: 1rem; overflow-x: auto; margin-right: -1rem; margin-left: -1rem; padding: 0 1rem 1.25rem; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .kwa-premium-packages::-webkit-scrollbar { display: none; }
  .kwa-popular-tour-card, .kwa-premium-packages > .kwa-popular-tour-card:first-child { flex: 0 0 86%; min-height: 29rem; scroll-snap-align: center; }
  .kwa-popular-tour-card .kwa-tour-photo, .kwa-premium-packages > .kwa-popular-tour-card:first-child .kwa-tour-photo { height: 18rem; }
}

/* Keep every interactive button label in the primary brand colour. */
html body button,
html body button *,
html body button[class][class][class],
html body button[class][class][class] *,
html body input[type='button'],
html body input[type='submit'],
html body input[type='reset'],
html body a[class*='btn'][class][class],
html body a[class*='btn'][class][class] *,
html body a[class*='button'][class][class],
html body a[class*='button'][class][class] *,
html body a[class*='cta'][class][class],
html body a[class*='cta'][class][class] *,
html body a[class*='quote'][class][class],
html body a[class*='quote'][class][class] *,
html body a[class~='inline-flex'][class][class],
html body a[class~='inline-flex'][class][class] *,
html body a[role='button'][class][class],
html body a[role='button'][class][class] * {
  color: #A44924 !important;
}

/* The homepage expert CTA is a filled primary button, so its label stays white. */
html body a.kwa-why-cta,
html body a.kwa-why-cta * {
  color: #fff !important;
}

/* Preserve readable contrast when a brand button uses a dark background. */
html body button[class*='bg-[#A44924]'],
html body button[class*='bg-[#A44924]'] *,
html body a[class*='bg-[#A44924]'][class],
html body a[class*='bg-[#A44924]'][class] *,
html body button[class*='bg-[#87391F]'],
html body button[class*='bg-[#87391F]'] *,
html body a[class*='bg-[#87391F]'][class],
html body a[class*='bg-[#87391F]'][class] *,
html body button[class*='bg-brand-primary'],
html body button[class*='bg-brand-primary'] *,
html body a[class*='bg-brand-primary'][class],
html body a[class*='bg-brand-primary'][class] * {
  color: #fff !important;
}

html body button[class*='hover:bg-[#A44924]']:hover,
html body button[class*='hover:bg-[#A44924]']:hover *,
html body a[class*='hover:bg-[#A44924]']:hover,
html body a[class*='hover:bg-[#A44924]']:hover *,
html body button[class*='hover:bg-[#87391F]']:hover,
html body button[class*='hover:bg-[#87391F]']:hover *,
html body a[class*='hover:bg-[#87391F]']:hover,
html body a[class*='hover:bg-[#87391F]']:hover * {
  color: #fff !important;
}

/* Safari detail controls require explicit contrast over the global button rule. */
html body .package-packing-print.package-packing-print {
  border-radius: 999px;
  background: #87391F;
  color: #fff !important;
  font-size: .76rem;
  font-weight: 700;
  letter-spacing: .04em;
}
html body .package-packing-print.package-packing-print:hover {
  background: #A44924;
  color: #fff !important;
}
html body .package-detail-page .package-detail-section button {
  background-color: #A44924;
  color: #fff !important;
}
html body .package-detail-page .package-detail-section button * { color: #fff !important; }
html body .package-detail-page .package-detail-section button:hover {
  background-color: #87391F;
  color: #fff !important;
}
html body .package-detail-page .package-detail-section button:hover * { color: #fff !important; }
html body .package-detail-page .package-itinerary-toggle,
html body .package-detail-page .package-itinerary-toggle *,
html body .package-detail-page .package-packing-print,
html body .package-detail-page .package-packing-print *,
html body .package-detail-page .package-visa-action,
html body .package-detail-page .package-visa-action * {
  color: #fff !important;
}
html body .package-detail-page .package-itinerary-toggle:hover,
html body .package-detail-page .package-itinerary-toggle:hover *,
html body .package-detail-page .package-packing-print:hover,
html body .package-detail-page .package-packing-print:hover *,
html body .package-detail-page .package-visa-action:hover,
html body .package-detail-page .package-visa-action:hover * {
  color: #fff !important;
}
html body .package-detail-page .package-booking-modal-card .booking-primary-action,
html body .package-detail-page .package-booking-modal-card .booking-primary-action *,
html body .package-detail-page .package-booking-modal-card .booking-whatsapp-action,
html body .package-detail-page .package-booking-modal-card .booking-whatsapp-action * {
  color: #fff !important;
}
html body .package-detail-page .package-booking-modal-card .booking-primary-action,
html body .package-detail-page .package-booking-modal-card .booking-primary-action:hover,
html body .package-detail-page .package-booking-modal-card .booking-primary-action *,
html body .package-detail-page .package-booking-modal-card .booking-primary-action:hover * {
  background-color: #A44924;
  color: #fff !important;
}
html body .package-detail-page .package-booking-modal-card .booking-primary-action:hover {
  background-color: #87391F;
}
html body .package-related-grid.kwa-premium-packages {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.4rem;
}
html body .package-related-grid.kwa-premium-packages > .kwa-popular-tour-card,
html body .package-related-grid.kwa-premium-packages > .kwa-popular-tour-card:first-child {
  grid-column: auto;
  min-height: 31rem;
}
html body .package-related-grid.kwa-premium-packages > .kwa-popular-tour-card:first-child .kwa-tour-photo,
html body .package-related-grid.kwa-premium-packages > .kwa-popular-tour-card .kwa-tour-photo { height: 20rem; }
html body .package-related-grid.kwa-premium-packages > .kwa-popular-tour-card:first-child .kwa-tour-details {
  position: relative;
  background: #fff !important;
  color: inherit;
}
html body .package-related-grid.kwa-premium-packages > .kwa-popular-tour-card:first-child .kwa-tour-details h3 { color: #A44924 !important; }
html body .package-related-grid.kwa-premium-packages > .kwa-popular-tour-card:first-child .kwa-tour-details p,
html body .package-related-grid.kwa-premium-packages > .kwa-popular-tour-card:first-child .kwa-tour-details div { color: #76584A !important; }
@media (max-width: 900px) {
  html body .package-related-grid.kwa-premium-packages { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 639px) {
  html body .package-related-grid.kwa-premium-packages { display: flex; }
}
html body .package-sticky-cta .package-sticky-inner {
  gap: .45rem;
  padding: .48rem;
  border: 1px solid rgba(164,73,36,.18);
  border-radius: 1.3rem;
  background: rgba(255,253,249,.97);
  box-shadow: 0 20px 55px rgba(72,28,10,.24);
}
html body .package-sticky-cta .package-sticky-button {
  display: flex;
  min-height: 3.35rem;
  align-items: center;
  gap: .65rem;
  border-radius: .95rem;
  padding: .48rem .95rem .48rem .5rem;
  text-align: left;
  text-transform: none;
}
html body .package-sticky-cta .package-sticky-button--book,
html body .package-sticky-cta .package-sticky-button--book * {
  color: #fff !important;
}
html body .package-sticky-cta .package-sticky-button--book {
  border: 1px solid #A44924;
  background: #A44924;
}
html body .package-sticky-cta .package-sticky-button--book:hover {
  border-color: #87391F;
  background: #87391F;
}
html body .package-sticky-cta .package-sticky-button--custom,
html body .package-sticky-cta .package-sticky-button--custom * {
  color: #A44924 !important;
}
html body .package-sticky-cta .package-sticky-button--custom {
  border: 1px solid #efbd84;
  background: #FFECDA;
}
html body .package-sticky-cta .package-sticky-button--custom:hover {
  border-color: #FCC98F;
  background: #FCC98F;
}
html body .package-sticky-cta .package-sticky-icon {
  display: grid;
  width: 2.25rem;
  height: 2.25rem;
  flex: 0 0 2.25rem;
  place-items: center;
  border-radius: .7rem;
  background: rgba(255,255,255,.14);
}
html body .package-sticky-cta .package-sticky-button--custom .package-sticky-icon {
  background: rgba(164,73,36,.09);
}
html body .package-sticky-cta .package-sticky-icon svg { width: 1rem; height: 1rem; }
html body .package-sticky-cta .package-sticky-copy { display: grid; gap: .08rem; }
html body .package-sticky-cta .package-sticky-copy small { font-size: .56rem; line-height: 1; opacity: .7; letter-spacing: .04em; }
html body .package-sticky-cta .package-sticky-button--book .package-sticky-copy small { color: #fff !important; opacity: 1; }
html body .package-sticky-cta .package-sticky-copy strong { font-size: .7rem; line-height: 1.1; font-weight: 800; white-space: nowrap; }
@media (max-width: 639px) {
  html body .package-sticky-cta .package-sticky-button { min-height: 3rem; padding: .4rem .65rem .4rem .42rem; }
  html body .package-sticky-cta .package-sticky-icon { width: 2rem; height: 2rem; flex-basis: 2rem; }
  html body .package-sticky-cta .package-sticky-copy small { display: none; }
  html body .package-itinerary-stay { flex-direction: column; }
  html body .package-itinerary-stay-copy { padding: 1rem; }
  html body .package-itinerary-stay-images { width: 100%; min-height: 125px; }
}
