* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  min-height: 100%;
}

body {
  color: #1b2540;
  font-family: "Inter", Arial, Helvetica, sans-serif;
  background: #ffffff;
  --section-space: 64px;
  --section-space-mobile: 64px;
}

a {
  color: inherit;
  text-decoration: none;
}

.site-header {
  position: relative;
  z-index: 3;
  background: #fff;
}

.brand-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 96px;
  padding: 0 20px 0 22px;
  border-bottom: 1px solid #d7dce7;
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.brand-logo {
  display: block;
  width: 78px;
  max-width: 42vw;
  height: 76px;
  object-fit: contain;
  object-position: left center;
}

.brand-text {
  display: grid;
  line-height: 1;
  text-transform: uppercase;
}

.brand-text strong {
  color: #0698cf;
  font-size: 22px;
  font-weight: 900;
  letter-spacing: .4px;
}

.brand-text b {
  color: #21245b;
  font-size: 24px;
  font-weight: 900;
  letter-spacing: .2px;
}

.brand-text small {
  margin-top: 5px;
  color: #777985;
  font-size: 11px;
  font-weight: 500;
  text-transform: none;
}

.contact-block {
  display: grid;
  justify-items: end;
  gap: 2px;
}

.country {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #1b2440;
  font-size: 12px;
  font-weight: 800;
}

.flag {
  display: inline-block;
  width: 8px;
  height: 8px;
  background: #e01828;
  transform: rotate(45deg);
}

.country .fa-chevron-down {
  color: #1b2440;
  font-size: 10px;
}

.contact-line {
  display: flex;
  align-items: center;
  gap: 12px;
}

.phone-icon {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: #12aace;
  color: #fff;
  font-size: 16px;
}

.contact-line strong {
  display: block;
  color: #12aace;
  font-size: 22px;
  font-weight: 900;
  line-height: 1;
}

.contact-line small {
  display: block;
  margin-top: 4px;
  color: #202b45;
  font-size: 13px;
  font-weight: 800;
}

.menu-toggle,
.hamburger-button {
  display: none;
}

.sajilo-nav {
  display: grid;
  grid-template-columns: repeat(7, max-content) 144px 53px;
  align-items: center;
  gap: 50px;
  height: 51px;
  padding-left: 22px;
  border-bottom: 1px solid #d7dce7;
  color: #1f2943;
  font-size: 14px;
  font-weight: 900;
  text-transform: uppercase;
}

.sajilo-nav a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 100%;
  white-space: nowrap;
}

.sajilo-nav a .fa-caret-right {
  color: #11a9ce;
  font-size: 10px;
}

.sajilo-nav .contact-link {
  color: #ff0909;
}

.search-button {
  display: grid;
  place-items: center;
  width: 53px;
  height: 51px;
  border: 0;
  border-left: 1px solid #d7dce7;
  background: #fff;
  color: #0ca8cf;
  cursor: pointer;
  font-size: 21px;
}

.hero {
  position: relative;
  height: calc(100vh - 147px);
  min-height: 445px;
  max-height: 640px;
  overflow: hidden;
  background:
    linear-gradient(90deg, rgba(29, 102, 181, .6), rgba(19, 110, 216, .7)),
    linear-gradient(180deg, rgba(31, 119, 219, .2), rgba(10, 86, 158, .45)),
    url("trek-images/Everest Base Camp Trek/image-4.jpg") center 44% / cover;
}

.hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(30, 107, 207, .2);
}

.hero-content {
  position: relative;
  z-index: 1;
  width: min(650px, calc(100% - 44px));
  margin-left: 26%;
  padding-top: 188px;
  color: #fff;
}

.reviews {
  display: flex;
  align-items: center;
  gap: 5px;
  margin-bottom: 11px;
  font-size: 12px;
  font-weight: 900;
}

.stars {
  display: inline-flex;
  gap: 2px;
  color: #ff7f08;
  font-size: 13px;
  line-height: 1;
}

h1 {
  max-width: 610px;
  margin: 0;
  color: #fff;
  font-size: 43px;
  font-weight: 900;
  line-height: 1.08;
  letter-spacing: 0;
  text-shadow: 0 1px 2px rgba(0, 0, 0, .16);
}

.hero p {
  margin: 12px 0 20px;
  font-size: 17px;
  font-weight: 900;
  line-height: 1.35;
  text-shadow: 0 1px 1px rgba(0, 0, 0, .18);
}

