/* Duro Travel Hub production remediation layer.
   Keep this file after the generated Next.js stylesheet. */

:root {
  --gold-text: #7a5600;
  --footer-text: #4f5f73;
  --focus-ring: #ffca3a;
}

/* Clear, consistent keyboard focus. */
:where(a, button, input, select, textarea):focus-visible {
  outline: 3px solid var(--focus-ring) !important;
  outline-offset: 3px !important;
  box-shadow: 0 0 0 2px #061f4f !important;
}

.eyebrow:not(.light),
.news-preview-links small,
.news-source-grid small,
.contact-methods small,
.contact-hours > small {
  color: var(--gold-text) !important;
}

footer,
footer a,
footer button,
.copyright {
  color: var(--footer-text) !important;
}

.privacy-note {
  color: #4f5f73;
  margin: 12px 0 8px;
  font-size: 14px;
  line-height: 1.55;
}

.privacy-note a {
  color: #075aa8;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.footer-legal {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 18px;
}

.footer-legal a {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}

.hero-slider[aria-roledescription="carousel"] .hero-slide[aria-hidden="true"] {
  pointer-events: none;
}

/* The generated stylesheet contains a later 12px !important override. */
@media (max-width: 900px) {
  .contact-page-grid input,
  .contact-page-grid select,
  .contact-page-grid textarea,
  .booking-wrap input,
  .booking-wrap select,
  .booking-wrap textarea,
  .contact input,
  .contact select,
  .contact textarea,
  .quick-plan input,
  .quick-plan select {
    min-height: 48px !important;
    font-size: 16px !important;
    line-height: 1.5 !important;
  }

  .contact-page-grid label,
  .booking-wrap label,
  .contact label,
  .quick-plan label span {
    font-size: 13px !important;
  }
}

/* A purpose-built mobile hero composition: content, CTA, arrows, and dots
   each get their own row instead of colliding in the lower-left corner. */
@media (max-width: 620px) {
  .hero-slider {
    height: 690px !important;
    min-height: 690px !important;
  }

  .hero-slider .hero-content {
    width: 100%;
    max-width: none;
    padding: 118px 20px 190px !important;
  }

  .hero-slider .hero-content h1 {
    max-width: 330px;
    margin: 18px 0 !important;
    font-size: clamp(42px, 13vw, 52px) !important;
    line-height: .94 !important;
  }

  .hero-slider .hero-copy {
    max-width: 340px;
    font-size: 16px !important;
    line-height: 1.5 !important;
  }

  .hero-actions {
    display: block !important;
    margin-top: 22px !important;
  }

  .hero-actions .primary {
    min-height: 52px;
    display: inline-flex;
    align-items: center;
  }

  .hero-actions .text-link {
    display: none !important;
  }

  .slider-arrow {
    top: auto !important;
    bottom: 88px !important;
    width: 48px !important;
    height: 48px !important;
  }

  .slider-arrow.prev {
    left: 20px !important;
  }

  .slider-arrow.next {
    right: auto !important;
    left: 76px !important;
  }

  .slide-nav {
    justify-content: flex-end !important;
    bottom: 22px !important;
    left: 20px !important;
    right: 20px !important;
    min-height: 48px;
  }

  .slide-count {
    margin-right: auto;
  }

  .slide-dots button {
    width: 44px !important;
    min-width: 44px;
    height: 44px !important;
  }
}

@media (max-width: 360px) {
  .hero-slider .hero-content {
    padding-top: 112px !important;
    padding-left: 18px !important;
    padding-right: 18px !important;
  }

  .hero-slider .hero-content h1 {
    max-width: 285px;
    font-size: 42px !important;
  }

  .slide-dots button {
    width: 40px !important;
    min-width: 40px;
  }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}