/* ============================================================
   FLORELLE — retreat detail page
   ============================================================ */

/* ---- HERO ---- */
.r-hero {
  position: relative;
  min-height: 92svh;
  display: flex;
  align-items: stretch;
  color: var(--cream);
  overflow: hidden;
}
.r-hero .ph { position: absolute; inset: 0; }
.r-hero::before {
  content: "";
  position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(180deg,
    oklch(0.205 0.013 60 / 0.40) 0%,
    oklch(0.205 0.013 60 / 0.10) 35%,
    oklch(0.205 0.013 60 / 0.30) 68%,
    oklch(0.205 0.013 60 / 0.78) 100%);
}
.r-hero-inner { position: relative; z-index: 2; width: 100%; display: flex; flex-direction: column; justify-content: flex-end; padding-top: clamp(6rem, 13vh, 9rem); padding-bottom: clamp(3rem, 6vw, 5.5rem); }
.r-back {
  display: inline-flex; align-items: center; gap: 0.6em;
  font-size: 0.7rem; letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--cream-dim); margin-bottom: auto; align-self: flex-start;
  white-space: nowrap;
}
.r-back .arr { transition: transform 0.4s var(--ease); }
.r-back:hover .arr { transform: translateX(-0.35em); }
.r-hero .r-meta { display: flex; align-items: center; gap: 1rem; margin-bottom: 1.4rem; flex-wrap: wrap; }
.r-hero .r-loc { font-size: 0.74rem; letter-spacing: 0.22em; text-transform: uppercase; color: var(--cream-dim); }
.r-hero h1 { font-size: clamp(3rem, 8vw, 7rem); font-weight: 300; line-height: 0.98; }
.r-hero .r-tag {
  font-family: var(--serif); font-style: italic; font-weight: 300;
  font-size: clamp(1.3rem, 2.4vw, 2rem); color: var(--cream-dim);
  margin-top: 1rem; max-width: 30ch;
}

/* ---- OVERVIEW + STAT STRIP ---- */
.r-overview { padding-block: clamp(4rem, 8vw, 7rem); }
.r-overview-grid {
  display: grid; grid-template-columns: 1.1fr 0.9fr; gap: clamp(2rem, 5vw, 5rem);
  align-items: start;
}
.r-overview-grid .lede { font-size: clamp(1.2rem, 2vw, 1.55rem); color: var(--ink); max-width: none; }
.r-overview-grid .body p { color: var(--muted); margin-top: 1.2rem; }
.r-stats {
  display: grid; grid-template-columns: 1fr 1fr; gap: 1px;
  background: var(--line); border: 1px solid var(--line);
}
.r-stat { background: var(--cream); padding: 1.5rem 1.4rem; }
.r-stat .k {
  font-family: "JetBrains Mono", monospace; font-size: 0.6rem;
  letter-spacing: 0.16em; text-transform: uppercase; color: var(--clay-deep);
}
.r-stat .v { font-family: var(--serif); font-size: 1.7rem; margin-top: 0.35rem; line-height: 1; }
@media (max-width: 820px) { .r-overview-grid { grid-template-columns: 1fr; } }

/* ---- VENUE ---- */
.r-venue { background: var(--ink-deep); color: var(--cream); }
.r-venue-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 0; align-items: stretch;
}
.r-venue-media .ph { width: 100%; height: 100%; min-height: 30rem; }
.r-venue-body { padding: clamp(2.5rem, 6vw, 6rem); }
.r-venue-body .eyebrow { color: var(--cream-dim); }
.r-venue-body .eyebrow::before { background: var(--cream-faint); }
.r-venue-name { font-size: clamp(2.2rem, 4vw, 3.4rem); margin: 1.2rem 0 0.3rem; }
.r-venue-desc { font-size: 0.74rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--clay); }
.r-venue-body > p { color: var(--cream-dim); margin-top: 1.5rem; max-width: 46ch; }
.r-venue-features { list-style: none; margin: 2rem 0 0; padding: 0; display: grid; gap: 0.9rem; }
.r-venue-features li { display: flex; gap: 0.9rem; align-items: baseline; color: var(--cream-dim); font-size: 0.98rem; }
.r-venue-features li::before {
  content: ""; width: 6px; height: 6px; flex: 0 0 6px; border-radius: 50%;
  background: var(--clay); transform: translateY(-2px);
}
@media (max-width: 820px) {
  .r-venue-grid { grid-template-columns: 1fr; }
  .r-venue-media .ph { min-height: 22rem; }
}

