/* Smartphone only: app/layout gates this sheet by stable device mode. */
  /* Header swipe affordance: subtle edge chevrons, no extra row or panel. */
  .hero-review > .site-header { position: relative; }
  .site-header::before,
  .site-header::after {
    position: absolute;
    z-index: 20;
    top: 50%;
    width: 16px;
    height: 28px;
    display: grid;
    place-items: center;
    transform: translateY(-50%);
    pointer-events: none;
    font-size: 18px;
    line-height: 1;
    color: color-mix(in srgb, currentColor 68%, transparent);
  }
  .site-header::before {
    content: "‹";
    left: 40px;
    background: linear-gradient(90deg, var(--surface,#f7f7f5) 58%, transparent);
  }
  .site-header::after {
    content: "›";
    right: 38px;
    background: linear-gradient(270deg, var(--surface,#f7f7f5) 58%, transparent);
  }
  .site-header nav,
  .site-header[data-hm-open="true"] nav {
    padding-left: 14px;
    padding-right: 14px;
    touch-action: pan-x;
  }

  /* Medical services: two cards per row to shorten the mobile page. */
  .medical-services .service-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
    align-items: stretch;
  }
  .medical-services .service-card-flip:nth-child(n) {
    grid-column: auto !important;
    width: auto !important;
    min-width: 0;
    transform: none !important;
  }
  .medical-services .service-card-flip:last-child:nth-child(odd) {
    grid-column: 1 / -1 !important;
    width: calc(50% - 6px) !important;
    justify-self: center;
  }
  .medical-services .service-card-inner,
  .medical-services .service-featured .service-card-inner {
    min-height: 320px !important;
  }
  .medical-services .service-card-front img {
    height: 178px !important;
  }
  .medical-services .service-front-label,
  .medical-services .service-featured .service-front-label {
    min-height: 92px;
    gap: 7px;
    padding: 14px 10px;
  }
  .medical-services .service-front-label strong,
  .medical-services .service-featured .service-front-label strong {
    font-size: 17px;
    line-height: 1.32;
  }
  .medical-services .service-front-label em {
    font-size: 10.5px;
    line-height: 1.35;
  }
  .medical-services .service-card-back {
    padding: 17px 11px;
  }
  .medical-services .service-card-back small {
    font-size: 9.5px;
    line-height: 1.35;
  }
  .medical-services .service-card-back strong {
    font-size: 17px;
    line-height: 1.3;
    margin: 8px 0;
  }
  .medical-services .service-back-list {
    font-size: 12.5px;
    line-height: 1.45;
    gap: 3px;
  }
  .medical-services .service-card-back em {
    font-size: 10.5px;
    line-height: 1.35;
    margin-top: 10px;
  }
  /* Match the three 이용 방법 cards on phones only. */
  .why-card.process-layout-item.selected {
    color: var(--dark);
    border-color: #dedee0;
    background: rgba(255, 255, 255, .84);
  }
  .why-card.process-layout-item.selected p {
    color: var(--muted);
  }
  .why-card.process-layout-item.selected:not(.is-editing):hover,
  .why-card.process-layout-item.selected:not(.is-editing):focus-within {
    border-color: #bfc0c3;
    background: rgba(255, 255, 255, .96);
  }
