/* Učnov – responzivní vrstva pro celou šablonu (načítá se jako poslední).
   Pásma: telefon do 640 px, tablet na výšku 641–860 px, hlavička přechází na menu „hamburger“ do 760 px.
   Nad 860 px platí desktopové rozvržení z components.css. */

/* ===== hlavička: tlačítko menu (do 760 px) ===== */
.u-burger{display:none}
@media(max-width:760px){
  .u-top__in{flex-wrap:nowrap;gap:12px;padding:8px var(--pad)}
  .u-logo{font-size:22px}
  .u-logo img{width:36px}
  .u-burger{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:46px;height:46px;padding:0;border:2px solid var(--ink);border-radius:12px;background:#fff;color:var(--ink);cursor:pointer;box-shadow:3px 3px 0 var(--accent)}
  .u-burger:hover,.u-burger:focus{background:#fff;color:var(--ink)}
  .u-burger:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
  .u-burger span,.u-burger span::before,.u-burger span::after{display:block;width:20px;height:2.5px;border-radius:2px;background:currentColor;transition:transform .2s,opacity .2s}
  .u-burger span{position:relative}
  .u-burger span::before,.u-burger span::after{content:"";position:absolute;left:0}
  .u-burger span::before{top:-6.5px}.u-burger span::after{top:6.5px}
  .u-top.is-open .u-burger span{background:transparent}
  .u-top.is-open .u-burger span::before{top:0;transform:rotate(45deg)}
  .u-top.is-open .u-burger span::after{top:0;transform:rotate(-45deg)}
  /* bez JS zůstane menu pod logem jako běžný seznam */
  .u-nav{order:3;width:100%}
  .u-nav ul{flex-wrap:wrap;gap:4px 18px}
  .u-js .u-nav{display:none;position:absolute;left:0;right:0;top:100%;width:auto;order:0;background:#fff;border-bottom:1.5px solid var(--line);box-shadow:0 14px 24px rgba(27,43,75,.12);padding:6px var(--pad) 18px;max-height:calc(100vh - 70px);overflow-y:auto}
  .u-js .u-top.is-open .u-nav{display:block}
  .u-js .u-nav ul{flex-direction:column;align-items:stretch;gap:0}
  .u-js .u-nav li{border-bottom:1.5px solid var(--line)}
  .u-js .u-nav a{display:flex;align-items:center;min-height:50px;font-size:17px}
  .u-js .u-nav .u-cta{border-bottom:0;margin-top:14px}
  .u-js .u-nav .u-cta>a{justify-content:center;min-height:50px;font-size:17px;color:#fff}
}

/* ===== tablet na výšku (641–860 px): sloupce zůstávají vedle sebe ===== */
@media(min-width:641px) and (max-width:860px){
  /* sloupce se neskládají pod sebe; šířky ze šablony (30 %, 32 %, 55 %, 56 %) platí dál */
  .u-page .wp-block-columns{flex-wrap:nowrap;gap:clamp(20px,3.2vw,32px)}
  .u-page .wp-block-column{flex:1 1 0;flex-basis:0!important}
  .u-page .wp-block-column[style*="flex-basis:30%"]{flex:0 0 30%!important}
  .u-page .wp-block-column[style*="flex-basis:32%"]{flex:0 0 30%!important}
  .u-page .wp-block-column[style*="flex-basis:55%"]{flex:0 0 52%!important}
  .u-page .wp-block-column[style*="flex-basis:56%"]{flex:0 0 52%!important}
  .u-page .wp-block-column.u-auto,.u-page .wp-block-column.u-honza-mava{flex:0 0 auto!important}
  /* trojice karet (Co tím získáš, Rozcestí, kroky doučování) */
  .u-cards{gap:14px!important}
  .u-card{padding:20px 18px}
  .u-card p{font-size:15px}
  .u-page h3{font-size:19px}
  /* úvodní blok */
  .u-hero .wp-block-columns{align-items:flex-end}
  .u-hero:not(.u-hero--nabidka) h1{font-size:clamp(34px,5.2vw,44px)}
  .u-hero .realm-wrap{max-width:none}
  .realm__top{padding:20px 84px 20px 20px}
  .realm__top h3{font-size:21px}
  .realm__list li{padding:14px 18px}
  .realm__foot{padding:16px 18px 20px}
  .u-intro>img{height:150px}
  .u-intro>p{margin-bottom:34px!important}
  /* karta s ukázkou, lektor, FAQ, produkt */
  .u-box{padding:26px}
  .u-page .u-ph{max-width:none}
  .u-buy{padding:22px}
  /* tmavý pás: Honza + text v jedné řadě, formulář pod nimi přes celou šířku */
  .u-band .wp-block-columns{flex-wrap:wrap;align-items:center}
  .u-band .wp-block-column:last-child{flex:1 1 100%!important}
  .u-page .u-band .wp-block-column:not(.u-honza-mava):not(:last-child){flex:1 1 0!important}
  .u-band .u-center,.u-page .u-band .wp-block-columns.u-center{flex-wrap:nowrap}
  .u-page .u-band .wp-block-columns.u-center>.wp-block-column:last-child{flex:0 0 auto!important}
  /* dlaždice a seznamy */
  .tile{padding:20px}
  .u-grid2{gap:14px!important}
  .u-item{padding:18px;gap:12px!important}
  .u-item h3{font-size:18px}
  .u-item p{font-size:15px}
}

/* ===== telefon (do 640 px) ===== */
@media(max-width:640px){
  .u-page h1{font-size:clamp(32px,9.5vw,40px)}
  .u-page h2{font-size:clamp(26px,7.4vw,32px)}
  .u-sec{gap:22px!important}
  .u-card{padding:22px 20px}
  /* karta „Co v Učnově najdeš“: řádky pod sebou, štítek pod popisem */
  .realm__top{padding:20px 92px 20px 20px}
  .realm__list li{flex-direction:column;align-items:flex-start;gap:8px;padding:14px 20px}
  .realm__foot{padding:16px 20px 22px}
  .realm__foot .btn{width:100%}
  /* formuláře: pole nesmí zdědit flex-basis do výšky */
  .u-form__row{flex-direction:column;align-items:stretch}
  .u-form__row>*{flex:0 0 auto!important;width:100%}
  .u-form input[type=email],.u-form select,.u-form .btn{min-height:52px}
  .u-band .u-form__row{flex-direction:column;align-items:stretch}
  /* zástupné fotky a obrázky */
  .u-page .u-ph{max-width:240px}
  .u-page .u-ph--34{max-width:220px}
  .u-honza-mava>img{height:120px}
  /* tlačítka v blocích na celou šířku */
  .u-page .wp-block-buttons{width:100%}
  .u-page .wp-block-buttons .wp-block-button,.u-page .wp-block-buttons .wp-block-button__link{width:100%}
  .u-page .wp-block-buttons .wp-block-button__link{justify-content:center}
  .u-page .u-band .wp-block-buttons{width:100%}
  .u-page .wp-block-column.u-auto{flex:1 1 100%!important;width:100%}
  /* hlavička sekcí, FAQ, bubliny */
  .u-head-row{align-items:flex-start!important;gap:12px}
  .u-head-row>.u-muted{max-width:none}
  .u-faq h3{font-size:17.5px}
  .u-say--big>img{width:52px}
  /* chipy předmětů: větší cíl pro prst */
  .chip{padding:11px 16px;font-size:14.5px}
  .arrow{width:46px;height:46px}
  /* patička */
  .u-foot{padding:28px 0}
  .u-foot__in{flex-direction:column;align-items:flex-start;gap:16px}
  .u-foot ul{gap:8px 20px}
  .u-foot ul a{display:inline-block;padding:4px 0}
  /* spodní lišta se nesmí překrýt s patičkou */
  body.u-has-mbar .u-foot{padding-bottom:calc(28px + 76px)}
  /* lišta s nákupem na stránce guidu: jedno tlačítko + cena */
  .mbar--buy{justify-content:space-between;align-items:center}
  .mbar--buy .u-mbar-price{font:600 22px var(--font-head);white-space:nowrap}
  .mbar--buy .u-mbar-price small{display:block;font:600 12px var(--font-body);color:var(--ink2)}
  .mbar--buy .btn{flex:1 1 auto;flex-direction:row;font-size:16px}
}

/* ===== rozpis doučování ===== */
@media(max-width:860px){
  .u-rz__in{grid-template-columns:minmax(0,1fr)}
  .u-rz__head{position:static}
  .u-rz__day{grid-template-columns:100px minmax(0,1fr);gap:0 14px;padding:0 16px}
  .u-rz__slot{grid-template-columns:116px minmax(0,1fr) auto}
}
@media(max-width:640px){
  /* každý den = nadpis, každá hodina = vlastní karta */
  .u-rz__list{gap:20px}
  .u-rz__day{display:block;padding:0;background:none;border:0}
  .u-rz__day h3{padding:0 0 10px;font-size:19px}
  .u-rz__slot{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"time act" "what what";gap:2px 12px;margin-bottom:10px;padding:14px 16px;background:#fff;border:1.5px solid var(--line);border-radius:14px}
  .u-rz__slot:first-child{border-top:1.5px solid var(--line)}
  .u-rz__slot .u-rz__time{grid-area:time}
  .u-rz__slot .u-rz__what{grid-area:what}
  .u-rz__slot .btn,.u-rz__slot .u-rz__busy{grid-area:act;align-self:start}
  .u-rz__slot.is-busy{background:var(--paper)}
  .u-rz__slot.is-picked{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}
  .u-rz__slot.is-picked::before{display:none}
  .u-rz__form{padding:20px 16px;box-shadow:4px 4px 0 var(--accent)}
  .u-rzf__grid{grid-template-columns:minmax(0,1fr)}
  .u-rzf__send .btn{width:100%}
  .u-rz__head .btn,.u-rz__empty .btn{width:100%}
}
