/* Affordable Office Spaces — Readability & Interaction Polish v1
   Shared finishing layer loaded after each page's existing styles.
   It preserves the approved visual system while improving legibility,
   form usability, text wrapping, zoom behavior and touch interaction. */

:root {
  --aos-readable-copy: 1rem;
  --aos-readable-small: .84rem;
  --aos-readable-control: .94rem;
  --aos-copy-leading: 1.65;
  --aos-ui-leading: 1.45;
}

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  font-size: 16px;
  line-height: var(--aos-copy-leading);
}

main :where(p, li, dd, blockquote) {
  line-height: var(--aos-copy-leading);
}

main :where(small, label, legend, dt, figcaption, button, summary) {
  line-height: var(--aos-ui-leading);
}

main :where(p, li, dd, small, label, legend, dt, figcaption, button, summary, a, span, strong, em) {
  overflow-wrap: break-word;
}

button,
input,
select,
textarea,
summary,
[role="button"] {
  touch-action: manipulation;
}

input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]),
select,
textarea {
  min-height: 48px;
  font-size: 1rem !important;
  line-height: 1.45;
}

textarea {
  min-height: 136px;
  resize: vertical;
}

input[type="checkbox"],
input[type="radio"] {
  inline-size: 1.125rem;
  block-size: 1.125rem;
  flex: 0 0 auto;
}

.button,
.menu-toggle,
.mobile-menu__cta,
form button[type="submit"],
form button[type="button"],
summary {
  min-height: 44px;
}

:where(a, button, input, select, textarea, summary, [role="button"]):focus-visible {
  outline: 3px solid rgba(255, 101, 52, .42);
  outline-offset: 3px;
}

.site-footer a,
.footer a {
  line-height: 1.5;
}

@media (max-width: 980px) {
  .mobile-menu a,
  .mobile-menu button,
  .mobile-menu summary {
    min-height: 44px;
  }
}

@media (max-width: 720px) {
  body {
    font-size: 16px;
  }

  .container {
    width: min(calc(100% - 32px), var(--container));
  }

  .site-footer a,
  .footer a {
    display: inline-flex;
    align-items: center;
    min-height: 36px;
  }

  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]),
  select,
  textarea {
    font-size: 16px !important;
  }
}

@media (max-width: 360px) {
  .container {
    width: min(calc(100% - 24px), var(--container));
  }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}

/* Prevent the browser's default <small> scaling from undoing the readability floor. */
main small {
  font-size: max(var(--aos-readable-small), 1em);
}

/* Diagram labels remain secondary, but never fall back to 5–10 px text. */
main svg text {
  font-size: max(13px, 1em);
}

/* Comfortable control targets without lowering the existing 48–56 px CTA sizes. */
main button:not(.button) {
  min-width: 44px;
  min-height: 44px;
}

main .button {
  min-height: 56px;
  white-space: nowrap;
}

main .button--small {
  min-height: 48px;
}

main .text-link {
  min-height: 44px;
  padding-block: 8px;
}

main :where([class*="page-rail"] a, [class*="page-rail"] button) {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
}

main :where(.breadcrumb a, [class*="breadcrumb"] a) {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
}

main :where(a[href^="tel:"], .contact__phone) {
  min-height: 44px;
}

main svg text {
  font-size: 13px !important;
}

@media (max-width: 720px) {
  .site-footer a,
  .footer a {
    min-height: 44px;
  }
}

@media (max-width: 360px) {
  main .button {
    min-height: 56px;
    padding-block: 12px;
    white-space: normal;
    line-height: 1.35;
    text-align: center;
  }
}

/* Final cross-page readability refinements --------------------------------
   These rules are loaded after every page stylesheet, so they protect long
   labels and compact modules without changing each page's visual identity. */
main .button {
  min-height: 56px;
  padding-block: 10px;
  white-space: normal;
  line-height: 1.35;
  text-align: center;
}

main .text-link {
  max-width: 100%;
  white-space: normal;
  line-height: 1.4;
}

