/* =============================================================
   HER CIRCLE NL - RESPONSIVE ACCESSIBILITY IMPROVEMENTS
   Applies to every page. Keep this stylesheet loaded LAST.
   ============================================================= */

html { -webkit-text-size-adjust: 100%; }
body { min-width: 0; overflow-x: clip; }
main, section, article, form, .container { min-width: 0; }
img, video, iframe, svg { max-width: 100%; }
img { height: auto; }
h1, h2, h3, h4, p, label, a, button { overflow-wrap: break-word; }
input, select, textarea, button { max-width: 100%; }
input, select, textarea { min-width: 0; }
:focus-visible { outline: 3px solid #bc668a; outline-offset: 3px; }

/* Ensure the registration fields and long text never extend off screen. */
.register-layout, .form-two, .register-form, .register-aside { min-width: 0; }
.register-form label { display: block; min-width: 0; overflow-wrap: anywhere; }
.register-form input:not([type="checkbox"]),
.register-form select,
.register-form textarea,
.contact-section input,
.contact-section select,
.contact-section textarea,
.shop-dialog input,
.shop-dialog select,
.shop-dialog textarea {
  display: block;
  width: 100%;
  max-width: 100%;
  min-height: 44px;
  font-size: 16px; /* Prevents iPhone auto-zoom while typing. */
}
.register-form .checkbox-row { align-items: flex-start; }
.register-form .checkbox-row input { flex: 0 0 auto; margin-top: 4px; }
.register-aside { overflow: visible; }
.register-aside img { border-radius: 14px 14px 0 0; }
.register-form button { max-width: 100%; white-space: normal; }

/* Mobile menus, dialogs and content containers. */
.nav.open { max-height: calc(100dvh - 76px); overflow-y: auto; }
.success-overlay, .shop-modal { overscroll-behavior: contain; }
.success-dialog, .shop-dialog { max-width: 100%; overflow-wrap: anywhere; }

@media (max-width: 900px) {
  .container { padding-left: 5%; padding-right: 5%; }
  .register-layout { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .register-aside h2 { font-size: clamp(28px, 7vw, 42px); }
  .page-heading h1 { font-size: clamp(36px, 8vw, 65px); line-height: 1.12; }
  .hero .hero-left { max-width: 100%; }
  .hero h1 { font-size: clamp(38px, 8vw, 70px); line-height: 1.12; }
  .footer-columns { gap: 24px; }
}

@media (max-width: 760px) {
  .site-header { padding-left: 5%; padding-right: 5%; }
  .nav { z-index: 30; }
  .hero {
    min-height: 0;
    background-position: 58% center;
  }
  .hero .hero-left {
    width: 100%;
    max-width: 100%;
    padding: 70px 6% 76px;
  }
  .hero .hero-content { max-width: 100%; }
  .hero h1 { font-size: clamp(37px, 9vw, 64px); }
  .hero .hero-description { font-size: clamp(15px, 3.9vw, 17px); line-height: 1.7; }
  .hero .hero-lead { font-size: clamp(18px, 4.6vw, 22px); }
  .register-layout { padding-bottom: 70px; }
  .register-form { padding: clamp(18px, 4.5vw, 28px); }
  .register-aside img { height: clamp(180px, 48vw, 320px); object-fit: cover; }
  .register-aside h2 { margin: 22px 22px 0; }
  .register-aside p { margin: 14px 22px 28px; }
  .form-two, .shop-form-grid { grid-template-columns: minmax(0, 1fr); }
  .shop-dialog { width: 100%; max-height: calc(100dvh - 24px); padding: 22px 18px; }
  .shop-dialog h2 { font-size: clamp(24px, 7vw, 34px); }
  .shop-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .shop-card { min-width: 0; }
  .shop-card-image { aspect-ratio: 3 / 4; height: auto; }
  .shop-card-image img { width: 100%; height: 100%; object-fit: contain; }
  .shop-card-copy { overflow-wrap: anywhere; }
  .footer-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 480px) {
  .container { padding-left: 20px; padding-right: 20px; }
  .hero .hero-left { padding: 60px 20px 65px; }
  .hero h1 { font-size: clamp(35px, 10vw, 48px); letter-spacing: -0.025em; }
  .hero .kicker { font-size: 10px; letter-spacing: 0.12em; }
  .hero-buttons { display: flex; flex-direction: column; align-items: stretch; }
  .hero-buttons .button { width: 100%; justify-content: center; text-align: center; }
  .page-heading { padding-top: 42px; }
  .page-heading h1 { font-size: clamp(34px, 10vw, 48px); }
  .register-layout { gap: 20px; }
  .register-form { padding: 20px 16px; }
  .register-aside h2 { font-size: 32px; }
  .form-two { grid-template-columns: minmax(0, 1fr); }
  .shop-grid { gap: 10px; }
  .shop-card-copy { padding: 10px; }
  .shop-card-copy h3 { font-size: 15px; }
  .shop-card-button { margin: 0 10px 10px; font-size: 13px; white-space: normal; }
  .shop-selected { grid-template-columns: minmax(0, 1fr); }
  .shop-selected img { max-width: 150px; }
  .footer-columns { grid-template-columns: minmax(0, 1fr); }
  .success-dialog { max-height: calc(100dvh - 24px); padding: 22px 18px; }
}

@media (max-width: 350px) {
  .shop-grid { grid-template-columns: minmax(0, 1fr); }
  .hero h1 { font-size: 34px; }
  .brand { letter-spacing: 0.05em; }
}

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

.partner-logo, .footer-logo img { background:transparent !important; }