/* V3 site layer — positioning, the decision clock, the hero facts, the vouch.
   Loaded last on every page. Uses the site's own tokens: --serif, --rust, --paper. */

/* ---------- row 4: the positioning line under the mark ---------- */
.journey-eyebrow { margin-bottom: 11px; }

.journey-positioning {
  font-size:var(--type-caption);
  letter-spacing: .13em;
  text-transform: uppercase;
  line-height: 1.7;
  color: #cdd8c6;
  margin: 0 0 25px;
}

@media (max-width: 900px) { .journey-positioning { font-size:var(--type-caption); letter-spacing: .11em; } }
@media (max-width: 620px) { .journey-positioning { font-size:var(--type-caption); margin-bottom: 21px; } }

/* ---------- row 6: the clock, front and centre, with its reason ---------- */
.decision-band {
  display: grid;
  grid-template-columns: minmax(0, auto) minmax(0, 1fr);
  gap: 16px 52px;
  align-items: center;
  padding-block: 26px 28px;
  border-bottom: 1px solid #11291f26;
}

.decision-clock { display: flex; flex-direction: column; gap: 7px; }

.decision-label {
  font-size:var(--type-caption);
  letter-spacing: .15em;
  text-transform: uppercase;
  color: #6f7c6e;
}

.decision-time {
  font:400 var(--type-section)/1 var(--serif);
  letter-spacing: -.025em;
  color: #11291f;
  font-variant-numeric: tabular-nums;
}

.decision-status {
  font-size:var(--type-caption);
  letter-spacing: .11em;
  text-transform: uppercase;
  color: var(--rust);
}

.decision-why {
  margin: 0;
  font-size:var(--type-body);
  line-height: 1.85;
  color: #3c4a3e;
  max-width: 56ch;
}

