/* Inseyabya mobile and light-theme performance layer. */
html[data-theme="light"] {
  --bg:              #ddf0ff;
  --bg-soft:         #e6f4ff;
  --surface:         rgba(255, 255, 255, 0.72);
  --surface-strong:  rgba(255, 255, 255, 0.90);
  --surface-muted:   rgba(240, 248, 255, 0.80);
  --surface-alt:     rgba(220, 240, 255, 0.65);
  --line:            rgba(100, 140, 200, 0.14);
  --line-strong:     rgba(100, 140, 200, 0.22);
  --glass-surface:        rgba(255, 255, 255, 0.72);
  --glass-surface-strong: rgba(255, 255, 255, 0.90);
  --glass-highlight:      rgba(255, 255, 255, 0.98);
  --glass-border:         rgba(180, 210, 240, 0.28);
  --glass-blur:           30px;
  --glass-shadow: 0 8px 32px rgba(15, 23, 42, 0.09), 0 2px 6px rgba(15, 23, 42, 0.04);
  --shadow-sm:     0 4px 18px rgba(15, 23, 42, 0.07);
  --shadow-md:     0 8px 36px rgba(15, 23, 42, 0.10);
  --shadow-lg:     0 16px 64px rgba(15, 23, 42, 0.13);
}
html[data-theme="light"] body {
  background:
    radial-gradient(circle at 14% 18%, rgba(147, 197, 253, 0.40), transparent 30%),
    radial-gradient(circle at 88% 16%, rgba(196, 181, 253, 0.28), transparent 28%),
    radial-gradient(circle at 52% 88%, rgba(125, 211, 252, 0.22), transparent 30%),
    linear-gradient(180deg, #d8eeff, #e8f4ff) !important;
}

html[data-theme="light"] body::before {
  background:
    radial-gradient(circle at 16% 24%, rgba(59, 130, 246, 0.12), transparent 28%),
    radial-gradient(circle at 84% 18%, rgba(124, 58,  237, 0.09), transparent 26%),
    radial-gradient(circle at 50% 80%, rgba(14,  165, 233, 0.09), transparent 28%) !important;
  opacity: 0.9 !important;
}

html[data-theme="light"] body::after {
  opacity: 0.12 !important;
}
html[data-theme="light"] .glass-panel,
html[data-theme="light"] .nav-shell,
html[data-theme="light"] .service-card,
html[data-theme="light"] .direction-card,
html[data-theme="light"] .project-card,
html[data-theme="light"] .benefit-card,
html[data-theme="light"] .process-card,
html[data-theme="light"] .faq-card,
html[data-theme="light"] .contact-panel,
html[data-theme="light"] .pricing-panel,
html[data-theme="light"] .footer-brand-column,
html[data-theme="light"] .footer-column,
html[data-theme="light"] .trust-card,
html[data-theme="light"] .stat-card,
html[data-theme="light"] .info-card,
html[data-theme="light"] .board-copy,
html[data-theme="light"] .gradient-panel,
html[data-theme="light"] .floating-chip,
html[data-theme="light"] .modal-dialog,
html[data-theme="light"] .quick-contact-bar,
html[data-theme="light"] .mobile-dock,
html[data-theme="light"] .mobile-menu,
html[data-theme="light"] .mobile-menu a,
html[data-theme="light"] .nav-icon-button,
html[data-theme="light"] .menu-button,
html[data-theme="light"] .secondary-button,
html[data-theme="light"] .filter-button {
  background:
    linear-gradient(150deg, rgba(255,255,255,0.92), rgba(255,255,255,0.62) 55%, rgba(255,255,255,0.78)),
    rgba(235, 248, 255, 0.50) !important;
  border-color: rgba(255, 255, 255, 0.88) !important;
  backdrop-filter: blur(var(--glass-blur)) saturate(200%) brightness(1.04) !important;
  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(200%) brightness(1.04) !important;
  box-shadow:
    inset 0 1.5px 0 rgba(255, 255, 255, 0.98),
    inset 0 -1px  0 rgba(100, 130, 180, 0.08),
    inset 1px  0  0 rgba(255, 255, 255, 0.55),
    0  8px 32px rgba(15, 23, 42, 0.09),
    0  2px  8px rgba(15, 23, 42, 0.05) !important;
}
html[data-theme="light"] .nav-shell {
  background:
    linear-gradient(180deg, rgba(255,255,255,0.96), rgba(255,255,255,0.80) 70%, rgba(235,248,255,0.72)),
    rgba(230, 244, 255, 0.55) !important;
  box-shadow:
    inset 0 1.5px 0 rgba(255, 255, 255, 1),
    inset 0 -1px  0 rgba(148, 163, 184, 0.14),
    0 4px 28px rgba(15, 23, 42, 0.09),
    0 1px  6px rgba(15, 23, 42, 0.04) !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.16) !important;
  border-color: rgba(255, 255, 255, 0.90) !important;
}
html[data-theme="light"] .hero-board {
  background:
    linear-gradient(145deg, rgba(255,255,255,0.88), rgba(210,238,255,0.55) 55%, rgba(255,255,255,0.76)),
    rgba(220, 242, 255, 0.50) !important;
  border-color: rgba(255, 255, 255, 0.92) !important;
  box-shadow:
    inset 0 2px 0 rgba(255, 255, 255, 0.98),
    inset 0 -1px 0 rgba(148, 163, 184, 0.10),
    0 24px 72px rgba(15, 23, 42, 0.11),
    0  6px 18px rgba(15, 23, 42, 0.06) !important;
}
html[data-theme="light"] .gradient-panel {
  background:
    linear-gradient(145deg, rgba(255,255,255,0.88), rgba(210,235,255,0.55) 58%, rgba(255,255,255,0.78)),
    linear-gradient(150deg, rgba(59,130,246,0.07), rgba(124,58,237,0.04)) !important;
}
html[data-theme="light"] .floating-chip {
  background:
    linear-gradient(145deg, rgba(255,255,255,0.94), rgba(235,248,255,0.76)) !important;
  border-color: rgba(255, 255, 255, 0.96) !important;
  box-shadow:
    inset 0 1.5px 0 rgba(255, 255, 255, 1),
    0 12px 36px rgba(15, 23, 42, 0.10) !important;
}
html[data-theme="light"] .mobile-dock {
  background:
    linear-gradient(180deg, rgba(255,255,255,0.97), rgba(235,248,255,0.90)) !important;
  border-color: rgba(180, 210, 240, 0.36) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 1),
    0 -4px 24px rgba(15, 23, 42, 0.09) !important;
}
html[data-theme="light"] .stat-card,
html[data-theme="light"] .trust-card {
  background:
    linear-gradient(155deg, rgba(255,255,255,0.96), rgba(235,248,255,0.78)) !important;
}
html[data-theme="light"] .tag-chip {
  background:
    linear-gradient(135deg, rgba(255,255,255,0.88), rgba(225,244,255,0.68)) !important;
  border-color: rgba(148, 163, 184, 0.20) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.96),
    0 2px 8px rgba(15, 23, 42, 0.06) !important;
}
html[data-theme="light"] .quick-contact-bar {
  background:
    linear-gradient(180deg, rgba(255,255,255,0.96), rgba(235,248,255,0.86)) !important;
  border-color: rgba(180, 210, 240, 0.32) !important;
}
html[data-theme="light"] .mobile-menu {
  background:
    linear-gradient(145deg, rgba(255,255,255,0.94), rgba(230,246,255,0.84)) !important;
  border-color: rgba(255, 255, 255, 0.92) !important;
}

