/* Patron Mobile — responsive layers (320–1440+) */

/* ── Appbar: mobilde “Patron Mobil” tam metin; ellipsis yok (<62rem) ── */
@media (max-width: 61.99rem) {
  .site-header__inner {
    gap: var(--space-2);
  }

  .site-header__inner .logo {
    flex-shrink: 0;
    min-width: 0;
    overflow: visible;
    gap: var(--space-2);
  }

  /* İkonu biraz küçült — yatayda metin için yer aç */
  .site-header__inner .logo__img {
    height: clamp(2rem, 5vw, var(--logo-height));
    max-width: min(2.5rem, 16vw);
  }

  .site-header__inner .logo__text {
    overflow: visible;
    text-overflow: clip;
    white-space: nowrap;
    font-size: clamp(0.8125rem, 3.25vw, var(--fs-lg));
    letter-spacing: -0.035em;
  }
}

/* Çok dar telefon: sağ kümeden biraz yer kazan */
@media (max-width: 22.5rem) {
  .site-header__inner {
    gap: 0.375rem;
  }

  .header-tools {
    gap: 0.25rem;
  }

  .header-tools .lang-switcher__btn {
    min-width: 2.5rem;
    min-height: 2.5rem;
    padding: 0 0.35rem;
  }

  .header-tools .theme-toggle--mobile,
  .header-tools .nav-toggle {
    width: 2.5rem;
    height: 2.5rem;
    min-width: 2.5rem;
    min-height: 2.5rem;
  }
}

/* Footer marka: çok dar ekranda isim taşmasın */
@media (max-width: 22.5rem) {
  .footer-brand__name {
    white-space: normal;
  }
}

/* 320px — marka metni + appbar tek satırda sığsın */
@media (max-width: 20rem) {
  .site-header__inner .logo__img {
    height: 1.875rem;
    max-width: 1.875rem;
  }

  .site-header__inner .logo__text {
    font-size: 0.75rem;
    letter-spacing: -0.05em;
  }

  .header-tools .lang-switcher__btn {
    min-width: 2.5rem;
    min-height: 2.5rem;
    padding: 0 0.3rem;
    font-size: 0.625rem;
  }

  .header-tools .theme-toggle--mobile,
  .header-tools .nav-toggle {
    width: 2.5rem;
    height: 2.5rem;
    min-width: 2.5rem;
    min-height: 2.5rem;
  }
}

/* ── Hero device scene — stack on narrow viewports ── */
@media (max-width: 63.99rem) {
  .hero-scene {
    min-height: 0;
    padding-bottom: var(--space-2);
  }

  .hero-scene__glow {
    inset: 5% 0 auto 0;
  }

  .hero-scene__desktop {
    transform: none;
    width: min(100%, 32rem);
    animation: none;
  }

  .hero-scene:hover .hero-scene__desktop {
    transform: none;
  }

  .hero-scene__glow {
    animation: none;
  }

  .hero-scene__phones {
    position: relative;
    inset: auto;
    padding-top: var(--space-8);
    padding-inline: 0;
    justify-content: center;
    flex-wrap: wrap;
    gap: var(--space-5);
  }

  .device-phone--tilt-left,
  .device-phone--tilt-right {
    transform: none;
    animation: none;
  }

  .device-phone--hero {
    width: min(10rem, 38vw);
  }
}

/* ── 320px — small phones ── */
@media (min-width: 20rem) {
  :root {
    --container-pad: 1rem;
  }
}

/* ── 360px ── */
@media (min-width: 22.5rem) {
  :root {
    --container-pad: 1.125rem;
  }
}

/* ── 375px ── */
@media (min-width: 23.4375rem) {
  :root {
    --container-pad: 1.25rem;
  }

  .hero__title {
    font-size: clamp(2rem, 6vw, var(--fs-6xl));
  }
}

/* ── 390px ── */
@media (min-width: 24.375rem) {
  :root {
    --container-pad: 1.25rem;
  }
}

/* ── 414px ── */
@media (min-width: 25.875rem) {
  :root {
    --container-pad: 1.25rem;
  }

  .module-grid {
    gap: var(--space-5);
  }
}

