/* KneeShield v2 — Full Redesign 2025 */
:root {
  --ks-navy: #081828;
  --ks-navy-mid: #0f2844;
  --ks-blue: #1d4ed8;
  --ks-blue-light: #3b82f6;
  --ks-sky: #60a5fa;
  --ks-ice: #eef4fb;
  --ks-mist: #f7f9fc;
  --ks-white: #ffffff;
  --ks-ink: #0f172a;
  --ks-ink-soft: #334155;
  --ks-muted: #64748b;
  --ks-line: rgba(255, 255, 255, 0.08);
  --ks-line-dark: #e2e8f0;
  --ks-glow: rgba(59, 130, 246, 0.35);
  --ks-radius-sm: 12px;
  --ks-radius-md: 20px;
  --ks-radius-lg: 28px;
  --ks-radius-xl: 40px;
  --ks-shadow-soft: 0 4px 24px rgba(8, 24, 40, 0.06);
  --ks-shadow-card: 0 20px 50px rgba(8, 24, 40, 0.12);
  --ks-shadow-hero: 0 40px 80px rgba(8, 24, 40, 0.35);
  --ks-font-display: 'Plus Jakarta Sans', sans-serif;
  --ks-font-body: 'DM Sans', sans-serif;
}

* { box-sizing: border-box !important; }

html {
  overflow-x: hidden !important;
  scroll-behavior: smooth !important;
}

body {
  overflow-x: hidden !important;
  width: 100% !important;
  max-width: 100vw !important;
}

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

/* ─── Global typography ─── */
body.u-body.ks-v2 {
  font-family: var(--ks-font-body) !important;
  font-size: 17px !important;
  line-height: 1.75 !important;
  color: var(--ks-ink-soft) !important;
  background: var(--ks-mist) !important;
  margin: 0 !important;
  padding: 0 !important;
  -webkit-font-smoothing: antialiased !important;
}

body.ks-v2 h1, body.ks-v2 h2, body.ks-v2 h3,
body.ks-v2 h4, body.ks-v2 h5, body.ks-v2 h6,
body.ks-v2 .u-text {
  font-family: var(--ks-font-display) !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
  letter-spacing: -0.03em !important;
  color: var(--ks-ink) !important;
  margin: 0 !important;
}

body.ks-v2 .u-sheet {
  max-width: 1240px !important;
  margin: 0 auto !important;
  padding: 0 32px !important;
}

body.ks-v2 .u-clearfix::after {
  content: "" !important;
  display: table !important;
  clear: both !important;
}

