
/* =========================================

   DESTINATION HUB — CINEMATIC EDITION

   Travel Code Premium Travel Club

========================================= */



/* ── Reset & Base ── */

.dh-page { background: #f8f6f2; }



.dh-label {

  font-size: 0.65rem;

  font-weight: 700;

  text-transform: uppercase;

  letter-spacing: 0.18em;

  color: #FF7A00;

  margin: 0 0 0.6rem;

}

.dh-label--light { color: rgba(255,255,255,0.6); }



.dh-h2 {

  font-family: 'Playfair Display', Georgia, serif;

  font-size: clamp(1.8rem, 3.5vw, 3rem);

  font-weight: 700;

  color: #081826;

  letter-spacing: -0.03em;

  line-height: 1.15;

  margin: 0 0 1.5rem;

}

.dh-h2--light { color: #ffffff; }



.dh-link-btn {

  font-size: 0.85rem;

  font-weight: 600;

  color: #FF7A00;

  text-decoration: none;

  white-space: nowrap;

  transition: opacity .2s;

  flex-shrink: 0;

}

.dh-link-btn:hover { opacity: .7; }



.dh-reveal {

  opacity: 0;

  transform: translateY(40px);

  transition: opacity 0.7s ease, transform 0.7s ease;

}

.dh-revealed { opacity: 1; transform: translateY(0); }



/* ══════════════════════════════════════

   HERO

══════════════════════════════════════ */

.dh-hero {

  position: relative;

  min-height: 100vh;

  display: flex;

  flex-direction: column;

  overflow: hidden;

  color: #ffffff;

  writing-mode: horizontal-tb;

}



.dh-hero__bg {

  position: absolute;

  inset: -10%;

  background-image: var(--hero-img, linear-gradient(135deg,#081826,#0F2F44));

  background-size: cover;

  background-position: center;

  transform: scale(1.1);

  will-change: transform;

}



.dh-hero__fog {

  position: absolute;

  inset: 0;

  background: linear-gradient(to top,rgba(8,24,38,.97) 0%,rgba(8,24,38,.5) 40%,rgba(8,24,38,.15) 70%,rgba(8,24,38,.3) 100%);

}



.dh-hero__content {

  position: relative;

  z-index: 2;

  display: flex;

  flex-direction: column;

  flex: 1;

  padding: 2rem 0;

  writing-mode: horizontal-tb;

}



.dh-hero__top {

  padding: 0 clamp(1rem, 5vw, 3rem);

  writing-mode: horizontal-tb;

}



.dh-hero__center {

  flex: 1;

  display: flex;

  flex-direction: column;

  justify-content: center;

  padding: 2rem clamp(1rem, 5vw, 3rem);

  max-width: 860px;

  writing-mode: horizontal-tb;

}



.dh-hero__tagline {

  font-family: 'Playfair Display', Georgia, serif;

  font-size: clamp(0.9rem, 1.5vw, 1.2rem);

  font-style: italic;

  color: rgba(255,255,255,.65);

  margin: 0 0 0.75rem;

  font-weight: 400;

  writing-mode: horizontal-tb;

  max-width: none;

}



.dh-hero__title {

  font-family: 'Playfair Display', Georgia, serif;

  font-size: clamp(3rem, 7vw, 7rem);

  font-weight: 900;

  line-height: 1;

  letter-spacing: -0.04em;

  margin: 0 0 1.25rem;

  color: #ffffff;

  writing-mode: horizontal-tb;

  max-width: none;

}



.dh-hero__desc {

  font-size: clamp(0.85rem, 1.1vw, 1rem);

  color: rgba(255,255,255,.6);

  max-width: 500px;

  line-height: 1.7;

  margin: 0;

  font-weight: 300;

  writing-mode: horizontal-tb;

}



.dh-hero__bottom {

  padding: 1.5rem clamp(1rem, 5vw, 3rem) 2rem;

  writing-mode: horizontal-tb;

}



.dh-glass-panel {

  display: inline-flex;

  align-items: stretch;

  background: rgba(255,255,255,.08);

  backdrop-filter: blur(20px);

  -webkit-backdrop-filter: blur(20px);

  border: 1px solid rgba(255,255,255,.15);

  border-radius: 14px;

  overflow: hidden;

  flex-wrap: wrap;

}



.dh-glass-panel__item {

  display: flex;

  flex-direction: column;

  gap: 2px;

  padding: 0.85rem 1.25rem;

  border-right: 1px solid rgba(255,255,255,.1);

}



.dh-glass-panel__val {

  font-size: 0.95rem;

  font-weight: 600;

  color: #fff;

  white-space: nowrap;

}



.dh-glass-panel__label {

  font-size: 0.58rem;

  color: rgba(255,255,255,.45);

  text-transform: uppercase;

  letter-spacing: 0.1em;

}



.dh-glass-panel__btn {

  padding: 0.85rem 1.25rem;

  background: #FF7A00;

  color: #fff;

  font-size: 0.85rem;

  font-weight: 700;

  text-decoration: none;

  white-space: nowrap;

  transition: background .2s;

  display: flex;

  align-items: center;

}

.dh-glass-panel__btn:hover { background: #e56e00; color: #fff; }



/* ══════════════════════════════════════

   EXPEDITIONS

══════════════════════════════════════ */

.dh-expeditions { padding: 5rem 0; background: #f8f6f2; }



.dh-expeditions__head {

  display: flex;

  align-items: flex-end;

  justify-content: space-between;

  margin-bottom: 2rem;

  gap: 1rem;

}



.dh-expeditions__grid {

  display: grid;

  grid-template-columns: repeat(3,1fr);

  gap: 1rem;

}



.dh-exp-card--hero { grid-column: span 2; }



.dh-exp-card {

  position: relative;

  border-radius: 18px;

  overflow: hidden;

  display: block;

  text-decoration: none;

  aspect-ratio: 3/4;

}



.dh-exp-card--hero { aspect-ratio: 16/10; }



.dh-exp-card__bg {

  position: absolute;

  inset: 0;

  background-size: cover;

  background-position: center;

  transition: transform .6s cubic-bezier(.25,.46,.45,.94);

}

.dh-exp-card:hover .dh-exp-card__bg { transform: scale(1.06); }



.dh-exp-card__overlay {

  position: absolute;

  inset: 0;

  background: linear-gradient(to top,rgba(5,15,30,.95) 0%,rgba(5,15,30,.4) 50%,rgba(5,15,30,.05) 100%);

}



.dh-exp-card__badge {

  position: absolute;

  top: 1rem;

  left: 1rem;

  background: #FF7A00;

  color: #fff;

  font-size: 0.6rem;

  font-weight: 800;

  text-transform: uppercase;

  letter-spacing: .12em;

  padding: 4px 10px;

  border-radius: 999px;

  z-index: 2;

}



.dh-exp-card__content {

  position: absolute;

  bottom: 0;

  left: 0;

  right: 0;

  padding: 1.5rem;

  z-index: 2;

}



.dh-exp-card__meta {

  display: flex;

  gap: .5rem;

  font-size: .68rem;

  color: rgba(255,255,255,.5);

  font-weight: 500;

  text-transform: uppercase;

  letter-spacing: .08em;

  margin-bottom: .4rem;

}



.dh-exp-card__title {

  font-family: 'Playfair Display', Georgia, serif;

  font-size: clamp(1rem,2vw,1.4rem);

  font-weight: 700;

  color: #fff;

  line-height: 1.2;

  margin: 0 0 .4rem;

}

.dh-exp-card--hero .dh-exp-card__title { font-size: clamp(1.3rem,2.5vw,1.9rem); }



.dh-exp-card__desc {

  font-size: .82rem;

  color: rgba(255,255,255,.55);

  line-height: 1.5;

  margin: 0 0 .75rem;

  display: none;

}

.dh-exp-card--hero .dh-exp-card__desc { display: block; }



.dh-exp-card__footer {

  display: flex;

  align-items: center;

  justify-content: space-between;

  border-top: 1px solid rgba(255,255,255,.12);

  padding-top: .6rem;

}



.dh-exp-card__price { font-size: 1rem; font-weight: 700; color: #fff; }



.dh-exp-card__cta {

  font-size: .75rem;

  color: rgba(255,255,255,.55);

  font-weight: 500;

  transition: color .2s;

}

.dh-exp-card:hover .dh-exp-card__cta { color: #FF7A00; }



/* ══════════════════════════════════════

   STORYTELLING

══════════════════════════════════════ */

.dh-story {

  display: grid;

  grid-template-columns: 1fr 1fr;

  min-height: 540px;

}



.dh-story__img {

  background-size: cover;

  background-position: center;

  background-image: linear-gradient(135deg,#0F2F44,#164B63);

  position: relative;

}

.dh-story__img::after {

  content: '';

  position: absolute;

  inset: 0;

  background: linear-gradient(to right,transparent 70%,#f8f6f2 100%);

}



.dh-story__content {

  background: #f8f6f2;

  padding: 4rem 3rem;

  display: flex;

  flex-direction: column;

  justify-content: center;

}



.dh-story__text {

  font-size: .95rem;

  color: #444;

  line-height: 1.85;

  margin: 0 0 2rem;

  max-width: 100%;

}



.dh-story__facts { display: flex; flex-direction: column; gap: 1rem; }



.dh-story__fact {

  display: flex;

  align-items: flex-start;

  gap: .85rem;

  padding: .85rem 1rem;

  background: #fff;

  border-radius: 10px;

  border-left: 3px solid rgba(255,122,0,.3);

}



.dh-story__fact-icon { font-size: 1rem; color: #FF7A00; flex-shrink: 0; margin-top: 2px; }

.dh-story__fact-label { display: block; font-size: .62rem; text-transform: uppercase; letter-spacing: .1em; color: #999; margin-bottom: 2px; }

.dh-story__fact-val { display: block; font-size: .88rem; color: #081826; font-weight: 500; line-height: 1.4; }



/* ══════════════════════════════════════

   TRAVELER MOMENTS

══════════════════════════════════════ */

.dh-moments {

  position: relative;

  padding: 5rem 0;

  overflow: hidden;

}



.dh-moments__bg {

  position: absolute;

  inset: 0;

  background-image: var(--moments-img,linear-gradient(135deg,#081826,#0F2F44));

  background-size: cover;

  background-position: center;

  filter: blur(2px) brightness(.3);

  transform: scale(1.05);

}



.dh-moments .container { position: relative; z-index: 2; }

.dh-moments__head { margin-bottom: 2.5rem; }



.dh-moments__grid {

  display: grid;

  grid-template-columns: repeat(auto-fill,minmax(280px,1fr));

  gap: 1.25rem;

}



.dh-moment-card {

  background: rgba(255,255,255,.07);

  backdrop-filter: blur(20px);

  -webkit-backdrop-filter: blur(20px);

  border: 1px solid rgba(255,255,255,.12);

  border-radius: 14px;

  padding: 1.5rem;

  display: flex;

  flex-direction: column;

  gap: .85rem;

  transition: background .3s,transform .3s;

}

.dh-moment-card:hover { background: rgba(255,255,255,.11); transform: translateY(-3px); }



.dh-moment-card__stars { font-size: .82rem; color: #FFA24A; letter-spacing: 3px; }



.dh-moment-card__quote {

  font-family: 'Playfair Display', Georgia, serif;

  font-size: .95rem;

  font-style: italic;

  color: rgba(255,255,255,.9);

  line-height: 1.7;

  margin: 0;

  flex: 1;

  max-width: none;

}

.dh-moment-card__quote::before { content: '«'; }

.dh-moment-card__quote::after  { content: '»'; }



.dh-moment-card__author {

  display: flex;

  align-items: center;

  gap: .65rem;

  border-top: 1px solid rgba(255,255,255,.1);

  padding-top: .85rem;

}



.dh-moment-card__avatar {

  width: 34px;

  height: 34px;

  border-radius: 50%;

  background: linear-gradient(135deg,#FF7A00,#FFA24A);

  display: flex;

  align-items: center;

  justify-content: center;

  font-size: .82rem;

  font-weight: 700;

  color: #fff;

  flex-shrink: 0;

}



.dh-moment-card__name { font-size: .82rem; font-weight: 600; color: #fff; }

.dh-moment-card__meta { font-size: .7rem; color: rgba(255,255,255,.4); }



.dh-moments__empty { text-align: center; padding: 3rem; }

.dh-moments__empty p { color: rgba(255,255,255,.6); margin-bottom: 1.25rem; max-width: none; }

.dh-moments__cta {

  display: inline-block;

  padding: 11px 26px;

  background: #FF7A00;

  color: #fff;

  border-radius: 999px;

  font-weight: 600;

  font-size: .88rem;

  text-decoration: none;

}



/* ══════════════════════════════════════

   FAQ

══════════════════════════════════════ */

.dh-faq { padding: 5rem 0; background: #fff; }



.dh-faq__inner {

  display: grid;

  grid-template-columns: 1fr 2fr;

  gap: 3.5rem;

  align-items: start;

}



.dh-faq__left { position: sticky; top: 5rem; }

.dh-faq__sub { font-size: .82rem; color: #999; margin: -.5rem 0 0; }



.dh-faq__item {

  border-bottom: 1px solid rgba(0,0,0,.07);

  cursor: pointer;

  transition: background .2s;

  border-radius: 8px;

  margin-bottom: 3px;

}



.dh-faq__q {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 1.25rem;

  padding: 1.1rem .85rem;

  font-size: .92rem;

  font-weight: 500;

  color: #081826;

  line-height: 1.5;

}



.dh-faq__icon {

  font-size: 1.3rem;

  color: #FF7A00;

  font-weight: 300;

  flex-shrink: 0;

  transition: transform .25s;

  line-height: 1;

}

.dh-faq__item.open .dh-faq__icon { transform: rotate(45deg); }



.dh-faq__a {

  display: none;

  padding: 0 .85rem 1.1rem;

  font-size: .88rem;

  color: #555;

  line-height: 1.85;

  max-width: none;

}

.dh-faq__item.open .dh-faq__a { display: block; }

.dh-faq__item.open { background: #f8f6f2; }

.dh-faq__item:hover { background: #fafafa; }



/* ══════════════════════════════════════

   EDITORIAL

══════════════════════════════════════ */

.dh-editorial { padding: 5rem 0; background: #f8f6f2; }



.dh-editorial__head {

  display: flex;

  align-items: flex-end;

  justify-content: space-between;

  margin-bottom: 2rem;

  gap: 1rem;

  flex-wrap: wrap;

}



.dh-editorial__grid {

  display: grid;

  grid-template-columns: repeat(auto-fill,minmax(260px,1fr));

  gap: 1.25rem;

}



.dh-editorial .jm-card__overlay {

  background: linear-gradient(to top,rgba(0,0,0,.85) 0%,rgba(0,0,0,.3) 55%,transparent 100%);

}

.dh-editorial .jm-card__title { color: #fff; }

.dh-editorial .jm-card__excerpt { color: rgba(255,255,255,.8); }

.dh-editorial .jm-card__meta span { color: rgba(255,255,255,.6); }



/* ══════════════════════════════════════

   GALLERY

══════════════════════════════════════ */

.dh-gallery-section { padding: 5rem 0; background: #fff; }



.dh-gallery {

  display: grid;

  grid-template-columns: repeat(auto-fill,minmax(200px,1fr));

  gap: .75rem;

  margin-top: 1.5rem;

}



.dh-gallery__item {

  position: relative;

  border-radius: 10px;

  overflow: hidden;

  aspect-ratio: 4/3;

}

.dh-gallery__item img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }

.dh-gallery__item:hover img { transform: scale(1.06); }

.dh-gallery__caption {

  position: absolute;

  bottom: 0; left: 0; right: 0;

  padding: .4rem .65rem;

  background: linear-gradient(transparent,rgba(0,0,0,.65));

  color: #fff;

  font-size: .7rem;

}



/* ══════════════════════════════════════

   RELATED

══════════════════════════════════════ */

.dh-related { padding: 5rem 0; background: #f8f6f2; }



.dh-related__grid {

  display: grid;

  grid-template-columns: repeat(auto-fill,minmax(220px,1fr));

  gap: 1rem;

  margin-top: 2rem;

}



.dh-related-item {

  position: relative;

  border-radius: 14px;

  overflow: hidden;

  display: block;

  text-decoration: none;

  aspect-ratio: 3/4;

}



.dh-related-item__bg {

  position: absolute;

  inset: 0;

  background: linear-gradient(135deg,#0F2F44,#164B63);

  background-size: cover;

  background-position: center;

  transition: transform .5s cubic-bezier(.25,.46,.45,.94);

}

.dh-related-item:hover .dh-related-item__bg { transform: scale(1.08); }



.dh-related-item__overlay {

  position: absolute;

  inset: 0;

  background: linear-gradient(to top,rgba(5,15,30,.9) 0%,rgba(5,15,30,.1) 60%);

}



.dh-related-item__content {

  position: absolute;

  bottom: 1.25rem;

  left: 1.25rem;

  right: 1.25rem;

  z-index: 2;

}



.dh-related-item__name {

  font-family: 'Playfair Display', Georgia, serif;

  font-size: 1.2rem;

  font-weight: 700;

  color: #fff;

  margin: 0 0 .2rem;

}



.dh-related-item__tag { font-size: .75rem; color: rgba(255,255,255,.55); font-style: italic; margin: 0; }



/* ══════════════════════════════════════

   FINAL CTA

══════════════════════════════════════ */

.dh-cta-final {

  position: relative;

  padding: 7rem 0;

  overflow: hidden;

}



.dh-cta-final__bg {

  position: absolute;

  inset: 0;

  background-image: var(--cta-img,linear-gradient(135deg,#081826,#0F2F44));

  background-size: cover;

  background-position: center;

  filter: brightness(.3);

}



.dh-cta-final .container { position: relative; z-index: 2; }

.dh-cta-final__inner { text-align: center; max-width: 650px; margin: 0 auto; }



.dh-cta-final__title {

  font-family: 'Playfair Display', Georgia, serif;

  font-size: clamp(1.8rem,3.5vw,3.2rem);

  font-weight: 700;

  font-style: italic;

  color: #fff;

  letter-spacing: -.03em;

  line-height: 1.15;

  margin: 0 0 .85rem;

}



.dh-cta-final__sub { font-size: .95rem; color: rgba(255,255,255,.55); margin: 0 0 2rem; max-width: none; }



.dh-cta-final__btn {

  display: inline-block;

  padding: 14px 38px;

  background: #FF7A00;

  color: #fff;

  border-radius: 999px;

  font-weight: 700;

  font-size: .95rem;

  text-decoration: none;

  box-shadow: 0 8px 28px rgba(255,122,0,.4);

  transition: transform .25s,box-shadow .25s,background .2s;

}

.dh-cta-final__btn:hover { transform: translateY(-3px); box-shadow: 0 14px 40px rgba(255,122,0,.5); background: #e56e00; color: #fff; }



/* ══════════════════════════════════════

   MOBILE

══════════════════════════════════════ */

@media (max-width: 1023px) {

  .dh-expeditions__grid { grid-template-columns: 1fr 1fr; }

  .dh-exp-card--hero { grid-column: span 2; }

  .dh-story { grid-template-columns: 1fr; }

  .dh-story__img { height: 280px; }

  .dh-story__img::after { background: linear-gradient(to bottom,transparent 70%,#f8f6f2 100%); }

  .dh-story__content { padding: 2.5rem 1.5rem; }

  .dh-faq__inner { grid-template-columns: 1fr; gap: 1.5rem; }

  .dh-faq__left { position: static; }

}



@media (max-width: 767px) {

  .dh-glass-panel { flex-direction: column; border-radius: 12px; width: 100%; max-width: 360px; }

  .dh-glass-panel__item { border-right: none; border-bottom: 1px solid rgba(255,255,255,.1); }

  .dh-glass-panel__btn { text-align: center; justify-content: center; }

  .dh-expeditions__grid { grid-template-columns: 1fr; }

  .dh-exp-card--hero { grid-column: span 1; aspect-ratio: 4/3; }

  .dh-moments__grid { grid-template-columns: 1fr; }

  .dh-related__grid { grid-template-columns: 1fr 1fr; }

  .dh-expeditions,.dh-story__content,.dh-faq,.dh-editorial,.dh-gallery-section,.dh-related,.dh-moments { padding: 2.5rem 0; }
  .dh-story__content { padding-left: 1.5rem; padding-right: 1.5rem; }

  .dh-hero__title { font-size: clamp(2.5rem,10vw,4rem); }

}



@media (max-width: 480px) {

  .dh-related__grid { grid-template-columns: 1fr; }

  .dh-hero__center { padding: 1.5rem 1rem; }

  .dh-hero__bottom { padding: 1rem; }

}




/* ══════════════════════════════════════

   MAGAZINE EDITORIAL

══════════════════════════════════════ */

.dh-magazine { padding: 5rem 0; background: #ffffff; }



.dh-magazine__head {

  display: flex;

  align-items: flex-end;

  justify-content: space-between;

  margin-bottom: 2.5rem;

  gap: 1rem;

}



.dh-magazine__head-right {

  display: flex;

  align-items: baseline;

  justify-content: space-between;

  flex: 1;

  gap: 1rem;

}



.dh-magazine__head-right .dh-h2 { margin: 0; }



.dh-magazine__grid {

  display: grid;

  grid-template-columns: 3fr 2fr;

  grid-template-rows: auto;

  gap: 1rem;

}



/* Hero Article */

.dh-mag-hero {

  position: relative;

  border-radius: 20px;

  overflow: hidden;

  display: block;

  text-decoration: none;

  grid-row: span 2;

  min-height: 620px;

}



.dh-mag-hero__img {

  position: absolute;

  inset: 0;

  background-size: cover;

  background-position: center;

  transition: transform 0.8s cubic-bezier(0.25,0.46,0.45,0.94);

}

.dh-mag-hero:hover .dh-mag-hero__img { transform: scale(1.04); }



.dh-mag-hero__overlay {

  position: absolute;

  inset: 0;

  background: linear-gradient(180deg, rgba(0,0,0,0.05) 0%, rgba(0,0,0,0.85) 100%);

  transition: background 0.4s;

}

.dh-mag-hero:hover .dh-mag-hero__overlay {

  background: linear-gradient(180deg, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0.92) 100%);

}



.dh-mag-hero__content {

  position: absolute;

  bottom: 0;

  left: 0;

  right: 0;

  padding: 2.5rem;

  z-index: 2;

}



.dh-mag-hero__cat {

  display: inline-block;

  font-size: 0.6rem;

  font-weight: 800;

  text-transform: uppercase;

  letter-spacing: 0.18em;

  color: #FF7A00;

  background: rgba(255,122,0,0.15);

  border: 1px solid rgba(255,122,0,0.3);

  padding: 3px 10px;

  border-radius: 999px;

  margin-bottom: 0.85rem;

}



.dh-mag-hero__title {

  font-family: 'Playfair Display', Georgia, serif;

  font-size: clamp(1.6rem, 3.5vw, 2.8rem);

  font-weight: 700;

  color: #ffffff;

  line-height: 1.15;

  margin: 0 0 0.85rem;

  letter-spacing: -0.02em;

}



.dh-mag-hero__excerpt {

  font-size: 0.9rem;

  color: rgba(255,255,255,0.65);

  line-height: 1.65;

  margin: 0 0 1.25rem;

  max-width: none;

}



.dh-mag-hero__meta {

  display: flex;

  gap: 1rem;

  font-size: 0.72rem;

  color: rgba(255,255,255,0.45);

  margin-bottom: 1rem;

}



.dh-mag-hero__cta {

  display: inline-flex;

  align-items: center;

  gap: 0.5rem;

  font-size: 0.82rem;

  font-weight: 600;

  color: #ffffff;

  border-bottom: 1px solid rgba(255,255,255,0.3);

  padding-bottom: 2px;

  transition: border-color 0.2s, color 0.2s;

}

.dh-mag-hero:hover .dh-mag-hero__cta { color: #FF7A00; border-color: #FF7A00; }



/* Secondary Cards */

.dh-mag-card {

  position: relative;

  border-radius: 14px;

  overflow: hidden;

  display: block;

  text-decoration: none;

  aspect-ratio: 16/9;

}



.dh-mag-card__img {

  position: absolute;

  inset: 0;

  background-size: cover;

  background-position: center;

  transition: transform 0.6s cubic-bezier(0.25,0.46,0.45,0.94);

}

.dh-mag-card:hover .dh-mag-card__img { transform: scale(1.06); }



.dh-mag-card__overlay {

  position: absolute;

  inset: 0;

  background: linear-gradient(180deg, rgba(0,0,0,0.02) 0%, rgba(0,0,0,0.78) 100%);

}



.dh-mag-card__content {

  position: absolute;

  bottom: 0;

  left: 0;

  right: 0;

  padding: 1.25rem;

  z-index: 2;

}



.dh-mag-card__cat {

  display: inline-block;

  font-size: 0.58rem;

  font-weight: 700;

  text-transform: uppercase;

  letter-spacing: 0.15em;

  color: rgba(255,255,255,0.55);

  margin-bottom: 0.4rem;

}



.dh-mag-card__title {

  font-family: 'Playfair Display', Georgia, serif;

  font-size: clamp(0.95rem, 1.5vw, 1.2rem);

  font-weight: 700;

  color: #ffffff;

  line-height: 1.25;

  margin: 0 0 0.4rem;

}



.dh-mag-card__meta {

  font-size: 0.68rem;

  color: rgba(255,255,255,0.4);

}



/* Mobile */

@media (max-width: 767px) {

  .dh-magazine__grid { grid-template-columns: 1fr; }

  .dh-mag-hero { min-height: 400px; grid-row: span 1; }

  .dh-mag-card { aspect-ratio: 4/3; }

  .dh-magazine__head { flex-direction: column; align-items: flex-start; gap: 0.5rem; }

  .dh-magazine__head-right { flex-direction: column; gap: 0.5rem; }

}




/* ══════════════════════════════════════

   EXPLORE — RELATED DESTINATIONS

══════════════════════════════════════ */

.dh-explore { padding: 5rem 0; background: #f8f6f2; }



.dh-explore__head { margin-bottom: 2.5rem; }

.dh-explore__head .dh-h2 { margin-bottom: 0; }



.dh-explore__grid {

  display: grid;

  grid-template-columns: 3fr 2fr;

  grid-template-rows: repeat(3, 1fr);

  gap: 0.75rem;

  min-height: 600px;

}



/* Featured */

.dh-explore-featured {

  position: relative;

  border-radius: 20px;

  overflow: hidden;

  display: block;

  text-decoration: none;

  grid-row: span 3;

}



.dh-explore-featured__bg {

  position: absolute;

  inset: 0;

  background: linear-gradient(135deg,#0F2F44,#164B63);

  background-size: cover;

  background-position: center;

  transition: transform 0.7s cubic-bezier(0.22,1,0.36,1);

}

.dh-explore-featured:hover .dh-explore-featured__bg { transform: scale(1.05); }



.dh-explore-featured__overlay {

  position: absolute;

  inset: 0;

  background: linear-gradient(180deg,rgba(0,0,0,0.05) 0%,rgba(0,0,0,0.75) 100%);

  transition: background 0.4s;

}

.dh-explore-featured:hover .dh-explore-featured__overlay {

  background: linear-gradient(180deg,rgba(0,0,0,0.1) 0%,rgba(0,0,0,0.88) 100%);

}



.dh-explore-featured__content {

  position: absolute;

  bottom: 0;

  left: 0;

  right: 0;

  padding: 2.5rem;

  z-index: 2;

}



.dh-explore-featured__region {

  display: inline-block;

  font-size: 0.58rem;

  font-weight: 700;

  text-transform: uppercase;

  letter-spacing: 0.18em;

  color: rgba(255,255,255,0.5);

  margin-bottom: 0.6rem;

}



.dh-explore-featured__name {

  font-family: 'Playfair Display', Georgia, serif;

  font-size: clamp(2.2rem,4vw,3.8rem);

  font-weight: 700;

  color: #ffffff;

  line-height: 1.05;

  margin: 0 0 0.75rem;

  letter-spacing: -0.03em;

}



.dh-explore-featured__tagline {

  font-size: 0.92rem;

  color: rgba(255,255,255,0.6);

  line-height: 1.6;

  margin: 0 0 1.5rem;

  max-width: 360px;

}



.dh-explore-featured__cta {

  display: inline-flex;

  align-items: center;

  gap: 0.5rem;

  font-size: 0.82rem;

  font-weight: 600;

  color: #ffffff;

  border-bottom: 1px solid rgba(255,255,255,0.35);

  padding-bottom: 2px;

  opacity: 0;

  transform: translateY(8px);

  transition: opacity 0.35s, transform 0.35s, color 0.2s, border-color 0.2s;

}

.dh-explore-featured:hover .dh-explore-featured__cta {

  opacity: 1;

  transform: translateY(0);

  color: #FF7A00;

  border-color: #FF7A00;

}



/* Secondary cards */

.dh-explore-card {

  position: relative;

  border-radius: 14px;

  overflow: hidden;

  display: block;

  text-decoration: none;

}



.dh-explore-card__bg {

  position: absolute;

  inset: 0;

  background: linear-gradient(135deg,#0F2F44,#164B63);

  background-size: cover;

  background-position: center;

  transition: transform 0.6s cubic-bezier(0.22,1,0.36,1);

}

.dh-explore-card:hover .dh-explore-card__bg { transform: scale(1.06); }



.dh-explore-card__overlay {

  position: absolute;

  inset: 0;

  background: linear-gradient(180deg,rgba(0,0,0,0.02) 0%,rgba(0,0,0,0.72) 100%);

  transition: background 0.3s;

}

.dh-explore-card:hover .dh-explore-card__overlay {

  background: linear-gradient(180deg,rgba(0,0,0,0.05) 0%,rgba(0,0,0,0.85) 100%);

}



.dh-explore-card__content {

  position: absolute;

  bottom: 0;

  left: 0;

  right: 0;

  padding: 1.25rem;

  z-index: 2;

}



.dh-explore-card__region {

  display: block;

  font-size: 0.55rem;

  font-weight: 700;

  text-transform: uppercase;

  letter-spacing: 0.15em;

  color: rgba(255,255,255,0.45);

  margin-bottom: 0.3rem;

}



.dh-explore-card__name {

  font-family: 'Playfair Display', Georgia, serif;

  font-size: clamp(1rem,1.8vw,1.35rem);

  font-weight: 700;

  color: #ffffff;

  margin: 0 0 0.2rem;

  line-height: 1.2;

}



.dh-explore-card__tagline {

  font-size: 0.72rem;

  color: rgba(255,255,255,0.5);

  font-style: italic;

  margin: 0;

  max-width: none;

}



/* Mobile */

@media (max-width: 767px) {

  .dh-explore__grid {

    grid-template-columns: 1fr;

    grid-template-rows: auto;

    min-height: auto;

  }

  .dh-explore-featured { grid-row: span 1; min-height: 420px; }

  .dh-explore-card { min-height: 200px; }

  .dh-explore-featured__cta { opacity: 1; transform: translateY(0); }

}




/* ── FAQ Trust & Fact ── */

.dh-faq__trust {

  display: flex;

  flex-direction: column;

  gap: 0.5rem;

  margin: 1.25rem 0 1.5rem;

}



.dh-faq__trust-item {

  font-size: 0.82rem;

  color: #555;

  display: flex;

  align-items: center;

  gap: 0.5rem;

}



.dh-faq__trust-item::first-letter {

  color: #FF7A00;

  font-weight: 700;

}



.dh-faq__fact {

  display: flex;

  gap: 0.85rem;

  align-items: flex-start;

  padding: 1.25rem;

  background: linear-gradient(135deg, #081826, #0F2F44);

  border-radius: 14px;

  margin-top: 1.5rem;

}



.dh-faq__fact-icon {

  color: #FF7A00;

  font-size: 1rem;

  flex-shrink: 0;

  margin-top: 2px;

}



.dh-faq__fact p {

  font-size: 0.88rem;

  color: rgba(255,255,255,0.75);

  line-height: 1.7;

  margin: 0;

  font-style: italic;

  max-width: none;

}




/* ── Hero centering fix ── */

.dh-hero__content {

  max-width: 1440px;

  width: 100%;

  margin: 0 auto;

  align-self: stretch;

}

.dh-hero__center {

  max-width: 860px;

  padding-left: clamp(2rem, 8vw, 8rem);

}

.dh-hero__bottom {

  padding-left: clamp(2rem, 8vw, 8rem);

}

.dh-hero__top {

  padding-left: clamp(2rem, 8vw, 8rem);

}




/* ── Base font for hub page ── */

.dh-page {

  font-family: var(--font-primary, 'Inter', sans-serif);

}



.dh-page p,

.dh-page span,

.dh-page div,

.dh-page a,

.dh-page li {

  font-family: var(--font-primary, 'Inter', sans-serif);

}



.dh-page h1,

.dh-page h2,

.dh-page h3,

.dh-page .dh-hero__title,

.dh-page .dh-h2,

.dh-page .dh-exp-card__title,

.dh-page .dh-mag-hero__title,

.dh-page .dh-mag-card__title,

.dh-page .dh-explore-featured__name,

.dh-page .dh-explore-card__name,

.dh-page .dh-related-item__name,

.dh-page .dh-moment-card__quote,

.dh-page .dh-cta-final__title {

  font-family: 'Playfair Display', Georgia, serif;

}




/* ── Use Inter for hero title ── */

.dh-hero__title {

  font-family: var(--font-primary, 'Inter', sans-serif) !important;

  font-weight: 900;

}




/* ── Use Inter for all headings ── */

.dh-page h1,

.dh-page h2,

.dh-page h3,

.dh-h2,

.dh-exp-card__title,

.dh-explore-featured__name,

.dh-explore-card__name,

.dh-mag-hero__title,

.dh-mag-card__title,

.dh-cta-final__title,

.dh-related-item__name {

  font-family: var(--font-primary, 'Inter', sans-serif) !important;

}




/* ── Mobile fixes 375px ── */

@media (max-width: 375px) {

  .dh-hero__title { font-size: 1.8rem !important; }

  .dh-hero__tagline { font-size: 0.85rem !important; }

  .dh-exp-grid { grid-template-columns: 1fr !important; }

  .dh-story { grid-template-columns: 1fr !important; }

  .dh-story__img { height: 200px !important; }

  .dh-moments-grid { grid-template-columns: 1fr 1fr !important; }

  .dh-faq-stats { flex-direction: column !important; gap: 0.5rem !important; }

  .dh-mag-grid { grid-template-columns: 1fr !important; }

  .dh-explore-grid { grid-template-columns: 1fr !important; }

}



@media (max-width: 599px) {

  .dh-hero { min-height: 70vh !important; }

  .dh-exp-grid { grid-template-columns: 1fr !important; }

  .dh-mag-grid { grid-template-columns: 1fr !important; }

  .dh-explore-grid { grid-template-columns: 1fr !important; }

  .dh-story { gap: 0 !important; }

}