/* ── 600px — large phones / small tablets ── */
@media (min-width: 37.5rem) {
  .module-grid {
    grid-template-columns: repeat(2, 1fr);
  }

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

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

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

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

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

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

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

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

  .neden-compare__row {
    grid-template-columns: 1fr 1fr;
  }

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

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

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

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

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

  .refs-trust-grid {
    grid-template-columns: repeat(3, 1fr);
  }

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

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

/* ── 768px — tablet ── */
@media (min-width: 48rem) {
  :root {
    --container-pad: 1.5rem;
    --header-height: 4.75rem;
    --logo-height: 3rem;
  }

  .section {
    padding-block: var(--space-28);
  }

  .section--tight {
    padding-block: var(--space-24);
  }

  .trust-strip__grid {
    grid-template-columns: repeat(4, 1fr);
    gap: var(--space-4);
  }

  .faq-popular__grid {
    grid-template-columns: repeat(3, 1fr);
  }

  .faq-trust-band__grid {
    gap: var(--space-6) var(--space-12);
  }

  .faq-category {
    padding-block: var(--space-12) var(--space-16);
  }

  .value-grid {
    grid-template-columns: repeat(3, 1fr);
  }

  .pricing-grid {
    grid-template-columns: repeat(3, 1fr);
    align-items: stretch;
  }

  .pricing-card--featured {
    z-index: 1;
    box-shadow: var(--shadow-glow-lg);
    transform: scale(1.03);
  }

  .pricing-card--featured:hover {
    transform: scale(1.03) translateY(-3px);
  }

  .showcase-slide {
    grid-template-columns: 2fr 3fr;
    padding: var(--space-10) var(--space-8);
    align-items: start;
  }

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

  .footer-bottom {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
  }

  .testimonial-grid .testimonial-card:last-child {
    grid-column: 1 / -1;
    max-width: 36rem;
    margin-inline: auto;
  }

  .demo-grid {
    grid-template-columns: 5fr 7fr;
    gap: var(--space-12);
    align-items: start;
  }

  .demo-sidebar {
    order: 0;
  }

  .demo-form-wrap {
    order: 0;
  }

  .form-row--2col {
    grid-template-columns: 1fr 1fr;
  }
}

/* ── 1024px — desktop içerik gridleri (header 1280’e kadar mobil menü) ── */
@media (min-width: 64rem) {
  :root {
    --header-height: 5rem;
    --logo-height: 3.25rem;
  }

  .hero {
    padding-block: var(--space-16) var(--space-20);
  }

  .hero__grid {
    grid-template-columns: 1fr 1fr;
    gap: var(--space-16);
  }

  .module-grid {
    grid-template-columns: repeat(3, 1fr);
  }

  .sector-grid {
    grid-template-columns: repeat(3, 1fr);
  }

  .testimonial-grid {
    grid-template-columns: repeat(3, 1fr);
  }

  .testimonial-grid .testimonial-card:last-child {
    grid-column: auto;
    max-width: none;
    margin-inline: 0;
  }

  .demo-grid {
    grid-template-columns: 5fr 7fr;
    gap: var(--space-16);
  }

  .section {
    padding-block: var(--space-32);
  }

  .section--tight {
    padding-block: var(--space-24);
  }

  .refs-quote-grid {
    grid-template-columns: repeat(3, 1fr);
  }

  .refs-quote-card--featured {
    grid-row: span 1;
  }

  .refs-sector-grid {
    grid-template-columns: repeat(3, 1fr);
  }

  .refs-role-grid {
    grid-template-columns: repeat(4, 1fr);
  }

  .refs-outcome-grid {
    grid-template-columns: repeat(3, 1fr);
  }

  .refs-trust-grid {
    grid-template-columns: repeat(6, 1fr);
  }

  .neden-reasons {
    grid-template-columns: repeat(3, 1fr);
  }

  .neden-arch {
    grid-template-columns: repeat(4, 1fr);
  }

  .neden-icp {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* ── 992px+ — masaüstü nav + aksiyonlar ── */
@media (min-width: 62rem) {
  :root {
    --container-pad: 1.5rem;
    --logo-height: 2.75rem;
  }

  .nav-desktop {
    display: flex;
  }

  .header-actions {
    display: inline-flex;
  }

  .header-actions .theme-toggle {
    display: flex;
  }

  .header-actions .lang-switcher {
    display: flex;
  }

  .theme-toggle--mobile {
    display: none;
  }

  .header-tools {
    display: none;
  }

  .nav-toggle {
    display: none;
  }

  .module-grid {
    grid-template-columns: repeat(4, 1fr);
  }

  .hero__title {
    font-size: var(--fs-6xl);
  }
}

/* ── 1100px+ — nav link aralıkları genişlet ── */
@media (min-width: 68.75rem) {
  .nav-desktop {
    gap: clamp(1rem, 1.5vw, 2rem);
  }

  .nav-desktop a,
  .nav-desktop .nav-dropdown__trigger {
    padding: var(--space-2) var(--space-3);
  }

  .header-actions {
    gap: var(--space-4);
  }
}

/* ── 1280px+ — tam genişlik appbar ── */
@media (min-width: 80rem) {
  :root {
    --container-pad: 2rem;
    --logo-height: 3rem;
  }
}

/* ── 1440px+ ── */
@media (min-width: 90rem) {
  :root {
    --container-pad: 2.5rem;
  }

  .container,
  .site-header__inner {
    max-width: 82rem;
  }

  .nav-desktop a,
  .nav-desktop .nav-dropdown__trigger {
    padding: var(--space-2) var(--space-4);
  }

  .hero {
    padding-block: var(--space-20) var(--space-24);
  }

  .section {
    padding-block: var(--space-36);
  }
}

/* Visual upgrade — küçük ekranlar */
@media (max-width: 47.99rem) {
  .product-flow {
    grid-template-columns: 1fr;
  }

  .product-flow__step:not(:last-child)::after {
    display: none !important;
  }

  .related-modules {
    grid-template-columns: 1fr;
  }

  .page-hero--split .page-hero__visual {
    order: -1;
    min-height: 10rem;
  }

  .nav-dropdown__panel--mega {
    min-width: min(22rem, 94vw);
  }

  .vitrine__panel.is-active {
    grid-template-columns: 1fr;
  }

  .vitrine__tabs {
    overflow-x: auto;
    flex-wrap: nowrap;
    -webkit-overflow-scrolling: touch;
  }

  .bizfit-result {
    grid-template-columns: 1fr;
    gap: var(--space-5);
  }

  .bizfit-result__cta {
    flex-direction: row;
    flex-wrap: wrap;
  }

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

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

  .demo-steps {
    grid-template-columns: 1fr 1fr;
  }

  .conversion-bar__inner {
    justify-content: flex-start;
    padding: 0 var(--space-4);
  }

  .home-cases-summary__grid {
    grid-template-columns: 1fr;
  }
}