.decision-why a { color: #11291f; text-underline-offset: 3px; }

@media (max-width: 760px) {
  .decision-band { grid-template-columns: 1fr; gap: 14px; padding-block: 22px 24px; }
  .decision-time { font-size:var(--type-section); }
  .decision-why { font-size:var(--type-body); }
}

/* ---------- rows 5 + 18: the homepage hero facts ---------- */
.movie-facts {
  font-size:var(--type-body);
  line-height: 1.5;
  letter-spacing: .005em;
  color: #f2efe2;
}

.movie-facts span {
  display: block;
  font-size:var(--type-body);
  color: #cbd5c4;
  margin-top: 5px;
}

/* ---------- row 6 on the film: the clock in the response chapter ---------- */
.movie-clock {
  display: flex;
  align-items: baseline;
  gap: 16px;
  flex-wrap: wrap;
  margin: 20px 0 12px;
}

.movie-clock .decision-label { color: #b7c5b2; }

.movie-clock .decision-time {
  font-size:var(--type-section);
  color: #f7f4e8;
}

.movie-clock-why {
  font-size:var(--type-body);
  line-height: 1.85;
  color: #d5ddce;
  max-width: 54ch;
  margin: 0 0 4px;
}

/* ---------- row 24: the vouch, on the page ---------- */
.movie-vouch {
  margin: 28px 0 24px;
  padding-top: 22px;
  border-top: 1px solid #f7f4e838;
}

.movie-vouch > p:last-child {
  font-size:var(--type-body);
  line-height: 1.85;
  color: #dae1d3;
  max-width: 56ch;
  margin: 10px 0 0;
}

/* ---------- row 30: the ceremonies framing line ---------- */
.medicine-framing {
  font:400 var(--type-card)/1.4 var(--serif);
  letter-spacing: -.018em;
  color: #f2efe2;
  max-width: 34ch;
  margin: 8px 0 44px;
  text-wrap: balance;
}

@media (max-width: 620px) { .medicine-framing { font-size:var(--type-card); max-width: none; margin-bottom: 32px; } }

/* ---------- row 5: the facts, at headline size ---------- */
.journey-hero-foot > p:first-child { font-size:var(--type-body); line-height: 1.7; }
.journey-hero-foot > p:first-child > span { font-size:var(--type-body); }

.movie-prices dd { font-size:var(--type-body); letter-spacing: -.01em; }
.movie-prices dt { font-size:var(--type-caption); letter-spacing: .06em; }

@media (max-width: 620px) {
  .journey-hero-foot > p:first-child { font-size:var(--type-body); }
  .journey-hero-foot > p:first-child > span { font-size:var(--type-body); }
  .movie-prices dd { font-size:var(--type-body); }
}

/* ---------- row 20: the week around the medicine, on the film ---------- */
.movie-week-list {
  list-style: none;
  margin: 18px 0 22px;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 7px 10px;
  max-width: 54ch;
}

.movie-week-list li {
  font-size:var(--type-caption);
  letter-spacing: .04em;
  line-height: 1;
  padding: 7px 11px;
  border: 1px solid #f4f1e340;
  color: #e7ecdf;
}

/* ---------- row 23: the standard of care ---------- */
.movie-care { margin: 20px 0 22px; padding-top: 18px; border-top: 1px solid #f7f4e838; }

.movie-care-label {
  font-size:var(--type-caption);
  letter-spacing: .15em;
  text-transform: uppercase;
  color: #b7c5b2;
  margin: 0 0 14px;
}

.movie-care-tiles {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 16px 22px;
  max-width: 660px;
}

.movie-care-tiles h3 {
  font:400 var(--type-card)/1.3 var(--serif);
  color: #f7f4e8;
  margin: 0 0 5px;
  letter-spacing: -.005em;
}

.movie-care-tiles p { font-size:var(--type-body); line-height: 1.7; color: #cdd7c8; margin: 0; }

/* ---------- row 32: around the medicine, on The week ---------- */
.around-section { background: #eceee4; }

.around-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 38px 50px;
  margin-top: 46px;
}

.around-grid h3 {
  font:400 var(--type-card)/1.15 var(--serif);
  letter-spacing: -.02em;
  color: #11291f;
  margin: 0 0 12px;
}

.around-grid p { font-size:var(--type-body); line-height: 1.85; color: #3d4a3f; margin: 0; }

/* ---------- row 29: the second line on each day ---------- */
.tease-second { font-size:var(--type-body); line-height: 1.8; color: #56634f; margin: 9px 0 0; }

/* ---------- row 39: resources ---------- */
.resources-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 34px 48px;
  margin-top: 44px;
}

.resources-grid h3 {
  font-size:var(--type-card);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--rust);
  margin: 0 0 16px;
}

.resources-grid ul { list-style: none; margin: 0; padding: 0; }

.resources-grid li {
  font-size:var(--type-body);
  line-height: 1.6;
  padding: 9px 0;
  border-bottom: 1px solid #11291f1f;
  color: #55624f;
}

.resources-grid a { color: #11291f; text-underline-offset: 3px; }

/* ---------- row 9: the privacy page ---------- */
.privacy-page { max-width: 760px; padding-block: 120px 100px; }
.privacy-page h1 { font:400 var(--type-page)/1.02 var(--serif); letter-spacing: -.035em; margin: 18px 0 0; color: #11291f; }
.privacy-lede { font-size:var(--type-body); line-height: 1.9; color: #3d4a3f; margin: 28px 0 0; max-width: 58ch; }
.privacy-page section { margin-top: 46px; }
.privacy-page h2 { font:400 var(--type-section)/1.2 var(--serif); letter-spacing: -.02em; color: #11291f; margin: 0 0 14px; }
.privacy-page section p { font-size:var(--type-body); line-height: 1.9; color: #3d4a3f; margin: 0; max-width: 62ch; }
.privacy-contact { margin-top: 52px; padding-top: 24px; border-top: 1px solid #11291f26; font-size:var(--type-body); color: #55624f; }

@media (max-width: 620px) { .privacy-page { padding-block: 84px 70px; } }

/* the decision band's link should read as one */
.decision-why a { text-decoration: underline; }

/* ---------- rows 10 + 11: photographs on the Around cards ---------- */
.around-photo { margin: 0 0 20px; overflow: hidden; }

.around-photo img {
  display: block;
  width: 100%;
  height: 100%;
  aspect-ratio: 3 / 2;
  object-fit: cover;
}

.photo-placeholder {
  aspect-ratio: 3 / 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 7px;
  background: #dfe3d6;
  border: 1px dashed #11291f45;
  color: #55624f;
  text-align: center;
  padding: 16px;
}

.photo-placeholder span {
  font-size:var(--type-caption);
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--rust);
}

.photo-placeholder small { font-size:var(--type-caption); color: #56634f; }

/* ---------- row 11b: the travel band ---------- */
.travel-band { margin: 0; position: relative; }

.travel-band img {
  display: block;
  width: 100%;
  height: clamp(280px, 42vh, 480px);
  object-fit: cover;
}

.travel-band figcaption {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: #11291fd9;
  color: #e6ecdd;
  font-size:var(--type-caption);
  letter-spacing: .07em;
  padding: 10px 16px;
}

/* ---------- structure fixes: even columns, no orphan cards ---------- */

/* The seven days: was 3 cards then 4, at two different widths, with images of
   different heights. One grid, one card width, one image ratio. */
.day-teases {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 54px 32px;
}

.day-tease,
.day-tease:nth-child(n+4) { grid-column: auto; }

.day-tease {
  display: flex;
  flex-direction: column;
  padding-bottom: 26px;
}

.day-tease .tease-image { margin-bottom: 22px; overflow: hidden; }

.day-tease .tease-image img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 3 / 2;
  object-fit: cover;
}

.day-tease .tease-copy { display: flex; flex-direction: column; }
.day-tease .tease-copy h3 { margin-top: .35rem; }

/* Around the medicine: six parts, so three across reads as two full rows */
.around-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 46px 46px; }

/* After the week: four parts, four columns, nothing left alone on a second row */
.page-experience .return-section .return-parts {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 38px 40px;
}

@media (max-width: 1100px) {
  .day-teases { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 46px 28px; }
  .around-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px; }
  .page-experience .return-section .return-parts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  .day-teases { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 38px 22px; }
  .around-grid { grid-template-columns: 1fr; gap: 34px; }
  .page-experience .return-section .return-parts { grid-template-columns: 1fr; gap: 30px; }
}

@media (max-width: 520px) {
  .day-teases { grid-template-columns: 1fr; gap: 34px; }
}

/* the last-child span rule from the old layout must not come back */
.day-tease:last-child { grid-column: auto; display: flex; }

/* ---------- row 19: the Mission, under the hero ---------- */
.movie-mission { margin: 22px 0 6px; padding-top: 18px; border-top: 1px solid #f7f4e838; max-width: 56ch; }
.movie-mission-kicker { font-size:var(--type-caption); letter-spacing: .15em; text-transform: uppercase; color: #b7c5b2; margin: 0 0 10px; }
.movie-mission p:last-child { font-size:var(--type-body); line-height: 1.85; color: #dae1d3; margin: 0; }

/* ---------- row 31: the standing line under the ceremonies ---------- */
.medicine-standing { font-size:var(--type-body); letter-spacing: .01em; line-height: 1.8; color: #cfd9c9; margin: 0 0 12px; max-width: 62ch; }

/* ---------- rows 21 + 36: the farm and kitchen passage ---------- */
.package-farm { font-size:var(--type-body); line-height: 1.85; color: #3d4a3f; margin: 14px 0 22px; max-width: 58ch; }