/*
  BYonetim home mobile hardening
  Keeps the desktop composition intact while preventing overflow and cramped UI on phones.
*/

@media (max-width: 900px) {
  html,
  body.page-home {
    width: 100%;
    max-width: 100%;
    overflow-x: clip;
  }

  body.page-home *,
  body.page-home *::before,
  body.page-home *::after {
    min-width: 0;
  }

  body.page-home img,
  body.page-home video,
  body.page-home svg,
  body.page-home canvas {
    max-width: 100%;
  }

  body.page-home .header {
    width: 100%;
  }

  body.page-home .header-inner {
    min-height: 64px;
    padding-inline: max(14px, env(safe-area-inset-left)) max(14px, env(safe-area-inset-right));
  }

  body.page-home .logo-img {
    max-width: min(168px, 44vw);
    height: auto;
  }

  body.page-home main,
  body.page-home section {
    max-width: 100%;
  }

  body.page-home .page-home-hero-accordion-section,
  body.page-home .f7-section,
  body.page-home .anasayfa-intro,
  body.page-home .raporlar-showcase,
  body.page-home .firma-showcase,
  body.page-home .bina-showcase,
  body.page-home .reviews,
  body.page-home .faq-section {
    overflow-x: clip;
  }

  body.page-home .hero-accordion-wrap,
  body.page-home .f7-inner,
  body.page-home .raporlar-showcase__inner,
  body.page-home .firma-showcase__inner,
  body.page-home .bina-showcase__inner {
    width: 100%;
    max-width: 100%;
  }

  body.page-home .hero-accordion-title,
  body.page-home .yetenekler-section-title,
  body.page-home .anasayfa-intro__title,
  body.page-home .raporlar-showcase__title,
  body.page-home .firma-showcase__title,
  body.page-home .bina-showcase__title,
  body.page-home .reviews-title,
  body.page-home .faq-title {
    text-wrap: balance;
  }

  body.page-home .hero-accordion-desc,
  body.page-home .yetenekler-section-sub,
  body.page-home .anasayfa-intro__lead,
  body.page-home .raporlar-showcase__lead,
  body.page-home .firma-showcase__lead,
  body.page-home .bina-showcase__lead,
  body.page-home .reviews-subtitle--efferd {
    text-wrap: pretty;
    overflow-wrap: anywhere;
  }

  body.page-home .hero-accordion-actions,
  body.page-home .hero-accordion-proof,
  body.page-home .raporlar-showcase__chips,
  body.page-home .firma-showcase__chips,
  body.page-home .bina-showcase__chips {
    max-width: 100%;
  }

  body.page-home .hero-mockup-toast {
    max-width: 100%;
  }

  body.page-home .hero-bento-slider,
  body.page-home .hero-bento,
  body.page-home .hero-bento-card,
  body.page-home .hero-bento-mockup,
  body.page-home .hero-bento-info {
    width: 100%;
    max-width: 100%;
  }

  body.page-home .byo-cards-grid,
  body.page-home .demo-section,
  body.page-home .demo-cards,
  body.page-home .yetenekler-21st-card,
  body.page-home .yetenekler-21st-media,
  body.page-home .demo-card__media {
    max-width: 100%;
  }

  body.page-home .yetenekler-21st-card {
    position: relative;
    top: auto;
  }

  body.page-home .support-cta-band__shell {
    flex-direction: column;
  }

  body.page-home .support-cta-band__left,
  body.page-home .support-cta-band__copy {
    min-width: 0;
    width: 100%;
    max-width: 100%;
    margin-inline: 0;
  }
}