/* ---- ITINERARY ---- */
.r-days .pillars-head { margin-bottom: clamp(2.5rem, 5vw, 4rem); }
.r-day {
  display: grid; grid-template-columns: 7rem 1fr; gap: clamp(1rem, 3vw, 3rem);
  padding: 2rem 0; border-top: 1px solid var(--line);
}
.r-day:last-child { border-bottom: 1px solid var(--line); }
.r-day .r-day-n {
  font-family: "JetBrains Mono", monospace; font-size: 0.66rem;
  letter-spacing: 0.16em; text-transform: uppercase; color: var(--clay-deep);
  padding-top: 0.4rem;
}
.r-day h3 { font-size: 1.6rem; margin-bottom: 0.5rem; }
.r-day p { color: var(--muted); max-width: 60ch; }
@media (max-width: 620px) {
  .r-day { grid-template-columns: 1fr; gap: 0.5rem; }
}

/* ---- DINING ---- */
.r-dining { background: var(--oat); }
.r-dining-grid {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px;
  background: var(--line); border: 1px solid var(--line); margin-top: clamp(2rem, 4vw, 3rem);
}
.r-dish { background: var(--oat); padding: 2rem 1.8rem; }
.r-dish .r-dish-k { font-family: "JetBrains Mono", monospace; font-size: 0.6rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--clay-deep); }
.r-dish h3 { font-size: 1.5rem; margin: 0.5rem 0 0.5rem; }
.r-dish p { color: var(--muted); font-size: 0.94rem; }
@media (max-width: 620px) { .r-dining-grid { grid-template-columns: 1fr; } }

/* ---- INCLUDED ---- */
.r-included-grid {
  display: grid; grid-template-columns: 0.8fr 1.2fr; gap: clamp(2rem, 5vw, 5rem); align-items: start;
}
.r-included ul { list-style: none; margin: 0; padding: 0; columns: 2; column-gap: 3rem; }
.r-included li {
  break-inside: avoid; padding: 0.9rem 0; border-bottom: 1px solid var(--line);
  display: flex; gap: 0.8rem; align-items: baseline; color: var(--ink);
}
.r-included li::before { content: "—"; color: var(--clay); }
@media (max-width: 760px) {
  .r-included-grid { grid-template-columns: 1fr; }
  .r-included ul { columns: 1; }
}

/* ---- PACKAGES ---- */
.r-packages { background: var(--ink-deep); color: var(--cream); }
.r-packages .pillars-head h2, .r-packages .sec-head h2 { color: var(--cream); }
.r-packages .lede { color: var(--cream-dim); }
.r-pkg-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(1rem, 2vw, 1.6rem); margin-top: clamp(2rem, 4vw, 3rem); }
.r-pkg {
  border: 1px solid oklch(0.38 0.012 62); padding: 2.2rem 1.9rem;
  display: flex; flex-direction: column;
}
.r-pkg.feature { border-color: var(--clay); background: oklch(0.255 0.012 62); }
.r-pkg .r-pkg-tier { font-size: 0.68rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--clay); }
.r-pkg .r-pkg-price { font-family: var(--serif); font-size: 2.6rem; line-height: 1; margin: 1rem 0 0.2rem; }
.r-pkg .r-pkg-per { font-size: 0.72rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--cream-faint); }
.r-pkg ul { list-style: none; margin: 1.6rem 0 0; padding: 1.6rem 0 0; border-top: 1px solid oklch(0.38 0.012 62); display: grid; gap: 0.8rem; }
.r-pkg li { color: var(--cream-dim); font-size: 0.92rem; display: flex; gap: 0.7rem; align-items: baseline; }
.r-pkg li::before { content: ""; width: 5px; height: 5px; flex: 0 0 5px; border-radius: 50%; background: var(--clay); transform: translateY(-2px); }
.r-pkg .r-pkg-note { margin-top: auto; padding-top: 1.4rem; font-size: 0.8rem; color: var(--cream-faint); }
@media (max-width: 820px) { .r-pkg-grid { grid-template-columns: 1fr; } }