/* ─── Header ─── */
body.ks-v2 .u-header-modern {
  background: rgba(255, 255, 255, 0.72) !important;
  backdrop-filter: blur(20px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(180%) !important;
  border-bottom: 1px solid rgba(226, 232, 240, 0.8) !important;
  box-shadow: none !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 1000 !important;
}

body.ks-v2 .u-header-modern .u-sheet-1 {
  max-width: 1240px !important;
  padding: 18px 32px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

body.ks-v2 .u-logo-text-1 {
  font-size: 1.65rem !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  letter-spacing: -0.04em !important;
}

body.ks-v2 .u-logo-text-inner {
  background: linear-gradient(135deg, var(--ks-navy) 0%, var(--ks-blue) 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}

body.ks-v2 .u-header-modern .u-nav-link {
  color: var(--ks-ink-soft) !important;
  border: none !important;
  border-radius: 999px !important;
  font-family: var(--ks-font-body) !important;
  font-weight: 600 !important;
  font-size: 0.9375rem !important;
  padding: 10px 22px !important;
  transition: all 0.25s ease !important;
}

body.ks-v2 .u-header-modern .u-nav-link:hover {
  color: var(--ks-blue) !important;
  background: var(--ks-ice) !important;
}

/* Header CTA — high visibility */
.ks-header-btn,
body.ks-v2 .u-header-modern .ks-header-btn,
body.ks-v2 .u-header-modern .ks-header-btn.u-text-active-white,
body.ks-v2 .u-header-modern .ks-header-btn.u-text-hover-white {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 12px 28px !important;
  font-family: var(--ks-font-display) !important;
  font-size: 0.9375rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.01em !important;
  color: var(--ks-white) !important;
  -webkit-text-fill-color: var(--ks-white) !important;
  background: linear-gradient(135deg, var(--ks-blue) 0%, var(--ks-navy-mid) 100%) !important;
  border: 2px solid transparent !important;
  border-radius: 999px !important;
  box-shadow: 0 8px 24px var(--ks-glow), 0 2px 8px rgba(8, 24, 40, 0.15) !important;
  text-decoration: none !important;
  transition: all 0.25s ease !important;
}

.ks-header-btn:hover,
body.ks-v2 .u-header-modern .ks-header-btn:hover,
body.ks-v2 .u-sidenav .ks-header-btn:hover {
  color: var(--ks-white) !important;
  -webkit-text-fill-color: var(--ks-white) !important;
  background: linear-gradient(135deg, var(--ks-blue-light) 0%, var(--ks-blue) 100%) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 14px 32px var(--ks-glow), 0 4px 12px rgba(8, 24, 40, 0.2) !important;
}

body.ks-v2 .u-sidenav .ks-header-btn {
  margin-top: 24px !important;
  min-width: 200px !important;
}

body.ks-v2 .u-hamburger-link svg rect {
  fill: var(--ks-navy) !important;
}

/* ─── Hero (Section 1) ─── */
body.ks-v2 .u-section-1 {
  min-height: 100vh !important;
  background: var(--ks-navy) !important;
  padding: 120px 0 80px !important;
  position: relative !important;
  overflow: hidden !important;
  display: flex !important;
  align-items: center !important;
}

body.ks-v2 .u-section-1::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background:
    radial-gradient(ellipse 80% 60% at 70% 20%, rgba(59, 130, 246, 0.22) 0%, transparent 55%),
    radial-gradient(ellipse 50% 40% at 10% 90%, rgba(96, 165, 250, 0.1) 0%, transparent 50%) !important;
  pointer-events: none !important;
  animation: none !important;
}

body.ks-v2 .u-section-1::after {
  content: '' !important;
  position: absolute !important;
  bottom: -2px !important;
  left: 0 !important;
  right: 0 !important;
  height: 80px !important;
  background: var(--ks-mist) !important;
  clip-path: ellipse(55% 100% at 50% 100%) !important;
  pointer-events: none !important;
}

body.ks-v2 .u-section-1 .u-sheet-1 {
  max-width: 1240px !important;
  padding: 0 32px !important;
  position: relative !important;
  z-index: 1 !important;
}

body.ks-v2 .u-section-1 .u-layout-row {
  display: flex !important;
  align-items: center !important;
  gap: 64px !important;
  flex-wrap: nowrap !important;
}

body.ks-v2 .u-section-1 .u-layout-cell-1 {
  flex: 1.1 !important;
  min-width: 0 !important;
}

body.ks-v2 .u-section-1 .u-text-1 {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-family: var(--ks-font-body) !important;
  font-size: 0.75rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  color: var(--ks-sky) !important;
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: 999px !important;
  padding: 10px 20px !important;
  margin: 0 0 24px 0 !important;
}

body.ks-v2 .u-section-1 .u-text-2 {
  font-family: var(--ks-font-body) !important;
  font-size: 1.125rem !important;
  font-weight: 500 !important;
  color: rgba(255, 255, 255, 0.55) !important;
  margin: 0 0 20px 0 !important;
}

body.ks-v2 .u-section-1 .u-text-3 {
  font-size: clamp(2.25rem, 5vw, 3.75rem) !important;
  font-weight: 800 !important;
  line-height: 1.08 !important;
  color: var(--ks-white) !important;
  margin: 0 0 28px 0 !important;
  letter-spacing: -0.04em !important;
}

body.ks-v2 .u-section-1 .u-text-4 {
  font-family: var(--ks-font-body) !important;
  font-size: 1.0625rem !important;
  font-weight: 400 !important;
  line-height: 1.85 !important;
  color: rgba(255, 255, 255, 0.65) !important;
  margin: 0 0 40px 0 !important;
  max-width: 520px !important;
}

body.ks-v2 .u-section-1 .u-btn-1 {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
  padding: 18px 36px !important;
  font-family: var(--ks-font-display) !important;
  font-size: 1.0625rem !important;
  font-weight: 700 !important;
  color: var(--ks-navy) !important;
  background: var(--ks-white) !important;
  border: none !important;
  border-radius: 999px !important;
  cursor: pointer !important;
  text-decoration: none !important;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.25) !important;
}

body.ks-v2 .u-section-1 .u-btn-1:hover {
  transform: translateY(-3px) scale(1.02) !important;
  box-shadow: 0 24px 50px rgba(0, 0, 0, 0.35) !important;
  background: var(--ks-ice) !important;
}

body.ks-v2 .u-section-1 .u-btn-1 span {
  text-decoration: line-through !important;
  opacity: 0.45 !important;
  font-weight: 400 !important;
  font-style: italic !important;
  color: var(--ks-muted) !important;
}

body.ks-v2 .u-section-1 .u-image-1 {
  flex: 0 0 46% !important;
  width: 46% !important;
  min-height: 520px !important;
  background-image: url("../images/kneeshield-offer.png") !important;
  background-position: center !important;
  background-size: 88% !important;
  background-repeat: no-repeat !important;
  background-color: var(--ks-white) !important;
  border-radius: var(--ks-radius-xl) !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
  box-shadow: var(--ks-shadow-hero), 0 0 0 1px rgba(255, 255, 255, 0.05) !important;
  position: relative !important;
  transform: rotate(-2deg) !important;
  transition: transform 0.5s ease !important;
}

body.ks-v2 .u-section-1 .u-image-1:hover {
  transform: rotate(0deg) scale(1.02) !important;
}

body.ks-v2 .u-section-1 .u-image-1::after {
  display: none !important;
}

/* ─── Section 2 — Cosa fa KneeShield? ─── */
body.ks-v2 .u-section-2.u-section-modern {
  background: linear-gradient(180deg, var(--ks-mist) 0%, var(--ks-white) 100%) !important;
  padding: 100px 0 !important;
  position: relative !important;
}

body.ks-v2 .u-section-2 .u-sheet-1 {
  min-height: auto !important;
  max-width: 1240px !important;
  padding: 0 32px !important;
}

body.ks-v2 .u-section-2 .u-text-1 {
  font-size: clamp(1.75rem, 3.5vw, 2.75rem) !important;
  font-weight: 800 !important;
  text-align: center !important;
  color: var(--ks-ink) !important;
  margin: 0 0 56px 0 !important;
}

body.ks-v2 .u-section-2 .u-text-1::after {
  content: '' !important;
  display: block !important;
  width: 64px !important;
  height: 4px !important;
  background: linear-gradient(90deg, var(--ks-blue), var(--ks-sky)) !important;
  border-radius: 2px !important;
  margin: 20px auto 0 !important;
}

body.ks-v2 .u-section-2 .u-layout-wrap-1 {
  margin: 0 !important;
  width: 100% !important;
}

body.ks-v2 .u-section-2 .ks-features-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 24px !important;
  width: 100% !important;
  counter-reset: ks-feature !important;
}

