/* ==========================================================================
   INDIA INNOVATION — RESPONSIVE MEDIA QUERIES
   Ensures 100% responsiveness across all mobile, tablet, and small screen devices
   while preserving the exact desktop & laptop UI without any desktop breakage.
   ========================================================================== */

/* ==========================================================================
   GLOBAL RESPONSIVE SAFEGUARDS
   ========================================================================== */
html, body {
  overflow-x: hidden !important;
  max-width: 100vw;
  width: 100%;
  position: relative;
}

img, video, svg, iframe {
  max-width: 100%;
  height: auto;
}

/* Ensure smooth tap animations on mobile */
@media (hover: none) and (pointer: coarse) {
  .btn, .nav-link, .capability-tab-btn, .industry-tab-item, .hero-pub-filter-btn {
    -webkit-tap-highlight-color: transparent;
  }
}

/* ==========================================================================
   1. LARGE DESKTOP & STANDARD LAPTOP (1200px - 1400px)
   ========================================================================== */
@media (max-width: 1280px) {
  .hero-headline {
    font-size: 3.2rem;
  }
  
  .mega-inner {
    grid-template-columns: 220px 1px 1fr 1px 280px;
    gap: 20px;
  }
  
  .industries-grid {
    grid-template-columns: 1fr 1fr 1fr;
  }
  
  .industries-grid .industry-stack:last-child {
    grid-column: span 3;
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .container {
    padding-left: 24px;
    padding-right: 24px;
  }
}

/* ==========================================================================
   2. DESKTOP / LAPTOP (1024px - 1199px)
   ========================================================================== */
@media (max-width: 1199px) {
  .primary-nav {
    gap: 16px;
  }
  
  .nav-list {
    gap: 14px;
  }

  .nav-link {
    font-size: 0.88rem;
  }

  .hero-inner {
    grid-template-columns: 1fr;
    gap: 48px;
  }

  .hero-left {
    max-width: 100%;
  }

  .stats-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .overview-grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .overview-image {
    max-width: 100%;
    height: 380px;
  }

  .overview-text {
    max-width: 100%;
    height: auto;
    gap: 24px;
  }

  .industries-grid {
    grid-template-columns: 1fr 1fr;
  }

  .industries-grid .industry-stack:last-child {
    grid-column: span 2;
  }

  .address-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .cert-row {
    grid-template-columns: repeat(2, 1fr);
  }

  .mega-inner {
    grid-template-columns: 200px 1px 1fr;
  }

  .mega-feature {
    display: none;
  }

  .mega-inner .mega-divider:last-of-type {
    display: none;
  }

  .case-studies-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

/* ==========================================================================
   3. TABLETS & SMALL LAPTOPS (768px - 1024px)
   ========================================================================== */
@media (max-width: 1024px) {
  /* Header & Navigation */
  .site-header {
    width: calc(100% - 24px);
    top: 12px;
    height: 68px;
    border-radius: 18px;
  }

  /* 3-Bar Hamburger Menu Button */
  .nav-toggle {
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    width: 28px !important;
    height: 20px !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    cursor: pointer !important;
    z-index: 1010 !important;
  }

  .nav-toggle-bar {
    display: block !important;
    width: 100% !important;
    height: 2.5px !important;
    background-color: #0F172A !important;
    border-radius: 2px !important;
    transition: all 0.25s ease !important;
  }

  .nav-toggle.open .nav-toggle-bar:nth-child(1) {
    transform: translateY(8.5px) rotate(45deg) !important;
  }

  .nav-toggle.open .nav-toggle-bar:nth-child(2) {
    opacity: 0 !important;
  }

  .nav-toggle.open .nav-toggle-bar:nth-child(3) {
    transform: translateY(-8.5px) rotate(-45deg) !important;
  }

  .desktop-nav-list,
  .site-header .header-inner > .primary-nav > .header-actions {
    display: none !important;
  }

  .mega-menu {
    display: none !important;
  }

  /* Mobile/Tablet Navigation Drawer */
  .primary-nav {
    position: fixed;
    top: 0;
    right: 0;
    width: 340px;
    max-width: 88vw;
    height: 100vh;
    background: #0B1526;
    border-left: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: -10px 0 35px rgba(0, 0, 0, 0.5);
    display: flex;
    flex-direction: column;
    align-items: stretch;
    padding: 0;
    gap: 0;
    overflow: hidden;
    transform: translateX(100%);
    transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
    z-index: 1005;
  }

  .primary-nav.open {
    transform: translateX(0);
  }

  .mobile-nav-wrapper {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%;
  }

  .mobile-nav-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  }

  .mobile-nav-title {
    font-family: var(--font-heading);
    font-size: 1.1rem;
    font-weight: 700;
    color: #FFFFFF;
    letter-spacing: 0.02em;
  }

  .mobile-nav-close {
    background: rgba(255, 255, 255, 0.1);
    border: none;
    color: #FFFFFF;
    font-size: 1.5rem;
    line-height: 1;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.2s ease;
  }

  .mobile-nav-close:hover {
    background: rgba(238, 108, 32, 0.8);
  }

  .mobile-accordion-list {
    flex: 1;
    overflow-y: auto;
    padding: 14px 16px;
    display: flex;
    flex-direction: column;
    gap: 8px;
  }

  .mobile-accordion-item {
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.06);
    overflow: hidden;
    transition: background 0.2s ease, border-color 0.2s ease;
  }

  .mobile-accordion-item.active {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(238, 108, 32, 0.4);
  }

  .mobile-accordion-btn {
    width: 100%;
    padding: 14px 16px;
    background: transparent;
    border: none;
    color: #F8FAFC;
    font-size: 1rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    text-align: left;
  }

  .mobile-accordion-icon {
    width: 12px;
    height: 12px;
    filter: invert(1);
    opacity: 0.7;
    transition: transform 0.25s ease, filter 0.25s ease;
  }

  .mobile-accordion-item.active .mobile-accordion-icon {
    transform: rotate(180deg);
    opacity: 1;
    filter: invert(40%) sepia(85%) saturate(2000%) hue-rotate(10deg);
  }

  .mobile-accordion-panel {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    padding: 0 16px;
  }

  .mobile-accordion-item.active .mobile-accordion-panel {
    max-height: 600px;
    padding: 6px 16px 16px;
  }

  .mobile-overview-link {
    display: inline-block;
    color: #EE6C20;
    font-size: 0.85rem;
    font-weight: 700;
    margin-bottom: 12px;
    text-decoration: none;
    letter-spacing: 0.02em;
    padding-bottom: 4px;
    border-bottom: 1px dashed rgba(238, 108, 32, 0.4);
  }

  .mobile-sub-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
  }

  .mobile-sub-list a {
    color: #94A3B8;
    font-size: 0.88rem;
    font-weight: 500;
    text-decoration: none;
    display: block;
    padding: 4px 0;
    transition: color 0.2s ease, transform 0.2s ease;
  }

  .mobile-sub-list a:hover {
    color: #FFFFFF;
    transform: translateX(4px);
  }

  .mobile-nav-footer {
    padding: 20px 24px;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    display: flex;
    flex-direction: column;
    gap: 16px;
    background: rgba(5, 11, 20, 0.7);
  }

  .mobile-nav-footer .btn-block {
    width: 100%;
    text-align: center;
    padding: 13px 20px;
    font-size: 0.88rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    border-radius: 10px;
  }

  .mobile-quick-links {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
  }

  .mobile-quick-links a {
    color: #64748B;
    font-size: 0.78rem;
    text-decoration: none;
    transition: color 0.2s ease;
  }

  .mobile-quick-links a:hover {
    color: #EE6C20;
  }

  /* General Hero & Typography on Tablets (iPad Air, Pro, etc.) */
  .hero {
    min-height: auto !important;
    height: auto !important;
    padding-top: calc(var(--header-height, 72px) + 36px) !important;
    padding-bottom: 50px !important;
  }

  .hero-about,
  .services-hero-bg,
  .ind-hero,
  .tech-hero,
  .careers-hero,
  .case-detail-hero,
  .cloud-hero-bg,
  .contact-hero-bg {
    min-height: auto !important;
    height: auto !important;
    padding-top: calc(var(--header-height, 72px) + 40px) !important;
    padding-bottom: 60px !important;
  }

  .hero-inner {
    grid-template-columns: 1fr !important;
    gap: 32px !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  .hero-left {
    max-width: 100% !important;
    width: 100% !important;
  }

  .hero-headline {
    font-size: clamp(2.4rem, 5vw, 3.2rem) !important;
    line-height: 1.15 !important;
    margin-bottom: 16px !important;
    padding-top: 0 !important;
  }

  .hero-desc {
    font-size: 1.05rem !important;
    line-height: 1.6 !important;
    max-width: 720px !important;
    margin-bottom: 24px !important;
  }

  .hero-actions {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 16px !important;
    width: auto !important;
  }

  .hero-actions .btn {
    width: auto !important;
    padding: 14px 28px !important;
    font-size: 0.9rem !important;
  }

  .hero-right {
    max-width: 100% !important;
    width: 100% !important;
    justify-self: stretch !important;
    padding: 22px 24px !important;
    border-radius: 16px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }

  .hero-impact-label {
    margin-bottom: 14px !important;
    font-size: 0.72rem !important;
    display: block !important;
  }

  .hero-stats {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 16px !important;
    width: 100% !important;
  }

  .hero-stat {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    border-bottom: none !important;
    border-right: 1px solid rgba(255, 255, 255, 0.08) !important;
    padding: 0 12px 0 0 !important;
    gap: 6px !important;
  }

  .hero-stat:last-child {
    border-right: none !important;
    padding-right: 0 !important;
  }

  .hero-stat-text {
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
    width: 100% !important;
  }

  .hero-stat-num {
    font-size: 1.8rem !important;
    line-height: 1 !important;
  }

  .hero-stat-label {
    font-size: 0.62rem !important;
    line-height: 1.25 !important;
  }

  .hero-stat-bar {
    display: none !important;
  }

  /* Reset excess inline padding-top inside hero containers on tablet screens */
  .hero-about h1,
  .services-hero-bg h1,
  .ind-hero h1,
  .tech-hero h1,
  .careers-hero h1,
  .case-detail-hero h1,
  .cloud-hero-bg h1,
  .contact-hero-bg h1,
  .contact-hero-bg span,
  .careers-hero span,
  .tech-hero span,
  .cloud-hero-bg div[style*="padding-top"],
  .ind-hero div[style*="padding-top"],
  span[style*="padding-top: 80px"],
  span[style*="padding-top: 100px"],
  h1[style*="padding-top: 80px"],
  h1[style*="padding-top: 100px"] {
    padding-top: 0 !important;
  }

  /* Universal Section Headings on Tablets */
  h1 { font-size: 2.8rem !important; }
  h2 { font-size: 2.2rem !important; }
  
  /* Universal 2-Column Grids -> Stack */
  .overview-grid,
  .insights-split,
  .service-stack,
  .service-row,
  .why-grid {
    grid-template-columns: 1fr !important;
  }

  /* Generic Inline Grids with 2 columns to stack cleanly */
  main section > .container > div[style*="grid-template-columns: 1fr 1."],
  main section > .container > div[style*="grid-template-columns: 1.1fr 1fr"],
  main section > .container > div[style*="grid-template-columns: 1.2fr 1fr"],
  main section > .container > div[style*="grid-template-columns: 1.15fr 0.85fr"],
  main section > .container > div[style*="grid-template-columns: 0.9fr 1.1fr"],
  main section > .container > div[style*="grid-template-columns: 1.55fr 1fr"],
  main section > .container > div[style*="grid-template-columns: 360px 1fr"] {
    grid-template-columns: 1fr !important;
    gap: 36px !important;
  }

  /* 6-Column Stat Strips -> 3-Columns on Tablets */
  main section > .container > div[style*="grid-template-columns: repeat(6, 1fr)"],
  div[style*="grid-template-columns: repeat(6, 1fr)"] {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 20px !important;
  }

  /* 4-Column Stat Strips & Card Grids -> 2-Columns on Tablets */
  main section > .container > div[style*="grid-template-columns: repeat(4, 1fr)"],
  div[style*="grid-template-columns: repeat(4, 1fr)"] {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 20px !important;
  }

  /* 3-Column Grids -> 2-Columns on Tablets */
  main section > .container > div[style*="grid-template-columns: repeat(3, 1fr)"],
  div[style*="grid-template-columns: repeat(3, 1fr)"] {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 20px !important;
  }

  /* 5-Column Grids -> 2 or 3 Columns on Tablets */
  main section > .container > div[style*="grid-template-columns: repeat(5, 1fr)"],
  div[style*="grid-template-columns: repeat(5, 1fr)"] {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 16px !important;
  }

  /* Specific Sections across All Pages on Tablets */
  .capability-box-figma {
    grid-template-columns: 1fr !important;
    gap: 30px !important;
  }

  .tech-constellation-box {
    padding: 20px 10px !important;
    min-height: 380px !important;
  }

  .tech-constellation-svg {
    transform: scale(1.1) !important;
    transform-origin: center center !important;
  }

  .tech-categories-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 20px !important;
  }

  .tech-pipeline-grid {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 16px !important;
  }

  /* Filter Groups on Insights on Tablets */
  #hero-filter-group {
    overflow-x: auto !important;
    padding-bottom: 6px !important;
    flex-wrap: nowrap !important;
    width: 100% !important;
    -webkit-overflow-scrolling: touch !important;
  }

  .hero-pub-filter-btn {
    white-space: nowrap !important;
    flex-shrink: 0 !important;
  }

  .ecosystem-card-wrapper {
    height: 440px !important;
    min-height: 400px !important;
    max-height: 480px !important;
    aspect-ratio: 1 / 1 !important;
    width: 100% !important;
    position: relative !important;
    overflow: hidden !important;
    padding: 14px !important;
    box-sizing: border-box !important;
    background-size: 24px 24px !important;
    display: block !important;
  }

  .ecosystem-svg-lines {
    display: block !important;
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    pointer-events: none !important;
    z-index: 1 !important;
  }

  .eco-node-center {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 86px !important;
    height: 86px !important;
    border-radius: 50% !important;
    background: #EE6C20 !important;
    color: #FFFFFF !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    font-size: 0.82rem !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    box-shadow: 0 6px 20px rgba(238, 108, 32, 0.4) !important;
    z-index: 3 !important;
    padding: 6px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }

  .eco-node-item {
    position: absolute !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    transform: translate(-50%, -50%) !important;
    width: 96px !important;
    text-align: center !important;
    z-index: 2 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
  }

  .eco-node-circle {
    width: 44px !important;
    height: 44px !important;
    border-radius: 50% !important;
    background: #FFFFFF !important;
    border: 2px solid #2B3A4A !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 auto 4px auto !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06) !important;
    flex-shrink: 0 !important;
  }

  .eco-node-circle svg {
    width: 20px !important;
    height: 20px !important;
  }

  .eco-node-label {
    font-size: 0.68rem !important;
    font-weight: 700 !important;
    color: #0F172A !important;
    line-height: 1.2 !important;
    text-align: center !important;
    white-space: normal !important;
    max-width: 90px !important;
    display: block !important;
    word-break: break-word !important;
  }

  .eco-pos-top-left   { top: 18% !important; left: 24% !important; }
  .eco-pos-top-center { top: 11% !important; left: 50% !important; }
  .eco-pos-top-right  { top: 18% !important; left: 76% !important; }
  .eco-pos-mid-left   { top: 50% !important; left: 14% !important; }
  .eco-pos-mid-right  { top: 50% !important; left: 86% !important; }
  .eco-pos-bot-left   { top: 82% !important; left: 24% !important; }
  .eco-pos-bot-center { top: 89% !important; left: 50% !important; }
  .eco-pos-bot-right  { top: 82% !important; left: 76% !important; }

  .ecosystem-legend {
    position: absolute !important;
    bottom: 10px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    z-index: 4 !important;
    white-space: nowrap !important;
    margin: 0 !important;
  }

  .legend-item {
    font-size: 0.68rem !important;
    gap: 4px !important;
  }

  .legend-dot {
    width: 8px !important;
    height: 8px !important;
  }

  .practice-main-grid {
    grid-template-columns: 1fr !important;
    gap: 28px !important;
  }

  .practice-tabs-nav {
    display: flex !important;
    flex-direction: row !important;
    overflow-x: auto !important;
    flex-wrap: nowrap !important;
    -webkit-overflow-scrolling: touch !important;
    padding-bottom: 12px !important;
    gap: 10px !important;
    width: 100% !important;
  }

  .ind-trust-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 20px !important;
  }

  #lib-cards-grid,
  .detail-metrics-grid,
  .detail-res-grid,
  .detail-reading-grid,
  .detail-impact-grid,
  .contact-dept-grid,
  .contact-helpdesk-grid,
  .contact-curated-grid,
  .contact-faq-grid,
  .contact-leadership-grid,
  .contact-topology-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 20px !important;
  }

  .detail-article-grid,
  .contact-map-grid,
  .contact-consultation-grid,
  .contact-office-row {
    grid-template-columns: 1fr !important;
    gap: 32px !important;
  }

  .contact-trust-grid {
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 16px !important;
  }

  .detail-arch-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 14px !important;
  }

  .detail-newsletter-grid {
    grid-template-columns: 1fr !important;
    gap: 36px !important;
  }

  .why-figma-grid-top {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 28px !important;
  }

  .why-figma-grid-bottom {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 28px !important;
  }

  .infra-card,
  .infra-card.reverse {
    gap: 32px !important;
  }

  .footer-upper {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .footer-columns {
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
  }

  .final-cta-inner {
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
  }
}