html[data-theme="light"] .mobile-menu a {
  background:
    linear-gradient(150deg, rgba(255,255,255,0.90), rgba(235,248,255,0.74)) !important;
  border-color: rgba(148, 163, 184, 0.16) !important;
}
html[data-theme="light"] .orb-left   { background: rgba(59, 130, 246, 0.16); }
html[data-theme="light"] .orb-right  { background: rgba(124, 58, 237, 0.12); }
html[data-theme="light"] .orb-bottom { background: rgba(14, 165, 233, 0.14); }
html[data-theme="light"] .eyebrow,
html[data-theme="light"] .tiny-badge,
html[data-theme="light"] .type-chip {
  background: rgba(37, 99, 235, 0.10) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.80), 0 2px 8px rgba(37,99,235,0.08) !important;
  border: 1px solid rgba(59, 130, 246, 0.15) !important;
}
html[data-theme="light"] .service-card:hover,
html[data-theme="light"] .direction-card:hover,
html[data-theme="light"] .project-card:hover,
html[data-theme="light"] .benefit-card:hover,
html[data-theme="light"] .process-card:hover,
html[data-theme="light"] .faq-card:hover,
html[data-theme="light"] .stat-card:hover,
html[data-theme="light"] .trust-card:hover,
html[data-theme="light"] .app-contact-card:hover {
  border-color: rgba(59, 130, 246, 0.28) !important;
  box-shadow:
    inset 0 1.5px 0 rgba(255, 255, 255, 0.98),
    0 18px 52px rgba(15, 23, 42, 0.13),
    0  4px 12px rgba(59, 130, 246, 0.08) !important;
}
html[data-theme="light"] .footer-brand-column,
html[data-theme="light"] .footer-column {
  border-color: rgba(255, 255, 255, 0.88) !important;
}
html[data-theme="light"] .section-soft::before {
  background: linear-gradient(180deg, transparent 0%, rgba(59, 130, 246, 0.03) 40%, transparent 100%) !important;
}