body.ks-v2 .u-section-2 .ks-features-grid > .u-size-20:nth-child(1),
body.ks-v2 .u-section-2 .ks-features-grid > .u-size-20:nth-child(2) {
  display: contents !important;
}

body.ks-v2 .u-section-2 .ks-features-grid .u-layout-col {
  display: contents !important;
}

body.ks-v2 .u-section-2 .u-layout-cell-1,
body.ks-v2 .u-section-2 .u-layout-cell-2,
body.ks-v2 .u-section-2 .u-layout-cell-4,
body.ks-v2 .u-section-2 .u-layout-cell-5 {
  min-width: 0 !important;
  width: 100% !important;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  box-shadow: none !important;
}

body.ks-v2 .u-section-2 .u-container-layout-1,
body.ks-v2 .u-section-2 .u-container-layout-2,
body.ks-v2 .u-section-2 .u-container-layout-4,
body.ks-v2 .u-section-2 .u-container-layout-5 {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 14px !important;
  height: 100% !important;
  min-height: 200px !important;
  padding: 32px 28px 32px 88px !important;
  background: var(--ks-white) !important;
  border: 1px solid var(--ks-line-dark) !important;
  border-radius: var(--ks-radius-lg) !important;
  box-shadow: var(--ks-shadow-soft) !important;
  transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease !important;
  position: relative !important;
  overflow: hidden !important;
}

body.ks-v2 .u-section-2 .u-container-layout-1::before,
body.ks-v2 .u-section-2 .u-container-layout-2::before,
body.ks-v2 .u-section-2 .u-container-layout-4::before,
body.ks-v2 .u-section-2 .u-container-layout-5::before {
  counter-increment: ks-feature !important;
  content: counter(ks-feature, decimal-leading-zero) !important;
  position: absolute !important;
  top: 28px !important;
  left: 28px !important;
  width: 44px !important;
  height: 44px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-family: var(--ks-font-display) !important;
  font-size: 0.875rem !important;
  font-weight: 800 !important;
  color: var(--ks-white) !important;
  background: linear-gradient(145deg, var(--ks-blue) 0%, var(--ks-navy-mid) 100%) !important;
  border-radius: 12px !important;
  box-shadow: 0 10px 24px var(--ks-glow) !important;
}

body.ks-v2 .u-section-2 .u-container-layout-1::after,
body.ks-v2 .u-section-2 .u-container-layout-2::after,
body.ks-v2 .u-section-2 .u-container-layout-4::after,
body.ks-v2 .u-section-2 .u-container-layout-5::after {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 3px !important;
  background: linear-gradient(90deg, var(--ks-blue) 0%, var(--ks-sky) 100%) !important;
  opacity: 0 !important;
  transition: opacity 0.35s ease !important;
}

body.ks-v2 .u-section-2 .u-layout-cell-1:hover .u-container-layout-1,
body.ks-v2 .u-section-2 .u-layout-cell-2:hover .u-container-layout-2,
body.ks-v2 .u-section-2 .u-layout-cell-4:hover .u-container-layout-4,
body.ks-v2 .u-section-2 .u-layout-cell-5:hover .u-container-layout-5 {
  transform: translateY(-6px) !important;
  box-shadow: var(--ks-shadow-card) !important;
  border-color: rgba(59, 130, 246, 0.28) !important;
}

body.ks-v2 .u-section-2 .u-layout-cell-1:hover .u-container-layout-1::after,
body.ks-v2 .u-section-2 .u-layout-cell-2:hover .u-container-layout-2::after,
body.ks-v2 .u-section-2 .u-layout-cell-4:hover .u-container-layout-4::after,
body.ks-v2 .u-section-2 .u-layout-cell-5:hover .u-container-layout-5::after {
  opacity: 1 !important;
}

body.ks-v2 .u-section-2 .u-text-2,
body.ks-v2 .u-section-2 .u-text-4,
body.ks-v2 .u-section-2 .u-text-6,
body.ks-v2 .u-section-2 .u-text-8 {
  font-size: 1.1875rem !important;
  font-weight: 700 !important;
  color: var(--ks-ink) !important;
  margin: 0 !important;
  line-height: 1.35 !important;
  width: 100% !important;
}

body.ks-v2 .u-section-2 .u-text-3,
body.ks-v2 .u-section-2 .u-text-5,
body.ks-v2 .u-section-2 .u-text-7,
body.ks-v2 .u-section-2 .u-text-9 {
  font-family: var(--ks-font-body) !important;
  font-size: 0.9375rem !important;
  font-weight: 400 !important;
  line-height: 1.75 !important;
  color: var(--ks-muted) !important;
  margin: 0 !important;
  flex: 1 !important;
  width: 100% !important;
}