.trip-search {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  height: 56px;
  border-radius: 5px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(10, 39, 84, .15);
}

.search-glass {
  display: grid;
  place-items: center;
  flex: 0 0 52px;
  height: 100%;
  color: #0ca8cf;
  font-size: 21px;
}

.trip-search input {
  width: 100%;
  height: 100%;
  border: 0;
  outline: 0;
  color: #253149;
  font: 600 16px "Inter", Arial, sans-serif;
}

.trip-search input::placeholder {
  color: #9ea7b6;
}

.treks-section {
  position: relative;
  padding: var(--section-space) 20px;
  background: #f3f5f9;
}

.section-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  max-width: 1308px;
  margin: 0 auto 30px;
}

.eyebrow {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 11px;
  color: #00a8d6;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.eyebrow::before {
  content: "";
  width: 29px;
  height: 2px;
  background: #00a8d6;
}

.eyebrow.centered::after {
  content: "";
  width: 29px;
  height: 2px;
  background: #00a8d6;
}

h2 {
  margin: 7px 0 0;
  color: #10234a;
  font-size: 40px;
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: 0;
}

.section-arrows {
  display: flex;
  align-items: center;
  gap: 10px;
  padding-top: 21px;
}

.arrow-button {
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border: 1px solid #dce5f2;
  border-radius: 50%;
  color: #12345f;
  background: #fff;
  box-shadow: 0 4px 12px rgba(25, 53, 94, .08);
  cursor: pointer;
  font-size: 17px;
}

.arrow-muted {
  color: #c4d2e4;
  background: rgba(255, 255, 255, .42);
  box-shadow: none;
}

.trek-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  max-width: 1308px;
  margin: 0 auto;
}

.trek-card {
  min-width: 0;
}

.trek-photo {
  position: relative;
  overflow: hidden;
  height: 328px;
  border-radius: 4px;
  background-position: center;
  background-size: cover;
}

.everest-photo {
  background-image:
    linear-gradient(180deg, rgba(255, 184, 0, .32), rgba(11, 71, 130, .08)),
    url("trek-images/Everest Base Camp Trek/image-3.jpg");
}

.annapurna-photo {
  background-image:
    linear-gradient(180deg, rgba(0, 65, 132, .08), rgba(0, 0, 0, .06)),
    url("trek-images/Annapurna Base Camp Trek/image-2.jpeg");
}

.manaslu-photo {
  background-image:
    linear-gradient(180deg, rgba(33, 145, 218, .08), rgba(0, 0, 0, .04)),
    url("trek-images/Manaslu Circuit Trek/image-5.jpg");
}

.annapurna-panorama-photo {
  background-image: url("trek-images/Ghorepani Poon Hill Trekking/image-1.jpg");
}

.bhutan-photo {
  background-image: url("trek-images/Upper Mustang Trek/image-3.jpg");
}

.chola-pass-photo {
  background-image: url("trek-images/Gokyo Cho La Pass Trek/image-1.jpg");
}

.trek-badge {
  position: absolute;
  top: 15px;
  right: 16px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 24px;
  padding: 0 9px;
  border-radius: 3px;
  color: #fff;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.badge-green {
  background: #21bd84;
}

.badge-red {
  background: #fa1515;
}

.badge-orange {
  background: #f28b39;
}

.trek-body {
  padding: 18px 10px 0;
}

.trek-body h3 {
  margin: 0 0 6px;
  color: #353842;
  font-size: 23px;
  font-weight: 900;
  line-height: 1.25;
}

.trek-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  color: #373b46;
  font-size: 14px;
  font-weight: 500;
}

.divider {
  width: 1px;
  height: 16px;
  background: #b7bcc8;
}

.rating-stars {
  display: inline-flex;
  gap: 1px;
  color: #ff7b00;
  font-size: 13px;
}

.price {
  display: block;
  margin-top: 20px;
  color: #08acd1;
  font-size: 23px;
  font-weight: 900;
  line-height: 1;
}

.departures-section {
  padding: var(--section-space) 20px;
  background:
    repeating-linear-gradient(135deg, rgba(255, 255, 255, .025) 0 1px, transparent 1px 6px),
    #052338;
}

.departures-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 28px;
  max-width: 1308px;
  margin: 0 auto 31px;
}

.departures-heading h2 {
  color: #fff;
  font-size: 40px;
  text-shadow: 0 1px 1px rgba(0, 0, 0, .12);
}

.departure-filters {
  display: flex;
  gap: 10px;
  padding-top: 8px;
}