/* ---- ARRIVAL: transport from airport + check-in ---- */
.r-arrival { background: var(--oat); }
.r-arrival-head { margin-bottom: clamp(2.2rem, 4vw, 3.4rem); }
.r-airport {
  display: inline-flex; align-items: baseline; gap: 0.8rem; flex-wrap: wrap;
  margin-top: 1.4rem; padding: 0.7rem 1.1rem;
  border: 1px solid var(--line); background: var(--cream);
}
.r-airport .lbl {
  font-family: "JetBrains Mono", monospace; font-size: 0.58rem;
  letter-spacing: 0.18em; text-transform: uppercase; color: var(--clay-deep);
}
.r-airport .val { font-family: var(--serif); font-size: 1.25rem; }
.r-arrival-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 1px;
  background: var(--line); border: 1px solid var(--line);
}
.r-arrival-col { background: var(--cream); padding: clamp(1.8rem, 3vw, 2.8rem); }
.r-arrival-col .r-col-k {
  display: flex; align-items: center; gap: 0.7rem;
  font-family: "JetBrains Mono", monospace; font-size: 0.6rem;
  letter-spacing: 0.18em; text-transform: uppercase; color: var(--clay-deep);
}
.r-arrival-col .r-col-k .ic {
  width: 1.7rem; height: 1.7rem; flex: none; border-radius: 50%;
  border: 1px solid var(--clay); display: grid; place-items: center;
  font-size: 0.8rem; color: var(--clay-deep);
}
.r-arrival-col h3 { font-size: 1.55rem; margin: 0.8rem 0 0.7rem; }
.r-arrival-col > p { color: var(--muted); font-size: 0.98rem; margin-bottom: 1.6rem; }
.r-steps { list-style: none; margin: 0; padding: 0; counter-reset: step; }
.r-steps li {
  display: grid; grid-template-columns: auto 1fr; gap: 0.9rem 1rem;
  padding: 1rem 0; border-top: 1px solid var(--line-soft); align-items: start;
}
.r-steps li::before {
  counter-increment: step; content: counter(step, decimal-leading-zero);
  font-family: "JetBrains Mono", monospace; font-size: 0.62rem;
  color: var(--clay-deep); padding-top: 0.25rem;
}
.r-steps .s-k { font-family: var(--serif); font-size: 1.12rem; line-height: 1.3; }
.r-steps .s-v { grid-column: 2; color: var(--muted); font-size: 0.92rem; margin-top: 0.15rem; }
@media (max-width: 760px) { .r-arrival-grid { grid-template-columns: 1fr; } }

/* ---- ITINERARY: timed day plans ---- */
.r-itin-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem; flex-wrap: wrap; margin-bottom: clamp(1.6rem, 3vw, 2.4rem); }
.r-legend { display: flex; flex-wrap: wrap; gap: 0.7rem 1.2rem; padding-bottom: clamp(2rem, 3.5vw, 3rem); }
.r-legend .lg {
  display: inline-flex; align-items: center; gap: 0.5rem;
  font-family: "JetBrains Mono", monospace; font-size: 0.58rem;
  letter-spacing: 0.12em; text-transform: uppercase; color: var(--muted);
}
.r-legend .dot { width: 8px; height: 8px; border-radius: 50%; flex: none; }
.r-day-block { border-top: 1px solid var(--line); padding-block: clamp(1.8rem, 3.2vw, 2.6rem); }
.r-day-block:last-child { border-bottom: 1px solid var(--line); }
.r-day-grid { display: grid; grid-template-columns: 13rem 1fr; gap: clamp(1rem, 3vw, 3rem); align-items: start; }
.r-day-head .r-day-n {
  font-family: "JetBrains Mono", monospace; font-size: 0.62rem;
  letter-spacing: 0.18em; text-transform: uppercase; color: var(--clay-deep);
}
.r-day-head h3 { font-size: clamp(1.5rem, 2.4vw, 2.1rem); margin-top: 0.5rem; max-width: 12ch; }
.r-plan { display: grid; gap: 0; }
.r-slot {
  display: grid; grid-template-columns: 6.5rem 1.4rem 1fr; gap: 0 1.1rem;
  padding: 0.95rem 0; border-top: 1px solid var(--line-soft); align-items: start;
}
.r-day-block .r-plan .r-slot:first-child { border-top: none; padding-top: 0; }
.r-slot .r-time {
  font-family: "JetBrains Mono", monospace; font-size: 0.72rem;
  letter-spacing: 0.04em; color: var(--ink); padding-top: 0.18rem; white-space: nowrap;
}
.r-slot .r-rail { display: flex; justify-content: center; padding-top: 0.45rem; }
.r-slot .r-rail .dot { width: 9px; height: 9px; border-radius: 50%; flex: none; border: 1px solid transparent; }
.r-slot .r-body { min-width: 0; }
.r-slot .r-title { font-size: 1.06rem; color: var(--ink); }
.r-slot .r-note { color: var(--muted); font-size: 0.9rem; margin-top: 0.25rem; max-width: 52ch; }
.r-slot .r-tags { display: inline-flex; flex-wrap: wrap; gap: 0.45rem; margin-left: 0.6rem; vertical-align: middle; }
.r-pill {
  font-family: "JetBrains Mono", monospace; font-size: 0.52rem;
  letter-spacing: 0.14em; text-transform: uppercase;
  padding: 0.26em 0.6em; border-radius: 999px; border: 1px solid var(--line);
  color: var(--muted); white-space: nowrap; line-height: 1;
}
.r-pill.opt { color: var(--clay-deep); border-color: color-mix(in oklch, var(--clay) 50%, transparent); }
.r-slot.is-opt .r-title { color: var(--muted); }
/* tag colours */
.tg-travel  { background: oklch(0.62 0.052 48); }
.tg-settle  { background: oklch(0.50 0.055 46); }
.tg-nature  { background: oklch(0.62 0.045 150); }
.tg-active  { background: oklch(0.49 0.045 150); }
.tg-culture { background: oklch(0.58 0.05 80); }
.tg-table   { background: oklch(0.50 0.055 46); }
.tg-spa     { background: oklch(0.66 0.04 200); }
.tg-social  { background: oklch(0.55 0.06 20); }
.tg-free    { background: var(--line); }
.r-rail .dot.b-travel,.r-rail .dot.b-settle,.r-rail .dot.b-nature,.r-rail .dot.b-active,.r-rail .dot.b-culture,.r-rail .dot.b-table,.r-rail .dot.b-spa,.r-rail .dot.b-social { border: none; }
@media (max-width: 760px) {
  .r-day-grid { grid-template-columns: 1fr; gap: 1rem; }
  .r-day-head h3 { max-width: none; }
}
@media (max-width: 480px) {
  .r-slot { grid-template-columns: 5rem 1.1rem 1fr; gap: 0 0.8rem; }
}