body.ks-v2 .u-section-2 .u-image-1 {
  display: none !important;
}

body.ks-v2 .u-section-modern .u-text-2,
body.ks-v2 .u-section-modern .u-text-3,
body.ks-v2 .u-section-modern .u-text-4,
body.ks-v2 .u-section-modern .u-text-5,
body.ks-v2 .u-section-modern .u-text-6,
body.ks-v2 .u-section-modern .u-text-7,
body.ks-v2 .u-section-modern .u-text-8,
body.ks-v2 .u-section-modern .u-text-9 {
  color: var(--ks-ink) !important;
}

body.ks-v2 .u-section-modern .u-text-3,
body.ks-v2 .u-section-modern .u-text-5,
body.ks-v2 .u-section-modern .u-text-7,
body.ks-v2 .u-section-modern .u-text-9 {
  color: var(--ks-muted) !important;
}

body.ks-v2 .u-section-modern .u-layout-cell-1,
body.ks-v2 .u-section-modern .u-layout-cell-2,
body.ks-v2 .u-section-modern .u-layout-cell-4,
body.ks-v2 .u-section-modern .u-layout-cell-5 {
  background: transparent !important;
  border: none !important;
}

/* ─── Section 3 — Ideale per ─── */
body.ks-v2 .u-section-3 {
  background: var(--ks-white) !important;
  padding: 100px 0 !important;
  position: relative !important;
  overflow: hidden !important;
}

body.ks-v2 .u-section-3::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: min(900px, 90%) !important;
  height: 280px !important;
  background: radial-gradient(ellipse at center top, rgba(59, 130, 246, 0.08) 0%, transparent 70%) !important;
  pointer-events: none !important;
}

body.ks-v2 .u-section-3 .u-sheet-1 {
  max-width: 1240px !important;
  padding: 0 32px !important;
  position: relative !important;
  z-index: 1 !important;
}

body.ks-v2 .u-section-3 .u-text-1 {
  font-size: clamp(1.75rem, 3.5vw, 2.75rem) !important;
  font-weight: 800 !important;
  text-align: center !important;
  color: var(--ks-ink) !important;
  margin: 0 0 16px 0 !important;
}

body.ks-v2 .u-section-3 .u-text-1::after {
  content: '' !important;
  display: block !important;
  width: 64px !important;
  height: 4px !important;
  background: linear-gradient(90deg, var(--ks-blue), var(--ks-sky)) !important;
  border-radius: 2px !important;
  margin: 20px auto 0 !important;
}

body.ks-v2 .u-section-3 .u-text-2 {
  font-family: var(--ks-font-body) !important;
  font-size: 1.125rem !important;
  font-weight: 400 !important;
  text-align: center !important;
  color: var(--ks-muted) !important;
  margin: 28px auto 56px !important;
  max-width: 680px !important;
  line-height: 1.75 !important;
}

body.ks-v2 .u-section-3 .u-layout-wrap-1 {
  margin: 0 !important;
  width: 100% !important;
}

body.ks-v2 .u-section-3 .ks-ideal-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 24px !important;
  width: 100% !important;
}

body.ks-v2 .u-section-3 .u-size-30 {
  display: contents !important;
}

body.ks-v2 .u-section-3 .u-layout-row {
  display: contents !important;
}

body.ks-v2 .u-section-3 .u-layout-cell-1,
body.ks-v2 .u-section-3 .u-layout-cell-6 {
  display: none !important;
}

body.ks-v2 .u-section-3 .u-layout-cell-2,
body.ks-v2 .u-section-3 .u-layout-cell-3,
body.ks-v2 .u-section-3 .u-layout-cell-4,
body.ks-v2 .u-section-3 .u-layout-cell-5 {
  min-width: 0 !important;
  width: 100% !important;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  box-shadow: none !important;
}

body.ks-v2 .u-section-3 .u-container-layout-2,
body.ks-v2 .u-section-3 .u-container-layout-3,
body.ks-v2 .u-section-3 .u-container-layout-4,
body.ks-v2 .u-section-3 .u-container-layout-5 {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 14px !important;
  height: 100% !important;
  min-height: 220px !important;
  padding: 32px 28px !important;
  background: linear-gradient(180deg, var(--ks-white) 0%, var(--ks-mist) 100%) !important;
  border: 1px solid var(--ks-line-dark) !important;
  border-radius: var(--ks-radius-lg) !important;
  box-shadow: var(--ks-shadow-soft) !important;
  transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease !important;
  position: relative !important;
  overflow: hidden !important;
}

body.ks-v2 .u-section-3 .u-container-layout-2::before,
body.ks-v2 .u-section-3 .u-container-layout-3::before,
body.ks-v2 .u-section-3 .u-container-layout-4::before,
body.ks-v2 .u-section-3 .u-container-layout-5::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 4px !important;
  background: linear-gradient(90deg, var(--ks-blue) 0%, var(--ks-sky) 100%) !important;
  opacity: 0 !important;
  transition: opacity 0.35s ease !important;
}

body.ks-v2 .u-section-3 .u-layout-cell-2:hover .u-container-layout-2,
body.ks-v2 .u-section-3 .u-layout-cell-3:hover .u-container-layout-3,
body.ks-v2 .u-section-3 .u-layout-cell-4:hover .u-container-layout-4,
body.ks-v2 .u-section-3 .u-layout-cell-5:hover .u-container-layout-5 {
  transform: translateY(-8px) !important;
  box-shadow: var(--ks-shadow-card) !important;
  border-color: rgba(59, 130, 246, 0.28) !important;
}

