/* === Block 1 === */
.vc-problem-card::after{content:'';position:absolute;top:0;left:0;right:0;height:3px;border-radius:14px 14px 0 0;opacity:0;transition:opacity 0.3s;}
      .vc-problem-card:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,0,0,0.06);border-color:#E2E8F0;}
      .vc-problem-card:nth-child(1)::after{background:#EC5A22;}
      .vc-problem-card:nth-child(2)::after{background:#00A9EA;}
      .vc-problem-card:nth-child(3)::after{background:#16A34A;}
      .vc-problem-card:hover::after{opacity:1;}
      @media(max-width:768px){.vc-problem-card{grid-column:span 1;}}

/* === Block 2 === */
.vc-feature-bento::after{content:'';position:absolute;top:0;left:0;right:0;height:3px;border-radius:14px 14px 0 0;opacity:0;transition:opacity 0.3s;}
      .vc-feature-bento:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,0,0,0.06);border-color:#E2E8F0;}
      .vc-feature-bento:nth-child(1)::after{background:#EC5A22;}
      .vc-feature-bento:nth-child(2)::after{background:#00A9EA;}
      .vc-feature-bento:nth-child(3)::after{background:#16A34A;}
      .vc-feature-bento:nth-child(4)::after{background:#8C278A;}
      .vc-feature-bento:nth-child(5)::after{background:#F5A11A;}
      .vc-feature-bento:nth-child(6)::after{background:#00A9EA;}
      .vc-feature-bento:hover::after{opacity:1;}
      @media(max-width:768px){
        .vc-feature-bento{grid-column:span 1;}
      }

/* === Block 3 === */
.flow-stage-new{transition:all 0.4s;}
        @keyframes vc-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
        @keyframes vc-rotate{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
        @keyframes vc-launch{0%,100%{transform:translateY(0) rotate(0deg)}25%{transform:translateY(-4px) rotate(-3deg)}50%{transform:translateY(-8px) rotate(0deg)}75%{transform:translateY(-4px) rotate(3deg)}}
        @keyframes vc-pulse-glow{0%,100%{filter:drop-shadow(0 0 2px rgba(236,90,34,0.4))}50%{filter:drop-shadow(0 0 6px rgba(236,90,34,0.7))}}
        .vc-floating-icon{display:inline-block;animation:vc-float 3s ease-in-out infinite;}
        .vc-rotating-icon{display:inline-block;animation:vc-rotate 2s linear infinite,vc-pulse-glow 2s ease-in-out infinite;}
        .vc-launching-icon{display:inline-block;animation:vc-launch 2.5s ease-in-out infinite;}
        .vc-usecase-card:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,0,0,0.06);border-color:#EC5A22;}
        @media(max-width:768px){
          #usecasesGrid{grid-template-columns:1fr !important;}
          .flow-arrow-new{display:none !important;}
          [style*="justify-content:space-between"]{flex-direction:column !important;gap:20px;}
        }
        @media(max-width:1024px){
          #usecasesGrid{grid-template-columns:repeat(2,1fr) !important;}
        }

/* === Block 4 === */
.vc-mini-card::after{content:'';position:absolute;top:0;left:0;right:0;height:3px;border-radius:14px 14px 0 0;opacity:0;transition:opacity 0.3s;}
        .vc-mini-card:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,0,0,0.06);}
        .vc-mini-card:nth-child(1)::after{background:#EC5A22;}
        .vc-mini-card:nth-child(2)::after{background:#00A9EA;}
        .vc-mini-card:nth-child(3)::after{background:#8C278A;}
        .vc-mini-card:nth-child(4)::after{background:#16A34A;}
        .vc-mini-card:nth-child(5)::after{background:#F5A11A;}
        .vc-mini-card:nth-child(6)::after{background:#EC5A22;}
        .vc-mini-card:hover::after{opacity:1;}
        @media(max-width:1024px){
          [style*="grid-template-columns:1fr 1fr"]{grid-template-columns:1fr !important;gap:40px !important;}
        }
        @media(max-width:768px){
          .vc-mini-card + .vc-mini-card{margin-top:0;}
        }

/* === Block 5 === */
/* Tablet adaptations (1024px and below) */
      @media (max-width: 1024px) {
        /* Hero section */
        .hero h1 {
          font-size: 2.5rem !important;
        }

        .hero p {
          font-size: 1.1rem !important;
        }

        /* Problem section cards */
        [style*="grid-template-columns: repeat(auto-fit, minmax(300px, 1fr))"] {
          grid-template-columns: 1fr !important;
          gap: 24px !important;
        }

        /* All 3-column grids to single column */
        [style*="grid-template-columns:repeat(3,1fr)"] {
          grid-template-columns: 1fr !important;
        }

        /* All 2-column grids to single column */
        [style*="grid-template-columns:1fr 1fr"] {
          grid-template-columns: 1fr !important;
          gap: 40px !important;
        }
      }

      /* Mobile adaptations (768px and below) */
      @media (max-width: 768px) {
        /* Hero section */
        .hero {
          padding: 80px 0 60px !important;
        }

        .hero h1 {
          font-size: 2rem !important;
          line-height: 1.3 !important;
          padding-left: 20px !important;
          padding-right: 20px !important;
        }

        .hero p {
          font-size: 1rem !important;
          padding: 0 20px !important;
        }

        .hero p br {
          display: none;
        }

        /* CTA buttons */
        .hero [style*="display: flex"][style*="gap: 20px"] {
          flex-direction: column !important;
          align-items: stretch !important;
          padding: 0 20px !important;
          gap: 16px !important;
        }

        .hero a[style*="padding: 20px"] {
          width: 100% !important;
          justify-content: center !important;
          padding: 16px 32px !important;
          font-size: 1rem !important;
        }

        /* Section titles */
        .section--title {
          font-size: 2rem !important;
          line-height: 1.3 !important;
          padding: 0 20px !important;
        }

        /* Problem section */
        [style*="padding: 80px 0"] {
          padding: 60px 0 !important;
        }

        [style*="padding: 100px 0"] {
          padding: 60px 0 !important;
        }

        [style*="padding: 120px 0"] {
          padding: 80px 0 !important;
        }

        [style*="padding: 140px 0"] {
          padding: 80px 0 !important;
        }

        /* Features section title */
        [style*="font-size: 3.5rem"] {
          font-size: 2rem !important;
        }

        [style*="font-size: 2.5rem"] {
          font-size: 1.75rem !important;
        }

        /* Feature cards and content */
        [style*="font-size: 1.3rem"][style*="line-height: 1.7"] {
          font-size: 1.1rem !important;
        }

        /* Animation flow section */
        #ideaFlowAnimation {
          height: auto !important;
          padding: 40px 20px !important;
        }

        .flow-stage {
          position: static !important;
          transform: none !important;
          margin-bottom: 30px !important;
        }

        .flow-arrow {
          display: none !important;
        }

        #ideaFlowAnimation > div {
          flex-direction: column !important;
          align-items: center !important;
        }

        /* Usecase cards grid */
        #usecasesGrid {
          grid-template-columns: 1fr !important;
          gap: 24px !important;
        }

        .usecase-card-premium {
          padding: 32px 24px !important;
        }

        /* More capabilities section */
        [style*="grid-template-columns: repeat(3, 1fr)"] {
          padding: 0 20px !important;
        }

        .mini-feature-card {
          padding: 32px 28px !important;
        }

        .mini-feature-card h4 {
          font-size: 1.2rem !important;
        }

        /* Container padding */
        .container {
          padding-left: 20px !important;
          padding-right: 20px !important;
        }

        /* CTA section */
        [style*="max-width: 700px"][style*="padding: 60px 40px"] {
          padding: 40px 24px !important;
        }

        [style*="max-width: 700px"] h3 {
          font-size: 2rem !important;
        }
      }

      /* Small mobile (480px and below) */
      @media (max-width: 480px) {
        .hero h1 {
          font-size: 1.65rem !important;
          padding-top: 20px !important;
        }

        .hero p {
          font-size: 0.95rem !important;
        }

        .section--title {
          font-size: 1.75rem !important;
        }

        [style*="font-size: 2.5rem"] {
          font-size: 1.5rem !important;
        }

        [style*="font-size: 2.2rem"] {
          font-size: 1.6rem !important;
        }

        /* Icon sizes */
        [style*="width: 56px"][style*="height: 56px"] {
          width: 48px !important;
          height: 48px !important;
        }

        [style*="width: 48px"][style*="height: 48px"]:not([viewBox]) {
          width: 40px !important;
          height: 40px !important;
        }

        /* Mini feature cards */
        .mini-feature-card h4 {
          font-size: 1.1rem !important;
        }

        .mini-feature-card p {
          font-size: 0.9rem !important;
        }

        /* Buttons */
        .hero a {
          padding: 14px 24px !important;
          font-size: 0.95rem !important;
        }

        /* CTA section */
        [style*="max-width: 700px"] h3 {
          font-size: 1.75rem !important;
        }

        [style*="max-width: 700px"] p {
          font-size: 1.05rem !important;
        }
      }

      /* Disable hover effects on touch devices */
      @media (hover: none) {
        .usecase-card-premium:hover {
          transform: translateY(0) !important;
        }

        .mini-feature-card:hover {
          transform: translateY(0) !important;
        }

        .feature-showcase:hover {
          transform: none !important;
        }
      }

      /* Landscape mobile optimization */
      @media (max-width: 768px) and (orientation: landscape) {
        .hero {
          padding: 60px 0 40px !important;
        }

        .hero h1 {
          font-size: 1.75rem !important;
          padding-top: 10px !important;
          padding-bottom: 10px !important;
        }

        .hero p {
          font-size: 0.95rem !important;
          margin-bottom: 30px !important;
        }
      }

