/* Responsive corrections shared by every generated page. Keep after design.css. */
:root { --page-gutter: clamp(1.25rem, 5vw, 5rem); }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { overflow-wrap: anywhere; }
img, iframe { max-width: 100%; }
img { height: auto; }
[hidden] { display: none !important; }
main, section, article, form, .header-actions, .care-copy,
.service-hero > *, .reading > *, .quiet-cta > *, .portrait-intro > *,
.contact-layout > *, .blog-entry > *, .original-topic > * { min-width: 0; }
.service-hero, .reading, .quiet-cta, .portrait-intro, .contact-layout {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.button, .text-link { max-width: 100%; white-space: normal; }
.button span, .text-link span { flex-shrink: 0; }
input, select, textarea { min-width: 0; max-width: 100%; font-size: 1rem; }
input:user-invalid, textarea:user-invalid { border-bottom-color: #9d3030; }
:focus-visible { outline: 3px solid #587e8b; outline-offset: 4px; }
.topbar { height: auto; min-height: 68px; gap: 12px; padding-left: max(20px, env(safe-area-inset-left)); }
.wordmark { min-width: 0; }
.header-actions { align-self: stretch; flex-shrink: 0; }
.languages { gap: 0; }
.languages a { min-width: 44px; min-height: 44px; display: grid; place-items: center; padding: 8px; }
/* The menu button fills the full height of the bar: no white strip above the next section. */
.menu-toggle { min-width: 48px; min-height: 68px; height: auto; padding-right: max(20px, env(safe-area-inset-right)); }
.header-contact, .footer-nav a, .footer-bottom a, .footer-contact a,
.main-nav a, .back-link, .menu-bottom a, .map-caption > a { min-height: 44px; display: inline-flex; align-items: center; }
.footer-top { flex-wrap: wrap; }
.footer-brand { flex-shrink: 0; }
.footer-bottom { flex-wrap: wrap; }
footer { padding-bottom: max(28px, env(safe-area-inset-bottom)); }

/* Normal-flow content prevents overlaps when text wraps or is enlarged. */
.hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 480px);
  grid-template-rows: auto 1fr auto;
  gap: 32px;
  padding: 28px var(--page-gutter) 40px;
  height: auto; min-height: 710px; min-height: max(710px, calc(100svh - 68px)); max-height: none;
}
.hero-monogram { position: relative; left: auto; top: auto; transform: none; grid-column: 1 / -1; grid-row: 1; justify-self: center; }
.hero h1 { position: relative; inset: auto; width: auto; grid-column: 1 / -1; grid-row: 2; align-self: end; padding: 64px 0 12px; }
.hero-promo { position: relative; inset: auto; width: 100%; grid-column: 2; grid-row: 3; align-self: end; }
.hero-promo img { width: 30%; height: auto; flex-shrink: 0; object-fit: cover; }
.hero-promo .promo-message { min-width: 0; }
.hero-booking { position: relative; inset: auto; grid-column: 1; grid-row: 3; align-self: end; justify-self: start; max-width: 100%; }
.hero-booking > a { flex-shrink: 0; }
.hero-booking > div { min-width: 0; }
.hero-nav { inset: 28px var(--page-gutter) auto; }
.hero-nav a { min-height: 44px; display: inline-flex; align-items: center; }
.hero-nav > div:first-child { max-width: calc(50% - 120px); flex-wrap: wrap; gap: 8px 20px; }
.hero-nav > div:last-child { max-width: calc(50% - 120px); flex-wrap: wrap; justify-content: end; gap: 8px 20px; }
.topics-photo .topic-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.topics-photo .original-topic { width: auto; min-width: 0; margin-left: 0; }
.topics-photo .topic-plant { flex-shrink: 0; }
.care-photo { width: 50%; }
.care-copy { flex: 1; }
.immersive-heading { height: auto; min-height: 690px; }
.immersive-heading > div { min-width: 0; }
.blog-body table { display: block; max-width: 100%; overflow-x: auto; }
.blog-body pre { white-space: pre-wrap; overflow-wrap: anywhere; }

/* Dialogs remain scrollable with mobile browser chrome and the on-screen keyboard. */
dialog:not([open]) { display: none; }
#site-menu {
  position: fixed; inset: 0; height: 100vh; max-height: 100vh;
  height: 100dvh; max-height: 100dvh;
  overscroll-behavior: contain;
  padding-top: max(80px, env(safe-area-inset-top));
  padding-left: max(24px, env(safe-area-inset-left));
  padding-right: max(24px, env(safe-area-inset-right));
  padding-bottom: max(35px, env(safe-area-inset-bottom));
}
#site-menu, .lightbox { z-index: 100; }
.close-menu { min-width: 48px; min-height: 48px; top: max(16px, env(safe-area-inset-top)); right: max(16px, env(safe-area-inset-right)); }
.main-nav { max-width: 1200px; margin-inline: auto; }
.main-nav a { line-height: 1.3; }
.lightbox {
  width: min(1100px, calc(100% - 32px)); max-width: calc(100% - 32px);
  max-height: calc(100vh - 32px); max-height: calc(100dvh - 32px);
  overflow: auto; overscroll-behavior: contain;
}
.lightbox > img { width: 100%; max-width: 100%; max-height: 72vh; max-height: 72dvh; min-height: 120px; }
.lightbox-close { position: sticky; display: block; top: 8px; margin: 8px 8px 8px auto; width: 48px; height: 48px; z-index: 1; }
.lightbox .photo-status { padding: 12px 24px; }
.lightbox .photo-status:empty { display: none; }
.no-script-nav { padding: 16px var(--page-gutter); display: flex; flex-wrap: wrap; gap: 12px 24px; }
.no-script-nav a { text-decoration: underline; min-height: 44px; }
.gallery-photo { color: inherit; }
.media-error { background: #edf0ed; object-fit: contain; font-size: 1rem; }

@media (max-width: 1199px) {
  .wordmark small { display: none; }
  .hero-nav { display: none; }
  .topics-photo .topic-0 { display: block; }
  .topics-photo .topic-plant { float: left; margin: 0 16px 8px 0; }
}
@media (max-width: 900px) {
  .hero { grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr); gap: 28px; }
  .hero-booking > div { display: none; }
  .hero-booking > a { width: auto; flex-direction: row; align-items: center; gap: 20px; }
  .topics-photo .topic-row { grid-template-columns: minmax(0, 1fr); }
  .topics-photo .original-topic + .original-topic { border-top: 0; }
  .contact-layout { grid-template-columns: minmax(0, 1fr); gap: 48px; }
  .contact-information img { display: none; }
  .contact-layout form { max-width: none; }
}
@media (max-width: 700px) {
  .service-hero { display: flex; flex-direction: column-reverse; }
  .service-hero > img { min-height: 0; height: clamp(220px, 65vw, 420px); }
  .service-hero > div { padding: 32px 24px; }
  .reading, .quiet-cta, .portrait-intro { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .care-editorial, .care-editorial.reverse { display: block; padding-inline: 24px; }
  .care-photo, .care-editorial.reverse .care-photo { display: block; width: 100%; }
  .care-photo img, .care-editorial.reverse img { height: clamp(260px, 85vw, 480px); }
  .care-copy { max-width: none; padding-top: 28px; }
  .hero { display: flex; flex-direction: column; gap: 24px; min-height: 680px; min-height: max(680px, calc(100svh - 64px)); padding: 28px 24px; }
  .hero-monogram { align-self: center; font-size: 34px; }
  .hero h1 { align-self: stretch; text-align: left; font-size: clamp(2rem, 7.8vw, 3rem); margin-top: auto; padding: 64px 0 0; }
  .hero-promo { align-self: stretch; min-height: 130px; }
  .hero-promo .promo-message { padding: 18px; font-size: 1.125rem; }
  .promo-action { font-size: .75rem; letter-spacing: .8px; }
  .hero-booking { align-self: start; }
  .hero-booking > a { font-size: .75rem; }
  .immersive-heading { min-height: 560px; }
  .immersive-heading h1 { font-size: clamp(2.5rem, 10vw, 3.625rem); }
}
@media (max-width: 600px) {
  .header-contact { display: none; }
  .topbar { min-height: 64px; padding-left: max(12px, env(safe-area-inset-left)); gap: 4px; }
  .wordmark { font-size: .625rem; letter-spacing: .5px; white-space: normal; }
  .wordmark > span { max-width: 150px; }
  .header-actions { gap: 4px; }
  .menu-toggle { min-height: 64px; padding: 0 max(12px, env(safe-area-inset-right)) 0 12px; }
  .languages a { font-size: .75rem; }
  .page-title h1, .contact-heading h1, .portrait-intro h1 { font-size: clamp(2.375rem, 10vw, 3.5rem); }
  .service-hero h1 { font-size: clamp(2rem, 9vw, 2.6875rem); }
  .home-care .page-title h2 { font-size: clamp(2rem, 9vw, 2.75rem); }
  .blog-post-heading h1 { font-size: clamp(2rem, 8vw, 2.375rem); }
  .topics-photo .original-topic { font-size: 1rem; }
  .topics-photo .topic-plant { margin-right: 12px; }
  .text-link { font-size: .75rem; letter-spacing: 1px; gap: 16px; }
  .contact-information { margin-bottom: 0; }
  .contact-layout form { margin-top: 48px; }
  .contact-information .phone { font-size: clamp(1.375rem, 7vw, 1.8125rem); }
  .footer-top > p { max-width: none; }
  .destination > img, .practice-destination > img { height: clamp(360px, 105vw, 480px); }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}
@media (forced-colors: active) {
  .button, .menu-toggle, .gallery-photo, .lightbox-close { border: 1px solid ButtonText; }
}
