/* FAS Mobile Optimizations – Mobile-only (≤600px). Desktop bleibt unverändert. */
@media (max-width:600px){

  /* Typografie & Lesbarkeit */
  html, body{ max-width:100%; overflow-x:hidden }
  body{ font-size:16px; line-height:1.6; -webkit-text-size-adjust:100% }
  :focus-visible{ outline:3px solid #0d3b66; outline-offset:2px }

  /* Container & Abstände */
  .container, .wrap, .site-inner, main, section, .section, .content, .entry-content, .wp-block-group{
    padding-left:16px; padding-right:16px; max-width:100%; overflow-x:hidden
  }
  section, .section{ padding-top:28px; padding-bottom:28px }
  .entry-content > * + *{ margin-top:14px }

  /* Spalten/Grids zu einer Spalte stapeln */
  :where(.row, .columns, .cols, .grid, .wp-block-columns){ display:block !important }
  :where(.row, .columns, .cols, .grid, .wp-block-columns) > *{
    width:100% !important; max-width:100% !important; margin-left:0 !important;
  }
  :where(.wp-block-column){ flex-basis:100% !important }

  /* Medien & Hero */
  img, video, svg, iframe{ max-width:100% !important; height:auto !important }
  .hero{ min-height:50vh; text-align:center; padding:36px 0; background-attachment:scroll !important }
  .hero .container{ padding-left:16px; padding-right:16px }

  /* Navigation & Buttons (Tap-freundlich) */
  nav a, .menu a, .btn, .button, button, .wp-block-button__link{
    display:inline-block; padding:12px 16px; min-height:44px; line-height:1; border-radius:10px
  }
  .menu-toggle, .navbar-toggle, .hamburger{ padding:10px 12px; min-height:44px }

  /* Tabellen: horizontal scrollen statt Layoutbruch */
  table{ display:block; width:100%; overflow:auto; -webkit-overflow-scrolling:touch }
  table thead{ white-space:nowrap }

  /* Formulare */
  input, select, textarea{ font-size:16px; min-height:44px; padding:10px 12px }
  label{ display:block; margin-bottom:6px }

  /* Logos: Header wie Footer, zentriert optional via Eltern-Layout */
  header img, .site-header img{ transform:none !important; max-height:unset !important }
  footer img, .site-footer img{ transform:none !important; max-height:unset !important }

  /* Floating Call Button – links unten, nur mobil sichtbar */
  .fas-floating-call{
    position:fixed; left:16px; bottom:calc(16px + env(safe-area-inset-bottom));
    display:inline-flex; align-items:center; gap:8px;
    padding:12px 16px; border-radius:999px;
    background:#0d3b66; color:#fff; text-decoration:none;
    box-shadow:0 8px 20px rgba(13,59,102,.25); z-index:99999; font-weight:600
  }
  .fas-floating-call .icon{ font-style:normal }
}

/* ===== Mobile clarity & no-side-scroll pass ===== */
@media (max-width:600px){

  /* A. Header logo half size (footer unverändert) */
  header img, .site-header img{
    transform: scale(0.5) !important;
    transform-origin: left center !important;
    height: auto !important;
    max-width: none !important;
  }

  /* B. Prevent horizontal overflow from common culprits */
  html, body{ width:100%; max-width:100%; overflow-x:hidden !important }

  /* Reset negative grid margins (e.g., Bootstrap rows) */
  .row{ margin-left:0 !important; margin-right:0 !important }
  .container, .container-fluid, .wrap, .site-inner, main, section, .section, .content, .entry-content, .wp-block-group{
    max-width:100% !important; width:100% !important; overflow-x:hidden !important;
    padding-left:16px; padding-right:16px;
  }
  /* Force columns to stack */
  [class*="col-"], .column, .columns, .wp-block-column{
    width:100% !important; max-width:100% !important; float:none !important; display:block !important;
  }

  /* Media should never exceed viewport */
  img, video, svg, iframe, embed, object{
    display:block; max-width:100% !important; width:100% !important; height:auto !important;
  }

  /* Tables & code blocks should scroll within viewport instead of breaking it */
  table{ display:block; width:100% !important; max-width:100% !important; overflow:auto; -webkit-overflow-scrolling:touch }
  pre, code, .wp-block-code{ white-space:pre-wrap; overflow-wrap:anywhere; word-break:break-word }

  /* Long words/URLs won't cause overflow */
  p, li, h1, h2, h3, h4, h5, h6, a, span{
    overflow-wrap:anywhere; word-break:break-word;
  }

  /* Sliders/carousels: contain tracks */
  .slick-list, .swiper-wrapper, .carousel-inner{ overflow:hidden }
  .slick-track{ display:flex }

  /* Make sure sticky headers/footers don't push width */
  header, .site-header, footer, .site-footer{ max-width:100vw !important }
}

/* === iOS & mobile hardening (added by optimizer) === */
html{box-sizing:border-box;-webkit-text-size-adjust:100%;height:-webkit-fill-available}
*,*::before,*::after{box-sizing:inherit}
/* Prevent horizontal scroll from rogue elements */
html,body{max-width:100%;overflow-x:hidden}
img,video,canvas,svg,iframe{max-width:100%;height:auto}
/* Fix common WordPress row/column overflows */
[class*="container"], .wp-block-group, .wp-block-columns{overflow-x:clip}
.wp-block-columns{margin-left:0!important;margin-right:0!important}
/* Logo sizing: prevent clipping on small headers */
.site-logo img,
.custom-logo,
.header .logo img{display:block;max-height:52px;height:auto;width:auto;object-fit:contain}
/* Buttons & inputs: avoid double-tap zoom on iOS */
input,select,textarea,button{font-size:16px}
/* Safe-area for fixed elements */
.has-fixed-bottom, .fixed-bottom, .mobile-bar{padding-bottom:env(safe-area-inset-bottom)}
.has-fixed-top, .fixed-top, header.site-header{padding-top:env(safe-area-inset-top)}
/* 100vh issue on mobile Safari */
:root{--app-vh:100svh}
.use-app-vh{min-height:var(--app-vh)}
/* Utility to clamp oversized widths */
.u-no-sidescroll{overflow-x:hidden}
.u-contain{max-width:100%;contain:content}
/* Media query for small screens */
@media (max-width: 600px){
  .hero{background-size:cover;background-position:center}
  .site-header .menu{gap:.5rem}
}