.departure-filters button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 152px;
  height: 42px;
  border: 0;
  border-radius: 4px;
  color: #082748;
  background: #fff;
  font: 800 14px "Inter", Arial, sans-serif;
  cursor: pointer;
}

.departure-filters .month-filter {
  min-width: 207px;
  justify-content: space-between;
  padding: 0 13px 0 19px;
}

.month-filter span {
  width: 1px;
  height: 20px;
  margin-left: 18px;
  background: #d6deeb;
}

.month-filter .fa-chevron-down {
  color: #10a8ce;
  font-size: 11px;
}

.departures-table {
  max-width: 1308px;
  margin: 0 auto;
  padding: 34px 39px 1px;
  border-radius: 2px 2px 0 0;
  background: #fff;
  color: #001d3f;
  font-family: "Nunito Sans", "Inter", Arial, sans-serif;
}

.departure-row {
  display: grid;
  grid-template-columns: minmax(250px, 1.35fr) minmax(175px, .9fr) minmax(135px, .6fr) minmax(120px, .6fr) minmax(122px, auto);
  align-items: center;
  column-gap: 28px;
  min-height: 82px;
  border-bottom: 1px solid #d8dfeb;
}

.table-header {
  min-height: 38px;
  color: #5d6d82;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .1px;
  text-transform: uppercase;
}

.trip-name {
  color: #001d3f;
  font-size: 19px;
  font-weight: 900;
  line-height: 1.25;
}

.trip-date strong,
.trip-status strong {
  display: block;
  color: #001d3f;
  font-size: 15px;
  font-weight: 900;
  line-height: 1.25;
}

.trip-date span,
.trip-status small,
.trip-price span {
  display: block;
  margin-top: 4px;
  color: #001d3f;
  font-size: 13.5px;
  font-weight: 700;
  line-height: 1.25;
}

.trip-status {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

.trip-status .fa-circle-check {
  margin-top: 2px;
  color: #09af95;
  font-size: 15px;
}

.trip-price strong {
  display: block;
  color: #08acd1;
  font-size: 17px;
  font-weight: 900;
  line-height: 1.2;
}

.trip-action {
  justify-self: end;
}

.trip-action a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 122px;
  height: 36px;
  border: 1px solid #0a3d68;
  border-radius: 3px;
  color: #05294b;
  background: #fff;
  font-size: 14px;
  font-weight: 900;
}

.luxury-section {
  padding: var(--section-space) 20px;
  background: #fff;
}

.luxury-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(420px, .9fr);
  gap: 24px;
  max-width: 1308px;
  margin: 0 auto;
}

.luxury-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 24px;
}

.luxury-heading h2 {
  color: #071d3f;
}

.see-packages {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 8px;
  color: #3d4d63;
  font-size: 16px;
  font-weight: 800;
  text-decoration: underline;
  text-decoration-color: #8f98a8;
  text-underline-offset: 3px;
  white-space: nowrap;
}

.see-packages .fa-arrow-right {
  color: #1e3f66;
  font-size: 15px;
  text-decoration: none;
}

.luxury-card-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}

.luxury-photo {
  position: relative;
  overflow: hidden;
  height: 263px;
  border-radius: 4px;
  background-position: center;
  background-size: cover;
}

.annapurna-luxury-photo {
  background-image: url("trek-images/Annapurna Luxury Trek/image-4.jpg");
}

.everest-luxury-photo {
  background-image: url("trek-images/Luxury Everest Base Camp Trek/image-2.jpg");
}

.luxury-body {
  padding: 19px 10px 0;
}

.luxury-body h3 {
  margin: 0 0 6px;
  color: #17223b;
  font-size: 24px;
  font-weight: 900;
  line-height: 1.2;
}

.luxury-feature {
  align-self: end;
}

.feature-photo {
  position: relative;
  overflow: hidden;
  min-height: 479px;
  border-radius: 4px;
  background-position: center;
  background-size: cover;
}

.feature-photo::after {
  content: "";
  position: absolute;
  inset: 42% 0 0;
  background: linear-gradient(180deg, rgba(4, 16, 30, 0), rgba(4, 13, 23, .78));
}

.everest-base-luxury-photo {
  background-image: url("trek-images/Luxury Everest Base Camp Trek/image-4.jpg");
}

.feature-price {
  position: absolute;
  left: 24px;
  top: 24px;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 10px;
  border-radius: 4px;
  color: #08acd1;
  background: rgba(255, 255, 255, .9);
  font-size: 23px;
  font-weight: 900;
  line-height: 1;
}