/* ---- HOSTS (Reset collection) ---- */
.r-hosts { background: var(--cream); }
.r-hosts-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 1px;
  background: var(--line); border: 1px solid var(--line);
}
.r-host { background: var(--cream); padding: clamp(1.8rem, 3vw, 2.8rem); }
.r-host .r-host-k {
  font-family: "JetBrains Mono", monospace; font-size: 0.6rem;
  letter-spacing: 0.18em; text-transform: uppercase; color: var(--sage-deep);
}
.r-host h3 { font-size: 1.7rem; margin: 0.7rem 0 0.6rem; }
.r-host p { color: var(--muted); font-size: 0.96rem; max-width: 44ch; }
@media (max-width: 700px) { .r-hosts-grid { grid-template-columns: 1fr; } }

/* ---- ADD-ONS (à la carte) ---- */
.r-addons { background: var(--oat); }
.r-addons-list { border-top: 1px solid var(--line); }
.r-addon {
  display: grid; grid-template-columns: 1fr auto; gap: 0.3rem 2.5rem;
  padding: 1.4rem 0; border-bottom: 1px solid var(--line); align-items: baseline;
}
.r-addon .r-addon-n { font-family: var(--serif); font-size: 1.45rem; }
.r-addon .r-addon-p {
  font-family: "JetBrains Mono", monospace; font-size: 0.86rem;
  color: var(--clay-deep); white-space: nowrap;
}
.r-addon .r-addon-x { grid-column: 1 / 2; color: var(--muted); font-size: 0.93rem; max-width: 56ch; }

/* ---- CONNECT FORM block on detail page ---- */
.r-connect { background: var(--cream); }
.r-connect .inquiry-grid { align-items: start; }
.r-connect .r-connect-aside .ph { width: 100%; min-height: 22rem; height: 100%; }

/* ---- next journey / CTA ---- */
.r-cta { position: relative; color: var(--cream); overflow: hidden; min-height: 60svh; display: grid; place-items: center; text-align: center; }
.r-cta .ph { position: absolute; inset: 0; }
.r-cta::before { content: ""; position: absolute; inset: 0; background: oklch(0.205 0.013 60 / 0.62); }
.r-cta .wrap { position: relative; z-index: 2; }
.r-cta h2 { font-size: clamp(2.2rem, 4.6vw, 3.8rem); max-width: 18ch; margin: 1.2rem auto; }