/* Full-frame photos and readable controls. Uploaded image files are untouched. */
body { font-size: 16px; line-height: 1.6; }
.app-main, .app-main > *, .detail-layout > *, .checkout-layout > *, .model-card { min-width: 0; }
.model-media { height: auto; aspect-ratio: 4 / 3; background: #edf0e8; }
.model-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; object-position: center; }
.model-media .photo-missing { width: 100%; min-height: 0; aspect-ratio: 4 / 3; }
.gallery-frame, .gallery-track { width: 100%; min-width: 0; background: #edf0e8; }
.gallery-slide { flex: 0 0 100%; min-width: 0; max-width: 100%; height: auto; aspect-ratio: 4 / 3; position: relative; }
.gallery-slide img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; object-position: center; }
.gallery-slide .photo-missing { width: 100%; min-height: 0; aspect-ratio: 4 / 3; }
.gallery-thumbs { max-width: 100%; }
.gallery-thumbs button { min-width: 64px; min-height: 56px; background: #edf0e8; }
.gallery-thumbs img, dialog img { object-fit: contain; object-position: center; }
.gallery-tools { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin: 10px 0; font-size: 14px; color: var(--muted); }
.gallery-tools .zoom-control { position: static; flex-shrink: 0; }
.primary-button, .secondary-button, .text-button, .back-link, .pill { min-height: 48px; }
.zoom-control, #close-photo { width: 48px; height: 48px; min-width: 48px; }
.language-toggle { min-width: 72px; min-height: 44px; }
.text-button { gap: 8px; }
.model-body, .detail-text, .panel, .success-panel { overflow-wrap: anywhere; }

@media (max-width: 650px) {
  :root { --bottom-nav-height: 84px; }
  html { scroll-padding-bottom: calc(var(--bottom-nav-height) + 20px + env(safe-area-inset-bottom)); }
  .app-main { padding: 28px 20px calc(var(--bottom-nav-height) + 36px + env(safe-area-inset-bottom)); }
  .app-header { min-height: 80px; height: auto; padding: 16px 20px; gap: 12px; }
  .wordmark { font-size: 14px; min-width: 0; }
  .wordmark small { font-size: 9px; letter-spacing: .8px; }
  .language-toggle { font-size: 14px; padding: 8px 12px; }
  .page-heading h1 { font-size: 34px; line-height: 1.2; }
  .page-heading p, .soon-hero p, .success-panel p { font-size: 16px; line-height: 1.65; }
  .city-info p { font-size: 16px; line-height: 1.55; max-width: 235px; opacity: .9; }
  .city-card { min-height: 290px; }
  .city-card.soon { min-height: 255px; }
  .city-card-bottom { align-items: flex-end; gap: 12px; }
  .round-arrow { flex-shrink: 0; }
  .chip, .steps { font-size: 14px; line-height: 1.5; }
  .steps { gap: 12px; }
  .steps b { width: 26px; height: 26px; }
  .chip { padding: 7px 10px; }
  .eyebrow { font-size: 12px; letter-spacing: 1.2px; }
  .benefit b, .benefit small, .category-card p, .detail-note,
  .model-body .make, .manual-label, .model-prices span, .package-mini,
  .card-bottom small, .notice-strip, .detail-make, .tags, .summary-fine,
  .summary-availability, .summary-title p, .summary-total span, .fee-note,
  .coordinates, .consent-label, #zoom-caption, .catalog-footer { font-size: 14px; line-height: 1.65; }
  .benefit b { font-weight: 650; }
  .back-link, .primary-button, .secondary-button, .text-button, .pill { font-size: 16px; }
  .back-link { margin-bottom: 18px; }
  .category-card h2 { font-size: 26px; }
  .model-media { height: auto; }
  .model-year { font-size: 14px; }
  .model-body { padding: 20px; }
  .model-body h2 { font-size: 30px; }
  .model-prices { flex-wrap: wrap; gap: 4px 8px; }
  .model-prices b { font-size: 28px; }
  .card-bottom { flex-wrap: wrap; gap: 8px; }
  .filter-row { flex-wrap: wrap; }
  .detail-layout { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .gallery-slide { height: auto; }
  .gallery-slide .photo-missing { min-height: 0; }
  .detail-text h1 { font-size: 36px; line-height: 1.2; }
  .rate-row { font-size: 16px; line-height: 1.5; gap: 16px; }
  .rate-row span { min-width: 0; }
  .rate-row b { white-space: nowrap; flex-shrink: 0; }
  .checkout-layout { grid-template-columns: minmax(0, 1fr); }
  .panel { padding: 20px; }
  .panel h2 { font-size: 20px; line-height: 1.4; }
  .field-grid { grid-template-columns: minmax(0, 1fr); gap: 0; }
  label.field { font-size: 16px; line-height: 1.5; }
  .field input, .field textarea { font-size: 16px; min-width: 0; max-width: 100%; min-height: 48px; }
  .date-presets { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .date-presets button { min-height: 44px; font-size: 16px; padding: 8px 12px; }
  .radio-card { min-width: 0; padding: 16px 12px; }
  .radio-card b { font-size: 16px; line-height: 1.5; margin-top: 14px; }
  .radio-card small { font-size: 14px; line-height: 1.6; max-width: none; }
  .radio-card input { width: 20px; height: 20px; }
  .office-address, .office-address a { font-size: 16px; line-height: 1.65; }
  .map-actions { display: grid; grid-template-columns: minmax(0, 1fr); }
  #delivery-map { scroll-margin-block: 110px; }
  .summary-line, .summary-line b { font-size: 16px; line-height: 1.55; }
  .summary-line { gap: 14px; }
  .summary-line b { max-width: 60%; overflow-wrap: anywhere; }
  .summary-total { flex-wrap: wrap; }
  .summary-total strong { font-size: 30px; }
  .summary-total small { font-size: 16px; }
  .error-box, .my-booking p, .my-booking .chip { font-size: 16px; }
  .bottom-nav { min-height: var(--bottom-nav-height); padding: 12px 12px max(14px, env(safe-area-inset-bottom)); }
  .bottom-nav button, .bottom-nav a { min-width: 0; min-height: 56px; flex: 1; font-size: 14px; line-height: 1.35; gap: 6px; }
  .catalog-footer { gap: 12px; }
}
/* Operational details stay readable at the point of booking. */
.operational-disclosure{margin-top:20px;padding-top:16px;border-top:1px solid var(--line);font-size:14px;line-height:1.6;overflow-wrap:anywhere}
.operational-disclosure h3{font-size:16px;line-height:1.4;margin:0 0 12px}
.operational-disclosure p{margin:10px 0}.my-booking summary{font-size:14px;min-height:44px;cursor:pointer;padding:12px 0}