:root {
  --background: #060c1a;
  --foreground: #ffffff;
  --font-inter: 'Inter', sans-serif;
}

body {
  background: var(--background);
  color: var(--foreground);
  font-family: var(--font-inter), Arial, Helvetica, sans-serif;
  -webkit-font-smoothing: antialiased;
  margin: 0;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

html {
  height: 100%;
  -webkit-font-smoothing: antialiased;
}

/* Imported HTML pages assume no fixed header; compensate for our fixed SiteHeader. */
.imported-html {
  padding-top: 120px;
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

/* Wider, spaced title row under the nav (all pages that use the universal banner). */
.imported-html .imported-page-banner {
  margin-top: 0.75rem;
  padding-top: 0.5rem;
  padding-bottom: 0.25rem;
}

.imported-html .imported-page-banner > div {
  max-width: min(90rem, calc(100vw - 2rem)) !important;
  width: 100%;
}

/*
 * Imported <style> blocks / Tailwind CDN can leak rules that blow up the fixed header (svg, transforms).
 * Lock the marketing header to stable typography and icon sizes.
 */
header.site-header {
  font-family: var(--font-inter), system-ui, sans-serif !important;
  -webkit-font-smoothing: antialiased;
  font-size: 16px !important;
  line-height: 1.25 !important;
  letter-spacing: normal !important;
  text-transform: none !important;
}

header.site-header .uppercase {
  text-transform: uppercase !important;
}

header.site-header img {
  height: auto !important;
  max-height: 5rem !important;
  width: auto !important;
  max-width: min(220px, 40vw) !important;
}

header.site-header svg {
  display: block;
  flex-shrink: 0;
  overflow: visible;
  max-width: 1.5rem !important;
  max-height: 1.5rem !important;
}

header.site-header svg.h-4,
header.site-header svg.w-4 {
  width: 1rem !important;
  height: 1rem !important;
  min-width: 1rem !important;
  min-height: 1rem !important;
  max-width: 1rem !important;
  max-height: 1rem !important;
}

header.site-header svg.h-5,
header.site-header svg.w-5 {
  width: 1.25rem !important;
  height: 1.25rem !important;
  min-width: 1.25rem !important;
  min-height: 1.25rem !important;
  max-width: 1.25rem !important;
  max-height: 1.25rem !important;
}

header.site-header .site-header__inner.container {
  max-width: 96rem;
}

/* Scope contact layout so utilities never interfere with chrome */
.imported-html .contact-page-section {
  isolation: isolate;
}

*,
input,
textarea,
select,
button {
  font-family: var(--font-inter), Arial, Helvetica, sans-serif;
}

/* ============================================================
   MOBILE-FIRST RESPONSIVE OVERRIDES
   Applied inside .imported-html (all content pages)
   ============================================================ */

/* Prevent horizontal scroll caused by oversized decorative elements */
body,
.imported-html {
  overflow-x: hidden;
}

/* Reduce imported-html top padding on mobile (header is shorter) */
@media (max-width: 1023px) {
  .imported-html {
    padding-top: 64px;
  }
}

/* ------- Extra-small mobile (< 640px / below Tailwind sm) ------- */
@media (max-width: 639px) {

  /* Heading scale-down */
  .imported-html .text-8xl,
  .imported-html .text-7xl,
  .imported-html .text-6xl {
    font-size: 1.85rem !important;
    line-height: 1.15  !important;
  }
  .imported-html .text-5xl {
    font-size: 1.6rem  !important;
    line-height: 1.2   !important;
  }
  .imported-html .text-4xl {
    font-size: 1.4rem  !important;
    line-height: 1.25  !important;
  }
  .imported-html .text-3xl {
    font-size: 1.2rem  !important;
    line-height: 1.3   !important;
  }

  /* Grid column collapse - explicit and Tailwind responsive prefix classes */
  .imported-html .grid-cols-6,
  .imported-html .grid-cols-5,
  .imported-html .grid-cols-4,
  .imported-html [class*="md\:grid-cols-4"],
  .imported-html [class*="md\:grid-cols-5"],
  .imported-html [class*="md\:grid-cols-6"],
  .imported-html [class*="lg\:grid-cols-4"],
  .imported-html [class*="lg\:grid-cols-5"],
  .imported-html [class*="lg\:grid-cols-6"],
  .imported-html [class*="xl\:grid-cols-4"],
  .imported-html [class*="xl\:grid-cols-5"],
  .imported-html [class*="xl\:grid-cols-6"] {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .imported-html .grid-cols-3,
  .imported-html [class*="md\:grid-cols-3"],
  .imported-html [class*="lg\:grid-cols-3"],
  .imported-html [class*="xl\:grid-cols-3"] {
    grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
  }
  .imported-html .grid-cols-2 {
    grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
  }

  /* Two-column grid layouts: force single column */
  .imported-html [class*="lg\:grid-cols-2"],
  .imported-html [class*="lg\:grid-cols-\["] {
    grid-template-columns: 1fr !important;
  }

  /* ALL SVGs: kill inline min-width and prevent overflow */
  .imported-html svg,
  main svg {
    max-width: 100% !important;
    height: auto !important;
    min-width: 0 !important;
  }

  /* Overflow wrapper for large SVGs */
  .imported-html .overflow-x-auto {
    -webkit-overflow-scrolling: touch;
  }

  /* ALL absolute/fixed positioned blobs: clip overflow */
  .imported-html [class*="absolute"][class*="blur-"],
  .imported-html [class*="absolute"][style*="blur"],
  .imported-html .blob-ai, .imported-html .blob-ai-2, .imported-html .blob-ai-3,
  .imported-html [class*="am-blob"],
  .imported-html [class*="dxa-blob"],
  .imported-html [class*="blob"] {
    max-width: 60vw !important;
    max-height: 60vw !important;
  }

  /* Ensure all containers clip overflow */
  .imported-html > div,
  .imported-html section,
  .imported-html main {
    overflow-x: hidden !important;
  }

  /* Large rounded panels: reduce for mobile */
  .imported-html [class*="rounded-\[28"],
  .imported-html [class*="rounded-\[32"],
  .imported-html [class*="rounded-\[36"],
  .imported-html [class*="rounded-\[2.5"],
  .imported-html [class*="rounded-\[2.2"],
  .imported-html [class*="rounded-\[4"] {
    border-radius: 1rem !important;
  }

  /* Large inner padding */
  .imported-html .p-7 { padding: 1rem !important; }
  .imported-html .p-6 { padding: 0.875rem !important; }
  .imported-html .p-5 { padding: 0.75rem !important; }

  /* Text overflow on cards */
  .imported-html .text-xl { font-size: 1rem !important; }
  .imported-html .text-2xl { font-size: 1.1rem !important; }
  .imported-html .text-lg { font-size: 0.875rem !important; }
  .imported-html .text-base { font-size: 0.8125rem !important; }

  /* Flex gap reduction */
  .imported-html .gap-14 { gap: 1.25rem !important; }
  .imported-html .gap-10 { gap: 1rem !important; }
  .imported-html .gap-8 { gap: 0.75rem !important; }
  .imported-html .gap-6 { gap: 0.625rem !important; }
  .imported-html .gap-5 { gap: 0.5rem !important; }
  .imported-html .gap-4 { gap: 0.5rem !important; }
  .imported-html .gap-3 { gap: 0.375rem !important; }

  /* Reduce heavy section padding */
  .imported-html .py-32 {
    padding-top: 3rem    !important;
    padding-bottom: 3rem !important;
  }
  .imported-html .py-28 {
    padding-top: 2.5rem    !important;
    padding-bottom: 2.5rem !important;
  }
  .imported-html .py-24 {
    padding-top: 2.5rem    !important;
    padding-bottom: 2.5rem !important;
  }
  .imported-html .py-20 {
    padding-top: 2rem    !important;
    padding-bottom: 2rem !important;
  }
  .imported-html .py-16 {
    padding-top: 1.5rem    !important;
    padding-bottom: 1.5rem !important;
  }
  .imported-html .pt-48 {
    padding-top: 3rem !important;
  }
  .imported-html .pt-40 {
    padding-top: 2.5rem !important;
  }
  .imported-html .pt-60,
  .imported-html .pt-64 {
    padding-top: 3rem !important;
  }
  .imported-html .pb-32 {
    padding-bottom: 2.5rem !important;
  }
  .imported-html .pb-20 {
    padding-bottom: 2rem !important;
  }

  /* Reduce heavy horizontal padding */
  .imported-html .px-12 {
    padding-left: 1rem  !important;
    padding-right: 1rem !important;
  }
  .imported-html .px-8 {
    padding-left: 0.75rem  !important;
    padding-right: 0.75rem !important;
  }
  .imported-html .px-6 {
    padding-left: 0.75rem  !important;
    padding-right: 0.75rem !important;
  }

  /* Reduce large gaps */
  .imported-html .gap-24 { gap: 2rem !important; }
  .imported-html .gap-20 { gap: 1.5rem !important; }
  .imported-html .gap-16 { gap: 1.25rem !important; }
  .imported-html .gap-12 { gap: 1rem !important; }
  .imported-html .gap-10 { gap: 0.75rem !important; }

  /* Keep max-w containers within viewport */
  .imported-html .max-w-7xl,
  .imported-html .max-w-6xl,
  .imported-html .max-w-5xl,
  .imported-html .max-w-4xl {
    max-width: 100% !important;
  }

  /* Clip oversized decorative blobs */
  .imported-html [class*="w-[500px]"],
  .imported-html [class*="w-[600px]"],
  .imported-html [class*="w-[700px]"],
  .imported-html [class*="w-[800px]"],
  .imported-html [class*="w-[900px]"] {
    max-width: 100vw !important;
  }

  /* SVGs must not overflow */
  .imported-html svg {
    max-width: 100% !important;
    height: auto !important;
  }
  .imported-html svg[style*="min-width"] {
    min-width: unset !important;
  }

  /* Tables: force horizontal scroll, shrink text */
  .imported-html table {
    font-size: 0.7rem !important;
    display: block;
    overflow-x: auto;
  }

  /* Canvas backgrounds: limit on mobile */
  .imported-html canvas {
    max-width: 100vw !important;
  }

  /* CTA button groups: stack on mobile */
  .imported-html .flex.gap-4 > a,
  .imported-html .flex.gap-6 > a {
    width: 100%;
    text-align: center;
  }

  /* Large rounded corners: reduce on mobile */
  .imported-html .rounded-\[4rem\] { border-radius: 1.5rem !important; }
  .imported-html .rounded-\[3\.5rem\] { border-radius: 1.25rem !important; }
  .imported-html .rounded-\[3rem\] { border-radius: 1rem !important; }
  .imported-html .rounded-\[2\.5rem\] { border-radius: 1rem !important; }
  .imported-html .rounded-\[2rem\] { border-radius: 0.75rem !important; }
  .imported-html .rounded-3xl { border-radius: 1rem !important; }

  /* Hero two-column layouts: stack */
  .imported-html .lg\:grid-cols-2,
  .imported-html .lg\:grid-cols-\[1fr_420px\],
  .imported-html .lg\:grid-cols-\[1\.1fr_0\.9fr\],
  .imported-html .lg\:grid-cols-\[1\.05fr_0\.95fr\],
  .imported-html .lg\:grid-cols-\[0\.38fr_0\.62fr\] {
    grid-template-columns: 1fr !important;
  }

  /* Fixed inset-0 background blobs: prevent overflow */
  .imported-html .fixed.inset-0 {
    position: absolute !important;
  }

  /* Contact page form */
  .imported-html .contact-page-section .lg\:col-span-2 {
    grid-column: span 1 !important;
  }
  .imported-html .contact-page-section .lg\:grid-cols-3 {
    grid-template-columns: 1fr !important;
  }

  /* Large card padding */
  .imported-html .p-12 { padding: 1.25rem !important; }
  .imported-html .p-10 { padding: 1rem !important; }
  .imported-html .p-8 { padding: 0.875rem !important; }
  .imported-html .p-7 { padding: 0.875rem !important; }

  /* Large margin-bottom */
  .imported-html .mb-24 { margin-bottom: 2rem !important; }
  .imported-html .mb-20 { margin-bottom: 1.5rem !important; }
  .imported-html .mb-16 { margin-bottom: 1.25rem !important; }

  /* Aspect-square stat cards in about page */
  .imported-html .aspect-square {
    aspect-ratio: auto !important;
    padding: 1.5rem !important;
  }

  /* Hero dashboard floating: disable on mobile for performance */
  .imported-html .ind-hero-visual,
  .imported-html .hero-dashboard {
    animation: none !important;
  }

  /* Marquee: slow down on mobile */
  .imported-html .hm-marquee-track {
    animation-duration: 20s !important;
  }
}

/* ------- Small breakpoint (640px – 767px) ------- */
@media (min-width: 640px) and (max-width: 767px) {

  .imported-html .text-8xl,
  .imported-html .text-7xl,
  .imported-html .text-6xl {
    font-size: 2.25rem !important;
    line-height: 1.15 !important;
  }
  .imported-html .text-5xl {
    font-size: 2rem !important;
    line-height: 1.2  !important;
  }

  .imported-html .grid-cols-6,
  .imported-html .grid-cols-5,
  .imported-html [class*="lg\:grid-cols-5"],
  .imported-html [class*="lg\:grid-cols-6"] {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
  .imported-html .grid-cols-4,
  .imported-html [class*="md\:grid-cols-4"],
  .imported-html [class*="lg\:grid-cols-4"] {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .imported-html .grid-cols-3,
  .imported-html [class*="md\:grid-cols-3"],
  .imported-html [class*="lg\:grid-cols-3"] {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  /* SVG overflow fix */
  .imported-html svg { max-width: 100% !important; height: auto !important; }
  .imported-html svg[style*="min-width"] { min-width: unset !important; }

  /* Padding reduction */
  .imported-html .py-32 { padding-top: 4rem !important; padding-bottom: 4rem !important; }
  .imported-html .py-28 { padding-top: 3.5rem !important; padding-bottom: 3.5rem !important; }
  .imported-html .pt-48 { padding-top: 4rem !important; }
  .imported-html .pt-60,
  .imported-html .pt-64 { padding-top: 4rem !important; }

  /* SVG overflow */
  .imported-html svg { max-width: 100% !important; height: auto !important; }
  .imported-html svg[style*="min-width"] { min-width: unset !important; }

  /* Fixed bg blobs */
  .imported-html .fixed.inset-0 { position: absolute !important; }
}

/* ------- Tablet breakpoint (768px – 1023px) ------- */
@media (min-width: 768px) and (max-width: 1023px) {
  .imported-html .text-8xl,
  .imported-html .text-7xl {
    font-size: 3rem !important;
    line-height: 1.1 !important;
  }
  .imported-html .text-6xl {
    font-size: 2.5rem !important;
    line-height: 1.15 !important;
  }
  .imported-html .pt-48 { padding-top: 5rem !important; }
  .imported-html .pt-60,
  .imported-html .pt-64 { padding-top: 5rem !important; }
  .imported-html svg[style*="min-width"] { min-width: unset !important; }
  .imported-html .fixed.inset-0 { position: absolute !important; }
}

/* ------- Home page (main element) mobile fixes ------- */
@media (max-width: 639px) {
  main .py-32, main .py-16 {
    padding-top: 2rem    !important;
    padding-bottom: 2rem !important;
  }
  main .py-24 {
    padding-top: 2.5rem    !important;
    padding-bottom: 2.5rem !important;
  }
  main .mb-20, main .mb-24, main .mb-28 {
    margin-bottom: 1.5rem !important;
  }
  main .mb-16 { margin-bottom: 1.25rem !important; }
  main .text-8xl,
  main .text-7xl,
  main .text-6xl {
    font-size: 1.85rem !important;
    line-height: 1.12  !important;
  }
  main .text-5xl {
    font-size: 1.6rem !important;
    line-height: 1.15 !important;
  }
  main .text-4xl {
    font-size: 1.35rem !important;
    line-height: 1.2 !important;
  }
  main .grid-cols-5,
  main .grid-cols-4 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  main .grid-cols-3,
  main .grid-cols-2:not(.grid-cols-5):not([class*="md\:grid-cols"]) {
    grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
  }
  main .p-10 { padding: 1.25rem !important; }
  main .p-8  { padding: 1rem !important; }
  main .p-6  { padding: 0.875rem !important; }
  main .gap-20 { gap: 1.5rem !important; }
  main .gap-16 { gap: 1.25rem !important; }
  main .gap-8 { gap: 0.75rem !important; }
  main .gap-6 { gap: 0.5rem !important; }

  /* Home hero: shrink padding */
  main section:first-of-type .pt-24 { padding-top: 1.5rem !important; }
  main .min-h-screen { min-height: auto !important; }

  /* SVG overflow prevention */
  main svg { max-width: 100% !important; height: auto !important; min-width: 0 !important; }

  /* Canvas neural bg: reduce on mobile */
  main canvas { opacity: 0.12 !important; }

  /* Clip overflow on all main containers */
  main, main > section, main section {
    overflow-x: hidden !important;
  }

  /* Stat badge chips */
  main .flex-wrap { gap: 0.5rem !important; }

  /* Home service cards grid → 2 cols */
  main .lg\:grid-cols-5 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  main .lg\:grid-cols-4 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  main .lg\:grid-cols-3 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  main .md\:grid-cols-4 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  /* Floating animations: disable for perf */
  main .ind-hero-visual,
  main .hero-dashboard {
    animation: none !important;
  }

  /* RFM matrix: make scrollable */
  main .grid-cols-5 {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    font-size: 0.6rem !important;
  }

  /* Large rounded corners */
  main .rounded-\[2\.5rem\] { border-radius: 1rem !important; }
  main .rounded-\[2rem\] { border-radius: 0.75rem !important; }
  main .rounded-3xl { border-radius: 0.75rem !important; }

  /* Marquee logo items */
  .hm-logo-item { min-width: 120px !important; padding: 0 16px !important; }
  .hm-logo-item img { max-height: 24px !important; }

  /* Integration section edge fades */
  .hm-marquee-track { animation-duration: 20s !important; }
}

/* ------- Footer mobile fixes ------- */
@media (max-width: 639px) {
  footer {
    padding-top: 3rem    !important;
    padding-bottom: 3rem !important;
  }
  footer .container {
    padding-left: 1rem  !important;
    padding-right: 1rem !important;
  }
  footer .mb-16 {
    margin-bottom: 2.5rem !important;
  }
  footer .gap-16 {
    gap: 2rem !important;
  }
  footer .py-24 {
    padding-top: 3rem    !important;
    padding-bottom: 3rem !important;
  }
}

/* ------- Header mobile fix ------- */
@media (max-width: 1023px) {
  .site-header {
    padding-top: 0.625rem    !important;
    padding-bottom: 0.625rem !important;
  }
  header.site-header img {
    max-height: 2.75rem !important;
  }
}
@media (max-width: 639px) {
  header.site-header img {
    max-height: 2.25rem !important;
  }
  header.site-header .site-header__inner {
    padding-left: 0.75rem !important;
    padding-right: 0.75rem !important;
  }
}

/* ------- Global: prevent any horizontal overflow ------- */
html {
  overflow-x: hidden !important;
  max-width: 100vw;
  width: 100%;
}
body {
  overflow-x: hidden !important;
  max-width: 100vw;
  width: 100%;
  position: relative;
}
/* All imported page containers must clip */
.imported-html {
  max-width: 100vw;
  width: 100%;
}
/* Kill ALL inline min-width on SVGs globally */
svg[style*="min-width"] {
  min-width: 0 !important;
}

/* ------- Samsung Internet / Older WebKit Fixes ------- */
/* Samsung Internet doesn't fully support backdrop-filter */
@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  .backdrop-blur-xl,
  .backdrop-blur-md,
  .backdrop-blur-sm,
  [class*="backdrop-blur"] {
    background-color: rgba(10, 10, 26, 0.95) !important;
  }
}

/* Fix 100vw causing horizontal scroll on Samsung (scrollbar width issue) */
*:not([class*="absolute"]):not([class*="fixed"]):not([class*="invisible"]),
*::before,
*::after {
  max-width: 100%;
}
/* Dropdown panelleri max-width kısıtlamasından muaf tut */
header.site-header .group > [class*="invisible"],
header.site-header .group > [class*="absolute"] {
  max-width: none !important;
}
img, video, canvas, svg {
  max-width: 100%;
  height: auto;
}

/* Samsung Internet safe viewport units */
@supports not (height: 100dvh) {
  .min-h-screen {
    min-height: 100vh !important;
    min-height: -webkit-fill-available !important;
  }
}

/* Fix flex items overflowing on Samsung */
.flex > * {
  min-width: 0;
}
.grid > * {
  min-width: 0;
}

/* Samsung fix: inline elements with width > viewport */
[style*="width:"],
[style*="min-width:"] {
  max-width: 100vw;
}

/* Fix for Samsung header blur rendering */
@media (max-width: 1023px) {
  header.site-header {
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    background-color: rgba(10, 10, 26, 0.92) !important;
  }

  /* Mobile menu backdrop fix for Samsung */
  #mobileMenu .backdrop-blur-sm,
  #mobileMenu [class*="backdrop-blur"] {
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
    background-color: rgba(0, 0, 0, 0.7) !important;
  }

  #mobileMenu [class*="backdrop-blur-xl"] {
    -webkit-backdrop-filter: blur(16px);
    backdrop-filter: blur(16px);
    background-color: rgba(13, 13, 31, 0.97) !important;
  }
}

/* Samsung: fix text-size-adjust auto-zoom */
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

/* Samsung: touch targets minimum 44px */
@media (max-width: 639px) {
  a, button, [role="button"], input, select, textarea {
    min-height: 44px;
    min-width: 44px;
  }
  /* Exclude inline text links */
  p a, span a, li a {
    min-height: auto;
    min-width: auto;
  }
  /* Fix grid overflow on Samsung */
  .grid {
    width: 100% !important;
  }
}

/* Samsung: fix position:fixed in scroll containers */
@media (max-width: 1023px) {
  .fixed {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }
}