/* Ameera Thokan Audiology and Speech Therapy
   Unified premium design system
*/

:root {
  --at-navy: #071d2b;
  --at-navy-2: #0b2c3d;
  --at-teal: #2f9e94;
  --at-teal-bright: #4db6ac;
  --at-mint: #e8f6f3;
  --at-cream: #fbfaf7;
  --at-surface: #ffffff;
  --at-surface-soft: #f5f8f9;
  --at-ink: #102b35;
  --at-muted: #5f727a;
  --at-line: #dce7ea;
  --at-shadow-sm: 0 8px 24px rgba(7, 29, 43, 0.06);
  --at-shadow-md: 0 18px 48px rgba(7, 29, 43, 0.10);
  --at-radius: 16px;
  --at-radius-lg: 24px;
  --at-content: 1240px;
}

html {
  scroll-behavior: smooth;
}

body {
  color: var(--at-ink);
  background: var(--at-surface);
  font-family: "Rubik", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

body,
button,
input,
select,
textarea {
  font-size: 16px;
}

p,
li {
  line-height: 1.72;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  color: var(--at-ink);
  font-family: "Poppins", Arial, sans-serif;
  letter-spacing: -0.025em;
  text-wrap: balance;
}

img {
  max-width: 100%;
}

a {
  transition: color 180ms ease, background-color 180ms ease, border-color 180ms ease, transform 180ms ease, box-shadow 180ms ease;
}

:where(a, button, input, select, textarea):focus-visible {
  outline: 3px solid rgba(77, 182, 172, 0.55) !important;
  outline-offset: 3px;
}

/* Header */
.header-top-area {
  background: var(--at-navy) !important;
  border: 0 !important;
}

.header-top-info,
.header-top-info a,
.header-top-info strong {
  color: #e7f3f4 !important;
  font-size: 13px;
}

.header-top-social-icon a[href="#"] {
  display: none !important;
}

.site-header {
  position: relative;
  z-index: 90;
  background: rgba(255, 255, 255, 0.97);
  box-shadow: 0 8px 30px rgba(7, 29, 43, 0.06);
}

.header-navigation-area,
.header-style-two .header-navigation-area {
  background: rgba(255, 255, 255, 0.97) !important;
}

.main-navigation > ul > li > a,
.main-navigation ul li a {
  color: var(--at-ink);
  font-weight: 700;
  letter-spacing: -0.01em;
}

.main-navigation > ul > li > a {
  padding-top: 28px;
  padding-bottom: 28px;
}

.main-navigation ul li ul {
  border: 1px solid var(--at-line);
  border-radius: 14px;
  box-shadow: var(--at-shadow-md);
  overflow: hidden;
  padding: 8px;
}

.main-navigation ul li ul li a {
  border-radius: 9px;
  padding: 11px 14px;
}

.header-buttons-area .cart-button,
.header-buttons-area .header-cart,
.header-buttons-area .cart-product-count,
.header-buttons-area .td-header-src-btn {
  display: none !important;
}

.site-branding .custom-logo {
  width: min(100%, 220px);
  height: auto;
}

@media (min-width: 992px) {
  #main-menu > #menu-item-646 {
    display: none;
  }
}

/* Global buttons */
.td-button,
.hassx-btn,
.audx-btn,
.stx-btn,
.apdx-btn,
.ha4-btn,
.teamx-btn,
.cx2-btn,
input[type="submit"],
button[type="submit"] {
  min-height: 48px;
  border: 0 !important;
  border-radius: 999px !important;
  padding: 13px 22px !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: var(--at-teal) !important;
  color: #fff !important;
  font-weight: 800 !important;
  line-height: 1.2;
  letter-spacing: 0 !important;
  text-transform: none !important;
  box-shadow: 0 10px 24px rgba(47, 158, 148, 0.20);
}

.td-button:hover,
.hassx-btn:hover,
.audx-btn:hover,
.stx-btn:hover,
.apdx-btn:hover,
.ha4-btn:hover,
.teamx-btn:hover,
.cx2-btn:hover,
input[type="submit"]:hover,
button[type="submit"]:hover {
  background: var(--at-navy) !important;
  transform: translateY(-1px);
  box-shadow: 0 14px 30px rgba(7, 29, 43, 0.18);
}

.hassx-btn.white,
.hassx-btn.light,
.audx-btn.dark,
.stx-btn.dark,
.apdx-btn.dark,
.ha4-btn.light,
.teamx-btn.dark,
.cx2-btn.light {
  background: #fff !important;
  color: var(--at-navy) !important;
  box-shadow: none;
}

/* Shared page systems */
.hassx,
.audx,
.stx,
.apdx,
.ha4,
.teamx,
.cx2 {
  color: var(--at-ink) !important;
}

.hassx h1,
.audx h1,
.stx h1,
.apdx h1,
.ha4 h1,
.teamx h1,
.cx2 h1 {
  font-size: clamp(2.55rem, 5.8vw, 4.8rem) !important;
  line-height: 1.01 !important;
  letter-spacing: -0.055em !important;
  text-transform: none !important;
}

