/* Destination page. Loaded by destination.php only. */

/* Why Kenya: the heading on the left, the sentence set large on the right,
   then a wide photograph with a small upright one rising out of its corner. */
.dest-why__grid {
  display: grid; grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: var(--gutter); row-gap: clamp(3rem, 7vw, 6rem);
}
.dest-why__head { grid-column: 1 / span 4; }
.dest-why__text {
  grid-column: 6 / -1;
  font-family: var(--serif); font-weight: 300;
  font-size: clamp(1.55rem, 2.7vw, 2.5rem); line-height: 1.28; letter-spacing: -.01em;
  color: var(--forest); max-width: 30ch;
  padding-top: .3rem;
}
.dest-why__text::first-letter { color: var(--moss); }
.dest-why__wide { grid-column: 1 / span 9; grid-row: 2; }
.dest-why__small {
  grid-column: 9 / -1; grid-row: 2; align-self: end;
  margin-bottom: clamp(-7rem, -7vw, -2rem); position: relative; z-index: 1;
  border: 10px solid var(--white); border-right: 0; border-bottom: 0;
}
.dest-why { padding-bottom: calc(var(--section) + clamp(2rem, 6vw, 6rem)); }
@media (max-width: 900px) {
  .dest-why__grid { grid-template-columns: repeat(6, minmax(0, 1fr)); row-gap: 2.2rem; }
  .dest-why__head, .dest-why__text, .dest-why__wide { grid-column: 1 / -1; grid-row: auto; }
  .dest-why__head h2 { margin-bottom: 0; }
  .dest-why__small { grid-column: 4 / -1; grid-row: auto; margin: -5rem 0 0; }
  .dest-why { padding-bottom: var(--section); }
}

/* Malu Lodge: the shared welcome collage. */
.dest-lodge { padding-top: 0; }
.dest-lodge .collage h2 { margin-bottom: 2rem; }

/* Where we are: copy on the left, the plain facts as a ruled, numbered list. */
.dest-where__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2.5rem, 7vw, 7rem); align-items: start; }
.dest-where__head h2 { margin-bottom: 1.8rem; }
.dest-where__text p { color: var(--ink-soft); max-width: 38ch; }
.dest-where__text p + p { margin-top: 1rem; }
.dest-where__head .btn { margin-top: 2.4rem; }
.dest-where__facts { border-top: 1px solid var(--line); }
.dest-where__facts > div {
  display: grid; grid-template-columns: minmax(0, 13rem) minmax(0, 1fr); gap: .4rem 2rem; align-items: baseline;
  padding: 1.45rem 0; border-bottom: 1px solid var(--line);
}
.dest-where__facts dt { font-size: .66rem; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; color: var(--moss); display: flex; gap: 1.2rem; }
.dest-where__facts dt span { color: var(--sage); font-weight: 400; letter-spacing: .2em; }
.dest-where__facts dd { margin: 0; font-family: var(--serif); font-weight: 300; font-size: clamp(1.3rem, 2vw, 1.75rem); line-height: 1.2; color: var(--forest); }
@media (max-width: 900px) { .dest-where__grid { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .dest-where__facts > div { grid-template-columns: 1fr; } }

/* The statement over the sunset is our own line, not a quotation. */
.dest-band blockquote p::before, .dest-band blockquote p::after { content: none; }
.dest-band blockquote p { max-width: 20ch; }

/* Nearby: heading sticky on the left, the numbered list on the right. */
.dest-near__grid { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: clamp(2rem, 6vw, 6rem); align-items: start; }
.dest-near__head { position: sticky; top: calc(var(--header-h) + 2rem); margin: 0; }
.dest-near__head p { margin-bottom: .4rem; }
.dest-near .index__row { grid-template-columns: 3rem minmax(0, 12rem) minmax(0, 1fr) auto; }
@media (max-width: 960px) {
  .dest-near__grid { grid-template-columns: 1fr; }
  .dest-near__head { position: static; }
}
@media (max-width: 760px) { .dest-near .index__row { grid-template-columns: 1fr; } }

/* The restaurant feature runs edge to edge. */
.dest-rest .feature__panel { padding-left: max(var(--gutter), calc((100vw - var(--wrap)) / 2)); }
@media (max-width: 900px) { .dest-rest .feature__panel { padding-left: var(--gutter); } }

/* On the reserve: a landscape photograph with an upright one overlapping its
   lower edge; the copy beside them. */
.dest-reserve__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter); align-items: center; }
.dest-reserve__media { grid-column: 1 / span 7; position: relative; padding-bottom: clamp(3rem, 8vw, 7rem); }
.dest-reserve__main { width: 88%; }
.dest-reserve__small { position: absolute; right: 0; bottom: 0; width: 34%; border: 10px solid var(--white); }
.dest-reserve__copy { grid-column: 8 / -1; padding-left: clamp(0rem, 2vw, 2rem); }
.dest-reserve__copy h2 { margin-bottom: 1.8rem; }
.dest-reserve__text p { color: var(--ink-soft); font-size: .95rem; line-height: 1.85; max-width: 40ch; }
.dest-reserve__text p + p { margin-top: 1rem; }
.dest-reserve__copy .link-line { margin-top: 2.2rem; }
@media (max-width: 900px) {
  .dest-reserve__grid { grid-template-columns: 1fr; row-gap: 2.5rem; }
  .dest-reserve__media, .dest-reserve__copy { grid-column: 1; }
  .dest-reserve__copy { order: -1; }
}