.feature-content {
  position: absolute;
  left: 24px;
  right: 24px;
  bottom: 16px;
  z-index: 1;
  color: #fff;
}

.feature-content h3 {
  margin: 0 0 8px;
  color: #fff;
  font-size: 28px;
  font-weight: 900;
  line-height: 1.15;
}

.feature-meta {
  margin-bottom: 6px;
  font-size: 15px;
  font-weight: 700;
}

.feature-rating {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 15px;
  font-weight: 700;
}

.faq-section {
  padding: var(--section-space) 20px;
  background: #f8fafd;
}

.faq-heading {
  text-align: center;
  margin-bottom: 31px;
}

.faq-heading .eyebrow {
  justify-content: center;
}

.faq-heading h2 {
  margin-top: 8px;
  color: #071d3f;
  font-size: 39px;
}

.faq-panel {
  max-width: 983px;
  margin: 0 auto;
  padding: 27px 25px 9px;
  border: 1px solid #dbe3ee;
  border-radius: 5px 5px 0 0;
  background: #fff;
  box-shadow: 0 12px 30px rgba(18, 42, 76, .04);
}

.faq-item {
  border-bottom: 1px solid #dbe3ee;
}

.faq-question {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  width: 100%;
  min-height: 62px;
  padding: 0;
  color: #00345d;
  font: 900 18px "Nunito Sans", "Inter", Arial, sans-serif;
  line-height: 1.3;
  text-align: left;
  cursor: pointer;
  list-style: none;
}

.faq-question::-webkit-details-marker {
  display: none;
}

.faq-icon {
  position: relative;
  display: grid;
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  place-items: center;
}

.faq-icon .fa-solid {
  flex: 0 0 auto;
  color: #00a8d6;
  font-size: 15px;
  line-height: 1;
}

.faq-item .icon-open {
  display: none;
}

.faq-item[open] .icon-open {
  display: block;
}

.faq-item[open] .icon-closed {
  display: none;
}

.faq-item[open] {
  padding-bottom: 20px;
}

.faq-item[open] .faq-question {
  min-height: auto;
  padding: 14px 0 13px;
}

.faq-answer {
  max-width: 865px;
  color: #00345d;
  font-size: 15.5px;
  font-weight: 700;
  line-height: 1.55;
}

.faq-answer a {
  color: #00a8d6;
  text-decoration: underline;
  text-underline-offset: 4px;
}

.featured-section {
  padding: var(--section-space) 20px;
  background: #fff;
}

.featured-section .section-heading {
  margin-bottom: 31px;
}

.featured-section .section-arrows {
  padding-top: 19px;
}

.featured-section .arrow-button {
  box-shadow: none;
}

.featured-section .trek-photo {
  height: 327px;
}