/* ==========================================================================
   4. MOBILE DEVICES (PHONES < 768px)
   ========================================================================== */
@media (max-width: 767px) {
  :root {
    --header-height: 68px;
  }

  body {
    font-size: 15px;
  }

  .container {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  /* Site Header */
  .site-header {
    width: calc(100% - 20px) !important;
    top: 10px !important;
    height: 66px !important;
    border-radius: 16px !important;
    padding: 0 16px !important;
  }

  .logo img {
    height: 50px !important;
    max-height: 52px !important;
    width: auto !important;
    object-fit: contain !important;
    transform: scale(1.1) !important;
    transform-origin: left center !important;
    display: block !important;
  }

  /* 3-Bar Hamburger Menu Button on Mobile */
  .nav-toggle {
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    width: 26px !important;
    height: 18px !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    cursor: pointer !important;
    z-index: 1010 !important;
  }

  .nav-toggle-bar {
    display: block !important;
    width: 100% !important;
    height: 2.5px !important;
    background-color: #0F172A !important;
    border-radius: 2px !important;
    transition: all 0.25s ease !important;
  }

  .nav-toggle.open .nav-toggle-bar:nth-child(1) {
    transform: translateY(8px) rotate(45deg) !important;
  }

  .nav-toggle.open .nav-toggle-bar:nth-child(2) {
    opacity: 0 !important;
  }

  .nav-toggle.open .nav-toggle-bar:nth-child(3) {
    transform: translateY(-8px) rotate(-45deg) !important;
  }

  /* All Page Heros on Mobile */
  .hero,
  .hero-about,
  .services-hero-bg,
  .ind-hero,
  .tech-hero,
  .careers-hero,
  .case-detail-hero,
  .cloud-hero-bg,
  .contact-hero-bg {
    padding-top: calc(var(--header-height) + 30px) !important;
    padding-bottom: 50px !important;
    min-height: auto !important;
    height: auto !important;
  }

  .hero-headline,
  h1,
  section h1,
  .case-detail-hero h1 {
    font-size: 2.1rem !important;
    line-height: 1.2 !important;
    margin-bottom: 16px !important;
    padding-top: 10px !important;
    word-break: break-word !important;
  }

  /* Reset excess inline padding-top inside hero containers on small screens */
  .hero-about h1,
  .services-hero-bg h1,
  .ind-hero h1,
  .tech-hero h1,
  .careers-hero h1,
  .case-detail-hero h1,
  .cloud-hero-bg h1,
  .contact-hero-bg h1,
  .contact-hero-bg span,
  .careers-hero span,
  .tech-hero span,
  .cloud-hero-bg div[style*="padding-top"],
  .ind-hero div[style*="padding-top"],
  span[style*="padding-top: 80px"],
  span[style*="padding-top: 100px"],
  h1[style*="padding-top: 80px"],
  h1[style*="padding-top: 100px"] {
    padding-top: 0 !important;
  }

  .hero-desc,
  section p.hero-desc,
  .hero-inner p {
    font-size: 0.98rem !important;
    line-height: 1.6 !important;
    margin-bottom: 28px !important;
  }

  /* Hero Action Buttons */
  .hero-actions,
  div[style*="display: flex; gap: 18px; align-items: center"],
  div[style*="display: flex; gap: 16px; align-items: center"] {
    flex-direction: column !important;
    align-items: stretch !important;
    width: 100% !important;
    gap: 12px !important;
  }

  .hero-actions .btn,
  .hero-actions a,
  div[style*="display: flex; gap: 18px; align-items: center"] > a,
  div[style*="display: flex; gap: 16px; align-items: center"] > a {
    width: 100% !important;
    text-align: center !important;
    justify-content: center !important;
    padding: 14px 20px !important;
    font-size: 0.88rem !important;
    box-sizing: border-box !important;
  }

  /* Section Headings */
  .section-heading h2,
  h2,
  section h2 {
    font-size: 1.85rem !important;
    line-height: 1.22 !important;
    margin-bottom: 14px !important;
  }

  .section-heading p.section-desc,
  .section-desc {
    font-size: 0.95rem !important;
    line-height: 1.6 !important;
  }

  /* Generic Section Padding */
  main section {
    padding-top: 60px !important;
    padding-bottom: 60px !important;
  }

  /* All Grid Layouts on Mobile -> Single Column */
  .stats-grid,
  .mission-vision,
  .overview-grid,
  .why-grid,
  .tech-grid,
  .impact-grid,
  .address-grid,
  .careers-grid,
  .case-studies-grid {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }

  /* Inline Grids converted to 1-col or 2-col on Mobile */
  main section > .container > div[style*="display: grid"],
  main section .container div[style*="display: grid"],
  div[style*="display: grid; grid-template-columns"] {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }

  /* 6-Column Stat Strips on Mobile -> 2 columns */
  main section > .container > div[style*="grid-template-columns: repeat(6, 1fr)"],
  div[style*="grid-template-columns: repeat(6, 1fr)"] {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 18px 14px !important;
    padding: 24px 16px !important;
  }

  /* 4-Column Stat Strips on Mobile -> 2 columns */
  main section > .container > div[style*="grid-template-columns: repeat(4, 1fr)"],
  div[style*="grid-template-columns: repeat(4, 1fr)"] {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 16px 12px !important;
  }

  /* 3-Column Grids on Mobile -> 1 column */
  main section > .container > div[style*="grid-template-columns: repeat(3, 1fr)"],
  div[style*="grid-template-columns: repeat(3, 1fr)"] {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }

  /* Large Stat Numbers on Mobile */
  .stat-card-num,
  .tech-stat-num,
  .stat-value,
  .careers-stat-val,
  .hero-stat-num,
  .stat-number {
    font-size: 2.2rem !important;
    line-height: 1.1 !important;
  }

  /* Hero Right (Stats Card on Homepage) */
  .hero-right {
    padding: 20px 16px !important;
    width: 100% !important;
    max-width: 100% !important;
    border-radius: 14px !important;
    justify-self: stretch !important;
  }

  .hero-stats {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 14px 12px !important;
  }

  .hero-stat {
    border-bottom: none !important;
    border-right: none !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 4px !important;
  }

  .hero-stat-text {
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
  }

  .hero-stat-num {
    font-size: 1.55rem !important;
    line-height: 1 !important;
  }

  .hero-stat-label {
    font-size: 0.58rem !important;
    line-height: 1.25 !important;
  }

  .hero-stat-bar {
    display: none !important;
  }

  /* Overview & Mission-Vision Blocks */
  .overview-image {
    height: 260px !important;
    border-radius: 12px !important;
  }

  .mv-block {
    padding: 16px !important;
  }

  /* Service & Solution Cards */
  .service-card {
    min-height: 240px !important;
    border-radius: 12px !important;
  }

  .service-card.featured {
    min-height: 280px !important;
  }

  .service-card-content {
    padding: 20px !important;
  }

  .service-card-content h3 {
    font-size: 1.35rem !important;
  }

  /* Industries Horizontal Cards */
  .industry-horizontal-card,
  .ind-horizontal-card {
    grid-template-columns: 1fr !important;
    display: flex !important;
    flex-direction: column !important;
  }

  .industry-card-img,
  .ind-horizontal-img {
    height: 180px !important;
    width: 100% !important;
  }

  .industry-card-body,
  .ind-horizontal-body {
    padding: 20px !important;
    width: 100% !important;
  }

  /* Leadership Cards on About Page */
  .leader-card-featured-figma {
    flex-direction: column !important;
    align-items: flex-start !important;
    text-align: left !important;
    gap: 20px !important;
    padding: 24px 20px !important;
    box-sizing: border-box !important;
    width: 100% !important;
  }

  .leader-avatar-circle {
    width: 110px !important;
    height: 110px !important;
    flex-shrink: 0 !important;
  }

  .leader-card-featured-figma h3 {
    font-size: 1.65rem !important;
    line-height: 1.2 !important;
    margin-bottom: 4px !important;
  }

  .leader-sub-grid {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }

  .leader-badge-pill {
    position: static !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
    bottom: auto !important;
    margin: 10px 0 0 0 !important;
    width: auto !important;
    max-width: 100% !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    box-sizing: border-box !important;
    font-size: 0.72rem !important;
    padding: 6px 14px !important;
  }

  /* Timeline on About Page */
  .timeline-track-wrap {
    overflow-x: auto !important;
    padding-bottom: 20px !important;
    -webkit-overflow-scrolling: touch !important;
  }

  .timeline-nodes-grid {
    min-width: 680px !important;
  }

  /* Infrastructure Facilities Cards on About Page */
  .infra-card,
  .infra-card.reverse {
    display: flex !important;
    flex-direction: column !important;
    gap: 24px !important;
    margin-bottom: 48px !important;
    width: 100% !important;
  }

  .infra-card.reverse .infra-img-wrap {
    order: -1 !important;
  }

  .infra-img-wrap {
    width: 100% !important;
    border-radius: 14px !important;
    overflow: hidden !important;
  }

  .infra-img-wrap img {
    width: 100% !important;
    height: 240px !important;
    object-fit: cover !important;
    display: block !important;
  }

  .infra-card h3 {
    font-size: 1.55rem !important;
    line-height: 1.25 !important;
    margin-bottom: 12px !important;
  }

  .infra-card p {
    font-size: 0.95rem !important;
    line-height: 1.65 !important;
  }

  /* Why Us Section on About Page */
  .why-us-section-figma {
    padding: 60px 0 !important;
  }

  .why-figma-grid-top {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
    margin-bottom: 28px !important;
    padding-bottom: 28px !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12) !important;
  }

  .why-figma-grid-bottom {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }

  .why-item-figma {
    padding-left: 16px !important;
    border-left: 3px solid #EE6C20 !important;
    text-align: left !important;
  }

  .why-item-figma h4 {
    font-size: 1.18rem !important;
    margin-bottom: 6px !important;
    text-align: left !important;
  }

  .why-item-figma p {
    font-size: 0.88rem !important;
    line-height: 1.55 !important;
    text-align: left !important;
  }

  /* Impact Section on About Page */
  .impact-quote-banner {
    height: auto !important;
    min-height: 260px !important;
    padding: 30px 20px !important;
  }

  .impact-quote-content h3 {
    font-size: 1.35rem !important;
    line-height: 1.35 !important;
  }

  /* World Map Location Highlights */
  .map-container-figma,
  .map-container-wrapper {
    overflow: hidden !important;
    position: relative !important;
    border-radius: 12px !important;
  }

  .map-bg-img {
    min-height: 320px !important;
    object-fit: cover !important;
  }

  .map-highlight-item {
    transform: scale(0.85);
    transform-origin: top left;
  }

  .highlight-london { top: 8% !important; left: 6% !important; }
  .highlight-dubai { top: 32% !important; left: 30% !important; }
  .highlight-cameroon { top: 58% !important; left: 12% !important; }
  .highlight-india { top: 38% !important; left: 52% !important; }

  .highlight-card {
    max-width: 130px !important;
    padding: 5px 8px !important;
  }

  .highlight-card p {
    font-size: 0.65rem !important;
    line-height: 1.3 !important;
  }

  /* Capabilities Showcase on Services Page */
  .capability-tab-btn {
    padding: 12px 14px !important;
    font-size: 0.9rem !important;
  }

  .capability-detail-img-wrap {
    height: 220px !important;
    margin-bottom: 20px !important;
  }

  #cap-detail-title {
    font-size: 1.6rem !important;
  }

  /* Approach 7 Steps Flow on Services Page */
  .approach-track-header {
    display: none !important;
  }

  .approach-flow-container {
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
  }

  .approach-flow-node {
    padding: 18px !important;
    border: 1px solid #E2E8F0 !important;
    border-radius: 10px !important;
  }

  /* Tech Expertise 5-Column Stack on Services Page */
  .tech-categories-grid {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  .tech-cat-col {
    padding: 20px !important;
    border-left: 3px solid #EE6C20 !important;
    border-top: none !important;
  }

  /* Partner Logo Slider Strip */
  .partner-slider-track {
    gap: 28px !important;
  }

  .partner-logo-item {
    font-size: 1rem !important;
  }

  /* Integrated Solution Ecosystem Diagram (Compact Scaled Visual) */
  .ecosystem-card-wrapper {
    height: 380px !important;
    min-height: 360px !important;
    max-height: 420px !important;
    aspect-ratio: 1 / 1 !important;
    width: 100% !important;
    position: relative !important;
    overflow: hidden !important;
    padding: 10px !important;
    box-sizing: border-box !important;
    background-size: 20px 20px !important;
    display: block !important;
  }

  .ecosystem-svg-lines {
    display: block !important;
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    pointer-events: none !important;
    z-index: 1 !important;
  }

  .eco-node-center {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 72px !important;
    height: 72px !important;
    border-radius: 50% !important;
    background: #EE6C20 !important;
    color: #FFFFFF !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    font-size: 0.72rem !important;
    font-weight: 800 !important;
    line-height: 1.15 !important;
    box-shadow: 0 4px 16px rgba(238, 108, 32, 0.4) !important;
    z-index: 3 !important;
    padding: 4px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }

  .eco-node-item {
    position: absolute !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    transform: translate(-50%, -50%) !important;
    width: 80px !important;
    text-align: center !important;
    z-index: 2 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
  }

  .eco-node-circle {
    width: 36px !important;
    height: 36px !important;
    border-radius: 50% !important;
    background: #FFFFFF !important;
    border: 1.5px solid #2B3A4A !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 auto 3px auto !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06) !important;
    flex-shrink: 0 !important;
  }

  .eco-node-circle svg {
    width: 16px !important;
    height: 16px !important;
  }

  .eco-node-label {
    font-size: 0.58rem !important;
    font-weight: 700 !important;
    color: #0F172A !important;
    line-height: 1.15 !important;
    text-align: center !important;
    white-space: normal !important;
    max-width: 76px !important;
    display: block !important;
    word-break: break-word !important;
  }

  .eco-pos-top-left   { top: 18% !important; left: 24% !important; }
  .eco-pos-top-center { top: 11% !important; left: 50% !important; }
  .eco-pos-top-right  { top: 18% !important; left: 76% !important; }
  .eco-pos-mid-left   { top: 50% !important; left: 14% !important; }
  .eco-pos-mid-right  { top: 50% !important; left: 86% !important; }
  .eco-pos-bot-left   { top: 82% !important; left: 24% !important; }
  .eco-pos-bot-center { top: 89% !important; left: 50% !important; }
  .eco-pos-bot-right  { top: 82% !important; left: 76% !important; }

  .ecosystem-legend {
    position: absolute !important;
    bottom: 8px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    z-index: 4 !important;
    white-space: nowrap !important;
    margin: 0 !important;
  }

  .legend-item {
    font-size: 0.62rem !important;
    gap: 4px !important;
  }

  .legend-dot {
    width: 7px !important;
    height: 7px !important;
  }

  /* ==========================================================================
     SOLUTIONS PAGE SPECIFIC RESPONSIVE OVERRIDES
     ========================================================================== */
  
  /* 1. Advantage Cards (ISO 9001, Scalable Teams, etc.) -> Left Align & Clean Spacing */
  .sol-adv-card {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    text-align: left !important;
    padding: 24px 20px !important;
    box-sizing: border-box !important;
    width: 100% !important;
  }

  .sol-adv-icon-box {
    margin-left: 0 !important;
    margin-right: auto !important;
    align-self: flex-start !important;
    margin-bottom: 16px !important;
    flex-shrink: 0 !important;
  }

  .sol-adv-title {
    text-align: left !important;
    font-size: 1.15rem !important;
    margin-bottom: 8px !important;
    width: 100% !important;
  }

  .sol-adv-desc {
    text-align: left !important;
    font-size: 0.88rem !important;
    line-height: 1.6 !important;
    width: 100% !important;
  }

  /* 2. Solutions Tech Rows (Advanced Cognitive AI, DevOps, etc.) */
  .sol-tech-row {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 16px !important;
    padding: 20px 18px !important;
    box-sizing: border-box !important;
  }

  .sol-tech-title {
    width: 100% !important;
    font-size: 1.08rem !important;
    margin-bottom: 4px !important;
    text-align: left !important;
  }

  .sol-tech-row > div {
    width: 100% !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    justify-content: flex-start !important;
  }

  .sol-tech-tag {
    font-size: 0.76rem !important;
    padding: 6px 12px !important;
    margin: 0 !important;
  }

  /* 3. Solutions Industries We Transform Vertical Tabs */
  div[style*="grid-template-columns: 320px 1fr"],
  div[style*="grid-template-columns: 300px 1fr"] {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }

  div[style*="grid-template-columns: 320px 1fr"] > div:first-child,
  div[style*="grid-template-columns: 300px 1fr"] > div:first-child {
    flex-direction: row !important;
    overflow-x: auto !important;
    padding-bottom: 8px !important;
    gap: 8px !important;
    -webkit-overflow-scrolling: touch !important;
    width: 100% !important;
  }

  .sol-vert-tab {
    white-space: nowrap !important;
    flex-shrink: 0 !important;
    padding: 12px 18px !important;
    font-size: 0.88rem !important;
    border-radius: 8px !important;
  }

  #sol-vertical-panel {
    padding: 24px 18px !important;
    box-sizing: border-box !important;
    width: 100% !important;
  }

  #sol-vertical-panel > div[style*="grid-template-columns: 1fr 1fr"] {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }

  #sol-vertical-panel div[style*="justify-content: space-between"] {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 16px !important;
  }

  #sol-vertical-panel a.btn {
    width: 100% !important;
    text-align: center !important;
    justify-content: center !important;
  }

  /* 4. Solutions Resource Center Cards */
  .sol-resource-card {
    padding: 24px 18px !important;
    text-align: left !important;
    box-sizing: border-box !important;
  }

  .sol-resource-title {
    text-align: left !important;
    font-size: 1.15rem !important;
  }

  /* ==========================================================================
     TECHNOLOGIES PAGE SPECIFIC RESPONSIVE OVERRIDES
     ========================================================================== */
  
  /* 1. Cognitive Pipeline 6-Step Development Flow */
  .tech-pipeline-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 12px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .tech-pipeline-box {
    padding: 16px 14px !important;
    text-align: left !important;
    box-sizing: border-box !important;
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
  }

  .tech-pipeline-box h4 {
    text-align: left !important;
    font-size: 0.92rem !important;
    margin-bottom: 6px !important;
  }

  .tech-pipeline-desc {
    text-align: left !important;
    font-size: 0.78rem !important;
    line-height: 1.4 !important;
    word-break: break-word !important;
  }

  /* 2. Interactive Constellation Blueprint Diagram (Inner Zoomed on Mobile) */
  div[style*="grid-template-columns: 1.25fr 0.75fr"] {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }

  .tech-constellation-box {
    padding: 16px 10px !important;
    min-height: 350px !important;
    height: 360px !important;
    overflow: hidden !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 12px !important;
    box-sizing: border-box !important;
  }

  .tech-constellation-svg {
    width: 100% !important;
    height: 100% !important;
    max-height: 340px !important;
    transform: scale(1.08) !important;
    transform-origin: center center !important;
    display: block !important;
  }

  /* 3. Tech Process Lifecycle Strip */
  .tech-process-strip {
    padding: 24px 16px !important;
  }

  .tech-process-strip > div[style*="display: flex"] {
    flex-direction: column !important;
    gap: 16px !important;
  }

  /* 4. Vetted Quality Milestones Banner */
  .vetted-milestones-banner {
    flex-direction: column !important;
    align-items: flex-start !important;
    padding: 24px 18px !important;
    gap: 20px !important;
    box-sizing: border-box !important;
    width: 100% !important;
  }

  .vetted-milestones-content {
    width: 100% !important;
    min-width: auto !important;
  }

  .vetted-milestones-stats {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 12px 8px !important;
    width: 100% !important;
    padding-top: 18px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
    box-sizing: border-box !important;
  }

  .vetted-milestone-item {
    text-align: center !important;
    padding: 0 4px !important;
  }

  .vetted-stat-val {
    font-size: 1.55rem !important;
  }

  .vetted-stat-lbl {
    font-size: 0.64rem !important;
    line-height: 1.3 !important;
    letter-spacing: 0.02em !important;
  }  /* ==========================================================================
     INDUSTRIES PAGE SPECIFIC RESPONSIVE OVERRIDES
     ========================================================================== */
  
  /* 1. Explore Our Industry Practices (Signature Section) */
  .practice-main-grid,
  #signature-section div[style*="grid-template-columns: 320px 1fr"],
  div[style*="grid-template-columns: 320px 1fr"],
  div[style*="grid-template-columns: 280px 1fr"],
  div[style*="grid-template-columns: 260px 1fr"] {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }

  .practice-tabs-nav,
  #signature-section div[style*="grid-template-columns: 320px 1fr"] > div:first-child,
  div[style*="grid-template-columns: 320px 1fr"] > div:first-child,
  div[style*="grid-template-columns: 280px 1fr"] > div:first-child,
  div[style*="grid-template-columns: 260px 1fr"] > div:first-child {
    display: flex !important;
    flex-direction: row !important;
    overflow-x: auto !important;
    flex-wrap: nowrap !important;
    padding-bottom: 12px !important;
    gap: 10px !important;
    -webkit-overflow-scrolling: touch !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .practice-tab-btn {
    white-space: nowrap !important;
    flex-shrink: 0 !important;
    width: auto !important;
    padding: 10px 18px !important;
    font-size: 0.88rem !important;
    font-weight: 600 !important;
    border-radius: 8px !important;
    background: rgba(255, 255, 255, 0.06) !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    color: #CBD5E1 !important;
    text-align: center !important;
    justify-content: center !important;
  }

  .practice-tab-btn.active {
    background: #EE6C20 !important;
    border-color: #EE6C20 !important;
    color: #FFFFFF !important;
    font-weight: 700 !important;
    border-left: 1px solid #EE6C20 !important;
    box-shadow: 0 4px 14px rgba(238, 108, 32, 0.35) !important;
  }

  #practice-display-card {
    padding: 24px 18px !important;
    box-sizing: border-box !important;
    width: 100% !important;
  }

  #practice-title {
    font-size: 1.65rem !important;
    line-height: 1.25 !important;
    margin-bottom: 12px !important;
  }

  #practice-img {
    height: 200px !important;
    object-fit: cover !important;
  }

  /* 2. Industry Pipeline Flows & Steppers (Factory Automation & Power Grid) */
  .pipeline-scroll-wrap {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    padding-bottom: 12px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .pipeline-scroll-inner {
    min-width: 620px !important;
    padding: 10px 4px !important;
    box-sizing: border-box !important;
  }

  /* 3. Why Global Enterprises Trust (9-Card Grid) */
  .ind-trust-grid {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  .ind-trust-card {
    padding: 22px 18px !important;
    box-sizing: border-box !important;
    width: 100% !important;
  }

  /* 4. Industry Photo Banners */
  .ind-photo-banner {
    padding: 60px 0 !important;
    height: auto !important;
    min-height: 220px !important;
    display: flex !important;
    align-items: center !important;
  }

  .ind-photo-banner h2 {
    font-size: 1.85rem !important;
    line-height: 1.25 !important;
    padding: 0 !important;
    text-align: left !important;
  }

  .ind-kpi-grid,
  div[style*="grid-template-columns: repeat(3, 1fr)"] {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  /* ==========================================================================
     INSIGHTS & RESOURCES PAGE SPECIFIC RESPONSIVE OVERRIDES
     ========================================================================== */
  
  /* 1. Newspaper-Inspired Latest Publications Feed */
  .pub-item-row {
    padding: 18px 16px !important;
    position: relative !important;
  }

  .pub-item-row > div[style*="display: flex"] {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 8px !important;
    width: 100% !important;
    padding-right: 36px !important;
    box-sizing: border-box !important;
  }

  .pub-item-date-col {
    width: 100% !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 10px !important;
    margin-bottom: 4px !important;
  }

  .pub-item-heading {
    font-size: 1.12rem !important;
    line-height: 1.35 !important;
    margin-bottom: 6px !important;
    word-break: break-word !important;
  }

  .pub-item-desc {
    font-size: 0.86rem !important;
    line-height: 1.5 !important;
    word-break: break-word !important;
  }

  .pub-item-arrow-box {
    position: absolute !important;
    top: 18px !important;
    right: 14px !important;
    width: 32px !important;
    height: 32px !important;
  }

  /* 2. Events & Webinars Interactive Timeline */
  #section-events-webinars div[style*="position: absolute; left: 239px"],
  #section-events-webinars div[style*="position: absolute; left: 240px"] {
    display: none !important;
  }

  #section-events-webinars div[style*="grid-template-columns: 220px 40px 1fr"] {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 14px !important;
    background: #F4F6F8 !important;
    border-radius: 12px !important;
    padding: 20px 16px !important;
    border: 1px solid #E2E8F0 !important;
    box-sizing: border-box !important;
    width: 100% !important;
  }

  #section-events-webinars div[style*="grid-template-columns: 220px 40px 1fr"] > div:nth-child(1) {
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding-bottom: 10px !important;
    border-bottom: 1px solid #E2E8F0 !important;
  }

  #section-events-webinars div[style*="grid-template-columns: 220px 40px 1fr"] > div:nth-child(2) {
    display: none !important;
  }

  #section-events-webinars div[style*="grid-template-columns: 220px 40px 1fr"] > div:nth-child(3) {
    background: transparent !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 16px !important;
    width: 100% !important;
  }

  #section-events-webinars div[style*="grid-template-columns: 220px 40px 1fr"] a[href*="Registration"] {
    width: 100% !important;
    text-align: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    padding: 12px 18px !important;
    display: block !important;
  }

  /* 3. Resource Library & Executive Perspectives Grids */
  #lib-cards-grid {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  div[style*="grid-template-columns: repeat(4, 1fr)"] {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  /* Sovereign Case Explorer Tabs & Showcase on Case Studies Page */
  div[style*="grid-template-columns: 240px 1fr"] {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }

  div[style*="grid-template-columns: 240px 1fr"] > div:first-child {
    display: flex !important;
    flex-direction: row !important;
    overflow-x: auto !important;
    gap: 8px !important;
    padding: 10px !important;
    -webkit-overflow-scrolling: touch !important;
  }

  div[style*="grid-template-columns: 240px 1fr"] > div:first-child > div {
    white-space: nowrap !important;
    flex-shrink: 0 !important;
    padding: 8px 14px !important;
    font-size: 0.82rem !important;
  }

  div[style*="min-height: 480px;"][style*="case-explorer.avif"] {
    padding: 24px 18px !important;
    min-height: auto !important;
  }

  /* ==========================================================================
     INSIGHT DETAIL PAGE SPECIFIC RESPONSIVE OVERRIDES
     ========================================================================== */
  
  /* 1. Hero Metadata & Share Row */
  .detail-hero-meta-row {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 16px !important;
    width: 100% !important;
  }

  .detail-hero-share-group {
    width: 100% !important;
    justify-content: flex-start !important;
    flex-wrap: wrap !important;
  }

  /* 2. Main Two-Column Article & Sticky TOC */
  .detail-article-grid,
  .container[style*="grid-template-columns: 260px 1fr"] {
    grid-template-columns: 1fr !important;
    gap: 32px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .detail-article-grid > aside,
  aside[style*="position: sticky"] {
    position: static !important;
    width: 100% !important;
  }

  .detail-article-grid > article {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  .detail-article-stats-bar {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
    padding: 20px 16px !important;
  }

  .detail-article-stats-bar > div {
    border-left: none !important;
    border-right: none !important;
    border-bottom: 1px solid rgba(255,255,255,0.1) !important;
    padding-bottom: 12px !important;
  }

  .detail-article-stats-bar > div:last-child {
    border-bottom: none !important;
    padding-bottom: 0 !important;
  }

  .detail-code-box {
    padding: 16px 14px !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    box-sizing: border-box !important;
  }

  .detail-code-box pre {
    white-space: pre !important;
    overflow-x: auto !important;
    font-size: 0.75rem !important;
  }

  /* 3. Systems Artifact 4-Column Grids */
  .detail-artifact-box {
    padding: 24px 16px !important;
    border-radius: 12px !important;
  }

  .detail-arch-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 10px !important;
  }

  .detail-arch-arrows {
    display: none !important;
  }

  /* 4. Metric Analysis 3-Col & Resources 4-Col */
  .detail-metrics-grid {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  .detail-res-grid {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }

  .detail-reading-grid,
  .detail-impact-grid {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  /* 5. Stay Informed Newsletter Form */
  .detail-newsletter-grid {
    grid-template-columns: 1fr !important;
    gap: 32px !important;
    width: 100% !important;
  }

  .detail-newsletter-grid h2 span {
    font-size: 1.85rem !important;
    line-height: 1.25 !important;
  }

  .detail-newsletter-card {
    width: 100% !important;
    max-width: 100% !important;
    min-height: auto !important;
    padding: 20px 16px !important;
    box-sizing: border-box !important;
  }

  .newsletter-glass-badge {
    position: static !important;
    width: 100% !important;
    margin-top: 14px !important;
  }

  /* Universal Mobile Heading Scale Safeguards */
  h1[style*="font-size: 3.8rem"],
  h1[style*="font-size: 3.6rem"] {
    font-size: 2.2rem !important;
    line-height: 1.18 !important;
  }

  h2[style*="font-size: 3.2rem"],
  h2[style*="font-size: 3.6rem"],
  h2[style*="font-size: 2.8rem"] {
    font-size: 1.95rem !important;
    line-height: 1.2 !important;
  }

  /* ==========================================================================
     CONTACT PAGE MOBILE RESPONSIVE OVERRIDES
     ========================================================================== */

  /* 1. Hero & Map Grid */
  .contact-hero-bg {
    min-height: auto !important;
    height: auto !important;
    padding: 100px 0 60px 0 !important;
  }

  .contact-map-grid {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }

  .map-container-wrapper {
    height: 260px !important;
    position: relative !important;
    overflow: hidden !important;
  }

  /* 2. Departmental Engagement Directories (8 Cards) */
  .contact-dept-grid {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
    width: 100% !important;
  }

  .dept-card {
    padding: 20px 16px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  /* 3. Executive Consultation Form & Box */
  .contact-consultation-grid {
    grid-template-columns: 1fr !important;
    gap: 28px !important;
    width: 100% !important;
  }

  .contact-consultation-grid > div:first-child {
    padding: 24px 16px !important;
    border-radius: 14px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .contact-form-row {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
    width: 100% !important;
  }

  /* 4. Global Office Architectural Directory */
  .contact-offices-stack {
    gap: 36px !important;
  }

  .contact-office-row {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    width: 100% !important;
    background: #FFFFFF !important;
    border: 1px solid #E2E8F0 !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    box-shadow: 0 6px 24px rgba(0, 0, 0, 0.05) !important;
  }

  .contact-office-media {
    order: 1 !important;
    width: 100% !important;
    height: 220px !important;
    border-radius: 0 !important;
    overflow: hidden !important;
    position: relative !important;
  }

  .contact-office-media img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: 0 !important;
  }

  .contact-office-body {
    order: 2 !important;
    padding: 22px 18px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    text-align: left !important;
  }

  .contact-office-body h3 {
    font-size: 1.45rem !important;
    line-height: 1.25 !important;
    margin-bottom: 10px !important;
  }

  .contact-office-meta {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    padding-top: 14px !important;
    margin-top: 16px !important;
    border-top: 1px solid #F1F5F9 !important;
    width: 100% !important;
    font-size: 0.82rem !important;
  }

  .contact-office-meta span {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    word-break: break-all !important;
  }

  /* 5. Support Matrix & Helpdesks */
  .contact-helpdesk-grid {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
    width: 100% !important;
  }

  .helpdesk-card {
    padding: 20px 16px !important;
  }

  /* 6. Curated Solutions Directories */
  .contact-curated-grid {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    width: 100% !important;
  }

  .curated-segment-card {
    padding: 20px 16px !important;
  }

  /* 7. Frequently Asked Questions */
  .contact-faq-grid {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    width: 100% !important;
  }

  .contact-faq-card {
    padding: 16px 14px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .contact-faq-title {
    font-size: 0.92rem !important;
    line-height: 1.35 !important;
    word-break: normal !important;
  }

  .contact-faq-header {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 8px !important;
  }

  .contact-faq-header svg {
    align-self: flex-end !important;
    margin-top: -24px !important;
  }

  /* 8. Sovereign Scale Trust Matrix */
  .contact-trust-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 12px !important;
    width: 100% !important;
  }

  .contact-trust-metric {
    padding: 16px 12px !important;
    box-sizing: border-box !important;
  }

  .contact-trust-val {
    font-size: 1.8rem !important;
  }

  .contact-trust-label {
    font-size: 0.62rem !important;
    line-height: 1.3 !important;
  }

  /* 9. Leadership & Workspace Grids */
  .contact-leadership-grid,
  .contact-topology-grid {
    grid-template-columns: 1fr !important;
    gap: 18px !important;
    width: 100% !important;
  }

  .contact-workspace-card {
    height: 240px !important;
  }

  /* Search & Filter Bars on Insights Page */
  #hero-search-input {
    font-size: 0.88rem !important;
  }

  #hero-filter-group {
    overflow-x: auto !important;
    padding-bottom: 6px !important;
    flex-wrap: nowrap !important;
    width: 100% !important;
    -webkit-overflow-scrolling: touch !important;
  }

  .hero-pub-filter-btn {
    white-space: nowrap !important;
    flex-shrink: 0 !important;
  }

  /* Universal Card Text Alignment Safeguards (Ensures no center-drift on left-aligned cards) */
  .sol-adv-card,
  .sol-resource-card,
  .service-card,
  .solution-card,
  .ind-card,
  .ind-card-light,
  .tech-card,
  .tech-pipeline-box,
  .tech-check-item,
  .value-card-figma,
  .leader-card,
  .leader-sub-card,
  .engagement-card-figma,
  .job-card,
  .benefit-card,
  .faq-contact-card,
  .case-study-card,
  .insight-card,
  .pub-item,
  .exec-card,
  .core-cap-card,
  .delivery-step-card,
  .standard-num-card,
  .csd-chal-card,
  .csd-impact-card,
  .cs-impact-large-card,
  .cs-impact-small-card,
  .arch-stack-row,
  .dept-card,
  .helpdesk-card,
  .curated-segment-card,
  .contact-faq-card,
  .contact-leader-card,
  .contact-trust-metric {
    text-align: left !important;
  }

  /* Contact Page Forms & Telemetry */
  .telemetry-hub-card {
    padding: 14px !important;
    text-align: left !important;
  }

  .map-pin-badge {
    transform: scale(0.8);
  }

  /* Form Elements on Mobile */
  input[type="text"],
  input[type="email"],
  input[type="tel"],
  select,
  textarea {
    font-size: 16px !important; /* Prevents auto-zoom on iOS */
    box-sizing: border-box !important;
    max-width: 100% !important;
  }

  /* Footer on Mobile */
  .site-footer {
    padding-top: 50px !important;
    padding-bottom: 30px !important;
  }

  .footer-logo-badge {
    padding: 6px 14px !important;
    margin-bottom: 18px !important;
    border-radius: 8px !important;
    overflow: hidden !important;
  }

  .footer-logo-badge img {
    height: 40px !important;
    max-height: 42px !important;
    width: auto !important;
    transform: scale(1.25) !important;
  }

  .footer-upper {
    grid-template-columns: 1fr !important;
    gap: 36px !important;
  }

  .footer-columns {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 28px 16px !important;
  }

  .footer-lower {
    flex-direction: column !important;
    gap: 16px !important;
    text-align: center !important;
    align-items: center !important;
    padding-top: 24px !important;
  }

  .footer-legal {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 14px !important;
  }

  .newsletter-row {
    flex-direction: column !important;
    max-width: 100% !important;
    gap: 10px !important;
  }

  .newsletter-row input {
    width: 100% !important;
  }

  .newsletter-row button {
    width: 100% !important;
  }

  /* Modals & Dialogs */
  .modal-dialog,
  .modal-content {
    width: calc(100% - 24px) !important;
    margin: 12px auto !important;
    max-height: 90vh !important;
    padding: 20px 16px !important;
  }
}

/* ==========================================================================
   5. ULTRA-COMPACT MOBILE PHONES (< 480px / 420px)
   ========================================================================== */
@media (max-width: 480px) {
  .tech-pipeline-grid {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }
}

@media (max-width: 420px) {
  .site-header {
    width: calc(100% - 16px) !important;
    top: 8px !important;
    height: 62px !important;
    border-radius: 14px !important;
    padding: 0 12px !important;
  }

  .logo img {
    height: 46px !important;
    max-height: 48px !important;
    width: auto !important;
    object-fit: contain !important;
    transform: scale(1.08) !important;
    transform-origin: left center !important;
    display: block !important;
  }

  .hero-headline,
  h1,
  section h1 {
    font-size: 1.85rem !important;
    line-height: 1.2 !important;
  }

  .section-heading h2,
  h2,
  section h2 {
    font-size: 1.55rem !important;
  }

  .stat-card-num,
  .tech-stat-num,
  .stat-value,
  .careers-stat-val,
  .hero-stat-num,
  .stat-number {
    font-size: 1.9rem !important;
  }

  .footer-columns {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }

  /* 6-Column Stat Strips on tiny screens -> 1 column */
  .stat-strip,
  .tech-stat-strip,
  div[style*="text-align: center"][style*="grid-template-columns: repeat(6, 1fr)"] {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
    text-align: center !important;
  }

  /* Miniature Ecosystem Visual Diagram on Tiny Screens */
  .ecosystem-card-wrapper {
    height: 350px !important;
    min-height: 340px !important;
    padding: 8px !important;
  }

  .eco-node-center {
    width: 64px !important;
    height: 64px !important;
    font-size: 0.64rem !important;
  }

  .eco-node-circle {
    width: 32px !important;
    height: 32px !important;
  }

  .eco-node-circle svg {
    width: 14px !important;
    height: 14px !important;
  }

  .eco-node-label {
    font-size: 0.52rem !important;
    max-width: 68px !important;
  }

  .tech-constellation-box {
    height: 330px !important;
    min-height: 320px !important;
    padding: 12px 6px !important;
  }

  .tech-constellation-svg {
    transform: scale(1.06) !important;
  }

  /* 4-Column Stat Strips on tiny screens -> 1 column */
  div[style*="text-align: center"][style*="grid-template-columns: repeat(4, 1fr)"] {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
    text-align: center !important;
  }

  .vetted-milestones-stats {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  .btn {
    padding: 12px 18px !important;
    font-size: 0.82rem !important;
  }
}

/* ==========================================================================
   6. LARGE & ULTRA-WIDE / 4K DISPLAYS (>= 1440px, >= 1920px, >= 2560px)
   ========================================================================== */
@media (min-width: 1440px) {
  .container {
    max-width: 1320px;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
  }

  .site-header {
    max-width: 1320px;
    left: 50%;
    transform: translateX(-50%);
  }

  .hero-inner {
    max-width: 1320px;
    margin-left: auto;
    margin-right: auto;
  }
}

@media (min-width: 1920px) {
  .container {
    max-width: 1400px;
  }

  .site-header {
    max-width: 1400px;
  }

  .hero-inner {
    max-width: 1400px;
  }

  .hero-headline {
    font-size: 4rem;
  }
}

@media (min-width: 2560px) {
  .container {
    max-width: 1600px;
  }

  .site-header {
    max-width: 1600px;
  }

  .hero-inner {
    max-width: 1600px;
  }

  .hero-headline {
    font-size: 4.5rem;
  }
}

/* ==========================================================================
   7. UNIVERSAL RESPONSIVE OVERFLOW & TOUCH SAFEGUARDS
   Ensures 100% responsiveness across ALL devices (320px - 4K) with zero horizontal overflow
   ========================================================================== */
html, body {
  overflow-x: hidden !important;
  max-width: 100vw;
  width: 100%;
  position: relative;
}

*, *::before, *::after {
  box-sizing: border-box !important;
}

/* Text and word wrapping to prevent overflow on small screens */
p, span, h1, h2, h3, h4, h5, h6, a, li, blockquote, td, th {
  overflow-wrap: break-word;
  word-wrap: break-word;
}

code, pre, .code-box, .url-text {
  word-break: break-all;
  overflow-wrap: anywhere;
}

/* Responsive tables */
.table-responsive {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

table {
  max-width: 100%;
}

/* Fluid responsive media */
img, video, canvas, svg, iframe {
  max-width: 100%;
  height: auto;
}

/* Prevent auto-zoom on iOS mobile form inputs */
@media (max-width: 767px) {
  input, select, textarea {
    font-size: 16px !important;
  }
  
  .container {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
}

@media (max-width: 380px) {
  .container {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
  
  .site-header {
    width: calc(100% - 12px) !important;
    padding: 0 10px !important;
  }
  
  .hero-headline, h1 {
    font-size: 1.75rem !important;
  }
  
  h2 {
    font-size: 1.45rem !important;
  }
}