.interior-page.ritual-editorial { background: #f3eee5; }
.interior-page.ritual-editorial .treatment-intro {
  padding: 34px 40px 30px;
  background: #f3eee5;
  border: 0;
}

.ritual-intro-inner { max-width: 1120px; margin-inline: auto; }
.interior-page.ritual-editorial .ritual-kicker { margin: 0 0 12px; color: #8a6942; font-size: 10px; letter-spacing: 2px; }
.interior-page.ritual-editorial .treatment-intro h1 { max-width: 900px; margin: 0; font-size: clamp(44px, 4.7vw, 64px); line-height: 1.04; letter-spacing: -1px; }
.interior-page.ritual-editorial .treatment-intro h1 em { color: #8a6942; }
.interior-page.ritual-editorial .ritual-intro-text { max-width: 660px; margin: 17px 0 0; color: #665e51; font-size: 14px; line-height: 1.8; }
.interior-page.ritual-editorial .ritual-intro-note { margin: 8px 0 0; color: #7e6a4e; font-size: 12px; line-height: 1.7; }
.interior-page.ritual-editorial .massage-collection { max-width: 1200px; margin: 0 auto; padding: 0 40px 52px; background: #f3eee5; }
.interior-page.ritual-editorial .massage-heading { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin: 0 0 20px; padding: 0; }
.interior-page.ritual-editorial .massage-count { margin: 0; color: #7c6c55; font-size: 11px; letter-spacing: 1px; }
.interior-page.ritual-editorial .massage-other { display: inline-flex; align-items: center; gap: 14px; min-height: 44px; margin: 0; padding: 0; color: #735531; font-size: 12px; border: 0; text-decoration: underline; text-underline-offset: 5px; }
.interior-page.ritual-editorial .massage-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  columns: auto;
  gap: 28px;
  align-items: stretch;
}
.interior-page.ritual-editorial .massage-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  width: auto;
  margin: 0;
  padding: 0;
  overflow: hidden;
  break-inside: auto;
  border: 1px solid #dfd3bf;
  border-radius: 4px;
  background: #fcf9f2;
  box-shadow: 0 5px 20px rgb(65 49 27 / 3%);
}
.ritual-photo { position: relative; flex-shrink: 0; height: 225px; margin: 0; overflow: hidden; background: #263b30; }
.ritual-photo > img { display: block; width: 100%; height: 100%; object-fit: cover; }
.massage-card[data-care-family="Pack évasion"] .ritual-photo > img,
.massage-card[data-care-family="Signature grande évasion"] .ritual-photo > img { object-position: 50% 85%; }
.ritual-number { position: absolute; top: 16px; left: 18px; display: grid; place-items: center; width: 32px; height: 32px; color: #f8efdd; background: rgb(25 35 28 / 80%); border: 1px solid rgb(235 211 168 / 70%); border-radius: 50%; font-size: 10px; letter-spacing: 1px; }
.ritual-audience { position: absolute; right: 16px; bottom: 16px; padding: 6px 12px; color: #4f422e; background: #f8f0df; font-size: 10px; letter-spacing: .7px; }
.ritual-body { display: flex; flex: 1; flex-direction: column; min-width: 0; padding: 25px 27px 26px; }
.interior-page.ritual-editorial .ritual-card-heading { margin: 0; padding: 0; }
.interior-page.ritual-editorial .massage-card h3 { margin: 0; font-size: 35px; line-height: 1.08; letter-spacing: -.5px; color: #292920; }
.interior-page.ritual-editorial .massage-subtitle { margin: 9px 0 0; color: #817158; font-size: 12px; line-height: 1.65; }
.interior-page.ritual-editorial .massage-formulas { display: flex; flex: 1; flex-direction: column; margin: 0; padding: 0; border: 0; list-style: none; }
.interior-page.ritual-editorial .massage-formulas > li { display: flex; flex: 1; flex-direction: column; align-items: stretch; gap: 0; min-width: 0; margin: 0; padding: 0; border: 0; }
.ritual-practical { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin: 19px 0; padding: 13px 0; border-top: 1px solid #ded0b9; border-bottom: 1px solid #ded0b9; }
.interior-page.ritual-editorial .massage-duration { display: block; margin: 0; padding: 0; color: #655a48; font-size: 13px; }
.interior-page.ritual-editorial .care-duration-meta { display: block; margin: 0; }
.interior-page.ritual-editorial .massage-price { margin: 0; font-family: 'Cormorant Garamond', Georgia, serif; font-size: 37px; font-weight: 400; line-height: 1.1; white-space: nowrap; color: #846034; }
.ritual-journey { display: flex; flex-wrap: wrap; gap: 8px 13px; margin: 0 0 19px; padding: 0 0 16px; border-bottom: 1px solid #e9dfce; list-style: none; }
.interior-page.ritual-editorial .ritual-journey > li { display: flex; align-items: baseline; gap: 7px; margin: 0; padding: 0; border: 0; color: #555d48; font-size: 11px; line-height: 1.65; }
.ritual-journey > li > span { color: #a68a5d; font-size: 9px; }
.interior-page.ritual-editorial .massage-descriptions { display: block; margin: 0; padding: 0; }
.interior-page.ritual-editorial .care-description { margin: 0; color: #696253; }
.interior-page.ritual-editorial .care-description p { margin: 0 0 12px; color: #696253; font-size: 13px; line-height: 1.85; }
.interior-page.ritual-editorial .care-description p:last-child { margin-bottom: 0; }
.interior-page.ritual-editorial .massage-steps { display: block; margin: 0 0 12px; padding-left: 17px; list-style: disc; }
.interior-page.ritual-editorial .massage-steps > li { display: list-item; margin: 0 0 7px; padding: 0; border: 0; color: #696253; font-size: 13px; line-height: 1.85; }
.interior-page.ritual-editorial .massage-duration-note { margin: 16px 0 0; padding: 9px 0 9px 12px; border-left: 2px solid #c5ae86; color: #7b6b54; font-size: 11px; line-height: 1.75; }
.ritual-booking { display: flex; justify-content: flex-end; margin-top: auto; padding-top: 23px; }
.interior-page.ritual-editorial .massage-book { display: inline-flex; align-items: center; justify-content: center; gap: 16px; min-height: 46px; margin: 0; padding: 11px 19px; color: #f8f2e6; background: #273c30; border: 1px solid #273c30; border-radius: 2px; font-size: 12px; }
.interior-page.ritual-editorial .massage-book:hover { background: #41513d; border-color: #41513d; }
.interior-page.ritual-editorial .massage-book:focus-visible, .interior-page.ritual-editorial .massage-other:focus-visible { outline: 2px solid #9e7947; outline-offset: 4px; }
.interior-page.ritual-editorial .massage-card:last-child { display: grid; grid-column: 1 / -1; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); }
.interior-page.ritual-editorial .massage-card:last-child .ritual-photo { height: 100%; min-height: 350px; }
.interior-page.ritual-editorial .massage-card:last-child .ritual-body { padding: 30px; }
.interior-page.ritual-editorial .massage-card[data-selected] { outline: 2px solid #a98456; outline-offset: 4px; }
@media (max-width: 1060px) {
  .interior-page.ritual-editorial .massage-collection { padding-inline: 28px; }
  .interior-page.ritual-editorial .treatment-intro { padding-inline: 28px; }
  .ritual-photo { height: 205px; }
  .ritual-body { padding: 22px; }
  .interior-page.ritual-editorial .massage-card h3 { font-size: 31px; }
}
@media (max-width: 760px) {
  .interior-page.ritual-editorial .treatment-intro { padding: 25px 6% 20px; }
  .interior-page.ritual-editorial .treatment-intro h1 { font-size: clamp(36px, 9vw, 48px); letter-spacing: -.6px; }
  .interior-page.ritual-editorial .ritual-kicker { font-size: 8px; letter-spacing: 1.5px; }
  .interior-page.ritual-editorial .ritual-intro-text { margin-top: 13px; font-size: 13px; }
  .interior-page.ritual-editorial .ritual-intro-note { font-size: 11px; }
  .interior-page.ritual-editorial .massage-collection { padding: 0 6% 35px; }
  .interior-page.ritual-editorial .massage-heading { gap: 12px; margin-bottom: 15px; }
  .interior-page.ritual-editorial .massage-count { font-size: 10px; letter-spacing: .2px; }
  .interior-page.ritual-editorial .massage-other { font-size: 11px; gap: 8px; }
  .interior-page.ritual-editorial .massage-grid { grid-template-columns: minmax(0, 1fr); gap: 22px; }
  .ritual-photo { height: 180px; }
  .ritual-body { padding: 22px 20px; }
  .interior-page.ritual-editorial .massage-card h3 { font-size: 32px; }
  .interior-page.ritual-editorial .massage-subtitle { margin-top: 7px; }
  .ritual-practical { margin-block: 16px; }
  .interior-page.ritual-editorial .massage-price { font-size: 35px; }
  .interior-page.ritual-editorial .massage-book { width: 100%; }
  .interior-page.ritual-editorial .massage-card:last-child { display: flex; grid-column: auto; }
  .interior-page.ritual-editorial .massage-card:last-child .ritual-photo { height: 180px; min-height: 0; }
  .interior-page.ritual-editorial .massage-card:last-child .ritual-body { padding: 22px 20px; }
}

/* Compact cards: retain every current type size and all treatment content. */
.interior-page.ritual-editorial .massage-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.interior-page.ritual-editorial .ritual-photo,
.interior-page.ritual-editorial .massage-card:last-child .ritual-photo { height: 120px; min-height: 0; }
.interior-page.ritual-editorial .ritual-body,
.interior-page.ritual-editorial .massage-card:last-child .ritual-body { padding: 18px; }
.interior-page.ritual-editorial .massage-card:last-child { display: flex; grid-column: auto; grid-template-columns: none; }
.interior-page.ritual-editorial .ritual-practical { margin-block: 12px; padding-block: 9px; }
.interior-page.ritual-editorial .ritual-journey { gap: 5px 9px; margin-bottom: 12px; padding-bottom: 10px; }
.interior-page.ritual-editorial .ritual-booking { padding-top: 14px; }
@media (min-width: 761px) {
  @supports (grid-template-rows: subgrid) {
    .interior-page.ritual-editorial .massage-card,
    .interior-page.ritual-editorial .massage-card:last-child {
      display: grid; grid-template-rows: subgrid; grid-row: span 3; row-gap: 0;
    }
    .interior-page.ritual-editorial .ritual-body,
    .interior-page.ritual-editorial .massage-card:last-child .ritual-body { display: contents; }
    .interior-page.ritual-editorial .massage-card .ritual-card-heading { margin: 16px 18px 0; }
    .interior-page.ritual-editorial .massage-formulas { margin: 0 18px 18px; }
  }
}
@media (min-width: 761px) and (max-width: 1060px) {
  .interior-page.ritual-editorial .massage-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .interior-page.ritual-editorial .massage-grid { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .interior-page.ritual-editorial .ritual-photo,
  .interior-page.ritual-editorial .massage-card:last-child .ritual-photo { height: 110px; }
}