.site-footer {
  color: rgba(255, 255, 255, .72);
  background:
    radial-gradient(circle at 18% 10%, rgba(20, 67, 103, .18), transparent 34%),
    linear-gradient(180deg, #09131f 0%, #060d15 100%);
  font-family: "Inter", Arial, sans-serif;
}

.footer-inner {
  display: grid;
  grid-template-columns: minmax(320px, 1.35fr) minmax(140px, .75fr) minmax(150px, .75fr) minmax(260px, .9fr);
  gap: 56px;
  max-width: 1280px;
  margin: 0 auto;
  padding: 57px 40px 56px;
}

.footer-brand h2 {
  margin: 0 0 24px;
  color: #d8b445;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 29px;
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: 7px;
  text-transform: uppercase;
}

.footer-brand p {
  max-width: 410px;
  margin: 0;
  color: rgba(255, 255, 255, .72);
  font-size: 15px;
  font-weight: 500;
  line-height: 1.85;
}

.social-links {
  display: flex;
  align-items: center;
  gap: 22px;
  margin-top: 26px;
}

.social-links a {
  display: inline-grid;
  place-items: center;
  width: 24px;
  height: 24px;
  color: #fff;
  font-size: 26px;
  line-height: 1;
}

.social-links a:nth-child(1) {
  color: #1877f2;
}

.social-links a:nth-child(2) {
  color: #ff4f8b;
}

.social-links a:nth-child(3) {
  color: #fff;
  text-shadow: -2px 1px 0 #00f2ea, 2px -1px 0 #ff0050;
}

.footer-column {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.footer-column h3 {
  margin: 0 0 24px;
  color: rgba(255, 255, 255, .86);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 17px;
  font-weight: 700;
  letter-spacing: 2.4px;
  text-transform: uppercase;
}

.footer-column a,
.footer-column p {
  margin: 0 0 14px;
  color: rgba(255, 255, 255, .72);
  font-size: 15px;
  font-weight: 500;
  line-height: 1.35;
}

.footer-column a:hover {
  color: #d8b445;
}

.footer-bottom {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 59px;
  border-top: 1px solid rgba(216, 180, 69, .28);
  color: rgba(255, 255, 255, .38);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 5px;
  text-transform: uppercase;
}

@media (max-width: 1120px) {
  .sajilo-nav {
    grid-template-columns: repeat(4, max-content) 1fr 53px;
    gap: 26px;
  }

  .sajilo-nav a:nth-child(n+5):nth-child(-n+7) {
    display: none;
  }

  .hero-content {
    margin-left: 14%;
  }
}

@media (max-width: 760px) {
  .brand-row {
    position: relative;
    height: auto;
    gap: 16px;
    padding: 16px;
  }

  .contact-block {
    display: none;
  }

  .hamburger-button {
    display: grid;
    width: 44px;
    height: 44px;
    margin-left: auto;
    place-items: center;
    border: 1px solid #d7dce7;
    border-radius: 4px;
    color: #0ca8cf;
    background: #fff;
    font-size: 22px;
    cursor: pointer;
  }

  .hamburger-button .icon-close {
    display: none;
  }

  .menu-toggle:checked + .hamburger-button .icon-menu {
    display: none;
  }

  .menu-toggle:checked + .hamburger-button .icon-close {
    display: block;
  }

  .sajilo-nav {
    display: none;
    height: auto;
    padding: 0;
    border-top: 1px solid #d7dce7;
    border-bottom: 1px solid #d7dce7;
    background: #fff;
  }

  .site-header:has(.menu-toggle:checked) .sajilo-nav {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
  }

  .sajilo-nav a {
    display: flex;
    justify-content: space-between;
    width: 100%;
    height: 48px;
    padding: 0 18px;
    border-bottom: 1px solid #edf1f6;
  }

  .sajilo-nav a:nth-child(n+5):nth-child(-n+7) {
    display: flex;
  }

  .search-button {
    width: 100%;
    height: 48px;
    border-left: 0;
  }

  .hero {
    height: calc(100svh - 148px);
    min-height: 360px;
    max-height: 520px;
    background-position: center center;
  }

  .hero-content {
    width: calc(100% - 32px);
    margin: 0 16px;
    padding-top: 34%;
  }

  .reviews {
    gap: 4px;
    margin-bottom: 12px;
    font-size: 10px;
  }

  .stars {
    font-size: 10px;
    gap: 1px;
  }

  h1 {
    max-width: 310px;
    font-size: 31px;
    line-height: 1.08;
  }

  .hero p {
    max-width: 320px;
    margin: 14px 0 22px;
    font-size: 12px;
    line-height: 1.5;
  }

  .trip-search {
    height: 46px;
  }

  .search-glass {
    flex-basis: 42px;
    font-size: 17px;
  }

  .trip-search input {
    font-size: 13px;
  }

  .treks-section {
    padding: var(--section-space-mobile) 16px;
  }

  .section-heading {
    margin-bottom: 24px;
  }

  h2 {
    font-size: 34px;
  }

  .section-arrows {
    display: none;
  }

  .trek-grid {
    grid-template-columns: 1fr;
  }

  .trek-photo {
    height: 280px;
  }

  .departures-section {
    padding: var(--section-space-mobile) 16px;
  }

  .departures-heading {
    display: block;
    margin-bottom: 24px;
  }

  .departures-heading h2 {
    font-size: 34px;
  }

  .departure-filters {
    flex-wrap: wrap;
    padding-top: 20px;
  }

  .departure-filters button,
  .departure-filters .month-filter {
    flex: 1 1 210px;
    min-width: 0;
  }

  .departures-table {
    padding: 18px;
  }

  .table-header {
    display: none;
  }

  .departure-row {
    grid-template-columns: 1fr;
    row-gap: 12px;
    min-height: 0;
    padding: 20px 0;
  }

  .trip-action {
    justify-self: start;
  }

  .luxury-section {
    padding: var(--section-space-mobile) 16px;
  }

  .luxury-layout {
    grid-template-columns: 1fr;
  }

  .luxury-heading {
    align-items: flex-start;
    flex-direction: column;
    gap: 10px;
  }

  .luxury-card-grid {
    grid-template-columns: 1fr;
  }

  .luxury-photo {
    height: 280px;
  }

  .feature-photo {
    min-height: 420px;
  }

  .feature-content h3 {
    font-size: 25px;
  }

  .faq-section {
    padding: var(--section-space-mobile) 16px;
  }

  .faq-heading h2 {
    font-size: 34px;
  }

  .faq-panel {
    padding: 18px 24px 6px;
  }

  .faq-question {
    font-size: 17px;
  }

  .featured-section {
    padding: var(--section-space-mobile) 16px;
  }

  .featured-section .trek-photo {
    height: 280px;
  }

  .footer-inner {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 34px;
    padding: 44px 24px;
  }

  .footer-brand,
  .inquiry-column {
    grid-column: 1 / -1;
  }

  .footer-brand h2 {
    font-size: 24px;
    letter-spacing: 5px;
  }

  .footer-bottom {
    padding: 0 20px;
    text-align: center;
    letter-spacing: 3px;
  }
}

/* Contact & Admin styling */
.contact-page {
  padding: 60px 20px;
  background: #f3f5f9;
}
.contact-hero {
  max-width: 800px;
  margin: 0 auto 40px;
  text-align: center;
}
.contact-hero h1 {
  font-size: 38px;
  color: #10234a !important;
  margin: 0 0 10px;
  font-weight: 900;
  text-shadow: none !important;
}
.contact-hero p {
  color: #4a5568;
  font-size: 16px;
  margin: 0;
}
.contact-grid {
  display: grid;
  grid-template-columns: 1fr 2fr;
  gap: 40px;
  max-width: 1200px;
  margin: 0 auto;
}
.contact-info {
  background: #fff;
  padding: 30px;
  border-radius: 4px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.05);
  border: 1px solid #d7dce7;
}
.contact-info h3 {
  margin-top: 0;
  color: #10234a;
  font-size: 20px;
  font-weight: 900;
}
.contact-info p {
  color: #4a5568;
  line-height: 1.6;
  font-size: 15px;
}
.contact-form {
  background: #fff;
  padding: 40px;
  border-radius: 4px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.05);
  border: 1px solid #d7dce7;
}
.form-group {
  margin-bottom: 20px;
}
.form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}
.form-group label {
  display: block;
  margin-bottom: 8px;
  font-weight: 800;
  color: #1b2540;
  font-size: 14px;
  text-transform: uppercase;
}
.form-group input,
.form-group select,
.form-group textarea {
  width: 100%;
  padding: 12px;
  border: 1px solid #d7dce7;
  border-radius: 4px;
  font-size: 15px;
  font-family: inherit;
  outline: none;
}
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
  border-color: #12aace;
}
.submit-btn {
  background: #12aace;
  color: #fff;
  border: none;
  padding: 14px 28px;
  font-size: 15px;
  font-weight: 900;
  border-radius: 4px;
  cursor: pointer;
  width: 100%;
  text-transform: uppercase;
  letter-spacing: 1px;
}
.submit-btn:hover {
  background: #0ca8cf;
}
.form-status {
  padding: 15px;
  border-radius: 4px;
  margin-bottom: 20px;
  font-weight: 700;
}
.form-status.success {
  background: #d4edda;
  color: #155724;
  border: 1px solid #c3e6cb;
}
.form-status.error {
  background: #f8d7da;
  color: #721c24;
  border: 1px solid #f5c6cb;
}
.admin-panel {
  max-width: 1200px;
  margin: 0 auto;
  background: #fff;
  padding: 30px;
  border-radius: 4px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.05);
  border: 1px solid #d7dce7;
}
.admin-table-wrap {
  overflow-x: auto;
}
.admin-table {
  width: 100%;
  border-collapse: collapse;
  margin-top: 20px;
}
.admin-table th,
.admin-table td {
  padding: 12px;
  text-align: left;
  border-bottom: 1px solid #d7dce7;
  font-size: 14px;
}
.admin-table th {
  background: #f3f5f9;
  color: #1b2540;
  font-weight: 900;
  text-transform: uppercase;
}
.admin-table tr:hover {
  background: #f8fafd;
}
@media (max-width: 768px) {
  .contact-grid {
    grid-template-columns: 1fr;
  }
  .form-row {
    grid-template-columns: 1fr;
    gap: 0;
  }
}

