/* Kardemir Modern Theme Overrides */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=Outfit:wght@500;600;700;800&display=swap');

:root {
  --font-body: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
  --font-heading: 'Outfit', 'Plus Jakarta Sans', system-ui, sans-serif;
  --surface-glass: rgba(255, 255, 255, 0.06);
  --surface-glass-border: rgba(255, 255, 255, 0.1);
  --shadow-soft: 0 4px 24px rgba(0, 0, 0, 0.12);
  --shadow-elevated: 0 12px 40px rgba(0, 0, 0, 0.18);
  --radius-card: 1rem;
  --radius-lg: 1.25rem;
}



body,
#root {
  font-family: var(--font-body) !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1,
h2,
h3,
h4,
h5,
h6,
.section-title,
.font-black {
  font-family: var(--font-heading) !important;
}

/* Hero section enhancements */
#hero {
  position: relative;
}

#hero>.absolute.inset-0.z-0 img {
  object-position: center 30%;
  transform: scale(1.02);
  transition: transform 8s ease;
}

#hero:hover>.absolute.inset-0.z-0 img {
  transform: scale(1.06);
}

#hero>.absolute.inset-0.z-0>.absolute.inset-0 {
  background: linear-gradient(105deg,
      rgba(15, 23, 42, 0.88) 0%,
      rgba(15, 23, 42, 0.65) 45%,
      rgba(15, 23, 42, 0.25) 100%) !important;
}



/* Page background */
.fixed.inset-0.z-\[-1\] {
  filter: none !important;
  transform: none !important;
}

html.dark-mode .fixed.inset-0.z-\[-1\] {
  background-size: cover !important;
  background-position: center !important;
}



/* Modern glass cards */
.bg-white\/5.backdrop-blur-sm,
.bg-white\/5.backdrop-blur-xl {
  border-radius: var(--radius-card) !important;
  box-shadow: var(--shadow-soft);
  transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}

.bg-white\/5.backdrop-blur-sm:hover,
.bg-white\/5.backdrop-blur-xl:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-elevated);
}

/* Buttons */
.btn-primary {
  border-radius: 0.75rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.02em;
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.btn-primary:hover {
  transform: translateY(-1px);
  filter: brightness(1.08);
}

/* Store gallery */
#store-gallery .gallery-card {
  border-radius: var(--radius-lg);
  overflow: hidden;
  border: 1px solid var(--surface-glass-border);
  background: var(--surface-glass);
  aspect-ratio: 4/3;
  position: relative;
  box-shadow: var(--shadow-soft);
  transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

#store-gallery .gallery-card:hover {
  border-color: color-mix(in srgb, var(--primary) 50%, transparent);
  box-shadow: var(--shadow-elevated);
  transform: translateY(-4px);
}

#store-gallery .gallery-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

#store-gallery .gallery-card:hover img {
  transform: scale(1.08);
}

/* Navbar sticky state */
nav.sticky {
  transition: all 0.35s ease !important;
}

/* Section spacing */
section {
  scroll-margin-top: 80px;
}

/* Footer social hover */
footer a[href*="wa.me"],
footer button {
  transition: all 0.25s ease;
}



/* Smooth scroll */
html {
  scroll-behavior: smooth;
}

/* Selection color */
::selection {
  background: color-mix(in srgb, var(--primary) 30%, transparent);
  color: inherit;
}

/* Fix Brands section hover */
section .opacity-80.grayscale.hover\:grayscale-0 {
  filter: none !important;
}

section .opacity-80>.group.cursor-default {
  filter: grayscale(100%);
  transition: filter 0.4s ease;
}

section .opacity-80>.group.cursor-default:hover {
  filter: grayscale(0%) !important;
}



/* Hide the slanted wave shape at the bottom of the hero section */
#hero .absolute.bottom-0.left-0.right-0 svg {
  display: none !important;
}