/* ============================================================
   9. TOUCH TARGETS & MOBILE INPUT
   Loaded last so it wins over page styles. Every rule here
   exists to satisfy a measured failure, not as a precaution.
   ============================================================ */

/* --- Form controls: 44px tall, and 16px text so iOS does not zoom on focus --- */
.form-input,
.form-select,
.form-textarea,
input[type="text"],
input[type="email"],
input[type="tel"],
select,
textarea {
  min-height: var(--tap-target);
  font-size: max(16px, var(--text-body));
}

.form-textarea,
textarea {
  min-height: 150px;
}

/* --- Phone and email links act as primary calls to action, so give them a
       full tap target rather than the height of their text --- */
.hero__phone a,
.cta-contact__value a,
.contact-option__value a,
.team-card__contact a,
.footer__emergency-phone,
.breadcrumb a {
  display: inline-flex;
  align-items: center;
  min-height: var(--tap-target);
}

/* --- Adjacent tappable items need room between them --- */
.footer__legal {
  gap: var(--space-xs);
}

.team-card__contact {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
  min-width: 0;
}

/* The icon and its label are one unit. Without this the phone number breaks
   across three lines inside the narrower three-column team cards. */
.team-card__contact a,
.footer__contact-item,
.mobile-nav__contact a {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: var(--space-xs);
  min-width: 0;
}

.team-card__contact a svg,
.footer__contact-item svg {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
}

.team-card__contact a span,
.footer__contact-item span {
  min-width: 0;
}

/* A phone number should never wrap; an address may, on its own characters. */
a[href^="tel:"] span,
a[href^="tel:"] {
  white-space: nowrap;
}

a[href^="mailto:"] span {
  overflow-wrap: anywhere;
}

@media (max-width: 768px) {

  /* Full-width buttons stop CTA pairs from crowding each other */
  .cta-buttons .btn,
  .hero__ctas .btn {
    width: 100%;
    text-align: center;
  }

  .cta-buttons,
  .hero__ctas {
    gap: var(--space-sm);
  }
}

/* ============================================================
   10. COLOUR CONTRAST (WCAG AA)
   The brand gold reads at only 2.26:1 on white, so gold text on a
   light ground fails AA. Rather than restyle each occurrence, the
   accent resolves through --accent-text: dark gold on light grounds,
   the original bright gold on dark ones. Nothing changes visually on
   the dark sections, which already passed at 4.91:1.
   ============================================================ */

/* --- Dark grounds keep the bright gold --- */
.site-header,
.site-footer,
.mobile-nav,
.hero,
.about-hero,
.contact-hero,
.projects-hero,
.services-hero,
.legal-hero,
.stats-row,
.testimonial-section,
.case-study,
.how-we-work,
.why-choose,
.project-card,
.project-overlay,
.section--dark,
.team-card--emergency,
.office-card__emergency {
  --accent-text: var(--color-warm-gold);
}

/* --- Every gold text role now resolves through the token --- */
.label,
.accordion__icon,
.team-card__role,
.service-category__cta,
.overlay-sidebar__label,
.overlay-hero__location,
.projects-section__eyebrow,
.locations__subtitle,
.case-study__block-label,
.case-study__eyebrow,
.contact-option__label,
.cta-contact__label,
.footer__office-city,
.footer__heading,
.footer__emergency-label {
  color: var(--accent-text);
}

/* --- Gold buttons: white on gold is 2.26:1, forest green on gold is 4.91:1 --- */
.btn-gold,
.btn-gold:hover,
.btn-gold:focus-visible {
  color: var(--color-forest-green);
}

/* --- Low-opacity text raised to the AA floor. The muted look is kept,
       just not at the cost of legibility. --- */
.footer__copyright,
.footer__legal a {
  opacity: 0.75;
}

.footer__links a,
.footer__contact-item,
.footer__office p {
  opacity: 0.85;
}

.testimonial-author__details,
.form-privacy,
.team-card__note,
.projects-section__desc,
.multi-select__placeholder,
.breadcrumb,
.breadcrumb a {
  opacity: 0.9;
}

.multi-select__placeholder {
  color: var(--color-charcoal);
}

/* --- Placeholder text in form fields --- */
::placeholder {
  color: var(--color-soft-taupe);
  opacity: 1;
}

/* ------------------------------------------------------------
   Second pass: opacity was still pulling these under the AA floor.
   Each value below was raised to the lowest figure that passes.
   ------------------------------------------------------------ */
.cta-contact__label,
.contact-option__label,
.case-study__block-label,
.stat-item__label,
.label {
  opacity: 1;
}

.location-hub span,
.breadcrumb span,
.breadcrumb a {
  opacity: 0.9;
}

/* Inline links in body copy inherit the accent, which must be the
   light-ground gold when the copy sits on cream or white. */
.form-privacy a,
.overlay-body a,
.our-story__text a {
  color: var(--accent-text);
}

/* Purely decorative separators stay quiet, and are hidden from
   assistive tech rather than being made louder. */
.footer__legal-sep,
.breadcrumb__sep {
  opacity: 0.45;
}