/* =========================================================================
   Mobilní a tabletová verze – načítá se jako POSLEDNÍ na všech stránkách,
   proto může přepsat rozvržení z ostatních souborů.
   ≤ 1100 px tablet na šířku · ≤ 900 px tablet · ≤ 600 px telefon
   ========================================================================= */

/* nic nesmí být širší než obrazovka
   (overflow-x: clip místo hidden – hidden by rozbilo přilepenou hlavičku) */
html,body{max-width:100%;overflow-x:clip}
@supports not (overflow:clip){body{overflow-x:hidden}}
img,svg,video{max-width:100%}

@media (max-width:1100px){
  .ftr .g{grid-template-columns:1fr 1fr 1fr}
  .ftr .g>:first-child{grid-column:1/-1}
  .feat,.firms,.flist,.news,.others,.kp{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mods,.steps,.four,.ben,.prt{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ben .bc:nth-child(5){grid-column:1/-1}
}

@media (max-width:900px){
  /* společné bloky */
  .stats{grid-template-columns:1fr;gap:12px}
  .svc,.form,.lic,.g5i,.q2,.calc,.plan,.ct{grid-template-columns:1fr}
  .form .full{grid-column:auto}
  .facts{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  .h2{font-size:clamp(28px,7vw,40px)}
  .lead{font-size:16px}
  /* horní pruh s novinkou: menší a bez druhého odkazu */
  .ann .w{font-size:12.5px;line-height:1.35;padding-top:8px;padding-bottom:8px}
  /* podmenu stránek produktů se dá posouvat do strany */
  .sub .w{overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .sub .w::-webkit-scrollbar{display:none}
  .sub a{flex-shrink:0}
  .sub .btn{display:none}
  /* plánovač (STARLIT web) a portfolio (G5) */
  .pcard{padding:18px;min-width:0}
  .pcard-h{flex-wrap:wrap}
  .task{grid-template-columns:48px 1fr;row-gap:6px}
  .task>:last-child{grid-column:2}
  .tg{justify-content:flex-start}
  .port{min-width:0}
  .port .r{flex-wrap:wrap}
  /* izometrické scény nesmí přetékat */
  .scene,.city{max-width:100%;min-width:0}
  .iso{width:100%;height:auto}
}

@media (max-width:600px){
  .w{padding:0 16px}
  .sec{padding:56px 0}
  h1{font-size:clamp(34px,10vw,46px)!important;line-height:1.08}
  .feat,.firms,.flist,.news,.others,.kp,.mods,.steps,.four,.ben,.prt,.five{grid-template-columns:1fr}
  .facts{grid-template-columns:1fr 1fr}
  .facts>:last-child{grid-column:1/-1}
  .ftr{padding:48px 0 24px}
  .ftr .g{grid-template-columns:1fr 1fr;gap:24px}
  .ftr .bt{flex-direction:column}
  /* tlačítka v úvodu přes celou šířku */
  .phero .btn,.hero .btn.g,.hero .btn.o{width:100%;justify-content:center}
  .btn{white-space:normal;text-align:center}
  /* formuláře: větší pole kvůli prstům, bez přiblížení iOS (min. 16 px) */
  .form input,.form select,.form textarea{font-size:16px}
  .chips{gap:6px}
  /* hlavička: jen logo, režim, vlajky, menu */
  .hd .w{gap:8px}
  .logo svg{width:132px}
  .nt{width:38px;height:38px}
  /* plovoucí štítky a bubliny v úvodní scéně menší */
  .bub{max-width:200px;font-size:12.5px}
  .xcard{width:220px}
  .season-tag{display:none!important}
}

/* ceník INTEGRI G5: tabulka a město v kartě se musí vejít */
@media (max-width:900px){
  .calc>*{min-width:0}
  .cc,.city{min-width:0;max-width:100%}
  .ptab{width:100%;table-layout:fixed}
  .ptab td{word-break:break-word}
}

/* product.css se načítá po home.css, proto tyto věci opakujeme tady */
@media (max-width:900px){
  .phero .w,.pa-hero,.pa-g{grid-template-columns:1fr}
  .phero .scene{max-width:520px;margin:0 auto;width:100%}
  .city{min-height:380px}
  .city .ptag{top:auto;bottom:16px;right:16px;font-size:17px}
}
@media (max-width:600px){
  .city{min-height:300px}
  .phero .facts{margin-top:24px}
}

/* mobilní menu: začíná přesně pod hlavičkou (výšku dopočítá js/nav.js) a dá se v něm posouvat */
@media (max-width:1180px){
  .mob{top:var(--mob-top,70px)!important;bottom:0;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
}
@media (max-width:900px){ .sub{top:70px} }   /* podmenu hned pod nižší mobilní hlavičkou */
/* obsah mobilního menu: nadpisy skupin, položky se nesmršťují, hotline zeleně */
.mob a{flex-shrink:0}
.mob .mob-h{margin:12px 4px 2px;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.mob .mob-call{background:var(--green);color:#fff;display:grid;grid-template-columns:auto 1fr;column-gap:10px;row-gap:2px;align-items:center}
.mob .mob-call .ic-tel{grid-row:1 / span 2;width:22px;height:22px;margin:0}
.mob .mob-call small{grid-column:2;font-size:12.5px;font-weight:500;opacity:.9}

/* velmi úzké telefony (iPhone SE apod.) */
@media (max-width:600px){
  .ct>*,.form>*,.calc>*,.ssb-cfg>*{min-width:0}
  .form input:not([type="checkbox"]):not([type="radio"]),.form select,.form textarea{width:100%;min-width:0}
  #g5Tot,#swTot{font-size:clamp(26px,9vw,40px)}
}
@media (max-width:360px){
  .logo svg{width:112px}
  .hd .w{gap:6px}
  .lng button{padding:4px 5px}
  .nt,.burger{width:36px!important;height:36px!important}
}

/* telefon: přepínač jazyka se přesune z hlavičky do mobilního menu (v hlavičce je i zvonek) */
.mob .mob-lng{display:none}
@media (max-width:600px){
  .hd .w>.lng{display:none}
  .mob .mob-lng{display:flex;align-self:flex-start}
  .ak-form input,.ak-form select,.ak-form textarea,#skOrder input,#skOrder textarea,.sk-opt select,.rc-txt textarea{font-size:16px}
}