.hassx h2,
.audx h2,
.stx h2,
.apdx h2,
.ha4 h2,
.teamx h2,
.cx2 h2 {
  font-size: clamp(2rem, 3.7vw, 3rem) !important;
  line-height: 1.08 !important;
  letter-spacing: -0.04em !important;
  text-transform: none !important;
}

.hassx h3,
.audx h3,
.stx h3,
.apdx h3,
.ha4 h3,
.teamx h3,
.cx2 h3 {
  letter-spacing: -0.025em !important;
  text-transform: none !important;
}

.hassx-kicker,
.audx-badge,
.stx-badge,
.apdx-badge,
.ha4-badge,
.teamx-eyebrow,
.cx2-kicker,
.hassx-label {
  letter-spacing: 0.08em !important;
  font-size: 12px !important;
  text-transform: uppercase !important;
  font-weight: 800 !important;
}

/* Unified heroes */
.hassx-top,
.audx-hero,
.stx-hero,
.apdx-hero,
.ha4-hero {
  background: radial-gradient(circle at 85% 10%, rgba(77, 182, 172, 0.25), transparent 26%), linear-gradient(135deg, var(--at-navy), #0d4963) !important;
  border-radius: 0 0 28px 28px !important;
  overflow: hidden;
  margin-bottom: 64px !important;
}

.teamx-hero,
.cx2-hero {
  background: radial-gradient(circle at 85% 10%, rgba(77, 182, 172, 0.23), transparent 28%), linear-gradient(135deg, var(--at-navy), #0d4963) !important;
  border-radius: var(--at-radius-lg) !important;
  box-shadow: var(--at-shadow-md);
}

.teamx-hero h1,
.teamx-hero p,
.cx2-hero h1,
.cx2-hero p {
  color: #fff !important;
}

.hassx-hero,
.audx-grid,
.stx-grid,
.apdx-grid,
.ha4-grid {
  min-height: 620px;
}

.hassx-lead,
.audx-lead,
.stx-lead,
.apdx-lead,
.ha4-lead,
.teamx-lead,
.cx2-lead {
  max-width: 680px;
  color: #dcebed !important;
}

.hassx-hero-img,
.audx-image,
.stx-image,
.apdx-image,
.ha4-hero-img,
.teamx-img,
.cx2-hero-card {
  border-radius: var(--at-radius-lg) !important;
  box-shadow: 0 26px 70px rgba(0, 0, 0, 0.22) !important;
}

.hassx-hero-img img,
.audx-image img,
.stx-image img,
.apdx-image img,
.ha4-hero-img img,
.teamx-img img {
  border-radius: calc(var(--at-radius-lg) - 6px) !important;
}

/* Section rhythm */
.hassx-section,
.audx-section,
.stx-section,
.apdx-section,
.ha4-section,
.teamx-section,
.cx2-section {
  padding-top: 72px !important;
  padding-bottom: 72px !important;
}

.hassx-wrap,
.apdx-section,
.stx-section,
.audx-section,
.ha4-section,
.teamx-section,
.cx2-section {
  max-width: var(--at-content);
}

.hassx-text,
.audx-text,
.stx-text,
.apdx-text,
.ha4-text,
.teamx-text,
.cx2-text {
  color: var(--at-muted) !important;
}

/* Cards */
.hassx-strip-card,
.hassx-logo-card,
.hassx-product,
.hassx-step,
.audx-quick-card,
.audx-service,
.audx-step,
.audx-photo-card,
.audx-faq,
.stx-card,
.stx-service,
.stx-step,
.stx-faq,
.stx-path,
.stx-feature,
.apdx-card,
.apdx-service,
.apdx-step,
.apdx-faq,
.apdx-feature,
.apdx-process,
.ha4-device,
.ha4-card,
.ha4-feature,
.ha4-faq,
.ha4-step,
.ha4-brand-card,
.teamx-card,
.teamx-path,
.teamx-form,
.cx2-route-card,
.cx2-panel,
.cx2-note {
  border: 1px solid var(--at-line) !important;
  border-radius: var(--at-radius) !important;
  box-shadow: var(--at-shadow-sm) !important;
  background: var(--at-surface) !important;
}

.hassx-strip-card:hover,
.hassx-product:hover,
.audx-quick-card:hover,
.audx-service:hover,
.stx-card:hover,
.stx-service:hover,
.apdx-card:hover,
.apdx-service:hover,
.ha4-device:hover,
.ha4-brand-card:hover,
.teamx-card:hover,
.cx2-route-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--at-shadow-md) !important;
}

.hassx-service-strip {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  gap: 14px !important;
}

.hassx-service-strip .hassx-strip-card {
  border-right: 1px solid var(--at-line) !important;
  min-height: 210px;
}

.hassx-brand-section,
.ha4-retailer-wrap,
.stx-path-wrap,
.apdx-process-wrap {
  background: var(--at-surface-soft) !important;
}

