/** Shopify CDN: Minification failed

Line 342:0 Unexpected "<"

**/

  * { box-sizing: border-box; }
  body { margin: 0; font-family: Assistant, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; color: #1B2A4E; background: #fff; -webkit-font-smoothing: antialiased; }
  img { max-width: 100%; display: block; }
  a { color: inherit; }
  .stage-banner { background: #fff5e8; border-bottom: 2px solid #a45b16; padding: 10px 20px; text-align: center; font-size: 13px; color: #6a3500; font-weight: 600; }
  .stage-banner span { display: inline-block; padding: 2px 8px; background: #a45b16; color: #fff; border-radius: 3px; font-size: 11px; letter-spacing: .08em; margin-right: 8px; }
  .ov-ship-bar { background:#1B2A4E; color:#fff; padding:8px 16px; text-align:center; font-size:13px; position:sticky; top:0; z-index:50; }
  .ov-ship-bar strong { color:#7FB8E0; }
  .ov-ship-progress { display:inline-block; width:120px; height:6px; background:rgba(255,255,255,0.20); border-radius:3px; vertical-align:middle; margin:0 6px; overflow:hidden; }
  .ov-ship-progress > div { height:100%; background:#7FB8E0; }
  .ov-quiz-promo { background: #EBF5FB; color: #1B2A4E; padding: 10px 16px; text-align: center; font-size: 13px; border-bottom: 1px solid rgba(45,156,219,0.20); }
  .ov-quiz-promo strong { font-weight: 700; }
  .ov-quiz-promo a { color: #2D9CDB; font-weight: 700; text-decoration: none; margin-left: 8px; padding: 4px 12px; border: 1px solid #2D9CDB; border-radius: 14px; font-size: 12px; }
  .stage-nav { background: #0f171f; color: #fff; padding: 9px 16px; font-size: 12px; }
  .stage-nav .inner { max-width: 1280px; margin: 0 auto; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
  .stage-nav .label { color: #FF9F40; font-weight: 700; letter-spacing: .05em; margin-right: 8px; }
  .stage-nav a { color: #fff; text-decoration: none; padding: 5px 11px; border-radius: 4px; background: rgba(255,255,255,.08); }
  .stage-nav a.current { background: #14F195; color: #0f171f; font-weight: 700; }
  .stage-nav .sep { opacity:.5; margin: 0 4px; }
  .stage-nav .group { opacity: .6; font-size: 11px; text-transform: uppercase; letter-spacing: .08em; margin-right: 6px; }
  .ov-header { background: #fff; border-bottom: 1px solid rgba(27,42,78,0.06); padding: 18px 24px; }
  .ov-header-inner { max-width: 1280px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
  .ov-header-nav { display: flex; gap: 28px; font-size: 14px; align-items: baseline; }
  .ov-header-nav a { color: #1B2A4E; text-decoration: none; font-weight: 500; padding-bottom: 4px; border-bottom: 2px solid transparent; }
  .ov-header-nav a.active { border-bottom-color: #2D9CDB; color: #2D9CDB; }
  .ov-logo { font-weight: 800; font-size: 24px; letter-spacing: 0.06em; color: #1B2A4E; text-decoration: none; }
  .ov-header-actions { display: flex; gap: 18px; align-items: center; font-size: 13px; }
  .ov-header-actions a { color: #1B2A4E; text-decoration: none; font-weight: 600; }
  .ov-promo-strip { background: #1B2A4E; color: #fff; padding: 10px 16px; text-align: center; font-size: 12.5px; }
  .ov-footer { background: #1B2A4E; color: #fff; padding: 48px 24px 32px; margin-top: 64px; }
  .ov-footer-grid { max-width: 1180px; margin: 0 auto; display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 36px; }
  .ov-footer h4 { font-size: 11px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: #7FB8E0; margin: 0 0 12px; }
  .ov-footer ul { list-style: none; padding: 0; margin: 0; font-size: 13.5px; line-height: 1.9; }
  .ov-footer a { color: rgba(255,255,255,0.85); text-decoration: none; }
  .ov-footer-bottom { max-width: 1180px; margin: 32px auto 0; padding-top: 24px; border-top: 1px solid rgba(255,255,255,0.12); font-size: 11.5px; color: rgba(255,255,255,0.6); text-align: center; }


  .gd-container { max-width: 1200px; margin: 0 auto; padding: 0 20px; }
  @media (min-width: 1024px) { .gd-container { padding: 0 32px; } }
  .gd-eyebrow { font-size: 10px; letter-spacing: 0.28em; text-transform: uppercase; color: #2D9CDB; font-weight: 600; margin-bottom: 14px; display: block; }

  .gd-hero { padding: 40px 0 28px; background: #fff; border-bottom: 1px solid rgba(27,42,78,0.08); }
  @media (min-width: 1024px) { .gd-hero { padding: 56px 0 36px; } }
  .gd-hero .gd-container { max-width: 1040px; }
  .gd-hero-inner { max-width: 760px; }
  .gd-hero-h1 { font-size: clamp(26px, 3.6vw, 38px); font-weight: 600; color: #1B2A4E; line-height: 1.18; margin: 0 0 14px; letter-spacing: -.01em; }
  .gd-hero-desc { color: #4b5563; font-size: 16px; line-height: 1.6; max-width: 640px; margin: 0; }
  .gd-meta { margin-top: 22px; padding-top: 18px; border-top: 1px solid rgba(27,42,78,0.08); display: flex; flex-wrap: wrap; gap: 28px; font-size: 12.5px; }
  .gd-meta-cell { display: flex; flex-direction: column; gap: 3px; }
  .gd-meta-label { font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase; color: #9ca3af; font-weight: 600; }
  .gd-meta strong { color: #1B2A4E; font-weight: 600; font-size: 13px; }

  .gd-shell { background: #fff; padding: 36px 0 64px; }
  @media (min-width: 1024px) {
    .gd-shell { padding: 48px 0 96px; }
    .gd-shell .gd-container { max-width: 1040px; }
  }
  .gd-grid { display: grid; grid-template-columns: 1fr; gap: 0; }
  @media (min-width: 1024px) {
    .gd-grid {
      grid-template-columns: 220px minmax(0, 1fr);
      gap: 56px;
      max-width: 100%;
    }
  }

  .gd-toc-sidebar { display: none; }
  @media (min-width: 1024px) {
    .gd-toc-sidebar { display: block; position: sticky; top: 24px; align-self: start; background: #F7F9FC; border: 1px solid rgba(27,42,78,0.08); padding: 22px 24px; }
  }
  .gd-toc-sidebar .label { font-size: 10px; letter-spacing: 0.28em; text-transform: uppercase; color: #2D9CDB; font-weight: 700; margin: 0 0 14px; }
  .gd-toc-sidebar ol { list-style: none; counter-reset: t; padding: 0; margin: 0; }
  .gd-toc-sidebar li { counter-increment: t; padding: 6px 0; font-size: 13px; line-height: 1.45; }
  .gd-toc-sidebar li::before { content: counter(t, decimal-leading-zero); color: #9ca3af; font-weight: 600; margin-right: 10px; font-size: 11px; }
  .gd-toc-sidebar a { color: #1B2A4E; text-decoration: none; }
  .gd-toc-sidebar a:hover { color: #2D9CDB; }

  .gd-inline-toc { background: #F7F9FC; border: 1px solid rgba(27,42,78,0.08); padding: 18px 20px; margin: 0 0 28px; }
  .gd-inline-toc .label { font-size: 10px; letter-spacing: 0.28em; text-transform: uppercase; color: #2D9CDB; font-weight: 600; margin: 0 0 10px; }
  .gd-inline-toc ol { list-style: none; counter-reset: ti; padding: 0; margin: 0; columns: 2; column-gap: 20px; }
  .gd-inline-toc li { counter-increment: ti; padding: 3px 0; font-size: 13px; }
  .gd-inline-toc li::before { content: counter(ti, decimal-leading-zero); color: #9ca3af; font-weight: 600; margin-right: 8px; }
  .gd-inline-toc a { color: #1B2A4E; text-decoration: none; }
  @media (min-width: 1024px) { .gd-inline-toc { display: none; } }
  @media (max-width: 600px) { .gd-inline-toc ol { columns: 1; } }

  .gd-content { color: #1B2A4E; min-width: 0; max-width: 720px; }
  .gd-content > *:first-child { margin-top: 0 !important; }
  .gd-content h2 { font-size: 22px; font-weight: 600; color: #1B2A4E; line-height: 1.25; margin: 32px 0 12px; letter-spacing: -.005em; scroll-margin-top: 24px; }
  .gd-content h2::before { content: ''; display: block; width: 32px; height: 2px; background: #2D9CDB; margin-bottom: 10px; }
  .gd-content h3 { font-size: 15px; font-weight: 700; color: #1B2A4E; margin: 22px 0 8px; }
  .gd-content p { font-size: 14.5px; line-height: 1.7; color: #4b5563; margin: 0 0 12px; }
  .gd-content ul, .gd-content ol { font-size: 14.5px; line-height: 1.7; color: #4b5563; margin: 0 0 12px; padding-left: 22px; }
  .gd-content li { margin-bottom: 5px; }
  .gd-content strong { color: #1B2A4E; font-weight: 600; }
  .gd-content a { color: #2D9CDB; font-weight: 500; text-decoration: none; }
  .gd-content a:hover { text-decoration: underline; }

  .gd-table { width: 100%; border-collapse: collapse; margin: 12px 0 24px; font-size: 13.5px; background: #fff; border: 1px solid rgba(27,42,78,0.08); }
  .gd-table th { background: #F7F9FC; color: #1B2A4E; font-size: 10px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; padding: 12px 14px; text-align: left; border-bottom: 1px solid rgba(27,42,78,0.08); }
  .gd-table td { padding: 12px 14px; border-bottom: 1px solid rgba(27,42,78,0.06); vertical-align: top; color: #4b5563; }
  .gd-table tr:last-child td { border-bottom: none; }
  .gd-table td:first-child { color: #1B2A4E; font-weight: 500; }

  .gd-faq { border-bottom: 1px solid rgba(27,42,78,0.10); padding: 2px 0; }
  .gd-faq summary { cursor: pointer; padding: 16px 0; font-size: 14.5px; font-weight: 600; color: #1B2A4E; list-style: none; position: relative; padding-right: 36px; }
  .gd-faq summary::-webkit-details-marker { display: none; }
  .gd-faq summary::after { content: '+'; position: absolute; right: 0; top: 50%; transform: translateY(-50%); font-size: 22px; color: #2D9CDB; font-weight: 400; line-height: 1; }
  .gd-faq[open] summary::after { content: '−'; }
  .gd-faq .a { padding: 0 0 16px; font-size: 14px; line-height: 1.7; color: #4b5563; }

  .gd-callout { padding: 16px 20px; margin: 20px 0; font-size: 14px; line-height: 1.65; border-left: 3px solid #D97706; background: #FEF7E6; color: #92400E; }
  .gd-callout strong { color: #92400E; }
  .gd-callout ul { color: #92400E; margin: 8px 0 0; padding-left: 22px; }


  /* ──────── Editorial design system, consolidated from the live About page ────────
     Used on About, Contact Us, Reimbursement, Collagen 101, Compression 101. */
  .ova-container { max-width: 1280px; margin: 0 auto; padding: 0 16px; }
  @media (min-width: 640px) { .ova-container { padding: 0 24px; } }
  @media (min-width: 1024px) { .ova-container { padding: 0 32px; } }

  .ova-eyebrow { font-size: 10px; letter-spacing: 0.28em; text-transform: uppercase; color: #2D9CDB; font-weight: 600; margin-bottom: 16px; display: block; }

  /* Navy gradient hero */
  .ova-hero { position: relative; overflow: hidden; background: linear-gradient(135deg, #1B2A4E, #2D9CDB); padding: 56px 0; }
  @media (min-width: 1024px) { .ova-hero { padding: 80px 0; } }
  .ova-hero-glow { position: absolute; top: -100px; right: -100px; width: 400px; height: 400px; background: rgba(255,255,255,0.08); border-radius: 50%; filter: blur(80px); }
  .ova-hero-inner { position: relative; max-width: 720px; }
  .ova-hero-h1 { font-size: clamp(28px, 4vw, 44px); font-weight: 600; color: #fff; line-height: 1.15; margin: 0 0 16px; letter-spacing: -.01em; }
  .ova-hero-desc { color: rgba(255,255,255,0.85); font-size: 15px; line-height: 1.7; max-width: 600px; margin: 0; }
  @media (min-width: 1024px) { .ova-hero-desc { font-size: 16px; } }

  /* Editorial body sections */
  .ova-section { padding: 56px 0; background: #fff; }
  @media (min-width: 1024px) { .ova-section { padding: 80px 0; } }
  .ova-section--alt { background: #F7F9FC; }
  .ova-section-inner { max-width: 880px; margin: 0 auto; color: #1B2A4E; }

  .ova-section h2 { font-size: clamp(22px, 3vw, 30px); font-weight: 600; color: #1B2A4E; line-height: 1.2; margin: 40px 0 14px; letter-spacing: -.005em; }
  .ova-section h2:first-child { margin-top: 0; }
  .ova-section h3 { font-size: 16px; font-weight: 600; color: #1B2A4E; margin: 26px 0 8px; }
  .ova-section p { font-size: 15px; line-height: 1.75; color: #4b5563; margin: 0 0 14px; }
  .ova-section ul, .ova-section ol { font-size: 15px; line-height: 1.75; color: #4b5563; margin: 0 0 14px; padding-left: 22px; }
  .ova-section li { margin-bottom: 6px; }
  .ova-section strong { color: #1B2A4E; font-weight: 600; }
  .ova-section a { color: #2D9CDB; text-decoration: none; font-weight: 500; }
  .ova-section a:hover { text-decoration: underline; }

  /* TOC */
  .ova-toc { background: #F7F9FC; border: 1px solid rgba(27,42,78,0.08); padding: 24px 28px; margin: 24px 0 40px; }
  .ova-toc .label { font-size: 10px; letter-spacing: 0.28em; text-transform: uppercase; color: #2D9CDB; font-weight: 600; margin: 0 0 14px; }
  .ova-toc ol { list-style: none; counter-reset: tt; padding: 0; margin: 0; columns: 2; column-gap: 28px; }
  .ova-toc li { counter-increment: tt; padding: 5px 0; font-size: 13.5px; }
  .ova-toc li::before { content: counter(tt, decimal-leading-zero); color: #2D9CDB; font-weight: 700; letter-spacing: .1em; margin-right: 10px; }
  .ova-toc a { color: #1B2A4E; text-decoration: none; }
  .ova-toc a:hover { color: #2D9CDB; }
  @media (max-width: 700px) { .ova-toc ol { columns: 1; } }

  /* Card grid (same vibe as ova-cred) */
  .ova-card-grid { display: grid; grid-template-columns: 1fr; gap: 16px; margin: 20px 0 28px; }
  @media (min-width: 640px) { .ova-card-grid { grid-template-columns: 1fr 1fr; } }
  .ova-card-grid--3 { grid-template-columns: 1fr; }
  @media (min-width: 640px) { .ova-card-grid--3 { grid-template-columns: 1fr 1fr 1fr; } }
  .ova-card { background: #fff; border: 1px solid rgba(27,42,78,0.10); padding: 24px 28px; transition: background 0.2s; }
  .ova-card:hover { background: #F0F7FD; }
  .ova-card h3 { font-size: 15px; font-weight: 600; color: #1B2A4E; margin: 0 0 10px; line-height: 1.3; }
  .ova-card p { font-size: 14px; line-height: 1.7; color: #6b7280; margin: 0; }
  .ova-card a { color: #2D9CDB; font-weight: 500; }

  /* Tables, editorial weight */
  .ova-table { width: 100%; border-collapse: collapse; margin: 14px 0 24px; font-size: 14px; background: #fff; border: 1px solid rgba(27,42,78,0.08); }
  .ova-table th { background: #F7F9FC; color: #1B2A4E; font-size: 10px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; padding: 14px 18px; text-align: left; border-bottom: 1px solid rgba(27,42,78,0.08); }
  .ova-table td { padding: 14px 18px; border-bottom: 1px solid rgba(27,42,78,0.06); vertical-align: top; color: #4b5563; }
  .ova-table tr:last-child td { border-bottom: none; }
  .ova-table td:first-child { color: #1B2A4E; font-weight: 500; }
  .ova-table code { font-family: ui-monospace, "SF Mono", Menlo, monospace; background: #F7F9FC; padding: 2px 7px; font-size: 12.5px; color: #1B2A4E; border: 1px solid rgba(27,42,78,0.08); }

  /* FAQ accordion */
  .ova-faq { border-bottom: 1px solid rgba(27,42,78,0.10); padding: 4px 0; }
  .ova-faq summary { cursor: pointer; padding: 20px 0; font-size: 15px; font-weight: 600; color: #1B2A4E; list-style: none; position: relative; padding-right: 40px; }
  .ova-faq summary::-webkit-details-marker { display: none; }
  .ova-faq summary::after { content: '+'; position: absolute; right: 0; top: 50%; transform: translateY(-50%); font-size: 24px; color: #2D9CDB; font-weight: 400; line-height: 1; }
  .ova-faq[open] summary::after { content: '−'; }
  .ova-faq .a { padding: 0 0 20px; font-size: 14.5px; line-height: 1.75; color: #4b5563; }

  /* Callouts */
  .ova-callout { padding: 20px 24px; margin: 24px 0; font-size: 14.5px; line-height: 1.7; border-left: 3px solid #2D9CDB; background: #F0F7FD; color: #1B2A4E; }
  .ova-callout--warn { border-left-color: #D97706; background: #FEF7E6; color: #92400E; }
  .ova-callout--good { border-left-color: #10B981; background: #ECFDF5; color: #065F46; }
  .ova-callout strong { color: inherit; }
  .ova-callout--warn strong { color: #92400E; }
  .ova-callout--good strong { color: #065F46; }

  /* CTA band */
  .ova-cta-band { background: #1B2A4E; color: #fff; padding: 56px 0; }
  .ova-cta-band h2 { color: #fff; font-size: clamp(22px, 3vw, 28px); font-weight: 600; margin: 8px 0 14px; }
  .ova-cta-band p { color: rgba(255,255,255,0.82); font-size: 15px; line-height: 1.7; margin: 0 0 8px; max-width: 720px; }
  .ova-cta-band a { color: #2D9CDB; font-weight: 600; text-decoration: none; }
  .ova-cta-band a:hover { color: #fff; text-decoration: underline; }
  .ova-cta-band em { color: rgba(255,255,255,0.55); font-size: 13px; }

  /* Doctor photo treatment (re-used from live About) */
  .ova-doctor-grid { display: grid; grid-template-columns: 1fr; gap: 48px; align-items: start; }
  @media (min-width: 900px) { .ova-doctor-grid { grid-template-columns: 1fr 1fr; gap: 64px; } }
  .ova-doctor-photo-wrap { position: relative; align-self: stretch; min-height: 500px; }
  .ova-doctor-photo-wrap > .frame { position: absolute; inset: 0; border: 4px solid #fff; box-shadow: 0 25px 60px rgba(0,0,0,0.12); overflow: hidden; }
  .ova-doctor-photo-wrap > .frame img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: top center; }
  .ova-doctor-badge { position: absolute; bottom: 16px; right: -8px; background: #2D9CDB; color: #fff; padding: 14px 20px; z-index: 2; }
  .ova-doctor-badge p { margin: 0; }
  .ova-doctor-badge .b1 { font-size: 10px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; }
  .ova-doctor-badge .b2 { font-size: 10px; color: rgba(255,255,255,0.8); margin-top: 4px; }
  .ova-doctor h2 { font-size: clamp(22px, 3vw, 32px); font-weight: 600; color: #1B2A4E; line-height: 1.25; margin: 0 0 8px; }
  .ova-doctor .role { font-size: 16px; color: #6b7280; margin: 0 0 24px; }
  .ova-doctor .bio { display: flex; flex-direction: column; gap: 16px; margin-bottom: 32px; }
  .ova-doctor .bio p { font-size: 14.5px; color: #4b5563; line-height: 1.75; margin: 0; }
  .ova-doctor .bio p.mission { color: #1B2A4E; font-weight: 600; }
  .ova-creds { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .ova-cred { border: 1px solid rgba(27,42,78,0.10); background: #F7F9FC; padding: 16px; }
  .ova-cred svg { color: #2D9CDB; margin-bottom: 8px; }
  .ova-cred .t1 { font-size: 11px; font-weight: 600; color: #1B2A4E; margin: 0 0 2px; }
  .ova-cred .t2 { font-size: 10px; color: #9ca3af; margin: 0; }

  /* Editorial form (Contact) */
  .ova-form { background: #fff; border: 1px solid rgba(27,42,78,0.08); padding: 32px; max-width: 640px; }
  .ova-form .row { margin-bottom: 16px; }
  .ova-form label { display: block; font-size: 11px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: #1B2A4E; margin-bottom: 8px; }
  .ova-form input, .ova-form textarea { width: 100%; border: 1px solid rgba(27,42,78,0.15); padding: 13px 16px; font-size: 15px; font-family: inherit; background: #fff; color: #1B2A4E; }
  .ova-form input:focus, .ova-form textarea:focus { outline: 2px solid #2D9CDB; outline-offset: -2px; border-color: #2D9CDB; }
  .ova-form button { background: #1B2A4E; color: #fff; border: none; padding: 14px 28px; font-size: 14px; font-weight: 600; cursor: pointer; letter-spacing: 0.08em; text-transform: uppercase; font-family: inherit; }
  .ova-form button:hover { background: #2D9CDB; }

  /* PDP buy box (kept for product pages, sits next to ova-* vocab) */
  .ova-pdp-buy { display: grid; grid-template-columns: 1fr; gap: 32px; margin: 24px 0 40px; padding: 32px; background: #F7F9FC; border: 1px solid rgba(27,42,78,0.08); }
  @media (min-width: 768px) { .ova-pdp-buy { grid-template-columns: 1fr 360px; } }
  .ova-pdp-photo { aspect-ratio: 1/1; background: linear-gradient(135deg, #1B2A4E 0%, #2D9CDB 100%); display: grid; place-items: center; color: #fff; font-size: 13px; letter-spacing: .04em; }
  .ova-pdp-price { font-size: 10px; color: #6b7280; letter-spacing: 0.18em; text-transform: uppercase; margin: 0 0 14px; }
  .ova-pdp-badges { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 20px; }
  .ova-pdp-badge { display: inline-block; padding: 5px 11px; background: #fff; border: 1px solid #2D9CDB; color: #2D9CDB; font-size: 11px; font-weight: 600; letter-spacing: 0.02em; }
  .ova-pdp-size-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; margin: 6px 0 20px; }
  .ova-pdp-size { padding: 12px; text-align: center; border: 1px solid rgba(27,42,78,0.15); background: #fff; font-size: 13px; color: #4b5563; cursor: pointer; }
  .ova-pdp-size--active { border-color: #1B2A4E; border-width: 1.5px; color: #1B2A4E; font-weight: 600; }
  .ova-pdp-cart { width: 100%; padding: 16px; background: #1B2A4E; color: #fff; border: none; font-size: 14px; font-weight: 600; cursor: pointer; letter-spacing: 0.08em; text-transform: uppercase; font-family: inherit; }
  .ova-pdp-cart:hover { background: #2D9CDB; }

  /* Use-case grid for PDPs */
  .ova-use-grid { display: grid; grid-template-columns: 1fr; gap: 10px; margin: 16px 0 24px; }
  @media (min-width: 640px) { .ova-use-grid { grid-template-columns: 1fr 1fr 1fr; } }
  .ova-use-cell { padding: 18px 20px; background: #F7F9FC; border: 1px solid rgba(27,42,78,0.08); font-size: 14px; color: #1B2A4E; font-weight: 500; line-height: 1.5; }


  /* New-page additions to Ovena design system, match .ov-* tokens */
  .ov-page-hero { padding: 56px 16px 32px; background: #fff; }
  @media (min-width: 1024px) { .ov-page-hero { padding: 96px 32px 56px; } }
  .ov-page-hero-inner { max-width: 880px; margin: 0 auto; }
  .ov-page-h1 { font-size: 32px; font-weight: 600; color: #1B2A4E; line-height: 1.1; letter-spacing: -.01em; margin: 8px 0 16px; }
  @media (min-width: 1024px) { .ov-page-h1 { font-size: 44px; } }
  .ov-page-lede { font-size: 17px; line-height: 1.6; color: #4B5563; max-width: 720px; margin: 0 0 8px; }

  .ov-content { padding: 32px 16px 96px; background: #fff; }
  @media (min-width: 1024px) { .ov-content { padding: 48px 32px 120px; } }
  .ov-content-inner { max-width: 880px; margin: 0 auto; color: #1B2A4E; }
  .ov-content h2 { font-size: 22px; font-weight: 600; color: #1B2A4E; line-height: 1.2; margin: 48px 0 14px; letter-spacing: -.005em; }
  @media (min-width: 1024px) { .ov-content h2 { font-size: 26px; } }
  .ov-content h3 { font-size: 16px; font-weight: 600; color: #1B2A4E; margin: 28px 0 8px; }
  .ov-content p { font-size: 15px; line-height: 1.7; color: #4B5563; margin: 0 0 14px; }
  .ov-content ul, .ov-content ol { font-size: 15px; line-height: 1.7; color: #4B5563; margin: 0 0 14px; padding-left: 22px; }
  .ov-content li { margin-bottom: 6px; }
  .ov-content strong { color: #1B2A4E; font-weight: 600; }
  .ov-content a { color: #2D9CDB; text-decoration: none; font-weight: 500; }
  .ov-content a:hover { text-decoration: underline; }

  .ov-toc { background: #F9FAFB; border: 1px solid #E5E7EB; border-radius: 12px; padding: 20px 24px; margin: 24px 0 32px; }
  .ov-toc-label { font-size: 10px; letter-spacing: .2em; text-transform: uppercase; color: #2D9CDB; font-weight: 600; margin: 0 0 12px; }
  .ov-toc ol { list-style: none; counter-reset: tt; padding: 0; margin: 0; columns: 2; column-gap: 24px; }
  .ov-toc li { counter-increment: tt; padding: 4px 0; font-size: 14px; }
  .ov-toc li::before { content: counter(tt, decimal-leading-zero) "  "; color: #2D9CDB; font-weight: 600; margin-right: 6px; }
  .ov-toc a { color: #1B2A4E; }
  @media (max-width: 700px) { .ov-toc ol { columns: 1; } }

  .ov-card-grid { display: grid; gap: 16px; grid-template-columns: 1fr; margin: 16px 0 24px; }
  @media (min-width: 640px) { .ov-card-grid { grid-template-columns: 1fr 1fr; } }
  .ov-card { background: #fff; border: 1px solid #E5E7EB; border-radius: 12px; padding: 24px 28px; transition: background 0.2s; }
  .ov-card:hover { background: #F0F7FD; }
  .ov-card h3 { color: #1B2A4E; font-size: 15px; font-weight: 600; margin: 0 0 8px; }
  .ov-card p { font-size: 14px; line-height: 1.65; color: #6B7280; margin: 0; }

  .ov-table { width: 100%; border-collapse: collapse; margin: 14px 0 24px; font-size: 14px; background: #fff; border: 1px solid #E5E7EB; border-radius: 12px; overflow: hidden; }
  .ov-table th { background: #F9FAFB; color: #1B2A4E; font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; padding: 12px 16px; text-align: left; border-bottom: 1px solid #E5E7EB; }
  .ov-table td { padding: 14px 16px; border-bottom: 1px solid #F3F4F6; vertical-align: top; color: #4B5563; }
  .ov-table tr:last-child td { border-bottom: none; }
  .ov-table td:first-child { color: #1B2A4E; font-weight: 500; }
  .ov-table code { font-family: ui-monospace, "SF Mono", Menlo, monospace; background: #F3F4F6; padding: 2px 6px; border-radius: 4px; font-size: 12.5px; color: #1B2A4E; }

  .ov-faq { border-bottom: 1px solid #E5E7EB; padding: 4px 0; }
  .ov-faq summary { cursor: pointer; padding: 18px 0; font-size: 15px; font-weight: 600; color: #1B2A4E; list-style: none; position: relative; padding-right: 36px; }
  .ov-faq summary::-webkit-details-marker { display: none; }
  .ov-faq summary::after { content: '+'; position: absolute; right: 0; top: 50%; transform: translateY(-50%); font-size: 24px; color: #2D9CDB; font-weight: 400; line-height: 1; }
  .ov-faq[open] summary::after { content: '−'; }
  .ov-faq .a { padding: 0 0 18px; font-size: 14.5px; line-height: 1.65; color: #4B5563; }

  .ov-callout { padding: 18px 22px; border-radius: 10px; margin: 20px 0; font-size: 14.5px; line-height: 1.6; }
  .ov-callout-info { background: #F0F7FD; border-left: 3px solid #2D9CDB; color: #1B2A4E; }
  .ov-callout-warn { background: #FEF7E6; border-left: 3px solid #D97706; color: #92400E; }
  .ov-callout-good { background: #ECFDF5; border-left: 3px solid #10B981; color: #065F46; }

  .ov-cta-block { background: #1B2A4E; color: #fff; padding: 32px 32px 28px; border-radius: 14px; margin: 32px 0 0; }
  .ov-cta-block h2 { color: #fff; margin: 0 0 8px; font-size: 22px; }
  .ov-cta-block p { color: rgba(255,255,255,0.82); margin: 0 0 8px; font-size: 15px; }
  .ov-cta-block a { color: #2D9CDB; font-weight: 600; }

  .ov-use-grid { display: grid; grid-template-columns: 1fr; gap: 10px; margin: 16px 0 24px; }
  @media (min-width: 640px) { .ov-use-grid { grid-template-columns: 1fr 1fr 1fr; } }
  .ov-use-cell { padding: 16px 20px; background: #F9FAFB; border: 1px solid #E5E7EB; border-radius: 10px; font-size: 14px; color: #1B2A4E; font-weight: 500; line-height: 1.5; }

  /* Mini buy box for PDP mockups */
  .ov-pdp-buy { display: grid; grid-template-columns: 1fr; gap: 32px; margin: 24px 0 40px; padding: 32px; background: #F9FAFB; border: 1px solid #E5E7EB; border-radius: 14px; }
  @media (min-width: 768px) { .ov-pdp-buy { grid-template-columns: 1fr 360px; } }
  .ov-pdp-photo { aspect-ratio: 1/1; background: linear-gradient(135deg, #1B2A4E 0%, #2D9CDB 100%); border-radius: 10px; display: grid; place-items: center; color: #fff; font-size: 14px; letter-spacing: .04em; }
  .ov-pdp-price { font-size: 12px; color: #6B7280; letter-spacing: .12em; text-transform: uppercase; margin: 0 0 12px; }
  .ov-pdp-badges { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 18px; }
  .ov-pdp-badge { display: inline-block; padding: 5px 10px; background: #fff; border: 1px solid #2D9CDB; color: #2D9CDB; border-radius: 4px; font-size: 11px; font-weight: 600; letter-spacing: .02em; }
  .ov-pdp-size-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; margin: 6px 0 18px; }
  .ov-pdp-size { padding: 11px; text-align: center; border: 1px solid #E5E7EB; background: #fff; border-radius: 6px; font-size: 13px; color: #4B5563; cursor: pointer; }
  .ov-pdp-size--active { border-color: #1B2A4E; border-width: 1.5px; color: #1B2A4E; font-weight: 600; }
  .ov-pdp-cart { width: 100%; padding: 14px; background: #1B2A4E; color: #fff; border: none; border-radius: 8px; font-size: 15px; font-weight: 600; cursor: pointer; letter-spacing: .04em; font-family: inherit; }
  .ov-pdp-cart:hover { background: #2D9CDB; }


.ov-header-nav .ov-has-dropdown { position:relative; }
.ov-header-nav .ov-dropdown { position:absolute; top:100%; left:50%; transform:translateX(-50%); background:#fff; min-width:240px; border:1px solid rgba(27,42,78,0.10); border-radius:4px; padding:8px 0; box-shadow:0 8px 20px rgba(27,42,78,0.10); opacity:0; visibility:hidden; pointer-events:none; transition:opacity .15s, visibility .15s; z-index:30; }
.ov-header-nav .ov-has-dropdown:hover .ov-dropdown { opacity:1; visibility:visible; pointer-events:auto; }
.ov-header-nav .ov-dropdown a { display:block; padding:9px 18px; font-size:13.5px; color:#1B2A4E; text-decoration:none; border-bottom:0; white-space:nowrap; }
.ov-header-nav .ov-dropdown a:hover { background:#F7F9FC; color:#2D9CDB; }

<style>
  .gd-container { max-width: 1200px; margin: 0 auto; padding: 0 20px; }
  @media (min-width: 1024px) { .gd-container { padding: 0 32px; } }
  .gd-eyebrow { font-size: 10px; letter-spacing: 0.28em; text-transform: uppercase; color: #2D9CDB; font-weight: 600; margin-bottom: 14px; display: block; }

  .gd-hero { padding: 40px 0 28px; background: #fff; border-bottom: 1px solid rgba(27,42,78,0.08); }
  @media (min-width: 1024px) { .gd-hero { padding: 56px 0 36px; } }
  .gd-hero .gd-container { max-width: 1040px; }
  .gd-hero-inner { max-width: 760px; }
  .gd-hero-h1 { font-size: clamp(26px, 3.6vw, 38px); font-weight: 600; color: #1B2A4E; line-height: 1.18; margin: 0 0 14px; letter-spacing: -.01em; }
  .gd-hero-desc { color: #4b5563; font-size: 16px; line-height: 1.6; max-width: 640px; margin: 0; }
  .gd-meta { margin-top: 22px; padding-top: 18px; border-top: 1px solid rgba(27,42,78,0.08); display: flex; flex-wrap: wrap; gap: 28px; font-size: 12.5px; }
  .gd-meta-cell { display: flex; flex-direction: column; gap: 3px; }
  .gd-meta-label { font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase; color: #9ca3af; font-weight: 600; }
  .gd-meta strong { color: #1B2A4E; font-weight: 600; font-size: 13px; }

  .gd-shell { background: #fff; padding: 36px 0 64px; }
  @media (min-width: 1024px) {
    .gd-shell { padding: 48px 0 96px; }
    .gd-shell .gd-container { max-width: 1040px; }
  }
  .gd-grid { display: grid; grid-template-columns: 1fr; gap: 0; }
  @media (min-width: 1024px) {
    .gd-grid {
      grid-template-columns: 220px minmax(0, 1fr);
      gap: 56px;
      max-width: 100%;
    }
  }

  .gd-toc-sidebar { display: none; }
  @media (min-width: 1024px) {
    .gd-toc-sidebar { display: block; position: sticky; top: 24px; align-self: start; background: #F7F9FC; border: 1px solid rgba(27,42,78,0.08); padding: 22px 24px; }
  }
  .gd-toc-sidebar .label { font-size: 10px; letter-spacing: 0.28em; text-transform: uppercase; color: #2D9CDB; font-weight: 700; margin: 0 0 14px; }
  .gd-toc-sidebar ol { list-style: none; counter-reset: t; padding: 0; margin: 0; }
  .gd-toc-sidebar li { counter-increment: t; padding: 6px 0; font-size: 13px; line-height: 1.45; }
  .gd-toc-sidebar li::before { content: counter(t, decimal-leading-zero); color: #9ca3af; font-weight: 600; margin-right: 10px; font-size: 11px; }
  .gd-toc-sidebar a { color: #1B2A4E; text-decoration: none; }
  .gd-toc-sidebar a:hover { color: #2D9CDB; }

  .gd-inline-toc { background: #F7F9FC; border: 1px solid rgba(27,42,78,0.08); padding: 18px 20px; margin: 0 0 28px; }
  .gd-inline-toc .label { font-size: 10px; letter-spacing: 0.28em; text-transform: uppercase; color: #2D9CDB; font-weight: 600; margin: 0 0 10px; }
  .gd-inline-toc ol { list-style: none; counter-reset: ti; padding: 0; margin: 0; columns: 2; column-gap: 20px; }
  .gd-inline-toc li { counter-increment: ti; padding: 3px 0; font-size: 13px; }
  .gd-inline-toc li::before { content: counter(ti, decimal-leading-zero); color: #9ca3af; font-weight: 600; margin-right: 8px; }
  .gd-inline-toc a { color: #1B2A4E; text-decoration: none; }
  @media (min-width: 1024px) { .gd-inline-toc { display: none; } }
  @media (max-width: 600px) { .gd-inline-toc ol { columns: 1; } }

  .gd-content { color: #1B2A4E; min-width: 0; max-width: 720px; }
  .gd-content > *:first-child { margin-top: 0 !important; }
  .gd-content h2 { font-size: 22px; font-weight: 600; color: #1B2A4E; line-height: 1.25; margin: 32px 0 12px; letter-spacing: -.005em; scroll-margin-top: 24px; }
  .gd-content h2::before { content: ''; display: block; width: 32px; height: 2px; background: #2D9CDB; margin-bottom: 10px; }
  .gd-content h3 { font-size: 15px; font-weight: 700; color: #1B2A4E; margin: 22px 0 8px; }
  .gd-content p { font-size: 14.5px; line-height: 1.7; color: #4b5563; margin: 0 0 12px; }
  .gd-content ul, .gd-content ol { font-size: 14.5px; line-height: 1.7; color: #4b5563; margin: 0 0 12px; padding-left: 22px; }
  .gd-content li { margin-bottom: 5px; }
  .gd-content strong { color: #1B2A4E; font-weight: 600; }
  .gd-content a { color: #2D9CDB; font-weight: 500; text-decoration: none; }
  .gd-content a:hover { text-decoration: underline; }

  .gd-table { width: 100%; border-collapse: collapse; margin: 12px 0 24px; font-size: 13.5px; background: #fff; border: 1px solid rgba(27,42,78,0.08); }
  .gd-table th { background: #F7F9FC; color: #1B2A4E; font-size: 10px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; padding: 12px 14px; text-align: left; border-bottom: 1px solid rgba(27,42,78,0.08); }
  .gd-table td { padding: 12px 14px; border-bottom: 1px solid rgba(27,42,78,0.06); vertical-align: top; color: #4b5563; }
  .gd-table tr:last-child td { border-bottom: none; }
  .gd-table td:first-child { color: #1B2A4E; font-weight: 500; }

  .gd-faq { border-bottom: 1px solid rgba(27,42,78,0.10); padding: 2px 0; }
  .gd-faq summary { cursor: pointer; padding: 16px 0; font-size: 14.5px; font-weight: 600; color: #1B2A4E; list-style: none; position: relative; padding-right: 36px; }
  .gd-faq summary::-webkit-details-marker { display: none; }
  .gd-faq summary::after { content: '+'; position: absolute; right: 0; top: 50%; transform: translateY(-50%); font-size: 22px; color: #2D9CDB; font-weight: 400; line-height: 1; }
  .gd-faq[open] summary::after { content: '−'; }
  .gd-faq .a { padding: 0 0 16px; font-size: 14px; line-height: 1.7; color: #4b5563; }

  .gd-callout { padding: 16px 20px; margin: 20px 0; font-size: 14px; line-height: 1.65; border-left: 3px solid #D97706; background: #FEF7E6; color: #92400E; }
  .gd-callout strong { color: #92400E; }
  .gd-callout ul { color: #92400E; margin: 8px 0 0; padding-left: 22px; }


  /* ──────── Editorial design system, consolidated from the live About page ────────
     Used on About, Contact Us, Reimbursement, Collagen 101, Compression 101. */
  .ova-container { max-width: 1280px; margin: 0 auto; padding: 0 16px; }
  @media (min-width: 640px) { .ova-container { padding: 0 24px; } }
  @media (min-width: 1024px) { .ova-container { padding: 0 32px; } }

  .ova-eyebrow { font-size: 10px; letter-spacing: 0.28em; text-transform: uppercase; color: #2D9CDB; font-weight: 600; margin-bottom: 16px; display: block; }

  /* Navy gradient hero */
  .ova-hero { position: relative; overflow: hidden; background: linear-gradient(135deg, #1B2A4E, #2D9CDB); padding: 56px 0; }
  @media (min-width: 1024px) { .ova-hero { padding: 80px 0; } }
  .ova-hero-glow { position: absolute; top: -100px; right: -100px; width: 400px; height: 400px; background: rgba(255,255,255,0.08); border-radius: 50%; filter: blur(80px); }
  .ova-hero-inner { position: relative; max-width: 720px; }
  .ova-hero-h1 { font-size: clamp(28px, 4vw, 44px); font-weight: 600; color: #fff; line-height: 1.15; margin: 0 0 16px; letter-spacing: -.01em; }
  .ova-hero-desc { color: rgba(255,255,255,0.85); font-size: 15px; line-height: 1.7; max-width: 600px; margin: 0; }
  @media (min-width: 1024px) { .ova-hero-desc { font-size: 16px; } }

  /* Editorial body sections */
  .ova-section { padding: 56px 0; background: #fff; }
  @media (min-width: 1024px) { .ova-section { padding: 80px 0; } }
  .ova-section--alt { background: #F7F9FC; }
  .ova-section-inner { max-width: 880px; margin: 0 auto; color: #1B2A4E; }

  .ova-section h2 { font-size: clamp(22px, 3vw, 30px); font-weight: 600; color: #1B2A4E; line-height: 1.2; margin: 40px 0 14px; letter-spacing: -.005em; }
  .ova-section h2:first-child { margin-top: 0; }
  .ova-section h3 { font-size: 16px; font-weight: 600; color: #1B2A4E; margin: 26px 0 8px; }
  .ova-section p { font-size: 15px; line-height: 1.75; color: #4b5563; margin: 0 0 14px; }
  .ova-section ul, .ova-section ol { font-size: 15px; line-height: 1.75; color: #4b5563; margin: 0 0 14px; padding-left: 22px; }
  .ova-section li { margin-bottom: 6px; }
  .ova-section strong { color: #1B2A4E; font-weight: 600; }
  .ova-section a { color: #2D9CDB; text-decoration: none; font-weight: 500; }
  .ova-section a:hover { text-decoration: underline; }

  /* TOC */
  .ova-toc { background: #F7F9FC; border: 1px solid rgba(27,42,78,0.08); padding: 24px 28px; margin: 24px 0 40px; }
  .ova-toc .label { font-size: 10px; letter-spacing: 0.28em; text-transform: uppercase; color: #2D9CDB; font-weight: 600; margin: 0 0 14px; }
  .ova-toc ol { list-style: none; counter-reset: tt; padding: 0; margin: 0; columns: 2; column-gap: 28px; }
  .ova-toc li { counter-increment: tt; padding: 5px 0; font-size: 13.5px; }
  .ova-toc li::before { content: counter(tt, decimal-leading-zero); color: #2D9CDB; font-weight: 700; letter-spacing: .1em; margin-right: 10px; }
  .ova-toc a { color: #1B2A4E; text-decoration: none; }
  .ova-toc a:hover { color: #2D9CDB; }
  @media (max-width: 700px) { .ova-toc ol { columns: 1; } }

  /* Card grid (same vibe as ova-cred) */
  .ova-card-grid { display: grid; grid-template-columns: 1fr; gap: 16px; margin: 20px 0 28px; }
  @media (min-width: 640px) { .ova-card-grid { grid-template-columns: 1fr 1fr; } }
  .ova-card-grid--3 { grid-template-columns: 1fr; }
  @media (min-width: 640px) { .ova-card-grid--3 { grid-template-columns: 1fr 1fr 1fr; } }
  .ova-card { background: #fff; border: 1px solid rgba(27,42,78,0.10); padding: 24px 28px; transition: background 0.2s; }
  .ova-card:hover { background: #F0F7FD; }
  .ova-card h3 { font-size: 15px; font-weight: 600; color: #1B2A4E; margin: 0 0 10px; line-height: 1.3; }
  .ova-card p { font-size: 14px; line-height: 1.7; color: #6b7280; margin: 0; }
  .ova-card a { color: #2D9CDB; font-weight: 500; }

  /* Tables, editorial weight */
  .ova-table { width: 100%; border-collapse: collapse; margin: 14px 0 24px; font-size: 14px; background: #fff; border: 1px solid rgba(27,42,78,0.08); }
  .ova-table th { background: #F7F9FC; color: #1B2A4E; font-size: 10px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; padding: 14px 18px; text-align: left; border-bottom: 1px solid rgba(27,42,78,0.08); }
  .ova-table td { padding: 14px 18px; border-bottom: 1px solid rgba(27,42,78,0.06); vertical-align: top; color: #4b5563; }
  .ova-table tr:last-child td { border-bottom: none; }
  .ova-table td:first-child { color: #1B2A4E; font-weight: 500; }
  .ova-table code { font-family: ui-monospace, "SF Mono", Menlo, monospace; background: #F7F9FC; padding: 2px 7px; font-size: 12.5px; color: #1B2A4E; border: 1px solid rgba(27,42,78,0.08); }

  /* FAQ accordion */
  .ova-faq { border-bottom: 1px solid rgba(27,42,78,0.10); padding: 4px 0; }
  .ova-faq summary { cursor: pointer; padding: 20px 0; font-size: 15px; font-weight: 600; color: #1B2A4E; list-style: none; position: relative; padding-right: 40px; }
  .ova-faq summary::-webkit-details-marker { display: none; }
  .ova-faq summary::after { content: '+'; position: absolute; right: 0; top: 50%; transform: translateY(-50%); font-size: 24px; color: #2D9CDB; font-weight: 400; line-height: 1; }
  .ova-faq[open] summary::after { content: '−'; }
  .ova-faq .a { padding: 0 0 20px; font-size: 14.5px; line-height: 1.75; color: #4b5563; }

  /* Callouts */
  .ova-callout { padding: 20px 24px; margin: 24px 0; font-size: 14.5px; line-height: 1.7; border-left: 3px solid #2D9CDB; background: #F0F7FD; color: #1B2A4E; }
  .ova-callout--warn { border-left-color: #D97706; background: #FEF7E6; color: #92400E; }
  .ova-callout--good { border-left-color: #10B981; background: #ECFDF5; color: #065F46; }
  .ova-callout strong { color: inherit; }
  .ova-callout--warn strong { color: #92400E; }
  .ova-callout--good strong { color: #065F46; }

  /* CTA band */
  .ova-cta-band { background: #1B2A4E; color: #fff; padding: 56px 0; }
  .ova-cta-band h2 { color: #fff; font-size: clamp(22px, 3vw, 28px); font-weight: 600; margin: 8px 0 14px; }
  .ova-cta-band p { color: rgba(255,255,255,0.82); font-size: 15px; line-height: 1.7; margin: 0 0 8px; max-width: 720px; }
  .ova-cta-band a { color: #2D9CDB; font-weight: 600; text-decoration: none; }
  .ova-cta-band a:hover { color: #fff; text-decoration: underline; }
  .ova-cta-band em { color: rgba(255,255,255,0.55); font-size: 13px; }

  /* Doctor photo treatment (re-used from live About) */
  .ova-doctor-grid { display: grid; grid-template-columns: 1fr; gap: 48px; align-items: start; }
  @media (min-width: 900px) { .ova-doctor-grid { grid-template-columns: 1fr 1fr; gap: 64px; } }
  .ova-doctor-photo-wrap { position: relative; align-self: stretch; min-height: 500px; }
  .ova-doctor-photo-wrap > .frame { position: absolute; inset: 0; border: 4px solid #fff; box-shadow: 0 25px 60px rgba(0,0,0,0.12); overflow: hidden; }
  .ova-doctor-photo-wrap > .frame img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: top center; }
  .ova-doctor-badge { position: absolute; bottom: 16px; right: -8px; background: #2D9CDB; color: #fff; padding: 14px 20px; z-index: 2; }
  .ova-doctor-badge p { margin: 0; }
  .ova-doctor-badge .b1 { font-size: 10px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; }
  .ova-doctor-badge .b2 { font-size: 10px; color: rgba(255,255,255,0.8); margin-top: 4px; }
  .ova-doctor h2 { font-size: clamp(22px, 3vw, 32px); font-weight: 600; color: #1B2A4E; line-height: 1.25; margin: 0 0 8px; }
  .ova-doctor .role { font-size: 16px; color: #6b7280; margin: 0 0 24px; }
  .ova-doctor .bio { display: flex; flex-direction: column; gap: 16px; margin-bottom: 32px; }
  .ova-doctor .bio p { font-size: 14.5px; color: #4b5563; line-height: 1.75; margin: 0; }
  .ova-doctor .bio p.mission { color: #1B2A4E; font-weight: 600; }
  .ova-creds { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .ova-cred { border: 1px solid rgba(27,42,78,0.10); background: #F7F9FC; padding: 16px; }
  .ova-cred svg { color: #2D9CDB; margin-bottom: 8px; }
  .ova-cred .t1 { font-size: 11px; font-weight: 600; color: #1B2A4E; margin: 0 0 2px; }
  .ova-cred .t2 { font-size: 10px; color: #9ca3af; margin: 0; }

  /* Editorial form (Contact) */
  .ova-form { background: #fff; border: 1px solid rgba(27,42,78,0.08); padding: 32px; max-width: 640px; }
  .ova-form .row { margin-bottom: 16px; }
  .ova-form label { display: block; font-size: 11px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: #1B2A4E; margin-bottom: 8px; }
  .ova-form input, .ova-form textarea { width: 100%; border: 1px solid rgba(27,42,78,0.15); padding: 13px 16px; font-size: 15px; font-family: inherit; background: #fff; color: #1B2A4E; }
  .ova-form input:focus, .ova-form textarea:focus { outline: 2px solid #2D9CDB; outline-offset: -2px; border-color: #2D9CDB; }
  .ova-form button { background: #1B2A4E; color: #fff; border: none; padding: 14px 28px; font-size: 14px; font-weight: 600; cursor: pointer; letter-spacing: 0.08em; text-transform: uppercase; font-family: inherit; }
  .ova-form button:hover { background: #2D9CDB; }

  /* PDP buy box (kept for product pages, sits next to ova-* vocab) */
  .ova-pdp-buy { display: grid; grid-template-columns: 1fr; gap: 32px; margin: 24px 0 40px; padding: 32px; background: #F7F9FC; border: 1px solid rgba(27,42,78,0.08); }
  @media (min-width: 768px) { .ova-pdp-buy { grid-template-columns: 1fr 360px; } }
  .ova-pdp-photo { aspect-ratio: 1/1; background: linear-gradient(135deg, #1B2A4E 0%, #2D9CDB 100%); display: grid; place-items: center; color: #fff; font-size: 13px; letter-spacing: .04em; }
  .ova-pdp-price { font-size: 10px; color: #6b7280; letter-spacing: 0.18em; text-transform: uppercase; margin: 0 0 14px; }
  .ova-pdp-badges { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 20px; }
  .ova-pdp-badge { display: inline-block; padding: 5px 11px; background: #fff; border: 1px solid #2D9CDB; color: #2D9CDB; font-size: 11px; font-weight: 600; letter-spacing: 0.02em; }
  .ova-pdp-size-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; margin: 6px 0 20px; }
  .ova-pdp-size { padding: 12px; text-align: center; border: 1px solid rgba(27,42,78,0.15); background: #fff; font-size: 13px; color: #4b5563; cursor: pointer; }
  .ova-pdp-size--active { border-color: #1B2A4E; border-width: 1.5px; color: #1B2A4E; font-weight: 600; }
  .ova-pdp-cart { width: 100%; padding: 16px; background: #1B2A4E; color: #fff; border: none; font-size: 14px; font-weight: 600; cursor: pointer; letter-spacing: 0.08em; text-transform: uppercase; font-family: inherit; }
  .ova-pdp-cart:hover { background: #2D9CDB; }

  /* Use-case grid for PDPs */
  .ova-use-grid { display: grid; grid-template-columns: 1fr; gap: 10px; margin: 16px 0 24px; }
  @media (min-width: 640px) { .ova-use-grid { grid-template-columns: 1fr 1fr 1fr; } }
  .ova-use-cell { padding: 18px 20px; background: #F7F9FC; border: 1px solid rgba(27,42,78,0.08); font-size: 14px; color: #1B2A4E; font-weight: 500; line-height: 1.5; }


  /* New-page additions to Ovena design system, match .ov-* tokens */
  .ov-page-hero { padding: 56px 16px 32px; background: #fff; }
  @media (min-width: 1024px) { .ov-page-hero { padding: 96px 32px 56px; } }
  .ov-page-hero-inner { max-width: 880px; margin: 0 auto; }
  .ov-page-h1 { font-size: 32px; font-weight: 600; color: #1B2A4E; line-height: 1.1; letter-spacing: -.01em; margin: 8px 0 16px; }
  @media (min-width: 1024px) { .ov-page-h1 { font-size: 44px; } }
  .ov-page-lede { font-size: 17px; line-height: 1.6; color: #4B5563; max-width: 720px; margin: 0 0 8px; }

  .ov-content { padding: 32px 16px 96px; background: #fff; }
  @media (min-width: 1024px) { .ov-content { padding: 48px 32px 120px; } }
  .ov-content-inner { max-width: 880px; margin: 0 auto; color: #1B2A4E; }
  .ov-content h2 { font-size: 22px; font-weight: 600; color: #1B2A4E; line-height: 1.2; margin: 48px 0 14px; letter-spacing: -.005em; }
  @media (min-width: 1024px) { .ov-content h2 { font-size: 26px; } }
  .ov-content h3 { font-size: 16px; font-weight: 600; color: #1B2A4E; margin: 28px 0 8px; }
  .ov-content p { font-size: 15px; line-height: 1.7; color: #4B5563; margin: 0 0 14px; }
  .ov-content ul, .ov-content ol { font-size: 15px; line-height: 1.7; color: #4B5563; margin: 0 0 14px; padding-left: 22px; }
  .ov-content li { margin-bottom: 6px; }
  .ov-content strong { color: #1B2A4E; font-weight: 600; }
  .ov-content a { color: #2D9CDB; text-decoration: none; font-weight: 500; }
  .ov-content a:hover { text-decoration: underline; }

  .ov-toc { background: #F9FAFB; border: 1px solid #E5E7EB; border-radius: 12px; padding: 20px 24px; margin: 24px 0 32px; }
  .ov-toc-label { font-size: 10px; letter-spacing: .2em; text-transform: uppercase; color: #2D9CDB; font-weight: 600; margin: 0 0 12px; }
  .ov-toc ol { list-style: none; counter-reset: tt; padding: 0; margin: 0; columns: 2; column-gap: 24px; }
  .ov-toc li { counter-increment: tt; padding: 4px 0; font-size: 14px; }
  .ov-toc li::before { content: counter(tt, decimal-leading-zero) "  "; color: #2D9CDB; font-weight: 600; margin-right: 6px; }
  .ov-toc a { color: #1B2A4E; }
  @media (max-width: 700px) { .ov-toc ol { columns: 1; } }

  .ov-card-grid { display: grid; gap: 16px; grid-template-columns: 1fr; margin: 16px 0 24px; }
  @media (min-width: 640px) { .ov-card-grid { grid-template-columns: 1fr 1fr; } }
  .ov-card { background: #fff; border: 1px solid #E5E7EB; border-radius: 12px; padding: 24px 28px; transition: background 0.2s; }
  .ov-card:hover { background: #F0F7FD; }
  .ov-card h3 { color: #1B2A4E; font-size: 15px; font-weight: 600; margin: 0 0 8px; }
  .ov-card p { font-size: 14px; line-height: 1.65; color: #6B7280; margin: 0; }

  .ov-table { width: 100%; border-collapse: collapse; margin: 14px 0 24px; font-size: 14px; background: #fff; border: 1px solid #E5E7EB; border-radius: 12px; overflow: hidden; }
  .ov-table th { background: #F9FAFB; color: #1B2A4E; font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; padding: 12px 16px; text-align: left; border-bottom: 1px solid #E5E7EB; }
  .ov-table td { padding: 14px 16px; border-bottom: 1px solid #F3F4F6; vertical-align: top; color: #4B5563; }
  .ov-table tr:last-child td { border-bottom: none; }
  .ov-table td:first-child { color: #1B2A4E; font-weight: 500; }
  .ov-table code { font-family: ui-monospace, "SF Mono", Menlo, monospace; background: #F3F4F6; padding: 2px 6px; border-radius: 4px; font-size: 12.5px; color: #1B2A4E; }

  .ov-faq { border-bottom: 1px solid #E5E7EB; padding: 4px 0; }
  .ov-faq summary { cursor: pointer; padding: 18px 0; font-size: 15px; font-weight: 600; color: #1B2A4E; list-style: none; position: relative; padding-right: 36px; }
  .ov-faq summary::-webkit-details-marker { display: none; }
  .ov-faq summary::after { content: '+'; position: absolute; right: 0; top: 50%; transform: translateY(-50%); font-size: 24px; color: #2D9CDB; font-weight: 400; line-height: 1; }
  .ov-faq[open] summary::after { content: '−'; }
  .ov-faq .a { padding: 0 0 18px; font-size: 14.5px; line-height: 1.65; color: #4B5563; }

  .ov-callout { padding: 18px 22px; border-radius: 10px; margin: 20px 0; font-size: 14.5px; line-height: 1.6; }
  .ov-callout-info { background: #F0F7FD; border-left: 3px solid #2D9CDB; color: #1B2A4E; }
  .ov-callout-warn { background: #FEF7E6; border-left: 3px solid #D97706; color: #92400E; }
  .ov-callout-good { background: #ECFDF5; border-left: 3px solid #10B981; color: #065F46; }

  .ov-cta-block { background: #1B2A4E; color: #fff; padding: 32px 32px 28px; border-radius: 14px; margin: 32px 0 0; }
  .ov-cta-block h2 { color: #fff; margin: 0 0 8px; font-size: 22px; }
  .ov-cta-block p { color: rgba(255,255,255,0.82); margin: 0 0 8px; font-size: 15px; }
  .ov-cta-block a { color: #2D9CDB; font-weight: 600; }

  .ov-use-grid { display: grid; grid-template-columns: 1fr; gap: 10px; margin: 16px 0 24px; }
  @media (min-width: 640px) { .ov-use-grid { grid-template-columns: 1fr 1fr 1fr; } }
  .ov-use-cell { padding: 16px 20px; background: #F9FAFB; border: 1px solid #E5E7EB; border-radius: 10px; font-size: 14px; color: #1B2A4E; font-weight: 500; line-height: 1.5; }

  /* Mini buy box for PDP mockups */
  .ov-pdp-buy { display: grid; grid-template-columns: 1fr; gap: 32px; margin: 24px 0 40px; padding: 32px; background: #F9FAFB; border: 1px solid #E5E7EB; border-radius: 14px; }
  @media (min-width: 768px) { .ov-pdp-buy { grid-template-columns: 1fr 360px; } }
  .ov-pdp-photo { aspect-ratio: 1/1; background: linear-gradient(135deg, #1B2A4E 0%, #2D9CDB 100%); border-radius: 10px; display: grid; place-items: center; color: #fff; font-size: 14px; letter-spacing: .04em; }
  .ov-pdp-price { font-size: 12px; color: #6B7280; letter-spacing: .12em; text-transform: uppercase; margin: 0 0 12px; }
  .ov-pdp-badges { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 18px; }
  .ov-pdp-badge { display: inline-block; padding: 5px 10px; background: #fff; border: 1px solid #2D9CDB; color: #2D9CDB; border-radius: 4px; font-size: 11px; font-weight: 600; letter-spacing: .02em; }
  .ov-pdp-size-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; margin: 6px 0 18px; }
  .ov-pdp-size { padding: 11px; text-align: center; border: 1px solid #E5E7EB; background: #fff; border-radius: 6px; font-size: 13px; color: #4B5563; cursor: pointer; }
  .ov-pdp-size--active { border-color: #1B2A4E; border-width: 1.5px; color: #1B2A4E; font-weight: 600; }
  .ov-pdp-cart { width: 100%; padding: 14px; background: #1B2A4E; color: #fff; border: none; border-radius: 8px; font-size: 15px; font-weight: 600; cursor: pointer; letter-spacing: .04em; font-family: inherit; }
  .ov-pdp-cart:hover { background: #2D9CDB; }


.ov-shop-mega { position: relative; }
.ov-shop-mega > a { cursor: pointer; }
.ov-shop-mega .ov-flyout { position:absolute; background:#fff; min-width:220px; border:1px solid rgba(27,42,78,0.10); border-radius:6px; padding:8px 0; box-shadow:0 8px 24px rgba(27,42,78,0.12); opacity:0; visibility:hidden; pointer-events:none; transition:opacity .15s, visibility .15s; }
.ov-shop-mega .ov-l1 { top:100%; left:0; z-index:60; }
.ov-shop-mega:hover > .ov-l1 { opacity:1; visibility:visible; pointer-events:auto; }
.ov-menu-item { position:relative; }
.ov-menu-item > a { display:flex; align-items:center; justify-content:space-between; padding:10px 18px; font-size:13.5px; color:#1B2A4E; text-decoration:none; white-space:nowrap; }
.ov-menu-item > a:hover { background:#F7F9FC; color:#2D9CDB; }
.ov-menu-item.has-sub > a::after { content:'›'; color:#9ca3af; font-size:15px; margin-left:14px; }
.ov-menu-item > .ov-flyout { top:-9px; left:100%; z-index:61; }
.ov-menu-item:hover > .ov-flyout { opacity:1; visibility:visible; pointer-events:auto; }


.ov-header-nav > a, .ov-header-nav > span > a, .ov-shop-mega > a, .ov-has-dropdown > a, .ov-res-dropdown > a, .ov-learn-mega > a {
  position: relative; padding: 8px 6px 8px; border-bottom: 3px solid transparent; border-radius: 4px 4px 0 0; transition: color .18s ease, border-color .18s ease, background-color .18s ease;
}
.ov-header-nav > a:hover, .ov-header-nav > span > a:hover, .ov-shop-mega:hover > a, .ov-has-dropdown:hover > a, .ov-res-dropdown:hover > a, .ov-learn-mega:hover > a {
  color: #2D9CDB !important; border-bottom: 3px solid #2D9CDB !important; background-color: rgba(45,156,219,0.08) !important;
}
.ov-header-nav a.ov-active { color: #2D9CDB !important; border-bottom: 3px solid #2D9CDB !important; }
/* Resources dropdown */
.ov-res-dropdown { position: relative; }
.ov-res-dropdown .ov-res-menu { position:absolute; top:100%; left:50%; transform:translateX(-50%); background:#fff; min-width:220px; border:1px solid rgba(27,42,78,0.10); border-radius:6px; padding:8px 0; box-shadow:0 8px 24px rgba(27,42,78,0.12); opacity:0; visibility:hidden; pointer-events:none; transition:opacity .15s, visibility .15s; z-index:60; }
.ov-res-dropdown:hover .ov-res-menu { opacity:1; visibility:visible; pointer-events:auto; }
.ov-res-menu a { display:block; padding:9px 18px; font-size:13.5px; color:#1B2A4E; text-decoration:none; white-space:nowrap; border-bottom:0 !important; }
.ov-res-menu a:hover { background:#F7F9FC; color:#2D9CDB; }

.ov-has-dropdown:hover .ov-dropdown{opacity:1 !important;visibility:visible !important;pointer-events:auto !important;}.ov-has-dropdown .ov-dropdown a:hover{background:#F7F9FC;color:#2D9CDB;}

.ov-learn-mega { position: relative; display: inline-block; }
.ov-learn-mega > a { padding: 4px 0; border-bottom: 2px solid transparent; cursor: pointer; }
.ov-learn-mega:hover > a { border-bottom-color: #2D9CDB; color: #2D9CDB; }

/* ALL flyouts inside the Learn mega-nav are absolute-positioned + hidden by default */
.ov-learn-mega .ov-flyout {
  position: absolute !important;
  background: #fff;
  min-width: 240px;
  border: 1px solid rgba(27,42,78,0.10);
  border-radius: 6px;
  padding: 8px 0;
  box-shadow: 0 8px 24px rgba(27,42,78,0.12);
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transition: opacity .15s, visibility .15s;
}

/* L1 (drops below "Learn") */
.ov-learn-mega .ov-l1 { top: 100%; left: 0; z-index: 60; margin-top: 4px; }
.ov-learn-mega:hover > .ov-l1 {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

/* Menu items (in all levels) */
.ov-learn-mega .ov-menu-item { position: relative; }
.ov-learn-mega .ov-menu-item > a {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 18px; font-size: 13.5px; color: #1B2A4E;
  text-decoration: none; white-space: nowrap;
}
.ov-learn-mega .ov-menu-item > a:hover { background: #F7F9FC; color: #2D9CDB; }
.ov-learn-mega .ov-menu-item.has-sub > a::after {
  content: '›'; color: #9ca3af; font-size: 15px; margin-left: 14px;
}

/* L2, sub-flyouts slide out to the right of their parent menu-item */
.ov-learn-mega .ov-menu-item > .ov-flyout {
  top: -9px !important;
  left: 100% !important;
  z-index: 61;
  min-width: 260px;
}
.ov-learn-mega .ov-menu-item:hover > .ov-flyout {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}


/* Transparent header, no border-bottom. Logo sized to fit header padding (~20px top+bottom). */
header.ov-header {
  background: transparent !important;
  border-bottom: 0 !important;
  overflow: visible !important;
}
header.ov-header > div {
  overflow: visible !important;
}
header.ov-header a[href*="index"] {
  display: inline-block !important;
  line-height: 0 !important;
  overflow: visible !important;
}
header.ov-header img[alt="Ovena Health"] {
  max-height: 100px !important;
  height: auto !important;
  width: auto !important;
  object-fit: contain !important;
  display: block !important;
  margin: 0 auto !important;
  vertical-align: middle !important;
}
/* Mobile: scale down */
@media (max-width: 720px) {
  header.ov-header img[alt="Ovena Health"] {
    max-height: 70px !important;
  }
}


/* Unified brand: Assistant (sans-serif) for ALL hero text sitewide.
   Boosted specificity with body-prefix to defeat any per-page rules. */

/* H1 selectors */
body .ova-hero-h1,
body .hero h1, body .ova-hero h1, body .ovh-hero h1, body .ov-hero h1,
body section[class*="hero"] h1,
body .gh-hero h1, body .lcg-hero h1, body .lcp-hero h1,
body .ov-rl-hero h1, body .ov-cmp-hero h1,
body .ovp-h1, body .product__title,
body header + section h1, body header + section > .container h1,
body .post-hero h1,
body main h1 {
  font-family: Assistant, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
  letter-spacing: -0.02em !important;
  font-weight: 600 !important;
}

/* Hero dek / subtitle paragraphs */
body .post-hero p, body .post-dek,
body .gh-hero p, body .ov-rl-dek, body .ov-cmp-dek,
body .ova-hero p, body .ovh-hero p, body .ov-hero p,
body section[class*="hero"] p,
body .ova-hero-sub, body .ovh-hero-sub,
body .lcg-hero p, body .lcp-hero p {
  font-family: Assistant, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}

/* Hero kicker */
body .gh-hero .kicker, body .ov-rl-hero .kicker, body .ov-cmp-hero .kicker,
body .post-hero .kicker, body .ova-hero .kicker, body .kicker {
  font-family: Assistant, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}

/* CANONICAL hero background gradient sitewide.
   Excludes .col-hero (white-bg collection hero with dark navy text), .post-hero,
   .lp-hero (landing page hero with custom backgrounds), .ovp-hero (PDP hero). */
body .ova-hero, body .ovh-hero, body .ov-hero,
body .gh-hero, body .ov-rl-hero, body .ov-cmp-hero,
body section.page-hero,
body section[class*="hero"]:not(.post-hero):not(.col-hero):not(.lp-hero):not(.ovp-hero):not(.lcg-hero):not(.lcp-hero) {
  background: linear-gradient(135deg, #1B2A4E 0%, #2D4060 100%) !important;
}


/* Canonical lower-page CTA band, applied to both .ov-dist and .ova-cta-band */
body .ov-dist,
body .ova-cta-band {
  background: #1B2A4E !important;
  color: #fff !important;
  padding: 56px 24px !important;
  margin: 0 !important;
  font-family: Assistant, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}

/* Inner container width consistent with hero (1180px) */
body .ov-dist-inner,
body .ova-cta-band .ova-container {
  max-width: 1280px !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

/* Eyebrow, boosted specificity so it wins over body .ov-dist p */
body .ov-dist p.ov-dist-eyebrow,
body .ova-cta-band span.ova-eyebrow,
body .ov-dist-eyebrow,
body .ova-cta-band .ova-eyebrow {
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: #7FB8E0 !important;
  margin: 0 0 14px !important;
  display: block !important;
  max-width: none !important;
  line-height: 1.4 !important;
}

/* Headlines (h2/h3) */
body .ov-dist h2, body .ov-dist h3, body .ov-dist-h3,
body .ova-cta-band h2, body .ova-cta-band h3 {
  color: #fff !important;
  font-size: clamp(24px, 3vw, 32px) !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  letter-spacing: -0.02em !important;
  margin: 0 0 14px !important;
  font-family: Assistant, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}

/* Body text */
body .ov-dist p, body .ov-dist-desc,
body .ova-cta-band p {
  color: rgba(255,255,255,0.86) !important;
  font-size: 15.5px !important;
  line-height: 1.65 !important;
  margin: 0 0 8px !important;
  max-width: 720px !important;
}

/* Inline link color */
body .ov-dist a:not(.ov-dist-btn),
body .ova-cta-band a {
  color: #7FB8E0 !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}
body .ov-dist a:not(.ov-dist-btn):hover,
body .ova-cta-band a:hover {
  color: #fff !important;
  text-decoration: underline !important;
}

/* Primary CTA button, white pill on the navy band (matches page-hero btn-primary) */
body .ov-dist-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  background: #fff !important;
  color: #1B2A4E !important;
  padding: 13px 24px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  border-radius: 4px !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
  font-family: inherit !important;
  transition: background 0.2s, color 0.2s !important;
}
body .ov-dist-btn:hover {
  background: #7FB8E0 !important;
  color: #1B2A4E !important;
}

/* Layout: keep .ov-dist's flex layout (text left, button right) on wide screens */
@media (min-width: 768px) {
  body .ov-dist-inner {
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 40px !important;
  }
}


/* ============================================================
   CANONICAL HERO POSITIONING - identical layout across all heroes
   Kicker COLOR varies by page type (user OK'd that).
   Background gradient already normalized elsewhere.
   ============================================================ */

/* 1. Hero section: same padding sitewide */
body .page-hero,
body .gh-hero,
body .ov-rl-hero,
body .ov-cmp-hero,
body .ova-hero,
body .ovh-hero,
body .ov-hero,
body .post-hero,
body section[class*="hero"]:not(.lp-hero):not(.ovp-hero):not(.lcg-hero):not(.lcp-hero):not(.col-hero):not(.ova-hero):not(.ov-hero-new):not(.post-hero) {
  padding: 72px 24px 56px !important;
  text-align: left !important;
  margin: 0 !important;
}

/* 2. Inner container: same max-width sitewide */
body .page-hero .container,
body .page-hero-grid,
body .gh-hero-inner,
body .ov-rl-hero-inner,
body .ov-cmp-hero-inner,
body .ova-hero-inner,
body .ovh-hero > div,
body .ov-hero > div,
body .post-hero > div {
  max-width: 1280px !important;
  margin: 0 auto !important;
  text-align: left !important;
}

/* 3. Kicker: same margin, same typography (color preserved per-page) */
body .page-hero .kicker,
body .gh-hero .kicker,
body .ov-rl-hero .kicker,
body .ov-cmp-hero .kicker,
body .ova-hero .kicker,
body .post-hero .kicker {
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  margin: 0 0 14px !important;
  font-family: Assistant, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}

/* 4. H1: identical typography sitewide */
body .page-hero h1,
body .gh-hero h1,
body .ov-rl-hero h1,
body .ov-cmp-hero h1,
body .ova-hero h1, body .ova-hero-h1,
body .ovh-hero h1, body .ov-hero h1,
body .post-hero h1 {
  font-family: Assistant, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
  font-size: clamp(34px, 4.5vw, 50px) !important;
  font-weight: 600 !important;
  line-height: 1.15 !important;
  letter-spacing: -0.02em !important;
  margin: 0 0 18px !important;
  color: #fff !important;
  max-width: 820px !important;
}

/* 5. Lede / dek paragraph: identical typography sitewide.
   :not(.kicker):not(.label) so the kicker keeps its per-page color (user OK'd that). */
body .page-hero .lede,
body .gh-hero p:not(.kicker):not(.label),
body .gh-hero-inner > p:not(.kicker):not(.label),
body .ov-rl-hero .ov-rl-dek,
body .ov-rl-hero p:not(.kicker):not(.label),
body .ov-cmp-hero .ov-cmp-dek,
body .ov-cmp-hero p:not(.kicker):not(.label),
body .ova-hero p:not(.kicker):not(.label), body .ova-hero-desc,
body .ovh-hero p:not(.kicker):not(.label),
body .ov-hero p:not(.kicker):not(.label),
body .post-hero p:not(.kicker):not(.label), body .post-dek {
  font-family: Assistant, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
  font-size: 17px !important;
  line-height: 1.6 !important;
  color: rgba(255,255,255,0.88) !important;
  margin: 0 0 24px !important;
  max-width: 720px !important;
}

/* 6. CTA row: consistent spacing */
body .page-hero .cta-row,
body .gh-hero .cta-row,
body .ov-rl-hero .cta-row,
body .ov-cmp-hero .cta-row,
body .ova-hero .cta-row,
body .post-hero .cta-row {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  margin: 0 !important;
}

/* 7. Marketing page-hero 2-col grid (content + sidecard).
   Constrains content column so title/dek visual width matches learn pages. */
body .page-hero-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 340px) !important;
  gap: 56px !important;
  align-items: start !important;
  max-width: 1280px !important;
  margin: 0 auto !important;
}
@media (max-width: 900px) {
  body .page-hero-grid { grid-template-columns: 1fr !important; gap: 32px !important; }
}

/* 8. Sidecard: consistent treatment when present */
body .page-hero .sidecard {
  background: rgba(255,255,255,0.05) !important;
  border: 1px solid rgba(255,255,255,0.12) !important;
  border-radius: 10px !important;
  padding: 22px 24px !important;
}
body .page-hero .sidecard .label,
body .page-hero .sidecard p.label {
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: #7FB8E0 !important;
  margin: 0 0 12px !important;
}
body .page-hero .sidecard ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
body .page-hero .sidecard li {
  font-size: 14px !important;
  line-height: 1.55 !important;
  padding: 5px 0 !important;
  color: rgba(255,255,255,0.86) !important;
}

/* 9. Mobile breakpoint: maintain consistent padding scale */
@media (max-width: 600px) {
  body .page-hero, body .gh-hero, body .ov-rl-hero,
  body .ov-cmp-hero, body .ova-hero, body .post-hero {
    padding: 48px 20px 40px !important;
  }
  body .page-hero h1, body .gh-hero h1, body .ov-rl-hero h1,
  body .ov-cmp-hero h1, body .ova-hero h1, body .ova-hero-h1,
  body .post-hero h1 {
    font-size: clamp(28px, 7vw, 36px) !important;
  }
}


/* ─── BASE: prevent horizontal overflow at any viewport ──────────── */
html { -webkit-text-size-adjust: 100%; }
html, body {
  max-width: 100% !important;
  overflow-x: clip !important;
}
img, video, iframe, svg, canvas {
  max-width: 100% !important;
  height: auto;
}
/* Third-party widget iframes that hardcode wide widths get clamped */
iframe[style*="width:"][style*="px"] {
  max-width: 100vw !important;
}

/* ─── TYPOGRAPHY: fluid sizing on small screens ──────────────────── */
@media (max-width: 760px) {
  h1 { font-size: clamp(24px, 7vw, 36px) !important; line-height: 1.15 !important; }
  h2 { font-size: clamp(20px, 5.5vw, 28px) !important; line-height: 1.2 !important; }
  h3 { font-size: clamp(17px, 4.5vw, 22px) !important; }
}

/* ─── HERO: stack page-hero grid + reduce padding ────────────────── */
@media (max-width: 760px) {
  body .page-hero,
  body .gh-hero,
  body .ov-rl-hero,
  body .ov-cmp-hero,
  body .ova-hero,
  body .ov-hero-new {
    padding: 40px 18px 36px !important;
  }
  body .page-hero-grid,
  body .ov-hero-new > div:nth-child(2) {
    grid-template-columns: 1fr !important;
    gap: 28px !important;
  }
  body .page-hero .sidecard,
  body .ova-hero .sidecard {
    margin-top: 0 !important;
  }
}

/* ─── BULK CALCULATOR responsive collapse ────────────────────────── */
@media (max-width: 760px) {
  body main .ov-bulk-calc { padding: 44px 16px 56px !important; }
  body main .ov-bulk-calc .ov-bulk-tier-ladder { grid-template-columns: repeat(2, 1fr) !important; gap: 10px !important; }
  body main .ov-bulk-calc .ov-bulk-live { padding: 22px 18px 20px !important; }
  body main .ov-bulk-calc .ov-bulk-benefits { grid-template-columns: 1fr !important; }
  body main .ov-bulk-calc .ov-bulk-proof { grid-template-columns: 1fr !important; }
  body main .ov-bulk-calc .ov-bulk-live-readout { grid-template-columns: 1fr 1fr !important; gap: 14px 18px !important; }
  body main .ov-bulk-calc .ov-bulk-live-annual { flex-direction: column !important; align-items: stretch !important; text-align: left !important; }
  body main .ov-bulk-calc .ov-bulk-live-annual-cta { text-align: center !important; }
  body main .ov-bulk-calc strong.ov-bulk-live-readout-value { font-size: 20px !important; }
  body main .ov-bulk-calc strong.ov-bulk-live-readout-value.is-strike { font-size: 17px !important; }
  body main .ov-bulk-calc .ov-bulk-tier-step { padding: 16px 12px 14px !important; }
  body main .ov-bulk-calc .ov-bulk-tier-step-discount { font-size: 24px !important; }
}
@media (max-width: 480px) {
  body main .ov-bulk-calc .ov-bulk-tier-ladder { grid-template-columns: 1fr !important; }
}

/* ─── PAGE-SECTION (about, contact, etc) ─────────────────────────── */
@media (max-width: 760px) {
  body main .page-section,
  body main .ova-section { padding: 40px 16px !important; }
  body main .page-section .container,
  body main .page-section-head,
  body main .ova-container { padding: 0 !important; }
}

/* ─── HEADER: stack into 2 rows on phones ────────────────────────── */
@media (max-width: 860px) {
  header.ov-header { padding: 12px 16px !important; }
  header.ov-header > div { grid-template-columns: 1fr auto !important; gap: 10px !important; }
  header.ov-header nav { display: none !important; }
  header.ov-header img[alt="Ovena Health"] { max-height: 60px !important; }
  /* Show a hamburger affordance if a mobile-menu trigger exists; otherwise hide nav */
}

/* ─── STAGED-NAV: horizontal scroll on phones ────────────────────── */
@media (max-width: 760px) {
  .stage-nav .inner {
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    padding-bottom: 6px !important;
  }
  .stage-nav a, .stage-nav .group, .stage-nav .sep, .stage-nav .label {
    flex: 0 0 auto !important;
    white-space: nowrap !important;
  }
}

/* ─── TABLES: wrap in a scroll container ─────────────────────────── */
@media (max-width: 760px) {
  table { display: block !important; overflow-x: auto !important; -webkit-overflow-scrolling: touch !important; width: 100% !important; }
  .ova-table-wrap, .ovp-table-wrap { overflow-x: auto !important; -webkit-overflow-scrolling: touch !important; }
}

/* ─── COLLECTION + PRODUCT grids: 1 col on mobile ────────────────── */
@media (max-width: 760px) {
  .ova-card-grid, .ova-card-grid--3,
  .ova-pdp-buy,
  .ova-product-grid,
  .col-grid, .collection-grid,
  .ov-cmp-pricing-grid, .ov-cmp-row,
  .ovp-grid,
  .lcg-grid, .lcp-grid {
    grid-template-columns: 1fr !important;
  }
}

/* ─── LEARN article hero (.post-hero) ────────────────────────────── */
@media (max-width: 760px) {
  body .post-hero { padding: 28px 16px 24px !important; }
}

/* ─── FLOATING UTILITY BUTTONS spacing on small screens ──────────── */
@media (max-width: 480px) {
  #ov-preview-cart-btn { bottom: 78px !important; right: 12px !important; padding: 9px 14px !important; font-size: 11.5px !important; }
  #ov-clinical-chat-btn, .ov-clinical-chat-btn { bottom: 12px !important; right: 12px !important; padding: 10px 14px !important; font-size: 12px !important; }
  .ov-lang-toggle { top: 96px !important; right: 8px !important; }
  .ov-a11y-toggle { bottom: 70px !important; right: 14px !important; width: 38px !important; height: 38px !important; }
}

/* ─── EMAIL POPUP fits on phones ─────────────────────────────────── */
@media (max-width: 480px) {
  .ov-email-popup { width: calc(100% - 32px) !important; padding: 24px 22px !important; max-width: 360px !important; }
}

/* ─── COOKIE banner buttons wrap ─────────────────────────────────── */
@media (max-width: 600px) {
  .ov-cookie-banner { flex-direction: column !important; align-items: stretch !important; text-align: center !important; padding: 12px 16px !important; gap: 8px !important; }
  .ov-cookie-btn { width: 100% !important; padding: 10px !important; }
}

/* ─── FOOTER: stack columns ──────────────────────────────────────── */
@media (max-width: 760px) {
  footer.ov-footer > div, .ov-footer > div { flex-direction: column !important; gap: 32px !important; }
  footer.ov-footer > div > div { border-left: 0 !important; border-right: 0 !important; padding: 0 !important; }
}

/* ─── BAND CTAs ──────────────────────────────────────────────────── */
@media (max-width: 760px) {
  body .ov-dist-inner { flex-direction: column !important; gap: 22px !important; text-align: left !important; }
  body .ov-dist, body .ova-cta-band { padding: 36px 20px !important; }
}

/* ─── PROMOTION BARS: smaller on phones ──────────────────────────── */
@media (max-width: 480px) {
  .ov-ship-bar { font-size: 11.5px !important; padding: 6px 10px !important; }
  .ov-ship-progress { width: 80px !important; }
  .ov-promo-strip { font-size: 11px !important; padding: 7px 10px !important; }
  .ov-quiz-promo { font-size: 12px !important; padding: 8px 12px !important; }
}

/* ─── WIDE-SCREEN polish (≥1440) ─────────────────────────────────── */
@media (min-width: 1440px) {
  body .page-hero .container,
  body main .ov-bulk-calc .container,
  .ova-container { max-width: 1280px !important; }
}
@media (min-width: 1920px) {
  body .page-hero .container,
  body main .ov-bulk-calc .container,
  .ova-container { max-width: 1440px !important; }
}


/* ─── Learn nav dropdown stays open while cursor moves to it ───── */

/* Trigger anchor: extra vertical padding so the hover area extends down
   to where the dropdown sits, eliminating the dead zone. */
.ov-learn-mega { padding-bottom: 8px !important; }
.ov-learn-mega > a { padding: 4px 0 12px !important; }

/* L1 dropdown opens flush, not gapped */
.ov-learn-mega .ov-l1 {
  margin-top: 0 !important;
  top: calc(100% - 4px) !important;
  z-index: 200 !important;
}

/* Bridge: invisible filler above the L1 flyout that bridges any pixel
   gap between trigger and panel, keeping the hover continuous. */
.ov-learn-mega .ov-l1::before {
  content: '';
  position: absolute;
  top: -14px; left: 0; right: 0; height: 14px;
  background: transparent;
}

/* L2 sub-flyouts: bridge the left-edge gap when moving cursor from
   parent item into the submenu. */
.ov-learn-mega .ov-menu-item > .ov-flyout {
  top: -10px !important;
  left: calc(100% - 4px) !important;
  z-index: 201 !important;
}
.ov-learn-mega .ov-menu-item > .ov-flyout::before {
  content: '';
  position: absolute;
  top: 0; bottom: 0; left: -10px; width: 12px;
  background: transparent;
}

/* Slow the hide so accidental cursor flicks across the bridge don't
   kill the dropdown. Show is still snappy at .12s. */
.ov-learn-mega .ov-flyout {
  transition: opacity 0.12s ease-in, visibility 0.12s ease-in 0.15s !important;
}
.ov-learn-mega:hover .ov-l1,
.ov-learn-mega .ov-menu-item:hover > .ov-flyout {
  transition: opacity 0.12s ease-out, visibility 0s !important;
}

/* Also fix the .ov-shop-mega (Shop) dropdown using the same pattern,
   since it has the identical structure. */
.ov-shop-mega { padding-bottom: 8px !important; }
.ov-shop-mega > a { padding: 4px 0 12px !important; }
.ov-shop-mega .ov-l1 { margin-top: 0 !important; top: calc(100% - 4px) !important; z-index: 200 !important; }
.ov-shop-mega .ov-l1::before {
  content: ''; position: absolute; top: -14px; left: 0; right: 0; height: 14px; background: transparent;
}
.ov-shop-mega .ov-menu-item > .ov-flyout {
  top: -10px !important; left: calc(100% - 4px) !important; z-index: 201 !important;
}
.ov-shop-mega .ov-menu-item > .ov-flyout::before {
  content: ''; position: absolute; top: 0; bottom: 0; left: -10px; width: 12px; background: transparent;
}
.ov-shop-mega .ov-flyout {
  transition: opacity 0.12s ease-in, visibility 0.12s ease-in 0.15s !important;
}
.ov-shop-mega:hover .ov-l1,
.ov-shop-mega .ov-menu-item:hover > .ov-flyout {
  transition: opacity 0.12s ease-out, visibility 0s !important;
}

/* Also fix the small "Contact" dropdown (.ov-has-dropdown). */
.ov-has-dropdown { padding-bottom: 8px !important; }
.ov-has-dropdown .ov-dropdown {
  margin-top: 0 !important;
  top: calc(100% - 2px) !important;
  z-index: 200 !important;
}
.ov-has-dropdown .ov-dropdown::before {
  content: ''; position: absolute; top: -12px; left: 0; right: 0; height: 14px; background: transparent;
}
.ov-has-dropdown .ov-dropdown {
  transition: opacity 0.12s ease-in, visibility 0.12s ease-in 0.15s !important;
}
.ov-has-dropdown:hover .ov-dropdown {
  transition: opacity 0.12s ease-out, visibility 0s !important;
}


/* Give all top-nav anchors more space between the word and the
   underline indicator, overrides the inline `padding-bottom:4px`.
   Selectors boosted with [href] attribute matchers so they beat the
   existing `header.ov-header a[href*="index"]` logo-fix rule that
   was forcing line-height:0 on the Home anchor. */
header.ov-header nav > a[href],
header.ov-header nav > span > a[href],
header.ov-header .ov-header-nav > a[href],
header.ov-header .ov-header-nav > span > a[href],
header.ov-header .ov-shop-mega > a[href],
header.ov-header .ov-learn-mega > a[href],
header.ov-header .ov-has-dropdown > a[href],
header.ov-header .ov-res-dropdown > a[href] {
  padding-bottom: 10px !important;
  padding-top: 4px !important;
  line-height: 1.4 !important;
  display: inline-block !important;
}

/* The logo-fix CSS uses `header.ov-header a[href*="index"]` which would
   normally hijack the Home nav anchor (since both Home and logo point
   to index.html). Scope this even tighter: the Home link is inside
   <nav>, the logo is not. */
header.ov-header nav > a[href*="index"] {
  padding-bottom: 10px !important;
  padding-top: 4px !important;
  line-height: 1.4 !important;
  display: inline-block !important;
}

/* Active state (when on that page), same spacing, just colored underline */
header.ov-header nav > a.ov-active,
header.ov-header .ov-header-nav > a.ov-active,
header.ov-header .ov-header-nav > a.active,
header.ov-header nav > a[href*="index"].ov-active {
  border-bottom: 2px solid #2D9CDB !important;
  padding-bottom: 10px !important;
}


/* ═══ WIDE-SCREEN FIT, let content breathe on big monitors ═══════ */

/* Default desktop (≥1024), slight bump from 1180→1280 baseline */
@media (min-width: 1024px) {
  body main .ov-bulk-calc .container,
  body .page-hero .container,
  body .ova-container,
  body header.ov-header > div,
  body .ov-section-container,
  body section.ov-hero-new > div:nth-child(2),
  body .ov-bulk > div,
  body .ov-loyalty > div,
  body .ov-founder-video > div,
  body .ov-press > div,
  body .ov-diff > div,
  body .ov-who-head,
  body .ov-who-grid,
  body footer.ov-footer > div,
  body .ov-footer-grid {
    max-width: 1280px !important;
  }
}

/* Large desktop ≥1440, content uses 1320px */
@media (min-width: 1440px) {
  body main .ov-bulk-calc .container,
  body .page-hero .container,
  body .ova-container,
  body header.ov-header > div,
  body .ov-section-container,
  body section.ov-hero-new > div:nth-child(2),
  body .ov-bulk > div,
  body .ov-loyalty > div,
  body .ov-founder-video > div,
  body .ov-press > div,
  body .ov-diff > div,
  body .ov-who-head,
  body .ov-who-grid,
  body footer.ov-footer > div,
  body .ov-footer-grid {
    max-width: 1320px !important;
  }
  /* Page hero gives a touch more breathing room */
  body .page-hero { padding-left: 32px !important; padding-right: 32px !important; }
}

/* Wide ≥1600, content uses 1480px */
@media (min-width: 1600px) {
  body main .ov-bulk-calc .container,
  body .page-hero .container,
  body .ova-container,
  body header.ov-header > div,
  body .ov-section-container,
  body section.ov-hero-new > div:nth-child(2),
  body .ov-bulk > div,
  body .ov-loyalty > div,
  body .ov-founder-video > div,
  body .ov-press > div,
  body .ov-diff > div,
  body .ov-who-head,
  body .ov-who-grid,
  body footer.ov-footer > div,
  body .ov-footer-grid {
    max-width: 1480px !important;
  }
  body .ov-products-grid { gap: 24px !important; }
}

/* Full HD ≥1920, content uses 1640px (≈ 85% of viewport) */
@media (min-width: 1920px) {
  body main .ov-bulk-calc .container,
  body .page-hero .container,
  body .ova-container,
  body header.ov-header > div,
  body .ov-section-container,
  body section.ov-hero-new > div:nth-child(2),
  body .ov-bulk > div,
  body .ov-loyalty > div,
  body .ov-founder-video > div,
  body .ov-press > div,
  body .ov-diff > div,
  body .ov-who-head,
  body .ov-who-grid,
  body footer.ov-footer > div,
  body .ov-footer-grid {
    max-width: 1640px !important;
  }
  body section.ov-hero-new { padding: 96px 32px 104px !important; }
}

/* Ultra-wide ≥2400, content caps at 1800px */
@media (min-width: 2400px) {
  body main .ov-bulk-calc .container,
  body .page-hero .container,
  body .ova-container,
  body header.ov-header > div,
  body .ov-section-container,
  body section.ov-hero-new > div:nth-child(2),
  body .ov-bulk > div,
  body .ov-loyalty > div,
  body .ov-founder-video > div,
  body .ov-press > div,
  body .ov-diff > div,
  body .ov-who-head,
  body .ov-who-grid,
  body footer.ov-footer > div,
  body .ov-footer-grid {
    max-width: 1800px !important;
  }
}

/* ─── Clip overflowing decorative pseudo-elements ───────────────── */
body .ov-bulk { overflow: hidden !important; }
body .ov-bulk::before {
  right: 0 !important;
  width: clamp(200px, 25vw, 400px) !important;
  top: -60px !important;
  height: clamp(200px, 25vw, 400px) !important;
}
body .ov-loyalty { overflow: hidden !important; }
body .ov-founder-video { overflow: hidden !important; }
body section.ov-hero-new { overflow: hidden !important; }

/* ─── Iframes can't push the page wider ──────────────────────────── */
body iframe { max-width: 100% !important; }
body iframe[style*="width:"] { max-width: 100vw !important; }

/* ─── Stage-nav stays inside viewport at any width ─────────────── */
body .stage-nav { max-width: 100vw !important; box-sizing: border-box !important; }

/* ─── Products grid uses 4 columns on really wide screens ──────── */
@media (min-width: 1600px) {
  body .ov-products-grid { grid-template-columns: repeat(4, 1fr) !important; }
}


/* Widen hero h1 / lede so they use the wider containers on big screens.
   Mobile / small-tablet caps stay tight via normal flow. */
@media (min-width: 1280px) {
  body section.ov-hero-new h1 { max-width: 820px !important; }
  body section.ov-hero-new p:nth-child(3) { max-width: 720px !important; }
  body .page-hero h1 { max-width: 1040px !important; }
  body .page-hero .lede { max-width: 920px !important; }
  body .gh-hero h1 { max-width: 1040px !important; }
  body .gh-hero p:not(.kicker) { max-width: 920px !important; }
  body .ov-rl-hero h1 { max-width: 1040px !important; }
  body .ov-rl-hero .ov-rl-dek { max-width: 920px !important; }
  body .ov-cmp-hero h1 { max-width: 1040px !important; }
  body .ov-cmp-hero .ov-cmp-dek { max-width: 920px !important; }
  body .post-hero h1 { max-width: 22ch !important; }
  body .post-hero p.post-dek { max-width: 920px !important; }
}
@media (min-width: 1600px) {
  body section.ov-hero-new h1 { max-width: 920px !important; font-size: clamp(38px, 4.4vw, 58px) !important; }
  body section.ov-hero-new p:nth-child(3) { max-width: 760px !important; font-size: 18px !important; }
  body .page-hero h1 { max-width: 1180px !important; font-size: clamp(38px, 4.2vw, 56px) !important; }
  body .page-hero .lede { max-width: 1040px !important; font-size: 18px !important; }
  body .gh-hero h1, body .ov-rl-hero h1, body .ov-cmp-hero h1, body .post-hero h1 {
    max-width: 1180px !important; font-size: clamp(38px, 4.2vw, 56px) !important;
  }
  body .gh-hero p:not(.kicker), body .ov-rl-hero .ov-rl-dek,
  body .ov-cmp-hero .ov-cmp-dek, body .post-hero p.post-dek {
    max-width: 1040px !important; font-size: 18px !important;
  }
}
@media (min-width: 1920px) {
  body section.ov-hero-new h1 { max-width: 1040px !important; }
  body section.ov-hero-new p:nth-child(3) { max-width: 820px !important; }
  body .page-hero h1, body .gh-hero h1, body .ov-rl-hero h1, body .ov-cmp-hero h1, body .post-hero h1 {
    max-width: 1320px !important;
  }
  body .page-hero .lede, body .gh-hero p:not(.kicker), body .ov-rl-hero .ov-rl-dek,
  body .ov-cmp-hero .ov-cmp-dek, body .post-hero p.post-dek {
    max-width: 1180px !important;
  }
}


/* User feedback: the top promo strip felt AI-generated; hide it sitewide.
   Also hide the top ov-ship-bar, its function is now in the floating
   #ov-ship-meter-btn. */
body .ov-promo-strip { display: none !important; }
body .ov-ship-bar, body .ov-ship-bar-sticky { display: none !important; }

/* Floating button cluster, sit tight at bottom-right, above the
   .ov-sticky-cta mini-bar (which has bottom:0 height ~60px). */
body #ov-clinical-chat-btn { bottom: 18px !important; right: 18px !important; }
body #ov-ship-meter-btn { bottom: 79px !important; right: 18px !important; }
body #ov-preview-cart-btn { bottom: 140px !important; right: 18px !important; }
body.ov-sticky-cta-shown #ov-clinical-chat-btn { bottom: 78px !important; }
body.ov-sticky-cta-shown #ov-ship-meter-btn { bottom: 139px !important; }
body.ov-sticky-cta-shown #ov-preview-cart-btn { bottom: 200px !important; }
@media (max-width: 480px) {
  body #ov-clinical-chat-btn { bottom: 14px !important; right: 12px !important; padding: 10px 14px !important; font-size: 12px !important; }
  body #ov-ship-meter-btn { bottom: 64px !important; right: 12px !important; padding: 8px 12px !important; font-size: 11px !important; }
  body #ov-preview-cart-btn { bottom: 112px !important; right: 12px !important; padding: 9px 13px !important; font-size: 11.5px !important; }
  body.ov-sticky-cta-shown #ov-clinical-chat-btn { bottom: 70px !important; }
  body.ov-sticky-cta-shown #ov-ship-meter-btn { bottom: 120px !important; }
  body.ov-sticky-cta-shown #ov-preview-cart-btn { bottom: 168px !important; }
}


/* ═══ ULTRA-WIDE HERO FIT (Stryker / Intuitive style) ═══════════════
   On 2K / 4K / 5K screens, containers scale fluidly via min(92vw, Npx)
   instead of capping at fixed pixel widths. Hero typography scales too. */

/* >=1440, comfy laptop. Match prior behavior. */
@media (min-width: 1440px) {
  body main .ov-bulk-calc .container,
  body .page-hero .container,
  body .ova-container,
  body header.ov-header > div,
  body .ov-section-container,
  body section.ov-hero-new > div:nth-child(2),
  body .ov-bulk > div,
  body .ov-loyalty > div,
  body .ov-founder-video > div,
  body .ov-press > div,
  body .ov-diff > div,
  body .ov-who-head,
  body .ov-who-grid,
  body footer.ov-footer > div,
  body .ov-footer-grid {
    max-width: min(92vw, 1340px) !important;
  }
}

/* >=1600 */
@media (min-width: 1600px) {
  body main .ov-bulk-calc .container,
  body .page-hero .container,
  body .ova-container,
  body header.ov-header > div,
  body .ov-section-container,
  body section.ov-hero-new > div:nth-child(2),
  body .ov-bulk > div,
  body .ov-loyalty > div,
  body .ov-founder-video > div,
  body .ov-press > div,
  body .ov-diff > div,
  body .ov-who-head,
  body .ov-who-grid,
  body footer.ov-footer > div,
  body .ov-footer-grid {
    max-width: min(92vw, 1520px) !important;
  }
}

/* >=1920, full HD */
@media (min-width: 1920px) {
  body main .ov-bulk-calc .container,
  body .page-hero .container,
  body .ova-container,
  body header.ov-header > div,
  body .ov-section-container,
  body section.ov-hero-new > div:nth-child(2),
  body .ov-bulk > div,
  body .ov-loyalty > div,
  body .ov-founder-video > div,
  body .ov-press > div,
  body .ov-diff > div,
  body .ov-who-head,
  body .ov-who-grid,
  body footer.ov-footer > div,
  body .ov-footer-grid {
    max-width: min(92vw, 1760px) !important;
  }
  body section.ov-hero-new h1 { max-width: min(64vw, 1180px) !important; font-size: clamp(42px, 4.4vw, 68px) !important; }
  body section.ov-hero-new p:nth-child(3) { max-width: min(48vw, 920px) !important; font-size: 19px !important; }
  body .page-hero h1, body .gh-hero h1, body .ov-rl-hero h1, body .ov-cmp-hero h1, body .post-hero h1 {
    max-width: min(72vw, 1440px) !important;
    font-size: clamp(42px, 4.2vw, 68px) !important;
  }
  body .page-hero .lede, body .gh-hero p:not(.kicker), body .ov-rl-hero .ov-rl-dek,
  body .ov-cmp-hero .ov-cmp-dek, body .post-hero p.post-dek {
    max-width: min(60vw, 1180px) !important;
    font-size: 19px !important;
  }
}

/* >=2560, 2K / WQHD */
@media (min-width: 2560px) {
  body main .ov-bulk-calc .container,
  body .page-hero .container,
  body .ova-container,
  body header.ov-header > div,
  body .ov-section-container,
  body section.ov-hero-new > div:nth-child(2),
  body .ov-bulk > div,
  body .ov-loyalty > div,
  body .ov-founder-video > div,
  body .ov-press > div,
  body .ov-diff > div,
  body .ov-who-head,
  body .ov-who-grid,
  body footer.ov-footer > div,
  body .ov-footer-grid {
    max-width: min(90vw, 2200px) !important;
  }
  body section.ov-hero-new h1, body .page-hero h1, body .gh-hero h1,
  body .ov-rl-hero h1, body .ov-cmp-hero h1, body .post-hero h1 {
    font-size: clamp(56px, 3.4vw, 88px) !important;
    max-width: min(72vw, 1760px) !important;
    line-height: 1.05 !important;
  }
  body section.ov-hero-new p:nth-child(3),
  body .page-hero .lede, body .gh-hero p:not(.kicker),
  body .ov-rl-hero .ov-rl-dek, body .ov-cmp-hero .ov-cmp-dek,
  body .post-hero p.post-dek {
    font-size: 21px !important;
    max-width: min(60vw, 1440px) !important;
  }
  body section.ov-hero-new { padding: 120px 32px 128px !important; }
  body .page-hero { padding: 112px 32px 96px !important; }
}

/* >=3200, 4K */
@media (min-width: 3200px) {
  body main .ov-bulk-calc .container,
  body .page-hero .container,
  body .ova-container,
  body header.ov-header > div,
  body .ov-section-container,
  body section.ov-hero-new > div:nth-child(2),
  body .ov-bulk > div,
  body .ov-loyalty > div,
  body .ov-founder-video > div,
  body .ov-press > div,
  body .ov-diff > div,
  body .ov-who-head,
  body .ov-who-grid,
  body footer.ov-footer > div,
  body .ov-footer-grid {
    max-width: min(88vw, 3200px) !important;
  }
  body section.ov-hero-new h1, body .page-hero h1, body .gh-hero h1,
  body .ov-rl-hero h1, body .ov-cmp-hero h1, body .post-hero h1 {
    font-size: clamp(72px, 2.8vw, 124px) !important;
    max-width: min(70vw, 2400px) !important;
  }
  body section.ov-hero-new p:nth-child(3),
  body .page-hero .lede, body .gh-hero p:not(.kicker),
  body .ov-rl-hero .ov-rl-dek, body .ov-cmp-hero .ov-cmp-dek,
  body .post-hero p.post-dek {
    font-size: 26px !important;
    max-width: min(58vw, 2000px) !important;
  }
  body section.ov-hero-new { padding: 144px 40px 160px !important; }
  body .page-hero { padding: 144px 40px 120px !important; }
}

/* >=4000, ultra-wide / 5K. Stryker-level edge-to-edge feel. */
@media (min-width: 4000px) {
  body main .ov-bulk-calc .container,
  body .page-hero .container,
  body .ova-container,
  body header.ov-header > div,
  body .ov-section-container,
  body section.ov-hero-new > div:nth-child(2),
  body .ov-bulk > div,
  body .ov-loyalty > div,
  body .ov-founder-video > div,
  body .ov-press > div,
  body .ov-diff > div,
  body .ov-who-head,
  body .ov-who-grid,
  body footer.ov-footer > div,
  body .ov-footer-grid {
    max-width: min(86vw, 3800px) !important;
  }
  body section.ov-hero-new h1, body .page-hero h1, body .gh-hero h1,
  body .ov-rl-hero h1, body .ov-cmp-hero h1, body .post-hero h1 {
    font-size: clamp(96px, 2.6vw, 144px) !important;
    max-width: min(70vw, 2800px) !important;
    line-height: 1.03 !important;
  }
  body section.ov-hero-new p:nth-child(3),
  body .page-hero .lede, body .gh-hero p:not(.kicker),
  body .ov-rl-hero .ov-rl-dek, body .ov-cmp-hero .ov-cmp-dek,
  body .post-hero p.post-dek {
    font-size: 30px !important;
    max-width: min(58vw, 2400px) !important;
  }
  body section.ov-hero-new { padding: 184px 56px 200px !important; }
  body .page-hero { padding: 168px 56px 144px !important; }
}

/* Fluid .page-hero-grid: sidecard scales with viewport too.
   CRITICAL: unset the 1180px max-width cap that an earlier normalizer set,
   otherwise the grid (and the h1 inside it) is capped at 1180 regardless
   of how wide the outer container grows. */
body .page-hero-grid { max-width: none !important; width: 100% !important; }
@media (min-width: 1280px) {
  body .page-hero-grid {
    grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr) !important;
    gap: 64px !important;
  }
}
@media (min-width: 1920px) {
  body .page-hero-grid {
    grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr) !important;
    gap: 88px !important;
  }
}
@media (min-width: 2560px) {
  body .page-hero-grid {
    gap: 112px !important;
  }
}


/* HERO LATITUDE, keep original font sizes (moderate), but stretch the
   title block wider so it spans more screen latitude on big monitors. */

/* Baseline desktop (≥1024), original normalized sizes */
@media (min-width: 1024px) {
  body section.ov-hero-new h1, body .page-hero h1, body .gh-hero h1,
  body .ov-rl-hero h1, body .ov-cmp-hero h1, body .post-hero h1 {
    font-size: clamp(34px, 4vw, 50px) !important;
    line-height: 1.12 !important;
    max-width: min(95%, 1280px) !important;
  }
  body section.ov-hero-new p:nth-child(3),
  body .page-hero .lede, body .gh-hero p:not(.kicker),
  body .ov-rl-hero .ov-rl-dek, body .ov-cmp-hero .ov-cmp-dek,
  body .post-hero p.post-dek {
    font-size: 17px !important;
    max-width: min(90%, 1080px) !important;
  }
}

@media (min-width: 1440px) {
  body section.ov-hero-new h1, body .page-hero h1, body .gh-hero h1,
  body .ov-rl-hero h1, body .ov-cmp-hero h1, body .post-hero h1 {
    font-size: clamp(38px, 3.8vw, 56px) !important;
    max-width: min(95%, 1480px) !important;
  }
  body section.ov-hero-new p:nth-child(3),
  body .page-hero .lede, body .gh-hero p:not(.kicker),
  body .ov-rl-hero .ov-rl-dek, body .ov-cmp-hero .ov-cmp-dek,
  body .post-hero p.post-dek {
    font-size: 18px !important;
    max-width: min(90%, 1240px) !important;
  }
}

@media (min-width: 1920px) {
  body section.ov-hero-new h1, body .page-hero h1, body .gh-hero h1,
  body .ov-rl-hero h1, body .ov-cmp-hero h1, body .post-hero h1 {
    font-size: clamp(42px, 3.4vw, 60px) !important;
    max-width: min(95%, 1720px) !important;
  }
  body section.ov-hero-new p:nth-child(3),
  body .page-hero .lede, body .gh-hero p:not(.kicker),
  body .ov-rl-hero .ov-rl-dek, body .ov-cmp-hero .ov-cmp-dek,
  body .post-hero p.post-dek {
    font-size: 19px !important;
    max-width: min(90%, 1440px) !important;
  }
}

@media (min-width: 2560px) {
  body section.ov-hero-new h1, body .page-hero h1, body .gh-hero h1,
  body .ov-rl-hero h1, body .ov-cmp-hero h1, body .post-hero h1 {
    font-size: clamp(46px, 3vw, 62px) !important;
    max-width: min(95%, 2200px) !important;
  }
  body section.ov-hero-new p:nth-child(3),
  body .page-hero .lede, body .gh-hero p:not(.kicker),
  body .ov-rl-hero .ov-rl-dek, body .ov-cmp-hero .ov-cmp-dek,
  body .post-hero p.post-dek {
    font-size: 20px !important;
    max-width: min(90%, 1800px) !important;
  }
}

@media (min-width: 3200px) {
  body section.ov-hero-new h1, body .page-hero h1, body .gh-hero h1,
  body .ov-rl-hero h1, body .ov-cmp-hero h1, body .post-hero h1 {
    font-size: clamp(52px, 2.4vw, 70px) !important;
    max-width: min(95%, 2800px) !important;
  }
  body section.ov-hero-new p:nth-child(3),
  body .page-hero .lede, body .gh-hero p:not(.kicker),
  body .ov-rl-hero .ov-rl-dek, body .ov-cmp-hero .ov-cmp-dek,
  body .post-hero p.post-dek {
    font-size: 21px !important;
    max-width: min(90%, 2200px) !important;
  }
}

@media (min-width: 4000px) {
  body section.ov-hero-new h1, body .page-hero h1, body .gh-hero h1,
  body .ov-rl-hero h1, body .ov-cmp-hero h1, body .post-hero h1 {
    font-size: clamp(58px, 2.2vw, 76px) !important;
    max-width: min(95%, 3400px) !important;
  }
}

/* Tighten hero padding back to a sane scale (was ballooning to 200px) */
@media (min-width: 1920px) { body section.ov-hero-new, body .page-hero { padding: 96px 32px 88px !important; } }
@media (min-width: 2560px) { body section.ov-hero-new, body .page-hero { padding: 112px 40px 96px !important; } }
@media (min-width: 3200px) { body section.ov-hero-new, body .page-hero { padding: 128px 48px 112px !important; } }


/* Stretch PDP + collection inner containers on wide screens, same
   fluid pattern used on heroes and bulk-orders. */
@media (min-width: 1280px) {
  body .ovp-main, body .ovp-grid,
  body .col-container, body .col-hero-inner, body .col-grid,
  body .ovr-grid, body .lcg-grid, body .lcp-grid,
  body .ovp-further-grid, body .ovp-cred-grid,
  body .lp-container, body .ova-section-inner,
  body .ov-container, body .ovp-container {
    max-width: min(94%, 1320px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}
@media (min-width: 1440px) {
  body .ovp-main, body .ovp-grid,
  body .col-container, body .col-hero-inner, body .col-grid,
  body .ovr-grid, body .lcg-grid, body .lcp-grid,
  body .ovp-further-grid, body .ovp-cred-grid,
  body .lp-container, body .ova-section-inner,
  body .ov-container, body .ovp-container {
    max-width: min(94%, 1480px) !important;
  }
}
@media (min-width: 1920px) {
  body .ovp-main, body .ovp-grid,
  body .col-container, body .col-hero-inner, body .col-grid,
  body .ovr-grid, body .lcg-grid, body .lcp-grid,
  body .ovp-further-grid, body .ovp-cred-grid,
  body .lp-container, body .ova-section-inner,
  body .ov-container, body .ovp-container {
    max-width: min(92%, 1760px) !important;
  }
}
@media (min-width: 2560px) {
  body .ovp-main, body .ovp-grid,
  body .col-container, body .col-hero-inner, body .col-grid,
  body .ovr-grid, body .lcg-grid, body .lcp-grid,
  body .ovp-further-grid, body .ovp-cred-grid,
  body .lp-container, body .ova-section-inner,
  body .ov-container, body .ovp-container {
    max-width: min(90%, 2200px) !important;
  }
}
@media (min-width: 3200px) {
  body .ovp-main, body .ovp-grid,
  body .col-container, body .col-hero-inner, body .col-grid,
  body .ovr-grid, body .lcg-grid, body .lcp-grid,
  body .ovp-further-grid, body .ovp-cred-grid,
  body .lp-container, body .ova-section-inner,
  body .ov-container, body .ovp-container {
    max-width: min(88%, 2800px) !important;
  }
}
@media (min-width: 4000px) {
  body .ovp-main, body .ovp-grid,
  body .col-container, body .col-hero-inner, body .col-grid,
  body .ovr-grid, body .lcg-grid, body .lcp-grid,
  body .ovp-further-grid, body .ovp-cred-grid,
  body .lp-container, body .ova-section-inner,
  body .ov-container, body .ovp-container {
    max-width: min(86%, 3400px) !important;
  }
}

/* Product grid: more columns on wide screens */
@media (min-width: 1600px) {
  body .col-grid { grid-template-columns: repeat(4, 1fr) !important; }
}
@media (min-width: 2200px) {
  body .col-grid { grid-template-columns: repeat(5, 1fr) !important; }
}


/* Stretch Learn-page hero/title containers to use the wide viewport.
   Article body containers (.gd-container, .post-body) stay narrower so
   the prose remains readable (60-80 chars per line is best for reading). */

/* TITLE/HERO inner wrappers, STRETCH */
@media (min-width: 1280px) {
  body .ov-rl-hero-inner,
  body .ov-cmp-hero-inner,
  body .gh-hero-inner,
  body .post-hero {
    max-width: min(94%, 1320px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}
@media (min-width: 1440px) {
  body .ov-rl-hero-inner,
  body .ov-cmp-hero-inner,
  body .gh-hero-inner,
  body .post-hero {
    max-width: min(94%, 1480px) !important;
  }
}
@media (min-width: 1920px) {
  body .ov-rl-hero-inner,
  body .ov-cmp-hero-inner,
  body .gh-hero-inner,
  body .post-hero {
    max-width: min(92%, 1760px) !important;
  }
}
@media (min-width: 2560px) {
  body .ov-rl-hero-inner,
  body .ov-cmp-hero-inner,
  body .gh-hero-inner,
  body .post-hero {
    max-width: min(90%, 2200px) !important;
  }
}
@media (min-width: 3200px) {
  body .ov-rl-hero-inner,
  body .ov-cmp-hero-inner,
  body .gh-hero-inner,
  body .post-hero {
    max-width: min(88%, 2800px) !important;
  }
}
@media (min-width: 4000px) {
  body .ov-rl-hero-inner,
  body .ov-cmp-hero-inner,
  body .gh-hero-inner,
  body .post-hero {
    max-width: min(86%, 3400px) !important;
  }
}

/* ARTICLE BODY containers (.gd-container etc), KEEP NARROW
   (typically 720-880px which is the sweet spot for prose readability) */
body .gd-container, body .post-body, body .gd-grid {
  /* Don't override, leave their author-set widths alone */
}

/* ARTICLE TITLES (.post-hero) are inside `<article class="post-shell">` which
   is 780px wide for body readability. Break the title out of that parent
   using negative-margin so it spans the full viewport. Inner text stays at
   a sensible width via internal padding. */
@media (min-width: 1024px) {
  body .post-hero {
    margin-left: calc(390px - 50vw) !important;
    margin-right: calc(390px - 50vw) !important;
    padding-left: max(24px, calc(50vw - 640px)) !important;
    padding-right: max(24px, calc(50vw - 640px)) !important;
    max-width: 100vw !important;
    box-sizing: border-box !important;
  }
}
@media (min-width: 1440px) {
  body .post-hero {
    padding-left: max(24px, calc(50vw - 640px)) !important;
    padding-right: max(24px, calc(50vw - 640px)) !important;
  }
}
@media (min-width: 1920px) {
  body .post-hero {
    padding-left: max(24px, calc(50vw - 640px)) !important;
    padding-right: max(24px, calc(50vw - 640px)) !important;
  }
}
@media (min-width: 2560px) {
  body .post-hero {
    padding-left: max(56px, calc(50vw - 1100px)) !important;
    padding-right: max(56px, calc(50vw - 1100px)) !important;
  }
}
@media (min-width: 3200px) {
  body .post-hero {
    padding-left: max(64px, calc(50vw - 1400px)) !important;
    padding-right: max(64px, calc(50vw - 1400px)) !important;
  }
}


/* Stretch every remaining inner-container class on wide screens. The list
   covers article shells, reimbursement / 101-guide bodies, contact body,
   PDP body grids, landing-page wrappers, and the page-hero sidecard. */

@media (min-width: 1280px) {
  body .post-shell,
  body .gd-container, body .gd-grid,
  body .uc-container, body .uc-grid,
  body .ova-section-inner,
  body .ov-pricing-grid, body .ov-cmp-row, body .ov-cmp-grid,
  body .ovp-page-grid, body .ovp-cred-grid, body .ovp-further-grid,
  body .lp-container, body .lcg-container, body .lcp-container,
  body .page-hero .sidecard {
    max-width: min(94%, 1320px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}
@media (min-width: 1440px) {
  body .post-shell,
  body .gd-container, body .gd-grid,
  body .uc-container, body .uc-grid,
  body .ova-section-inner,
  body .ov-pricing-grid, body .ov-cmp-row, body .ov-cmp-grid,
  body .ovp-page-grid, body .ovp-cred-grid, body .ovp-further-grid,
  body .lp-container, body .lcg-container, body .lcp-container,
  body .page-hero .sidecard {
    max-width: min(94%, 1480px) !important;
  }
}
@media (min-width: 1920px) {
  body .post-shell,
  body .gd-container, body .gd-grid,
  body .uc-container, body .uc-grid,
  body .ova-section-inner,
  body .ov-pricing-grid, body .ov-cmp-row, body .ov-cmp-grid,
  body .ovp-page-grid, body .ovp-cred-grid, body .ovp-further-grid,
  body .lp-container, body .lcg-container, body .lcp-container,
  body .page-hero .sidecard {
    max-width: min(92%, 1760px) !important;
  }
}
@media (min-width: 2560px) {
  body .post-shell,
  body .gd-container, body .gd-grid,
  body .uc-container, body .uc-grid,
  body .ova-section-inner,
  body .ov-pricing-grid, body .ov-cmp-row, body .ov-cmp-grid,
  body .ovp-page-grid, body .ovp-cred-grid, body .ovp-further-grid,
  body .lp-container, body .lcg-container, body .lcp-container,
  body .page-hero .sidecard {
    max-width: min(90%, 2200px) !important;
  }
}
@media (min-width: 3200px) {
  body .post-shell,
  body .gd-container, body .gd-grid,
  body .uc-container, body .uc-grid,
  body .ova-section-inner,
  body .ov-pricing-grid, body .ov-cmp-row, body .ov-cmp-grid,
  body .ovp-page-grid, body .ovp-cred-grid, body .ovp-further-grid,
  body .lp-container, body .lcg-container, body .lcp-container,
  body .page-hero .sidecard {
    max-width: min(88%, 2800px) !important;
  }
}
@media (min-width: 4000px) {
  body .post-shell,
  body .gd-container, body .gd-grid,
  body .uc-container, body .uc-grid,
  body .ova-section-inner,
  body .ov-pricing-grid, body .ov-cmp-row, body .ov-cmp-grid,
  body .ovp-page-grid, body .ovp-cred-grid, body .ovp-further-grid,
  body .lp-container, body .lcg-container, body .lcp-container,
  body .page-hero .sidecard {
    max-width: min(86%, 3400px) !important;
  }
}

/* "Zoom in", bump root font-size on ultra-wide screens so prose, ticks,
   and small UI text stay legible at the wider proportions. Affects rem-
   based sizes throughout the site; px-based sizes are unchanged. */
@media (min-width: 1920px) { html { font-size: 17px; } }
@media (min-width: 2560px) { html { font-size: 19px; } }
@media (min-width: 3200px) { html { font-size: 22px; } }
@media (min-width: 4000px) { html { font-size: 26px; } }

/* Also bump body / article paragraph + list font on ultra-wide */
@media (min-width: 1920px) {
  body .gd-container p, body .gd-container li,
  body .post-shell p, body .post-shell li,
  body .ova-section p, body .ova-section li,
  body .uc-container p, body .uc-container li {
    font-size: 17px !important;
    line-height: 1.7 !important;
  }
}
@media (min-width: 2560px) {
  body .gd-container p, body .gd-container li,
  body .post-shell p, body .post-shell li,
  body .ova-section p, body .ova-section li,
  body .uc-container p, body .uc-container li {
    font-size: 19px !important;
    line-height: 1.7 !important;
  }
}
@media (min-width: 3200px) {
  body .gd-container p, body .gd-container li,
  body .post-shell p, body .post-shell li,
  body .ova-section p, body .ova-section li,
  body .uc-container p, body .uc-container li {
    font-size: 22px !important;
    line-height: 1.65 !important;
  }
}
@media (min-width: 4000px) {
  body .gd-container p, body .gd-container li,
  body .post-shell p, body .post-shell li,
  body .ova-section p, body .ova-section li,
  body .uc-container p, body .uc-container li {
    font-size: 26px !important;
    line-height: 1.6 !important;
  }
}

/* Body h2/h3 inside articles also scale */
@media (min-width: 1920px) {
  body .gd-container h2, body .post-shell h2, body .ova-section h2 { font-size: 32px !important; }
  body .gd-container h3, body .post-shell h3, body .ova-section h3 { font-size: 22px !important; }
}
@media (min-width: 2560px) {
  body .gd-container h2, body .post-shell h2, body .ova-section h2 { font-size: 38px !important; }
  body .gd-container h3, body .post-shell h3, body .ova-section h3 { font-size: 26px !important; }
}
@media (min-width: 3200px) {
  body .gd-container h2, body .post-shell h2, body .ova-section h2 { font-size: 46px !important; }
  body .gd-container h3, body .post-shell h3, body .ova-section h3 { font-size: 32px !important; }
}

/* Product card sizing on wide screens, slightly bigger images */
@media (min-width: 2560px) {
  body .ov-product-card-name { font-size: 17px !important; }
  body .ov-product-card-sub { font-size: 13.5px !important; }
}


/* RESET, keep root font-size normal at every viewport.
   The cascade is built on px units; bumping html { font-size } made
   every rem-based icon, padding, and small label inflate. */
html { font-size: 16px !important; }

/* No paragraph font-size scaling. Body prose stays at its natural 15-17px. */
body .gd-container p, body .gd-container li,
body .post-shell p, body .post-shell li,
body .ova-section p, body .ova-section li,
body .uc-container p, body .uc-container li {
  font-size: revert !important;
  line-height: revert !important;
}
body .gd-container h2, body .post-shell h2, body .ova-section h2 { font-size: revert !important; }
body .gd-container h3, body .post-shell h3, body .ova-section h3 { font-size: revert !important; }
body .ov-product-card-name, body .ov-product-card-sub { font-size: revert !important; }

/* SANE CONTAINER WIDTHS, wide enough to feel modern, capped so content
   doesn't sprawl on ultra-wide monitors. 1640px is the sweet spot used by
   Apple, Stryker, Linear, Vercel for content sites. */

/* Section + page-hero + bulk calc containers: 90% with 1640px cap */
@media (min-width: 1024px) {
  body main .ov-bulk-calc .container,
  body .page-hero .container,
  body .ova-container,
  body header.ov-header > div,
  body .ov-section-container,
  body section.ov-hero-new > div:nth-child(2),
  body .ov-bulk > div,
  body .ov-loyalty > div,
  body .ov-founder-video > div,
  body .ov-press > div,
  body .ov-diff > div,
  body .ov-who-head,
  body .ov-who-grid,
  body footer.ov-footer > div,
  body .ov-footer-grid {
    max-width: min(90vw, 1640px) !important;
  }
}

/* Hero TEXT, keep heading readable. Cap h1 at ~880-1000px. */
@media (min-width: 1024px) {
  body section.ov-hero-new h1, body .page-hero h1, body .gh-hero h1,
  body .ov-rl-hero h1, body .ov-cmp-hero h1, body .post-hero h1 {
    font-size: clamp(34px, 3.6vw, 52px) !important;
    line-height: 1.15 !important;
    max-width: min(85%, 980px) !important;
    letter-spacing: -0.02em !important;
  }
  body section.ov-hero-new p:nth-child(3),
  body .page-hero .lede, body .gh-hero p:not(.kicker),
  body .ov-rl-hero .ov-rl-dek, body .ov-cmp-hero .ov-cmp-dek,
  body .post-hero p.post-dek {
    font-size: 17px !important;
    line-height: 1.6 !important;
    max-width: min(80%, 760px) !important;
  }
}
@media (min-width: 1440px) {
  body section.ov-hero-new h1, body .page-hero h1, body .gh-hero h1,
  body .ov-rl-hero h1, body .ov-cmp-hero h1, body .post-hero h1 {
    font-size: clamp(38px, 3.4vw, 56px) !important;
    max-width: min(85%, 1080px) !important;
  }
  body section.ov-hero-new p:nth-child(3),
  body .page-hero .lede, body .gh-hero p:not(.kicker),
  body .ov-rl-hero .ov-rl-dek, body .ov-cmp-hero .ov-cmp-dek,
  body .post-hero p.post-dek {
    font-size: 18px !important;
    max-width: min(80%, 840px) !important;
  }
}

/* Article body wrapper, KEEP NARROW (reading width). Article hero stays
   wide via its breakout, but the article content is comfortable to read. */
@media (min-width: 1024px) {
  body .post-shell {
    max-width: 880px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  body .gd-container, body .uc-container {
    max-width: min(90vw, 1180px) !important;
  }
}

/* Article HERO ONLY (.post-hero), still spans wider via negative-margin
   breakout from the narrow .post-shell parent. */
@media (min-width: 1024px) {
  body .post-hero {
    margin-left: calc(440px - 50vw) !important;
    margin-right: calc(440px - 50vw) !important;
    padding-left: max(28px, calc(50vw - 600px)) !important;
    padding-right: max(28px, calc(50vw - 600px)) !important;
    max-width: 100vw !important;
    box-sizing: border-box !important;
  }
}
@media (min-width: 1920px) {
  body .post-hero {
    padding-left: max(40px, calc(50vw - 700px)) !important;
    padding-right: max(40px, calc(50vw - 700px)) !important;
  }
}

/* PDP main column, cap so the product image doesn't go billboard. */
@media (min-width: 1024px) {
  body .ovp-main, body .ovp-grid {
    max-width: min(90vw, 1280px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

/* Resource page heroes (.ov-rl-hero-inner, .ov-cmp-hero-inner, .gh-hero-inner)
  , cap at 1640px so they don't sprawl on ultra-wide screens like before */
@media (min-width: 1024px) {
  body .ov-rl-hero-inner,
  body .ov-cmp-hero-inner,
  body .gh-hero-inner {
    max-width: min(90vw, 1640px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

/* Resource page BODY containers (.ov-rl-shell, .ov-cmp-shell, .gh-shell)
  , readable width for prose, capped at 1080px */
@media (min-width: 1024px) {
  body .ov-rl-shell, body .ov-cmp-shell, body .gh-shell {
    max-width: min(90vw, 1080px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

/* Collection page, comfortable grid */
@media (min-width: 1024px) {
  body .col-container, body .col-hero-inner, body .col-grid {
    max-width: min(90vw, 1480px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}
@media (min-width: 1600px) {
  body .col-grid { grid-template-columns: repeat(4, 1fr) !important; }
}

/* Bulk calc tier ladder + benefit grid, don't oversize on wide screens */
@media (min-width: 1024px) {
  body main .ov-bulk-calc .ov-bulk-tier-ladder {
    grid-template-columns: repeat(5, 1fr) !important;
    gap: 14px !important;
  }
  body main .ov-bulk-calc .ov-bulk-benefits {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

/* Page-hero grid, sidecard cap */
@media (min-width: 1024px) {
  body .page-hero-grid {
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 360px) !important;
    gap: 56px !important;
  }
}
@media (min-width: 1600px) {
  body .page-hero-grid {
    grid-template-columns: minmax(0, 1.5fr) minmax(0, 400px) !important;
    gap: 72px !important;
  }
}

/* Hide animation-timeline overshoot from earlier passes, only use
   our natural-fade JS approach */
@supports (animation-timeline: view()) {
  body main > section, body main > article {
    animation-timeline: none !important;
  }
}


  /* Editorial article base, mirrors the learn/ post-shell template */
  :root { --navy:#1B2A4E; --blue:#2D9CDB; --gold:#C49A4B; --cream:#FBF7EE; --ink:#1A1A1A; --ink-soft:#4A5260; --muted:#72808E; --line:rgba(27,42,78,0.10); }
  /* Fix: the article hero sits on a LIGHT background, so override the sitewide dark-hero rules that force white text (which made the headline invisible). Match the learn/ article style (Assistant, dark navy). */
  body article.post-shell .post-hero h1 { color:#1B2A4E !important; font-family:'Assistant',-apple-system,BlinkMacSystemFont,sans-serif !important; }
  body article.post-shell .post-hero p.post-dek, body article.post-shell .post-hero .post-dek { color:#4A5260 !important; font-family:'Assistant',-apple-system,BlinkMacSystemFont,sans-serif !important; }
  .post-shell { max-width:780px; margin:0 auto; padding:0 24px 80px; font-family:'Assistant',-apple-system,sans-serif; color:var(--ink); font-size:16px; line-height:1.7; }
  .post-shell .crumbs { font-size:12px; color:var(--muted); margin-bottom:18px; letter-spacing:0.04em; text-transform:uppercase; font-weight:500; }
  .post-shell .crumbs a { color:var(--muted); text-decoration:none; }
  .post-hero { margin-bottom:36px; padding-bottom:28px; border-bottom:1px solid var(--line); }
  .post-hero .kicker { font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:0.14em; color:var(--gold); margin:0 0 14px; }
  .post-shell h1 { font-family:'Assistant',-apple-system,BlinkMacSystemFont,sans-serif; font-size:38px; font-weight:600; color:var(--navy); margin:0 0 16px; line-height:1.15; letter-spacing:-0.012em; }
  .post-shell .post-dek { font-family:'Assistant',-apple-system,BlinkMacSystemFont,sans-serif; font-size:19px; line-height:1.55; color:var(--ink-soft); margin:0 0 22px; }
  .post-shell .post-meta { display:flex; flex-wrap:wrap; gap:22px; font-size:13px; color:var(--muted); }
  .post-shell .post-meta strong { display:block; color:var(--navy); font-weight:600; margin-bottom:2px; }
  .post-shell .toc { background:var(--cream); border:1px solid var(--line); border-radius:8px; padding:18px 22px; margin:24px 0 36px; }
  .post-shell .toc-label { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:0.10em; color:var(--ink-soft); margin:0 0 8px; }
  .post-shell .toc ol { margin:0; padding-left:20px; font-size:14px; line-height:1.85; }
  .post-shell .toc a { color:var(--navy); text-decoration:none; border-bottom:0; }
  .post-shell h2 { font-family:'Assistant',-apple-system,BlinkMacSystemFont,sans-serif; font-size:26px; font-weight:600; color:var(--navy); margin:48px 0 14px; scroll-margin-top:24px; }
  .post-shell h2::before { content:none; }
  .post-shell h3 { font-family:'Assistant',-apple-system,BlinkMacSystemFont,sans-serif; font-size:20px; font-weight:600; color:var(--navy); margin:32px 0 10px; }
  .post-shell p { margin:0 0 16px; font-size:16px; line-height:1.7; color:var(--ink); }
  .post-shell strong { color:var(--navy); font-weight:600; }
  .post-shell ul, .post-shell ol { padding-left:24px; margin:0 0 18px; font-size:16px; line-height:1.7; color:var(--ink); }
  .post-shell li { margin:6px 0; }
  .post-shell a { color:var(--blue); text-decoration:none; border-bottom:1px dotted var(--blue); }
  .post-shell table { width:100%; border-collapse:collapse; margin:20px 0; font-size:13.5px; border:1px solid var(--line); border-radius:8px; overflow:hidden; }
  .post-shell thead th { background:var(--navy); color:#fff; text-align:left; padding:11px 13px; font-weight:600; font-size:12.5px; }
  .post-shell tbody td { padding:11px 13px; border-top:1px solid var(--line); vertical-align:top; }
  .post-shell tbody tr:nth-child(even) td { background:rgba(27,42,78,0.025); }

html,body{-webkit-font-smoothing:antialiased !important;-moz-osx-font-smoothing:grayscale !important;}
html body [class*="hero"] h1,html body .ovx-hero h1,html body .post-hero h1,html body article.post-shell .post-hero h1{font-family:'Source Serif 4',Georgia,serif !important;font-weight:600 !important;letter-spacing:-0.02em !important;font-size:clamp(28px,3vw,40px) !important;line-height:1.07 !important;max-width:22ch !important;-webkit-font-smoothing:antialiased !important;-moz-osx-font-smoothing:grayscale !important;font-synthesis:none !important;}
html body [class*="hero"] .kicker,html body [class*="hero"] [class*="eyebrow"],html body [class*="hero"] .sidecard .label,html body [class*="hero"] .sidecard p.label,html body .ovp-kicker,html body .ov-react-kicker{color:#C49A4B !important;}
.ovx-pcard__img img,.col-product__img img,.ovp-photo img,.ovp-thumb img,.ov-bulk-product-info-img img,.ovx-main img,.ovx-card img{filter:drop-shadow(0 10px 22px rgba(27,42,78,0.18));}
@media (min-width:861px){header.ov-header{padding:12px 24px!important}html body header.ov-header>div{max-width:1280px!important;margin-left:auto!important;margin-right:auto!important}}
header.ov-header a:has(img),header.ov-header a:has(svg){border-bottom:0 !important;box-shadow:none !important;text-decoration:none !important;}

html.ov-js body main > section:not([class*="hero"]):not([class*="ovp-page"]),
html.ov-js body main > div.ov-home,
html.ov-js body main > article:not([class*="hero"]):not(.post-shell),
html.ov-js body main > article.post-shell > :not(.post-hero):not(script):not(style):not(link):not(template):not(meta){
  opacity:0;
}
@media (prefers-reduced-motion: reduce){
  html.ov-js body main > section,
  html.ov-js body main > div.ov-home,
  html.ov-js body main > article,
  html.ov-js body main > article.post-shell > *{ opacity:1 !important; transform:none !important; }
}


/* Mobile nav + sizing fix: the hamburger sits outside <header> (static), so the
   old show-rule never matched. Show it (fixed, top-left) under 760px, hide the
   inline nav, shrink the oversized logo, and prevent horizontal zoom/overflow. */
@media (max-width: 760px){
  header.ov-header nav, header nav.ov-header-nav { display: none !important; }
  .ovx-mobile-hamburger { display: inline-flex !important; position: fixed !important; top: 14px; left: 14px; z-index: 1200 !important; background: #fff !important; box-shadow: 0 2px 8px rgba(27,42,78,0.16); }
  header.ov-header img[src*="ovena-logo"], header img[alt*="Ovena"] { max-height: 44px !important; width: auto !important; }
  html, body { overflow-x: clip !important; max-width: 100% !important; }
}
@media (min-width: 761px){ .ovx-mobile-hamburger { display: none !important; } }

.ov-has-dropdown:hover .ov-dropdown { opacity:1 !important; visibility:visible !important; pointer-events:auto !important; } .ov-dropdown a:hover { background:#F7F9FC; color:#2D9CDB; }

/* Hero entrance, fade + rise on initial page load (staggered).
   Initial state only applies when JS is available (html.ov-js) so non-JS users
   see content immediately. */
html.ov-js body :is(.ov-hero-new,.page-hero,.gh-hero,.ov-rl-hero,.ov-cmp-hero,.post-hero,.ova-hero,.ovx-hero,.ov-cart-hero,.ov-tcr-hero,.ovx-bulk,.col-hero,.lp-hero) :where(.kicker,[class*="kicker"],[class*="eyebrow"],h1,[class*="-h1"],[class*="dek"],[class*="lede"],[class*="hero-sub"],[class*="hero-desc"],[class*="intro"],[class$="__sub"],[class*="__copy"] > p, .ovx-hero__cta, .cta-row, .lp-hero-cta, .ova-cred, .post-meta) {
  opacity: 0;
  transform: translateY(14px);
  transition: opacity 0.7s cubic-bezier(0.2,0.7,0.2,1), transform 0.7s cubic-bezier(0.2,0.7,0.2,1);
  will-change: opacity, transform;
}
html.ov-js.ov-loaded body :is(.ov-hero-new,.page-hero,.gh-hero,.ov-rl-hero,.ov-cmp-hero,.post-hero,.ova-hero,.ovx-hero,.ov-cart-hero,.ov-tcr-hero,.ovx-bulk,.col-hero,.lp-hero) :where(.kicker,[class*="kicker"],[class*="eyebrow"],h1,[class*="-h1"],[class*="dek"],[class*="lede"],[class*="hero-sub"],[class*="hero-desc"],[class*="intro"],[class$="__sub"],[class*="__copy"] > p, .ovx-hero__cta, .cta-row, .lp-hero-cta, .ova-cred, .post-meta) {
  opacity: 1 !important;
  transform: translateY(0) !important;
}
html.ov-js body :is(.ov-hero-new,.page-hero,.gh-hero,.ov-rl-hero,.ov-cmp-hero,.post-hero,.ova-hero,.ovx-hero,.ov-cart-hero,.ov-tcr-hero,.ovx-bulk,.col-hero,.lp-hero) :is(.kicker,[class*="kicker"],[class*="eyebrow"]) { transition-delay: 0.05s; }
html.ov-js body :is(.ov-hero-new,.page-hero,.gh-hero,.ov-rl-hero,.ov-cmp-hero,.post-hero,.ova-hero,.ovx-hero,.ov-cart-hero,.ov-tcr-hero,.ovx-bulk,.col-hero,.lp-hero) :is(h1,[class*="-h1"]) { transition-delay: 0.18s; }
html.ov-js body :is(.ov-hero-new,.page-hero,.gh-hero,.ov-rl-hero,.ov-cmp-hero,.post-hero,.ova-hero,.ovx-hero,.ov-cart-hero,.ov-tcr-hero,.ovx-bulk,.col-hero,.lp-hero) :is([class*="dek"],[class*="lede"],[class*="hero-sub"],[class*="hero-desc"],[class*="intro"],[class$="__sub"],[class*="__copy"] > p) { transition-delay: 0.32s; }
html.ov-js body :is(.ov-hero-new,.page-hero,.gh-hero,.ov-rl-hero,.ov-cmp-hero,.post-hero,.ova-hero,.ovx-hero,.ov-cart-hero,.ov-tcr-hero,.ovx-bulk,.col-hero,.lp-hero) :is(.ovx-hero__cta, .cta-row, .lp-hero-cta, .ova-cred, .post-meta) { transition-delay: 0.44s; }


@media (prefers-reduced-motion: reduce) {
  html.ov-js body :is(.ov-hero-new,.page-hero,.gh-hero,.ov-rl-hero,.ov-cmp-hero,.post-hero,.ova-hero,.ovx-hero,.ov-cart-hero,.ov-tcr-hero,.ovx-bulk,.col-hero,.lp-hero) :where(.kicker,[class*="kicker"],[class*="eyebrow"],h1,[class*="-h1"],[class*="dek"],[class*="lede"],[class*="hero-sub"],[class*="hero-desc"],[class*="intro"],[class$="__sub"],[class*="__copy"] > p, .ovx-hero__cta, .cta-row, .lp-hero-cta, .ova-cred, .post-meta) {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}


/* Wide-screen scaling, give the layout breathing room on 24"+ monitors.
   At 1600px+: containers grow from ~1180-1280 to ~1440.
   At 1900px+: grow further to ~1560. */
@media (min-width: 1600px) {
  html body .ovx-hero__wrap,
  html body .ovx-sec__wrap,
  html body .ovx-bulk__wrap,
  html body .ovx-founder__wrap,
  html body .ovx-press__wrap,
  html body .col-shell,
  html body .col-hero-inner,
  html body .col-products-grid,
  html body .col-page-inner,
  html body .ov-rl-hero-inner,
  html body .ov-rl-shell,
  html body .gh-hero-inner,
  html body .gh-shell,
  html body .ova-hero-inner,
  html body .ovp-page,
  html body .ov-cart-hero > div,
  html body .ov-page-switcher-inner,
  html body main > section > div[style*="max-width:1180px"],
  html body main > section > div[style*="max-width: 1180px"],
  html body main > section > div[style*="max-width:1240px"],
  html body main > section > div[style*="max-width: 1240px"],
  html body main > section > div[style*="max-width:1280px"],
  html body main > section > div[style*="max-width: 1280px"],
  html body section > div[style*="max-width:1180px"],
  html body section > div[style*="max-width:1240px"] {
    max-width: 1440px !important;
  }
  /* Slightly bigger gaps to match the wider canvas */
  html body .ovx-prod__grid { gap: 24px; }
}
@media (min-width: 1900px) {
  html body .ovx-hero__wrap,
  html body .ovx-sec__wrap,
  html body .ovx-bulk__wrap,
  html body .ovx-founder__wrap,
  html body .ovx-press__wrap,
  html body .col-shell,
  html body .col-hero-inner,
  html body .col-products-grid,
  html body .col-page-inner,
  html body .ov-rl-hero-inner,
  html body .ov-rl-shell,
  html body .gh-hero-inner,
  html body .gh-shell,
  html body .ova-hero-inner,
  html body .ovp-page,
  html body .ov-cart-hero > div,
  html body .ov-page-switcher-inner,
  html body main > section > div[style*="max-width:1180px"],
  html body main > section > div[style*="max-width: 1180px"],
  html body main > section > div[style*="max-width:1240px"],
  html body main > section > div[style*="max-width: 1240px"],
  html body main > section > div[style*="max-width:1280px"],
  html body main > section > div[style*="max-width: 1280px"],
  html body section > div[style*="max-width:1180px"],
  html body section > div[style*="max-width:1240px"] {
    max-width: 1560px !important;
  }
}


header.ov-header nav > a,
header.ov-header nav > span > a,
header.ov-header nav .ov-shop-mega > a,
header.ov-header nav .ov-has-dropdown > a,
header.ov-header nav .ov-res-dropdown > a,
header.ov-header nav .ov-learn-mega > a {
  padding: 8px 6px !important;
  border-bottom: 3px solid transparent !important;
  border-radius: 4px 4px 0 0 !important;
  transition: color .18s ease, border-color .18s ease, background-color .18s ease !important;
}
header.ov-header nav > a:hover,
header.ov-header nav > span > a:hover,
header.ov-header nav .ov-shop-mega:hover > a,
header.ov-header nav .ov-has-dropdown:hover > a,
header.ov-header nav .ov-res-dropdown:hover > a,
header.ov-header nav .ov-learn-mega:hover > a {
  color: #2D9CDB !important;
  border-bottom-color: #2D9CDB !important;
  border-bottom: 3px solid #2D9CDB !important;
  background-color: rgba(45,156,219,0.10) !important;
}
header.ov-header nav a.ov-active {
  color: #2D9CDB !important;
  border-bottom: 3px solid #2D9CDB !important;
}


/* Lock layout to ~14" laptop view across all desktop screen sizes.
   On screens >= 1024px, cap key max-widths to 1280px so larger monitors
   don't stretch the layout. */
@media (min-width: 1024px) {
  html body .ovx-hero__wrap,
  html body .ovx-sec__wrap,
  html body .ovx-bulk__wrap,
  html body .ovx-founder__wrap,
  html body .ovx-press__wrap,
  html body .col-shell,
  html body .col-hero-inner,
  html body .col-products-grid,
  html body .col-page-inner,
  html body .col-container,
  html body .col-grid,
  html body .ov-rl-hero-inner,
  html body .ov-rl-shell,
  html body .gh-hero-inner,
  html body .gh-shell,
  html body .ova-hero-inner,
  html body .ovp-page,
  html body .ovp-main,
  html body .ov-cart-hero > div,
  html body .ov-page-switcher-inner,
  html body .ovp-cmpkit-wrap,
  html body main > section > div[style*="max-width:1180px"],
  html body main > section > div[style*="max-width: 1180px"],
  html body main > section > div[style*="max-width:1240px"],
  html body main > section > div[style*="max-width: 1240px"],
  html body main > section > div[style*="max-width:1280px"],
  html body main > section > div[style*="max-width: 1280px"],
  html body section > div[style*="max-width:1180px"],
  html body section > div[style*="max-width:1240px"] {
    /* Scale with viewport so larger screens fill proportionally (90vw),
       with a sane upper cap so 4K monitors don't get TOO wide. */
    max-width: min(92vw, 2000px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}


/* Override the prior @media (max-width: 860px) rule that hid the nav.
   Keep nav visible down to ~700px, just shrink + wrap. Only below 700px do we
   hide the inline nav and rely on the hamburger drawer. */
@media (max-width: 1100px) {
  header.ov-header nav {
    flex-wrap: wrap !important;
    gap: 14px !important;
    font-size: 13px !important;
  }
}
@media (max-width: 860px) {
  header.ov-header nav {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px 14px !important;
    font-size: 12.5px !important;
  }
  header.ov-header nav > a,
  header.ov-header nav > span > a {
    padding: 6px 4px !important;
  }
}
@media (max-width: 700px) {
  header.ov-header nav { display: none !important; }
  header.ov-header .ovx-mobile-hamburger { display: inline-flex !important; }
}

/* Hamburger button, hidden by default, shown only under 700px */
.ovx-mobile-hamburger {
  display: none;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  background: transparent;
  border: 1px solid rgba(27,42,78,0.20);
  border-radius: 6px;
  cursor: pointer;
  color: #1B2A4E;
  padding: 0;
  margin-left: 12px;
}
.ovx-mobile-hamburger svg { width: 22px; height: 22px; }

/* Slide-down drawer, anchored to the header */
.ovx-mobile-drawer {
  display: none;
  position: fixed;
  top: 0; left: 0; right: 0;
  background: #fff;
  border-bottom: 1px solid rgba(27,42,78,0.10);
  box-shadow: 0 14px 24px rgba(27,42,78,0.10);
  z-index: 9990;
  padding: 78px 20px 20px;
  max-height: 100vh;
  overflow-y: auto;
}
.ovx-mobile-drawer.is-open { display: block; }
.ovx-mobile-drawer a {
  display: block;
  padding: 14px 12px;
  color: #1B2A4E;
  text-decoration: none;
  font-size: 15px;
  border-bottom: 1px solid rgba(27,42,78,0.06);
}
.ovx-mobile-drawer a:hover { background: #F4F7FB; color: #2D9CDB; }
.ovx-mobile-drawer .ovx-mobile-section-label {
  font-size: 10.5px; font-weight: 700; letter-spacing: 0.16em;
  text-transform: uppercase; color: #52606e;
  padding: 18px 12px 8px;
}
.ovx-mobile-drawer-close {
  position: absolute; top: 16px; right: 16px;
  width: 40px; height: 40px;
  background: transparent; border: 1px solid rgba(27,42,78,0.20);
  border-radius: 6px; cursor: pointer; color: #1B2A4E;
  display: flex; align-items: center; justify-content: center;
  font-size: 24px; line-height: 1;
}


/* Scale the base font size with viewport so everything (text, padding, buttons)
   grows proportionally on larger screens, matching the "14-inch laptop" feel.
   Only applies on desktop viewports. */
@media (min-width: 1024px) {
  html {
    /* Base of 16px on a 1440px laptop, scaling up to 19.2px on a 2000px screen */
    font-size: clamp(16px, 1.0vw + 1.5px, 19.5px);
  }
  /* Bump key text bigger relative to base */
  html body .col-product__title { font-size: 1rem !important; }
  html body .col-product__desc { font-size: 0.92rem !important; }
  html body .ovp-h1 { font-size: clamp(28px, 2.5vw, 40px) !important; }
}
/* Push the product page gallery to take MORE of the available width
   on bigger screens so the hero photo looks substantial. */
@media (min-width: 1280px) {
  html body .ovp-main {
    grid-template-columns: minmax(0, 1.4fr) minmax(380px, 0.8fr) !important;
    gap: 64px !important;
  }
}
@media (min-width: 1600px) {
  html body .ovp-main {
    grid-template-columns: minmax(0, 1.5fr) minmax(420px, 0.7fr) !important;
    gap: 72px !important;
  }
}


.ovx-cchat{position:fixed;bottom:64px;right:18px;width:min(92vw,360px);height:min(72vh,520px);background:#fff;border:1px solid rgba(27,42,78,0.14);border-radius:14px;box-shadow:0 24px 60px rgba(27,42,78,0.28);z-index:100002;display:none;flex-direction:column;overflow:hidden;font-family:Assistant,-apple-system,sans-serif;}
.ovx-cchat.is-open{display:flex;}
.ovx-cchat__hd{background:#1B2A4E;color:#fff;padding:14px 16px;display:flex;align-items:center;gap:10px;}
.ovx-cchat__hd b{font-size:14px;font-weight:700;display:block;}
.ovx-cchat__hd small{display:block;font-size:11px;color:#A5DFFA;font-weight:500;}
.ovx-cchat__x{margin-left:auto;background:none;border:0;color:#fff;font-size:22px;cursor:pointer;line-height:1;}
.ovx-cchat__body{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:10px;background:#F7F9FC;}
.ovx-cchat__msg{max-width:85%;padding:9px 12px;border-radius:12px;font-size:13.5px;line-height:1.45;}
.ovx-cchat__msg--bot{background:#fff;border:1px solid rgba(27,42,78,0.10);color:#1B2A4E;align-self:flex-start;border-bottom-left-radius:4px;}
.ovx-cchat__msg--me{background:#2D9CDB;color:#fff;align-self:flex-end;border-bottom-right-radius:4px;}
.ovx-cchat__ft{display:flex;gap:8px;padding:10px;border-top:1px solid rgba(27,42,78,0.08);background:#fff;}
.ovx-cchat__in{flex:1;border:1px solid rgba(27,42,78,0.18);border-radius:18px;padding:9px 14px;font-size:13.5px;font-family:inherit;outline:none;}
.ovx-cchat__in:focus{border-color:#2D9CDB;}
.ovx-cchat__send{background:#1B2A4E;color:#fff;border:0;border-radius:18px;padding:0 16px;font-weight:700;font-size:13px;cursor:pointer;}


/* Mobile: center the header logo, and shrink the right-side floating buttons to
   compact icon circles so they stop covering page content. */
@media (max-width: 760px){
  header.ov-header > div{ position:relative !important; display:block !important; text-align:center !important; }
  header.ov-header > div > a{ display:inline-block !important; float:none !important; }
  header.ov-header > div > div{ position:absolute !important; right:10px !important; top:50% !important; transform:translateY(-50%) !important; margin:0 !important; }
  html body #ov-preview-cart-btn, html body #ov-clinical-chat-btn, html body .ov-clinical-chat-btn, html body #ov-ship-meter-btn{
    width:46px !important; height:46px !important; min-width:0 !important; padding:0 !important;
    border-radius:50% !important; font-size:0 !important; line-height:0 !important;
    display:inline-flex !important; align-items:center !important; justify-content:center !important;
    overflow:hidden !important; gap:0 !important;
  }
  html body #ov-preview-cart-btn::before{ content:"\1F6D2"; font-size:21px; line-height:1; }
  html body #ov-clinical-chat-btn::before, html body .ov-clinical-chat-btn::before{ content:"\1F4AC"; font-size:21px; line-height:1; }
  html body #ov-ship-meter-btn::before{ content:"\1F4E6"; font-size:19px; line-height:1; }
  html body #ov-ship-meter-btn > span{ display:none !important; }
}


/* Collapse the header nav into the hamburger dropdown whenever it can't fit on
   one line (at ANY viewport width), instead of wrapping to two rows. JS toggles
   html.ov-nav-collapsed based on the nav's real fit in its column. */
header.ov-header nav,
header nav.ov-header-nav { flex-wrap: nowrap !important; }
html.ov-nav-collapsed header.ov-header nav,
html.ov-nav-collapsed header nav.ov-header-nav { display: none !important; }
html.ov-nav-collapsed .ovx-mobile-hamburger {
  display: inline-flex !important;
  position: fixed !important;
  top: 16px; left: 16px;
  z-index: 1200 !important;
  background: #fff !important;
  box-shadow: 0 2px 8px rgba(27,42,78,0.16);
}
/* Keep the logo centered (and icons right) when the nav collapses on grid-layout
   widths. Hiding the nav would otherwise let the 1fr/auto/1fr grid auto-place the
   logo into the empty left column. Inert under the <=760 mobile (block) layout,
   which already centers the logo via text-align. */
html.ov-nav-collapsed header.ov-header > div { grid-template-columns: 1fr auto 1fr !important; }
html.ov-nav-collapsed header.ov-header > div > a { grid-column: 2 !important; justify-self: center !important; }
html.ov-nav-collapsed header.ov-header > div > div { grid-column: 3 !important; justify-self: end !important; }

/* ── Modern collapsed-nav dropdown panel ────────────────────────────────
   Restyle the hamburger drawer: a clean left-anchored sheet with a brand
   accent bar, rounded corners, soft shadow, refined links + chevrons, and a
   smooth fade/slide. The .is-open class (toggled by the existing buttons)
   drives visibility, so no markup/JS changes are needed. */
.ovx-mobile-drawer {
  display: block !important; visibility: hidden; opacity: 0; transform: translateY(-10px);
  pointer-events: none; transition: opacity .24s ease, transform .24s ease, visibility .24s ease;
  top: 0 !important; left: 0 !important; right: auto !important;
  width: min(382px, 100vw) !important;
  background: #fff !important; border: 0 !important;
  border-radius: 0 0 18px 18px !important;
  box-shadow: 0 28px 64px -16px rgba(15,23,42,0.36) !important;
  padding: 72px 14px 16px !important; max-height: calc(100vh - 8px); overflow-y: auto;
}
.ovx-mobile-drawer.is-open { visibility: visible !important; opacity: 1 !important; transform: none !important; pointer-events: auto !important; }
.ovx-mobile-drawer::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 4px;
  background: linear-gradient(90deg, #1B2A4E 0%, #2D9CDB 58%, #DAB156 100%);
}
.ovx-mobile-drawer a {
  position: relative; display: flex !important; align-items: center; justify-content: space-between;
  padding: 12px 14px !important; margin: 1px 0 !important; border: 0 !important; border-radius: 10px !important;
  color: #1B2A4E !important; font-size: 15px !important; font-weight: 600 !important; letter-spacing: -0.01em;
  text-decoration: none !important; transition: background .15s ease, color .15s ease, padding-left .15s ease;
}
.ovx-mobile-drawer a::after {
  content: "\203A"; font-size: 18px; line-height: 1; color: #c3ccd6; font-weight: 700;
  transition: transform .15s ease, color .15s ease;
}
.ovx-mobile-drawer a:hover { background: #F1F7FC !important; color: #2D9CDB !important; padding-left: 18px !important; }
.ovx-mobile-drawer a:hover::after { color: #2D9CDB; transform: translateX(3px); }
.ovx-mobile-drawer .ovx-mobile-section-label {
  font-size: 10px !important; font-weight: 800 !important; letter-spacing: 0.16em !important; text-transform: uppercase !important;
  color: #8A97A6 !important; padding: 15px 14px 5px !important; margin: 5px 0 2px !important;
  border-top: 1px solid rgba(27,42,78,0.07);
}
.ovx-mobile-drawer-close {
  top: 15px !important; right: 14px !important; width: 38px !important; height: 38px !important;
  border: 0 !important; border-radius: 50% !important; background: #F1F4F8 !important; color: #1B2A4E !important;
  font-size: 20px !important; line-height: 1 !important; display: flex !important; align-items: center !important; justify-content: center !important;
  transition: background .15s ease, transform .2s ease;
}
.ovx-mobile-drawer-close:hover { background: #E2E8F0 !important; transform: rotate(90deg); }


html body .post-hero{
  background-image: linear-gradient(to bottom,#1B2A4E 0%,#1B2A4E 3%,rgba(27,42,78,0) 26%),linear-gradient(90deg,rgba(10,17,32,.88) 0%,rgba(10,17,32,.72) 28%,rgba(10,17,32,.42) 52%,rgba(10,17,32,.14) 72%,rgba(10,17,32,0) 86%), url(learn-clinical-guidance.webp) !important;
  background-size:cover !important; background-position:center right !important; background-repeat:no-repeat !important;
  min-height:clamp(360px,46vh,520px) !important; opacity:1 !important;
}
@media (max-width:768px){ html body .post-hero{
  background-image: linear-gradient(180deg,rgba(27,42,78,.42) 0%,rgba(27,42,78,.72) 60%,rgba(27,42,78,.92) 100%), url(learn-clinical-guidance.webp) !important;
  background-position:74% center !important; min-height:300px !important;
} }


html body .post-hero{min-height:clamp(320px,40vh,460px) !important;max-height:560px !important;width:100vw !important;max-width:100vw !important;margin-left:calc(50% - 50vw) !important;margin-right:calc(50% - 50vw) !important;display:flex !important;flex-direction:column !important;justify-content:center !important;}
@media (max-width:768px){html body .post-hero{min-height:300px !important;max-height:420px !important;}}


html body header.ov-header{position:fixed!important;top:0!important;left:0!important;right:0!important;width:100%!important;background-color:transparent!important;border-bottom:1px solid transparent!important;box-shadow:none!important;z-index:1200!important;transition:background-color .25s ease,border-color .25s ease!important;}
html body header.ov-header a{transition:color .25s ease!important;}
html body header.ov-header img[src*="ovena-logo"]{transition:filter .25s ease!important;}
html body header.ov-header.nav--dark a{color:#fff!important;}
html body header.ov-header.nav--dark img[src*="ovena-logo"]{filter:brightness(0) invert(1)!important;}
html body header.ov-header.nav--light a{color:#1B2A4E!important;}
html body header.ov-header.nav--light img[src*="ovena-logo"]{filter:none!important;}
html body header.ov-header .ov-flyout a,html body header.ov-header .ov-dropdown a,html body header.ov-header .ov-mega a{color:#1B2A4E!important;}
html body header.ov-header.nav--scrolled.nav--light{border-bottom-color:rgba(27,42,78,.12)!important;box-shadow:0 1px 0 rgba(27,42,78,.04)!important;}
html body header.ov-header.nav--scrolled.nav--dark{border-bottom-color:rgba(255,255,255,.16)!important;}

/* Learn .post-hero headline = Source Serif (match bulk hero); color/scrim handled by global herofix */
html body article.post-shell .post-hero h1{font-family:'Source Serif 4',Georgia,serif !important;color:#fff !important;}
html body article.post-shell .post-hero .kicker,html body article.post-shell .post-hero .post-eyebrow,html body article.post-shell .post-hero .eyebrow{color:#DAB156 !important;}
html body article.post-shell .post-hero .post-dek,html body article.post-shell .post-hero p:not(.kicker){color:rgba(255,255,255,.88) !important;}
html body article.post-shell .post-hero .post-meta,html body article.post-shell .post-hero .post-meta *{color:rgba(255,255,255,.8) !important;}

.post-hero .post-dek{max-width:46ch !important;}

/* center hero content between nav bottom and hero bottom */
html body .post-hero{display:flex !important;flex-direction:column !important;justify-content:center !important;padding-top:106px !important;padding-bottom:34px !important;box-sizing:border-box !important;}

@media(max-width:680px){html body [class*="hero"] h1,html body .ovx-hero h1,html body .post-hero h1,html body article.post-shell .post-hero h1{font-size:clamp(25px,7vw,33px) !important;}}

/* NAV-ALIGNED HERO GEOMETRY: h1 first letter == nav Shop 'S' at every width */
html body article.post-shell .post-hero{padding-left:max(24px,calc(50vw - 640px)) !important;padding-right:max(24px,calc(50vw - 640px)) !important;}
html body article.post-shell .post-hero > div{max-width:1280px !important;margin:0 !important;padding:0 !important;}

@media(max-width:680px){body .post-dek{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}body .post-hero .post-meta{font-size:10.5px;gap:12px;}}

@media (max-width:768px){ html body .post-hero{justify-content:flex-start !important;padding-top:118px !important;} }