@media (max-width: 640px) {
  body.page-home {
    font-size: 15px;
  }

  body.page-home .page-home-hero-accordion-section {
    padding: 18px 14px 22px;
  }

  body.page-home .hero-accordion-title {
    font-size: clamp(1.86rem, 8vw, 2.45rem);
    line-height: 1.08;
    letter-spacing: -0.045em;
  }

  body.page-home .hero-accordion-desc {
    font-size: 0.98rem;
    line-height: 1.68;
  }

  body.page-home .hero-accordion-actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    width: 100%;
  }

  body.page-home .hero-accordion-cta,
  body.page-home .hero-accordion-cta-ghost {
    width: 100%;
    min-height: 48px;
    justify-content: center;
  }

  body.page-home .hero-accordion-mockup-wrap {
    border-radius: 18px;
    padding: 8px;
  }

  body.page-home .hero-mockup-toasts {
    width: min(210px, 68%);
    right: 10px;
  }

  body.page-home .hero-mockup-toast__desc {
    display: none;
  }

  body.page-home .hero-bento {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  body.page-home .hero-bento-card {
    min-height: 0;
    border-radius: 18px;
  }

  body.page-home .f7-section {
    padding-block: 2rem 2.8rem;
  }

  body.page-home .f7-visual {
    margin-inline: 0;
    padding: 8px;
    border-radius: 18px;
  }

  body.page-home .f7-skew {
    transform: none;
  }

  body.page-home .f7-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  body.page-home .f7-card {
    padding: 14px;
    border: 1px solid rgba(148, 163, 184, 0.22);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.72);
  }

  body.page-home .yetenekler-section-header {
    padding-inline: 14px;
  }

  body.page-home .yetenekler-section-title,
  body.page-home .anasayfa-intro__title,
  body.page-home .raporlar-showcase__title,
  body.page-home .firma-showcase__title,
  body.page-home .bina-showcase__title {
    font-size: clamp(1.72rem, 7vw, 2.22rem);
    line-height: 1.12;
  }

  body.page-home .yetenekler-21st-card {
    border-radius: 22px;
  }

  body.page-home #urun-ozellik-akisi .byo-cards-grid .yetenekler-21st-card--amber.demo-card {
    height: 304px !important;
    min-height: 304px !important;
    max-height: 304px !important;
  }

  body.page-home .yetenekler-21st-copy,
  body.page-home .demo-card__body {
    padding-inline: 18px;
  }

  body.page-home .yetenekler-21st-media,
  body.page-home .demo-card__media {
    overflow: clip;
  }

  body.page-home #urun-ozellik-akisi .byo-cards-grid .yetenekler-21st-card--amber .demo-card__media {
    align-items: flex-start !important;
    justify-content: center !important;
  }

  body.page-home #urun-ozellik-akisi .byo-cards-grid .yetenekler-21st-card--amber #alacak-yonetimi .comm-inner {
    width: 100% !important;
    max-width: 100% !important;
    transform: none !important;
  }

  body.page-home #urun-ozellik-akisi .byo-cards-grid .yetenekler-21st-card--amber #alacak-yonetimi .alacak-intro-grid {
    width: 100% !important;
    max-width: 100% !important;
    justify-items: center;
  }

  body.page-home #urun-ozellik-akisi .byo-cards-grid .yetenekler-21st-card--amber #alacak-yonetimi .alacak-intro-mockup-wrap {
    position: relative;
    left: auto;
    width: calc((100vw - 102px) / 0.47);
    max-width: 613px;
    zoom: 0.47;
    transform: scaleY(0.805) !important;
    transform-origin: top center !important;
  }

  body.page-home #urun-ozellik-akisi .byo-cards-grid .yetenekler-21st-card--amber #alacak-yonetimi .alacak-intro-browser {
    width: 100%;
    max-width: 100%;
  }

  body.page-home .raporlar-showcase,
  body.page-home .firma-showcase,
  body.page-home .bina-showcase {
    padding-inline: 14px;
    padding-block: 3rem;
  }

  body.page-home .raporlar-showcase__stage,
  body.page-home .firma-showcase__stage,
  body.page-home .bina-showcase__stage {
    width: 100%;
    max-width: 100%;
    border-radius: 22px;
    overflow: clip;
  }

  body.page-home .raporlar-showcase__chips,
  body.page-home .firma-showcase__chips,
  body.page-home .bina-showcase__chips {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    width: 100%;
  }

  body.page-home .raporlar-showcase__chips li,
  body.page-home .firma-showcase__chips li,
  body.page-home .bina-showcase__chips li {
    justify-content: center;
    min-height: 42px;
    padding: 0.52rem 0.7rem;
    text-align: center;
  }

  body.page-home .reviews {
    padding-inline: 14px;
  }

  body.page-home .reviews--efferd-columns .reviews-3d-stage {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.page-home .reviews--efferd-columns .reviews-3d-stage > .reviews-3d-col ~ .reviews-3d-col {
    display: none !important;
  }

  body.page-home .reviews-3d-col,
  body.page-home .reviews-3d-wrap .review-card {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  body.page-home .faq-section {
    padding-inline: 14px;
  }

  body.page-home .faq-question {
    gap: 12px;
    min-height: 50px;
  }
}

@media (max-width: 540px) {
  body.page-home .raporlar-showcase__stage .rs-hub,
  body.page-home .firma-showcase__stage .fs-mockup,
  body.page-home .bina-showcase__stage .bk-mockup {
    width: 600px;
    max-width: none;
    zoom: 0.58;
  }

  @supports not (zoom: 1) {
    body.page-home .raporlar-showcase__stage .rs-hub,
    body.page-home .firma-showcase__stage .fs-mockup,
    body.page-home .bina-showcase__stage .bk-mockup {
      zoom: normal;
      transform: scale(0.58);
      transform-origin: top left;
    }
  }
}

@media (max-width: 380px) {
  body.page-home .raporlar-showcase__stage .rs-hub,
  body.page-home .firma-showcase__stage .fs-mockup,
  body.page-home .bina-showcase__stage .bk-mockup {
    zoom: 0.52;
  }

  @supports not (zoom: 1) {
    body.page-home .raporlar-showcase__stage .rs-hub,
    body.page-home .firma-showcase__stage .fs-mockup,
    body.page-home .bina-showcase__stage .bk-mockup {
      transform: scale(0.52);
    }
  }
}

@media (max-width: 420px) {
  body.page-home .hero-accordion-eyebrow {
    max-width: 100%;
    white-space: normal;
    text-align: center;
  }

  body.page-home .hero-accordion-proof {
    align-items: center;
    text-align: center;
  }

  body.page-home .hero-accordion-avatars img {
    width: 34px;
    height: 34px;
  }

  body.page-home .raporlar-showcase__chips,
  body.page-home .firma-showcase__chips,
  body.page-home .bina-showcase__chips {
    grid-template-columns: 1fr;
  }
}

@media (hover: none) and (pointer: coarse) {
  body.page-home a,
  body.page-home button,
  body.page-home input,
  body.page-home textarea,
  body.page-home select {
    -webkit-tap-highlight-color: rgba(79, 110, 247, 0.16);
  }
}