body.ks-v2 .u-section-3 .u-layout-cell-2:hover .u-container-layout-2::before,
body.ks-v2 .u-section-3 .u-layout-cell-3:hover .u-container-layout-3::before,
body.ks-v2 .u-section-3 .u-layout-cell-4:hover .u-container-layout-4::before,
body.ks-v2 .u-section-3 .u-layout-cell-5:hover .u-container-layout-5::before {
  opacity: 1 !important;
}

body.ks-v2 .u-section-3 .u-text-3,
body.ks-v2 .u-section-3 .u-text-6,
body.ks-v2 .u-section-3 .u-text-9,
body.ks-v2 .u-section-3 .u-text-12 {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 64px !important;
  height: 64px !important;
  font-size: 2rem !important;
  background: linear-gradient(145deg, var(--ks-blue) 0%, var(--ks-navy-mid) 100%) !important;
  border: none !important;
  border-radius: 18px !important;
  margin: 0 0 8px 0 !important;
  line-height: 1 !important;
  box-shadow: 0 12px 28px var(--ks-glow) !important;
  flex-shrink: 0 !important;
}

body.ks-v2 .u-section-3 .u-text-4,
body.ks-v2 .u-section-3 .u-text-7,
body.ks-v2 .u-section-3 .u-text-10,
body.ks-v2 .u-section-3 .u-text-13 {
  font-size: 1.1875rem !important;
  font-weight: 700 !important;
  color: var(--ks-ink) !important;
  margin: 0 !important;
  line-height: 1.35 !important;
  width: 100% !important;
}

body.ks-v2 .u-section-3 .u-text-5,
body.ks-v2 .u-section-3 .u-text-8,
body.ks-v2 .u-section-3 .u-text-11,
body.ks-v2 .u-section-3 .u-text-14 {
  font-family: var(--ks-font-body) !important;
  font-size: 0.9375rem !important;
  font-weight: 400 !important;
  line-height: 1.75 !important;
  color: var(--ks-muted) !important;
  margin: 0 !important;
  flex: 1 !important;
  width: 100% !important;
}

/* ─── Section 4 — Benefits ─── */
body.ks-v2 .u-section-4 {
  background: linear-gradient(180deg, var(--ks-mist) 0%, var(--ks-white) 100%) !important;
  padding: 100px 0 !important;
  position: relative !important;
}

body.ks-v2 .u-section-4 .u-sheet-1 {
  max-width: 1240px !important;
  padding: 0 32px !important;
}

body.ks-v2 .u-section-4 .u-layout-wrap-1,
body.ks-v2 .u-section-4 .u-layout,
body.ks-v2 .u-section-4 .u-layout-row {
  width: 100% !important;
}

body.ks-v2 .u-section-4 .u-layout-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr) !important;
  align-items: stretch !important;
  gap: 48px !important;
}

body.ks-v2 .u-section-4 .u-size-30 {
  flex: none !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

body.ks-v2 .u-section-4 .u-image-1 {
  min-height: 100% !important;
  height: 100% !important;
  min-height: 520px !important;
  background-image: url("../images/kneeshield-lifestyle.png") !important;
  background-size: cover !important;
  background-position: center top !important;
  border-radius: var(--ks-radius-xl) !important;
  box-shadow: var(--ks-shadow-card) !important;
  border: none !important;
  outline: none !important;
  position: relative !important;
  overflow: hidden !important;
}

body.ks-v2 .u-section-4 .u-image-1::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(180deg, transparent 55%, rgba(8, 24, 40, 0.15) 100%) !important;
  pointer-events: none !important;
}

body.ks-v2 .u-section-4 .u-layout-cell-2 {
  display: flex !important;
  align-items: stretch !important;
  min-width: 0 !important;
}

body.ks-v2 .u-section-4 .u-container-layout-2 {
  padding: 0 !important;
  width: 100% !important;
  display: flex !important;
  align-items: stretch !important;
}

body.ks-v2 .u-section-4 .u-list-1 {
  width: 100% !important;
  height: 100% !important;
}

body.ks-v2 .u-section-4 .ks-benefits-grid,
body.ks-v2 .u-section-4 .u-repeater-1 {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  grid-template-rows: repeat(2, minmax(0, 1fr)) !important;
  gap: 20px !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 520px !important;
  align-content: stretch !important;
}

body.ks-v2 .u-section-4 .u-list-item {
  display: flex !important;
  min-width: 0 !important;
  height: 100% !important;
}

body.ks-v2 .u-section-4 .u-container-layout-3,
body.ks-v2 .u-section-4 .u-container-layout-4,
body.ks-v2 .u-section-4 .u-container-layout-5,
body.ks-v2 .u-section-4 .u-container-layout-6 {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  gap: 16px !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 240px !important;
  padding: 28px 24px !important;
  background: var(--ks-white) !important;
  border: 1px solid var(--ks-line-dark) !important;
  border-radius: var(--ks-radius-lg) !important;
  box-shadow: var(--ks-shadow-soft) !important;
  transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease !important;
  position: relative !important;
  overflow: hidden !important;
}

