/* FootCare extends the existing package, disclosure, and booking components. */
.footcare .footcare-heading { grid-column: 2; grid-row: 1; }
.footcare-heading .eyebrow { margin-bottom: 9px; }
.footcare .footcare-tagline { margin: 10px 0 0; font-size: 14px; color: var(--text); }
.footcare .footcare-booking { grid-column: 4; grid-row: 1; align-self: center; text-align: right; }
.footcare .footcare-meta { margin: 0 0 12px; font-size: 13px; font-weight: 700; white-space: nowrap; }
.footcare .footcare-details { grid-column: 2 / -1; grid-row: 2; }
.footcare-expanded { display: grid; grid-template-columns: 1.2fr 1fr; gap: 34px; margin-top: 24px; }
.footcare-story p { margin: 0 0 16px; font-size: 15px; line-height: 1.7; }
.footcare-story p:last-child { margin-bottom: 0; }
.footcare-inclusions h4 { margin: 0; }
.footcare .footcare-inclusions ul { grid-template-columns: 1fr; gap: 9px; margin-top: 14px; }
.footcare .footcare-disclaimer { margin: 24px 0 0; padding-top: 16px; border-top: 1px solid rgba(246, 216, 164, .25); font-size: 13px; line-height: 1.6; color: #c5d5cd; }
.footcare:has(details[open]):before { background: linear-gradient(90deg, rgba(13, 42, 45, .98), rgba(13, 42, 45, .9) 53%, rgba(13, 42, 45, .82)); }
.footcare:has(details[open]) .eyebrow { color: #efc184; }
.footcare:has(details[open]) .footcare-tagline, .footcare:has(details[open]) .footcare-story { color: #e6f0eb; }
.footcare:has(details[open]) .button { border-color: #efc184; color: #fffaf1; }
.footcare:has(details[open]) .button:hover, .footcare:has(details[open]) .button:focus-visible { background: #925536; }

@media (max-width: 980px) {
  .footcare .footcare-booking { grid-column: 3; grid-row: 1; }
  .footcare > .footcare-summary { grid-column: 2 / -1; grid-row: 2; }
  .footcare .footcare-details { grid-column: 2 / -1; grid-row: 3; }
}
@media (max-width: 640px) {
  .footcare .footcare-booking { grid-column: 2; grid-row: 2; justify-self: start; margin-top: 6px; text-align: left; }
  .footcare > .footcare-summary { grid-column: 2; grid-row: 3; margin-top: 6px; }
  .footcare .footcare-details { grid-column: 2; grid-row: 4; margin-top: 6px; }
  .footcare-expanded { grid-template-columns: 1fr; gap: 24px; }
  .footcare-story p { font-size: 14px; }
  .footcare .footcare-inclusions ul { font-size: 14px; }
  .footcare:has(details[open]) .footcare-details { grid-column: 1 / -1; }
  .footcare:has(details[open]) .footcare-details > summary { margin-left: 48px; }
}
