/* Readability layer (Manu, 28 Oct 2026: "make the whole site easy and pleasant to read and use"). Loads last.
   An audit of every public page found phone text mostly at 10-13px, footer and hero labels down to 9px, a few muted
   greys under 4.5:1 and long SEO paragraphs at ~140 characters a line. Thai needs more size than Latin to stay
   legible, so: reading text is 15-16px, nothing people read is under 12px, muted text keeps 4.5:1, paragraphs stop
   near 70 characters, and phone tap targets are at least 40px. Sizes only go up; layout and content stay as they are. */

/* Long paragraphs stop near 70 characters a line. */
html body .sd-seo-section p,html body .sd-club-fine p{max-width:70ch}

/* Muted text that fell under 4.5:1 on the light background. */
html body .editorial-info span,html body .booking-progress li,html body .auth-divider,html body .consent-notice a,html body .auth-page .auth-legal a{color:#56635e}
html body .booking-progress li.current{color:var(--teal,#0e4b4f)}

/* Header controls: real tap sizes, readable labels. */
html body .theme-toggle,html body .menu-toggle{min-width:44px;min-height:44px}
html body .header-actions .button-small{font-size:14px;min-height:40px}
html body details.server-language>summary{font-size:13px;min-height:44px;display:flex;align-items:center}
html body .editorial-breadcrumb{font-size:13px;display:inline-block;padding:8px 0}

/* Home: steps, cards, journey, reviews. */
html body .step-item p{font-size:15px;line-height:1.7}
html body .drop-card-text,html body .drop-card-meta,html body .drop-card-kicker{font-size:14px;line-height:1.6}
html body .sd-journey-step,html body .sd-journey-fine,html body .sd-code{font-size:13px}
html body .sd-code--link{display:inline-flex;align-items:center;min-height:40px}
html body .review-story small,html body .reviews-disclosure,html body .reviews-demo-label{font-size:12px}
html body .catalogue-disclosure{font-size:13px}
html body .catalogue-durations button{font-size:14px;min-height:40px}

/* FAQ answers read as body text. */
html body .faq-item p{font-size:15px;line-height:1.75}
@media(min-width:900px){html body .faq-item p{font-size:16px}}

/* Links inside text get a comfortable tap height without moving the line. */
html body .text-link,html body .drop-inline-link,html body .drop-card-link,html body .ref-menu-link{display:inline-flex;align-items:center;min-height:40px}

/* Footer: the smallest text on the site. */
html body .sd-directory-title{font-size:13px;font-weight:600;letter-spacing:.01em}
html body .sd-directory-facts span,html body .sd-channel-name{font-size:14px}
html body .site-footer .dark-footer-brand>p,html body .dark-footer-note,html body .dark-footer-hours,html body .dark-footer-contact>p{font-size:13px;line-height:1.6}
html body .dark-footer-brand nav a{font-size:15px;display:inline-flex;align-items:center;min-height:40px}
html body a[class*="footer-contact-"],html body .dark-footer-contact-link{font-size:15px;display:inline-flex;align-items:center;min-height:40px}
html body .dark-footer-bottom a,html body .dark-footer-bottom span,html body .site-footer small{font-size:12px}
html body .dark-footer-bottom a{display:inline-flex;align-items:center;min-height:40px}

/* Phones: hero copy, booking bar labels, progress labels. */
@media(max-width:600px){
  html body .ref-center .ref-description{font-size:15px;line-height:1.6}
  html body .ref-control label,html body .ref-control-label,html body .ref-scroll span{font-size:12px}
  html body .ref-select-shell select{min-height:40px}
  html body .booking-progress .progress-label{font-size:12px}
  html body .step-item p,html body .drop-card-text{font-size:15px}
}

/* Second pass after re-measuring (services, how it works, contact, footer). */
html body .site-footer .dark-footer-brand nav a{font-size:15px;display:inline-flex;align-items:center;min-height:40px}
html body .catalogue-card .catalogue-copy p{font-size:15px;line-height:1.65}
html body .catalogue-card .catalogue-duration span,html body .catalogue-card .catalogue-price small{font-size:12px}
html body .catalogue-card .catalogue-bottom .button,html body .sd-seo-package .button{font-size:14px;min-height:40px}
html body .sd-seo-menu-note span{font-size:13px}
html body .editorial-page .step-item p,html body .editorial-page .editorial-info p,html body .editorial-page .contact-item p{font-size:15px;line-height:1.7}
html body .editorial-page .editorial-info span,html body .editorial-page .contact-item>span{font-size:12px}
html body .editorial-page .contact-item small{font-size:13px;line-height:1.6}
html body .ref-actions .button{font-size:15px}
html body .section-heading .text-link{font-size:13px}

html body .dark-footer-grid nav a{font-size:15px;display:flex;align-items:center;min-height:40px}
html body .editorial-help aside>span,html body .editorial-help aside .button,html body .faq-page p>.text-link{font-size:14px}

html body .sd-code--link a,html body .auth-back,html body .drop-menu-link{display:inline-flex;align-items:center;min-height:40px}
html body .booking-aside .summary-row dt,html body .booking-service-tabs button[aria-pressed=false]{color:#56635e}

/* Dark mode keeps its own muted colour (the light-mode greys above would be too dark there). */
html[data-theme=dark] body :is(.editorial-info span,.booking-progress li,.auth-divider,.consent-notice a,.auth-legal,.auth-legal a,.booking-aside .summary-row dt,.booking-service-tabs button[aria-pressed=false]){color:var(--sd-muted,#b8c6bf)}
html[data-theme=dark] body .booking-progress li.current{color:var(--sd-text,#f1f4f0)}
/* Fine print guests still need to read (the illustration notice under photos, sign-in notes, legal links, booking badges): 12px or more. */
html body .sd-seo-media figcaption{font-size:13px;line-height:1.6}
html body .auth-form .google-demo-note,html body .auth-legal,html body .auth-legal a{font-size:12.5px;line-height:1.7}
html body .booking-service-save,html body .large-choice .booking-guest-price small{font-size:12px}
html body .booking-progress .progress-label,html body .aside-note{font-size:12.5px}
html body .legal-prose .notice{font-size:13px}
/* Phone tap targets: breadcrumb and side-list links get a 44px touch height instead of 21-22px. */
@media(max-width:800px){html body .sd-seo-breadcrumb a{display:inline-flex;align-items:center;min-height:44px}html body .sd-seo-aside-links a{display:flex;align-items:center;min-height:44px}}
@media(max-width:800px){html body .sd-directory-group li a{display:inline-flex;align-items:center;min-height:40px}html body .sd-channels .sd-channel-item a{display:inline-flex;align-items:center;min-height:44px}}

/* Signed-in screens and the booking steps (measured 2 Nov 2026): hints and labels were 10-11px; same 12px floor. */
html body .field-hint,html body .demo-note,html body .sd-calendar-disclaimer,html body .sd-calendar-timezone,html body .auth-code-help,html body .inbox-hint,html body .review-user small,html body .account-email,html body .sd-appointment-summary-label,html body .sd-appointment-pending,html body .sd-time-upcoming,html body .notice,html body .sd-dc-drop small{font-size:12px;line-height:1.55}
html body .sd-time-group legend{font-size:12px}
html body .account-refresh,html body .sd-dc-rules summary,html body .review-user .button-plain{display:inline-flex;align-items:center;min-height:40px;font-size:13px}
html body .auth-form .auth-code-help,html body .sd-map-status{font-size:12px}