body.ks-v2 .u-section-4 .u-container-layout-3::before,
body.ks-v2 .u-section-4 .u-container-layout-4::before,
body.ks-v2 .u-section-4 .u-container-layout-5::before,
body.ks-v2 .u-section-4 .u-container-layout-6::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 3px !important;
  background: linear-gradient(90deg, var(--ks-blue) 0%, var(--ks-sky) 100%) !important;
  opacity: 0 !important;
  transition: opacity 0.35s ease !important;
}

body.ks-v2 .u-section-4 .u-container-layout-3:hover,
body.ks-v2 .u-section-4 .u-container-layout-4:hover,
body.ks-v2 .u-section-4 .u-container-layout-5:hover,
body.ks-v2 .u-section-4 .u-container-layout-6:hover {
  transform: translateY(-6px) !important;
  box-shadow: var(--ks-shadow-card) !important;
  border-color: rgba(59, 130, 246, 0.28) !important;
}

body.ks-v2 .u-section-4 .u-container-layout-3:hover::before,
body.ks-v2 .u-section-4 .u-container-layout-4:hover::before,
body.ks-v2 .u-section-4 .u-container-layout-5:hover::before,
body.ks-v2 .u-section-4 .u-container-layout-6:hover::before {
  opacity: 1 !important;
}

body.ks-v2 .u-section-4 .u-icon-1,
body.ks-v2 .u-section-4 .u-icon-2,
body.ks-v2 .u-section-4 .u-icon-3,
body.ks-v2 .u-section-4 .u-icon-4 {
  width: 52px !important;
  height: 52px !important;
  min-width: 52px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: linear-gradient(145deg, var(--ks-blue) 0%, var(--ks-navy-mid) 100%) !important;
  border-radius: 14px !important;
  box-shadow: 0 10px 24px var(--ks-glow) !important;
  flex-shrink: 0 !important;
}

body.ks-v2 .u-section-4 .u-icon-1 img,
body.ks-v2 .u-section-4 .u-icon-2 img,
body.ks-v2 .u-section-4 .u-icon-3 img,
body.ks-v2 .u-section-4 .u-icon-4 img {
  width: 26px !important;
  height: 26px !important;
  filter: brightness(0) invert(1) !important;
  object-fit: contain !important;
}

body.ks-v2 .u-section-4 .u-text-1,
body.ks-v2 .u-section-4 .u-text-3,
body.ks-v2 .u-section-4 .u-text-5,
body.ks-v2 .u-section-4 .u-text-7 {
  font-size: 1.125rem !important;
  font-weight: 700 !important;
  color: var(--ks-ink) !important;
  margin: 0 !important;
  line-height: 1.3 !important;
  width: 100% !important;
}

body.ks-v2 .u-section-4 .u-text-2,
body.ks-v2 .u-section-4 .u-text-4,
body.ks-v2 .u-section-4 .u-text-6,
body.ks-v2 .u-section-4 .u-text-8 {
  font-family: var(--ks-font-body) !important;
  font-size: 0.9375rem !important;
  font-weight: 400 !important;
  line-height: 1.7 !important;
  color: var(--ks-muted) !important;
  margin: 0 !important;
  width: 100% !important;
  flex: 1 !important;
}

/* ─── Footer ─── */
body.ks-v2 .u-footer-modern,
.u-footer-modern {
  background: var(--ks-navy) !important;
  padding: 72px 0 56px !important;
  border-top: none !important;
  position: relative !important;
  overflow: visible !important;
}

body.ks-v2 .u-footer-modern::before,
.u-footer-modern::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 1px !important;
  background: linear-gradient(90deg, transparent, rgba(96, 165, 250, 0.4), transparent) !important;
}

body.ks-v2 .u-footer-modern .u-sheet-1,
.u-footer-modern .u-sheet-1 {
  max-width: 1240px !important;
  padding: 0 32px !important;
  min-height: 0 !important;
  overflow: visible !important;
}

body.ks-v2 .u-footer-modern .u-layout-wrap-1,
.u-footer-modern .u-layout-wrap-1 {
  margin: 0 !important;
  margin-bottom: 0 !important;
  width: 100% !important;
  overflow: visible !important;
}

body.ks-v2 .u-footer-modern .u-layout,
.u-footer-modern .u-layout {
  width: 100% !important;
}

body.ks-v2 .u-footer-modern .u-text-1,
.u-footer-modern .u-text-1 {
  font-family: var(--ks-font-body) !important;
  font-size: 0.8125rem !important;
  font-weight: 400 !important;
  line-height: 1.85 !important;
  color: rgba(255, 255, 255, 0.5) !important;
  text-align: left !important;
  margin: 0 auto 40px !important;
  max-width: 100% !important;
  width: 100% !important;
  padding: 28px 32px !important;
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid var(--ks-line) !important;
  border-radius: var(--ks-radius-md) !important;
  box-sizing: border-box !important;
  word-wrap: break-word !important;
  overflow-wrap: break-word !important;
}

body.ks-v2 .u-footer-modern .u-layout-row,
.u-footer-modern .u-layout-row {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: space-between !important;
  align-items: flex-start !important;
  gap: 32px 48px !important;
  width: 100% !important;
  margin: 0 !important;
}