.hassx-brand-pill,
.ha4-brand {
  border-radius: 12px !important;
  border: 1px solid var(--at-line) !important;
  box-shadow: none !important;
}

.hassx-brand-pill.live,
.ha4-brand.phonak {
  background: var(--at-navy) !important;
}

/* Dark feature sections */
.hassx-dark-feature,
.hassx-final,
.audx-band,
.stx-band,
.apdx-band,
.ha4-dark,
.teamx-band {
  background: radial-gradient(circle at 85% 15%, rgba(77, 182, 172, 0.18), transparent 30%), var(--at-navy) !important;
  border-radius: var(--at-radius-lg) !important;
  overflow: hidden;
  box-shadow: var(--at-shadow-md);
}

.audx-band,
.stx-band,
.apdx-band,
.ha4-dark {
  border-radius: 0 !important;
}

/* Forms */
.hassx-form,
.audx-form,
.stx-form,
.apdx-form,
.ha4-form,
.teamx-form,
.cx2-panel.green {
  background: linear-gradient(180deg, #f6fbfa, #f1f7f8) !important;
  border: 1px solid var(--at-line) !important;
  border-radius: var(--at-radius-lg) !important;
  box-shadow: var(--at-shadow-sm) !important;
}

.at-booking-form label {
  display: block;
  margin: 0 0 7px;
  color: var(--at-ink);
  font-weight: 800;
  font-size: 14px;
}

.at-booking-form .row > div {
  margin-bottom: 16px;
}

.at-booking-form input,
.at-booking-form select,
.at-booking-form textarea,
.wpcf7 input,
.wpcf7 select,
.wpcf7 textarea {
  width: 100%;
  min-height: 50px;
  border: 1px solid #cbdadd !important;
  border-radius: 12px !important;
  background: #fff !important;
  color: var(--at-ink) !important;
  padding: 12px 14px !important;
  box-shadow: none !important;
}

.at-booking-form textarea,
.wpcf7 textarea {
  min-height: 130px;
  resize: vertical;
}

.at-booking-form input:focus,
.at-booking-form select:focus,
.at-booking-form textarea:focus,
.wpcf7 input:focus,
.wpcf7 select:focus,
.wpcf7 textarea:focus {
  border-color: var(--at-teal) !important;
  box-shadow: 0 0 0 4px rgba(77, 182, 172, 0.12) !important;
}

.at-form-note {
  margin: 12px 0 0 !important;
  color: var(--at-muted);
  font-size: 13px;
  line-height: 1.55;
}

.wpcf7-not-valid-tip {
  font-size: 13px;
  margin-top: 5px;
}

.wpcf7-response-output {
  border-radius: 12px;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Contact */
.cx2-action,
.cx2-list a,
.cx2-list div {
  border-radius: 12px !important;
  border-color: var(--at-line) !important;
}

.cx2-icon {
  background: var(--at-teal) !important;
}

/* Footer */
.site-footer {
  background: var(--at-navy) !important;
}

.footer-widget-area,
.footer-top-area {
  border-color: rgba(255,255,255,0.10) !important;
}

.site-footer,
.site-footer p,
.site-footer li,
.site-footer a {
  color: #d9e7e9;
}

.site-footer h2,
.site-footer h3,
.site-footer h4,
.site-footer strong {
  color: #fff;
}

@media (max-width: 991px) {
  .hassx-hero,
  .audx-grid,
  .stx-grid,
  .apdx-grid,
  .ha4-grid {
    min-height: auto;
  }

  .hassx-top,
  .audx-hero,
  .stx-hero,
  .apdx-hero,
  .ha4-hero {
    margin-bottom: 36px !important;
  }

  .hassx-section,
  .audx-section,
  .stx-section,
  .apdx-section,
  .ha4-section,
  .teamx-section,
  .cx2-section {
    padding-top: 52px !important;
    padding-bottom: 52px !important;
  }
}

@media (max-width: 767px) {
  .header-top-area {
    display: none !important;
  }

  .hassx h1,
  .audx h1,
  .stx h1,
  .apdx h1,
  .ha4 h1,
  .teamx h1,
  .cx2 h1 {
    font-size: clamp(2.25rem, 11vw, 3.25rem) !important;
  }

  .hassx h2,
  .audx h2,
  .stx h2,
  .apdx h2,
  .ha4 h2,
  .teamx h2,
  .cx2 h2 {
    font-size: clamp(1.8rem, 8vw, 2.5rem) !important;
  }

  .hassx-actions,
  .audx-btns,
  .stx-btns,
  .apdx-btns,
  .ha4-btns,
  .teamx-btns,
  .cx2-btns {
    gap: 10px !important;
  }

  .hassx-actions > a,
  .audx-btns > a,
  .stx-btns > a,
  .apdx-btns > a,
  .ha4-btns > a,
  .teamx-btns > a,
  .cx2-btns > a {
    width: 100%;
  }

  .scroll-to-top {
    display: none !important;
  }

}

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