/* Homepage and Private Office accordion copy needs additional vertical room
   after the global type-size increase. */
.experience-item.is-active p { max-height: 180px; }
.private-office-page .growth-step.is-active p { max-height: 150px; }

/* Day Office itinerary labels may be longer than the original compact cards. */
.day-office-page .day-pass__meta strong {
  overflow: visible;
  text-overflow: clip;
  white-space: normal;
  line-height: 1.35;
}
.day-office-page .day-pass__meta > span { min-height: 72px; }

/* Training Day checkpoint times remain readable at every width. */
.training-room-page .tr-control__checkpoints span,
.training-room-page .tr-control__checkpoints strong {
  overflow: visible;
  text-overflow: clip;
  white-space: normal;
  line-height: 1.25;
}

/* Event memory labels should wrap instead of ellipsizing meaningful words. */
.event-spaces-page .es-memory-card__values small,
.event-spaces-page .es-memory-card__values strong {
  overflow: visible;
  text-overflow: clip;
  white-space: normal;
  line-height: 1.25;
}
.event-spaces-page .es-memory-card__values span { min-height: 74px; }

/* The Event Spaces desktop grids are especially content-rich. Move them to
   their established single-column tablet composition before 981px so larger
   readable type cannot create a horizontal document scroll. */
@media (max-width: 1040px) {
  .event-spaces-page .es-section-heading,
  .event-spaces-page .es-intro__layout,
  .event-spaces-page .es-flow__grid,
  .event-spaces-page .es-timeline__grid,
  .event-spaces-page .es-composer,
  .event-spaces-page .es-readiness,
  .event-spaces-page .faq__grid,
  .event-spaces-page .contact__grid,
  .event-spaces-page .stories__layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .event-spaces-page .es-composer__preview,
  .event-spaces-page .faq__heading {
    position: relative;
    top: auto;
  }

  .event-spaces-page .es-readiness__visual,
  .event-spaces-page .tour-form {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }
}

@media (max-width: 720px) {
  /* Form field legends, helper copy and summary text retain a comfortable
     reading line-height on narrow screens. */
  main :where(label, legend, figcaption, .form-note, [class*="fineprint"], [class*="disclaimer"]) {
    line-height: 1.55;
  }
}

/* Purposeful 44px interaction targets for compact text actions. */
.space-card__body > a,
.podcast-rooms-page .pr-location-card__copy a:not(.button),
.contact-page .cp3-contact-card--location a,
.training-room-page .contact__phone {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding-block: 8px;
}

.medical-offices-page .mo-page-rail a,
.podcast-rooms-page [class*="page-rail"] a {
  min-width: 44px;
  min-height: 44px !important;
}

.private-office-page .include-card--wide .text-link {
  max-width: 250px;
  white-space: normal !important;
  text-align: left;
}

.contact-page .cp3-contact-card--location button,
.contact-page .cp3-contact-card--location a {
  min-height: 44px;
}

/* Horizontal page rails should keep each label's intrinsic width and scroll,
   never squeeze readable labels into 44px boxes. */
.medical-offices-page .mo-page-rail a,
.podcast-rooms-page [class*="page-rail"] a {
  width: auto;
  min-width: max-content;
  flex: 0 0 auto;
}

@media (max-width: 720px) {
  main :where(.breadcrumb a, [class*="breadcrumb"] a) {
    min-height: 44px;
  }
}
.podcast-rooms-page [class*="page-rail"] a { padding-inline: 10px; }

/* Contextual phone calls to action: readable, tappable and in the page flow. */
.aos-call-prompt {
  max-width: 60ch;
  margin: 18px 0;
  font-size: 16px;
  line-height: 1.65;
}
a.aos-call-link {
  font-size: max(13px, 1em);
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  max-width: 100%;
  color: inherit;
  font-weight: 750;
  white-space: nowrap;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: .2em;
}
a.aos-call-link:hover { text-decoration-thickness: 2px; }
a.aos-call-link:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 4px;
  border-radius: 3px;
}