body.ks-v2 .u-footer-modern .u-layout-cell-1,
body.ks-v2 .u-footer-modern .u-layout-cell-2,
.u-footer-modern .u-layout-cell-1,
.u-footer-modern .u-layout-cell-2 {
  flex: 1 1 280px !important;
  min-width: 0 !important;
  max-width: 100% !important;
  min-height: 0 !important;
  width: auto !important;
}

body.ks-v2 .u-footer-modern .u-size-30,
.u-footer-modern .u-size-30 {
  flex: 1 1 280px !important;
  min-width: 0 !important;
  max-width: 100% !important;
  width: auto !important;
}

body.ks-v2 .u-footer-modern .u-container-layout-1,
body.ks-v2 .u-footer-modern .u-container-layout-2,
.u-footer-modern .u-container-layout-1,
.u-footer-modern .u-container-layout-2 {
  padding: 0 !important;
  width: 100% !important;
}

body.ks-v2 .u-footer-modern .u-text-2,
body.ks-v2 .u-footer-modern .u-text-3,
.u-footer-modern .u-text-2,
.u-footer-modern .u-text-3 {
  font-family: var(--ks-font-body) !important;
  font-size: 0.9375rem !important;
  line-height: 2 !important;
  color: rgba(255, 255, 255, 0.72) !important;
  text-align: left !important;
  margin: 0 !important;
  word-wrap: break-word !important;
  overflow-wrap: break-word !important;
}

body.ks-v2 .u-footer-modern .u-layout-cell-2 .u-text-3,
.u-footer-modern .u-layout-cell-2 .u-text-3 {
  text-align: left !important;
}

@media screen and (min-width: 769px) {
  body.ks-v2 .u-footer-modern .u-layout-cell-2,
  .u-footer-modern .u-layout-cell-2 {
    flex: 0 1 auto !important;
    text-align: right !important;
  }

  body.ks-v2 .u-footer-modern .u-layout-cell-2 .u-text-3,
  .u-footer-modern .u-layout-cell-2 .u-text-3 {
    text-align: right !important;
  }
}

body.ks-v2 .u-footer-modern .u-text-2 a,
.u-footer-modern .u-text-2 a {
  color: var(--ks-sky) !important;
  text-decoration: none !important;
  transition: color 0.2s !important;
}

body.ks-v2 .u-footer-modern .u-text-2 a:hover,
.u-footer-modern .u-text-2 a:hover {
  color: var(--ks-white) !important;
}