@media (pointer: coarse), (hover: none) {
  .backdrop-orb,
  .hero-ambient,
  .scene-ring,
  .device-shell,
  .hero-board,
  .floating-chip,
  .pricing-orbit span,
  .tag-chip::before,
  .nav-cta::after,
  .primary-button::after,
  .mobile-nav-cta::after,
  .pricing-main-cta::after,
  .project-link.primary-link::after {
    animation: none !important;
  }
  .glass-panel,
  .nav-shell,
  .service-card,
  .direction-card,
  .project-card,
  .benefit-card,
  .process-card,
  .faq-card,
  .contact-panel,
  .pricing-panel,
  .footer-brand-column,
  .footer-column,
  .trust-card,
  .stat-card,
  .info-card,
  .board-copy,
  .gradient-panel,
  .floating-chip,
  .modal-dialog,
  .quick-contact-bar,
  .mobile-dock,
  .mobile-menu,
  .mobile-menu a,
  .nav-icon-button,
  .menu-button,
  .secondary-button,
  .filter-button,
  .modal-backdrop {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
  .site-backdrop,
  .cursor-ring,
  .cursor-dot,
  .scene-ring {
    display: none !important;
  }
  .hero-ambient { display: none !important; }
  .hero-section.hero-section-premium::before { display: none !important; }
  .hero-section.hero-section-premium::after  { display: none !important; }
  body {
    background:
      linear-gradient(160deg, rgba(0, 200, 248, 0.06) 0%, transparent 32%),
      linear-gradient(180deg, var(--bg), var(--bg-soft)) !important;
  }
  body::before {
    background:
      radial-gradient(circle at 15% 20%, rgba(0, 212, 255, 0.12), transparent 28%),
      radial-gradient(circle at 86% 16%, rgba(124, 58, 237, 0.10), transparent 26%) !important;
    opacity: 0.55 !important;
  }
  body::after { display: none !important; }
  html[data-theme="light"] body {
    background:
      linear-gradient(160deg, rgba(147, 197, 253, 0.18) 0%, transparent 32%),
      linear-gradient(180deg, #daeeff, #e8f4ff) !important;
  }
  html[data-theme="light"] body::before { display: none !important; }
  .tag-chip::before { display: none !important; }
  html[data-theme="dark"] .glass-panel,
  html[data-theme="dark"] .nav-shell,
  html[data-theme="dark"] .service-card,
  html[data-theme="dark"] .direction-card,
  html[data-theme="dark"] .project-card,
  html[data-theme="dark"] .benefit-card,
  html[data-theme="dark"] .process-card,
  html[data-theme="dark"] .faq-card,
  html[data-theme="dark"] .contact-panel,
  html[data-theme="dark"] .pricing-panel,
  html[data-theme="dark"] .footer-brand-column,
  html[data-theme="dark"] .footer-column,
  html[data-theme="dark"] .trust-card,
  html[data-theme="dark"] .stat-card,
  html[data-theme="dark"] .info-card,
  html[data-theme="dark"] .board-copy,
  html[data-theme="dark"] .gradient-panel,
  html[data-theme="dark"] .floating-chip,
  html[data-theme="dark"] .modal-dialog,
  html[data-theme="dark"] .mobile-dock,
  html[data-theme="dark"] .mobile-menu,
  html[data-theme="dark"] .mobile-menu a,
  html[data-theme="dark"] .nav-icon-button,
  html[data-theme="dark"] .menu-button {
    background: var(--surface-strong) !important;
    border-color: var(--line) !important;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.22) !important;
  }
  html[data-theme="light"] .glass-panel,
  html[data-theme="light"] .nav-shell,
  html[data-theme="light"] .service-card,
  html[data-theme="light"] .direction-card,
  html[data-theme="light"] .project-card,
  html[data-theme="light"] .benefit-card,
  html[data-theme="light"] .process-card,
  html[data-theme="light"] .faq-card,
  html[data-theme="light"] .contact-panel,
  html[data-theme="light"] .pricing-panel,
  html[data-theme="light"] .footer-brand-column,
  html[data-theme="light"] .footer-column,
  html[data-theme="light"] .trust-card,
  html[data-theme="light"] .stat-card,
  html[data-theme="light"] .info-card,
  html[data-theme="light"] .board-copy,
  html[data-theme="light"] .gradient-panel,
  html[data-theme="light"] .floating-chip,
  html[data-theme="light"] .modal-dialog,
  html[data-theme="light"] .mobile-menu,
  html[data-theme="light"] .mobile-menu a,
  html[data-theme="light"] .nav-icon-button,
  html[data-theme="light"] .menu-button,
  html[data-theme="light"] .secondary-button,
  html[data-theme="light"] .filter-button {
    background:
      linear-gradient(155deg, rgba(255,255,255,0.98), rgba(235,248,255,0.92)) !important;
    border-color: rgba(180, 210, 240, 0.30) !important;
    box-shadow:
      inset 0 1.5px 0 rgba(255, 255, 255, 1),
      0 2px 10px rgba(15, 23, 42, 0.07) !important;
  }

  html[data-theme="light"] .mobile-dock {
    background: rgba(255, 255, 255, 0.98) !important;
    border-color: rgba(180, 210, 240, 0.32) !important;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 1),
      0 -2px 16px rgba(15, 23, 42, 0.08) !important;
  }

  html[data-theme="light"] .quick-contact-bar {
    background: rgba(255, 255, 255, 0.97) !important;
    border-color: rgba(180, 210, 240, 0.30) !important;
  }
  .reveal-up,
  .reveal-scale,
  .trust-card,
  .service-card,
  .project-card,
  .direction-card,
  .benefit-card,
  .process-card,
  .faq-card,
  .stat-card,
  .hero-board,
  .floating-chip,
  .hero-device {
    will-change: auto !important;
  }
  .hero-board {
    transform: none !important;
    perspective: none !important;
    transform-style: flat !important;
    transition: border-color 0.3s ease, box-shadow 0.3s ease !important;
  }
  .service-card:hover,
  .direction-card:hover,
  .project-card:hover,
  .benefit-card:hover,
  .process-card:hover,
  .faq-card:hover,
  .stat-card:hover,
  .trust-card:hover,
  .app-contact-card:hover,
  .nav-icon-button:hover,
  .menu-button:hover,
  .floating-chip:hover,
  .filter-button:hover,
  .desktop-nav a:hover {
    transform: none !important;
  }

  .project-card:hover .project-media img,
  .direction-card:hover .direction-media img {
    transform: none !important;
  }
  .service-card,
  .direction-card,
  .project-card,
  .benefit-card,
  .process-card,
  .faq-card,
  .trust-card,
  .app-contact-card,
  .stat-card {
    transition: none !important;
  }

  .nav-cta,
  .primary-button,
  .secondary-button,
  .mobile-nav-cta,
  .pricing-main-cta,
  .project-link,
  .filter-button,
  .dock-link {
    transition: opacity 0.15s ease !important;
  }

  .direction-media img,
  .project-media img {
    transition: none !important;
  }
  .service-card,
  .direction-card,
  .project-card,
  .benefit-card,
  .process-card,
  .faq-card,
  .contact-panel,
  .pricing-panel,
  .stat-card,
  .trust-card {
    box-shadow: 0 2px 12px rgba(15, 23, 42, 0.08) !important;
  }

  html[data-theme="dark"] .service-card,
  html[data-theme="dark"] .direction-card,
  html[data-theme="dark"] .project-card,
  html[data-theme="dark"] .benefit-card,
  html[data-theme="dark"] .process-card,
  html[data-theme="dark"] .faq-card,
  html[data-theme="dark"] .contact-panel,
  html[data-theme="dark"] .pricing-panel,
  html[data-theme="dark"] .stat-card,
  html[data-theme="dark"] .trust-card {
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.26) !important;
  }
  .brand-logo,
  .footer-logo {
    filter: none !important;
  }
  #services {
    content-visibility: auto;
    contain-intrinsic-size: 0 700px;
  }
  #directions {
    content-visibility: auto;
    contain-intrinsic-size: 0 900px;
  }
  #work {
    content-visibility: auto;
    contain-intrinsic-size: 0 1100px;
  }
  #advantages {
    content-visibility: auto;
    contain-intrinsic-size: 0 600px;
  }
  #process {
    content-visibility: auto;
    contain-intrinsic-size: 0 500px;
  }
  #pricing {
    content-visibility: auto;
    contain-intrinsic-size: 0 450px;
  }
  #faq {
    content-visibility: auto;
    contain-intrinsic-size: 0 700px;
  }
  #contact {
    content-visibility: auto;
    contain-intrinsic-size: 0 400px;
  }
  .site-footer::before {
    display: none !important;
  }
  .reveal-up,
  .reveal-scale,
  .trust-card,
  .service-card,
  .project-card,
  .direction-card,
  .benefit-card,
  .process-card,
  .faq-card,
  .stat-card {
    transition-duration: 0.4s !important;
    transition-timing-function: ease-out !important;
  }
  .section-soft::before { display: none !important; }
}

