/* MEDSAM unified responsive layer — desktop design preserved, mobile reflows */
html{box-sizing:border-box;-webkit-text-size-adjust:100%}
*,*::before,*::after{box-sizing:inherit}
body{max-width:100%;overflow-x:hidden}
img,video,canvas,svg{max-width:100%;height:auto}
iframe{max-width:100%}
input,select,textarea,button{font:inherit}
table{max-width:100%}

@media (max-width: 1024px){
  .wrap,.container,.content,.page,.main,.shell{
    max-width:100%!important;
  }
  .hero-in,.hero-grid,.two-col,.two-column{
    min-width:0!important;
  }
}

@media (max-width: 768px){
  body{min-width:0!important}
  .wrap,.container,.content,.page,.main,.shell{
    width:100%!important;
    max-width:100%!important;
    padding-left:16px!important;
    padding-right:16px!important;
  }

  /* Desktop cards/grids become natural mobile stacks. */
  .svc-grid,.service-grid,.services-grid,.cards,.card-grid,.grid,
  .process-grid,.feature-grid,.stats-grid,.footer-grid,.foot-grid{
    grid-template-columns:1fr!important;
    min-width:0!important;
  }

  .hero-in,.hero-grid,.two-col,.two-column{
    grid-template-columns:1fr!important;
    min-height:auto!important;
    gap:20px!important;
  }

  .row,.toolbar,.actions,.cta,.button-row,.filters{
    max-width:100%!important;
  }

  h1{font-size:clamp(26px,7.2vw,36px);line-height:1.16}
  h2{font-size:clamp(20px,5.6vw,28px);line-height:1.22}
  h3{line-height:1.25}
  p,li,a,span,strong{overflow-wrap:anywhere}

  input:not([type="checkbox"]):not([type="radio"]),
  select,textarea{
    width:100%;
    max-width:100%;
  }

  table{
    display:block;
    width:100%!important;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
  }

  .top,.header-in,.nav,.navbar,.topnav{
    max-width:100%!important;
  }

  /* Preserve ECG animation but keep the text block stable. */
  .hero h1,.hero-content h1,.hero-copy h1,.hero-text h1{
    max-width:100%!important;
    margin-left:0!important;
    margin-right:0!important;
    translate:none!important;
  }
  .hero,.hero-content,.hero-copy,.hero-text,.hero-in{
    min-width:0!important;
    max-width:100%!important;
  }

  .kicker,.hero .kicker{
    max-width:100%!important;
  }
  .kicker-ecg{
    flex:0 1 72px!important;
    width:min(72px,20vw)!important;
  }

  /* Fixed-position helpers stay inside phone viewport. */
  .floating,.fab,.whatsapp-float,.floating-whatsapp{
    max-width:calc(100vw - 24px)!important;
  }
}

@media (max-width: 480px){
  .wrap,.container,.content,.page,.main,.shell{
    padding-left:14px!important;
    padding-right:14px!important;
  }
  .btn,.button,.cta a,.cta button{
    max-width:100%;
  }
  .hero .kicker{
    gap:6px!important;
  }
  .kicker-ecg{
    width:56px!important;
    flex-basis:56px!important;
  }
}


/* MEDSAM MOBILE CARD CENTER — 2026-08-17
   Mobilde kamuya açık kartları tek kurumsal eksende tutar. */
@media (max-width:768px){
  .card,.box,.svc,.service-card,.feature-card,.process-card,.contact-card,
  .pricing-card,.job-card,.review-card,.portal-card,.info-card,.stat-card,
  .quick-card,.member-card,.tracking-card{
    width:100%!important;
    max-width:100%!important;
    margin-left:auto!important;
    margin-right:auto!important;
    transform:none!important;
    left:auto!important;
    right:auto!important;
    box-sizing:border-box!important;
  }

  .card>img,.box>img,.svc>img,.service-card>img,.feature-card>img,
  .portal-card>img,.member-card>img{
    display:block!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }

  .card .actions,.box .actions,.svc .actions,.service-card .actions,
  .feature-card .actions,.portal-card .actions,.member-card .actions{
    width:100%!important;
    justify-content:center!important;
    align-items:stretch!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }

  .card .btn,.box .btn,.svc .btn,.service-card .btn,.feature-card .btn,
  .portal-card .btn,.member-card .btn{
    margin-left:auto!important;
    margin-right:auto!important;
  }
}