body.ks-v2 .u-text-footer-link,
.u-text-footer-link {
  color: rgba(255, 255, 255, 0.72) !important;
  text-decoration: none !important;
  font-size: 0.9375rem !important;
  transition: color 0.2s !important;
  display: inline-block !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.ks-v2 .u-text-footer-link:hover,
.u-text-footer-link:hover {
  color: var(--ks-white) !important;
}

body.ks-v2 .u-footer-modern .u-btn-1,
body.ks-v2 .u-footer-modern .u-btn-2,
.u-footer-modern .u-btn-1,
.u-footer-modern .u-btn-2 {
  background: none !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* ─── Legal pages ─── */
.u-section-legal {
  background: var(--ks-mist) !important;
  padding: 120px 0 80px !important;
  min-height: 60vh !important;
}

.u-section-legal .u-sheet-1 {
  max-width: 720px !important;
  margin: 0 auto !important;
  padding: 0 32px !important;
}

.u-section-legal .u-text-1 {
  font-family: var(--ks-font-display) !important;
  font-size: 2.25rem !important;
  font-weight: 800 !important;
  color: var(--ks-ink) !important;
  margin: 0 0 32px 0 !important;
}

.u-section-legal .u-text-legal-h2 {
  font-family: var(--ks-font-display) !important;
  font-size: 1.375rem !important;
  font-weight: 700 !important;
  color: var(--ks-ink) !important;
  margin: 36px 0 16px 0 !important;
}

.u-section-legal .u-text-2 a {
  color: var(--ks-blue) !important;
  text-decoration: none !important;
}

.u-section-legal .u-text-2 a:hover {
  text-decoration: underline !important;
}

.u-section-legal .u-text-2 {
  font-family: var(--ks-font-body) !important;
  font-size: 1rem !important;
  line-height: 1.85 !important;
  color: var(--ks-muted) !important;
  margin: 0 0 20px 0 !important;
}

.u-section-legal .u-btn-back {
  display: inline-flex !important;
  margin-top: 32px !important;
  padding: 14px 28px !important;
  font-family: var(--ks-font-display) !important;
  font-size: 0.9375rem !important;
  font-weight: 700 !important;
  color: var(--ks-white) !important;
  background: linear-gradient(135deg, var(--ks-blue) 0%, var(--ks-navy-mid) 100%) !important;
  border-radius: 999px !important;
  text-decoration: none !important;
  transition: all 0.3s ease !important;
}

.u-section-legal .u-btn-back:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 12px 28px var(--ks-glow) !important;
}

/* Legal/header without ks-v2 body */
body:not(.ks-v2) .u-header-modern {
  background: rgba(255, 255, 255, 0.9) !important;
  backdrop-filter: blur(16px) !important;
  border-bottom: 1px solid var(--ks-line-dark) !important;
}

body:not(.ks-v2) .u-logo-text-inner {
  background: linear-gradient(135deg, var(--ks-navy) 0%, var(--ks-blue) 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}

body:not(.ks-v2) .u-footer-modern {
  background: var(--ks-navy) !important;
}

/* ─── Responsive ─── */
@media screen and (max-width: 1024px) {
  body.ks-v2 .u-section-1 .u-layout-row {
    gap: 40px !important;
  }

  body.ks-v2 .u-section-1 .u-image-1 {
    min-height: 420px !important;
  }

  body.ks-v2 .u-section-4 .u-image-1 {
    min-height: 440px !important;
  }

  body.ks-v2 .u-section-4 .u-layout-row {
    grid-template-columns: 1fr !important;
    gap: 36px !important;
  }

  body.ks-v2 .u-section-4 .ks-benefits-grid,
  body.ks-v2 .u-section-4 .u-repeater-1 {
    min-height: 0 !important;
  }
}

@media screen and (max-width: 768px) {
  body.ks-v2 .u-sheet,
  body.ks-v2 .u-section-1 .u-sheet-1,
  body.ks-v2 .u-section-3 .u-sheet-1,
  body.ks-v2 .u-section-4 .u-sheet-1,
  body.ks-v2 .u-footer-modern .u-sheet-1,
  body.ks-v2 .u-header-modern .u-sheet-1 {
    padding: 0 20px !important;
  }

  body.ks-v2 .u-section-1 {
    padding: 100px 0 60px !important;
    min-height: auto !important;
  }

  body.ks-v2 .u-section-1 .u-layout-row {
    flex-direction: column !important;
    gap: 40px !important;
  }

  body.ks-v2 .u-section-1 .u-layout-cell-1 {
    order: 1 !important;
    width: 100% !important;
  }

  body.ks-v2 .u-section-1 .u-image-1 {
    order: 2 !important;
    flex: none !important;
    width: 100% !important;
    min-height: 320px !important;
    transform: none !important;
  }

  body.ks-v2 .u-section-1 .u-text-3 {
    font-size: 2rem !important;
  }

  body.ks-v2 .u-section-1 .u-btn-1 {
    width: 100% !important;
  }

  body.ks-v2 .u-section-2 .ks-features-grid {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  body.ks-v2 .u-section-2 .ks-features-grid .u-layout-cell {
    min-height: auto !important;
    padding: 24px 22px !important;
  }

  body.ks-v2 .u-section-3 .ks-ideal-grid {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  body.ks-v2 .u-section-3 .u-text-2 {
    margin-bottom: 40px !important;
  }

  body.ks-v2 .u-section-3 .u-container-layout-2,
  body.ks-v2 .u-section-3 .u-container-layout-3,
  body.ks-v2 .u-section-3 .u-container-layout-4,
  body.ks-v2 .u-section-3 .u-container-layout-5 {
    min-height: 0 !important;
    padding: 28px 24px !important;
  }

  body.ks-v2 .u-section-4 .u-layout-row {
    grid-template-columns: 1fr !important;
    gap: 32px !important;
  }

  body.ks-v2 .u-section-4 .u-size-30 {
    flex: none !important;
    width: 100% !important;
  }

  body.ks-v2 .u-section-4 .u-image-1 {
    min-height: 320px !important;
    height: auto !important;
    order: 1 !important;
  }

  body.ks-v2 .u-section-4 .u-layout-cell-2 {
    order: 2 !important;
  }

  body.ks-v2 .u-section-4 .ks-benefits-grid,
  body.ks-v2 .u-section-4 .u-repeater-1 {
    grid-template-columns: 1fr !important;
    grid-template-rows: auto !important;
    min-height: 0 !important;
    gap: 16px !important;
  }

  body.ks-v2 .u-section-4 .u-container-layout-3,
  body.ks-v2 .u-section-4 .u-container-layout-4,
  body.ks-v2 .u-section-4 .u-container-layout-5,
  body.ks-v2 .u-section-4 .u-container-layout-6 {
    min-height: 0 !important;
    padding: 24px 20px !important;
  }

  body.ks-v2 .u-section-4 .u-list-item {
    height: auto !important;
  }

  body.ks-v2 .u-footer-modern .u-layout-row,
  .u-footer-modern .u-layout-row {
    flex-direction: column !important;
    gap: 28px !important;
  }

  body.ks-v2 .u-footer-modern .u-layout-cell-1,
  body.ks-v2 .u-footer-modern .u-layout-cell-2,
  .u-footer-modern .u-layout-cell-1,
  .u-footer-modern .u-layout-cell-2 {
    flex: 1 1 100% !important;
    width: 100% !important;
  }

  body.ks-v2 .u-footer-modern .u-text-2,
  body.ks-v2 .u-footer-modern .u-text-3,
  .u-footer-modern .u-text-2,
  .u-footer-modern .u-text-3 {
    text-align: center !important;
  }

  body.ks-v2 .u-footer-modern .u-text-1,
  .u-footer-modern .u-text-1 {
    padding: 24px 20px !important;
    text-align: left !important;
  }
}

@media screen and (max-width: 480px) {
  body.ks-v2 .u-logo-text-1 {
    font-size: 1.25rem !important;
  }

  body.ks-v2 .u-section-3 .u-container-layout-2,
  body.ks-v2 .u-section-3 .u-container-layout-3,
  body.ks-v2 .u-section-3 .u-container-layout-4,
  body.ks-v2 .u-section-3 .u-container-layout-5 {
    padding: 24px 20px !important;
  }
}
