/* ===== Mobile-only polish: desktop untouched ===== */
html, body {
  max-width: 100%;
  overflow-x: hidden;
}

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

@media (max-width: 1023px) {
  html, body, #root {
    overflow-x: hidden !important;
  }

  body {
    -webkit-text-size-adjust: 100%;
  }

  header {
    overflow: visible !important;
  }

  header .max-w-7xl {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  header .h-20 {
    height: 72px !important;
    min-height: 72px !important;
  }

  header a.flex.items-center.gap-2.group {
    gap: 10px !important;
    min-width: 0 !important;
    max-width: calc(100vw - 84px) !important;
    flex: 1 1 auto !important;
  }

  header a.flex.items-center.gap-2.group > span {
    font-size: 1rem !important;
    line-height: 1.15 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    display: block !important;
    max-width: 100% !important;
  }

  header button[aria-label="Toggle menu"] {
    width: 44px !important;
    height: 44px !important;
    padding: 8px !important;
    border-radius: 12px !important;
    flex: 0 0 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* mobile drawer */
  header .fixed.top-20.right-0.bottom-0.w-80 {
    top: 72px !important;
    width: min(88vw, 340px) !important;
    max-width: 340px !important;
    border-top-left-radius: 18px !important;
    border-bottom-left-radius: 18px !important;
    padding-bottom: max(20px, env(safe-area-inset-bottom)) !important;
  }

  header .fixed.top-20.right-0.bottom-0.w-80 nav {
    padding: 16px !important;
    gap: 8px !important;
  }

  header .fixed.top-20.right-0.bottom-0.w-80 nav a {
    padding: 12px 14px !important;
    font-size: 0.98rem !important;
    line-height: 1.3 !important;
    white-space: normal !important;
    word-break: break-word !important;
  }

  main {
    width: 100% !important;
    overflow-x: hidden !important;
  }

  main.pt-20 {
    padding-top: 72px !important;
  }

  section {
    overflow-x: clip;
  }

  /* general containers */
  .max-w-7xl, .max-w-6xl, .max-w-5xl, .max-w-4xl {
    width: 100% !important;
  }

  /* hero */
  main > section:first-of-type {
    min-height: auto !important;
  }

  main > section:first-of-type .py-20,
  main > section:first-of-type .py-24 {
    padding-top: 2rem !important;
    padding-bottom: 2rem !important;
  }

  main > section:first-of-type h1 {
    font-size: clamp(2rem, 8.5vw, 2.8rem) !important;
    line-height: 1.05 !important;
    margin-bottom: 1rem !important;
  }

  main > section:first-of-type p {
    font-size: 1rem !important;
    line-height: 1.65 !important;
  }

  main > section:first-of-type .flex.flex-col.sm\:flex-row {
    width: 100% !important;
    gap: 12px !important;
  }

  main > section:first-of-type .flex.flex-col.sm\:flex-row a {
    width: 100% !important;
    justify-content: center !important;
    padding: 14px 18px !important;
    font-size: 1rem !important;
  }

  /* timeline / basvuru rehberi */
  .space-y-12 > .relative.pl-20 {
    padding-left: 64px !important;
  }

  .absolute.left-8.top-0.bottom-0.w-0\.5 {
    left: 23px !important;
  }

  .absolute.left-0.w-16.h-16 {
    width: 46px !important;
    height: 46px !important;
    border-radius: 16px !important;
  }

  .absolute.left-0.w-16.h-16 span {
    font-size: 1.4rem !important;
  }

  .bg-white.rounded-2xl.p-6.shadow-lg.hover\:shadow-xl.transition-shadow.duration-300 {
    padding: 18px !important;
    border-radius: 20px !important;
  }

  .bg-white.rounded-2xl.p-6.shadow-lg.hover\:shadow-xl.transition-shadow.duration-300 > div.flex.items-start.justify-between.mb-4 {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 10px !important;
  }

  .bg-white.rounded-2xl.p-6.shadow-lg.hover\:shadow-xl.transition-shadow.duration-300 h3.text-xl {
    font-size: 1.25rem !important;
    line-height: 1.25 !important;
  }

  /* cards and text blocks */
  .rounded-2xl.p-8,
  .rounded-2xl.p-6,
  .rounded-2xl.p-5 {
    padding: 18px !important;
  }

  .text-4xl.md\:text-5xl,
  .text-4xl.md\:text-5xl.font-bold,
  .text-4xl.md\:text-5xl.font-bold.text-gray-900,
  .text-3xl.md\:text-4xl {
    font-size: clamp(1.9rem, 7vw, 2.4rem) !important;
    line-height: 1.1 !important;
  }

  .text-xl {
    font-size: 1rem !important;
    line-height: 1.65 !important;
  }

  .grid.grid-cols-1.lg\:grid-cols-2.gap-12.items-center,
  .grid.grid-cols-1.md\:grid-cols-2.gap-12,
  .grid.grid-cols-1.md\:grid-cols-2.gap-8,
  .grid.grid-cols-2.md\:grid-cols-4.gap-8 {
    gap: 18px !important;
  }

  footer {
    overflow-x: hidden !important;
  }
}

@media (max-width: 640px) {
  header a.flex.items-center.gap-2.group > span {
    font-size: 0.92rem !important;
  }

  header .w-10.h-10 {
    width: 38px !important;
    height: 38px !important;
    border-radius: 12px !important;
  }

  header .w-6.h-6 {
    width: 22px !important;
    height: 22px !important;
  }

  .space-y-12 {
    gap: 32px !important;
  }

  .space-y-12 > .relative.pl-20 {
    padding-left: 56px !important;
  }

  .absolute.left-8.top-0.bottom-0.w-0\.5 {
    left: 19px !important;
  }

  .absolute.left-0.w-16.h-16 {
    width: 40px !important;
    height: 40px !important;
    border-radius: 14px !important;
  }

  .absolute.left-0.w-16.h-16 span {
    font-size: 1.15rem !important;
  }

  /* home map */
  .hm-home-globe {
    border-radius: 20px !important;
    padding: 8px !important;
  }

  .hm-map-stage {
    min-height: 210px !important;
  }

  .hm-globe-panel--bottom {
    padding: 1rem !important;
  }

  .hm-globe-panel h4 {
    font-size: 1.3rem !important;
  }
}

@media (max-width: 430px) {
  header a.flex.items-center.gap-2.group > span {
    font-size: 0.86rem !important;
  }

  header .fixed.top-20.right-0.bottom-0.w-80 {
    width: 100vw !important;
    max-width: 100vw !important;
    border-radius: 0 !important;
  }

  main > section:first-of-type h1 {
    font-size: clamp(1.85rem, 9vw, 2.3rem) !important;
  }
}

/* final header multiline center fix */
.nav-links a,
nav a,
.navbar a {
  text-align: center !important;
  justify-content: center !important;
  align-items: center !important;
  line-height: 1.18 !important;
}

.nav-links a {
  font-size: 16px !important;
  font-weight: 700 !important;
  min-height: 52px !important;
  padding: 8px 10px !important;
  display: flex !important;
}

.nav-links li {
  display: flex !important;
  align-items: center !important;
}

.nav-links a br {
  display: block !important;
}

@media (max-width: 1200px) {
  .nav-links a {
    font-size: 15px !important;
    min-height: 48px !important;
  }
}

/* FINAL HEADER BIG + RIGHT */
.nav-links {
  margin-left: 40px !important;
}

.nav-links a {
  font-size: 18px !important;
  font-weight: 700 !important;
  letter-spacing: 0.4px;
}

@media (max-width: 1200px) {
  .nav-links a {
    font-size: 16px !important;
  }
}

/* MAX RIGHT + BIGGER HEADER */
.nav-links {
  margin-left: 80px !important;
}

.nav-links a {
  font-size: 20px !important;
  font-weight: 800 !important;
  letter-spacing: 0.5px;
}

@media (max-width: 1200px) {
  .nav-links {
    margin-left: 20px !important;
  }
  .nav-links a {
    font-size: 16px !important;
  }
}

/* PERFECT MATCH HEADER */
.nav-links {
  margin-left: 30px !important;
  gap: 18px !important;
}

.nav-links a {
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: 0.2px;
  padding: 6px 8px !important;
}

@media (max-width: 1200px) {
  .nav-links {
    margin-left: 10px !important;
  }
  .nav-links a {
    font-size: 13px !important;
  }
}

/* final logo + far right nav */
.header-shell {
  gap: 16px !important;
}

.brand-icon {
  overflow: hidden !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
}

.brand-logo {
  width: 74px !important;
  height: 74px !important;
  object-fit: contain !important;
  display: block !important;
}

.desktop-nav {
  justify-content: flex-end !important;
  margin-left: auto !important;
  gap: 10px !important;
  padding-right: 8px !important;
}

.desktop-nav a {
  font-size: 14px !important;
  font-weight: 700 !important;
  text-align: center !important;
  line-height: 1.12 !important;
}

.theme-button {
  margin-left: 0 !important;
  flex-shrink: 0 !important;
}

@media (max-width: 1200px) {
  .brand-logo {
    width: 62px !important;
    height: 62px !important;
  }

  .desktop-nav {
    gap: 8px !important;
    padding-right: 4px !important;
  }

  .desktop-nav a {
    font-size: 13px !important;
  }
}

/* LOGO FULL AREA FIX */
.brand-icon {
  width: 90px !important;
  height: 90px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: linear-gradient(135deg,#2dd4bf,#22c55e) !important;
  border-radius: 20px !important;
}

.brand-logo {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: 20px !important;
}

/* HUGE LOGO FIX */
.brand-icon {
  width: 140px !important;
  height: 140px !important;
  border-radius: 24px !important;
}

.brand-logo {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
}

/* reduce blur / improve clarity */
.brand-logo {
  image-rendering: auto;
}

/* header alignment fix */
.header-shell {
  align-items: center !important;
}

/* CLEAN LOGO ONLY */
.brand-icon {
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
}

.brand-logo {
  width: 180px !important;
  height: auto !important;
  object-fit: contain !important;
}

/* Generated logo integration */
.brand-icon{
  background: transparent !important;
  box-shadow:none !important;
  padding:0 !important;
}
.brand-logo{
  width:200px !important;
  height:auto !important;
  object-fit:contain !important;
}