/* ===================================================================
   Shaz Vision — Mobile Responsiveness & Layout Fixes
   Addresses text collisions, excessive whitespace, layout overflows,
   and mobile component scaling across all viewports <= 800px.
   =================================================================== */

@media screen and (max-width: 800px), 
       screen and (orientation: portrait) and (max-width: 800px), 
       screen and (orientation: landscape) and (max-width: 1200px) and (max-height: 600px) {

  /* -----------------------------------------------------------------
     1. Global Resets & Viewport Containment (Zero-Jitter Smooth Scroll)
     ----------------------------------------------------------------- */
  html {
    font-size: 2.6666666667vw !important;
    overflow-x: clip !important;
    -webkit-text-size-adjust: 100%;
    scroll-behavior: auto !important;
  }

  body {
    overflow-x: clip !important;
    max-width: 100vw !important;
    width: 100% !important;
    min-height: 100% !important;
    min-height: 100dvh !important;
    font-size: 1.5rem !important;
    line-height: 1.55 !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior-y: none !important;
  }

  #container, #main, section, footer {
    max-width: 100vw !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  /* -----------------------------------------------------------------
     2. Typography & Heading Collision Prevention
     ----------------------------------------------------------------- */
  .h1, .h2, .h3, .h4, h1, h2, h3, .heading {
    line-height: 1.12 !important;
    letter-spacing: -0.02em !important;
    word-break: break-word !important;
    overflow-wrap: break-word !important;
  }

  .h1 {
    font-size: clamp(3.2rem, 8.5vw, 4.8rem) !important;
  }

  .h-anim .h-line {
    display: block !important;
    padding: 0.1em 0 !important;
    margin: 0 !important;
    overflow: visible !important;
    line-height: inherit !important;
    perspective: none !important;
    transform-style: flat !important;
  }

  .h-anim .h-word {
    display: inline-block !important;
    transform: none !important;
  }

  .h-anim {
    opacity: 1 !important;
  }

  .patch-ai .aiHero__heading .h-line:nth-child(3) .h-word::before,
  .patch-ai .aiHero__heading .h-line:nth-child(3) .h-word::after {
    display: none !important;
  }

  .body, p, li {
    font-size: 1.45rem !important;
    line-height: 1.55 !important;
  }

  /* -----------------------------------------------------------------
     3. Navigation Bar & Menu
     ----------------------------------------------------------------- */
  .nav {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: 100vw !important;
    z-index: 9999 !important;
    pointer-events: none !important;
    -webkit-transform: translateZ(0) !important;
    transform: translateZ(0) !important;
    -webkit-backface-visibility: hidden !important;
    backface-visibility: hidden !important;
  }

  html.menu-open .nav {
    height: 100vh !important;
    pointer-events: auto !important;
  }

  .patch-ai .nav__bar {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 1rem !important;
    height: 5.4rem !important;
    padding: 0 1.6rem !important;
    box-sizing: border-box !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    background: rgba(4, 4, 4, 0.88) !important;
    backdrop-filter: blur(14px) !important;
    -webkit-backdrop-filter: blur(14px) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
    z-index: 1001 !important;
    pointer-events: auto !important;
    -webkit-transform: translateZ(0) !important;
    transform: translateZ(0) !important;
    -webkit-backface-visibility: hidden !important;
    backface-visibility: hidden !important;
    will-change: transform !important;
  }

  .patch-ai .nav__barBg {
    display: none !important;
  }

  .patch-ai .nav__logo {
    display: none !important;
  }

  .patch-ai .nav__aiLogo {
    display: inline-flex !important;
    align-items: center !important;
    font-size: 1.45rem !important;
    letter-spacing: 0.05em !important;
    font-weight: 800 !important;
    margin-right: auto !important;
    text-decoration: none !important;
    pointer-events: auto !important;
  }

  .patch-ai a.nav__ctaButton.button,
  .patch-ai a.nav__ctaButton--ai.button {
    height: 3.4rem !important;
    padding: 0 1.2rem !important;
    border-radius: 0.6rem !important;
    flex: 0 0 auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    pointer-events: auto !important;
  }

  .patch-ai a.nav__ctaButton .button__inner,
  .patch-ai a.nav__ctaButton--ai .button__inner {
    font-size: 1.15rem !important;
    letter-spacing: 0.02em !important;
    font-weight: 700 !important;
    white-space: nowrap !important;
  }

  .patch-ai .nav__toggle {
    width: 3.8rem !important;
    height: 3.8rem !important;
    flex: 0 0 auto !important;
    margin-right: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 0.5rem !important;
    cursor: pointer !important;
    pointer-events: auto !important;
    position: relative !important;
    z-index: 1005 !important;
    padding: 0.4rem !important;
    box-sizing: border-box !important;
  }

  .patch-ai .nav__toggle span {
    display: block !important;
    width: 2.2rem !important;
    height: 2px !important;
    background-color: #f4f4f4 !important;
    border-radius: 2px !important;
    position: static !important;
    transform: none !important;
    transition: transform 0.3s cubic-bezier(0.5, 0, 0.25, 1), opacity 0.25s ease !important;
  }

  html.menu-open .patch-ai .nav__toggle span:nth-child(1) {
    transform: translateY(0.7rem) rotate(45deg) !important;
  }

  html.menu-open .patch-ai .nav__toggle span:nth-child(2) {
    opacity: 0 !important;
    transform: scaleX(0) !important;
  }

  html.menu-open .patch-ai .nav__toggle span:nth-child(3) {
    transform: translateY(-0.7rem) rotate(-45deg) !important;
  }

  html:not(.menu-open) .nav__menuBg {
    display: none !important;
  }

  html.menu-open .nav__overlay {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    background: rgba(4, 4, 6, 0.85) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    z-index: 999 !important;
  }

  html.menu-open .nav__menuBg {
    display: block !important;
    position: fixed !important;
    top: 1rem !important;
    left: 1rem !important;
    right: 1rem !important;
    bottom: 1rem !important;
    width: calc(100vw - 2rem) !important;
    height: calc(100vh - 2rem) !important;
    transform: none !important;
    border-radius: 1.6rem !important;
    background: rgba(12, 12, 18, 0.96) !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.85) !important;
    z-index: 1000 !important;
  }

  html:not(.menu-open) .nav__menu {
    display: none !important;
    pointer-events: none !important;
  }

  html.menu-open .nav__menu {
    display: flex !important;
    flex-direction: column !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    padding: 7rem 2.4rem 3rem !important;
    box-sizing: border-box !important;
    z-index: 1002 !important;
    pointer-events: auto !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }

  html.menu-open .nav__linksHeader {
    opacity: 1 !important;
    transform: none !important;
    font-size: 1.25rem !important;
    color: #8e8e98 !important;
    margin-bottom: 0.8rem !important;
    margin-top: 1.4rem !important;
    letter-spacing: 0.08em !important;
    font-weight: 700 !important;
  }

  html.menu-open .nav__menuLinks {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
  }

  html.menu-open .nav__menuLink {
    display: flex !important;
    align-items: center !important;
    height: 4.8rem !important;
    padding: 0 1.2rem !important;
    font-size: 2.2rem !important;
    line-height: 4.8rem !important;
    opacity: 1 !important;
    transform: none !important;
    border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
    color: #ffffff !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-weight: 700 !important;
    text-decoration: none !important;
  }

  html.menu-open .nav__menuLink:last-child {
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  }

  html.menu-open .nav__extraLinks {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 0.8rem !important;
    opacity: 1 !important;
    transform: none !important;
  }

  html.menu-open .nav__extraLink {
    display: inline-flex !important;
    align-items: center !important;
    padding: 0.8rem 1.6rem !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    border-radius: 0.8rem !important;
    font-size: 1.35rem !important;
    color: #e8e8ea !important;
    background: rgba(255, 255, 255, 0.05) !important;
    text-decoration: none !important;
    font-weight: 600 !important;
  }

  html.menu-open .nav__menuInfo {
    opacity: 1 !important;
    transform: none !important;
    margin-top: 2rem !important;
    padding-top: 1.5rem !important;
    border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
  }

  html.menu-open .nav__menuHeader {
    font-size: 1.25rem !important;
    color: #8e8e98 !important;
    margin-bottom: 0.6rem !important;
    margin-top: 1rem !important;
    letter-spacing: 0.06em !important;
    font-weight: 700 !important;
  }

  html.menu-open .nav__smallLink {
    font-size: 1.35rem !important;
    color: #52CAD8 !important;
    text-decoration: none !important;
  }

  /* -----------------------------------------------------------------
     4. Hero Section (#ai-hero)
     ----------------------------------------------------------------- */
  .patch-ai .aiHero,
  .aiHero {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
    padding: 8rem 1.6rem 4rem !important;
    min-height: 100vh !important;
    min-height: 100dvh !important;
    height: auto !important;
    box-sizing: border-box !important;
    position: relative !important;
    overflow: visible !important;
  }

  .patch-ai .aiHero__heading,
  .aiHero__heading {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    transform: none !important;
    width: 100% !important;
    text-align: center !important;
    font-size: clamp(3.2rem, 8.5vw, 4.6rem) !important;
    line-height: 1.08 !important;
    letter-spacing: -0.025em !important;
    margin: 0 0 1.6rem 0 !important;
    z-index: 5 !important;
  }

  .sv-3d-hero-wrap {
    position: relative !important;
    width: 85% !important;
    max-width: 270px !important;
    margin: 1rem auto 2.2rem !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    z-index: 4 !important;
  }

  .sv-3d-hero-img {
    width: 100% !important;
    max-width: 250px !important;
    height: auto !important;
    object-fit: contain !important;
  }

  .patch-ai .aiHero__bottom,
  .aiHero__bottom {
    position: relative !important;
    bottom: auto !important;
    left: auto !important;
    transform: none !important;
    width: 100% !important;
    max-width: 36rem !important;
    margin: 0 auto !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    gap: 1.2rem !important;
    z-index: 5 !important;
  }

  .patch-ai .aiHero__sub,
  .aiHero__sub {
    position: relative !important;
    left: auto !important;
    bottom: auto !important;
    transform: none !important;
    width: 100% !important;
    max-width: 32rem !important;
    font-size: 1.5rem !important;
    line-height: 1.5 !important;
    text-align: center !important;
    color: #e8e8ea !important;
    margin: 0 auto !important;
  }

  /* -----------------------------------------------------------------
     5. Pitch Section (#ai-pitch)
     ----------------------------------------------------------------- */
  .patch-ai .aiPitch,
  .aiPitch {
    padding: 4rem 1.6rem 3rem !important;
    margin: 0 0 2rem 0 !important;
    position: relative !important;
  }

  .aiPitch__left {
    position: static !important;
    height: auto !important;
    width: 100% !important;
    padding: 0 !important;
    margin-bottom: 2.5rem !important;
  }

  .patch-ai .aiPitch__heading,
  .aiPitch__heading {
    font-size: clamp(2.8rem, 7.5vw, 4rem) !important;
    line-height: 1.1 !important;
    margin-bottom: 1.2rem !important;
    text-align: left !important;
  }

  .aiPitch__sub {
    position: relative !important;
    bottom: auto !important;
    left: auto !important;
    display: inline-block !important;
    margin-top: 0.8rem !important;
    font-size: 1.35rem !important;
    padding: 0.6rem 1.4rem !important;
    border-radius: 0.6rem !important;
    transform: rotate(-2deg) !important;
    background: #0e0e10 !important;
    border: 1px solid rgba(255,255,255,0.2) !important;
  }

  .aiPitch__canvas {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    opacity: 0.25 !important;
    pointer-events: none !important;
  }

  .aiPitch__right {
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  .aiPitch__cards {
    display: flex !important;
    flex-direction: column !important;
    gap: 1.2rem !important;
    width: 100% !important;
  }

  .aiPitch__card {
    position: relative !important;
    width: 100% !important;
    box-sizing: border-box !important;
    min-height: auto !important;
    margin: 0 !important;
    padding: 1.6rem 1.6rem 1.6rem 6.6rem !important;
    border-radius: 1.2rem !important;
    border: 1px solid rgba(141,124,218,0.25) !important;
    background: rgba(255,255,255,0.035) !important;
    backdrop-filter: blur(8px) !important;
    display: flex !important;
    align-items: center !important;
  }

  .aiPitch__card::before {
    font-size: 1.1rem !important;
    padding: 0.4rem 0.6rem !important;
    border-bottom-right-radius: 0.8rem !important;
    border-color: rgba(141,124,218,0.3) !important;
  }

  .aiPitch__cardIcon {
    position: absolute !important;
    top: 50% !important;
    left: 1.2rem !important;
    transform: translateY(-50%) !important;
    width: 4.2rem !important;
    height: 4.2rem !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .aiPitch__cardIcon img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
  }

  .patch-ai .aiPitch__cardLabel,
  .aiPitch__cardLabel {
    font-size: 1.55rem !important;
    line-height: 1.35 !important;
    text-transform: none !important;
    font-weight: 700 !important;
    margin: 0 !important;
    color: #f4f4f4 !important;
    opacity: 0.9 !important;
    letter-spacing: -0.01em !important;
  }

  .aiPitch__card.active .aiPitch__cardLabel {
    opacity: 1 !important;
    color: #fff !important;
  }

  /* -----------------------------------------------------------------
     6. Benefits Section (#ai-benefits)
     ----------------------------------------------------------------- */
  .patch-ai .aiBenefits,
  .aiBenefits {
    position: relative !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding: 4rem 1.6rem 3.5rem !important;
    text-align: center !important;
  }

  .aiBenefits__fadeZone {
    display: none !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .aiBenefits__intro {
    margin: 0 auto 2.2rem !important;
  }

  .patch-ai .aiBenefits__introHeading,
  .aiBenefits__introHeading {
    font-size: clamp(2.8rem, 7.5vw, 4rem) !important;
    line-height: 1.1 !important;
    margin-bottom: 0.8rem !important;
  }

  .aiBenefits__introSub {
    font-size: 1.5rem !important;
    color: var(--sv-muted) !important;
    margin: 0 !important;
  }

  .aiBenefits__statements {
    position: static !important;
    height: auto !important;
    margin: 1.8rem 0 0 !important;
  }

  .aiBenefits__statementsStage {
    position: static !important;
    height: auto !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 1.4rem !important;
    margin: 0 !important;
    overflow: visible !important;
    perspective: none !important;
  }

  .aiBenefits__statement {
    position: relative !important;
    inset: auto !important;
    opacity: 1 !important;
    transform: none !important;
    display: flex !important;
    justify-content: center !important;
  }

  .patch-ai .aiBenefits__statementText,
  .aiBenefits__statementText {
    font-size: clamp(2.6rem, 7vw, 3.6rem) !important;
    line-height: 1.2 !important;
    padding: 0 !important;
    text-align: center !important;
  }

  .aiBenefits__statementText::before,
  .aiBenefits__statementText::after {
    display: none !important;
  }

  /* -----------------------------------------------------------------
     7. Features Section (#ai-features)
     ----------------------------------------------------------------- */
  .patch-ai .aiFeatures,
  .aiFeatures {
    position: relative !important;
    height: auto !important;
    margin: 2rem 0 !important;
    padding: 2rem 1.4rem !important;
  }

  .aiFeatures__sticky {
    position: static !important;
    height: auto !important;
    overflow: visible !important;
  }

  .aiFeatures__slides {
    position: static !important;
    height: auto !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 2rem !important;
  }

  .aiFeatures__card {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    width: 100% !important;
    height: auto !important;
    transform: none !important;
    background: #0e0e10 !important;
    border: 1px solid rgba(141,124,218,0.25) !important;
    border-radius: 1.4rem !important;
    overflow: hidden !important;
    margin: 0 !important;
  }

  .aiFeatures__cardMedia {
    position: static !important;
    width: 100% !important;
    height: auto !important;
    padding: 1.6rem 1.6rem 0 !important;
    margin: 0 !important;
    border: none !important;
    background: transparent !important;
    display: flex !important;
    justify-content: center !important;
  }

  .aiFeatures__cardMedia img,
  .aiFeatures__cardMedia picture img {
    width: 100% !important;
    max-height: 200px !important;
    object-fit: contain !important;
    border-radius: 1rem !important;
    display: block !important;
  }

  .aiFeatures__cardInner {
    width: 100% !important;
    padding: 1.6rem 1.6rem 2.2rem !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }

  .patch-ai .aiFeatures__cardNum,
  .aiFeatures__cardNum {
    font-size: 3.2rem !important;
    line-height: 1 !important;
    margin-bottom: 0.4rem !important;
    color: #8D7CDA !important;
  }

  .patch-ai .aiFeatures__cardFeature,
  .aiFeatures__cardFeature {
    font-size: 1.2rem !important;
    line-height: 1.4 !important;
    margin-bottom: 0.8rem !important;
    letter-spacing: 0.06em !important;
  }

  .patch-ai .aiFeatures__cardHeading,
  .aiFeatures__cardHeading {
    font-size: 2.2rem !important;
    line-height: 1.2 !important;
    width: 100% !important;
    margin-bottom: 1rem !important;
    text-transform: none !important;
  }

  .aiFeatures__cardBody {
    font-size: 1.45rem !important;
    line-height: 1.55 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-bottom: 1.4rem !important;
    color: var(--sv-muted) !important;
  }

  .aiFeatures__cardSubheading {
    font-size: 1.35rem !important;
    margin-top: 1.2rem !important;
  }

  .aiFeatures__cardList {
    display: flex !important;
    flex-direction: column !important;
    gap: 0.8rem !important;
    width: 100% !important;
    margin: 1rem 0 0 !important;
  }

  .aiFeatures__cardList li {
    font-size: 1.35rem !important;
    line-height: 1.4 !important;
    padding-left: 2.2rem !important;
    max-width: 100% !important;
    min-width: 0 !important;
    color: #e8e8ea !important;
  }

  .aiFeatures__cardList li::before {
    width: 1.4rem !important;
    height: 1.8rem !important;
    top: 0.1rem !important;
  }

  .aiFeatures__progress {
    display: none !important;
  }

  /* -----------------------------------------------------------------
     8. Rolling Banners (#ai-banners)
     ----------------------------------------------------------------- */
  .aiBanners {
    margin: 2rem 0 !important;
    overflow: hidden !important;
  }

  .rollingBanner {
    height: 4.8rem !important;
    overflow: hidden !important;
    font-size: 1.6rem !important;
  }

  .rollingBanner__rail {
    top: 1.4rem !important;
  }

  .rollingBanner span {
    padding: 0 1.6rem !important;
    font-size: 1.5rem !important;
  }

  .rollingBanner img {
    height: 1.2rem !important;
    margin-bottom: 0.2rem !important;
  }

  /* -----------------------------------------------------------------
     9. Projects Showcase (#case-studies)
     ----------------------------------------------------------------- */
  .patch-ai .aiProjects,
  .aiProjects {
    padding: 4rem 1.6rem !important;
    overflow: hidden !important;
  }

  .aiProjects h2.h1 {
    font-size: clamp(2.8rem, 7.5vw, 4rem) !important;
    line-height: 1.1 !important;
  }

  .aiProjects .body {
    font-size: 1.45rem !important;
    line-height: 1.55 !important;
    margin: 1rem 0 2rem !important;
  }

  .sv-projects-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 1.4rem !important;
  }

  .sv-project {
    padding: 1.8rem 1.6rem !important;
    border-radius: 1.2rem !important;
    border: 1px solid rgba(141,124,218,0.3) !important;
    background: #ffffff !important;
  }

  .sv-project .sv-3d-card-img {
    height: 120px !important;
    width: 100% !important;
    object-fit: contain !important;
    margin-bottom: 1rem !important;
  }

  .sv-project h3 {
    font-size: 1.8rem !important;
    line-height: 1.25 !important;
    margin: 0 0 0.6rem !important;
    color: #212121 !important;
  }

  .sv-project p {
    font-size: 1.4rem !important;
    line-height: 1.5 !important;
    color: #444 !important;
  }

  /* -----------------------------------------------------------------
     10. 3D Ecosystem Showcase (#3d-showcase)
     ----------------------------------------------------------------- */
  .sv-3d-showcase-section {
    padding: 4rem 1.6rem !important;
  }

  .sv-3d-showcase-section h2.h1 {
    font-size: clamp(2.8rem, 7.5vw, 4rem) !important;
    line-height: 1.1 !important;
  }

  .sv-3d-showcase-section p.body {
    font-size: 1.45rem !important;
    line-height: 1.55 !important;
    margin: 1rem auto 2rem !important;
  }

  .sv-3d-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 1.2rem !important;
    margin-top: 1.5rem !important;
  }

  .sv-3d-grid-item {
    padding: 1.8rem 1.4rem !important;
    border-radius: 1.2rem !important;
    background: rgba(255,255,255,0.04) !important;
    border: 1px solid rgba(255,255,255,0.1) !important;
  }

  .sv-3d-grid-img {
    width: 85px !important;
    height: 85px !important;
    margin-bottom: 1rem !important;
  }

  .sv-3d-grid-title {
    font-size: 1.7rem !important;
    margin-bottom: 0.4rem !important;
  }

  .sv-3d-grid-desc {
    font-size: 1.35rem !important;
    line-height: 1.5 !important;
  }

  /* -----------------------------------------------------------------
     11. Solutions & Pricing Packages (#offerings / .products)
     ----------------------------------------------------------------- */
  .products {
    padding: 4rem 1.6rem !important;
    height: auto !important;
  }

  .products + .aiCta {
    margin-top: 0 !important;
  }

  .products .sectionCounter {
    display: none !important;
  }

  .products h2.h1 {
    font-size: clamp(2.8rem, 7.5vw, 4rem) !important;
    line-height: 1.1 !important;
    margin-bottom: 1.5rem !important;
  }

  .products__plans {
    margin-top: 1.5rem !important;
  }

  .products__plans .sectionBlock {
    width: 100% !important;
    margin-bottom: 1.5rem !important;
    border-radius: 1rem !important;
  }

  .products__features,
  .products__sticky {
    display: none !important;
  }

  .products__mobile {
    display: block !important;
    width: 100% !important;
  }

  .products__productAccordion {
    border-radius: 1.2rem !important;
    border: 1px solid rgba(141,124,218,0.35) !important;
    background: rgba(255,255,255,0.035) !important;
    margin-top: 1.2rem !important;
    overflow: hidden !important;
  }

  .products__productAccordion .accordion__heading {
    padding: 1.8rem 1.6rem 1.4rem !important;
  }

  .products__productAccordion h3 {
    font-size: 2.2rem !important;
    line-height: 1.2 !important;
    color: #fff !important;
    margin-bottom: 0.4rem !important;
  }

  .products__productAccordion p {
    font-size: 1.4rem !important;
    color: var(--sv-muted) !important;
    margin: 0 !important;
  }

  .products__productAccordion .button {
    width: calc(100% - 3.2rem) !important;
    margin: 1rem 1.6rem 1.4rem !important;
    height: 4.4rem !important;
  }

  .products__productAccordion .accordion__inner {
    padding: 0 1.6rem 1.6rem !important;
  }

  .products__productAccordion .accordion__inner .products__feature {
    padding: 1.1rem 0 !important;
    display: flex !important;
    flex-direction: row !important;
    justify-content: space-between !important;
    align-items: center !important;
    border-bottom: 1px solid rgba(255,255,255,0.07) !important;
    gap: 1rem !important;
  }

  .products__productAccordion .accordion__inner .products__feature > div:nth-child(1) {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    max-width: none !important;
    padding: 0 !important;
    margin: 0 !important;
    text-align: left !important;
  }

  .products__productAccordion .accordion__inner .products__feature > div:nth-child(1) .body {
    font-size: 1.4rem !important;
    line-height: 1.4 !important;
    color: #e8e8ea !important;
  }

  .products__productAccordion .accordion__inner .products__feature > div:nth-child(2) {
    flex: 0 0 auto !important;
    min-width: 0 !important;
    max-width: none !important;
    padding: 0 !important;
    margin: 0 !important;
    text-align: right !important;
  }

  .products__productAccordion .accordion__inner .products__feature > div:nth-child(2) .body {
    font-size: 1.3rem !important;
    color: var(--sv-cyan) !important;
  }

  .products__productAccordion .accordion__inner .products__feature span.tick {
    display: inline-block !important;
    width: 2rem !important;
    height: 2rem !important;
    background-image: url(/images/tick.svg) !important;
    background-size: contain !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
  }

  .products__productAccordion .accordion__inner .products__feature span.cross {
    display: inline-block !important;
    width: 2rem !important;
    height: 2rem !important;
    background-image: url(/images/cross.svg) !important;
    background-size: contain !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
  }

  /* -----------------------------------------------------------------
     12. Call to Action (#ai-cta)
     ----------------------------------------------------------------- */
  .patch-ai .aiCta,
  .aiCta {
    padding: 4.5rem 1.6rem !important;
    margin: 0 !important;
  }

  .aiCta__inner {
    width: 100% !important;
    max-width: 48rem !important;
    margin: 0 auto !important;
    text-align: center !important;
  }

  .patch-ai .aiCta__heading,
  .aiCta__heading {
    font-size: clamp(2.8rem, 7.5vw, 4rem) !important;
    line-height: 1.1 !important;
    margin-bottom: 1.2rem !important;
  }

  .aiCta__sub {
    font-size: 1.55rem !important;
    line-height: 1.45 !important;
    width: 100% !important;
    max-width: 34rem !important;
    margin: 0 auto 1rem !important;
    color: #fff !important;
  }

  .aiCta__body {
    font-size: 1.4rem !important;
    line-height: 1.55 !important;
    width: 100% !important;
    max-width: 34rem !important;
    margin: 0 auto 2.2rem !important;
    color: var(--sv-muted) !important;
  }

  .aiCta__action {
    width: 100% !important;
    display: flex !important;
    justify-content: center !important;
  }

  .aiCta__button {
    width: 100% !important;
    max-width: 28rem !important;
    height: 4.8rem !important;
    border-radius: 0.8rem !important;
    display: inline-flex !important;
    justify-content: center !important;
    align-items: center !important;
    padding: 0 2rem !important;
  }

  .aiCta__button .button__inner {
    font-size: 1.5rem !important;
    font-weight: 700 !important;
  }

  /* -----------------------------------------------------------------
     13. FAQs Section (#faqs)
     ----------------------------------------------------------------- */
  .faqs {
    padding: 4rem 1.6rem !important;
  }

  .faqs h2.h1 {
    font-size: clamp(2.8rem, 7.5vw, 4rem) !important;
    line-height: 1.1 !important;
    margin-bottom: 1.5rem !important;
  }

  .faqs .sectionCounter {
    display: none !important;
  }

  .faqs__inner {
    margin-top: 1.5rem !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 1rem !important;
  }

  .faq {
    margin-top: 0 !important;
    margin-bottom: 0.8rem !important;
    border-radius: 1rem !important;
    border: 1px solid rgba(141,124,218,0.3) !important;
    background: rgba(255,255,255,0.035) !important;
    overflow: hidden !important;
  }

  .faq__header {
    padding: 1.5rem 1.4rem !important;
    font-size: 1.55rem !important;
    line-height: 1.35 !important;
    color: #fff !important;
    cursor: pointer !important;
  }

  .faq__content {
    padding: 0 1.4rem 1.5rem !important;
    font-size: 1.4rem !important;
    line-height: 1.55 !important;
    color: var(--sv-muted) !important;
  }

  /* -----------------------------------------------------------------
     14. Footer (.footer)
     ----------------------------------------------------------------- */
  .patch-ai .footer {
    padding: 0 1.4rem 2rem !important;
  }

  .patch-ai .footer::before {
    margin-bottom: 2rem !important;
  }

  .patch-ai .footer__top {
    display: flex !important;
    flex-direction: column !important;
    gap: 1.2rem !important;
  }

  .patch-ai .footer__topLeft {
    width: 100% !important;
    padding: 2.2rem 1.6rem !important;
    border-radius: 1rem !important;
    margin-bottom: 0.6rem !important;
    box-sizing: border-box !important;
  }

  .patch-ai .footer__logo {
    margin: 0 0 1.6rem !important;
  }

  .patch-ai .footer__mainLogo {
    font-size: 2.2rem !important;
  }

  .patch-ai .footer__tagline {
    font-size: 1.35rem !important;
    line-height: 1.5 !important;
    margin-top: 0.6rem !important;
  }

  .patch-ai .footer__subscribe {
    width: 100% !important;
  }

  .patch-ai .footer__subscribe p {
    font-size: 1.45rem !important;
    margin-bottom: 0.8rem !important;
  }

  .footer__subscribe .subscribe__form,
  #sv-subscribe {
    display: flex !important;
    flex-direction: column !important;
    gap: 1rem !important;
    width: 100% !important;
  }

  .subscribe__form .sv-subscribe-input,
  .subscribe__form #sv-email,
  .footer__subscribe input[type="email"] {
    min-width: 0 !important;
    width: 100% !important;
    height: 4.4rem !important;
    font-size: 1.45rem !important;
    padding: 0 1.4rem !important;
    box-sizing: border-box !important;
  }

  .sv-subscribe-btn {
    width: 100% !important;
    height: 4.4rem !important;
    justify-content: center !important;
    border-radius: 0.6rem !important;
    flex: 0 0 auto !important;
  }

  .patch-ai .footer__topRight {
    display: flex !important;
    flex-direction: column !important;
    gap: 1.2rem !important;
    width: 100% !important;
  }

  .patch-ai .footer__row {
    padding: 2.2rem 1.6rem !important;
    border-radius: 1rem !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 2rem !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .patch-ai .footer__col {
    width: 100% !important;
  }

  .patch-ai .footer__header {
    font-size: 1.2rem !important;
    margin-bottom: 0.8rem !important;
  }

  .patch-ai .footer__link {
    font-size: 1.45rem !important;
    padding: 0.4rem 0 !important;
    display: block !important;
  }

  .patch-ai .footer__bottom {
    padding: 1.4rem 1rem !important;
    margin-top: 1rem !important;
    border-radius: 1rem !important;
    display: flex !important;
    flex-direction: column !important;
    text-align: center !important;
    gap: 0.8rem !important;
    font-size: 1.2rem !important;
  }

  /* -----------------------------------------------------------------
     15. Sub-pages (sv-pages)
     ----------------------------------------------------------------- */
  .sv-topbar {
    padding: 1rem 1.6rem !important;
    height: 5.2rem !important;
    box-sizing: border-box !important;
  }

  .sv-topbar .brand {
    font-size: 1.5rem !important;
    font-weight: 800 !important;
  }

  .sv-topbar .cta {
    padding: 0.7rem 1.2rem !important;
    font-size: 1.15rem !important;
  }

  .sv-page {
    padding: 7.5rem 1.6rem 4rem !important;
    min-height: auto !important;
  }

  .sv-page h1 {
    font-size: clamp(2.6rem, 7.5vw, 3.8rem) !important;
    line-height: 1.12 !important;
    margin-bottom: 1.2rem !important;
  }

  .sv-page h2 {
    font-size: clamp(2rem, 5.5vw, 2.6rem) !important;
    line-height: 1.2 !important;
    margin: 2.4rem 0 1rem !important;
  }

  .sv-page h3 {
    font-size: 1.65rem !important;
    line-height: 1.3 !important;
  }

  .sv-page p, .sv-page li {
    font-size: 1.45rem !important;
    line-height: 1.6 !important;
  }

  .sv-page .lede {
    font-size: 1.6rem !important;
    line-height: 1.5 !important;
    margin-bottom: 2rem !important;
  }

  .sv-grid {
    grid-template-columns: 1fr !important;
    gap: 1.2rem !important;
  }

  .sv-card {
    padding: 1.6rem !important;
    margin-bottom: 0 !important;
  }

  .sv-step {
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start !important;
    gap: 1.2rem !important;
    margin-bottom: 1.8rem !important;
  }

  .sv-step .num {
    flex: 0 0 3.8rem !important;
    height: 3.8rem !important;
    font-size: 1.4rem !important;
    border-radius: 0.8rem !important;
  }

  .sv-step > svg {
    display: none !important;
  }

  /* Handle subpage responsive sidebars */
  [style*="flex: 0 0 280px"],
  [style*="flex:0 0 280px"],
  [style*="flex: 0 0 320px"],
  [style*="flex:0 0 320px"] {
    flex: 1 1 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  [style*="min-width: 280px"],
  [style*="min-width:280px"],
  [style*="min-width: 300px"],
  [style*="min-width:300px"] {
    min-width: 0 !important;
    width: 100% !important;
  }

  .sv-form {
    width: 100% !important;
    max-width: 100% !important;
    gap: 1.2rem !important;
  }

  .sv-field input,
  .sv-field textarea {
    font-size: 1.45rem !important;
    padding: 1.1rem 1.2rem !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .sv-btn {
    width: 100% !important;
    justify-content: center !important;
    text-align: center !important;
    padding: 1.2rem !important;
    font-size: 1.45rem !important;
  }

  .sv-footer {
    padding: 2.5rem 1.6rem 3rem !important;
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 1rem 1.4rem !important;
    font-size: 1.3rem !important;
  }

  .sv-footer a {
    margin: 0 !important;
  }
}
