:root {
  --care-ink: #0c1419;
  --care-copy: #34434b;
}

html {
  overflow-x: hidden;
}

body {
  overflow-x: hidden;
  letter-spacing: 0;
  text-rendering: optimizeLegibility;
}

header a[aria-label="Mi Terro home"],
header a:has(img[src*="logo"]) {
  display: inline-flex !important;
  align-items: center !important;
  min-width: 272px !important;
  min-height: 88px !important;
}

header img[src*="logo"],
header img[alt="Mi Terro Care Socks"] {
  display: block !important;
  width: 272px !important;
  height: 88px !important;
  max-width: 272px !important;
  object-fit: contain !important;
  image-rendering: auto;
}

main h1,
main h2,
main h3,
main p {
  overflow-wrap: normal !important;
  word-break: normal !important;
  hyphens: none !important;
  letter-spacing: 0 !important;
}

main h1,
main h2 {
  width: 100%;
  max-width: min(100%, 1120px) !important;
  margin-right: auto !important;
  margin-left: auto !important;
  text-align: inherit !important;
  text-wrap: pretty;
}

main h1 {
  font-size: clamp(2.9rem, 4.75vw, 5rem) !important;
  line-height: 0.98 !important;
}

main h2 {
  font-size: clamp(2.25rem, 4.1vw, 4.35rem) !important;
  line-height: 1 !important;
}

main section [class*="grid"] > div,
main section [class*="container"] > div {
  min-width: 0 !important;
}

main h3 {
  text-wrap: pretty;
}

main p {
  color: var(--care-copy);
  font-weight: 400 !important;
  text-wrap: pretty;
}

main section {
  position: relative;
}

main section > div,
main section [class*="container"],
main section [class*="mx-auto"] {
  max-width: min(1180px, calc(100% - 48px)) !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

main h1 + p,
main h2 + p,
main section > p {
  max-width: 820px !important;
  margin-right: auto !important;
  margin-left: auto !important;
  color: rgba(52, 67, 75, 0.9) !important;
  font-size: clamp(1.06rem, 1.25vw, 1.18rem) !important;
  line-height: 1.6 !important;
  text-align: inherit !important;
}

main button:not([aria-label]),
header button:not([aria-label]) {
  min-height: 52px;
  padding: 14px 26px !important;
  font-size: 1rem !important;
  line-height: 1.1;
  white-space: nowrap;
}

main img {
  max-width: 100%;
  height: auto;
}

main svg,
main [data-lucide] {
  display: inline-block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

main section:first-of-type h1 {
  max-width: 760px !important;
  margin-left: 0 !important;
}

main section:first-of-type h1 + p {
  max-width: 760px !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

main section:first-of-type button,
main section:first-of-type a[class*="button"] {
  margin-left: 0 !important;
  margin-right: auto !important;
}

.mi-terro-care-kicker-hidden {
  display: none !important;
}

.care-top-marker-hidden {
  display: none !important;
}

.care-evidence-source {
  margin: 1.25rem auto 0;
  max-width: 56rem;
  color: #6b6b6b;
  font-size: 0.82rem;
  font-weight: 400;
  line-height: 1.55;
  text-align: center;
}

.care-evidence-source a {
  color: inherit;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

section[code-path*="Testimonials"] div[code-path*="Testimonials.tsx:10:11"],
section[code-path*="Testimonials"] div[code-path*="Testimonials.tsx:37:15"],
section[code-path*="Testimonials"] div[code-path*="Testimonials.tsx:55:15"] {
  display: none !important;
}

@media (max-width: 767px) {
  main section > div,
  main section [class*="container"],
  main section [class*="mx-auto"] {
    max-width: min(100%, calc(100% - 32px)) !important;
  }

  main h1 {
    font-size: clamp(2rem, 8vw, 2.45rem) !important;
    line-height: 1 !important;
  }

  header a[aria-label="Mi Terro home"],
  header a:has(img[src*="logo"]) {
    min-width: 210px !important;
    min-height: 70px !important;
  }

  header img[src*="logo"],
  header img[alt="Mi Terro Care Socks"] {
    width: 210px !important;
    height: 70px !important;
    max-width: 210px !important;
  }

  main h2 {
    font-size: clamp(2rem, 9.5vw, 2.75rem) !important;
    line-height: 1.02 !important;
  }

  main p {
    font-size: 1rem !important;
    line-height: 1.55 !important;
  }

  main button:not([aria-label]),
  header button:not([aria-label]) {
    width: auto;
    min-height: 50px;
    padding: 13px 20px !important;
    font-size: 0.95rem !important;
  }
}
