/* Scoped service layout; navigation, footer and other service pages are unchanged. */
.service-landing[data-service-detail] { max-width: none; margin: 0; padding-top: 90px; background: #80685b; color: #504843; }
.service-landing { --sl-ink: #55423b; --sl-muted: #776e67; --sl-accent: #80685b; --sl-pale: #f7f4f1; }
.service-landing [hidden] { display: none !important; }
.service-landing .sl-section { padding: 42px 0; background: #fff; }
.service-landing h1 { margin: 0 0 20px; color: var(--sl-ink); font-size: clamp(32px, 3.2vw, 48px); line-height: 1.16; }
.service-landing h2 { margin: 0 0 24px; color: var(--sl-ink); font: 400 clamp(25px, 2.3vw, 34px)/1.22 'Poppins', sans-serif; }
.service-landing h3 { margin: 0 0 10px; color: var(--sl-ink); font: 400 18px/1.4 'Poppins', sans-serif; }
.service-landing h4 { margin: 0 0 12px; font: 400 16px/1.4 'Poppins', sans-serif; color: var(--sl-ink); }
.service-landing p, .service-landing li { font: 400 14px/1.65 'Poppins', sans-serif; }
.service-landing p { margin: 0 0 16px; }
.service-landing .sl-eyebrow { margin: 0 0 8px; color: var(--sl-accent); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; }
.service-landing .sl-icon { display: block; width: 56px; height: 56px; flex: 0 0 56px; object-fit: contain; }
.service-landing .sl-photo { position: relative; margin: 0; min-width: 0; aspect-ratio: 4 / 3; overflow: hidden; background: #ede5dc; }
.service-landing .sl-photo > img { display: block; width: 100%; height: 100%; object-fit: cover; }
.service-landing .sl-photo--pending { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 20px; padding: 32px; background: linear-gradient(135deg, #f8f4ef, #e7dace); }
.service-landing .sl-photo--pending > .sl-icon { width: 80px; height: 80px; flex-basis: 80px; }
.service-landing .sl-photo--pending figcaption { max-width: 240px; color: #80685b; text-align: center; font: 400 13px/1.6 'Poppins', sans-serif; }
.service-landing .sl-hero { padding: 0; background: var(--sl-pale); }
.service-landing .sl-hero-grid { display: grid; grid-template-columns: 1.05fr 1fr; align-items: stretch; }
.service-landing .sl-hero-copy { position: relative; z-index: 1; padding: 54px 36px 38px 0; }
.service-landing .sl-lead { font-size: clamp(18px, 1.8vw, 24px); line-height: 1.4; color: var(--sl-ink); margin-bottom: 16px; }
.service-landing .sl-intro { max-width: 550px; font-size: 15px; }
.service-landing .sl-hero-photo { aspect-ratio: auto; min-height: 420px; }
.service-landing .sl-hero-photo:after { content: ''; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg, #f7f4f1, transparent 25%); }
.service-landing .sl-booking { margin: 8px 0 0; padding: 13px 23px; border-radius: 3px; background: var(--sl-accent); font-size: 13px; }
.service-landing .sl-booking:hover { background: #695245; }
.service-landing .sl-highlights { display: flex; flex-wrap: wrap; gap: 18px; margin: 26px 0 0; padding: 0; list-style: none; }
.service-landing .sl-highlights li { display: flex; align-items: center; gap: 10px; margin: 0; flex: 1 1 125px; font-size: 11px; line-height: 1.5; }
.service-landing .sl-highlights .sl-icon { width: 30px; height: 30px; flex-basis: 30px; }
.service-landing .sl-scope { background: #faf8f6; }
.service-landing .sl-areas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.service-landing .sl-area { display: grid; grid-template-columns: 56px 1fr; gap: 8px 18px; padding: 24px; background: #fff; border: 1px solid #eee7e0; border-radius: 5px; }
.service-landing .sl-area h3 { align-self: center; margin: 0; }
.service-landing .sl-area > p { grid-column: 1 / -1; margin: 8px 0; color: var(--sl-muted); }
.service-landing .sl-area-toggle { grid-column: 1 / -1; align-self: end; display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 44px; padding: 0; border: 0; background: none; color: var(--sl-accent); font: 400 12px/1.4 'Poppins', sans-serif; cursor: pointer; text-align: left; }
.service-landing .sl-circle { display: grid; place-items: center; width: 30px; height: 30px; border: 1px solid #d9c7b9; border-radius: 50%; font-size: 20px; }
.service-landing .sl-area-toggle[aria-expanded=true] .sl-circle { background: #80685b; color: #fff; }
.service-landing .sl-area-panel { grid-column: 1 / -1; padding: 26px; background: #fff; border: 1px solid #e6dbd2; border-radius: 5px; }
.service-landing .sl-procedure-groups { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 24px; margin-top: 22px; }
.service-landing ul:not(.sl-highlights) { margin: 0 0 12px; padding-left: 20px; list-style: disc; }
.service-landing li + li { margin-top: 8px; }
.service-landing .sl-text-link { display: inline-block; padding: 10px 0; color: #765b4b; font: 400 12px/1.5 'Poppins', sans-serif; text-decoration: underline; text-underline-offset: 4px; }
.service-landing .sl-comfort { background: var(--sl-pale); }
.service-landing .sl-comfort-grid { display: grid; grid-template-columns: 1.1fr 1fr; align-items: center; gap: 48px; }
.service-landing .sl-comfort .sl-photo { max-height: 280px; width: 100%; }
.service-landing .sl-comfort-grid--motto { grid-template-columns: 1.15fr .55fr 1.3fr; gap: 24px; }
.service-landing .sl-comfort-motto { margin: 0; text-align: center; white-space: pre-line; font-family: 'Segoe Print', 'Bradley Hand', cursive; font-style: italic; font-size: clamp(22px, 2vw, 30px); line-height: 1.7; color: #80634f; transform: rotate(-5deg); }
@media (min-width: 768px) and (max-width: 1199px) {
  .service-landing .sl-comfort-grid--motto { grid-template-columns: 1fr 1fr; }
  .service-landing .sl-comfort-grid--motto .sl-comfort-motto { grid-column: 1; padding-bottom: 16px; }
  .service-landing .sl-comfort-grid--motto .sl-photo { grid-column: 2; grid-row: 1 / 3; }
}
.service-landing .sl-reassurance { display: flex; align-items: center; gap: 16px; background: #ece5df; padding: 18px; margin: 22px 0 0; border-radius: 4px; }
.service-landing .sl-reassurance .sl-icon { width: 36px; height: 36px; flex-basis: 36px; }
.service-landing .sl-process { display: grid; grid-template-columns: 1.7fr 1fr; gap: 36px; align-items: start; }
.service-landing .sl-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; list-style: none; padding: 0; margin: 0; }
.service-landing .sl-steps li { display: flex; gap: 14px; margin: 0; }
.service-landing .sl-step-number { color: var(--sl-accent); font: 400 32px/1.15 'Poppins', sans-serif; }
.service-landing .sl-steps h3 { font-size: 15px; }
.service-landing .sl-steps p { font-size: 12px; color: var(--sl-muted); }
.service-landing .sl-accordion { border-bottom: 1px solid #e5ddd6; }
.service-landing .sl-accordion h3 { margin: 0; }
.service-landing .sl-toggle { display: flex; align-items: center; justify-content: space-between; gap: 20px; width: 100%; min-height: 48px; padding: 13px 0; background: transparent; border: 0; color: var(--sl-ink); text-align: left; font: 400 13px/1.5 'Poppins', sans-serif; cursor: pointer; }
.service-landing .sl-mark { flex: 0 0 18px; font-size: 21px; color: var(--sl-accent); }
.service-landing .sl-answer { padding: 0 0 18px; }
.service-landing .sl-answer p, .service-landing .sl-answer li { font-size: 13px; }
.service-landing .sl-diagnostic-photo { max-width: 320px; margin-top: 16px; }
.service-landing .sl-space { padding: 0; background: #f7f4f1; }
.service-landing .sl-space-grid { display: grid; grid-template-columns: 1fr .9fr 1fr; align-items: stretch; }
.service-landing .sl-space-grid .sl-photo { aspect-ratio: auto; min-height: 290px; }
.service-landing .sl-space-grid .sl-waiting-photo > img { position: absolute; inset: 0; }
.service-landing .sl-space-copy { padding: 34px 26px; align-self: center; }
.service-landing .sl-team-faq { display: grid; grid-template-columns: 1.5fr 1fr; gap: 48px; align-items: start; }
.service-landing .sl-team { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.service-landing .sl-doctor { display: block; color: var(--sl-ink); }
.service-landing .sl-doctor .sl-photo { aspect-ratio: 4 / 5; margin-bottom: 14px; }
.service-landing .sl-doctor h3 { font-size: 14px; line-height: 1.5; margin-bottom: 5px; }
.service-landing .sl-qualification { font-size: 11px; line-height: 1.55; color: var(--sl-muted); margin: 0; }
.service-landing .sl-more-faq { margin: 16px 0 0; min-height: 44px; padding: 0; border: 0; background: none; color: var(--sl-accent); text-decoration: underline; text-underline-offset: 4px; font: 400 13px/1.5 'Poppins', sans-serif; cursor: pointer; }
.service-landing .sl-closing { background: #80685b; color: #fff; }
.service-landing .sl-closing-grid { display: grid; grid-template-columns: 1.5fr auto auto; align-items: center; gap: 40px; }
.service-landing .sl-closing h2 { color: #fff; font-size: 25px; margin-bottom: 12px; }
.service-landing .sl-closing p { margin: 0; }
.service-landing .sl-phone { color: #fff; font: 400 28px/1.3 'Poppins', sans-serif; white-space: nowrap; }
.service-landing .sl-closing .sl-booking { background: #fff; color: #6f584c; margin: 0; }
.service-landing a:focus-visible, .service-landing button:focus-visible { outline: 3px solid #80685b; outline-offset: 4px; }
.service-landing .sl-closing a:focus-visible { outline-color: #fff; }
@media (max-width: 1199px) {
  .service-landing .sl-team-faq { grid-template-columns: 1fr 1fr; gap: 28px; }
  .service-landing .sl-area { padding: 18px; gap: 10px; }
  .service-landing .sl-closing-grid { grid-template-columns: 1fr auto; gap: 24px; }
  .service-landing .sl-closing-grid > div { grid-column: 1 / -1; }
}
@media (max-width: 991px) {
  .service-landing[data-service-detail] { padding-top: 64px; }
  .service-landing .sl-hero-copy { padding: 36px 24px 30px 0; }
  .service-landing .sl-process, .service-landing .sl-team-faq { grid-template-columns: 1fr; }
  .service-landing .sl-comfort-grid { gap: 24px; }
  .service-landing .sl-space-grid { grid-template-columns: 1fr 1fr; }
  .service-landing .sl-space-copy { grid-column: 1 / -1; grid-row: 1; padding: 28px 0; }
  .service-landing .sl-space-grid .sl-photo { aspect-ratio: 4 / 3; min-height: 0; }
  .service-landing .sl-space h2 { margin-bottom: 12px; }
}
@media (max-width: 767px) {
  .service-landing .sl-section { padding: 30px 0; }
  .service-landing .sl-hero, .service-landing .sl-space { padding: 0; }
  .service-landing .sl-hero-grid, .service-landing .sl-comfort-grid, .service-landing .sl-areas { grid-template-columns: 1fr; }
  .service-landing .sl-hero-copy { padding: 32px 0 24px; }
  .service-landing .sl-hero-photo { min-height: 0; height: 240px; }
  .service-landing .sl-hero-photo:after { background: linear-gradient(#f7f4f1, transparent 20%); }
  .service-landing .sl-highlights { gap: 12px; }
  .service-landing .sl-highlights li { flex-basis: 85px; }
  .service-landing .sl-areas > * { grid-column: 1 !important; grid-row: auto !important; }
  .service-landing .sl-area-panel { padding: 20px; }
  .service-landing .sl-procedure-groups { grid-template-columns: 1fr; }
  .service-landing .sl-steps { grid-template-columns: 1fr; gap: 16px; }
  .service-landing .sl-steps p { margin: 0; }
  .service-landing .sl-comfort .sl-photo { max-height: 240px; }
  .service-landing .sl-closing-grid { grid-template-columns: 1fr; gap: 22px; }
  .service-landing .sl-closing .sl-booking { justify-self: start; }
}
@media (max-width: 479px) {
  .service-landing .sl-team { grid-template-columns: 1fr; gap: 24px; }
  .service-landing .sl-doctor { display: grid; grid-template-columns: 100px minmax(0, 1fr); column-gap: 16px; align-content: start; }
  .service-landing .sl-doctor .sl-photo { grid-row: 1 / 4; margin: 0; }
  .service-landing .sl-doctor .sl-text-link { align-self: start; }
  .service-landing .sl-space-grid { gap: 12px; }
  .service-landing .sl-photo--pending { padding: 18px; }
}
@media (prefers-reduced-motion: no-preference) {
  .service-landing .sl-answer:not([hidden]), .service-landing .sl-area-panel:not([hidden]) { animation: sl-reveal .18s ease-out; }
  @keyframes sl-reveal { from { opacity: .5; transform: translateY(-3px); } to { opacity: 1; transform: none; } }
}

/* Surgery: calm text panel, and a full-height view of the waiting room below. */
.service-landing .sl-comfort--text .sl-comfort-grid { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 60px; }
.service-landing .sl-comfort--text .sl-comfort-motto { grid-column: auto; padding: 38px 24px; border-left: 1px solid #dacbbf; font-size: clamp(28px, 3vw, 42px); }
.service-landing .sl-comfort--text .sl-reassurance { background: #fff; border: 1px solid #e8ded5; }
.service-landing .sl-space-grid--waiting-only { grid-template-columns: 1fr 1fr; align-items: center; gap: 40px; padding-block: 38px; }
.service-landing .sl-space-grid--waiting-only .sl-space-copy { grid-column: auto; grid-row: auto; padding: 30px 0; max-width: 540px; }
.service-landing .sl-space-grid .sl-waiting-photo { align-self: center; min-height: 0; aspect-ratio: auto; background: transparent; }
.service-landing .sl-space-grid .sl-waiting-photo > img { position: static; height: auto; max-height: 620px; object-fit: contain; }
@media (max-width: 767px) {
  .service-landing .sl-comfort--text .sl-comfort-grid,
  .service-landing .sl-space-grid--waiting-only { grid-template-columns: 1fr; gap: 24px; }
  .service-landing .sl-comfort--text .sl-comfort-motto { border-left: 0; border-top: 1px solid #dacbbf; padding: 28px 0 8px; }
  .service-landing .sl-space-grid--waiting-only .sl-space-copy { padding: 0; }
}
.service-landing .sl-space-grid:not(.sl-space-grid--waiting-only) { grid-template-columns: 1.2fr .9fr .8fr; align-items: center; padding-block: 32px; container-type: inline-size; }
.service-landing .sl-space-grid .sl-surgery-room-photo { min-height: 0; aspect-ratio: auto; background: transparent; }
.service-landing .sl-space-grid .sl-surgery-room-photo > img { height: auto; object-fit: contain; }
@media (min-width: 600px) {
  .service-landing .sl-space-grid:not(.sl-space-grid--waiting-only) .sl-waiting-photo {
    /* Match the uncropped room photo's height; trim only spare ceiling/floor. */
    height: calc(100cqw * 1.2 / 2.9 * 865 / 1400);
    width: auto;
    aspect-ratio: 3 / 4;
    justify-self: center;
  }
  .service-landing .sl-space-grid:not(.sl-space-grid--waiting-only) .sl-waiting-photo > img { width: 100%; height: 100%; max-height: none; object-fit: cover; }
}
@media (max-width: 991px) {
  .service-landing .sl-space-grid:not(.sl-space-grid--waiting-only) { grid-template-columns: 1.2fr .8fr; gap: 24px; }
}
@media (min-width: 600px) and (max-width: 991px) {
  .service-landing .sl-space-grid:not(.sl-space-grid--waiting-only) .sl-waiting-photo { height: calc((100cqw - 24px) * .6 * 865 / 1400); }
}
@media (max-width: 599px) {
  .service-landing .sl-space-grid:not(.sl-space-grid--waiting-only) { grid-template-columns: 1fr; }
}