@media (pointer: coarse), (hover: none) {
  .service-card:active,
  .direction-card:active,
  .project-card:active,
  .benefit-card:active,
  .trust-card:active,
  .faq-card:active {
    opacity: 0.86;
    transform: scale(0.985) !important;
    transition: opacity 0.08s ease, transform 0.08s ease !important;
  }
  .primary-button:active,
  .secondary-button:active,
  .project-link:active,
  .pricing-main-cta:active,
  .mobile-nav-cta:active,
  .nav-cta:active {
    opacity: 0.78;
    transform: scale(0.96) !important;
    transition: opacity 0.08s ease, transform 0.08s ease !important;
  }
  .dock-link:active {
    opacity: 0.75;
    transform: scale(0.92) !important;
    transition: opacity 0.08s ease, transform 0.08s ease !important;
  }
  .app-contact-card:active {
    opacity: 0.84;
    transform: scale(0.98) !important;
    transition: opacity 0.08s ease, transform 0.08s ease !important;
  }
  .filter-button:active {
    opacity: 0.80;
    transform: scale(0.97) !important;
    transition: opacity 0.08s ease, transform 0.08s ease !important;
  }
}

@media (max-width: 480px) {
  html[data-theme="dark"] .gradient-panel {
    background: var(--surface-alt) !important;
  }

  html[data-theme="light"] .gradient-panel {
    background: rgba(220, 242, 255, 0.80) !important;
  }
  .site-footer::before { display: none !important; }
  .pricing-orbit { display: none !important; }
  .hero-board { padding: 12px !important; }
  .dock-link {
    min-height: 54px !important;
    border-radius: 16px !important;
  }
  .mobile-menu a {
    padding: 14px 15px !important;
    min-height: 52px;
  }
  .info-icon,
  .service-icon,
  .benefit-icon,
  .faq-icon,
  .trust-card i,
  .process-number {
    box-shadow: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .tag-chip::before,
  .device-shell,
  .hero-ambient,
  .scene-ring,
  .backdrop-orb,
  .pricing-orbit span,
  .floating-chip {
    animation: none !important;
  }
}