/*!
Theme Name: Mitel
Theme URI: http://underscores.me/
Author: Ondřej Tóth
889Author URI: https://ondrej-toth.cz
Description: Šablona a funkcionalita na míru pro Mitel
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: mitel
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Mitel is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	- Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Generic
--------------------------------------------------------------*/

/* Normalize
--------------------------------------------- */

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
	 ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */
html {
	line-height: 1.15;
	-webkit-text-size-adjust: 100%;
}

/* Sections
	 ========================================================================== */

/**
 * Remove the margin in all browsers.
 */

/**
 * Render the `main` element consistently in IE.
 */
main {
	display: block;
}

*,
*::before,
*::after {
  box-sizing: border-box; /* zabraňuje „přetečení“ z paddingů/borderů */
}


:root {
  --otrock-font-color-primary: #FFF;
  --otrock-font-color-secondary: #050C33;
  --otrock-font-color-body: #AEB2E2;
   --otrock--color-primary-accent: #0744F8;
  --otrock-font-base: 'Montserrat', sans-serif;
  --otrock-site-max: 1280px;   
  --otrock-site-gutter: 60px;
  --otrock-site-gutter-mob: 30px; 
   
}

body {
	margin: 0;
	  font-family: var(--otrock-font-base); 
	    background: var(--otrock-font-color-secondary);
}


.otrock-paragraph-body {
  font-family: var(--otrock-font-base); 
font-style: normal;
font-weight: 400;
font-size: 16px;
line-height: 32px;
  color: var(  --otrock-font-color-body); 
  margin-top: 0;

}

.otrock-cf7 label{
  color: #fff;
  font-family: var(--otrock-font-base); 
font-style: normal;
font-weight: 400;
font-size: 16px;
line-height: 1;
}

.otrock-paragraph-body-small {
  font-family: var(--otrock-font-base); 
font-style: normal;
font-weight: 400;
font-size: 12px;
line-height: 20px;
  color: var(  --otrock-font-color-body); 
  margin-top: 0;

}

ul .otrock-paragraph-body{
	margin: 0;
}

.bold {
  font-weight: 600;
}

.white {
  color: var(--otrock-font-color-primary); 
}

.accent {
  color: var(--otrock--color-primary-accent); 
}



.otrock-badge{
  display:inline-flex; align-items:center; justify-content:center;
  padding:17px 32px; 
   border-radius:32px;
  background: rgba(255,255,255,.05);
  border:.5px solid #0744F8; color:#fff; 
  width:max-content;
          font-style: normal;
        font-weight: 400;
        font-size: 14px;
        line-height: 1;
        margin-bottom: 20px;
        height: 52px;

}

.otrock-h1 {
  font-family: var(--otrock-font-base); 
  font-style: normal;
  font-weight: 700;
  font-size: 70px;
  line-height: 86px;
  color: var(--otrock-font-color-primary); 
  margin-top: 0;
  margin-bottom: 20px;
}

.otrock-h3 {
  font-family: var(--otrock-font-base); 
font-style: normal;
font-weight: 700;
font-size: 50px;
line-height: 72px;
  color: var(--otrock-font-color-primary); 
    margin-top: 0;
  margin-bottom: 20px;
}

.otrock-h4 {
  font-family: var(--otrock-font-base); 
font-style: normal;
font-weight: 700;
font-size: 38px;
line-height: 54px;
  color: var(--otrock-font-color-primary); 
  margin-top: 0;
 margin-bottom: 20px;
}

.otrock-h5 {
  font-family: var(--otrock-font-base); 
font-style: normal;
font-weight: 700;
font-size: 28px;
line-height: 48px;
  color: var(--otrock-font-color-primary); 
  margin-top: 0;
   margin-bottom: 20px;
}

.otrock-h6 {
font-family: var(--otrock-font-base); 
font-style: normal;
font-weight: 600;
font-size: 20px;
line-height: 32px;
color: var(--otrock-font-color-primary); 
margin-top: 0;
 margin-bottom: 20px;

}

.otrock-btn-kontakt {  
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding: 17px 32px;
  gap: 8px;
border: 0.5px solid var(--Action-blue, #0744F8);

/* Button effects/Major button bg blur */
box-shadow: 0 0 42px 0 rgba(53, 62, 183, 0.43);
  width: auto;

  /* Gradient background (default) */
background: linear-gradient(to top, #0744F8 0%, #050C33 100%);
background-clip: padding-box;          /* gradient nepoteče pod border */
-webkit-background-clip: padding-box;  /* pro Safari */
  
  /* Border + radius */
  border-radius: 32px;

  /* Effects */
  color: var(--otrock-font-color-primary);
  font-family: var(--otrock-font-base);
  font-weight: 600;
  font-size: 16px;
  line-height: 1;
  text-decoration: none;
  height: 52px;
  cursor: pointer;
  transition: all 0.3s ease;
  outline: none;
}

.otrock-btn-kontakt:hover {
  background: #0744F8; /* čistá modrá místo gradientu */
  color: var(--otrock-font-color-primary);

}


.btn-small .otrock-btn-kontakt {
	width: fit-content;
}
.btn-small {
    display: flex;
    justify-content: center;

}

.btn-small-left {
    display: flex;
    justify-content: start;

}


.otrock-btn-kontakt-transparent {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding: 17px 32px;
  gap: 8px;
  height: 52px;

  width: auto;
  /* Default state */
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid var(--otrock-font-color-primary);;
  border-radius: 32px;

  color: var(--otrock-font-color-primary);
  font-family: var(--otrock-font-base);
  font-weight: 600;
  font-size: 16px;
  line-height: 1;
  text-decoration: none;

  cursor: pointer;
  transition: all 0.3s ease;border-radius: 32px;
border: 0.5px solid var(--White, #FFF);
background: var(--Button-Button-bg, rgba(255, 255, 255, 0.10));

/* Button effects/Major button bg blur */
box-shadow: 0 0 42px 0 rgba(53, 62, 183, 0.43);
}

/* Hover state (Figma) */
.otrock-btn-kontakt-transparent:hover {
  background: var(--otrock-font-color-primary);; /* celé bílé pozadí */
  color: var(--otrock-font-color-secondary);      /* tmavý text pro kontrast */
  border-color: var(--otrock-font-color-primary);;
}

.otrock-btn-full{  font-weight: 600; cursor: pointer;
  font-size: 16px; height: 52px;
  line-height: 1; display:inline-flex; align-items:center; justify-content:center;  padding: 17px 32px;border: 1px solid #0744F8; border-radius:32px; text-decoration:none; background:#0744F8; color:#fff; box-shadow:0 0 42px rgba(53,62,183,.43), inset 0 0 14px rgba(255,255,255,.3); }
.otrock-btn-full:hover{display:inline-flex; align-items:center; justify-content:center;  border: 1px solid #FFF;border-radius:32px; text-decoration:none; background: linear-gradient(90deg, #20256E 0%, #353EB7 100%); color:#fff; box-shadow:0 0 42px rgba(53,62,183,.43), inset 0 0 14px rgba(255,255,255,.3); }

.otrock-section-full-width {
  width: 100%;
  padding-left: var(--otrock-site-gutter);
  padding-right: var(--otrock-site-gutter);
  position: relative; /* pro případné absolutní prvky uvnitř */

}

.otrock-section-boxed {
  width: 100%;
  padding-left: var(--otrock-site-gutter);
  padding-right: var(--otrock-site-gutter);
  max-width: var(--otrock-site-max);
  margin: 0 auto;
  position: relative; /* pro případné absolutní prvky uvnitř */
}

.otrock-section-boxed-in-full-width {
  width: 100%;
  max-width: var(--otrock-site-max);
  margin: 0 auto;
  position: relative; /* pro případné absolutní prvky uvnitř */
}

@media (max-width: 768px){

.btn-small .otrock-btn-kontakt {
	width: 100%;
}
.btn-small {
    display: flex;
    justify-content: center;
            width: 100%;

}

  .otrock-paragraph-body {
  font-family: var(--otrock-font-base); 
font-style: normal;
font-weight: 400;
font-size: 18px;
line-height: 30px;
}

.otrock-cf7 label {
	font-style: normal;
font-weight: 400;
font-size: 18px;
line-height: 30px;
}

.otrock-paragraph-body-small {
  font-family: var(--otrock-font-base); 
font-style: normal;
font-weight: 400;
font-size: 14px;
line-height: 20px;
  color: var(  --otrock-font-color-body); 
  margin-top: 0;

}


.otrock-h1 {
font-size: 40px;
line-height: 56px;
}

.otrock-h3 {
  font-family: var(--otrock-font-base); 
font-weight: 700;
font-size: 32px;
line-height: 48px;
  color: var(--otrock-font-color-primary); 

}



.otrock-h4 {
  font-family: var(--otrock-font-base); 
font-style: normal;
font-weight: 700;
font-size: 32px;
line-height: 48px;
  color: var(--otrock-font-color-primary); 
}

.otrock-h5 {
  font-family: var(--otrock-font-base); 
font-style: normal;
font-weight: 700;
font-size: 20px;
line-height: 32px;
  color: var(--otrock-font-color-primary); 
}


.otrock-h6 {
font-weight: 700;
font-size: 20px;
line-height: 32px;
}

.otrock-btn-kontakt, .otrock-btn-kontakt-transparent  {
    padding: 17px 24px;   /* trochu menší horizontální padding na mobilu */
    font-size: 14px;      /* menší font pro čitelnost */
    line-height: 18px;
  }
}



@media (max-width: 1024px){

  .otrock-section-full-width {

  padding-left: var(--otrock-site-gutter-mob);
  padding-right: var(--otrock-site-gutter-mob);

}

	.btn-small .otrock-btn-kontakt {
	width: 100%;
}
.btn-small {
    display: flex;
    justify-content: center;
            width: 100%;

}
    .otrock-paragraph-body {
  font-family: var(--otrock-font-base); 
font-style: normal;
font-weight: 400;
font-size: 18px;
line-height: 30px;

}

.otrock-cf7 label {
	font-style: normal;
font-weight: 400;
font-size: 18px;
line-height: 30px;
}

.otrock-paragraph-body-small {
  font-family: var(--otrock-font-base); 
font-style: normal;
font-weight: 400;
font-size: 14px;
line-height: 20px;
  color: var(  --otrock-font-color-body); 
  margin-top: 0;

}


.otrock-h1 {
font-size: 40px;
line-height: 56px;
}

.otrock-h3 {
  font-family: var(--otrock-font-base); 
font-weight: 700;
font-size: 32px;
line-height: 48px;
  color: var(--otrock-font-color-primary); 
}


.otrock-h4 {
  font-family: var(--otrock-font-base); 
font-style: normal;
font-weight: 700;
font-size: 32px;
line-height: 48px;
  color: var(--otrock-font-color-primary); 
}

.otrock-h5 {
  font-family: var(--otrock-font-base); 
font-style: normal;
font-weight: 700;
font-size: 20px;
line-height: 32px;
  color: var(--otrock-font-color-primary); 
}

.otrock-h6 {
font-weight: 700;
font-size: 20px;
line-height: 32px;
}

.otrock-btn-kontakt, .otrock-btn-kontakt-transparent {
    padding: 17px 24px;   /* trochu menší horizontální padding na mobilu */
    font-size: 14px;      /* menší font pro čitelnost */
    line-height: 1;
  }

}


/* Skrývá prvek na mobilech (<=768px) */
.otrock-desktop-only {
  display: block;
}

@media (max-width: 1024px) {
  .otrock-desktop-only {
    display: none !important;
  }
}


/* =========================================
   HERO (Homepage) — DESKTOP (základ)
   ======================================= */
#otrock-homepage-hero.otrock-hero{
  min-height: 100dvh; /* výška = viewport */
  display: flex;
  align-items: center;     /* vertikální centrování obsahu */
  justify-content: center; /* horizontální centrování obsahu */
  text-align: center;
  position: relative;
  overflow: hidden;
}

.page-id-2 #otrock-homepage-hero.otrock-hero::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 220px;
  background: linear-gradient(180deg, rgba(5, 12, 51, 0) 0%, #050C33 80%);
  pointer-events: none;
}

.otrock-hero__title{
  margin: 0 0 64px 0;
}

.otrock-hero__subtitle{
  margin: 0 auto 64px auto;
  max-width: 880px; /* omezení šířky textu */
}

.otrock-hero__cta{
  display: inline-flex;
  gap: 24px;           /* mezera mezi tlačítky */
  align-items: center;
  justify-content: center;
}

/* =========================================
   MOBIL (<=768px)
   ======================================= */
@media (max-width: 768px){
  #otrock-homepage-hero.otrock-hero{
    min-height: 100vh; /* fallback */
  }

.otrock-hero__title{
  margin: 0 0 32px 0;
}

  .otrock-hero__subtitle{
    max-width: 620px;
    margin-bottom: 32px;
  }

  .otrock-hero__cta{
    display: flex;
    flex-direction: column; /* tlačítka pod sebou */
    gap: 12px;
    width: 100%;
    max-width: 360px;
    margin: 0 auto;
  }

  .otrock-hero__cta a{
    width: 100%; /* plná šířka */
  }
}

/* =========================================
   TABLET ONLY (768–1024px)
   ======================================= */
@media (min-width: 768px) and (max-width: 1024px){
	.otrock-hero__title{
  margin: 0 0 32px 0;
}

  .otrock-hero__subtitle{
    max-width: 740px;
    margin-bottom: 32px;
  }
}

/* =========================================
   TWO-COL "Jsme mitel" — DESKTOP (základ)
   ======================================= */
#otrock-homepage-about.otrock-two-col{
  background: var(--otrock-font-color-secondary);
  padding-top: 192px;
  padding-bottom: 96px;
}

#otrock-homepage-about .otrock-btn-kontakt {
  width: auto;
  display: inline-block;
}

.otrock-two-col__grid{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 96px; /* požadovaný mezisloupcový rozestup */
}

.otrock-two-col__left{ 
  flex: 1 1 50%;
}

.otrock-two-col__right{
  flex: 1 1 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.otrock-two-col__image{
  width: 100%;
  height: auto;
  max-width: 560px;        /* rozumný strop, ať neuteče */
  display: block;
}

.otrock-two-col__list{
  list-style: none;
  margin: 12px 0 28px 0;
  padding: 0;
}

.otrock-two-col__list-item{
  position: relative;
  padding-left: 24px;
  margin: 6px 0;
}
.otrock-two-col__list-item::before{
  content: "";
  position: absolute;
  left: 0; top: 12px;
  width: 8px; height: 8px;
  border-radius: 50%;
  background: #FFF; /* decentní bullet */
}

.otrock-two-col__cta{
  margin-top: 16px;
}

/* =========================================
   MOBIL (<=768px): sloupce pod sebou
   ======================================= */

/* =========================================
   SERVICES GRID — DESKTOP (základ)
   ======================================= */
#otrock-homepage-services.otrock-services{
  background: var(--otrock-font-color-secondary);
  padding-top: 96px;
  padding-bottom: 96px;
}

.otrock-services__head{
  text-align: center;
  max-width: 820px;
  margin: 0 auto 64px auto;
}

.otrock-services__head p {
	margin-bottom: 64px;
}

.otrock-services__grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr); /* 3 položky na řádek */
  gap: 24px;
}

/* Karta služby */
.otrock-service-card{
  position: relative;
  border: 1px solid var(--accent);     /* barva z dat */
  border-radius: 32px;
  background: rgba(255,255,255,0.01);  /* čisté pozadí před hoverem (dle screenu jemně tmavé) */
  padding: 30px 50px;
  overflow: hidden;
  transition: box-shadow .25s ease, transform .25s ease;
  height: 100%;
  min-height: 460px;
}

/* Gradient overlay pro hover – z PHR do LLS (pravý horní -> levý spodní) */


.otrock-service-card:hover{  background: linear-gradient(225deg, var(--accent) 0%, rgba(0,0,0,0) 90%);

  transition: opacity .25s ease;
}


.otrock-services__grid a{text-decoration: none}
/* Obsah karty (desktop: ikonka, pak H5, pak text – pod sebou) */
.otrock-service-card__icon{
  width: 100px;
  height: 100px;
  margin-bottom: 20px;
}
.otrock-service-card__icon img{
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.otrock-service-card__title{
  margin: 0 0 8px 0;
}

/* =========================================
   MOBIL (<=768px)
   ======================================= */
@media (max-width: 768px){
  #otrock-homepage-services.otrock-services{
    padding-top: 64px;
    padding-bottom: 64px;
  }

  .otrock-services__grid{
    grid-template-columns: 1fr; /* 1 položka na řádek */
    gap: 24px;
  }

  /* Layout položky: 2 sloupce (ikonka vlevo pevná, vpravo H5); text pod tím na celou šířku */
  .otrock-service-card{
    padding: 16px;
  }

  .otrock-service-card__icon{
    width: 44px;
    height: 44px;
    margin: 0; /* bez spodního odsazení, protože jedeme do řádku */
    flex: 0 0 44px; /* pevná šířka pro zarovnání všech titulů */
  }

  .otrock-service-card{
    display: grid;
    grid-template-columns: 44px 1fr;       /* ikonka | titulek */
    grid-auto-rows: auto;
    column-gap: 12px;
    row-gap: 12px;
    align-items: center;
       min-height: auto;
  }

  .otrock-service-card__title{
    grid-column: 2 / 3;  /* vpravo od ikonky */
    margin: 0;
  }

  .otrock-service-card .otrock-paragraph-body{
    grid-column: 1 / -1; /* text pod tím přes celou šířku */
    margin: 0;
  }
}

/* =========================================
   TABLET ONLY (768–1024px)
   ======================================= */
@media (min-width: 768px) and (max-width: 1024px){
  #otrock-homepage-services.otrock-services{
    padding-top: 64px;
    padding-bottom: 64px;
  }

  .otrock-services__grid{
    grid-template-columns: 1fr; /* 1 položka na řádek */
    gap: 24px;
  }

  /* Layout položky: 2 sloupce (ikonka vlevo pevná, vpravo H5); text pod tím na celou šířku */
  .otrock-service-card{
    padding: 16px;
  }

  .otrock-service-card__icon{
    width: 44px;
    height: 44px;
    margin: 0; /* bez spodního odsazení, protože jedeme do řádku */
    flex: 0 0 44px; /* pevná šířka pro zarovnání všech titulů */
  }

  .otrock-service-card{
    display: grid;
    grid-template-columns: 44px 1fr;       /* ikonka | titulek */
    grid-auto-rows: auto;
    column-gap: 12px;
    row-gap: 8px;
    align-items: center;
   min-height: auto;
  }

  .otrock-service-card__title{
    grid-column: 2 / 3;  /* vpravo od ikonky */
    margin: 0;
  }

  .otrock-service-card .otrock-paragraph-body{
    grid-column: 1 / -1; /* text pod tím přes celou šířku */
    margin: 0;
  }
}


/* =========================================
   PARTNERS — DESKTOP (základ)
   ======================================= */
#otrock-homepage-partners.otrock-partners{
  background: var(--otrock-font-color-secondary);
  padding-top: 96px;
  padding-bottom: 96px;
}

.otrock-partners__head{
  text-align: center;
  max-width: 820px;
  margin: 0 auto 40px auto;
}

.page-template-page-energetikanew .otrock-partners__head{
  text-align: center;
  max-width: 100%;
  margin: 0 auto 40px auto;
}

.otrock-partners__grid{
  display: grid;
  grid-template-columns: 0.5fr 0.5fr repeat(7, 1fr);
  gap: 24px;
  align-items: center;
}

.otrock-partners__item{
  height: 56px;                /* jednotná výška pole pro logo */
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px;                /* malé vnitřní odsazení */
}

.otrock-partners__item img{
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;         /* logo se vždy vejde celé */
  display: block;
}

/* =========================================
   MOBIL (<=768px): 2 loga na řádek
   ======================================= */
@media (max-width: 768px){
  #otrock-homepage-partners.otrock-partners{
    padding-top: 64px;
    padding-bottom: 64px;
  }


  .otrock-partners__grid{
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
  }

  .otrock-partners__item{
    height: 48px;
    padding: 6px;
  }
}

/* =========================================
   TABLET ONLY (768–1024px)
   ======================================= */
@media (min-width: 768px) and (max-width: 1024px){

  #otrock-homepage-partners.otrock-partners{
    padding-top: 64px;
    padding-bottom: 64px;
  }



  .otrock-partners__grid{
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
  }

  .otrock-partners__item{
    height: 48px;
    padding: 6px;
  }
}


/* =========================================
   HODNOCENÍ — DESKTOP (základ)
   ======================================= */
#otrock-homepage-hodnoceni.otrock-hodnoceni{
  background: var(--otrock-font-color-secondary);
  padding-top: 96px;
  padding-bottom: 96px;
}

.otrock-hodnoceni__head{
  text-align: left;
  margin-bottom: 32px;
}

/* Slider container kvůli centrování šipky (a jejímu přesahu) */
.otrock-hodnoceni__slider{
  position: relative;
}

/* Glide default gap použijeme z konfigurace (24px) — žádné vlastní marginy */
.otrock-hodnoceni__slider .glide__slides{
  align-items: stretch;
}
.otrock-hodnoceni__slider .glide__slide{
  width: 334px; /* šířka karty = šířka slidu */
}

/* ---------- FIX LAYOUT SHIFT ---------- */
/* Wrap drží max výšku karty, kartu centruje vertikálně */
.otrock-review-card-wrap{
  height: 460px;                /* = max výška při hoveru */
  display: flex;
  align-items: center;          /* karta 396px je uprostřed */
  justify-content: center;
}

/* ---- Card (Figma) ---- */
.otrock-review-card{
  position: relative;
  width: 100%;
  min-height: 396px;            /* default výška */
  border-radius: 24px;
  overflow: hidden;
  transition: min-height .25s ease, box-shadow .25s ease;
}

/* BG: Product #16203F + stroke + inner shadow */
.otrock-review-card__bg{
  position: absolute; inset: 0;
  background: #16203F;
  border: .5px solid rgba(255,255,255,.2);
  box-shadow: inset 0 0 20.9px rgba(255,255,255,.10);
  border-radius: 24px;
  z-index: 1;
}

/* Obsah nahoře nad oběma pozadími */
.otrock-review-card__inner{
  position: relative;
  z-index: 3;                   /* obsah nad gradientem */
  width: 100%;
padding-left: 60px;
padding-right: 60px;             /* ≈ 70.84px */
  margin-top: 41px;
  display: flex;
  flex-direction: column;
  gap: 32px;
}

/* Meta block */
.otrock-review-card__meta{
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* Stars */
.otrock-stars{ height: 19px; display: flex; gap: 2px; }
.otrock-star{
  width: 20px; height: 19px; display: inline-block;
  background-image: var(--star-url);
  background-repeat: no-repeat; background-position: center; background-size: contain;
}
.otrock-star.empty{ filter: grayscale(1) brightness(1.8); opacity: .55; }

/* Hover gradient: odspoda nahoru pod obsahem (nezakrývá text) */
.otrock-review-card::after{
  content:"";
  position: absolute; inset: 0;
  box-sizing: border-box;
  z-index: 2;                   /* mezi bg (1) a obsahem (3) */
  background: linear-gradient(0deg, #0744F8 0%, #050C33 100%);
  opacity: 0;
  border: 1px solid #0744F8;
  border-radius: 24px;
  pointer-events: none;
  transition: opacity .25s ease;
}
.otrock-review-card:hover{
  min-height: 460px;            /* růst nahoru i dolů uvnitř wrapu */
  box-shadow: 0 14px 50px rgba(0,0,0,.25);
}
.otrock-review-card:hover::after{ opacity: 1; }

/* ---------- Arrow: vpravo uprostřed, s negativním přesahem ---------- */
.otrock-hodnoceni__arrows{
  position: absolute;
  inset: 0;                     /* přes celý slider */
  pointer-events: none;         /* kliky propouštíme jen na button */
  z-index: 5;                   /* nad slidami */
}
.otrock-hodnoceni__arrow{
  position: absolute!important;
  right: -20px;                 /* polovina šířky = 36/2 → půlka mimo, půlka přes poslední item */
  top: 50%;
  transform: translateY(-50%);
  width: 50px; height: 50px;
  border-radius: 50%;
  background: #1E2D60;
  display: inline-flex; align-items: center; justify-content: center;
  border: none!important;
  cursor: pointer;
  pointer-events: auto;
}

.otrock-review-card__inner p {
	margin-bottom: 0;
}


/* =========================================
   MOBIL (<=768px)
   ======================================= */
@media (max-width: 768px){
  #otrock-homepage-hodnoceni.otrock-hodnoceni{
    padding-top: 64px; padding-bottom: 64px;
  }
  .otrock-hodnoceni__head{ margin-bottom: 24px; }

  .otrock-hodnoceni__slider .glide__slide{ width: 88vw; }
  .otrock-review-card{ width: 100%; }
  .otrock-review-card__inner{padding:0; margin-left: 24px; margin-right: 24px; width: auto; }

  /* menší přesah šipky na mobilu */
  .otrock-hodnoceni__arrow{ right: -14px; }
}

/* =========================================
   TABLET ONLY (768–1024px)
   ======================================= */
@media (min-width: 768px) and (max-width: 1024px){
    #otrock-homepage-hodnoceni.otrock-hodnoceni{
    padding-top: 64px; padding-bottom: 64px;
  }
  .otrock-hodnoceni__head{ margin-bottom: 24px; }

  .otrock-hodnoceni__slider .glide__slide{ width: 88vw; }
  .otrock-review-card{ width: 100%; }
  .otrock-review-card__inner{paddng: 0; margin-left: 24px; margin-right: 24px; width: auto; }

  /* menší přesah šipky na mobilu */
  .otrock-hodnoceni__arrow{ right: -14px; }
}


/* =========================================
   POTŘEBUJETE PORADIT — DESKTOP (základ)
   ======================================= */
#otrock-homepage-potrebujete-poradit.otrock-needhelp{
  background: linear-gradient(90deg, #20256E 0%, #353EB7 100%);
  overflow: visible;   /* pustí přesah obrázku nahoru */
  margin-top: 200px;
  margin-bottom: 96px;
}

.mitel-sky-link-banner {
  margin: 0;
  padding: 60px 0;
  background: linear-gradient(90deg, #1F0840 0%, #4676E2 100%);
  color: #fff;
}

.mitel-sky-link-banner__inner {
  max-width: 1200px;
  margin: 0 auto;
  text-align: center;
  padding: 0 20px;
}

.mitel-sky-link-banner h2,
.mitel-sky-link-banner .otrock-h2 {
  margin: 0;
  color: #fff;
  font-size: 60px;
}

/* 2 sloupce 50/50, gap 64px; bez vert. paddingu, aby mohl být obrázek dole */
.otrock-needhelp__wrap{
  display: flex;
  align-items: center;       /* vertikální zarovnání obsahu */
  gap: 64px;
  min-height: 540px;         /* výška obsahové plochy (Figma) */
}

/* Levý sloupec – texty, vlastní vert. odsazení (sekce nemá padding-bottom) */
.otrock-needhelp__content{
  flex: 1 1 50%;
  text-align: left;
  padding-left: 50px;
}


/* Pravý sloupec – obrázek přesahuje nahoře a sedí dole */
.otrock-needhelp__media{
  flex: 1 1 50%;
  position: relative;
  align-self: stretch;        /* sloupec má výšku celé sekce */
  overflow: visible;
}
.otrock-needhelp__media img{
  position: absolute;
  right: 0;
  bottom: 0;                  /* obrazek je „uplně dole“ sekce */
  height: 120%;               /* přesah cca 20 % nahoru */
  width: auto;
  object-fit: contain;
  display: block;
}

/* =========================================
   MOBIL (<=768px)
   ======================================= */
@media (max-width: 768px){
  .mitel-sky-link-banner h2,
.mitel-sky-link-banner .otrock-h2 {
  margin: 0;
  color: #fff;
  font-size: 40px;
}

  .otrock-needhelp__wrap{
    flex-direction: column;   /* pod sebou */
    align-items: stretch;
    gap: 24px;
    min-height: unset;
  }
  #otrock-homepage-potrebujete-poradit.otrock-needhelp{
  margin-top: 64px;
  margin-bottom: 64px;
}


  .otrock-needhelp__content{
    padding: 64px 0 0 0;      /* menší top padding, bez bottom */
    max-width: none;
  }

  /* Obrázek dole, bez přesahu (praktická výška boxu) */
  .otrock-needhelp__media{
    height: 260px;
    overflow: visible;
  }
  .otrock-needhelp__media img{
  	position: relative;
width: 100%;
    height: auto;
  }
}

/* =========================================
   TABLET ONLY (768–1024px) — VŽDY POSLEDNÍ
   ======================================= */
@media (min-width: 768px) and (max-width: 1024px){
	  #otrock-homepage-potrebujete-poradit.otrock-needhelp{
  margin-top: 64px;
  margin-bottom: 64px;
}
  .otrock-needhelp__wrap{
    flex-direction: column;   /* pod sebou */
    align-items: stretch;
    gap: 24px;
    min-height: unset;
  }

  .otrock-needhelp__content{
    padding: 64px 0 0 0;      /* menší top padding, bez bottom */
    max-width: none;
  }

  /* Obrázek dole, bez přesahu (praktická výška boxu) */
  .otrock-needhelp__media{
    height: 260px;
    overflow: visible;
  }
  .otrock-needhelp__media img{
  	position: relative;
width: 100%;
    height: auto;
  }
}

/* =========================================
   CALL TO ACTION — DESKTOP (základ)
   ======================================= */
#otrock-homepage-calltoaction.otrock-cta{
  padding-top: 64px;
  padding-bottom: 64px;
  background: linear-gradient(90deg, #20256E 0%, #353EB7 100%);
  margin-top: 96px;
  margin-bottom: 96px;
}
.otrock-cta h5 {
	margin: 0;
}
.otrock-cta__box{
  /* 90 % šířky uvnitř boxed kontejneru */
  width: 80%;
  margin: 0 auto;

  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 64px;                /* mezera mezi sloupci */
}

.otrock-cta__left{
  flex: 1 1 50%;
}

.otrock-cta__right{
  flex: 1 1 50%;
  display: flex;
  align-items: center;
}

/* Telefon – pill s ikonkou a číslem vedle sebe */
.otrock-cta__tel{
  display: inline-flex;
  align-items: center;
  gap: 16px;
  padding: 8px 16px;

  text-decoration: none;
  color: var(--otrock-font-color-primary);
}
.otrock-cta__tel:hover{

}

.otrock-cta__tel-icon{
  width: 50px;
  height: 50px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.otrock-cta__tel-icon img{
  width: 100%; height: 100%; display: block; object-fit: contain;
}

/* =========================================
   MOBIL (<=768px)
   ======================================= */
@media (max-width: 768px){
	#otrock-homepage-calltoaction.otrock-cta{
  margin-top: 64px;
  margin-bottom: 64px;
}
  .otrock-cta__box{
    width: 100%;
    flex-direction: column;     /* pod sebou */
    gap: 16px;
    text-align: center;
  }

  .otrock-cta__right{
    justify-content: center;    /* ikonka + tel na střed */
  }
}

/* =========================================
   TABLET ONLY (768–1024px) — VŽDY POSLEDNÍ
   ======================================= */
@media (min-width: 768px) and (max-width: 1024px){
		#otrock-homepage-calltoaction.otrock-cta{
  margin-top: 64px;
  margin-bottom: 64px;
}
  .otrock-cta__box{
    width: 100%;
    flex-direction: column;     /* pod sebou */
    gap: 16px;
    text-align: center;
  }

  .otrock-cta__right{
    justify-content: center;    /* ikonka + tel na střed */
  }
}

/* Sekce */
#otrock-homepage-posledniclanky.otrock-blog{
  background: var(--otrock-font-color-secondary);
  padding-top: 96px;
  padding-bottom: 96px;

}

/* HEAD — DESKTOP: badge nad H3, vše vlevo, bez šipek v headu */
.otrock-blog__head{
  display: flex;
  flex-direction: column;        /* badge nad H3 */
  align-items: flex-start;       /* vše vlevo */
  margin-bottom: 32px;
}
.otrock-blog .otrock-h5 {
	margin: 0;
}

#otrock-homepage-posledniclanky.otrock-blog .otrock-btn-kontakt-transparent {
    width: auto;
    display: inline-block;
    box-shadow: none;
}



/* Head šipky (mobilní) — na desktopu skrýt natvrdo */
.otrock-blog__arrows--mobile{ display: none !important; }

/* Pravý sloupec s šipkami vedle slideru (desktop) — nic neměň */
.otrock-blog__right{ display:flex; flex-direction:column; align-items:flex-end; gap:24px; }

/* 80/20 řádek */
.otrock-blog__row{
  display:grid;
  grid-template-columns: 4fr 1fr; /* ≈80/20 */
  gap:64px;
  align-items:start;
}

/* Slider */
.otrock-blog__left .glide__slide{ width:353px; }

/* Karta */
.otrock-blog-card{ display:flex; flex-direction:column; gap:24px; }
.otrock-blog-card__media{ position:relative; height:238px; border-radius:8px; overflow:hidden; }
.otrock-blog-card__media img{ width:100%; height:100%; object-fit:cover; display:block; }
.otrock-blog-card__badge{
  position:absolute; right:8px; top:8px; padding:8px 16px; border-radius:32px;
  color:#fff; font-weight:600; font-size:14px;
  background: linear-gradient(90deg, #20256E 0%, #353EB7 100%);
}
.otrock-blog-card__body{ display:flex; flex-direction:column; gap:16px; }
.otrock-blog-card__body p{ color:#AEB2E2; }

/* Buttons */


/* Pravý sloupec */
.otrock-blog__right{ display:flex; flex-direction:column; align-items:flex-end; gap:24px; justify-content: space-between; height: 100%}

.otrock-blog__right h5{ line-height: 28px}
/* Šipky */
/* Šipky = celé buttony ze SVG (ne jen ikona) */
.otrock-blog__arrows {
	    justify-content: end;
    display: flex;
    margin-top: 32px;
    gap: 16px;
}


.otrock-blog__arrow{
	  all: unset; 
  width: 68px;
  height: 32px;
  display: inline-block;
  background-image: var(--btn-base);   /* disabled varianta */
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;            /* přizpůsobí přesně SVG buttonu */
  border: 0;                           /* border je součást SVG */
  cursor: pointer;∂
  outline: none;
}

/* Hover/Fokus = active varianta */
.otrock-blog__arrow:hover,
.otrock-blog__arrow:focus-visible{
  background-image: var(--btn-hover);
}

/* Směry (protože dodaná SVG jsou: disabled=←, active=→) */

/* Levá: disabled už míří vlevo, na hover musíme aktivní otočit na ← */
.otrock-blog__arrow--prev:hover,
.otrock-blog__arrow--prev:focus-visible{
  transform: scaleX(-1);    /* převrátí active (→) na ← */
}

/* Pravá: v disabled máme ←, takže ji v klidu otočíme na → */
.otrock-blog__arrow--next{
  transform: scaleX(-1);    /* udělá z disabled (←) → */
}
/* …a na hover už necháme aktivní bez flipu (→), proto transform zrušíme */
.otrock-blog__arrow--next:hover,
.otrock-blog__arrow--next:focus-visible{
  transform: none;
}
/* MOBIL */
@media (max-width:768px){
  #otrock-homepage-posledniclanky.otrock-blog{ padding-top:64px; padding-bottom:64px; }
  .otrock-blog__head{
  }
  .otrock-blog__arrows--mobile{ display: flex !important; margin-top:0;width:100% }
  .otrock-blog__row{ grid-template-columns: 1fr; gap:24px; }
  .otrock-blog__right{ align-items:stretch; }
  .otrock-blog__right .otrock-btn{ width:100%; justify-content:center; }
}

/* TABLET ONLY (768–1024px) */
@media (min-width:768px) and (max-width:1024px){
  .otrock-blog__row{ grid-template-columns: 3fr 1fr; gap:32px; }
    #otrock-homepage-posledniclanky.otrock-blog{ padding-top:64px; padding-bottom:64px; }
  .otrock-blog__head{
  }
  .otrock-blog__arrows--mobile{ display: flex !important; margin-top:0;width:100% }
  .otrock-blog__row{ grid-template-columns: 1fr; gap:24px; }
  .otrock-blog__right{ align-items:stretch; }
  .otrock-blog__right .otrock-btn{ width:100%; justify-content:center; }
    #otrock-homepage-posledniclanky .otrock-blog__left .glide__slide{
    width: 88vw;                 /* nebo klidně 100% pokud chceš bez „odsazení“ */
  }
  #otrock-homepage-posledniclanky .otrock-blog-card{ width: 100%; }
}

/* --- 1) Grid fix: dovol levému sloupci smrsknout se --- */
.otrock-blog__left{ min-width: 0; }

/* --- 2) Glide baseline (když nenačítáš glide.css) --- */
#otrock-homepage-posledniclanky .glide__track{ overflow: hidden; }    /* řeže horizontální overflow */
#otrock-homepage-posledniclanky .glide__slides{
  display: flex;
  margin: 0;
  padding: 0;
  list-style: none;
  will-change: transform;
}
#otrock-homepage-posledniclanky .glide__slide{ flex-shrink: 0; }     /* slidy se nesmí zmenšovat */

/* --- 3) Mobil: šířka jednoho slidu na viewport, ať nic netrčí --- */
@media (max-width: 768px){
  #otrock-homepage-posledniclanky .otrock-blog__left .glide__slide{
    width: 88vw;                 /* nebo klidně 100% pokud chceš bez „odsazení“ */
  }
  #otrock-homepage-posledniclanky .otrock-blog-card{ width: 100%; }
}

/* (volitelné) Nejzazší pojistka proti horizontálnímu scrollu jen u téhle sekce */
#otrock-homepage-posledniclanky{ overflow-x: clip; }

/* ============================
   KONTAKT – DESKTOP (základ)
   ============================ */
.otrock-contact{
  background: var(--otrock-primary-bg, #050C33);
  padding-top: 96px;
  padding-bottom: 96px;
}

.otrock-contact .otrock-paragraph-body {
	margin-bottom: 40px;
}
.otrock-contact__grid{
  display: grid;
  grid-template-columns: 1fr 1fr;             /* 50/50 */
  gap: var(--otrock-gap-xxl, 64px);
  align-items: start;
}

.otrock-contact__content{
  display: flex;
  flex-direction: column;
  max-width: 80%;
}

.otrock-contact__list{
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.otrock-contact__row{ display: flex; align-items: center; gap: 16px; }
.otrock-contact__icon{ width: 56px; height: 38px; display: block; }
.otrock-contact__link{ text-decoration: none; }
.otrock-contact__separator{ width: 80%; height: 1px; background: #373D5C; margin-top:20px; margin-bottom:20px }

/* Pravý sloupec (karta s formulářem) */
.otrock-contact__form{
  background: rgba(22,32,63,.5);
  box-shadow: inset 0 0 20.9px rgba(255,255,255,.1);
  border-radius: 32px;
  padding: 50px;
}

/* ---- CF7 (scoped) ---- */
.otrock-cf7{
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.otrock-cf7__fields{ display: flex; flex-direction: column; gap: 24px;}
.otrock-cf7__group{ display: flex; flex-direction: column; gap: 12px; }
.otrock-cf7__group p {
	margin: 0;
}


/* Vstupy – základ (tmavé) */
.otrock-cf7 .otrock-input,
.otrock-cf7 .otrock-textarea{
  width: 100%;
  background: #050C33;
  color: #fff;
  border: .5px solid rgba(255,255,255,.2);
  border-radius: 8px;
  padding: 12px;
}
.otrock-cf7 .otrock-textarea{ min-height: 100px; resize: vertical; }

.otrock-cf7 input::placeholder,
.otrock-cf7 textarea::placeholder{ color: rgba(255,255,255,.6); font-style: normal;
font-weight: 400;
font-size: 16px;
line-height: 32px;}

/* SELECT – vlastní ikonka */
.otrock-cf7 select.otrock-select{
  appearance: none;
  display: block;
  width: 100%;
  padding: 12px 48px 12px 12px;
  border-radius: 8px;
  background: linear-gradient(90deg, rgba(255,255,255,.1), rgba(255,255,255,.1));
  border: .5px solid rgba(255,255,255,.2);
  color: #fff;
    font-style: normal;
  font-weight: 400;
  font-size: 14px;
   line-height: 1.5;
  background-image: url('img/1_homepage/icons/ServiceSelectIcon.svg');
  background-repeat: no-repeat;
  background-size: 24px 24px;
  background-position: right 12px center;
}

/* Focus – jednotně pro input/textarea/select */
.otrock-cf7 .otrock-input:focus,
.otrock-cf7 .otrock-textarea:focus,
.otrock-cf7 select.otrock-select:focus{
  background: #fff;
  color: #050C33;
  border: 1px solid transparent;
  box-shadow: 0 0 41.2px rgba(31,19,239,.5);
  outline: 2px solid rgba(7,68,248,.35);
  outline-offset: 0px;
}
.otrock-cf7 .otrock-input:focus::placeholder,
.otrock-cf7 .otrock-textarea:focus::placeholder{ color: #050C33;   font-family: var(--otrock-font-base); 
font-style: normal;
font-weight: 400;
font-size: 14px;
line-height: 1.5;}

.otrock-cf7 .otrock-textarea::placeholder{ font-family: var(--otrock-font-base); 
font-style: normal;
font-weight: 400;
font-size: 14px;
line-height: 1.5;}

/* Akční řádek (souhlas + odeslání) */
.otrock-cf7__actions{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

/* Checkbox – input vlevo, text vpravo; validace pod CELÝM řádkem */
.otrock-cf7__terms{
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin: 0;
    color: var(  --otrock-font-color-body)!important; 
  font-style: normal;
  font-weight: 400;
  font-size: 14px!important;
  line-height: 1.5!important;             
}

.otrock-cf7__terms a {
    color: var(  --otrock-font-color-body); 
          
}

.otrock-cf7__terms .wpcf7-list-item-label{ display: none; }
.otrock-cf7__terms .wpcf7-list-item{ margin: 0; }
.otrock-cf7__terms br{ display: none; }
.otrock-cf7__terms input[type="checkbox"],
.otrock-cf7 input[type="checkbox"].otrock-checkbox{
  width: 22px;
  height: 22px;
  accent-color: #0744F8;
}
.otrock-cf7__terms .wpcf7-not-valid-tip{
  position: absolute;
  left: 0; right: 0; top: 100%;
  margin-top: 6px;
  display: block;
      width: 150px;
}

/* Submit – ikonka fyzicky u tlačítka (bez backgroundů) */
.otrock-cf7__submitwrap{
  position: relative;
  display: inline-block;
}
.otrock-cf7__submitwrap br{ display: none; }        /* CF7 někdy vloží <br> */
.otrock-cf7__submit{
  /* vzhled si bere z .otrock-btn-kontakt; tady jen místo pro ikonku vlevo */
  padding-left: 64px;

}
.otrock-cf7__submitwrap .otrock-btn-icon{
  position: absolute;
  left: 24px;
  top: 50%;
  transform: translateY(-50%);
  width: 28px;
  height: 28px;
  display: inline-block;
  pointer-events: none; /* klik jde na input pod ikonou */
}

/* ============================
   MOBIL (<=768px)
   ============================ */
@media (max-width: 768px){
	.otrock-contact__content{
  max-width: 100%;
}

.otrock-contact__separator {width: 100%}
  .otrock-contact{ padding-top: 64px; padding-bottom:64px; }
  .otrock-contact__grid{ grid-template-columns: 1fr; gap: 64px; }
  .otrock-contact__form{         padding: 25px 20px;}
  .otrock-cf7{ gap: 32px; }
  .otrock-cf7__fields{ gap: 8px; }
  .otrock-cf7__group{ gap: 8px; }
  .otrock-cf7__actions{ flex-direction: column; align-items: flex-start; }
  .otrock-cf7__submit{ width: 100%; text-align: center; }
    .otrock-cf7__submitbtn {

    width: 100%;
}
}

/* ============================
   TABLET ONLY (768–1024px)
   ============================ */
@media (min-width: 768px) and (max-width: 1024px){
		.otrock-contact__content{
  max-width: 100%;
}
.otrock-contact__separator {width: 100%}
  .otrock-contact{ padding-top: 64px; padding-bottom:64px; }
  .otrock-contact__grid{ grid-template-columns: 1fr; gap: 64px; }
  .otrock-contact__form{         padding: 25px 20px;}
  .otrock-cf7{ gap: 32px; }
  .otrock-cf7__fields{ gap: 8px; }
  .otrock-cf7__group{ gap: 8px; }
  .otrock-cf7__actions{ flex-direction: column; align-items: flex-start; }
  .otrock-cf7__submit{ width: 100%; text-align: center; }
  .otrock-cf7__submitbtn {

    width: 100%;
}
}

.otrock-cf7__submitbtn{
  display:inline-flex;
  align-items:center;
  gap:12px;
  white-space:nowrap;  
  height: 52px;          /* ← NEZALAMOVAT */
}
.otrock-cf7__submitbtn .otrock-btn-label{
  line-height:1;
  white-space:nowrap;            /* ← jistota i pro text uvnitř */
}

.otrock-cf7 .otrock-input,
.otrock-cf7 .otrock-textarea{
  font-style: normal;
  font-weight: 400;
  font-size: 14px;
   line-height: 1.5;
}

.otrock-cf7 .otrock-input::placeholder,
.otrock-cf7 .otrock-textarea::placeholder{
  font-style: normal;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.5;
}

.wpcf7-not-valid-tip {
	color: red; /* Red */
  font-style: normal;
  font-weight: 400;
  font-size: 12px;
  line-height: 18px;
	display: block;
	padding-top: 10px;
}

/* ============================
   PHONE LEAD (scoped)
   ============================ */
.otrock-phonelead {
  --pill-h: 52px;
  --pill-radius: 32px;
  --gap: 12px;
  --placeholder: rgba(2,15,89,.5);
  --accent: #0744F8;
  font-family: var(--otrock-font-base);
}

/* řádek: input (≈66%) + button (≈34%) */
.otrock-phonelead__row{ display:flex; gap:12px; }
.otrock-phonelead__inputwrap{ flex: 2 1 66%; min-width:0; }
.otrock-phonelead__btnwrap{   flex: 1 1 34%; position:relative; }

/* tel input */
.otrock-phonelead__input{
  width:100%;
  height: var(--pill-h);
  border-radius: var(--pill-radius);
  background:#fff;
  border:1px solid rgba(0,0,0,.08);
  padding:0 20px;
  color:#020F59;
  font: 400 16px/32px var(--otrock-font-base);
}
.otrock-phonelead__input::placeholder{
  color: var(--placeholder);
  font: 400 16px/32px var(--otrock-font-base);
}
.otrock-phonelead__input:focus{
  outline:2px solid rgba(7,68,248,.35);
  outline-offset:2px;
  border-color:var(--accent);
  box-shadow:0 0 16px rgba(7,68,248,.25);
  background:#fff;
}

/* tlačítko – .otrock-btn-full (jen výška & nezalamovat) */
.otrock-phonelead .otrock-btn-full{ height:var(--pill-h); white-space:nowrap; }

/* spinner z CF7 – držet uvnitř btnwrap, nerozbíjet layout */
.otrock-phonelead__btnwrap .wpcf7-spinner{
  position:absolute; right:12px; top:50%; transform:translateY(-50%);
  margin:0; width:18px; height:18px; pointer-events:none; visibility:hidden;
}
.otrock-phonelead .wpcf7-form.submitting .wpcf7-spinner{ visibility:visible; }

/* ============================
   CHECKBOX (stejný jako u kontaktu)
   ============================ */
.otrock-phonelead__terms{
  display:grid;
  grid-template-columns: 16px 1fr;   /* checkbox | text */
  align-items:center;
  column-gap:8px;
  width:100%;
  margin-top:20px;
  color: var(--otrock-font-color-body, #AEB2E2);
font-style: normal;
font-weight: 400;
font-size: 14px;
line-height: 20px;
}
.otrock-phonelead__terms .wpcf7-list-item-label{ display:none; } /* skryje “souhlas” */
.otrock-phonelead__terms .wpcf7-list-item{ margin:0; }
.otrock-phonelead__terms br{ display:none; }

.otrock-phonelead__terms input[type="checkbox"]{
  -webkit-appearance:auto; appearance:auto; /* native vzhled */
  width:16px; height:16px;
  border:1px solid #AEB2E2; border-radius:4px; background:transparent;
  accent-color: var(--accent);               /* barva po zaškrtnutí = jako kontakt */
}

/* text vedle checkboxu vždy ve 2. sloupci (nepodjede) */
.otrock-phonelead__terms > label{
  grid-column:2;
  min-width:0;
  white-space:normal;
  margin-left: 5px;
}
.otrock-phonelead__terms a{ color:inherit; text-decoration:underline; }

/* error hláška přes celý řádek pod oběma sloupci */
.otrock-phonelead__terms .wpcf7-form-control-wrap{ display:contents; }
.otrock-phonelead__terms .wpcf7-not-valid-tip{
  grid-column:1 / -1;
  margin-top: 40px;
  position:absolute;
}

/* responsivita */
@media (max-width: 768px){
  .otrock-phonelead__row{ flex-direction:column; align-items:stretch; }
  .otrock-phonelead__btnwrap .otrock-btn-full{ width:100%; }
}

@media (min-width: 768px) and (max-width: 1024px){ 
  .otrock-phonelead__row{ flex-direction:column; align-items:stretch; }
  .otrock-phonelead__btnwrap .otrock-btn-full{ width:100%; }
	}


/* =========================================
   HERO – univerzální split (DESKTOP)
   ======================================= */
.otrock-hero-split{
  background: var(--otrock-font-color-secondary); /* tmavé modré pozadí */
  padding-top: 176px;
  padding-bottom: 96px;

  /* full height jako homepage hero */
  min-height: 100dvh;   /* dynamická výška viewportu */
  display: flex;        /* pro vertikální centrování obsahu */
  align-items: center;
}

.otrock-hero-split__grid{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 64px;                 /* mezera mezi sloupci */
}

.otrock-hero-split__content{ 
  flex: 1 1 50%;
}

.otrock-hero-split__media{
  flex: 1 1 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.otrock-hero-split__image{
  width: 100%;
  height: auto;
  display: block;
}

/* CTA v řádku (desktop) */
.otrock-hero-split__cta{
  display: inline-flex;
  gap: 16px;
  align-items: center;
  margin-top: 24px;
}

/* =========================================
   MOBIL (<=768px)
   ======================================= */
@media (max-width: 768px){
  .otrock-hero-split{
    padding-top: 64px;
    padding-bottom: 64px;
    min-height: 100vh; /* fallback */
  }

  .otrock-hero-split__grid{
    flex-direction: column;   /* sloupce pod sebou */
    gap: 24px;
  }

  /* Obrázek jako první na mobilu */
  .otrock-hero-split__media{ order: -1; }

  /* CTA: každý button na vlastní řádek + full width */
  .otrock-hero-split__cta{
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
  }
  .otrock-hero-split__cta a{
    width: 100%;
  }
}

/* =========================================
   TABLET ONLY (768–1024px) — vždy poslední
   ======================================= */
@media (min-width: 768px) and (max-width: 1024px){
  .otrock-hero-split{
    padding-top: 64px;
    padding-bottom: 64px;
    min-height: 100vh;  /* stejné jako mobil */
  }

  .otrock-hero-split__grid{
    flex-direction: column;   /* sloupce pod sebou */
    gap: 24px;
  }

  /* Obrázek jako první na tablet */
  .otrock-hero-split__media{ order: -1; }

  /* CTA: každý button na vlastní řádek + full width */
  .otrock-hero-split__cta{
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
  }
  .otrock-hero-split__cta a{
    width: 100%;
  }
}

/* =========================================
   HERO FULLBG – pozadí na celou sekci (DESKTOP)
   ======================================= */
.otrock-hero-fullbg{
  position: relative;
  background: url('') lightgray 50% / cover no-repeat;
  background-size: cover;
  background-position: center;
  padding-top: 176px;
  padding-bottom: 96px;
  min-height: 100dvh;
  display: flex;
  align-items: center;
}

/* Gradient overlay zleva doprava */
.otrock-hero-fullbg__overlay{
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(270deg, rgba(5, 12, 51, 0.00) 0%, #050C33 83.69%);
  pointer-events: none;
  z-index: 1;
}

.otrock-hero-fullbg .otrock-section-boxed-in-full-width{
  position: relative;
  z-index: 2;
}

.otrock-hero-fullbg__content{
  max-width: 700px;
}

.otrock-hero-fullbg__content .otrock-h1{
  color: #fff;
  margin-bottom: 40px;
}

.otrock-hero-fullbg__content .otrock-h6{
  color: rgba(255, 255, 255, 0.8);
}

.otrock-hero-fullbg__content .otrock-paragraph-body{
  color: rgba(255, 255, 255, 0.9);
}

/* CTA tlačítka */
.otrock-hero-fullbg__cta{
  display: inline-flex;
  gap: 16px;
  align-items: center;
  margin-top: 24px;
}

/* =========================================
   HERO FULLBG – MOBIL (<=768px)
   ======================================= */
@media (max-width: 768px){
  .otrock-hero-fullbg{
    padding-top: 300px;
    padding-bottom: 64px;
    min-height: 100vh;
    background-position: right top;
    background-size: 200%;
  }

  /* Mobil: gradient zdola nahoru (plná barva dole, průhledná nahoře) */
  .otrock-hero-fullbg__overlay{
    background: linear-gradient(0deg, #050C33 69%, rgba(5, 12, 51, 0.00) 80%);
  }

  .otrock-hero-fullbg__content{
    max-width: 100%;
  }

  .otrock-hero-fullbg__cta{
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
  }

  .otrock-hero-fullbg__cta .otrock-btn-kontakt,
  .otrock-hero-fullbg__cta .otrock-btn-kontakt-transparent{
    width: 100%;
  }
}

/* =========================================
   HERO FULLBG – TABLET (768–1024px)
   ======================================= */
@media (min-width: 768px) and (max-width: 1024px){
  .otrock-hero-fullbg{
    padding-top: 120px;
    padding-bottom: 64px;
    min-height: 100vh;
  }

  /* Tablet: gradient zdola nahoru (plná barva dole, průhledná nahoře) */
  .otrock-hero-fullbg__overlay{
    background: linear-gradient(0deg, #050C33 0%, rgba(5, 12, 51, 0.00) 60%);
  }

  .otrock-hero-fullbg__content{
    max-width: 100%;
  }

  .otrock-hero-fullbg__cta{
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
  }

  .otrock-hero-fullbg__cta .otrock-btn-kontakt,
  .otrock-hero-fullbg__cta .otrock-btn-kontakt-transparent{
    width: 100%;
  }
}

/* ============================
   HROZBY — DESKTOP (základ)
   ============================ */
#otrock-kyberneticka-bezpecnost-hrozby.otrock-threats{
  background: var(--otrock-font-color-secondary); /* tmavé pozadí */
  padding-bottom: 96px;
  padding-top: 96px;
}

.otrock-threats__head{
  text-align: center;
  max-width: 880px;
  margin: 0 auto 40px auto;
}
.otrock-threats__head .otrock-paragraph-body{ margin-bottom: 0; }

/* 2 sloupce */
.otrock-threats__grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  align-items: stretch;
  max-width: 80%;
  margin: 0 auto;
}
.otrock-threats__col{ display: flex; flex-direction: column; gap: 24px; }

/* karty + 3D */
.otrock-threat-card{
  position: relative;
  border-radius: 32px;
  overflow: hidden;
  perspective: 1000px;
  will-change: transform;
  isolation: isolate; /* + fix zaoblení při 3D kompozici */
}
.otrock-threat-card--tall{  height: 417px; } /* 2×372 + 1×24 = 768 */
.otrock-threat-card--short{ height: 270px; } /* 3×240 + 2×24 = 768 */

.otrock-threat-card__inner{
  position: relative; width: 100%; height: 100%;
  transform-style: preserve-3d;
  transition: transform .6s cubic-bezier(.2,.8,.2,1);

}

/* >>> Flip podmíněně:
   - Zařízení s hoverem: :hover otáčí (desktop, touchpady)
   - Všude: .is-flipped otáčí (JS pro mobil/tablet) */
@media (hover: hover){
  .otrock-threat-card:hover .otrock-threat-card__inner{
    transform: rotateY(180deg);
     border-radius: 32px;
  }
}
.otrock-threat-card.is-flipped .otrock-threat-card__inner{
  transform: rotateY(180deg);
   border-radius: 32px;
}

/* vrstvy */
.otrock-threat-card__face{
  position: absolute; inset: 0;
  display: flex; flex-direction: column; justify-content: flex-end;
  backface-visibility: hidden; -webkit-backface-visibility: hidden;
  pointer-events: none; /* defaultně neklikatelné, kliky řeší card/JS */
  border-radius: inherit; /* + fix: udržet zaoblení i během animace */
  overflow: hidden;       /* + fix: nic nepřetéče přes rohy */
  transform: translateZ(0); /* + fix: GPU „přilepení“ zamezí probliknutí */
}
.otrock-threat-card__face--front{ z-index: 1; }
.otrock-threat-card__face--back{
  transform: translateZ(0) rotateY(180deg); /* + fix: přidej translateZ(0) */
  background: #1347EF;
  padding: 32px;
  justify-content: space-between;   /* obsah nahoře, button dole */
  pointer-events: auto;             /* kliky povolené jen zde (na button) */
  z-index: 2;
}

/* obrázek + overlay */
.otrock-threat-card__media{ position: absolute; inset: 0; }
.otrock-threat-card__media img{ width: 100%; height: 100%; object-fit: cover; display: block; }
.otrock-threat-card__overlay{
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(6,32,120,0) 40%, rgba(6,32,120,.85) 100%);
  pointer-events: none;
}

/* footer front */
.otrock-threat-card__footer{
  position: relative; z-index: 2;
  display: flex; align-items: center; justify-content: space-between;
  padding: 24px;
}
.otrock-threat-card__footer .otrock-h5{ margin: 0; }
.otrock-threat-card__arrow{ width: 28px; height: 28px; display: block; }

/* back content */
.otrock-threat-card__backinner{
  display: flex; flex-direction: column; gap: 16px; height: 100%;
  justify-content: space-between;
}
.otrock-threat-card__backinner p{
margin-bottom: 0;
}
.otrock-threat-card__content > .otrock-h5{ margin: 0 0 8px 0; }

/* button */
.otrock-threats__btn{
  display: inline-flex; align-items: center; justify-content: center;
  align-self: flex-start;
  padding: 17px 32px; border-radius: 24px;
  background: #FFF; color: #050C33; text-decoration: none; 
  border: 1px solid #FFF; transition: all .25s ease;
  position: relative; z-index: 3;
  font-style: normal;
font-weight: 600;
font-size: 16px;
line-height: 32px;
}
.otrock-threats__btn:hover{ background: #050C33; color: #FFF; border-color: #050C33; }

/* ============================
   MOBIL (<=768px)
   ============================ */
@media (max-width: 768px){
  #otrock-kyberneticka-bezpecnost-hrozby.otrock-threats{
    padding-top: 64px; padding-bottom: 64px;
  }
  .otrock-threats__head{ margin-bottom: 40px; }

  .otrock-threats__grid{ grid-template-columns: 1fr; gap: 24px;   max-width: 100%;
  margin: 0 auto;}
  .otrock-threats__col{ gap: 24px; }

  .otrock-threat-card--tall{  height: 308px; }
  .otrock-threat-card--short{ height: 210px; }


}

/* ============================
   TABLET ONLY (768–1024px) — VŽDY POSLEDNÍ
   ============================ */
@media (min-width: 768px) and (max-width: 1024px){
  #otrock-kyberneticka-bezpecnost-hrozby.otrock-threats{
    padding-top: 64px; padding-bottom: 64px;
  }
  .otrock-threats__head{ margin-bottom: 40px; }

  .otrock-threats__grid{ grid-template-columns: 1fr; gap: 24px;   max-width: 100%;
  margin: 0 auto;}
  .otrock-threats__col{ gap: 24px; }


  .otrock-threat-card--tall{  height: 308px; }
  .otrock-threat-card--short{ height: 210px; }
}

/* ============================
   JAK MITEL CHRÁNÍ — DESKTOP (základ)
   ============================ */
.otrock-protect{
  background: var(--otrock-font-color-secondary);
  padding-top: 96px;
  padding-bottom: 96px;
}

.otrock-protect__head{
  text-align: left;
  margin-bottom: 24px;
}

.otrock-protect__grid{

  display: grid;
      grid-template-columns: 0.37fr 0.63fr;
    gap: 160px;

    align-items: start;
  grid-template-areas: "media content";
}
.otrock-protect__grid.is-reversed-desktop{
  grid-template-areas: "content media"; /* jen na desktopu prohodíme pořadí */
    grid-template-columns: 0.63fr 0.37fr; /* 40% media | 60% content */
}

.otrock-protect__media{ grid-area: media; display:flex; flex-direction:column; align-items:flex-start; gap:64px;width: 100%; }
.otrock-protect__title{ margin-bottom: 0; }
.otrock-protect__image{
  width: 90%;
  height: auto;
  max-width: 540px;
  display: block;
}

#otrock-tv-sat-jake-sluzby-nabizime-2 .otrock-protect__image{
  width: 90%;
  height: auto;
  max-width: 540px;
  display: block;
}


#otrock-tv-sat-jake-sluzby-nabizime-2 .otrock-protect__grid.is-reversed-desktop{

  display: grid;
   grid-template-columns: 0.63fr 0.37fr; /* 40% media | 60% content */
    gap: 160px;

    align-items: center;
  grid-template-areas: "content media"; /* jen na desktopu prohodíme pořadí */
}

.otrock-protect__content{ grid-area: content; }
.otrock-protect__list{
  list-style: none;
  padding: 0; margin: 0;
  display: flex; flex-direction: column; gap: 48px;
}

/* Item = ikonka vlevo (nahoře), text vpravo */
.otrock-protect__item{
  display: grid;
  grid-template-columns: 56px 1fr; /* fix na ikonku */
  column-gap: 24px;
  align-items: start;
}

.otrock-protect__icon{
  width: 56px; height: 56px; display: inline-flex; align-items:center; justify-content:center;
}
.otrock-protect__icon img{ width: 56px; height: 56px; object-fit: contain; display: block; }

.otrock-protect__itemtitle{ margin: 0 0 10px 0; }
.otrock-protect__bullets{
  margin: 0; padding-left: 20px; /* klasické odrážky */
}
.otrock-protect__bullets li{ margin: 0 0 6px 0; }
.otrock-protect__bullets li:last-child{ margin-bottom: 0; }

/* ============================
   MOBIL (<=768px)
   ============================ */
@media (max-width: 768px){
  .otrock-protect{ padding-top: 64px; padding-bottom: 64px; }

  .otrock-protect__head{ text-align: center; }
  .otrock-protect__grid,
  .otrock-protect__grid.is-reversed-desktop{
    grid-template-columns: 1fr;
    grid-template-areas:
      "media"
      "content"; /* NA MOBILU VŽDY nejdřív obrázek, pak obsah */
    gap: 64px;
  }

  .otrock-protect__media{ align-items: center; text-align: center; }
  .otrock-protect__image{ max-width: 420px; }
}

/* ============================
   TABLET ONLY (768–1024px) — VŽDY POSLEDNÍ BLOK
   ============================ */
@media (min-width: 768px) and (max-width: 1024px){
  .otrock-protect{ padding-top: 64px; padding-bottom: 64px; }

  .otrock-protect__head{ text-align: center; }
  .otrock-protect__grid,
  .otrock-protect__grid.is-reversed-desktop{
    grid-template-columns: 1fr;
    grid-template-areas:
      "media"
      "content"; /* NA MOBILU VŽDY nejdřív obrázek, pak obsah */
    gap: 64px;
  }

  .otrock-protect__media{ align-items: center; text-align: center; }
  .otrock-protect__image{ max-width: 420px; }
}

.otrock-protect__bullets li::marker{
  color: var(--otrock-font-color-body);
}

.otrock-protect__bullets{
  list-style: disc outside;
}

/* =========================================
   PROČ SI VYBRAT MITEL — DESKTOP (základ)
   ======================================= */
#otrock-kyberneticka-bezpecnost-proc-si-vybrat.otrock-why{
  --otrock-why-head-h: 64px; /* sjednocená výška slotu (logo/h5) */
  background: var(--otrock-font-color-secondary);
  padding-top: 96px;
  padding-bottom: 96px;
}

.otrock-why__head{
  text-align: center;
  margin: 0 auto 40px auto;
}

/* desktop: obsah s boxy má ~80% šířky, vycentrované */
.otrock-why__grid{
  display: grid;
  grid-template-columns: 1fr 1fr; /* 50/50 */
  gap: 24px;
  align-items: stretch;            /* vyrovná výšky sloupců */
  width: 80%;
  margin-left: auto;
  margin-right: auto;
}

/* každý sloupec: hlavička (stejná výška) + karta, karta vyplní zbytek */
.otrock-why__col{
  display: grid;
  grid-template-rows: var(--otrock-why-head-h) 1fr; /* stejné zarovnání startu karet */
  gap: 20px;
}

.otrock-why__headslot{
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: var(--otrock-why-head-h);
}

/* logo */
.otrock-why__logo img{
  max-width: 160px; height: auto; display: block;
}

/* pravý nadpis */
.otrock-why__righttitle{
  text-align: center;
  margin: 0; /* ať slot drží jednotnou výšku */
}

/* --- Karty (glass + gradient + hairline border) --- */
.otrock-why-card{
  position: relative;
  border-radius: 24px;
  overflow: hidden;
  border: 0.5px solid rgba(255,255,255,0.2);
  box-shadow: inset 0 0 23.52px rgba(255,255,255,0.1);
  padding: 40px;
  height: 100%;               /* stejná výška obou karet */
  display: flex;
  flex-direction: column;
}

.otrock-why-card--pros{
  background: linear-gradient(141.12deg, #060E37 42.16%, #1348EF 123.6%);
}
.otrock-why-card--cons{
  background: linear-gradient(137.83deg, #050C33 40.1%, #DA2D39 167.73%);
}

/* --- List uvnitř karet --- */
.otrock-why-card__list{
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-direction: column; gap: 0px;
}
.otrock-why-card__item{
  display: grid;
  grid-template-columns: 32px 1fr; /* ikonka | text */
  column-gap: 16px;
  align-items: center;
  padding: 12px 0; 
}

.otrock-why-card__item:first-child{ padding-top: 0; }
.otrock-why-card__item:last-child{  padding-bottom: 0; }
/* NOVÉ / UPRAVA */
.otrock-why-card__item:not(:last-child)::after{
  content: "";
  display: block;
  grid-column: 1 / -1;              /* ← SPAN přes obě gridové kolony (ikona + text) */
  height: 1px;
  width: 100%;
  margin-top: 24px;                 /* navazuje na padding položky */
  background: linear-gradient(
    90deg,
    rgba(42,54,75,0.20) 0%,
    #5C75A4 50%,
    rgba(42,54,75,0.20) 100%
  );
  border-radius: 999px;
}
.otrock-why-card__icon{
  width: 32px; height: 32px; display: inline-flex; align-items:center; justify-content:center;
}
.otrock-why-card__icon img{ width: 100%; height: 100%; object-fit: contain; display: block; }

/* =========================================
   MOBIL (<=768px)
   ======================================= */
@media (max-width: 768px){
  #otrock-kyberneticka-bezpecnost-proc-si-vybrat.otrock-why{
    padding-top: 64px;
    padding-bottom: 64px;
  }

  .otrock-why__grid{
    grid-template-columns: 1fr; /* pod sebou */
    gap: 24px;
    width: 100%;               /* mobil necháváme na plnou šířku */
    margin-left: 0;
    margin-right: 0;
  }

  .otrock-why__logo img{ max-width: 120px; }
}

/* =========================================
   TABLET ONLY (768–1024px) — VŽDY POSLEDNÍ
   ======================================= */
@media (min-width: 768px) and (max-width: 1024px){
  #otrock-kyberneticka-bezpecnost-proc-si-vybrat.otrock-why{
    padding-top: 64px;
    padding-bottom: 64px;
  }

  .otrock-why__grid{
    grid-template-columns: 1fr; /* pod sebou */
    gap: 24px;
    width: 100%;               /* mobil necháváme na plnou šířku */
    margin-left: 0;
    margin-right: 0;
  }

  .otrock-why__logo img{ max-width: 120px; }
}

/* ============================
   POSTUP SPOLUPRÁCE — DESKTOP (základ)
   ============================ */
#otrock-kyberneticka-bezpecnost-postup.otrock-workflow{
  background: var(--otrock-font-color-secondary);
}

.otrock-workflow__bg{
  position: relative;
  padding: 96px 0 96px 0;
}

/* Full-width rail přes celou stránku (100vw), v polovině čísel */
.otrock-workflow__bg::before{
  content:"";
  position: absolute;
  left:50%;
  transform: translateX(-50%);
  width:100vw;               /* full width */
  height:2px;
  background:#0744F8;        /* barva aktivních čísel */
  top: var(--otrock-rail-top, 0px); /* JS sem zapíše střed čísel */
  z-index:1;                 /* pod čísly, nad pozadím */
}

/* head */
.otrock-workflow__head{ text-align:center; margin-bottom:60px; }

/* scroller wrapper (desktop bez scrollu) */
.otrock-workflow__scroller{ position:relative; }

/* GRID */
.otrock-workflow__grid{
  --otrock-workflow-num-size: 72px;   /* bylo 40/44px */
  --otrock-workflow-num-font: 28px;   /* NOVÉ: velikost čísla */
  --otrock-workflow-num-bg:#373D5C;
  --otrock-workflow-active:#0744F8;

  display:grid;
  grid-template-columns: repeat(var(--otrock-workflow-items, 4), 1fr);
  gap: 64px;
  list-style:none;
  padding:0;
  margin:0;
  position:relative;
  z-index:2; /* čísla a texty nad railem */
}

.otrock-workflow__item{
  display:flex; flex-direction:column; align-items:flex-start;
}

.otrock-workflow__num{
  width:var(--otrock-workflow-num-size);
  height:var(--otrock-workflow-num-size);
  border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center;
  font-weight:700; color:#fff;
  background:var(--otrock-workflow-num-bg);
  transition:background .2s ease, transform .2s ease;
    font-size: var(--otrock-workflow-num-font);
}

/* Titulek + text berou globální typografii */
.otrock-workflow__item-title{ margin:20px 0 20px; }
.otrock-workflow__item-body{ margin:0; }

/* Aktivní = číslo + všechny předchozí (JS přidává .is-active na každou z nich) */
.otrock-workflow__item.is-active .otrock-workflow__num{
  background:var(--otrock-workflow-active);
  transform: translateY(-1px);
}

/* ============================
   POSTUP SPOLUPRÁCE — MOBIL (<=768px)
   ============================ */
@media (max-width: 768px){
  .otrock-workflow__bg{ padding:64px 0; }

  .otrock-workflow__scroller{
    overflow-x:auto; -webkit-overflow-scrolling:touch; padding-bottom:8px;
  }
  .otrock-workflow__grid{
    grid-auto-flow:column;
    grid-auto-columns:70%;      /* vidět 1. + kousek 2. */
    grid-template-columns:unset;
    gap:48px; padding:15px 4px;
    scroll-snap-type:x mandatory;

  }
  .otrock-workflow__item{ scroll-snap-align:start; }
  .otrock-workflow__num{  --otrock-workflow-num-size: 50px;   /* bylo 40/44px */
  --otrock-workflow-num-font: 28px;}
}

/* ============================
   POSTUP SPOLUPRÁCE — TABLET ONLY (768–1024px)
   (tablet = stejné jako mobil)
   ============================ */
@media (min-width:768px) and (max-width:1024px){
  .otrock-workflow__bg{ padding:64px 0; }

  .otrock-workflow__scroller{
    overflow-x:auto; -webkit-overflow-scrolling:touch; padding-bottom:8px;
  }
  .otrock-workflow__grid{
    grid-auto-flow:column;
    grid-auto-columns:70%;      /* vidět 1. + kousek 2. */
    grid-template-columns:unset;
    gap:48px; padding:0 4px;
    scroll-snap-type:x mandatory;
  }
  .otrock-workflow__item{ scroll-snap-align:start; }
  .otrock-workflow__num{  --otrock-workflow-num-size: 50px;   /* bylo 40/44px */
  --otrock-workflow-num-font: 28px; }
}

/* ============================
   FAQ — DESKTOP (základ)
   ============================ */
.otrock-faq{
  background: var(--otrock-font-color-secondary);
  padding-top: 96px;
  padding-bottom: 96px;

}

.otrock-faq {

}

.otrock-faq__head{
  text-align: center;
  max-width: 820px;
  margin: 0 auto 40px auto;
}
.otrock-faq__head .otrock-paragraph-body{ margin-bottom: 0; }

.otrock-faq__list{
  list-style: none;
  margin: 0 auto;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 24px;
  max-width: 80%;
}

/* karta (zavřená) – glass + hairline */
.otrock-faq__item{
  border-radius: 24px;
  background: rgba(255,255,255,0.10);
  border: 1px solid rgba(19,72,239,0.5);
  box-shadow: inset 0 0 20px rgba(255,255,255,0.10);
  -webkit-backdrop-filter: blur(50px);
  backdrop-filter: blur(50px);
  overflow: hidden;
  transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.otrock-faq__item.is-hidden{ display: none; }

/* trigger – fix overflow + symetrie ikon */
.otrock-faq__trigger{
  all: unset;
  box-sizing: border-box;            /* ← zabrání přesahu přes kontejner */
  display: grid;
  grid-template-columns: 40px 1fr 40px;
  align-items: center;
  gap: 14px;
  width: 100%;
  padding: 20px 24px;               /* 24px vlevo/vpravo → plus je stejně daleko jako otazník */
  cursor: pointer;
}
.otrock-faq__qicon,
.otrock-faq__toggle{
  width: 40px; height: 40px;
  display: inline-flex; align-items: center; justify-content: center;
}
.otrock-faq__toggle{ justify-self: end; }
.otrock-faq__qicon img,
.otrock-faq__toggle img{  width: 24px;
  height: 24px;
  aspect-ratio: 1 / 1;
  display: block; }

.otrock-faq__cross{ display: none; }
.otrock-faq__plus{  display: block; }

/* odpověď je standardně skrytá */
.otrock-faq__answer{ 
  display: none;
  padding: 0 24px 20px 64px;        /* zarovnání pod textem otázky (40 ikona + 24 mezera) */
}
.otrock-faq__answer .otrock-paragraph-body{ margin: 0; }

/* otevřený stav – gradient dle Figmy + ring bez layout shiftu */
.otrock-faq__item.is-open{
  background:
    linear-gradient(180deg, rgba(4,66,249,0) 0%, rgba(4,66,249,1) 100%),
    rgba(255,255,255,0.05);
  border-color: #1348EF;            /* šířka zůstává 1px → bez posunu */
  /* extra 1px „ring“ místo zvětšení borderu */
  box-shadow:
    0 0 0 1px #1348EF,
    inset 0 0 20px rgba(255,255,255,0.10);
}
.otrock-faq__item.is-open .otrock-faq__plus{  display: none; }
.otrock-faq__item.is-open .otrock-faq__cross{ display: block; }
.otrock-faq__item.is-open .otrock-faq__answer{ display: block; }

/* „Zobrazit více otázek“ */
.otrock-faq__more{

  display: flex; justify-content: center; margin-top: 40px; margin-bottom: 0;
}
.otrock-faq__morebtn{
  border-radius: 10px;
  display: inline-flex; align-items: center; gap: 8px;
}

/* Stroke uvnitř 0.5px + fill */
.otrock-faq__more .otrock-faq__morebtn{
  border: .5px solid transparent;           /* „Inside“ efekt */
  border-radius: 10px;
  background-color: #16203F;

  /* 1) fill  2) gradientní stroke shora dolů (#637FB1 → transparent) */
  background-image:
    linear-gradient(#16203F, #16203F),
    linear-gradient(180deg, #637FB1 0%, rgba(99,127,177,0) 100%);
  background-origin: border-box;
  background-clip: padding-box, border-box;

box-shadow: inset 0 0 20px rgba(255, 255, 255, 0.10);
}

/* HOVER: mění se jen fill dle Figmy (zleva→doprava), stroke zůstává */
.otrock-faq__more .otrock-faq__morebtn:hover{
  background-image:
    linear-gradient(to right, #1348EF 0%, rgba(19,72,239,0) 100%),
    linear-gradient(180deg, #637FB1 0%, rgba(99,127,177,0) 100%);
    box-shadow: none;
    color: #FFF;
}
/* spodní CTA řádek */
.otrock-faq__cta{
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 16px;
  margin-top: 40px;
  max-width: 80%;
  margin: 40px auto 0 auto;
}
.otrock-faq__cta .otrock-h6{ margin: 0; }

/* ============================
   MOBIL (<=768px)
   ============================ */
@media (max-width: 768px){
  .otrock-faq{ padding-top: 64px; padding-bottom: 64px; }

  .otrock-faq__trigger{
    grid-template-columns: 1fr 40px;
    grid-template-rows: 40px auto;
    gap: 12px;
    padding: 16px;
  }
  .otrock-faq__qicon{ grid-column: 1 / 2; grid-row: 1 / 2; justify-content: flex-start; }
  .otrock-faq__toggle{ grid-column: 2 / 3; grid-row: 1 / 2; justify-content: flex-end; }
  .otrock-faq__question{ grid-column: 1 / -1; grid-row: 2 / 3; }

  .otrock-faq__answer{ padding: 0 16px 16px 16px; }

  .otrock-faq__cta{
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .otrock-faq__cta a{ width: 100%; justify-content: center; }
  .otrock-faq__cta .otrock-h6  {
	text-align: center;
}

.otrock-faq__cta{

  max-width: 100%;
}

.otrock-faq__list{

  max-width: 100%;
}
}

/* ============================
   TABLET ONLY (768–1024px) — stejné jako mobil
   ============================ */
@media (min-width: 768px) and (max-width: 1024px){
    .otrock-faq{ padding-top: 64px; padding-bottom: 64px; }

  .otrock-faq__trigger{
    grid-template-columns: 1fr 40px;
    grid-template-rows: 40px auto;
    gap: 12px;
    padding: 16px;
  }
  .otrock-faq__qicon{ grid-column: 1 / 2; grid-row: 1 / 2; justify-content: flex-start; }
  .otrock-faq__toggle{ grid-column: 2 / 3; grid-row: 1 / 2; justify-content: flex-end; }
  .otrock-faq__question{ grid-column: 1 / -1; grid-row: 2 / 3; }

  .otrock-faq__answer{ padding: 0 16px 16px 16px; }

  .otrock-faq__cta{
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .otrock-faq__cta a{ width: 100%; justify-content: center; }

.otrock-faq__cta .otrock-h6  {
	text-align: center;
}

.otrock-faq__cta{

  max-width: 100%;
}

.otrock-faq__list{

  max-width: 100%;
}

}

/* výchozí stav: vidět jen plus */
.otrock-faq__toggle .otrock-faq__plus{  display: block; }
.otrock-faq__toggle .otrock-faq__cross{ display: none; }

/* otevřeno: vidět jen křížek */
.otrock-faq__item.is-open .otrock-faq__toggle .otrock-faq__plus{  display: none; }
.otrock-faq__item.is-open .otrock-faq__toggle .otrock-faq__cross{ display: block; }

.otrock-faq__toggle .otrock-faq__cross{
  transform: scale(0.5);      /* případně dolaď: 0.78–0.86 */
  transform-origin: 50% 50%;
}

/* ============================
   CTA SPLIT — DESKTOP (základ)
   ============================ */
.otrock-cta-split{
  background: var(--otrock-font-color-secondary);
  padding-top: 96px;
  padding-bottom: 96px;
}

.otrock-cta-split__head{ margin-bottom: 24px; text-align: left; }

.otrock-cta-split__grid{
  display: grid;
  grid-template-columns: 0.37fr 0.63fr; /* 40% | 60% */
  gap: 160px;                          /* stejné rozestupy */
  align-items: start;                  /* vše nahoře */
  grid-template-areas: "media content";
}
.otrock-cta-split__grid.is-reversed-desktop{
  grid-template-areas: "content media";
}

.otrock-cta-split__media{ grid-area: media; display:flex; align-items:flex-start; justify-content:center; }
.otrock-cta-split__image{ width:100%; height:auto; display:block; border-radius:24px; width: 90%;}

.otrock-cta-split__content{
  grid-area: content;
  display:flex; flex-direction:column; gap:16px;
  height: 100%;
  justify-content: center;
}

/* Nadpis + odstavec mají na desktopu cca 75 % šířky */
.otrock-cta-split__title,
.otrock-cta-split__content .otrock-paragraph-body{
  width: 75%;
  margin: 0; /* držíme konzistentní odsazení */
}

.single-post .otrock-paragraph-body, .single-post .otrock-cta-split__title {
  width: 100%;
}
/* Tlačítko NENÍ full width na desktopu (override) */
.otrock-cta-split .otrock-btn-full, .otrock-cta-split .otrock-btn-kontakt, .single-post .otrock-btn-kontakt{
  width: auto;
  align-self: flex-start;  /* drží se vlevo u textu */
  margin-top: 20px;
}

.single-post .otrock-cta-split__grid {
    gap: 80px;
}

/* ============================
   MOBIL (<=768px)
   ============================ */
@media (max-width: 768px){
	.otrock-cta-split .otrock-btn-full, .otrock-cta-split .otrock-btn-kontakt {

    align-self: center;
}

  .otrock-cta-split{ padding-top: 64px; padding-bottom: 64px; }
  .otrock-cta-split__head{ text-align:center; }

  .otrock-cta-split__grid,
  .otrock-cta-split__grid.is-reversed-desktop{
    grid-template-columns: 1fr;
    grid-template-areas:
      "media"
      "content";   /* na mobilu je obrázek vždy první */
    gap: 64px;
  }

  .otrock-cta-split__media{ justify-content:center; }
  .otrock-cta-split__image{ max-width: 420px; }

  /* Nadpis a text na střed + plná šířka */
  .otrock-cta-split__content{
    align-items: center;
    text-align: center;
  }
  .otrock-cta-split__title,
  .otrock-cta-split__content .otrock-paragraph-body{
    width: 100%;
  }

  /* Tlačítko JE full width na mobilu */
  .otrock-cta-split .otrock-btn-full{
    width: 100%;
    align-self: stretch;
    text-align: center;
  }
}

/* ============================
   TABLET ONLY (768–1024px) — stejné jako mobil
   ============================ */
@media (min-width: 768px) and (max-width: 1024px){
  .otrock-cta-split{ padding-top: 64px; padding-bottom: 64px; }
  .otrock-cta-split__head{ text-align:center; }
	.otrock-cta-split .otrock-btn-full, .otrock-cta-split .otrock-btn-kontakt {

    align-self: center;
}
  .otrock-cta-split__grid,
  .otrock-cta-split__grid.is-reversed-desktop{
    grid-template-columns: 1fr;
    grid-template-areas:
      "media"
      "content";
    gap: 64px;
  }

  .otrock-cta-split__media{ justify-content:center; }
  .otrock-cta-split__image{ max-width: 520px; }

  .otrock-cta-split__content{
    align-items: center;
    text-align: center;
  }
  .otrock-cta-split__title,
  .otrock-cta-split__content .otrock-paragraph-body{
    width: 100%;
  }

  .otrock-cta-split .otrock-btn-full{
    width: 100%;
    align-self: stretch;
    text-align: center;
  }
}

/* =========================================
   DALŠÍ SLUŽBY (Global) — DESKTOP (základ)
   ======================================= */
#otrock-kyberneticka-bezpecnost-dalsi-sluzby.otrock-dalsi-sluzby{
  background: var(--otrock-font-color-secondary);
  padding-top: 96px;
  padding-bottom: 96px;
}

.otrock-dalsi-sluzby .otrock-blog__arrows {
	margin-top: 0;
}

.otrock-dalsi-sluzby .otrock-h3, .otrock-dalsi-sluzby .otrock-h6{
	margin-bottom: 0;
}

.otrock-dalsi-sluzby__head{
  display:flex; align-items:center; justify-content:space-between;
  gap:16px; margin-bottom: 40px;
}

/* Karta = „FAQ efekt“ (hairline + inner shadow + gradient on hover) */
.otrock-service-box{
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 24px;
  padding: 32px;
  min-height: 360px;
  border-radius: 24px;

  /* Base efekt (stejný jako FAQ, viz zadání) */
  background-color: rgb(22, 32, 63);
  background-image:
    linear-gradient(rgb(22, 32, 63), rgb(22, 32, 63)),
    linear-gradient(rgb(99, 127, 177) 0%, rgba(99, 127, 177, 0) 100%);
  background-origin: border-box;
  background-clip: padding-box, border-box;
  box-shadow: rgba(255, 255, 255, 0.1) 0px 0px 20px inset;
  border-width: 0.5px;
  border-style: solid;
  border-color: transparent;
  transition: background-image .25s ease, box-shadow .25s ease, transform .25s ease;
}
/* Hover: gradient podle barvy položky */
/* Hover: gradient podle Figma (0%→100%, 70% opacity) + jemná bílá 5% */
.otrock-service-box:hover{
 border-radius: 24px;
border: 1px solid var(--Gradients-Services-color-gradient, #343DB4);
background: var(--Gradients-Hover-box, linear-gradient(92deg, rgba(4, 66, 249, 0.00) 0%, rgba(4, 66, 249, 0.70) 100%), rgba(255, 255, 255, 0.05));     
  background-clip: padding-box, padding-box, border-box; /* 3 vrstvy = 3 clippy */
  box-shadow: 0 14px 50px rgba(0,0,0,.25), inset 0 0 20px rgba(255,255,255,.10);
}
/* Obsah karty */
.otrock-service-box__icon{
  width: 50px; height: 50px; display: inline-flex; align-items:center; justify-content:center;
}
.otrock-service-box__icon img{ width:100%; height:100%; object-fit:contain; display:block; }

/* CTA šipka vpravo dole */
.otrock-service-box__cta{
  position: absolute;
  right: 24px; bottom: 24px;
  width: 48px; height: 48px;
  border-radius: 50%;
  background: #0744F8;
  display:inline-flex; align-items:center; justify-content:center;
  text-decoration: none;
}
.otrock-service-box__cta img{ width: 40px; height: 40px; display:block; }

/* Slider baseline (když nechceme tahat glide.css globálně) */
#otrock-kyberneticka-bezpecnost-dalsi-sluzby .glide__track{ overflow:hidden; }
#otrock-kyberneticka-bezpecnost-dalsi-sluzby .glide__slides{
  display:flex; margin:0; padding:0; list-style:none; will-change: transform;
}
#otrock-kyberneticka-bezpecnost-dalsi-sluzby .glide__slide{ flex-shrink:0; }

/* --- Mobilní list / Tablet (stejné) --- */
.otrock-dalsi-sluzby__mobile{ display: none; }
.otrock-dalsi-sluzby__list{
  list-style:none; margin:0; padding:0; display:grid; grid-template-columns:1fr; gap:24px;
}
.otrock-service-box--mobile{
  min-height: unset; text-align:center; padding:24px;
}
.otrock-service-box--mobile .otrock-paragraph-body-small,
.otrock-service-box--mobile .otrock-service-box__cta{ display:none!important; }
.otrock-service-box--mobile .otrock-service-box__icon{ margin: 0 auto 8px auto; }

/* =========================================
   MOBIL (<=768px)
   ======================================= */
@media (max-width: 768px){
	.otrock-service-box {
		gap: 0;
	}
  #otrock-kyberneticka-bezpecnost-dalsi-sluzby.otrock-dalsi-sluzby{
    padding-top: 64px; padding-bottom: 64px;
  }

  .otrock-dalsi-sluzby__head{
    justify-content:center; text-align:center;
  }
  .otrock-dalsi-sluzby__head .otrock-blog__arrows{ display:none !important; } /* žádné šipky */

  .otrock-dalsi-sluzby__slider{ display:none !important; }
  .otrock-dalsi-sluzby__mobile{ display:block; }
}

/* =========================================
   TABLET ONLY (768–1024px) — stejné jako mobil
   ======================================= */
@media (min-width: 768px) and (max-width: 1024px){
		.otrock-service-box {
		gap: 0;
	}
  #otrock-kyberneticka-bezpecnost-dalsi-sluzby.otrock-dalsi-sluzby{
    padding-top: 64px; padding-bottom: 64px;
  }

  .otrock-dalsi-sluzby__head{
    justify-content:center; text-align:center;
  }
  .otrock-dalsi-sluzby__head .otrock-blog__arrows{ display:none !important; }

  .otrock-dalsi-sluzby__slider{ display:none !important; }
  .otrock-dalsi-sluzby__mobile{ display:block; }
}

.otrock-service-box--mobile .otrock-service-box__titlelink{ color:inherit; text-decoration:none; }
.otrock-service-box--mobile .otrock-service-box__titlelink:hover{ text-decoration:underline; }

/* =========================================
   FEATURED ITEMS (Global) — DESKTOP (základ)
   ======================================= */
#otrock-sitova-infrastruktura-featured-items.otrock-featured-items{
  background: var(--otrock-font-color-secondary);
  padding-top: 96px;
  padding-bottom: 96px;
}

.otrock-featured-items__grid{
  list-style: none;
  margin: 0;
  padding: 0;

  display: grid;
  grid-template-columns: repeat(5, 1fr); /* 5 vedle sebe */
  gap: 32px;
  text-align: center;
  align-items: start;
}

.otrock-featured-items__item{ 
  display: flex;
  flex-direction: column;
  align-items: center;
}

.otrock-featured-items__icon{
  width: 75px; height: 75px;
  margin-bottom: 20px;
}
.otrock-featured-items__icon img{
  width: 100%; height: 100%; object-fit: contain; display: block;
}

.otrock-featured-items__text{ margin: 0; }

/* =========================================
   MOBIL (<=768px)
   ======================================= */
@media (max-width: 768px){

	#otrock-sitova-infrastruktura-featured-items.otrock-featured-items{
  padding-top: 64px;
  padding-bottom: 64px;
}
  .otrock-featured-items__grid{
    grid-template-columns: 1fr; /* pod sebou */
    gap: 20px;
  }
  .otrock-featured-items__icon{
    width: 44px; height: 44px;
  }
}

/* =========================================
   TABLET ONLY (768–1024px) — VŽDY POSLEDNÍ
   ======================================= */
@media (min-width: 768px) and (max-width: 1024px){
		#otrock-sitova-infrastruktura-featured-items.otrock-featured-items{
  padding-top: 64px;
  padding-bottom: 64px;
}
  .otrock-featured-items__grid{
    grid-template-columns: 1fr; /* stejné jako mobil */
    gap: 20px;
  }
  .otrock-featured-items__icon{
    width: 44px; height: 44px;
  }
}

/* ============================
   SÍŤOVÁ INFRASTRUKTURA – 3 karty v řadě
   ============================ */
#otrock-sitova-infrastruktura-vyhody .otrock-threats__grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

#otrock-sitova-infrastruktura-vyhody .otrock-threat-card--short { 
	height: 300px;
}

/* Mobil (<=768px): pod sebou */
@media (max-width: 768px){
  #otrock-sitova-infrastruktura-vyhody .otrock-threats__grid{
    grid-template-columns: 1fr;
    gap: 24px;
  }
}

/* SÍŤOVÁ INFRASTRUKTURA – full-width pozadí + vertikální paddingy */
/* DESKTOP (základ) */
#otrock-sitova-infrastruktura-vyhody.otrock-threats{
  background: var(--otrock-font-color-secondary);
  padding-top: 96px;
  padding-bottom: 96px;
}

/* MOBIL (<=768px) */
@media (max-width: 768px){
  #otrock-sitova-infrastruktura-vyhody.otrock-threats{
    padding-top: 64px;
    padding-bottom: 64px;
  }

  #otrock-sitova-infrastruktura-vyhody .otrock-threat-card--short { 
	height: 200px;
}

}

/* TABLET ONLY (768–1024px) — VŽDY POSLEDNÍ */
@media (min-width: 768px) and (max-width: 1024px){
	  #otrock-sitova-infrastruktura-vyhody .otrock-threats__grid{
    grid-template-columns: 1fr;
    gap: 24px;
  }

  #otrock-sitova-infrastruktura-vyhody.otrock-threats{
    padding-top: 64px;
    padding-bottom: 64px;
  }
}

/* ============================
   TELEFONY – 2 karty v řádku, asymetrie
   ============================ */

/* Desktop (základ): wide+narrow / narrow+wide */
#otrock-telefony-vyhody.otrock-threats{
  background: var(--otrock-font-color-secondary);
  padding-top: 96px;
  padding-bottom: 96px;
}
/* TELEFONY – zig-zag 60/40 (širší ≈ 58.3 %, užší ≈ 41.7 %) */
/* DESKTOP (základ) */
#otrock-telefony-vyhody .otrock-threats__grid{
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 24px;
}

/* 1. řádek: široká vlevo (7/12), úzká vpravo (5/12) */
#otrock-telefony-vyhody .otrock-threats__grid .otrock-threat-card:nth-child(1){ grid-column: 1 / span 7; }
#otrock-telefony-vyhody .otrock-threats__grid .otrock-threat-card:nth-child(2){ grid-column: 8 / span 5; }

/* 2. řádek: úzká vlevo (5/12), široká vpravo (7/12) */
#otrock-telefony-vyhody .otrock-threats__grid .otrock-threat-card:nth-child(3){ grid-column: 1 / span 5; }
#otrock-telefony-vyhody .otrock-threats__grid .otrock-threat-card:nth-child(4){ grid-column: 6 / span 7; }

/* výška karet pro tuto sekci (ponecháš, případně už máš) */
#otrock-telefony-vyhody .otrock-threat-card--short{ height: 400px; }

/* MOBIL (<=768px) */
@media (max-width: 768px){
		#otrock-telefony-vyhody.otrock-threats{
  padding-top: 64px;
  padding-bottom: 64px;
}

  #otrock-telefony-vyhody .otrock-threats__grid{
    grid-template-columns: 1fr;
  }
  #otrock-telefony-vyhody .otrock-threats__grid .otrock-threat-card{
    grid-column: auto !important;
  }
  #otrock-telefony-vyhody .otrock-threat-card--short{ height: 210px; }
}

/* TABLET ONLY (768–1024px) */
@media (min-width: 768px) and (max-width: 1024px){
	#otrock-telefony-vyhody.otrock-threats{
  padding-top: 64px;
  padding-bottom: 64px;
}

  #otrock-telefony-vyhody .otrock-threats__grid{
    grid-template-columns: 1fr;
  }
  #otrock-telefony-vyhody .otrock-threats__grid .otrock-threat-card{
    grid-column: auto !important;
  }
}

/* Head uprostřed přes celý blok */
.otrock-protect__head{
  text-align: center;
  max-width: 880px;
  margin: 0 auto 40px;
}

.otrock-protect__head-center{
  text-align: center;
  max-width: 880px;
  margin: 0 auto 40px;
}
.otrock-protect__headtitle{ margin: 0 0 96px 0; }

/* ============================
   TV/SAT — Použité technologie (DESKTOP)
   ============================ */
#otrock-tv-sat-technologie.otrock-techcards{
  padding-top: 96px;
  padding-bottom: 96px;
    background: var(--otrock-font-color-secondary);

}

#otrock-tv-sat-technologie-2.otrock-techcards{
  padding-bottom: 96px;
    background: var(--otrock-font-color-secondary);

}

#otrock-certifikace-tri {
  padding-bottom: 96px;


}

.otrock-techcards__head{
  text-align: center;
  margin-bottom: 40px;
}

.otrock-techcards__grid{
  display: grid;
  grid-template-columns: 1fr 1fr; /* 2 karty vedle sebe */
  gap: 24px;
  align-items: stretch;
}

#otrock-certifikace-tri .otrock-techcards__grid{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr; /* 2 karty vedle sebe */
  gap: 24px;
  align-items: stretch;
}

/* Karta podle Figmy: gradient bg + 0.5px stroke + inner shadow */
.otrock-techcards__card{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 50px;
  gap: 24px;
  min-height: 250px;

  background: linear-gradient(141.12deg, #060E37 42.16%, #1348EF 123.6%);
  border: 0.5px solid rgba(255,255,255,0.2);      /* Strokes/Stroke cards */
  box-shadow: inset 0 0 20.9px rgba(255,255,255,0.1); /* Card effect/Inner shadow */
  border-radius: 24px;
}

.otrock-techcards__card .otrock-h5 {
	margin: 0;
}

/* Seznam technologií */
.otrock-techcards__list{
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.otrock-techcards__item .otrock-h6{
  margin: 0;                 /* H6 bez extra mezery */
  display: inline-flex;
  align-items: center;
  gap: 6px;                  /* mezera mezi H6 a small textem */
}

.otrock-techcards__item .otrock-paragraph-body-small{
  margin: 0;
}
#centersloupec { 
padding-top: 0;
}
#centersloupec   .otrock-zigzag__wrap {  justify-content: center; max-width: 100%;}

#centersloupec .otrock-zigzag__infobox {
	bottom: -30%;
}

#centersloupec .otrock-h6  {margin: 0}

/* ============================
   MOBIL (<=768px)
   ============================ */
@media (max-width: 768px){
	#otrock-certifikace-tri {
  padding-bottom: 64px;


}

	#trisloupce .otrock-zigzag__wrap {
    flex-direction: column;
        align-items: center;
}

#centersloupec { 

}

.otrock-zigzag__left {
	flex: auto!important;
}

.otrock-zigzag__left .otrock-badge {
	display: block!important;
	margin: 0 auto;
}
  #otrock-tv-sat-technologie.otrock-techcards{
    padding-top: 64px;
    padding-bottom: 64px;
  }
    #otrock-tv-sat-technologie-2.otrock-techcards{
    padding-bottom: 64px;
  }
  .otrock-techcards__grid{
    grid-template-columns: 1fr;  /* karty pod sebou */
    gap: 24px;
  }
  	#centersloupec .otrock-zigzag__infobox {
	bottom: 0;
}
}

/* ============================
   TABLET ONLY (768–1024px) — VŽDY POSLEDNÍ BLOK
   ============================ */
@media (min-width: 768px) and (max-width: 1024px){
		#otrock-certifikace-tri {
  padding-bottom: 64px;


}


	#centersloupec .otrock-zigzag__infobox {
	bottom: 0;
}
	#trisloupce .otrock-zigzag__wrap {
    flex-direction: column;
        align-items: center;
}


.otrock-zigzag__left {
	flex: auto!important;
}

.otrock-zigzag__left .otrock-badge {
	display: block!important;
	margin: 0 auto;
}
  #otrock-tv-sat-technologie.otrock-techcards{
    padding-top: 64px;
    padding-bottom: 64px;
  }
    #otrock-tv-sat-technologie-2.otrock-techcards{
    padding-bottom: 64px;
  }
  .otrock-techcards__grid{
    grid-template-columns: 1fr;  /* karty pod sebou */
    gap: 24px;
  }

  #otrock-certifikace-tri .otrock-techcards__grid {
    grid-template-columns: 1fr;  /* karty pod sebou */
    gap: 24px;
  }
}

/* MOBIL (<=768px) — H6 + small v jedné větě, žádné 2 sloupce */
@media (max-width: 768px){
	  #otrock-certifikace-tri .otrock-techcards__grid {
    grid-template-columns: 1fr;  /* karty pod sebou */
    gap: 24px;
  }
  .otrock-techcards__item .otrock-h6{
    display: inline;           /* místo inline-flex */
    white-space: normal;       /* dovolí běžné zalamování */
    gap: 0;                    /* pro jistotu vynulovat */
  }
  .otrock-techcards__item .otrock-paragraph-body-small{
    display: inline;           /* malej text pokračuje za H6 */     /* mezera mezi H6 a small */
    white-space: normal;
  }
}

/* TABLET ONLY (768–1024px) — stejné jako mobil (vždy poslední blok) */
@media (min-width: 768px) and (max-width: 1024px){
  .otrock-techcards__item .otrock-h6{
    display: inline;
    white-space: normal;
    gap: 0;
  }
  .otrock-techcards__item .otrock-paragraph-body-small{
    display: inline;
    white-space: normal;
  }
}

/* =========================================
   TV/SAT – Co to znamená — DESKTOP (základ)
   ======================================= */
#otrock-tv-sat-co-to-znamena.otrock-co-to-znamena{
  background: var(--otrock-font-color-secondary);
  padding-top: 96px;
  padding-bottom: 96px;
}

.otrock-co-to-znamena__grid{
  display: grid;
 grid-template-columns: 1fr 2fr; /* ← 33% / 67% poměr */
  align-items: center;
  gap: 64px;
}

.otrock-co-to-znamena__left{
  text-align: left;
}

.otrock-co-to-znamena__right{
  display: block;
}

.otrock-co-to-znamena__list{
  list-style: none;
  margin: 0;
  padding: 0;

  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 64px;
}

.otrock-co-to-znamena__item{
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
}



/* =========================================
   MOBIL (<=768px)
   ======================================= */
@media (max-width: 768px){
  #otrock-tv-sat-co-to-znamena.otrock-co-to-znamena{
    padding-top: 64px;
    padding-bottom: 64px;
  }



  .otrock-co-to-znamena__grid{
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .otrock-co-to-znamena__left{
    text-align: center;
  }

  .otrock-co-to-znamena__list{
    grid-template-columns: 1fr;   /* položky pod sebou */
    gap: 20px;
  }
}

/* =========================================
   TABLET ONLY (768–1024px) — VŽDY POSLEDNÍ BLOK
   ======================================= */
@media (min-width: 768px) and (max-width: 1024px){
  #otrock-tv-sat-co-to-znamena.otrock-co-to-znamena{
    padding-top: 64px;
    padding-bottom: 64px;
  }

  .otrock-co-to-znamena__grid{
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .otrock-co-to-znamena__left{
    text-align: center;
  }

  .otrock-co-to-znamena__list{
    grid-template-columns: 1fr;   /* stejné jako mobil */
    gap: 20px;
  }
}

/* ============================
   TV/SAT — PROČ VYBRAT (benefits) — DESKTOP (základ)
   ============================ */
#otrock-tv-sat-proc-vybrat.otrock-benefits{
  background: var(--otrock-font-color-secondary);
  padding-top: 96px;
  padding-bottom: 96px;
}

.otrock-benefits__head{
  text-align: center;
  margin: 0 auto 40px auto;
}

.otrock-benefits__grid-2{
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr); /* 3 na řádek */
  gap: 48px;
  align-items: start;
}

.otrock-benefit{
  text-align: center;
}

.otrock-benefit__media{
  width: 164px;
  margin: 0 auto 20px auto;

  overflow: hidden;
  /* jemné pozadí, když se obrázek načítá */
}
.otrock-benefit__media img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.otrock-benefit__title{ margin: 0 0 8px 0; }
.otrock-benefit__text{ margin: 0; }

/* ============================
   MOBIL (<=768px)
   ============================ */
@media (max-width: 768px){
	.otrock-zigzag__btn {
		width: 100%;
	}
  #otrock-tv-sat-proc-vybrat.otrock-benefits{
    padding-top: 64px;
    padding-bottom: 64px;
  }

  .otrock-benefits__grid{
    grid-template-columns: 1fr;  /* jeden item na řádek */
    gap: 24px;
  }

    .otrock-benefits__grid-2{
    grid-template-columns: 1fr;  /* jeden item na řádek */
    gap: 24px;
  }

  .otrock-benefit{
    text-align: center; /* vše na střed */
  }

  .otrock-benefit__media{
    width: 140px;
    margin-bottom: 12px;
  }
}

/* ============================
   TABLET ONLY (768–1024px) — stejné jako mobil
   ============================ */
@media (min-width: 768px) and (max-width: 1024px){
		.otrock-zigzag__btn {
		width: 100%;
	}
  #otrock-tv-sat-proc-vybrat.otrock-benefits{
    padding-top: 64px;
    padding-bottom: 64px;
  }
      .otrock-benefits__grid-2{
    grid-template-columns: 1fr;  /* jeden item na řádek */
    gap: 24px;
  }


  .otrock-benefits__grid{
    grid-template-columns: 1fr;  /* jeden item na řádek */
    gap: 24px;
  }

  .otrock-benefit{
    text-align: center;
  }

  .otrock-benefit__media{
    width: 140px;
    margin-bottom: 12px;
  }
}

.page-template-page-audio-video .otrock-partners__grid {
    display: grid
;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
    align-items: center;
    margin: 0 auto;
    max-width: 80%;
}


@media (max-width: 768px){
.page-template-page-audio-video .otrock-partners__grid {
    grid-template-columns: repeat(1, 1fr);
    max-width: 100%;
}

}

/* ============================
   TABLET ONLY (768–1024px) — stejné jako mobil
   ============================ */
@media (min-width: 768px) and (max-width: 1024px){
.page-template-page-audio-video .otrock-partners__grid {
 grid-template-columns: repeat(1, 1fr);
    max-width: 100%;
}
}

/* ============================
   AUDIO/VIDEO — NABÍDKA SLUŽEB (2 sloupce)
   DESKTOP (základ)
   ============================ */
#otrock-audio-video-nabidka-sluzeb.otrock-av-offer{
  background: var(--otrock-font-color-secondary);
  padding-top: 96px;
  padding-bottom: 96px;
}

.otrock-av-offer__grid{
  display: grid;
  grid-template-columns: 1fr 1fr;  /* 50/50 */
  gap: 64px;
  align-items: start;
}

.otrock-av-offer__title{ margin-bottom: 12px; }
.otrock-av-offer__list{
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.otrock-av-offer__item{
  display: grid;
  grid-template-columns: 28px 1fr; /* ikonka | text */
  align-items: start;
  column-gap: 12px;
}

.otrock-av-offer__icon{
  width: 28px; height: 28px;
  display: inline-flex; align-items: center; justify-content: center;
}
.otrock-av-offer__icon img{
  width: 100%; height: 100%; object-fit: contain; display: block;
}
.otrock-av-offer__itemtitle{ margin: 0; }

/* MOBIL (<=768px) */
@media (max-width: 768px){
  #otrock-audio-video-nabidka-sluzeb.otrock-av-offer{
    padding-top: 64px;
    padding-bottom: 64px;
  }
  .otrock-av-offer__grid{
    grid-template-columns: 1fr; /* pod sebou */
    gap: 24px;
    text-align: center;
  }

  .otrock-av-offer__item{
    grid-template-columns: 28px auto;
    text-align: left;     /* text u položek zůstává zarovnaný vlevo kvůli čitelnosti */
  }
}

/* TABLET ONLY (768–1024px) — stejné jako mobil (VŽDY POSLEDNÍ BLOK) */
@media (min-width: 768px) and (max-width: 1024px){
  .otrock-av-offer__grid{
    grid-template-columns: 1fr;
    gap: 24px;
    text-align: center;
  }

  .otrock-av-offer__item{
    grid-template-columns: 28px auto;
    text-align: left;
  }
}

/* =========================================
   AUDIO/VIDEO — Nabídka služeb
   DESKTOP (základ)
   ========================================= */
#otrock-audio-video-nabidka-sluzeb.otrock-av-offer{
  padding-top: 96px;
  padding-bottom: 96px;
}

.otrock-av-offer__head{
  margin-bottom: 24px;      /* badge nad celou sekcí */
}

.otrock-av-offer__grid{
  display: grid;
  grid-template-columns: 1fr 1fr;  /* 50/50 */
  gap: 96px;
  align-items: start;              /* H3 a list začínají v jedné rovině */
}

.otrock-av-offer__title{ margin: 0 0 12px 0; }

.otrock-av-offer__list{
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

/* položka seznamu: text vertikálně zarovnat k ikoně */
.otrock-av-offer__item{
  display: grid;
  grid-template-columns: 50px 1fr; /* ikona | text */
  align-items: center;             /* vertikální zarovnání k ikoně */
  column-gap: 24px;
}

.otrock-av-offer__icon{
  width: 50px; height: 50px;
  display: inline-flex; align-items: center; justify-content: center;
}
.otrock-av-offer__icon img{
  width: 100%; height: 100%; object-fit: contain; display: block;
}

.otrock-av-offer__itemtitle{ margin: 0; }

/* =========================================
   MOBIL (<=768px)
   ========================================= */
@media (max-width: 768px){
  #otrock-audio-video-nabidka-sluzeb.otrock-av-offer{
    padding-top: 64px;
    padding-bottom: 64px;
  }

  .otrock-av-offer__head{
    text-align: center;            /* badge na střed */
    margin-bottom: 16px;
  }

  .otrock-av-offer__grid{
    grid-template-columns: 1fr;    /* pod sebou */
    gap: 24px;
  }

  .otrock-av-offer__left{
    text-align: center;            /* H3 + P na střed */
  }

  .otrock-av-offer__right{
    text-align: left;              /* list zůstává vlevo */
  }

  .otrock-av-offer__list{
    gap: 24px;
  }

  .otrock-av-offer__item{
    grid-template-columns: 50px auto; /* ikonka + text */
  }
}

/* =========================================
   TABLET ONLY (768–1024px) — stejné jako mobil
   VŽDY poslední blok
   ========================================= */
@media (min-width: 768px) and (max-width: 1024px){
  #otrock-audio-video-nabidka-sluzeb.otrock-av-offer{
    padding-top: 64px;
    padding-bottom: 64px;
  }

  .otrock-av-offer__head{
    text-align: center;            /* badge na střed */
    margin-bottom: 16px;
  }

  .otrock-av-offer__grid{
    grid-template-columns: 1fr;    /* pod sebou */
    gap: 24px;
  }

  .otrock-av-offer__left{
    text-align: center;            /* H3 + P na střed */
  }

  .otrock-av-offer__right{
    text-align: left;              /* list zůstává vlevo */
  }

  .otrock-av-offer__list{
    gap: 24px;
  }

  .otrock-av-offer__item{
    grid-template-columns: 50px auto; /* ikonka + text */
  }
}

/* =========================================
   AUDIO/VIDEO — OBRAZKY (DESKTOP základ)
   ======================================= */
#otrock-audio-video-obrazky.otrock-obrazky {
  background: var(--otrock-font-color-secondary);
  padding-top: 96px;
  padding-bottom: 96px;
}

.otrock-obrazky__grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr); /* 3 vedle sebe */
  gap: 24px;
}

.otrock-obrazky__item{
  margin: 0;                  /* reset figure */
}

.otrock-obrazky__image{
  display: block;
  width: 100%;
  height: auto;      /* jemné zaoblení – nepřebije rámečky v obrázcích */
}

/* MOBIL (<=768px) */
@media (max-width: 768px){
  #otrock-audio-video-obrazky.otrock-obrazky {
    padding-top: 64px;
    padding-bottom: 64px;
  }
  .otrock-obrazky__grid{
    grid-template-columns: 1fr;  /* pod sebou */
    gap: 24px;
  }
}

/* TABLET ONLY (768–1024px) — VŽDY POSLEDNÍ BLOK (stejné jako mobil) */
@media (min-width: 768px) and (max-width: 1024px){
  #otrock-audio-video-obrazky.otrock-obrazky {
    padding-top: 64px;
    padding-bottom: 64px;
  }
  .otrock-obrazky__grid{
    grid-template-columns: 1fr;  /* pod sebou */
    gap: 24px;
  }
}
#proc .otrock-protect__head, #pro-koho .otrock-protect__head, #otrock-kyberneticka-bezpecnost-jak-mitel-chrani .otrock-protect__head,  #otrock-kyberneticka-bezpecnost-jak-mitel-chrani .otrock-protect__head, .page-template-page-server #otrock-kyberneticka-bezpecnost-jak-mitel-chrani .otrock-protect__head,  .page-template-page-energie .otrock-protect__head, .page-template-page-cybersecurity     .otrock-protect__head, .page-template-page-sitova-infrastruktura .otrock-protect__head, .page-template-page-telefonie .otrock-protect__head, .page-template-page-internetiptv .otrock-protect__head{
    max-width: auto;
margin: 0;
text-align: left;
}

@media (max-width: 768px){
#proc .otrock-protect__head,#pro-koho .otrock-protect__head, #otrock-kyberneticka-bezpecnost-jak-mitel-chrani .otrock-protect__head, .page-template-page-server #otrock-kyberneticka-bezpecnost-jak-mitel-chrani .otrock-protect__head, .page-template-page-energie .otrock-protect__head, .page-template-page-cybersecurity     .otrock-protect__head, .page-template-page-sitova-infrastruktura .otrock-protect__head, .page-template-page-telefonie .otrock-protect__head, .page-template-page-internetiptv .otrock-protect__head {

text-align: center;
}
}

/* TABLET ONLY (768–1024px) — VŽDY POSLEDNÍ BLOK (stejné jako mobil) */
@media (min-width: 768px) and (max-width: 1024px){
#proc .otrock-protect__head,#pro-koho .otrock-protect__head, #otrock-kyberneticka-bezpecnost-jak-mitel-chrani .otrock-protect__head, .page-template-page-server #otrock-kyberneticka-bezpecnost-jak-mitel-chrani .otrock-protect__head,  .page-template-page-energie .otrock-protect__head, .page-template-page-cybersecurity     .otrock-protect__head, .page-template-page-sitova-infrastruktura .otrock-protect__head, .page-template-page-telefonie .otrock-protect__head, .page-template-page-internetiptv .otrock-protect__head {

text-align: center;
}
}


/* DESKTOP (základ) */
#otrock-audio-video-vyhody.otrock-av-vyhody{
  background: var(--otrock-font-color-secondary);
  padding-top: 96px;
  padding-bottom: 96px;
}

.otrock-av-vyhody__grid{
  list-style: none;
  margin: 0 auto;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr); /* 4 vedle sebe */
  gap: 32px;
  max-width: 80%;                 /* požadavek: 80 % na desktopu */
  text-align: center;
  align-items: start;
}

.otrock-av-vyhody__item{
  display: flex;
  flex-direction: column;
  align-items: center;
}

.otrock-av-vyhody__icon{
  height: 150px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 20px;
}
.otrock-av-vyhody__icon img{
  width: 100%;
  height: 150px;
  object-fit: contain;
  display: block;
}

.otrock-av-vyhody__title{
  margin: 0;
}

/* MOBIL (<=768px) */
@media (max-width: 768px){
  #otrock-audio-video-vyhody.otrock-av-vyhody{
    padding-top: 64px;
    padding-bottom: 64px;
  }
  .otrock-av-vyhody__grid{
    grid-template-columns: 1fr; /* 1 na řádek */
    gap: 16px;
    width: 100%;                /* požadavek: full width na mobilu */
  }
  .otrock-av-vyhody__icon{
    height: 150px;
    margin-bottom: 20px;
  }
}

/* TABLET ONLY (768–1024px) — VŽDY POSLEDNÍ BLOK */
@media (min-width: 768px) and (max-width: 1024px){
  #otrock-audio-video-vyhody.otrock-av-vyhody{
    padding-top: 64px;
    padding-bottom: 64px;
  }
  .otrock-av-vyhody__grid{
    grid-template-columns: 1fr; /* 1 na řádek */
    gap: 16px;
    width: 100%;                /* požadavek: full width na mobilu */
  }
  .otrock-av-vyhody__icon{
    height: 150px;
    margin-bottom: 20px;
  }
}


  .otrock-head-section {
  background: var(--otrock-font-color-secondary);
  padding-top: 96px;

  }




@media (max-width: 768px){
    .otrock-head-section {
    padding-top: 64px;

  }
}

/* TABLET ONLY (768–1024px) — VŽDY POSLEDNÍ BLOK */
@media (min-width: 768px) and (max-width: 1024px){
    .otrock-head-section {
    padding-top: 64px;

  }
}

/* ============================
   AUDIO/VIDEO – NAŠE ŘEŠENÍ (list 50/50, zig-zag)
   DESKTOP (základ)
   ============================ */
#otrock-audio-video-nase-reseni.otrock-avlist{
  background: var(--otrock-font-color-secondary);
  padding-bottom: 96px;
}

.otrock-avlist__list{
  list-style: none;
  margin: 0 auto;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 96px; /* mezera mezi řádky */
  max-width: 80%;
}

/* Řádek = 2 sloupce 50/50, vertikální centrování media vůči textu */
.otrock-avlist__row{
  display: grid;
  grid-template-columns: 1fr 1fr;         /* 50/50 */
  grid-template-areas: "media content";   /* default: obrázek vlevo, text vpravo */
  gap: 64px;
  align-items: center;                     /* vert. centrování */
}

/* Každý druhý řádek prohodit (jen desktop) */
.otrock-avlist__row.is-reversed-desktop{
  grid-template-areas: "content media";
}

.otrock-avlist__media{ 
  grid-area: media; 
  display: flex; 
  align-items: center; 
  justify-content: center;
}
.otrock-avlist__media img{
  width: 100%;
  height: auto;
  display: block;
}

.otrock-avlist__content{ 
  grid-area: content; 
  display: flex; 
  flex-direction: column; 
  gap: 20px;
}

.otrock-avlist__content .otrock-h3 {
	margin: 0;
}

/* Na desktopu není button full width */
.otrock-avlist__content .otrock-btn-kontakt{
  width: auto;
  align-self: flex-start;
}

/* ============================
   MOBIL (<=768px)
   ============================ */
@media (max-width: 768px){
  #otrock-audio-video-nase-reseni.otrock-avlist{
    padding-bottom: 64px;
  }

  .otrock-avlist__content .otrock-h3 {
	margin-top: 20px;
}


  .otrock-avlist__list{ gap: 32px; }

  .otrock-avlist__row,
  .otrock-avlist__row.is-reversed-desktop{
    grid-template-columns: 1fr;
    grid-template-areas:
      "media"    /* VŽDY první obrázek */
      "content"; /* pak obsah */
    gap: 16px;
  }

  .otrock-avlist__media img{ max-width: 100%; }

  /* Button na mobilu full width */
  .otrock-avlist__content .otrock-btn-kontakt{
    width: 100%;
    align-self: stretch;
    text-align: center;
  }

  .otrock-avlist__list{
  max-width: 100%;
}
}

/* ============================
   TABLET ONLY (768–1024px) — stejné jako mobil (VŽDY POSLEDNÍ BLOK)
   ============================ */
@media (min-width: 768px) and (max-width: 1024px){
	  .otrock-avlist__content .otrock-h3 {
	margin-top: 20px;
}
  #otrock-audio-video-nase-reseni.otrock-avlist{
    padding-bottom: 64px;
  }

  .otrock-avlist__list{ gap: 32px; }

  .otrock-avlist__row,
  .otrock-avlist__row.is-reversed-desktop{
    grid-template-columns: 1fr;
    grid-template-areas:
      "media"    /* VŽDY první obrázek */
      "content"; /* pak obsah */
    gap: 16px;
  }

  .otrock-avlist__media img{ max-width: 100%; }

  /* Button na mobilu full width */
  .otrock-avlist__content .otrock-btn-kontakt{
    width: 100%;
    align-self: stretch;
    text-align: center;
  }

  .otrock-avlist__list{
  max-width: 100%;
}
}

/* =========================================
   SMART CITY — Kde technologie pomáhají
   DESKTOP (základ)
   ========================================= */
#otrock-smartcity-kde-technologie-pomahaji.otrock-wherehelp{
  background: var(--otrock-font-color-secondary);
  padding-bottom: 96px;
}

.otrock-wherehelp__list{
  display: flex;
  flex-direction: column;
  gap: 96px;                              /* mezera mezi řádky */
}

/* 2 sloupce 50/50; default: obsah vlevo, obrázek vpravo */
.otrock-wherehelp__row{
  display: grid;
  grid-template-columns: 1fr 1fr;         /* 50/50 */
  gap: 96px;
  align-items: center;                    /* obrázek vycentrovat k textu */
  grid-template-areas: "content media";
}

/* pro sudé řádky prohodíme (jen desktop) */
.otrock-wherehelp__row.is-reversed-desktop{
  grid-template-areas: "media content";
}

.otrock-wherehelp__content{ grid-area: content; }
.otrock-wherehelp__media{   grid-area: media; display:flex; align-items:center; justify-content:center; }

.otrock-wherehelp__image{
  width: 100%;
  height: auto;
  display: block;
}

/* Titulek a text */
.otrock-wherehelp__title{ margin: 0 0 20px 0; }

/* List s ikonkami (inspirace z AV sekce) */
.otrock-wherehelp__features{
  list-style: none;
  margin: 20px 0 40px 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.otrock-wherehelp__feature{
  display: grid;
  grid-template-columns: 50px 1fr;        /* ikona | text */
  align-items: center;
  column-gap: 24px;
}
.otrock-wherehelp__icon{
  width: 50px; height: 50px;
  display: inline-flex; align-items:center; justify-content:center;
}
.otrock-wherehelp__icon img{
  width: 100%; height: 100%; object-fit: contain; display: block;
}
.otrock-wherehelp__featuretitle{ margin: 0; }

/* Tlačítko: desktop = auto šířka (globální styl už řeší) */



/* ===== DESKTOP: 2/3 text + 1/3 obrázek ===== */
.otrock-wherehelp__row{
  grid-template-columns: 2fr 1fr;     /* text 2/3, obrázek 1/3 */
  grid-template-areas: "content media";
}
.otrock-wherehelp__row.is-reversed-desktop{
  grid-template-columns: 1fr 2fr;     /* když je obrázek vlevo, text stále 2/3 */
  grid-template-areas: "media content";
}

/* ===== DESKTOP: tlačítko NENÍ full width ===== */
#otrock-smartcity-kde-technologie-pomahaji .otrock-btn-kontakt-transparent{
  width: auto;                        /* přepíše případné globální 100% */
  display: inline-flex;
  align-self: flex-start;             /* zarovnání na začátek sloupce s textem */
}

/* =========================================
   MOBIL (<=768px)
   ========================================= */
@media (max-width: 768px){
  #otrock-smartcity-kde-technologie-pomahaji.otrock-wherehelp{
    padding-bottom: 64px;
  }

  .otrock-wherehelp__list{ gap: 24px; }

  /* na mobilu VŽDY nejdřív obrázek, pak obsah (bez střídání) */
  .otrock-wherehelp__row,
  .otrock-wherehelp__row.is-reversed-desktop{
    grid-template-columns: 1fr;
    grid-template-areas:
      "media"
      "content";
    gap: 16px;
  }

  .otrock-wherehelp__media{ justify-content: center; }
  .otrock-wherehelp__image{ max-width: 100%; }

  /* list i text trochu kompaktnější */
  .otrock-wherehelp__features{ gap: 64px; }

  /* tlačítko na plnou šířku jen v této sekci */
  #otrock-smartcity-kde-technologie-pomahaji .otrock-btn-kontakt-transparent{
    width: 100%;
    justify-content: center;
  }
}

/* =========================================
   TABLET ONLY (768–1024px) — VŽDY POSLEDNÍ BLOK
   (stejné chování jako mobil)
   ========================================= */
@media (min-width: 768px) and (max-width: 1024px){
  #otrock-smartcity-kde-technologie-pomahaji.otrock-wherehelp{
    padding-bottom: 64px;
  }

  .otrock-wherehelp__list{ gap: 64px; }

  .otrock-wherehelp__row,
  .otrock-wherehelp__row.is-reversed-desktop{
    grid-template-columns: 1fr;
    grid-template-areas:
      "media"
      "content";
    gap: 16px;
  }

  .otrock-wherehelp__media{ justify-content: center; }

  #otrock-smartcity-kde-technologie-pomahaji .otrock-btn-kontakt-transparent{
    width: 100%;
    justify-content: center;
  }
}

/* =========================================
   SMART CITY – Zelená vlna (30/70, list + info bublina)
   DESKTOP (základ)
   ========================================= */
#nabidka.otrock-sc-amb{

  background: var(--otrock-font-color-secondary);
  padding-top: 96px;
  padding-bottom: 96px;
}

/* zvýrazněná část titulku (původní záměr) */
.otrock-text-accent{ color: var(--accent); }


/* grid 30/70 (původně 2 sloupce, úprava na 30/70) */
.otrock-sc-amb__grid{
  display: grid;
  grid-template-columns: 0.4fr 0.6fr;   /* 30 % | 70 % */
  gap: 96px;
  align-items: start;
}

/* titulek vlevo */
.otrock-sc-amb__title{ margin: 0; }

/* ====== LIST (původní layout jako u AV) ====== */
.otrock-sc-amb__list{
  list-style: none;
  margin: 24px 0 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.otrock-sc-amb__item{
  display: grid;
  grid-template-columns: 50px 1fr;  /* ikona | text (info je inline v textu) */
  align-items: center;
  column-gap: 24px;
  position: relative;
}
.otrock-sc-amb__icon{
  width: 50px; height: 50px;
  display: inline-flex; align-items: center; justify-content: center;
}
.otrock-sc-amb__icon img{ width: 100%; height: 100%; object-fit: contain; display: block; }
.otrock-sc-amb__itemtitle{ margin: 0; }

/* ====== INFO IKONA INLINE + BUBLINA (ÚPRAVY) ====== */
/* ikonka je hned za textem v poslední odrážce */
.otrock-sc-amb__info{
  display: inline-flex;
  position: relative;
  vertical-align: middle;
  margin-left: 10px;
}
.otrock-sc-amb__info-btn{
  background: transparent;
  border: 0;
  padding: 0;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.otrock-sc-amb__info-btn img{ width: 24px; height: 24px; display: block; }

/* bublina – bez zobáčku, vycentrovaná vodorovně na ikonku */
.otrock-sc-amb__bubble{
  position: absolute;
  left: 50%;
  bottom: calc(100% + 8px);         /* nad ikonou */
  transform: translateX(-50%);      /* střed bubliny = střed ikonky */
  width: 328px;
  max-width: 328px;
  background: #16203F;
  border-radius: 30px;
  box-shadow: inset 0 0 20.9px rgba(255,255,255,0.1);
  padding: 24px;
  z-index: 1001;

  opacity: 0;
  visibility: hidden;
  transition: opacity .2s ease, visibility .2s ease;
}
/* pojistka: zobáček definitivně pryč */
.otrock-sc-amb__bubble::after{ content: none; }

/* typografie obsahu bubliny */
.otrock-sc-amb__bubble-title{
  font-family: var(--otrock-font-base);

  color: #FFF;
  margin: 0 0 10px 0;
}
/* Info box: solid bullets (ne kroužky) */
.otrock-sc-amb__bubble-list{
  margin: 0;
  padding-left: 18px;
  list-style-type: disc !important;   /* vynutí plnou tečku */
}

.otrock-sc-amb__bubble-list li::marker{
  color: var(--otrock-font-color-body); /* stejné jako text uvnitř boxu */
  /* volitelně zvětšit tečku:
  font-size: 1.1em;
  */
}
.otrock-sc-amb__bubble-list li{
  font-family: var(--otrock-font-base);
  color: var(--otrock-font-color-body);
}


/* zobrazení na PC (hover/focus) + JS třída .is-open */
.otrock-sc-amb__info:hover .otrock-sc-amb__bubble,
.otrock-sc-amb__info:focus-within .otrock-sc-amb__bubble,
.otrock-sc-amb__info.is-open .otrock-sc-amb__bubble{
  opacity: 1;
  visibility: visible;
}

/* overlay pro mobile/tablet – ukazuje se přes JS přidáním .is-visible */
.otrock-sc-amb__overlay{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.45);
  opacity: 0;
  visibility: hidden;
  transition: opacity .2s ease;
  z-index: 1000;
}
.otrock-sc-amb__overlay.is-visible{
  opacity: 1;
  visibility: visible;
}

/* =========================================
   MOBIL (<=768px)
   ========================================= */
@media (max-width: 768px){
  #nabidka.otrock-sc-amb{
    padding-top: 64px;
    padding-bottom: 64px;

  }

  .otrock-sc-amb__grid{
    grid-template-columns: 1fr;     /* pod sebou */
    gap: 24px;
  }

  /* bublina: full width s „paddingem“ 30 px od okrajů
     (řešeno fixní pozicí a 30 px odsazením od viewportu) */
  .otrock-sc-amb__bubble{
    position: fixed;
    top: var(--otrock-bubble-top, 30px); /* JS sem dopočítá top nad ikonou */
    left: 30px;
    right: 30px;
    bottom: auto;
    width: auto;
    max-width: none;
    transform: none;
  }
}

/* =========================================
   TABLET ONLY (768–1024px) — VŽDY POSLEDNÍ BLOK
   (stejné chování jako na mobilu)
   ========================================= */
@media (min-width: 768px) and (max-width: 1024px){
  #nabidka.otrock-sc-amb{
    padding-top: 64px;
    padding-bottom: 64px;
  }

  .otrock-sc-amb__grid{
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .otrock-sc-amb__bubble{
    position: fixed;
    top: var(--otrock-bubble-top, 30px); /* JS sem dopočítá top nad ikonou */
    left: 30px;
    right: 30px;
    bottom: auto;
    width: auto;
    max-width: none;
    transform: none;
  }
}

/* =========================================
   SMART CITY — Dva obrázky (50/50 → stack)
   DESKTOP (základ)
   ========================================= */
#otrock-smartcity-porovnani-obrazku.otrock-duoimg{
  /* společná výška pro oba obrázky na desktopu */
  --duoimg-h: clamp(260px, 28vw, 420px);
  padding-top: 96px;
  padding-bottom: 96px;
        background: var(--otrock-font-color-secondary);
}

.otrock-duoimg__grid{
  display: grid;
  grid-template-columns: 1fr 1fr;   /* 50/50 */
  gap: 32px;
  align-items: stretch;              /* sloupce stejně vysoké */
}

.otrock-duoimg__item{
  margin: 0;
  display: flex;                     /* vycentruje obrázek uvnitř boxu */
  align-items: center;
  justify-content: center;
  height: var(--duoimg-h);          /* >>> stejná výška pro oba <<< */
}

.otrock-duoimg__image{
  display: block;
  height: 100%;                      /* obrázek se řídí výškou boxu */
  width: auto;                       /* drží poměr stran */
  max-width: 100%;                   /* nevyleze ze sloupce */
  object-fit: contain;               /* bez ořezu, přizpůsobení do boxu */
}

/* =========================================
   MOBIL (<=768px)
   ========================================= */
@media (max-width: 768px){
  #otrock-smartcity-porovnani-obrazku.otrock-duoimg{
    padding-top: 64px;
    padding-bottom: 64px;
  }

  .otrock-duoimg__grid{
    grid-template-columns: 1fr;      /* pod sebou */
    gap: 24px;
  }

  /* na mobilech výšky přirozené */
  .otrock-duoimg__item{
    height: auto;
  }
  .otrock-duoimg__image{
    height: auto;
    width: 100%;
  }
}

/* =========================================
   TABLET ONLY (768–1024px) — VŽDY POSLEDNÍ BLOK
   (stejné jako mobil)
   ========================================= */
@media (min-width: 768px) and (max-width: 1024px){
  #otrock-smartcity-porovnani-obrazku.otrock-duoimg{
    padding-top: 64px;
    padding-bottom: 64px;
  }

  .otrock-duoimg__grid{
    grid-template-columns: 1fr;      /* pod sebou */
    gap: 24px;
  }

  .otrock-duoimg__item{
    height: auto;
  }
  .otrock-duoimg__image{
    height: auto;
    width: 100%;
  }
}

/* =========================================
   PRICING SPLIT — DESKTOP (základ)
   ========================================= */
#otrock-internet-cenik.otrock-pricing-split{  padding-top: 96px;
  padding-bottom: 96px;
        background: var(--otrock-font-color-secondary); }

.otrock-pricing-split__grid{
  display: grid;
  grid-template-columns: 3fr 2fr;            /* 60% | 40% */
  gap: 192px;
  align-items: center;
  grid-template-areas: "content media";
}
.otrock-pricing-split__grid.is-reversed-desktop{
  grid-template-areas: "media content";
}
.otrock-pricing-split__grid.is-single-column{
  grid-template-columns: 1fr;
  grid-template-areas: "content";
  max-width: 80%;
}
.otrock-pricing-split__content{ grid-area: content; }
.otrock-pricing-split__media  { grid-area: media; display:flex; justify-content:center; }
.otrock-pricing-split__image  { width:75%; height:auto; border-radius:24px; display:block; }

.otrock-pricing-split__title{ margin: 8px 0 12px 0; }
.otrock-pricing-split__desc{  margin: 0 0 24px 0; }

/* list s ikonkami */
.otrock-pricing-split__features{
  list-style:none; margin: 0 0 20px 0; padding:0; display:flex; flex-direction:column; gap:24px;
}
.otrock-pricing-split__feature{
  display:grid; grid-template-columns: 40px 1fr; align-items:center; column-gap:24px;
}
.otrock-pricing-split__icon{ width:40px; height:40px; display:inline-flex; align-items:center; justify-content:center; }
.otrock-pricing-split__icon img{ width:100%; height:100%; object-fit:contain; display:block; }
.otrock-pricing-split__featuretitle{ margin:0; }

/* ===== Desktop TABULKA (viz Figmy) ===== */
.otrock-pricingtable{
  --otrock-cols: 3;
  background:#16203F;
  border:2px solid #0744F8;
  box-shadow:0 0 100px rgba(4,66,249,.3);
  border-radius:16px;
  overflow:hidden;
  margin: 40px 0 40px 0;
  font-size: 16px;
}
.otrock-pricingtable__row{
  display:grid;
  grid-template-columns: repeat(var(--otrock-cols), 1fr);
}
.otrock-pricingtable__row.is-header .otrock-pricingtable__cell{
  background: linear-gradient(0deg, #0744F8 0%, #050C33 100%);
  border-left: 1.5px solid #0744F8;
  border-top:  1.5px solid #0744F8;
}
.otrock-pricingtable__row:not(.is-header) .otrock-pricingtable__cell{
  border-left: 1px solid #0744F8;
  border-top:  1px solid #0744F8;
}
.otrock-pricingtable__cellin{
  padding: 15px 18px;
}
.otrock-pricingtable__text{
  color:#fff; font-weight:500; line-height:130%;
}

/* footnote + tlačítko (desktop = auto šířka) */
.otrock-pricing-split__footnote{ margin: 20px 0 20px 0;}
#otrock-internet-cenik .otrock-btn-kontakt{ width:auto; }

/* ===== Mobilní / Tablet BOXY ===== */
.otrock-pricingcards{ display:none; }

/* =========================================
   MOBIL (<=768px)
   ========================================= */
@media (max-width: 768px){
  #otrock-internet-cenik.otrock-pricing-split{ padding-top: 64px;padding-bottom: 64px; }

  .otrock-pricing-split__grid,
  .otrock-pricing-split__grid.is-reversed-desktop{
    grid-template-columns:1fr;
    grid-template-areas:
      "media"
      "content";
    gap:24px;
  }

  /* Nadpisy a úvodní odstavec na střed */
  .otrock-pricing-split__title,
  .otrock-pricing-split__desc,
  .otrock-badge{ text-align:center; }
  /* Bullet list zůstává doleva */
  .otrock-pricing-split__features{ align-items:flex-start; }

  /* Tabulka se na mobilu skrývá, místo ní BOXY */
  .otrock-pricingtable{ display:none; }
  .otrock-pricingcards{ display:grid; gap:24px; margin-top: 40px; margin-bottom: 40px;}

  .otrock-pricingcard{
    background: linear-gradient(141.12deg, #060E37 42.16%, #1348EF 123.6%);
    border: 0.56px solid rgba(255,255,255,.2);
    box-shadow: inset 0 0 20.9px rgba(255,255,255,.1);
    border-radius: 24px;
    padding: 20px 40px;
    display:flex; flex-direction:column; gap:10px;
  }
  .otrock-pricingcard__subtitle{
    color:#fff; font-weight:700; font-size:18px; line-height:30px;
  }
  .otrock-pricingcard__content{ display:flex; flex-direction:column; gap:20px; }
  .otrock-pricingcard__block{ display:flex; flex-direction:column; gap:0; }
  .otrock-pricingcard__label{ color:#fff; font-weight:600; font-size:16px; line-height:30px; opacity:.95; }
  .otrock-pricingcard__value{ color:#fff; font-weight:600; font-size:16px; line-height:30px; }
  .otrock-pricingcard__price{ color:#fff; font-weight:700; font-size:32px; line-height:48px; }

  /* Button full width na mobilu */
  #otrock-internet-cenik .otrock-btn-kontakt{ width:100%; justify-content:center; }
  .otrock-pricing-split__footnote {
  	text-align: center;
  }
       .otrock-pricing-split__content .otrock-badge {
        	display: block;
          margin: 0 auto 20px auto;
        }
}

/* =========================================
   TABLET ONLY (768–1024px) — stejné jako mobil
   ========================================= */
@media (min-width: 768px) and (max-width: 1024px){
  #otrock-internet-cenik.otrock-pricing-split{ padding-top: 64px;padding-bottom: 64px; }

  .otrock-pricing-split__grid,
  .otrock-pricing-split__grid.is-reversed-desktop{
    grid-template-columns:1fr;
    grid-template-areas:
      "media"
      "content";
    gap:24px;
  }


        .otrock-pricing-split__content .otrock-badge {
        	display: block;
       margin: 0 auto 20px auto;
        }
  /* Nadpisy a úvodní odstavec na střed */
  .otrock-pricing-split__title,
  .otrock-pricing-split__desc,
  .otrock-badge{ text-align:center; }
  /* Bullet list zůstává doleva */
  .otrock-pricing-split__features{ align-items:flex-start; }

  /* Tabulka se na mobilu skrývá, místo ní BOXY */
  .otrock-pricingtable{ display:none; }
  .otrock-pricingcards{ display:grid; gap:24px; margin-top: 40px; margin-bottom: 40px;}

  .otrock-pricingcard{
    background: linear-gradient(141.12deg, #060E37 42.16%, #1348EF 123.6%);
    border: 0.56px solid rgba(255,255,255,.2);
    box-shadow: inset 0 0 20.9px rgba(255,255,255,.1);
    border-radius: 24px;
    padding: 20px 40px;
    display:flex; flex-direction:column; gap:10px;
  }
  .otrock-pricingcard__subtitle{
    color:#fff; font-weight:700; font-size:18px; line-height:30px;
  }
  .otrock-pricingcard__content{ display:flex; flex-direction:column; gap:20px; }
  .otrock-pricingcard__block{ display:flex; flex-direction:column; gap:0; }
  .otrock-pricingcard__label{ color:#fff; font-weight:600; font-size:16px; line-height:30px; opacity:.95; }
  .otrock-pricingcard__value{ color:#fff; font-weight:600; font-size:16px; line-height:30px; }
  .otrock-pricingcard__price{ color:#fff; font-weight:700; font-size:32px; line-height:48px; }

  /* Button full width na mobilu */
  #otrock-internet-cenik .otrock-btn-kontakt{ width:100%; justify-content:center; }
  .otrock-pricing-split__footnote {
  	text-align: center;
  }
}

/* DESKTOP (základ) – tlačítko NENÍ full width */
#otrock-internet-cenik .otrock-btn-kontakt{
  width: auto !important;
  display: inline-flex;
  align-self: flex-start;      /* zarovnání vlevo u textu */
}

/* MOBIL (<=768px) – full width */
@media (max-width: 768px){
  #otrock-internet-cenik .otrock-btn-kontakt{
    width: 100% !important;
    justify-content: center;
  }

    #otrock-internet-cenik .otrock-badge{
  display: block;        /* centrování elementu */
  margin: 20px auto;
  }


         
}

/* TABLET (768–1024px) – full width stejně jako mobil */
@media (min-width: 768px) and (max-width: 1024px){
  #otrock-internet-cenik .otrock-btn-kontakt{
    width: 100% !important;
    justify-content: center;
  }

    #otrock-internet-cenik .otrock-badge{
  display: block;        /* centrování elementu */
  margin: 20px auto;
  }
}

/* =========================================
   PRICING SPLIT — DESKTOP (základ)
   ========================================= */
.otrock-pricing-split{
  padding-top: 96px;
  padding-bottom: 96px;
  background: var(--otrock-font-color-secondary);
}

.otrock-pricing-split__grid{
  display: grid;
  grid-template-columns: 3fr 2fr;        /* 60% (content) | 40% (media) */
  gap: 192px;
  align-items: center;
  grid-template-areas: "content media";
}

.page-template-page-internetiptv .otrock-pricing-split__grid{
  gap: 60px;

}
/* Reversed na desktopu: media vlevo užší, content vpravo širší */
.otrock-pricing-split__grid.is-reversed-desktop{
  grid-template-columns: 2fr 3fr;        /* 40% (media) | 60% (content) */
  grid-template-areas: "media content";
}

.otrock-pricing-split__grid.is-single-column{
  grid-template-columns: 1fr;
  grid-template-areas: "content";
  max-width: 80%;
}

.otrock-pricing-split__content{ grid-area: content; }
.otrock-pricing-split__media  { grid-area: media; display:flex; justify-content:center; }
.otrock-pricing-split__image  { width:; height:auto; border-radius:24px; display:block; }

.otrock-pricing-split__title{ margin: 8px 0 12px 0; }
.otrock-pricing-split__desc{  margin: 0 0 24px 0; }

/* list s ikonkami */
.otrock-pricing-split__features{
  list-style:none; margin: 0 0 20px 0; padding:0; display:flex; flex-direction:column; gap:24px;
}
.otrock-pricing-split__feature{
  display:grid; grid-template-columns: 40px 1fr; align-items:center; column-gap:24px;
}
.otrock-pricing-split__icon{ width:40px; height:40px; display:inline-flex; align-items:center; justify-content:center; }
.otrock-pricing-split__icon img{ width:100%; height:100%; object-fit:contain; display:block; }
.otrock-pricing-split__featuretitle{ margin:0; }

/* ===== Desktop TABULKA (viz Figmy) ===== */
.otrock-pricingtable{
  --otrock-cols: 3;
  background:#16203F;
  border:2px solid #0744F8;
  box-shadow:0 0 100px rgba(4,66,249,.3);
  border-radius:16px;
  overflow:hidden;
  margin: 40px 0 40px 0;
  font-size: 16px;
}
.otrock-pricingtable__row{ display:grid; grid-template-columns: repeat(var(--otrock-cols), 1fr); }
.otrock-pricingtable__row.is-header .otrock-pricingtable__cell{
  background: linear-gradient(0deg, #0744F8 0%, #050C33 100%);
  border-left: 1.5px solid #0744F8;
  border-top:  1.5px solid #0744F8;
}
.otrock-pricingtable__row:not(.is-header) .otrock-pricingtable__cell{
  border-left: 1px solid #0744F8;
  border-top:  1px solid #0744F8;
}


.otrock-pricingtable__cellin{ padding: 15px 18px; display: flex
;
    align-items: center; height: 100%;
}
.otrock-pricingtable__text{ color:#fff; font-weight:500; line-height:130%; }

/* footnote + tlačítko (desktop = auto šířka) */
.otrock-pricing-split__footnote{ margin: 20px 0 20px 0; }
.otrock-pricing-split .otrock-btn-kontakt{
  width:auto !important;
  display:inline-flex;
  align-self:flex-start;
}

/* ===== Mobilní / Tablet BOXY ===== */
.otrock-pricingcards{ display:none; }

/* 1 sloupec bez obrázku – 80% vlevo (pro všechny výskyty) */
.otrock-pricing-split__grid.is-single-column{
  grid-template-columns: 1fr;
  grid-template-areas: "content";
  width: 80%;
  max-width: none;
  margin-right: auto;   /* vlevo */
}

/* =========================================
   MOBIL (<=768px)
   ========================================= */
@media (max-width: 768px){

	.otrock-pricing-split__grid.is-single-column{

  width: 100%;
}
  .otrock-pricing-split{ padding-top: 64px; padding-bottom: 64px; }

  .otrock-pricing-split__grid,
  .otrock-pricing-split__grid.is-reversed-desktop{
    grid-template-columns:1fr;
    grid-template-areas:
      "media"
      "content";
    gap:64px;
  }

  /* Nadpis + popis na střed, badge taky */
  .otrock-pricing-split__title,
  .otrock-pricing-split__desc{ text-align:center; }
  .otrock-pricing-split .otrock-badge{
    display:block; margin:20px auto; text-align:center;
  }

  /* Bullet list zůstává doleva */
  .otrock-pricing-split__features{ align-items:flex-start; }

  /* Tabulka -> BOXY */
  .otrock-pricingtable{ display:none; }
  .otrock-pricingcards{ display:grid; gap:24px; margin:40px 0; }

  .otrock-pricingcard{
    background: linear-gradient(141.12deg, #060E37 42.16%, #1348EF 123.6%);
    border: 0.56px solid rgba(255,255,255,.2);
    box-shadow: inset 0 0 20.9px rgba(255,255,255,.1);
    border-radius: 24px;
    padding: 20px 40px;
    display:flex; flex-direction:column; gap:10px;
  }
  .otrock-pricingcard__subtitle{ color:#fff; font-weight:700; font-size:18px; line-height:30px; }
  .otrock-pricingcard__content{ display:flex; flex-direction:column; gap:20px; }
  .otrock-pricingcard__block{ display:flex; flex-direction:column; gap:0; }
  .otrock-pricingcard__label{ color:#fff; font-weight:600; font-size:16px; line-height:30px;}
  .otrock-pricingcard__value{ color:#fff; font-weight:600; font-size:16px; line-height:30px; }
  .otrock-pricingcard__price{ color:#fff; font-weight:700; font-size:32px; line-height:48px; }

  /* Button full width na mobilu */
  .otrock-pricing-split .otrock-btn-kontakt{
    width:100% !important; justify-content:center;
  }
  .otrock-pricing-split__footnote{ text-align:center; }
}

/* =========================================
   TABLET ONLY (768–1024px) — stejné jako mobil
   ========================================= */
@media (min-width: 768px) and (max-width: 1024px){
		.otrock-pricing-split__grid.is-single-column{

  width: 100%;
}
  .otrock-pricing-split{ padding-top: 64px; padding-bottom: 64px; }

  .otrock-pricing-split__grid,
  .otrock-pricing-split__grid.is-reversed-desktop{
    grid-template-columns:1fr;
    grid-template-areas:
      "media"
      "content";
    gap:64px;
  }

  .otrock-pricingtable{ display:none; }
  .otrock-pricingcards{ display:grid; gap:24px; margin:40px 0 0 0; }

  .otrock-pricing-split .otrock-btn-kontakt{
    width:100% !important; justify-content:center;
  }
  .otrock-pricing-split__footnote{ text-align:center; }
}


/* DESKTOP (základ) */
#otrock-internet-porce-zabavy.otrock-porce-zabavy{
  background: var(--otrock-font-color-secondary);
  padding-bottom: 96px;

}

.otrock-porce-zabavy__box{
  position: relative;
  width: 100%;
  padding: 50px;
  border-radius: 32px;

  /* Figma styl: gradient + 0.5px stroke + jemný shadow */
  background: linear-gradient(141.12deg, #060E37 42.16%, #1348EF 123.6%);
  border: 0.5px solid rgba(255, 255, 255, 0.2);            /* Strokes/Stroke cards */
  box-shadow: 0 0 3px rgba(0,0,0,0.2); 
  max-width: 90%;
  margin: 0 auto;
}

.otrock-porce-zabavy__grid{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 64px;                 /* mezera mezi sloupci */
  height: 100%;
}

.otrock-porce-zabavy__content{ flex: 1 1 50%; }
.otrock-porce-zabavy__media{
  flex: 1 1 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.otrock-porce-zabavy__image{
  width: 100%;
  height: auto;
  display: block;
}

.otrock-porce-zabavy__cta{
  margin-top: 24px;
  display: inline-flex;      /* dvě tlačítka vedle sebe */
  gap: 16px;
}

/* MOBIL (<=768px) */
@media (max-width: 768px){

  #otrock-internet-porce-zabavy.otrock-porce-zabavy{
    padding-bottom: 64px;
  }

  .otrock-porce-zabavy__box{
    min-height: unset;
    padding: 24px;
    max-width: 100%;
  }

  .otrock-porce-zabavy__grid{
    flex-direction: column;  /* sloupce pod sebou */
    gap: 16px;
    text-align: center;
  }

  .otrock-porce-zabavy__cta{
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 100%;
    max-width: 360px;
    margin: 0 auto;
  }
  .otrock-porce-zabavy__cta a{ width: 100%; }  /* tlačítka full width */
}

/* TABLET ONLY (768–1024px) — VŽDY POSLEDNÍ BLOK (stejné jako mobil) */
@media (min-width: 768px) and (max-width: 1024px){
  #otrock-internet-porce-zabavy.otrock-porce-zabavy{
    padding-bottom: 64px;
  }

  .otrock-porce-zabavy__box{
    min-height: unset;
    padding: 24px; max-width: 100%;
  }

  .otrock-porce-zabavy__grid{
    flex-direction: column;  /* sloupce pod sebou */
    gap: 16px;
    text-align: center;
  }

  .otrock-porce-zabavy__cta{
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 100%;
    max-width: 360px;
    margin: 0 auto;
  }
  .otrock-porce-zabavy__cta a{ width: 100%; }  /* tlačítka full width */
}

/* =========================================
   OUTSOURCING – OBRAZEK + TEXTY
   DESKTOP (základ)
   ========================================= */
.otrock-outsourcing-visual {
  padding-bottom: 96px;
  font-family: var(--otrock-font-base);
  background: var(--otrock-font-color-secondary);
}

.otrock-outsourcing-visual__image {
  width: 80%;
  margin: 0 auto;                 /* vystředění */
}

.otrock-outsourcing-visual__image img,
.otrock-outsourcing-visual__image picture {
  display: block;
  width: 100%;
  height: auto;
}

.otrock-outsourcing-visual__boxes {
  display: none;                   /* boxy na desktopu neviditelné */
  margin-top: 24px;
}

/* =========================================
   MOBIL (<=768px)
   ========================================= */
@media (max-width: 768px){
  .otrock-outsourcing-visual { 
    padding-bottom: 64px;
  }

  .otrock-outsourcing-visual__image {
    width: 100%;                   /* obrázek přes celou šířku */
  }

  .otrock-outsourcing-visual__boxes {
    display: flex;                 /* boxy pouze na mobilu/tabletu */
    flex-direction: column;
    gap: 24px;
    margin-top: 20px;
  }

  .otrock-outsourcing-visual__box {
    /* Glassmorphism / card */
    background: rgba(255, 255, 255, 0.1);                /* Button bg */
    border: 1px solid rgba(255, 255, 255, 0.2);          /* Stroke cards */
    -webkit-backdrop-filter: blur(16px);
    backdrop-filter: blur(16px);
    border-radius: 24px;
    padding: 0;    
   box-shadow: inset 0 0 20px rgba(255, 255, 255, 0.10);                                    /* vnitřní container řeší padding */
  }

  .otrock-outsourcing-visual__box-inner {
    background: rgba(255, 255, 255, 0.05);               /* Bg gradient (jemný film) */
    border-radius: 24px;
    padding: 20px;
    min-height: 161px;                                   /* podle figmy */
    display: flex;
    align-items: center;                                  /* vertikální zarovnání textu */
    justify-content: center;                              /* a horizontální na střed */
    text-align: center;
  }

  .otrock-outsourcing-visual__box-text {
    max-width: 251px;                                     /* podle figmy */
    margin: 0;
    font-weight: 700;                                     /* Mobile/Body bold */
    font-size: 16px;
    line-height: 28px;                                    /* 167% */
    color: #FFFFFF;
  }
}

/* =========================================
   TABLET ONLY (768–1024px) — VŽDY POSLEDNÍ BLOK
   (chování stejné jako na mobilu)
   ========================================= */
@media (min-width: 768px) and (max-width: 1024px){
  .otrock-outsourcing-visual { 
    padding-bottom: 64px;
  }

  .otrock-outsourcing-visual__image { width: 100%; }
.otrock-outsourcing-visual__boxes {
  display: none;                   /* boxy na desktopu neviditelné */
  margin-top: 20px;
}

}

/* =========================================
   VÝHODY — DESKTOP (základ)
   ========================================= */
#vice.otrock-benefits{
  /* sekce vychází z globálních proměnných */
  font-family: var(--otrock-font-base);
  padding-top: 96px;
  padding-bottom: 96px;
}

.otrock-benefits__grid{              /* desktop 80 % šířka wrapperu */
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));  /* 5 sloupců = 1 řádek */
  gap: 24px 32px;             /* řádková x sloupcová mezera */
  align-items: center;        /* vertikální zarovnání v gridu */
}

.otrock-benefits__item{
  display: flex;              /* obrázek vlevo + text vpravo */
  align-items: center;        /* vertikální centrování obsahu */
  gap: 24px;
  min-height: 50px;           /* jemné srovnání výšky */
}

.otrock-benefits__icon-wrap{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  flex: 0 0 28px;
}

.otrock-benefits__icon{
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.otrock-benefits__text{
  margin: 0;
}

/* =========================================
   MOBIL (<=768px)
   ========================================= */
@media (max-width: 768px){
  #vice.otrock-benefits{
    padding-top: 64px;
    padding-bottom:64px;
  }

  .otrock-benefits__grid{
    width: 100%;              /* full width */
    grid-template-columns: 1fr;  /* 1 item na řádek */
    gap: 24px;
  }

  .otrock-benefits__item{
    gap: 24px;
    min-height: 50px;
  }

  .otrock-benefits__icon-wrap{
    width: 50px;
    height: 50px;
    flex-basis: 50px;
  }
}

/* =========================================
   TABLET ONLY (768–1024px) — VŽDY POSLEDNÍ BLOK
   (stejné chování jako mobil; full width + 1 sloupec)
   ========================================= */
@media (min-width: 768px) and (max-width: 1024px){
  #vice.otrock-benefits{
    padding-top: 64px;
    padding-bottom:64px;
  }

  .otrock-benefits__grid{
    width: 100%;              /* full width */
    grid-template-columns: 1fr;  /* 1 item na řádek */
    gap: 24px;
  }

  .otrock-benefits__item{
    gap: 24px;
    min-height: 50px;
  }

  .otrock-benefits__icon-wrap{
    width: 50px;
    height: 50px;
    flex-basis: 50px;
  }
}

/* DESKTOP (základ) */
.otrock-protect__cta{ margin-top: 40px; }
.otrock-protect__cta .otrock-btn-kontakt{
  display: inline-flex;      /* zmenší se na obsah */
  width: auto;               /* NE full width na PC */
}

/* MOBIL (<=768px) */
@media (max-width: 768px){
  .otrock-protect__cta .otrock-btn-kontakt{
    display: flex;
    width: 100%;             /* na mobilu full width */
    justify-content: center;
  }
}

/* TABLET ONLY (768–1024px) — VŽDY POSLEDNÍ BLOK */
@media (min-width: 768px) and (max-width: 1024px){
  .otrock-protect__cta .otrock-btn-kontakt{
    display: flex;
    width: 100%;             /* na tabletu také full width */
    justify-content: center;
  }
}

/* =========================================
   VIDEO SEKCE — DESKTOP (základ)
   ========================================= */
.otrock-video{
  /* full-bleed bez paddingu */
  padding-top: 96px;
  padding-bottom: 96px;
  position: relative;
  margin: 0;
  line-height: 0; /* odstraní mezery kolem inline-block img */
  background: transparent;
}

.otrock-video__poster img{
  display: block;
  width: 100%;
  height: auto;
}

.otrock-video__play{
  /* centrování ikonky */
  position: absolute;
  inset: 50% auto auto 50%;
  transform: translate(-50%, -50%);
  border: 0;
  padding: 0;
  background: none;
  cursor: pointer;
  line-height: 0;
}

.otrock-video__play img{
  display: block;
  width: clamp(64px, 8vw, 120px);
  height: auto;
}

/* Popup */
.otrock-video__popup[hidden]{ display: none; }

.otrock-video__popup{
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: rgba(0,0,0,0.7);
  display: grid;
  place-items: center;
  padding: 25px;
}

.otrock-video__dialog{
  width: min(90vw, 1120px);
  aspect-ratio: 16 / 9;
  background: #000;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 20px 50px rgba(0,0,0,.45);
}

.otrock-video__frame,
.otrock-video__frame iframe{
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
}

/* =========================================
   VIDEO SEKCE — MOBIL (<=768px)
   ========================================= */
@media (max-width: 768px){
	.otrock-video{
  /* full-bleed bez paddingu */
  padding-top: 64px;
  padding-bottom: 64px;
    }
  .otrock-video__dialog{
    width: 100%;
    border-radius: 10px;
  }
}

/* =========================================
   VIDEO SEKCE — TABLET ONLY (768–1024px)
   — kopie mobilních úprav, vždy poslední blok
   ========================================= */
@media (min-width: 768px) and (max-width: 1024px){
		.otrock-video{
  /* full-bleed bez paddingu */
  padding-top: 64px;
  padding-bottom: 64px;
    }
  .otrock-video__dialog{
    width: 100%;
    border-radius: 10px;
  }
}


/* =========================================
   TYPY ZVUKŮ K DETEKCI — DESKTOP (základ)
   ========================================= */
.otrock-sound-types { font-family: var(--otrock-font-base); padding-bottom:96px; margin-top:40px; }
.otrock-sound-types__grid{
  display: grid;
  grid-template-columns: 1fr 1fr; /* 2 položky v řádku */
  gap: 32px 64px;                 /* řádková x sloupcová mezera */
  list-style: none;
  margin: 0;
  padding: 0;
}
.otrock-sound-types__item{
  display: flex;
  align-items: center; /* obrázek + text srovnané nahoru */
  gap: 48px;
}
.otrock-sound-types__media{
  flex: 0 0 auto;
  width: 100px; height: 100px;
  border-radius: 50%;
  overflow: hidden;
}
.otrock-sound-types__media img{
  width: 100%; height: 100%; object-fit: cover;
  display: block;
}
.otrock-sound-types__content{ text-align: left; }
.otrock-sound-types__title{ margin: 0 0 6px 0; }
.otrock-sound-types__text{
  margin: 0;
  color: var(--otrock-font-color-secondary);
}

/* =========================================
   MOBIL (<=768px)
   ========================================= */
@media (max-width: 768px){
.otrock-sound-types { font-family: var(--otrock-font-base); padding-bottom:96px; margin-top:40px; }
  .otrock-sound-types__grid{
    grid-template-columns: 1fr; /* položky pod sebou */
    gap: 24px;
  }
}

/* =========================================
   TABLET ONLY (768–1024px) — stejné jako mobil
   ========================================= */
@media (min-width: 768px) and (max-width: 1024px){
	.otrock-sound-types { font-family: var(--otrock-font-base); padding-bottom:96px; margin-top:40px; }
  .otrock-sound-types__grid{
    grid-template-columns: 1fr;
    gap: 24px;
  }
}

/* =========================================
   TYPY ŘEŠENÍ — DESKTOP (základ)
   ======================================= */
#otrock-typy-reseni-dva-sloupce.otrock-typy-reseni{
  background: var(--otrock-font-color-secondary);
  padding-bottom: 96px;
}

.otrock-typy-reseni__grid{
  display: grid;
  grid-template-columns: 1fr 1fr; /* širší obsah vlevo */
  gap: 96px;
  align-items: center;
}


/* LIST — shodný vzhled jako v inspiraci + přidaný <p> */
.otrock-typy-reseni__list{
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.otrock-typy-reseni__item{
  display: grid;
  grid-template-columns: 50px 1fr; /* ikona | text */
  column-gap: 24px;
  align-items: start;              /* H6 + odstavec pod sebou */
}

.otrock-typy-reseni__icon{
  width: 50px; height: 50px;
  display: inline-flex; align-items: center; justify-content: center;
}
.otrock-typy-reseni__icon img{
  width: 100%; height: 100%;
  object-fit: contain; display: block;
}

.otrock-typy-reseni__itemtitle{ margin: 0 0 20px 0; }  /* h6 */
.otrock-typy-reseni__itemdesc{ margin: 0; }           /* p */

/* Obrázek vpravo */
.otrock-typy-reseni__image{
  width: 100%;
  height: auto;
  display: block;
  object-fit: contain;
}

/* =========================================
   MOBIL (<=768px)
   ======================================= */
@media (max-width: 768px){

  #otrock-typy-reseni-dva-sloupce.otrock-typy-reseni{
    padding-bottom: 64px;
  }

  .otrock-typy-reseni__grid{
    grid-template-columns: 1fr;   /* pod sebou */
    gap: 24px;
    text-align: center;
  }

  .otrock-typy-reseni__item{ text-align: left; }  /* seznam zarovnat vlevo */
}

/* =========================================
   TABLET ONLY (768–1024px) — VŽDY POSLEDNÍ BLOK
   (stejné chování jako mobil, případně drobné úpravy)
   ======================================= */
@media (min-width: 768px) and (max-width: 1024px){
  #otrock-typy-reseni-dva-sloupce.otrock-typy-reseni{
    padding-bottom: 64px;
  }

  .otrock-typy-reseni__grid{
    grid-template-columns: 1fr;   /* pod sebou */
    gap: 24px;
    text-align: center;
  }

  .otrock-typy-reseni__item{ text-align: left; }  /* seznam zarovnat vlevo */
}

/* =========================================
   DYNAMIC TABLE (Global) — DESKTOP (základ)
   ========================================= */
.otrock-dyntable{
  background: var(--otrock-font-color-secondary);
  padding-top: 96px;
  padding-bottom: 96px;
}
.otrock-dyntable__title{ margin: 0 0 20px 0; }

/* --- Tabulka --- */
.otrock-dyntable__table{
	max-width: 80%;
	margin: 0 auto;
  --otrock-cols: 3;
  background:#16203F;
  border:2px solid #0744F8;
  box-shadow:0 0 100px rgba(4,66,249,.3);
  border-radius:16px;
  overflow:hidden;
  font-size: 16px;
}
.otrock-dyntable__row{
  display:grid; 
  grid-template-columns: repeat(var(--otrock-cols), 1fr);
}
.otrock-dyntable__row.is-header .otrock-dyntable__cell{
  background: linear-gradient(0deg, #0744F8 0%, #050C33 100%);
  border-left: 1.5px solid #0744F8;
  border-top:  1.5px solid #0744F8;
}
.otrock-dyntable__row:not(.is-header) .otrock-dyntable__cell{
  border-left: 1px solid #0744F8;
  border-top:  1px solid #0744F8;
}
.otrock-dyntable__cellin{
  padding: 15px 18px; 
  display: flex; align-items: center; height: 100%;
}
.otrock-dyntable__text{ color:#fff; font-weight:500; line-height:130%; }

/* --- Mobilní / tablet karty (default skryté) --- */
.otrock-dyntablecards{ display:none; }
#otrock-projektove-rizeni-kiosky {
	padding-bottom: 96px;
}
/* =========================================
   MOBIL (<=768px)
   ========================================= */
@media (max-width: 768px){
	#otrock-projektove-rizeni-kiosky {
	padding-bottom: 64px;
}
	.otrock-dyntable__table{
	max-width: 100%;

}
  .otrock-dyntable{ padding-top: 0; padding-bottom: 64px; }

  /* Tabulka -> skryj, zapni karty */
  .otrock-dyntable__table{ display:none; }
  .otrock-dyntablecards{ display:grid; gap:24px; }

  .otrock-dyntablecard{
    background: linear-gradient(141.12deg, #060E37 42.16%, #1348EF 123.6%);
    border: 0.56px solid rgba(255,255,255,.2);
    box-shadow: inset 0 0 20.9px rgba(255,255,255,.1);
    border-radius: 24px;
    padding: 20px 40px;
    display:flex; flex-direction:column; gap:10px;
  }
  .otrock-dyntablecard__subtitle{ color:#fff; font-weight:700; font-size:18px; line-height:30px; }
  .otrock-dyntablecard__content{ display:flex; flex-direction:column; gap:20px; }
  .otrock-dyntablecard__block{ display:flex; flex-direction:column; }
  .otrock-dyntablecard__label{ color:#fff; font-weight:600; font-size:16px; line-height:30px; }
  .otrock-dyntablecard__value{ color:#fff; font-weight:600; font-size:16px; line-height:30px; }
  .otrock-dyntablecard__price{ color:#fff; font-weight:700; font-size:32px; line-height:48px; }
}

/* =========================================
   TABLET ONLY (768–1024px) — VŽDY POSLEDNÍ BLOK
   ========================================= */
@media (min-width: 768px) and (max-width: 1024px){
		#otrock-projektove-rizeni-kiosky {
	padding-bottom: 64px;
}
		.otrock-dyntable__table{
	max-width: 100%;

}
  .otrock-dyntable{ padding-top: 0; padding-bottom: 64px; }

  .otrock-dyntable__table{ display:none; }
  .otrock-dyntablecards{ display:grid; gap:24px; }

  .otrock-dyntablecard{
    background: linear-gradient(141.12deg, #060E37 42.16%, #1348EF 123.6%);
    border: 0.56px solid rgba(255,255,255,.2);
    box-shadow: inset 0 0 20.9px rgba(255,255,255,.1);
    border-radius: 24px;
    padding: 20px 40px;
    display:flex; flex-direction:column; gap:10px;
  }
  .otrock-dyntablecard__subtitle{ color:#fff; font-weight:700; font-size:18px; line-height:30px; }
  .otrock-dyntablecard__content{ display:flex; flex-direction:column; gap:20px; }
  .otrock-dyntablecard__block{ display:flex; flex-direction:column; }
  .otrock-dyntablecard__label{ color:#fff; font-weight:600; font-size:16px; line-height:30px; }
  .otrock-dyntablecard__value{ color:#fff; font-weight:600; font-size:16px; line-height:30px; }
  .otrock-dyntablecard__price{ color:#fff; font-weight:700; font-size:32px; line-height:48px; }
}

/* =========================================
   TECHNICKÉ PARAMETRY — DESKTOP (základ)
   ========================================= */
.otrock-techspecs{
    font-family: var(--otrock-font-base);
  padding-top: 96px;
  padding-bottom: 96px;
  font-family: var(--otrock-font-base);
  color: var(--otrock-font-color-primary);
}

.otrock-techspecs .otrock-h5 {margin: 0;}

.otrock-techspecs__grid{
  display: grid;
  grid-template-columns: 1fr 1fr; /* 50/50 */
  gap: 96px;
  align-items: center;
}

.otrock-techspecs__media{}
.otrock-techspecs__img{
  width: 80%;
  height: auto;
  display: block;
  margin: 0 auto;
}



.otrock-techspecs__divider{
  height: 1px;
  width: 100%;
  background: linear-gradient(90deg,
              rgba(42,54,75,.20) 0%,
              #5C75A4 50%,
              rgba(42,54,75,.20) 100%);
  margin: 40px 0 0 0 ;
}

.otrock-techspecs__accordion{
  list-style: none;
  margin: 0;
  padding: 0;
}

.otrock-techspecs__item{
  padding: 0;
}

/* dělící čára mezi otázkami (pod každou kromě poslední) */
.otrock-techspecs__item:not(:last-child)::after{
  content: "";
  display: block;
  height: 1px;
  width: 100%;
  background: linear-gradient(90deg,
              rgba(42,54,75,.20) 0%,
              #5C75A4 50%,
              rgba(42,54,75,.20) 100%);
  margin-top: 20px;
}

.otrock-techspecs__trigger{
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between; /* h5 vlevo, ikona vpravo na střed řádku */
  gap: 24px;
  padding: 20px 0 0 0;
  background: transparent;
  border: 0;
  color: inherit;
  cursor: pointer;
  text-align: left;
}


.otrock-techspecs__icon{
  width: 25px;
  height: 25px;
  flex: 0 0 25px;
  display: block;
}

.otrock-techspecs__answer{
  padding: 0 0 20px 0;
}


/* =========================================
   MOBIL (<=768px)
   ========================================= */
@media (max-width: 768px){

	.otrock-techspecs .otrock-badge  {
        text-align: center;
        display: block;
        margin: 0 auto 20px auto;
        } 
        .otrock-techspecs .otrock-h3   {
        text-align: center;
        } 
  .otrock-techspecs{
  padding-top: 64px;
  padding-bottom: 64px;
  }
  .otrock-techspecs__grid{
    grid-template-columns: 1fr; /* pod sebou */
    gap: 32px;
  }
  .otrock-techspecs__content{ order: 1; }
  .otrock-techspecs__media{ order: 2; } /* obrázek až poslední */

}

/* =========================================
   TABLET ONLY (768–1024px) — VŽDY POSLEDNÍ BLOK
   ========================================= */
@media (min-width: 768px) and (max-width: 1024px){
  .otrock-techspecs{
  padding-top: 64px;
  padding-bottom: 64px;
  }
  .otrock-techspecs__grid{
    grid-template-columns: 1fr; /* pod sebou */
    gap: 32px;
  }
  .otrock-techspecs__content{ order: 1; }
  .otrock-techspecs__media{ order: 2; } /* obrázek až poslední */
}

/* =========================================
   OBRÁZKY ZIG-ZAG — DESKTOP (základ)
   ======================================= */
.otrock-zigzag {
  /* žádný extra background – sekce dědí; použijeme boxed kontejner z globálu */
}
.otrock-zigzag__wrap{
  display: flex;
  justify-content: flex-start; /* default obrázek vlevo */         /* dýchá nahoře i když box leze ven dolů */
  padding-bottom: 192px;
  max-width: 80%;
margin: 0 auto;}
.otrock-zigzag.is-image-right .otrock-zigzag__wrap{ justify-content: flex-end; }

.otrock-zigzag__figure{
  position: relative;
  margin: 0;
  display: inline-block;
  border-radius: 24px;
}
.otrock-zigzag__image{
  display: block;
  width: clamp(380px, 38vw, 640px);
  height: auto;
  border-radius: 24px;
}

/* Infobox – Figma glass karta */
.otrock-zigzag__infobox{
  position: absolute;
  width: var(--otrock-zz-box-w, 526px);
  bottom: -20%;
  right: -60%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 32px 48px;
  gap: 10px;

  background: linear-gradient(141.12deg, #060E37 42.16%, #1348EF 123.6%);
  border: 0.5px solid rgba(255,255,255,0.2);
  box-shadow: inset 0 0 20.9px rgba(255,255,255,0.1);
  border-radius: 24px;
}


.otrock-zigzag.is-image-right .otrock-zigzag__infobox {
	right: 70%;
}

.otrock-zigzag.is-anchor-left .otrock-zigzag__infobox{
  left: calc(-1 * var(--otrock-zz-inset, 50px));
  right: auto; /* kotva vlevo dole */
}

/* =========================================
   MOBIL (<=768px)
   ======================================= */
@media (max-width: 768px){
	    .otrock-zigzag__image-2{
    width: 100%;
  }
  .otrock-zigzag__wrap{
    justify-content: center;       /* obrázek na střed */
    padding-top: 0;
    padding-bottom: 0;
    max-width: 100%;
  }
  .otrock-zigzag__image{
    width: 100%;
  }
  .otrock-zigzag__infobox{
    position: relative;              /* jde pod obrázek */
    width: 100%;
    z-index: 50;
    bottom: 0;
    right: 0;
    margin-top: -50px; /* „leze“ do obrázku shora */
  }
    .otrock-zigzag.is-image-right .otrock-zigzag__infobox {
    right: 0;
}
}

/* =========================================
   TABLET ONLY (768–1024px) — poslední blok
   ======================================= */
@media (min-width: 768px) and (max-width: 1024px){
  .otrock-zigzag__wrap{
    justify-content: center;       /* obrázek na střed */
    padding-top: 0;
    padding-bottom: 0;
     max-width: 100%;
  }
  .otrock-zigzag__image{
    width: 100%;
  }
    .otrock-zigzag__image-2{
    width: 100%;
  }
  .otrock-zigzag__infobox{
    position: relative;              /* jde pod obrázek */
    width: 100%;
    z-index: 50;
    bottom: 0;
    right: 0;
    margin-top: -50px; /* „leze“ do obrázku shora */
  }
  .otrock-zigzag.is-image-right .otrock-zigzag__infobox {
    right: 0;
}

}

/* --- Ikony v hlavičkách tabulky --- */
.otrock-dyntable__headicon{
  width: 22px; height: 22px;
  display: inline-flex; align-items: center; justify-content: center;
  margin-right: 10px;
}
.otrock-dyntable__headicon img{ width:100%; height:100%; object-fit:contain; display:block; }

/* --- Ikona v titulku mobilní karty (režim 'cols') --- */
.otrock-dyntablecard__subtitle{
  display:flex; align-items:center; gap:10px;
}
.otrock-dyntablecard__icon{
  width: 22px; height: 22px; display:inline-flex; align-items:center; justify-content:center;
}
.otrock-dyntablecard__icon img{ width:100%; height:100%; object-fit:contain; display:block; }

#otrock-energy-table {
	padding-bottom: 0;
}
#otrock-energy-table-2 {
	padding-top: 48px;
}

/* =========================================
   ZIGZAG IMAGES — DESKTOP (základ)
   ========================================= */
.otrock-zigzag{ 
  font-family: var(--otrock-font-base);
  padding-bottom: 96px;
  padding-top: 96px;
  /* pokud je potřeba sekční pozadí, přidej zde; výchozí čisté */
}

#otrock-obrazky-zig-zah {
	padding-top: 0!important;
}
#otrock-obrazky-zig-zah .otrock-zigzag__grid {
	max-width: 80%;
	margin: 0 auto;
}

.otrock-zigzag .otrock-h5 {
	  line-height: 28px;
}
.otrock-zigzag__grid{
  display: grid;
  grid-template-columns: 1fr 1fr;        /* 50/50 */
  gap: 96px;
  align-items: center;
  grid-template-areas: "media content";  /* default: obrázek vlevo, obsah vpravo */
}

/* prohození na desktopu přes argument */
.otrock-zigzag__grid.is-reversed-desktop{
  grid-template-areas: "content media";
}

.otrock-zigzag__media{   grid-area: media; }
.otrock-zigzag__content{ grid-area: content; }


/* ===== List s ikonami (stejná logika jako wherehelp) ===== */
.otrock-zigzag__features{
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 48px;
}

.otrock-zigzag__feature{
  display: grid;
  grid-template-columns: 50px 1fr;       /* ikona | texty */
  column-gap: 24px;
  align-items: start;
  text-align: left;                      /* list zarovnaný doleva */
}

.otrock-zigzag__icon{
  width: 50px; height: 50px;
  display: inline-flex;
  align-items: center; justify-content: center;
  flex-shrink: 0;
}
.otrock-zigzag__icon img{
  width: 100%; height: 100%; object-fit: contain; display: block;
}

.otrock-zigzag__title{ margin: 0 0 6px 0; }
.otrock-zigzag__desc{  margin: 0; }

/* =========================================
   MOBIL (<=768px)
   ========================================= */
@media (max-width: 768px){

	#otrock-obrazky-zig-zah .otrock-zigzag__grid {
		max-width: 100%;
	}
	.otrock-zigzag{ 
  font-family: var(--otrock-font-base);
  padding-bottom: 64px;
  padding-top: 64px;
  /* pokud je potřeba sekční pozadí, přidej zde; výchozí čisté */
}
	#otrock-obrazky-zig-zah .otrock-zigzag__grid {
	max-width: 100%;
	margin: 0 auto;
}

  .otrock-zigzag__grid,
  .otrock-zigzag__grid.is-reversed-desktop{
    grid-template-columns: 1fr;
    grid-template-areas:
      "media"
      "content";                          /* na mobilu je VŽDY první obrázek */
    gap: 48px;
  }

  .otrock-zigzag__features{ gap: 20px; }

  .otrock-zigzag__feature{
    grid-template-columns: 50px 1fr;
    column-gap: 20px;
  }

  .otrock-zigzag__icon{ width: 50px; height: 50px; }
}

#trisloupce .otrock-zigzag__wrap  {
	max-width: 100%;
}

#trisloupce .otrock-h6 {
	margin: 0;
}


/* =========================================
   TABLET ONLY (768–1024px) — VŽDY POSLEDNÍ BLOK
   (základně stejné jako mobil, jen trochu větší mezery)
   ========================================= */
@media (min-width: 768px) and (max-width: 1024px){

	#otrock-obrazky-zig-zah .otrock-zigzag__grid {
		max-width: 100%;
	}
	.otrock-zigzag{ 
  font-family: var(--otrock-font-base);
  padding-bottom: 64px;
  padding-top: 64px;
  /* pokud je potřeba sekční pozadí, přidej zde; výchozí čisté */
}
	#otrock-obrazky-zig-zah .otrock-zigzag__grid {
	max-width: 100%;
	margin: 0 auto;
}

  .otrock-zigzag__grid,
  .otrock-zigzag__grid.is-reversed-desktop{
    grid-template-columns: 1fr;
    grid-template-areas:
      "media"
      "content";                          /* na mobilu je VŽDY první obrázek */
    gap: 48px;
  }

  .otrock-zigzag__features{ gap: 20px; }

  .otrock-zigzag__feature{
    grid-template-columns: 50px 1fr;
    column-gap: 20px;
  }

  .otrock-zigzag__icon{ width: 50px; height: 50px; }

}

#otrock-tv-sat-technologie-2 .otrock-techcards__grid {
	max-width: 80%;
	margin: 0 auto;
}

/* =========================================
   MOBIL (<=768px)
   ========================================= */
@media (max-width: 768px){
	#otrock-tv-sat-technologie-2 .otrock-techcards__grid {
	max-width: 100%;
	margin: 0 auto;
}

}

/* =========================================
   TABLET ONLY (768–1024px) — VŽDY POSLEDNÍ BLOK
   (základně stejné jako mobil, jen trochu větší mezery)
   ========================================= */
@media (min-width: 768px) and (max-width: 1024px){
	#otrock-tv-sat-technologie-2 .otrock-techcards__grid {
	max-width: 100%;
	margin: 0 auto;
}
}

/* Levý sloupec zapnutý */
.otrock-zigzag.has-leftcol .otrock-zigzag__wrap{
  align-items: flex-start;
  gap: 64px;
}

.otrock-zigzag.has-leftcol  .otrock-zigzag__infobox {
	bottom: -40%;
}

/* Šířka levého sloupce */
.otrock-zigzag__left{
  flex: 0 0 var(--otrock-zz-left-w, 420px);
  max-width: var(--otrock-zz-left-w, 420px);
}
.otrock-zigzag__left .otrock-badge{ display:inline-block; margin-bottom:20px; }
.otrock-zigzag__left-title{ margin:20px 0 0; }

/* List uvnitř infoboxu */
.otrock-zigzag__infobox .otrock-zigzag__ibox-list{
  list-style:none; margin:20px 0 0; padding:0; display:grid; gap:24px;
}
.otrock-zigzag__infobox .otrock-zigzag__ibox-li{
  display:flex; align-items:center; gap:24px;
}
.otrock-zigzag__infobox .otrock-zigzag__ibox-icon img{
  width:50px; height:50px; display:block;
}


/* =======================
   CERTIFIKACE – krokový grid
   ======================= */

/* DESKTOP (základ) */
.otrock-cert-steps {
  font-family: var(--otrock-font-base);
  padding-bottom: 96px;
}

.otrock-cert-steps__grid {
  position: relative;                 /* pro čárkovanou spojnici */
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 48px;
  margin: 0 auto;
}

/* čárkovaná spojnice napříč gridem – jen desktop */
.otrock-cert-steps__grid::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  /* výška tak, aby "prolínala" modré boxy zhruba v polovině */
  top: 50%;                         /* dolaď podle reálného obsahu */
  border-top: 2px dashed rgba(174, 180, 255, 0.5);
  z-index: 0;                         /* za položkami */
}

.otrock-cert-steps__item {
  text-align: center;
  position: relative;
  z-index: 1;                         /* nad spojnicí */
}

/* číslo kroku (SVG číslice) – mírný přesah do modrého boxu */
.otrock-cert-steps__num {
  display: block;
  height: 82px;                       /* podle figmy 81.5px */
  width: auto;
  margin: 0 auto -20px;               /* přesah pod číslo do boxu */
}

/* modrý rámeček s h6 */
.otrock-cert-steps__title {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 36px 25px;
  min-height: 100px;                  /* výška z figmy 100.7px */
  background: #0744F8;                /* Action blue */
  color: #FFFFFF;
  font-family: var(--otrock-font-heading, var(--otrock-font-base));
  font-weight: 600;
  font-size: 18px;
  line-height: 1.23;
  letter-spacing: -0.02em;
  border-radius: 16px;
  box-shadow: 0 15px 40px rgba(7, 68, 248, 0.35);
  isolation: isolate;
}

/* popisek pod boxem */
.otrock-cert-steps__desc {
  margin-top: 16px;
  color: #AEB4FF;                     /* podle figmy */
  font-size: 16px;
  line-height: 1.23;
}

/* MOBIL (<=768px) */
@media (max-width: 768px){
	.otrock-cert-steps {
  font-family: var(--otrock-font-base);
  padding-bottom: 64px;
}
  .otrock-cert-steps__grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .otrock-cert-steps__grid::before {
    display: none;                    /* bez spojnice na mobilu */
  }
  .otrock-cert-steps__num {
    height: 72px;
    margin: 0 auto -12px;
  }
  .otrock-cert-steps__title {
    padding: 22px 18px;
    min-height: unset;
  }
  .otrock-cert-steps__desc {
    margin-left: auto;
    margin-right: auto;
  }
}

/* TABLET ONLY (768–1024px) — VŽDY POSLEDNÍ BLOK */
@media (min-width: 768px) and (max-width: 1024px){
		.otrock-cert-steps {
  font-family: var(--otrock-font-base);
  padding-bottom: 64px;
}
  .otrock-cert-steps__grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .otrock-cert-steps__grid::before {
    display: none;                    /* bez spojnice na mobilu */
  }
  .otrock-cert-steps__num {
    height: 72px;
    margin: 0 auto -12px;
  }
  .otrock-cert-steps__title {
    padding: 22px 18px;
    min-height: unset;
  }
  .otrock-cert-steps__desc {
    margin-left: auto;
    margin-right: auto;
  }
}

/* ===== PATCH: Certifikace – zarovnání čáry, fixní výška boxů, překryv čísla ===== */

/* DESKTOP (základ) */
.otrock-cert-steps{
  /* ladicí proměnné – pokud bude potřeba jemně posunout */
  --cert-num-h: 82px;          /* výška SVG čísla */
  --cert-num-underlap: 20px;   /* o kolik má číslo zajíždět POD modrý box */
  --cert-box-h: 116px;         /* pevná výška modrého boxu (1–2 řádky) */
}

.otrock-cert-steps__grid{
  position: relative;
  isolation: isolate; /* jistota pro vrstvy */
}


/* stacking pořadí položek */
.otrock-cert-steps__item{ position: relative; z-index: 0; }

/* číslo – zajíždí POD box (+ je pod čárou i textem) */
.otrock-cert-steps__num{
  height: var(--cert-num-h);
  width: auto;
  display: block;
  margin: 0 auto calc(-1 * var(--cert-num-underlap));
  position: relative;
  z-index: 0;
}

/* modrý box – všechno uprostřed, pevná výška, je nad čárou i nad číslem */
.otrock-cert-steps__title{
  position: relative;
  z-index: 2;
  height: var(--cert-box-h);      /* stejné pro všechny položky */
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 25px;                /* výška řeší height, ne padding */
  text-align: center;
  /* pro jistotu, ať dlouhé slovo nezlomí layout */
  word-break: break-word;
}

/* text pod boxem zůstává beze změny */
.otrock-cert-steps__desc{ position: relative; z-index: 2; }

/* MOBIL (<=768px) – čára pryč, ostatní chování zachovat */
@media (max-width: 768px){
  .otrock-cert-steps__grid::before{ display: none; }
  /* klidně můžeš snížit výšku boxu, pokud chceš kompaktnější mobil */
  /* .otrock-cert-steps{ --cert-box-h: 104px; } */
}

/* TABLET (768–1024px) – čára pryč, stejné jako mobil */
@media (min-width: 768px) and (max-width: 1024px){
  .otrock-cert-steps__grid::before{ display: none; }
}

/* ============================
   CERT COLS – DESKTOP (základ)
   ============================ */
.otrock-certcols{ padding-top: 0px ; padding-bottom: 96px }

.otrock-certcols__grid{
  display: grid;
  grid-template-columns: 1fr 1fr;   /* dva stejné sloupce */
  gap: 64px;                        /* mezera mezi sloupci i řádky */
}

.otrock-certcols__list{
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

/* 1 položka: ikona vlevo, obsah vpravo */
.otrock-certcols__item{
  display: grid;
  grid-template-columns: 50px 1fr;  /* fix šířky pro ikonu */
  column-gap: 24px;
  align-items: start;
}

.otrock-certcols__icon{
  width: 50px; height: 50px;
  display: inline-flex;
  align-items: center; justify-content: center;
}
.otrock-certcols__icon img{
  width: 50px; height: 50px; display: block; object-fit: contain;
}

.otrock-certcols__title{ margin: 0 0 20px 0; }
.otrock-certcols__body p{ margin: 0; }

/* ============================
   MOBIL (<=768px)
   ============================ */
@media (max-width: 768px){
.otrock-certcols{ padding-top: 0 ; padding-bottom: 64px }
  .otrock-certcols__grid{
    grid-template-columns: 1fr;     /* sloupce pod sebe */
    gap: 32px;
  }
  /* layout položky zůstává stejný (ikona vlevo, text vpravo) */
}

/* ============================
   TABLET ONLY (768–1024px) — stejné jako mobil (VŽDY POSLEDNÍ BLOK)
   ============================ */
@media (min-width: 768px) and (max-width: 1024px){
	.otrock-certcols{ padding-top: 0 ; padding-bottom: 64px }
  .otrock-certcols__grid{
    grid-template-columns: 1fr;
    gap: 32px;
  }
}

/* U položky s ikonou chceme textový blok (h6 + p) pod sebou */
.otrock-zigzag__infobox .otrock-zigzag__ibox-li{
  display: flex;
  align-items: flex-start; /* kvůli víceřádkovému textu */
  gap: 20px;
}

.otrock-zigzag__infobox .otrock-zigzag__ibox-text{
  display: flex;
  flex-direction: column;
  gap: 10px; /* mezera mezi h6 a p */
}

.otrock-zigzag__infobox .otrock-zigzag__ibox-desc{
  margin: 0; /* zarovnáme s h6 */
}

/* =========================
   PRINCE2 / Method Split Card
   DESKTOP (základ)
   ========================= */
.otrock-method-split{
  padding-bottom: var(--otrock-row-pb, 64px);
}
.otrock-method-split__inner{
  display:flex;
  gap:0;                 /* žádná mezera mezi sloupci */
  align-items:stretch;
  min-height: 400px;
}

/* Poměry sloupců */
.otrock-method-split__content{ flex:0 0 var(--otrock-col-a,55%); }
.otrock-method-split__media  { flex:0 0 var(--otrock-col-b,45%); }

/* KARTA (obsah) – viz Figma */
.otrock-method-split__content{
  background: linear-gradient(141.12deg,#060E37 42.16%,#1348EF 123.6%);
  border: .5px solid rgba(255,255,255,.2);
  box-shadow: inset 0 0 20.9px rgba(255,255,255,.1);
  border-radius: 24px;
  padding: 50px;
  position: relative;
  z-index: 2;
}

/* MEDIA sloupec – obrázek v pozadí, o 20px kratší nahoře i dole */
.otrock-method-split__media{
  position: relative;
  z-index: 1;
  margin: 20px 0; /* efekt kratšího „vykukujícího“ boxu */
  background: var(--otrock-media-bg, none) center center / cover no-repeat;
  /* radius jen na vnější straně – nastaví parent class níže */
  border-radius: 0;
}

/* Strana zaoblení podle pozice obrázku na DESKTOPU */
.otrock-method-split__inner.is-media-right .otrock-method-split__media{
  border-top-right-radius: 24px;
  border-bottom-right-radius: 24px;
}
.otrock-method-split__inner.is-media-left .otrock-method-split__media{
  border-top-left-radius: 24px;
  border-bottom-left-radius: 24px;
}

/* Otočení pořadí na desktopu */
.otrock-method-split__inner.is-reversed-desktop .otrock-method-split__content{ order:2; }
.otrock-method-split__inner.is-reversed-desktop .otrock-method-split__media  { order:1; }


.otrock-method-split__list{
  margin:0 0 20px 0;
  padding-left:1.3rem;
  list-style:disc;
}

.otrock-method-split__li{ margin:0 0 10px 0; color:#fff; }
.otrock-method-split__li-main{ font-weight:600; }
.otrock-method-split__li-note{
  margin-left:.25rem;
  font-weight:400;
  font-size:14px;
  line-height:24px;
  color:#AEB2E2;
}


/* ===== MOBIL (<=768px) — FIX ===== */
@media (max-width: 768px){
  .otrock-method-split__inner{ flex-direction: column; }

  /* Zrušit desktopové poměry sloupců */
  .otrock-method-split__media,
  .otrock-method-split__content{
    flex: none;          /* místo flex:0 0 var(..) */
    width: 100%;
  }

  /* Obrázek nahoře, vždy viditelný; bez spodního radiusu */
  .otrock-method-split__media{
    order: -1;               /* obrazek první */
    height: 220px;
    margin: 0;               /* bez 20px okrajů */
    background: var(--otrock-media-bg, none) center/cover no-repeat;
    border-radius: 24px 24px 0 0; /* jen horní vnější rohy */
  }

  /* Přepsat desktopové „side“ radiusy */
  .otrock-method-split__inner.is-media-right .otrock-method-split__media,
  .otrock-method-split__inner.is-media-left  .otrock-method-split__media{
    border-radius: 24px 24px 0 0;
  }

  /* Přepsat desktopové pořadí u reverse varianty */
  .otrock-method-split__inner.is-reversed-desktop .otrock-method-split__media{ order: -1; }
  .otrock-method-split__inner.is-reversed-desktop .otrock-method-split__content{ order: 2; }

  .otrock-method-split__content{ padding: 25px;        margin-top: -20px; }
}

/* ===== TABLET ONLY (768–1024px) — FIX ===== */
@media (min-width: 768px) and (max-width: 1024px){
    .otrock-method-split__inner{ flex-direction: column; }

  /* Zrušit desktopové poměry sloupců */
  .otrock-method-split__media,
  .otrock-method-split__content{
    flex: none;          /* místo flex:0 0 var(..) */
    width: 100%;
  }

  /* Obrázek nahoře, vždy viditelný; bez spodního radiusu */
  .otrock-method-split__media{
    order: -1;               /* obrazek první */
    height: 400px;
    margin: 0;               /* bez 20px okrajů */
    background: var(--otrock-media-bg, none) center/cover no-repeat;
    border-radius: 24px 24px 0 0; /* jen horní vnější rohy */
  }

  /* Přepsat desktopové „side“ radiusy */
  .otrock-method-split__inner.is-media-right .otrock-method-split__media,
  .otrock-method-split__inner.is-media-left  .otrock-method-split__media{
    border-radius: 24px 24px 0 0;
  }

  /* Přepsat desktopové pořadí u reverse varianty */
  .otrock-method-split__inner.is-reversed-desktop .otrock-method-split__media{ order: -1; }
  .otrock-method-split__inner.is-reversed-desktop .otrock-method-split__content{ order: 2; }

  .otrock-method-split__content{ padding: 25px;        margin-top: -20px; }
}


/* DESKTOP (základ) */
.otrock-case-split { font-family: var(--otrock-font-base); }
.otrock-case-split__inner{
  display:grid;
  grid-template-columns: 1fr 1fr;          /* 50/50 */
  grid-template-areas: "content media";    /* default: vlevo obsah, vpravo obrázek */
  gap: 40px;
  align-items: center;
}
.otrock-case-split__inner.is-reversed-desktop{
  grid-template-areas: "media content";    /* otočení na desktopu */
}
.otrock-case-split__content{ grid-area: content; text-align: left; }
.otrock-case-split__media{ grid-area: media; }
.otrock-case-split__media img{
  width:100%;
  height:auto;
  display:block;
  border-radius: 16px;                      /* jemný radius jako ve vizuálu */
}

/* MOBIL (<=768px): obrázek vždy první */
@media (max-width: 768px){
  .otrock-case-split__inner,
  .otrock-case-split__inner.is-reversed-desktop{
    grid-template-columns: 1fr;
    grid-template-areas:
      "media"
      "content";
    gap: 24px;
  }
}

/* TABLET ONLY (768–1024px) — stejné jako mobil, vždy NA KONCI */
@media (min-width: 768px) and (max-width: 1024px){
  .otrock-case-split__inner,
  .otrock-case-split__inner.is-reversed-desktop{
    grid-template-columns: 1fr;
    grid-template-areas:
      "media"
      "content";
    gap: 24px;
  }
}

/* DESKTOP (základ) */
.otrock-brief { font-family: var(--otrock-font-base); padding-bottom: 96px;}

.otrock-brief__inner {
	max-width: 80%;
	margin: 0 auto;
}
/* Pyramida přes 6 sloupců; každá karta = span 2 */
.otrock-brief__grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 24px;
}

/* základ karty */
.otrock-brief__card {
  grid-column: span 2; /* výchozí šířka */
  background: linear-gradient(141.12deg,#060E37 42.16%,#1348EF 123.6%);
  border: .5px solid rgba(255,255,255,.2);
  box-shadow: inset 0 0 20.9px rgba(255,255,255,.1);
  border-radius: 24px;
  padding: 30px;
}

.otrock-brief__card p{
margin: 0;
}

/* Pozice jednotlivých karet v pyramidě (3 nahoře, 2 mezi) */
.otrock-brief__card:nth-child(1) { grid-column: 1 / span 2; } /* sloupce 1–2 */
.otrock-brief__card:nth-child(2) { grid-column: 3 / span 2; } /* sloupce 3–4 */
.otrock-brief__card:nth-child(3) { grid-column: 5 / span 2; } /* sloupce 5–6 */
.otrock-brief__card:nth-child(4) { grid-column: 2 / span 2; } /* mezi 1. a 2. (sloupce 2–3) */
.otrock-brief__card:nth-child(5) { grid-column: 4 / span 2; } /* mezi 2. a 3. (sloupce 4–5) */

.otrock-brief__media { width: 56px; height: 56px; margin-bottom: 12px; }
.otrock-brief__media img { width: 100%; height: 100%; object-fit: contain; display: block; }
.otrock-brief__card-title { margin: 0 0 8px 0; }
.otrock-brief__card-text  { margin: 0; opacity: .9; }

/* footer pod gridem */
.otrock-brief__footer { margin-top: 40px; text-align: center; }
.otrock-brief__note   { margin: 20px auto 20px auto;    max-width: 820px; }

.otrock-brief__btn:hover { transform: translateY(-1px); box-shadow: 0 8px 20px rgba(46,123,255,.35); }

/* MOBIL (<=768px) */
@media (max-width: 768px){
	.otrock-brief__inner {
	max-width: 100%;
	margin: 0 auto;
}
  .otrock-brief__grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  /* reset ručních pozic */
  .otrock-brief__card { grid-column: auto; }
  .otrock-brief__btn { display: block; width: 100%; }
  .otrock-brief__note { max-width: 100%; }
}

/* TABLET ONLY (768–1024px) — stejné jako mobil, vždy poslední blok */
@media (min-width: 768px) and (max-width: 1024px){
	.otrock-brief__inner {
	max-width: 100%;
	margin: 0 auto;
}
  .otrock-brief__grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  /* reset ručních pozic */
  .otrock-brief__card { grid-column: auto; }
  .otrock-brief__btn { display: block; width: 100%; }
  .otrock-brief__note { max-width: 100%; }
}

/* MOBIL (<=768px) — fix: všechny karty 100 % šířky, bez spanů a bez pozicování */
@media (max-width: 768px){
  .otrock-brief__grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  /* resetuje i nth-child pozice a výchozí "grid-column: span 2" */
  .otrock-brief__grid > .otrock-brief__card {
    grid-column: 1 / -1 !important;
  }

  .otrock-brief__btn {
    display: block;
    width: 100%;
  }
}

/* TABLET ONLY (768–1024px) — stejné chování jako mobil */
@media (min-width: 768px) and (max-width: 1024px){
  .otrock-brief__grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .otrock-brief__grid > .otrock-brief__card {
    grid-column: 1 / -1 !important;
  }

  .otrock-brief__btn {
    display: block;
    width: 100%;
  }
}

/* ============================
   PROJEKTOVÉ ŘÍZENÍ — Varianty (boxy pod sebou)
   DESKTOP (základ)
   ============================ */
#otrock-projektove-rizeni-varianty.otrock-variants{
  background: var(--otrock-font-color-secondary);
  padding-bottom: 96px;
}

.otrock-variants__wrap{
  width: 80%;                 /* požadavek: 80 % na desktopu */
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 24px;                  /* mezera mezi boxy */
}

/* Karta – glass + hairline + jemný gradient */
.otrock-variants__card{
  position: relative;
  border-radius: 24px;
  padding: 32px;
  background: linear-gradient(141.12deg,#060E37 42.16%,#1348EF 123.6%);
  border: .5px solid rgba(255,255,255,.2);
  box-shadow: inset 0 0 20.9px rgba(255,255,255,.1);
}

.otrock-variants__title{ margin: 0 0 10px 0; }

/* Bullets = plné tečky (disc) + naše typografie */
.otrock-variants__bullets{
  list-style: disc outside;
  padding-left: 20px;
  margin: 0;
}
.otrock-variants__bullets li{
  margin: 0 0 10px 0;
  color: var(--otrock-font-color-body);
}
.otrock-variants__bullets li:last-child{ margin-bottom: 0; }

/* Text + CTA pod boxy (na střed) */
.otrock-variants__note{ 
  text-align: center;
  margin: 20px 0 0 0;
}

.otrock-variants__cta{
  display: flex;
  align-items: center;
  justify-content: center;    /* button na střed */
}
.otrock-variants__cta .btn-small{ display: inline-block; }

/* ============================
   MOBIL (<=768px)
   ============================ */


@media (max-width: 768px){
  #otrock-projektove-rizeni-varianty.otrock-variants{
    padding-bottom: 64px;
  }
  .otrock-variants__wrap{
    width: 100%;              /* požadavek: 100 % na mobilu */
    gap: 24px;
  }
  .otrock-variants__card{ padding: 20px; }
}

/* ============================
   TABLET ONLY (768–1024px) — VŽDY POSLEDNÍ BLOK
   (stejně jako mobil)
   ============================ */
@media (min-width: 768px) and (max-width: 1024px){
  #otrock-projektove-rizeni-varianty.otrock-variants{
    padding-bottom: 64px;
  }
  .otrock-variants__wrap{
    width: 100%;              /* požadavek: 100 % na mobilu */
    gap: 24px;
  }
  .otrock-variants__card{ padding: 20px; }
}

/* DESKTOP (základ) */
.otrock-kiosky{
  /* sekční background + rádius + okraje */
  background: #16203F;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 24px;
  padding: 50px;
}

.otrock-kiosky__head{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 16px;
  margin-bottom: 20px;
  text-align: left;
}
.otrock-kiosky__head .otrock-h5{ margin: 0; }

/* šipky – vpravo na řádku */
#otrock-projektove-rizeni-kiosky .otrock-blog__arrows{
  display: flex !important;
  align-items: center;
  gap: 16px;
  margin: 0 0 0 auto;   /* posune šipky úplně vpravo */
  justify-content: flex-end;
}

/* slider media tile */
.otrock-kiosky__media{
  position: relative;
  overflow: hidden;
  border-radius: 12px;
  aspect-ratio: 16/9;   /* drží poměr */
  background: #0A0F2A;
}
.otrock-kiosky__media img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .25s ease;
}


/* MOBIL (<=768px) */
@media (max-width: 768px){
  .otrock-kiosky{ padding: 20px; border-radius: 12px; }
    .otrock-kiosky__head{
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    margin-bottom: 16px;
  }
  #otrock-projektove-rizeni-kiosky .otrock-blog__arrows{
    margin: 10px 0 0 0;
    justify-content: center;
  }

}

/* TABLET ONLY (768–1024px) — stejné jako mobil + drobné zvětšení mezer */
@media (min-width: 768px) and (max-width: 1024px){
  .otrock-kiosky{ padding: 22px; border-radius: 12px; }
  #otrock-projektove-rizeni-kiosky .otrock-blog__arrows{ margin-top: 10px; }
}

/* =========================
   SLUZBY – SEZNAM KATEGORIÍ
   Desktop základ (20/80), mobil stack; badge 100 % na mobilu
   ========================= */

.otrock-services-list { 
  /* wrapper už má odsazení z .otrock-section-boxed */
  padding-top: 96px;
  padding-bottom: 96px;
}

.otrock-services-row {
  display: grid;
  grid-template-columns: 33% 1fr; /* 20/80 */
  gap: 64px;
  align-items: center;
  padding: 0;
  margin-bottom: 96px;
}

.otrock-services-row:last-child {
  border-bottom: none;
}

/* levý sloupec */
.otrock-services-row__media {
  width: 100%;
}

.otrock-services-row__img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 16px;
  object-fit: cover;
}

/* pravý sloupec */
.otrock-services-row__content {
  width: 100%;
}

.otrock-services-row__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 0px 24px;
  margin-top: 40px;
}

/* přizpůsobíme badge jemně (bereme náš základ .otrock-badge) */
.otrock-services-row__badge {
  /* nic agresivního, respektuje .otrock-badge */
}

/* ============= MOBIL (<=768px) ============= */
@media (max-width: 768px){
  .otrock-services-row {
    grid-template-columns: 1fr; /* stack */
    gap: 24px;
  }

  /* obrázek vždy první */
  .otrock-services-row__media { order: 0; }
  .otrock-services-row__content { order: 1; }

  /* badge na 100 % šířky – každý pod sebou */
  .otrock-services-row__badges {
    gap: 12px;
  }
  .otrock-services-row__badge {
    width: 100%;
    display: inline-flex;
    justify-content: center;
  }
}

/* ============= TABLET ONLY (768–1024px) — vždy poslední blok ============= */
@media (min-width: 768px) and (max-width: 1024px){
  .otrock-services-row {
    grid-template-columns: 1fr; /* stack */
    gap: 24px;
  }

  /* obrázek vždy první */
  .otrock-services-row__media { order: 0; }
  .otrock-services-row__content { order: 1; }

  /* badge na 100 % šířky – každý pod sebou */
  .otrock-services-row__badges {
    gap: 10px;
  }
  .otrock-services-row__badge {
    width: 100%;
    display: inline-flex;
    
}
}
a.otrock-badge {
	text-decoration: none;
	border-color: #FFF;
}


.page-template-page-proc-mitel .otrock-av-offer__item {
	border-radius: 50px;
	padding: 17px;
	background-color: #16203F;

}

/* =========================================
   PROČ MITEL — TIMELINE (DESKTOP základ)
   ======================================= */
#otrock-procmitel-timeline.otrock-timeline{
  background: var(--otrock-font-color-secondary);
  padding-bottom: 96px;
}

.otrock-timeline__wrap{
  position: relative;
  width: 50%;                 /* požadavek: 50 % šířky na desktopu */
  margin: 0 auto;             /* centrovat v rámci .otrock-section-boxed */
}

/* vertikální lišta přes celou sekci */
.otrock-timeline__wrap::before{
  content: "";
  position: absolute;
  left: 50%;
  top: 0;
  bottom: 0;
  width: 2px;
  background: linear-gradient(#1348EF, #0744F8);
  opacity: .9;
  transform: translateX(-50%);
}

.otrock-timeline__list{
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-auto-rows: 140px;      /* každý řádek = jedna položka => stejné rozestupy */
  row-gap: 64px;
}

.otrock-timeline__item{
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;  /* 2 sloupce: vlevo|vpravo */
  align-items: center;
}

/* bod (tečka) na liště – vždy uprostřed řádku */
.otrock-timeline__dot{
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #0744F8;
  box-shadow: 0 0 0 4px rgba(7,68,248,.25), 0 0 24px rgba(7,68,248,.65);
}

/* vlastní obsah (přehazujeme sloupec podle .is-left/.is-right) */
.otrock-timeline__content{ 
  max-width: 92%;
}
.otrock-timeline__item.is-left  .otrock-timeline__content{ grid-column: 1; text-align: right; margin-right: 64px; }
.otrock-timeline__item.is-right .otrock-timeline__content{ grid-column: 2; text-align: left;  margin-left: 64px;  }

#otrock-procmitel-timeline .otrock-timeline__content .otrock-h3{ margin: 0 0 10px 0; }
#otrock-procmitel-timeline .otrock-timeline__content .otrock-paragraph-body{ margin: 0; }

/* ===== MOBILE (<=768px) ===== */
@media (max-width: 768px){
	#otrock-procmitel-timeline.otrock-timeline{
  background: var(--otrock-font-color-secondary);
  padding-bottom: 64px;
}
  .otrock-timeline__wrap{
    --tl-x: 35px;                       /* střed linky/tečky od levého okraje wrapperu */
    width: 100%;
  }
  /* linka prochází přes tečky (centrování na stejnou osu) */
  .otrock-timeline__wrap::before{
    left: var(--tl-x);
    transform: translateX(-50%);        /* !!! klíčové — střed linky = --tl-x */
  }
  .otrock-timeline__item{
    grid-template-columns: 28px 1fr;
    align-items: center;
    column-gap: 64px;
  }
  .otrock-timeline__dot{
    left: var(--tl-x);
    transform: translate(-50%, -50%);   /* střed tečky = --tl-x */
  }
  .otrock-timeline__item .otrock-timeline__content{
    grid-column: 2 !important;
    text-align: left !important;
    margin: 0 !important;
    max-width: 100%;
  }
}

/* ===== TABLET (768–1024px) ===== */
@media (min-width: 768px) and (max-width: 1024px){
		#otrock-procmitel-timeline.otrock-timeline{
  background: var(--otrock-font-color-secondary);
  padding-bottom: 64px;
}
  .otrock-timeline__wrap{
    --tl-x: 35px;                       /* střed linky/tečky od levého okraje wrapperu */
    width: 100%;
  }
  /* linka prochází přes tečky (centrování na stejnou osu) */
  .otrock-timeline__wrap::before{
    left: var(--tl-x);
    transform: translateX(-50%);        /* !!! klíčové — střed linky = --tl-x */
  }
  .otrock-timeline__item{
    grid-template-columns: 28px 1fr;
    align-items: center;
    column-gap: 64px;
  }
  .otrock-timeline__dot{
    left: var(--tl-x);
    transform: translate(-50%, -50%);   /* střed tečky = --tl-x */
  }
  .otrock-timeline__item .otrock-timeline__content{
    grid-column: 2 !important;
    text-align: left !important;
    margin: 0 !important;
    max-width: 100%;
  }
}

/* =======================================
   KONTAKT (page-specific) — DESKTOP
   ======================================= */
#otrock-kontakt-kontakt.otrock-kontaktpage{
  position: relative;
  padding-top: 96px;    
  padding-bottom: 96px;                /* prostor okolo “rail” pozadí */
  overflow: visible;              /* karta může “vyjíždět” přes rail */
}

.otrock-contact-address {
	  padding-top: 96px;    
  padding-bottom: 96px;   
}

/* Full-width “rail” pozadí – není přes celou výšku sekce */
#otrock-kontakt-kontakt.otrock-kontaktpage::before{
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
  width: 100vw;                   /* full width přes okraje layoutu */
  height: 700px;                  /* záměrně menší než výška karty */
  background: #16203F;

  z-index: 0;
}

.otrock-kontaktpage .otrock-section-boxed{ position: relative; z-index: 1; }

.otrock-kontaktpage__grid{
  display: grid;
  grid-template-columns: 1fr 1fr;            /* 50/50 */
  gap: 64px;
  align-items: center;
}

/* Levý sloupec */
.otrock-kontaktpage__content{
  display: flex;
  flex-direction: column;
  max-width: 80%;
}
.otrock-kcnt-list{
  margin: 0; padding: 0; list-style: none;
  display: flex; flex-direction: column; gap: 20px;
}
.otrock-kcnt-row{ display: flex; align-items: center; gap: 16px; }
.otrock-kcnt-icon{ width: 56px; height: 38px; display: block; }
.otrock-kcnt-link{ text-decoration: none; }
.otrock-kcnt-sep{ width: 80%; height: 1px; background: #373D5C; margin: 24px 0; }

/* Pravý sloupec: karta s formulářem (skleněná) */
.otrock-kontaktpage__form{
  background: rgba(22,32,63,1);
  backdrop-filter: blur(2px);
  border-radius: 32px;
  padding: 72px 80px;
  box-shadow:
    0 24px 80px rgba(0,0,0,.45),
    inset 0 0 20px rgba(255,255,255,.08);
}

/* =======================================
   MOBIL (<=768px)
   ======================================= */
@media (max-width: 768px){
	#otrock-kontakt-kontakt.otrock-kontaktpage{
  position: relative;
  padding-top: 64px;    
  padding-bottom: 64px;                /* prostor okolo “rail” pozadí */
  overflow: visible;              /* karta může “vyjíždět” přes rail */
}

.otrock-contact-address {
	  padding-top: 64px;    
  padding-bottom: 64px;   
}
  #otrock-kontakt-kontakt.otrock-kontaktpage{
    padding-bottom: 64px;

  }
  #otrock-kontakt-kontakt.otrock-kontaktpage::before{
display: none;
  }
  .otrock-kontaktpage__grid{
    grid-template-columns: 1fr;
    gap: 64px;
  }
  .otrock-kontaktpage__content{ max-width: 100%; }
  .otrock-kcnt-icon{ width: 40px; height: 28px; }
  .otrock-kontaktpage__form{ padding: 28px 20px; }
}

/* =======================================
   TABLET ONLY (768–1024px) — VŽDY POSLEDNÍ
   ======================================= */
@media (min-width: 768px) and (max-width: 1024px){
		#otrock-kontakt-kontakt.otrock-kontaktpage{
  position: relative;
  padding-top: 64px;    
  padding-bottom: 64px;                /* prostor okolo “rail” pozadí */
  overflow: visible;              /* karta může “vyjíždět” přes rail */
}

.otrock-contact-address {
	  padding-top: 64px;    
  padding-bottom: 64px;   
}
  #otrock-kontakt-kontakt.otrock-kontaktpage{
    padding-bottom: 64px;

  }
  #otrock-kontakt-kontakt.otrock-kontaktpage::before{
display: none;
  }
  .otrock-kontaktpage__grid{
    grid-template-columns: 1fr;
    gap: 64px;
  }
  .otrock-kontaktpage__content{ max-width: 100%; }
  .otrock-kcnt-icon{ width: 40px; height: 28px; }
  .otrock-kontaktpage__form{ padding: 28px 20px; }
}

/* ===========================
   SEKCE: Kontakt – Adresa
   =========================== */

/* DESKTOP (základ) */
.otrock-contact-address { 
  /* případně pozadí sekce řeší parent; držíme se globálních barev */
}

.otrock-contact-address__grid{
  display: grid;
  grid-template-columns: 1fr 1fr; /* 50/50 */
  gap: 192px;
  align-items: center; /* obraz vpravo vertikálně na střed */
}



.otrock-contact-address__content { 
}

.otrock-contact-address__h4{
  margin-bottom: 22px;
}

.otrock-contact-address__block + .otrock-contact-address__divider{
  margin: 22px 0 26px;
  height: 1px;
  background: rgba(255,255,255,0.12);
}

.otrock-contact-address__block h6{
  margin-bottom: 10px;
}

.otrock-contact-address__block p{
  color: var(--otrock-font-color-body);
}

.otrock-contact-address__note{
  margin: 20px 0 40px;
  color: var(--otrock-font-color-body);
}

.otrock-contact-address__social{
  display: flex;
  align-items: center;
  gap: 24px;
}

.otrock-contact-address__social-link img{
  display: block;
  width: 50px;
  height: 50px;
}

.otrock-contact-address__media{
  display: flex;
  justify-content: center;
}

.otrock-contact-address__img{
  width: 75%;
  height: auto;
  border-radius: 28px;
  display: block;
}

/* MOBIL (<=768px) */
@media (max-width: 768px){
  .otrock-contact-address__grid{
    grid-template-columns: 1fr;
    gap: 64px;
  }
  /* obrazek první */
  .otrock-contact-address__media{ order: -1; }
  /* H4 na střed pouze na mobilu */
  .otrock-contact-address__h4{
    text-align: center;
    margin-bottom: 16px;
  }
  /* sociální ikony na střed */
  .otrock-contact-address__social{
    justify-content: center;
  }
  /* texty zůstávají vlevo */
}

/* TABLET ONLY (768–1024px) — VŽDY POSLEDNÍ BLOK */
@media (min-width: 768px) and (max-width: 1024px){
  .otrock-contact-address__grid{
    grid-template-columns: 1fr;
    gap: 64px;
  }
  /* obrazek první */
  .otrock-contact-address__media{ order: -1; }
  /* H4 na střed pouze na mobilu */
  .otrock-contact-address__h4{
    text-align: center;
    margin-bottom: 16px;
  }
  /* sociální ikony na střed */
  .otrock-contact-address__social{
    justify-content: center;
  }
}

/* dříve tu bylo white-space: pre-line; — pryč */
.otrock-contact-address__block p{
  /* white-space: pre-line; */ /* odstranit */
  color: var(--otrock-font-color-body);
  margin: 0; /* stáhne mezeru pod nadpisem */
}
.otrock-contact-address__block h6{
  margin: 0 0 8px; /* jemnější rozestup nadpis → text */
}

/* ============================
   NA STAZENI — DESKTOP (základ)
   ============================ */
#otrock-na-stazeni-seznam.otrock-downloads{
  background: var(--otrock-font-color-secondary);
  padding-bottom: 96px;
}

.otrock-downloads__grid{
  display: grid;
  grid-template-columns: 1fr 1fr;   /* 50/50 */
  gap: 40px;
  align-items: stretch;
      max-width: 80%;
      margin: 0 auto;
}

/* karta kategorie */
.otrock-download-card{
  display: flex;
  flex-direction: column;
  padding: 50px;

  /* zadaný vzhled boxu */
    border: 0.5px solid var(--Strokes-Stroke-cards, rgba(255, 255, 255, 0.20));
    background: linear-gradient(145deg, #060E37 35.8%, var(--Internet---IPTV, #1348EF) 150.32%);
    box-shadow: 0 0 20.9px 0 rgba(255, 255, 255, 0.10) inset;
  border-radius: 24px;
}

/* akce (buttony) */
.otrock-download-card__actions{
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.otrock-download-card .otrock-paragraph-body {
  margin-bottom: 40px;
}

.otrock-download-card .otrock-h5 {
  margin-bottom: 20px;
  line-height: 1.5;
}

/* button – vychází z .otrock-btn-kontakt-transparent, jen doladění ikony/zarovnání */
.otrock-download__btn{
  justify-content: space-between;     /* text vlevo, ikonka vpravo */
width: fit-content;
  text-align: left;
  gap: 24px;
}

.otrock-download__icon{
  width: 20px;
  height: 20px;
  display: inline-block;
  transition: filter .2s ease, transform .2s ease;
}

/* Hover stavu: bílé pozadí + černý text + černá ikona */
.otrock-download__btn:hover{
  background: #FFF;
  color: #050C33;
  border-color: #FFF;
}
.otrock-download__btn:hover .otrock-download__icon{
  filter: invert(1);                 /* z bílé udělá černou */
  transform: translateX(2px);
}

/* ============================
   MOBIL (<=768px)
   ============================ */
@media (max-width: 768px){
  #otrock-na-stazeni-seznam.otrock-downloads{
    padding-bottom: 64px;
  }
  .otrock-downloads__grid{
    grid-template-columns: 1fr;   /* 1 item na řádek */
    gap: 24px;max-width: 100%;
  }
}

/* ============================
   TABLET ONLY (768–1024px) — stejné jako mobil (VŽDY POSLEDNÍ)
   ============================ */
@media (min-width: 768px) and (max-width: 1024px){
  #otrock-na-stazeni-seznam.otrock-downloads{
    padding-bottom: 64px;
  }
  .otrock-downloads__grid{
    grid-template-columns: 1fr;   /* 1 item na řádek */
    gap: 24px;max-width: 100%;
  }
}

#otrock-homepage-services h5 a {
	color: inherit;
	text-decoration: none;
}

/* DESKTOP (základ) */
.otrock-blog-archive { position: relative; }
.otrock-blog-archive .otrock-section-boxed { max-width: var(--otrock-site-max); }

/* topbar */
.otrock-blog-archive__topbar{
  display:flex; align-items:center; justify-content:space-between;
  margin-bottom: 24px;
}
.otrock-blog-archive__filter-toggle{
  display:none; /* jen pro mobil */
  gap:10px; align-items:center; background:#0B1236; color:#fff;
  border:0; border-radius:28px; padding:12px 16px; cursor:pointer;
}
.otrock-blog-archive__filter-toggle .caret{ margin-left:6px; opacity:.8; }

/* 2 sloupce */
.otrock-blog-archive__grid{
  display:grid; grid-template-columns: 1fr 4fr; /* ~20/80 */
  gap: 90px;
}

/* panel filtru */
.otrock-blog-archive__filters{
  position:relative;
}
.otrock-blog-archive__filters-inner{
  padding:25px; border-radius:24px;
    background: rgba(22,32,63,.5);
  box-shadow: inset 0 0 20.9px rgba(255,255,255,.1);
}
.otrock-blog-archive__checks{ list-style:none; padding:0; margin:16px 0 18px 0; display:grid; gap:12px; }
.otrock-blog-archive__check{ display:flex; gap:12px; align-items:center; font-family:var(--otrock-font-base); color:#D8DCF7; }
.otrock-blog-archive__check input{
  width:18px; height:18px; accent-color: var(--otrock--color-primary-accent);
}

/* akce pod filtrem */
.otrock-blog-archive__filter-actions{ display:grid; gap:12px; }
.otrock-blog-archive__reset{
  width:100%; padding:17px 32px; border-radius:24px; background:#0F163D;
  border:1px solid #2A2F58; color:#AEB2E2; font-family:var(--otrock-font-base);
  cursor:pointer;
}

/* řazení vpravo */
.otrock-blog-archive__sort{ display:flex; align-items:center; gap:24px; color: #FFF}
.otrock-blog-archive__sort-select{
  background:#0B1236; color:#fff; border:1px solid #2A2F58; border-radius:20px;
  padding:10px 32px 10px 17px; font-family:var(--otrock-font-base);
}

/* grid článků */
.otrock-blog-archive__posts{ min-width:0; }
.otrock-blog-archive__list{
  display:grid; grid-template-columns: repeat(3, 1fr); gap:24px 24px;
}
.otrock-blog-archive__list.is-loading{ opacity:.6; pointer-events:none; }

/* karta */
.otrock-blog-archive__card{
   border-radius:24px; overflow:hidden;
  background: rgba(22,32,63,.5);
  box-shadow: inset 0 0 20.9px rgba(255,255,255,.1);
  display:flex; flex-direction:column;

}

.otrock-blog-archive__card:hover {
  background: linear-gradient(141.12deg,#060E37 42.16%,#1348EF 123.6%);
  box-shadow: inset 0 0 20.9px rgba(255,255,255,.1);

}
.otrock-blog-archive__thumb img{ display:block; width:100%; height:250px; object-fit:cover; }
.otrock-blog-archive__body{ padding:30px; display:flex; flex-direction:column; gap:20px; }
.otrock-blog-archive__body .otrock-h6{ color:#fff; margin:0; }
.otrock-blog-archive__body .otrock-p{ color:#AEB2E2; margin:0; }
.otrock-blog-archive__body .otrock-paragraph-body {
margin: 0;
}
/* „Přečíst článek“ */
.otrock-blog-archive__more{
  display:inline-flex; align-items:center; gap:10px;
  text-decoration:none; color:#D8DCF7; font-weight:600;
}
.otrock-blog-archive__more-ico{
  width:24px; height:24px; background: var(--ico) center/contain no-repeat;
  display:inline-block; transition:transform .2s ease;
}
.otrock-blog-archive__more:hover .otrock-blog-archive__more-ico{ transform: translateX(4px); }

/* load more */
.otrock-blog-archive__morewrap{ display:flex; justify-content:center; margin-top:80px; }

/* MOBIL (<=768px) */
@media (max-width: 768px){
  .otrock-blog-archive__topbar{
    flex-direction: column; align-items: stretch; gap:12px;
  }
  .otrock-blog-archive__filter-toggle{ display:flex;         justify-content: space-between;}
  .otrock-blog-archive__sort{ justify-content:flex-start; }

  .otrock-blog-archive__grid{
    grid-template-columns: 1fr; gap:24px;
  }
  .otrock-blog-archive__filters{
    display:block;
  }
  .otrock-blog-archive__filters[data-otrock-filter-panel]{ display:none; }
  .otrock-blog-archive__filters.is-open,
  .otrock-blog-archive__filters[data-otrock-filter-panel].is-open{ display:block; }
  
  .otrock-blog-archive__list{
    grid-template-columns: 1fr; gap:24px;
  }
  .otrock-blog-archive__thumb img{ height:180px; }
}

/* TABLET ONLY (768–1024px) — VŽDY POSLEDNÍ BLOK */
@media (min-width: 768px) and (max-width: 1024px){
  .otrock-blog-archive__topbar{
    flex-direction: column; align-items: stretch; gap:12px;
  }
  .otrock-blog-archive__filter-toggle{ display:flex;         justify-content: space-between;}
  .otrock-blog-archive__sort{ justify-content:flex-start; }

  .otrock-blog-archive__grid{
    grid-template-columns: 1fr; gap:24px;
  }
  .otrock-blog-archive__filters{
    display:block;
  }
  .otrock-blog-archive__filters[data-otrock-filter-panel]{ display:none; }
  .otrock-blog-archive__filters.is-open,
  .otrock-blog-archive__filters[data-otrock-filter-panel].is-open{ display:block; }
  
  .otrock-blog-archive__list{
    grid-template-columns: 1fr; gap:24px;
  }
  .otrock-blog-archive__thumb img{ height:180px; }
}

.page-template-page-blog .otrock-partners__head {
max-width: 80%;
text-align: left;
margin: 0;
}

.page-template-page-blog  .otrock-head-section {
	padding-top: 0;
}

@media (max-width: 768px){
 .page-template-page-blog .otrock-partners__head{
max-width: 100%;
text-align: left;
margin: 0;
}
}

/* TABLET ONLY (768–1024px) — VŽDY POSLEDNÍ BLOK */
@media (min-width: 768px) and (max-width: 1024px){
 .page-template-page-blog .otrock-partners__head{
max-width: 100%;
text-align: left;
margin: 0;
}
}

/* MOBIL (<=768px) – skrýt první ikonku (má vzhled šipky) a panel pod tlačítkem */
@media (max-width: 768px){
  .otrock-blog-archive__filter-toggle img:first-child{ display:none; } /* necháme jen caret vpravo */
  .otrock-blog-archive__filters.in-topbar{ display:none; margin-top:12px; } /* skrytý stav */
  .otrock-blog-archive__filters.in-topbar.is-open{ display:block; }         /* otevřený stav */
}

/* TABLET ONLY (768–1024px) – stejné chování jako na mobilu */
@media (min-width: 768px) and (max-width: 1024px){
  .otrock-blog-archive__filter-toggle img:first-child{ display:none; }
  .otrock-blog-archive__filters.in-topbar{ display:none; margin-top:12px; }
  .otrock-blog-archive__filters.in-topbar.is-open{ display:block; }
}

.otrock-blog-archive__body a {
	text-decoration: none;
}

.otrock-blog-archive__filter-toggle .otrock-h6 {
	margin: 0;
}

/* ============================
   PAGE HEAD (H1 center + white content)
   DESKTOP (základ)
   ============================ */
.otrock-page-head__title{
  text-align: center;
  padding-bottom: 96px;
}

.otrock-page-head__content{
  font-family: var(--otrock-font-base); 
font-style: normal;
font-weight: 400;
font-size: 16px;
line-height: 32px;
  color: #FFF; 
  max-width: 80%;
  margin: 0 auto;

}
}

/* ============================
   MOBIL (<=768px)
   ============================ */
@media (max-width: 768px){
  .otrock-page-head__title{ text-align: center;  padding-bottom: 64px; }
  .otrock-page-head__content{ color: var(--otrock-font-color-primary); font-style: normal;
font-weight: 400;
font-size: 18px;
line-height: 30px;max-width: 100%;}


}

/* ============================
   TABLET ONLY (768–1024px) — VŽDY POSLEDNÍ BLOK
   ============================ */
@media (min-width: 768px) and (max-width: 1024px){
  .otrock-page-head__title{ text-align: center;  padding-bottom: 64px; }
  .otrock-page-head__content{ color: var(--otrock-font-color-primary); font-style: normal;
font-weight: 400;
font-size: 18px;
line-height: 30px;max-width: 100%;}
}


/* =========================
   404 PAGE – DESKTOP (základ)
   ========================= */
.otrock-404 {
  padding-top: 96px;
 padding-bottom: 96px;
  text-align: center;
}

.otrock-404 .otrock-h1 {
  margin: 0 0 32px 0;
  color: var(--otrock-font-color-primary);
}

.otrock-404__figure {
  margin: 0 auto 32px auto;
  max-width: 300px;              /* max šířka obrázku na PC */
}

.otrock-404__img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 24px;
}

.otrock-404__desc {
  max-width: 820px;
  margin: 0 auto 28px auto;
}

.otrock-404__desc .otrock-paragraph-body {
  color: var(--otrock-font-color-body); /* světlý text, jak používáme globálně */
}

.otrock-404__cta {
  display: flex;
  justify-content: center;
}

/* =========================
   MOBIL (<=768px)
   ========================= */
@media (max-width: 768px){
  .otrock-404 {
    padding-top: 64px;
    padding-bottom: 64px;
  }

  .otrock-404__figure {
    max-width: none;   /* plná šířka na mobilu */
    width: 100%;
    padding: 0 16px;
  }

  .otrock-404__desc {
    max-width: none;
    padding: 0 16px;
  }
}

/* =========================
   TABLET ONLY (768–1024px) — VŽDY POSLEDNÍ BLOK
   (stejné jako mobil, jen vlastní blok dle našich pravidel)
   ========================= */
@media (min-width: 768px) and (max-width: 1024px){
  .otrock-404 {
    padding-top: 64px;
    padding-bottom: 64px;
  }

  .otrock-404__figure {
    max-width: none;   /* plná šířka na mobilu */
    width: 100%;
    padding: 0 16px;
  }

  .otrock-404__desc {
    max-width: none;
    padding: 0 16px;
  }
}

/* DESKTOP (základ) */
.otrock-techspecs__answer .otrock-paragraph-body ul {
  list-style-type: disc;
  margin: 0.5rem 0 0.5rem 1.25rem;
  padding-left: 0.75rem;
}
.otrock-techspecs__answer .otrock-paragraph-body ul ul {
  list-style-type: disc; /* plné i vnořené */
  margin-left: 1rem;
}

/* MOBIL (<=768px) */
@media (max-width: 768px){
  .otrock-techspecs__answer .otrock-paragraph-body ul {
    margin-left: 1rem;
    padding-left: 0.5rem;
  }
}

/* TABLET ONLY (768–1024px) — VŽDY POSLEDNÍ BLOK */
@media (min-width: 768px) and (max-width: 1024px){
  .otrock-techspecs__answer .otrock-paragraph-body ul {
    margin-left: 1rem;
    padding-left: 0.5rem;
  }
}

.button-left {
	display: inline-flex;
}

@media (max-width: 768px){
.button-left {
	display: block;
}
}

@media (min-width: 768px) and (max-width: 1024px){
.button-left {
	display: block;
}
}

/* =========================
   FOOTER — DESKTOP (základ)
   ========================= */
.otrock-footer{
  /* PC: pozadí s obrázkem zprava dole (bez opakování) */
  background: url("/app/themes/mitel/img/images/13-footer.webp") no-repeat right bottom;
  background-color: var(--otrock-font-color-secondary);
  padding-top: 96px;
  padding-bottom: 96px;
  margin-top: 96px;
}


.otrock-footer__grid{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 2fr; /* poslední 2× */
  gap: 64px;
  align-items: start;
}

.otrock-footer__menu,
.otrock-footer__addresses,
.otrock-footer__contacts{
  list-style: none;
  margin: 32px 0 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.otrock-footer__menu {gap: 24px}
.otrock-footer__addresses {gap: 20px}
.otrock-footer__address + .otrock-footer__address{ margin-top: 8px; }
.otrock-footer__contact{
  display: grid;
  grid-template-columns: 50px 1fr;
  align-items: center;
  gap: 16px;
}
.otrock-footer__icon{ width: 50px; height: 50px; display: inline-flex; }
.otrock-footer__icon img{ width: 100%; height: 100%; object-fit: contain; display: block; }

.otrock-footer__col--wide .otrock-paragraph-body{ margin-top: 20px; }
.otrock-footer__logo img{ display: block; width: 160px; height: auto; }
.otrock-footer__col--wide {
  padding-left: 50px;
}
/* spodní lišta se separátory */
.otrock-footer__bottom{
  margin-top: 96px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 24px 24px;
}
.otrock-footer__bottom-item{
  position: relative;
  padding-left: 0;
}
.otrock-footer__bottom-item + .otrock-footer__bottom-item{
  padding-left: 20px;
}
.otrock-footer__bottom-item + .otrock-footer__bottom-item::before{
  content: "";
  position: absolute;
  left: 0px; top: 50%;
  transform: translateY(-50%);
  width: 1px; height: 16px;
  background: rgba(255,255,255,.3);
}

/* odkazy ve footeru */
.otrock-footer a{ color: var(--otrock-font-color-primary); text-decoration: none; }
.otrock-footer a:hover{ text-decoration: underline; }

/* =========================
   MOBIL (<=768px)
   ========================= */
@media (max-width: 768px){
  .otrock-footer__col--wide {
  padding-left: 0px;
}
  .otrock-footer{
    /* Mobile: gradient + jemný inset shadow */
background: linear-gradient(to right, #212671 0%, #0B0D27 100%);
    padding-top: 64px;
    padding-bottom: 64px;
    margin-top: 64px;
  }
  .otrock-footer__grid{
    grid-template-columns: 1fr; /* sloupce pod sebou */
  }
  .otrock-footer__logo img{ width: 50%; }
  /* spodní řádek: stejně jako na PC (wrap + separátory) — beze změn */

  .otrock-footer__bottom {
    margin-top: 48px;
    display: flex
;
    flex-wrap: unset;
    flex-direction: column;
    align-items: center;
    gap: 24px 24px;
    justify-content: start;
            align-items: start;
}

.otrock-footer__bottom-item + .otrock-footer__bottom-item::before {
	display: none;
}

.otrock-footer__bottom-item + .otrock-footer__bottom-item {
	padding-left: 0;
}

}

/* =========================
   TABLET ONLY (768–1024px) — VŽDY POSLEDNÍ BLOK
   (stejné chování jako mobil)
   ========================= */
@media (min-width: 768px) and (max-width: 1024px){
    .otrock-footer__col--wide {
  padding-left: 0px;
}
  .otrock-footer{
    /* Mobile: gradient + jemný inset shadow */
background: linear-gradient(to right, #212671 0%, #0B0D27 100%);
    padding-top: 64px;
    padding-bottom: 64px;
    margin-top: 64px
  }
  .otrock-footer__grid{
    grid-template-columns: 1fr; /* sloupce pod sebou */
  }
  .otrock-footer__logo img{ width: 25%; }
  /* spodní řádek: stejně jako na PC (wrap + separátory) — beze změn */

  .otrock-footer__bottom {
    margin-top: 48px;
    display: flex
;
    flex-wrap: unset;
    flex-direction: column;
    align-items: center;
    gap: 24px 24px;
    justify-content: start;
            align-items: start;
}

.otrock-footer__bottom-item + .otrock-footer__bottom-item::before {
	display: none;
}

.otrock-footer__bottom-item + .otrock-footer__bottom-item {
	padding-left: 0;
}

}

/* =========================================
   HEADER — DESKTOP (základ)
   ========================================= */
.otrock-header{
  position: fixed; top: 0; left: 0; width: 100%;
  z-index: 1000;
  background: transparent;                 /* průhledné nad hero */
  transition: background-color .2s ease, box-shadow .2s ease;
}

.otrock-header .otrock-badge {
	margin: 0;
}

.otrock-header a.otrock-badge {
	border-color:   #0744F8;
  font-size: 16px;

}
.otrock-header__menu-item{
   border-radius:32px;
}
 .otrock-header__menu-link{  display:inline-flex; align-items:center; justify-content:center;
  padding:12px 24px; 
   border-radius:32px;

  border:.5px solid transparent;
  width:max-content;
          font-style: normal;

 }
.otrock-header a.otrock-badge:hover, .otrock-header__menu-item:hover {
  background:   #0744F8;

  
}

.otrock-header__menu-link.aktiv {

 background: rgba(255, 255, 255, .05);
    border: .5px solid #0744F8;

  
}

/* Sticky: jednobarevné pozadí při scrollu */
.otrock-header.is-sticky{
  background:  var(--otrock-font-color-secondary);
  box-shadow: 0 1px 7px rgba(0,0,0,.25);
}

/* grid: LOGO | MENU (center) | BUTTONY/HAMBURGER vpravo */
.otrock-header__bar{
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 24px;
  min-height: 80px;
  padding: 16px 0;
}

.otrock-header__logo a{ display:inline-flex; align-items:center; text-decoration:none; }
.otrock-header__logo img{ height: 20px; width:auto; display:block; }

/* MENU (PC) – uprostřed a centrované */
.otrock-header__nav{ justify-self: center; }
.otrock-header__menu{ display:inline-flex; gap:8px; margin:0; padding:0; list-style:none; }
.otrock-header__menu-link{
  display:inline-flex; align-items:center;
  font: 500 18px/1 var(--otrock-font-base);
  color: var(--otrock-font-color-primary);
  text-decoration:none; 
}
.otrock-header__menu-link:hover{ opacity:1; }

/* Akční badge vpravo (navazuje na .otrock-badge) */
.otrock-header__actions{ display:inline-flex; gap:12px; }
.otrock-header__btn{ display:inline-flex; align-items:center; gap:10px; padding:12px 32px; height: 44px}
.otrock-header__btnicon{ width:25px; height:25px; display:inline-block; }
.otrock-header__btnlabel{ white-space:nowrap; }

/* Ikonové tlačítko (hamburger/křížek) – stejné rozměry i pozice */
.otrock-header__burger{
  display:none; width:50px; height:50px;


  cursor:pointer;
  justify-self: end;                        /* úplně vpravo */
   align-items:center; justify-content:center;
}
.otrock-header__burger-icon{
  width: 50px; height: 50px; display:block; object-fit: contain; background-color: rgba(0,0,0,0);
}

/* =========================================
   MOBILNÍ MENU (fullscreen overlay)
   ========================================= */
.otrock-mmenu{
  position: fixed; inset: 0;
  background:  var(--otrock-font-color-secondary);
  transform: translateY(-100%); transition: transform .25s ease;
  z-index: 999; overflow-y: auto; padding-top: 12px;
}
.otrock-mmenu.is-open{ transform: translateY(0); }
body.otrock-menu-open{ overflow: hidden; }

/* Top bar v overlayi — viz požadavek: identický layout jako lišta */
.otrock-mmenu__top{
  display:grid;
  grid-template-columns: auto 1fr auto;    /* logo | mezera | křížek */
  align-items:center; gap:28px;
  min-height: 80px;                         /* shodné s header lištou */
  padding: 10px 0;
}
.otrock-mmenu__logo img{ height:50px; width:auto; display:block; }
.otrock-mmenu__close{
  width:50px; height:50px; 

  display:flex; align-items:center; justify-content:center; cursor:pointer;
  justify-self: end;
}
.otrock-mmenu__close-icon{ width:25px; height:25px; object-fit: contain; display:block; }

/* seznam položek */
.otrock-mmenu__list{ list-style:none; margin:24px 0 32px; padding:0; display:flex; flex-direction:column; gap:12px; }
.otrock-mmenu__link{
  display:block; padding:12px 8px; border-radius:12px;
  color: var(--otrock-font-color-primary); text-decoration:none;
  transition: background .2s ease;
}
/* Hover gradient (z Figmy) – můžeš upravit odstíny podle potřeby */
.otrock-mmenu__link:hover{
  background: linear-gradient(90deg, #20256E 0%, #353EB7 100%);
}

.otrock-mmenu__link.aktiv{
  background: linear-gradient(90deg, #20256E 0%, #353EB7 100%);
}
/* spodní akce (badge) */
.otrock-mmenu__actions{ display:flex; flex-direction:column; gap:16px; margin:10px 0 0px; }

/* =========================================
   MOBIL (<=768px)
   ========================================= */
@media (max-width: 768px){
  .otrock-header__nav,
  .otrock-header__actions{ display:none !important; }
  .otrock-header__burger{ display:flex; }
}

/* =========================================
   TABLET ONLY (768–1024px) — poslední blok
   ========================================= */
@media (min-width: 768px) and (max-width: 1024px){
  .otrock-header__nav,
  .otrock-header__actions{ display:none !important; }
  .otrock-header__burger{ display:flex; }
}

/* === MOBILNÍ LIŠTA V HLAVIČCE (bar nad stránkou) — místo gridu použij flex === */
@media (max-width: 768px){
  .otrock-header__bar{
    display: flex;
    align-items: center;
    justify-content: space-between; /* logo vlevo, burger vpravo */
    gap: 0;
    min-height: 80px;
    padding: 24px 0;
  }



  /* jen jistota: menu + akce skryté, burger viditelný vpravo */
  .otrock-header__nav,
  .otrock-header__actions{ display: none !important; }
  .otrock-header__burger{ display: flex; margin-left: auto; } /* úplně vpravo */
}

@media (min-width: 768px) and (max-width: 1024px){
  .otrock-header__bar{
    display: flex;
    align-items: center;
    justify-content: space-between; /* logo vlevo, burger vpravo */
    gap: 0;
    min-height: 80px;
    padding: 24px 0;
  }



  /* jen jistota: menu + akce skryté, burger viditelný vpravo */
  .otrock-header__nav,
  .otrock-header__actions{ display: none !important; }
  .otrock-header__burger{ display: flex; margin-left: auto; } /* úplně vpravo */
}

/* === TOP BAR UVNITŘ FULLSCREEN MENU — přesně 2 položky v řádku === */
.otrock-mmenu__top{
  display: flex;                  /* flex místo gridu */
  align-items: center;
  justify-content: space-between; /* logo vlevo, kříž vpravo */
  gap: 0;
  min-height: 80px;
  padding: 12px 0;
}

/* velikosti zůstávají, jen pro jistotu ponecháme konzistentní „hit area“ */
.otrock-mmenu__logo img{ height: 33px; width: auto; display: block; }
.otrock-mmenu__close{
  width: 50px; height: 50px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
}
.otrock-mmenu__close-icon{ width: 25px; height: 25px; object-fit: contain; display: block; }

/* --- Burger & Close: skutečně průhledná tlačítka --- */
.otrock-header__burger,
.otrock-mmenu__close{
  background: transparent !important;  /* zruší white/buttonface pozadí */
  border: 0 !important;
  padding: 0;
  margin: 0;
  -webkit-appearance: none;            /* iOS Safari */
  appearance: none;
  box-shadow: none;
  line-height: 0;                      /* žádná „vnitřní“ výška */
}

/* zachovej rozměry a zarovnání z tvého CSS */
.otrock-header__burger{
  width: 50px; height: 50px;
  display: none;                       /* desktop skrytý, mobil zobrazíš v MQ */
  align-items: center; justify-content: center;
  justify-self: end;
}
.otrock-mmenu__close{
  width: 50px; height: 50px;
  display: flex; align-items: center; justify-content: center;
}

/* samotná ikonka je průhledná – jen pro jistotu bez pozadí */
.otrock-header__burger-icon,
.otrock-mmenu__close-icon{
  display: block;
  width: 50px; height: 50px;
  object-fit: contain;
  background: transparent !important;
}

/* Volitelné: fokus kroužek (a11y), bez vyplnění tlačítka */
.otrock-header__burger:focus-visible,
.otrock-mmenu__close:focus-visible{
  outline: 2px solid #0744F8;
  outline-offset: 2px;
}

/* Mobilní zobrazení burgeru */
@media (max-width: 768px){
	.otrock-mmenu__link {
		padding: 10px 20px;
		font-size: 24px;
		line-height: 32px;
		font-weight: 600;
		margin: 0px;
		border-radius: 24px;
	}
  .otrock-header__burger{ display: flex; }
  .otrock-header a.otrock-badge {margin-left: 20px}
}
@media (min-width: 768px) and (max-width: 1024px){
  .otrock-header__burger{ display: flex; }
}

.page-template-page-blog .otrock-head-section {
	padding-top: 96px;
	padding-bottom: 96px;
}

@media (max-width: 768px){
.page-template-page-blog .otrock-head-section {
	padding-top: 64px;
	padding-bottom: 64px;
}
}
@media (min-width: 768px) and (max-width: 1024px){
 .page-template-page-blog .otrock-head-section {
	padding-top: 64px;
	padding-bottom: 64px;
}
}

#otrock-homepage-about .otrock-two-col__right {
  justify-content: right;
}
.otrock-two-col__image {
  max-width: 70%;
}

@media (max-width: 768px){
  #otrock-homepage-about.otrock-two-col{
    padding-top: 64px;
    padding-bottom: 64px;
  }

  .otrock-two-col__grid{
    flex-direction: column;   /* řádky pod sebou */
    gap: 64px;                /* menší mezery na mobilu */
  }

  .otrock-two-col__image{
    max-width: 100%;
  }

  .otrock-two-col__list-item::before{
    top: 12px;
  }
}

/* =========================================
   TABLET ONLY (768–1024px) — stejné jako mobil
   ======================================= */
@media (min-width: 768px) and (max-width: 1024px){
  #otrock-homepage-about.otrock-two-col{
    padding-top: 64px;
    padding-bottom: 64px;
  }

  .otrock-two-col__grid{
    flex-direction: column;   /* řádky pod sebou */
    gap: 64px;                /* menší mezery na mobilu */
  }

  .otrock-two-col__image{
    max-width: 100%;
  }

  .otrock-two-col__list-item::before{
    top: 12px;
  }
}

@media (min-width: 1024px) and (max-width: 1280px){
.otrock-header__actions {
    display: inline-flex
;
    gap: 12px;
    flex-direction: column;
}

.otrock-header__menu-link {
    display: inline-flex
;
    align-items: center;
    font: 500 14px / 1 var(--otrock-font-base);
    color: var(--otrock-font-color-primary);
    text-decoration
}
.otrock-header a.otrock-badge {
    border-color: #0744F8;
    font-size: 14px;
}
}


@media (min-width: 1280px) and (max-width: 1360px){
.otrock-header__actions {

    flex-direction: row;
}
.otrock-header__menu-link {
    display: inline-flex
;
    align-items: center;
    font: 500 14px / 1 var(--otrock-font-base);
    color: var(--otrock-font-color-primary);
    text-decoration
}
.otrock-header a.otrock-badge {
    border-color: #0744F8;
    font-size: 14px;
}

}


footer .otrock-h6 {
  text-transform: uppercase;
}

.otrock-services-row__badge.otrock-badge {
  margin-bottom: 24px;
font-weight: 600;
  background: none;
}

.otrock-services-row__badge.otrock-badge:hover {

color: var(--Primary-background, #050C33);
  background: #FFF;
}

.otrock-protect__title2 {
  margin-bottom: 32px;
}

.page-template-page-proc-mitel .otrock-av-offer__grid {
      grid-template-columns: 0.3fr 0.7fr;
}

.page-template-page-proc-mitel .otrock-av-offer__title {
      margin-bottom: 32px;
}

.page-template-page-proc-mitel .otrock-av-offer__head {
  margin-bottom: 0;
}

.page-template-page-proc-mitel .otrock-h6 {
  font-size: 28px;
  font-weight: 700;
}

@media (max-width: 1024px) {
  .page-template-page-proc-mitel  .otrock-av-offer__grid {
        grid-template-columns: 1fr;
        gap: 48px;
    }

    .page-template-page-proc-mitel .otrock-h6 {
  font-size: 16px;
  font-weight: 700;
}

}

.page-id-49  .otrock-hero-split {
    background: var(--otrock-font-color-secondary);

    min-height:50dvh;
    padding-bottom: 0;
    padding-top: 125px;

}
.otrock-download-card .otrock-btn-kontakt-transparent {box-shadow: none;
  background: none;
  line-height: 1.5;
  height: auto;
}

.otrock-download-card .otrock-btn-kontakt-transparent:hover {box-shadow: none;
  background: #FFF;
}

.otrock-blog-archive__body a.otrock-h6 {
  font-size: 16px;
}

.otrock-porce-zabavy__content .otrock-h3 {
  font-size: 65px;
  line-height: 1.2;
  margin-top: 0;
}
.single-post .otrock-porce-zabavy__content .otrock-h6 {
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  color: #FFF;
}

.single-post .otrock-porce-zabavy__box {
  max-width: 100%;
}

.ctablog {      
  padding-top: 64px;
  padding-bottom: 64px;
}

.single-post .otrock-porce-zabavy__content .otrock-h3 {
  font-size: 38px;
  line-height: 1.2;
  margin-top: 0;
} 

@media (min-width: 1025px) {
  .single-post .otrock-porce-zabavy__grid {
    align-items: stretch;
  }

  .single-post .otrock-porce-zabavy__content {
    flex: 0 1 66%;
    max-width: 66%;
  }

  .single-post .otrock-porce-zabavy__media {
    flex: 0 1 34%;
    max-width: 34%;
  }
}
/* OTROCK – canvas jako pozadí přes celou plochu hero */
#homepageAnimation.otrock-hero-animation {
  position: absolute;
  inset: 0;                    /* top/right/bottom/left: 0 */
  width: 100%;
  height: 100%;
  display: block;
  z-index: 0;                  /* plátno je vzadu */
  pointer-events: none;        /* propouští kliky na CTA */
}

/* OTROCK – obsah hero musí být nad plátnem */
#otrock-homepage-hero .otrock-section-boxed-in-full-width {
  position: relative;
  z-index: 2;                  /* nad canvase */
}

/* Volitelně: respektuj redukci animací – vypni canvas */
@media (prefers-reduced-motion: reduce) {
  #homepageAnimation.otrock-hero-animation {
    display: none;
  }
}


.homehero .otrock-hero__subtitle {
}

.page-id-49 .otrock-hero-split__image {
  width: 60%;
}
@media (max-width: 1024px) {
.homehero .otrock-hero__subtitle {
  margin-top: 700px;}
  .page-id-49 .otrock-hero-split__image {
  width: 100%;

}

  .page-id-49 .otrock-hero-split{
  padding-top: 64px;

}
}

@media (max-width: 768px) {
.homehero .otrock-hero__subtitle {
  margin-top: 400px;}
  .page-id-49 .otrock-hero-split__image {
  width: 100%;

}

  .page-id-49 .otrock-hero-split{
  padding-top: 64px;

}
}
#otrock-homepage-hero.homehero.otrock-hero {
  display: block;
}
.homehero h6 {font-size: 14px}




/* =========================================
   DESKTOP (základ) – dropdown "Služby"
========================================= */
.otrock-header__menu { position: relative; }

.otrock-header__menu-item.otrock-has-dropdown {
  position: relative; /* ukotví dropdown pod položku */
}

/* Box dropdownu – glassmorphism z figmy */
/* Ukotvení položky, která má dropdown */
.otrock-header__menu-item.otrock-has-dropdown {
  position: relative;
}

/* Hover-bridge: neviditelná plocha mezi tlačítkem a dropdownem */
.otrock-header__menu-item.otrock-has-dropdown::before {
  content: "";
  position: absolute;
  left: 0;
  top: 100%;
  width: 100%;
  height: 12px;          /* přesně ta mezera */
  pointer-events: auto;  /* zachytí myš při přejezdu */
}

/* Box dropdownu – bez marginu, posuneme přes top */
.otrock-services-dropdown {
  position: absolute;
  left: 0;
  top: calc(100% + 12px); /* hned pod mostem */
  /* margin-top: 12px;  <- SMAZAT */
  min-width: 340px;
  padding: 10px;
  border-radius: 20px;
  border: 1px solid rgba(255, 255, 255, 0.21);
  background: rgba(22, 32, 63, 0.10);
  box-shadow: 0 0 20.9px 0 rgba(255, 255, 255, 0.10) inset;
  -webkit-backdrop-filter: blur(50px);
  backdrop-filter: blur(50px);
  opacity: 0;
  transform: translateY(8px);
  pointer-events: none;
  transition: opacity .18s ease, transform .18s ease;
  z-index: 50;
}

/* Zobrazení na hover/focus (zmizí při vyjetí) */
.otrock-header__menu-item.otrock-has-dropdown:hover .otrock-services-dropdown,
.otrock-header__menu-item.otrock-has-dropdown:focus-within .otrock-services-dropdown {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

/* Seznam uvnitř dropdownu */
.otrock-services-dropdown__list {
  list-style: none;
  margin: 0;
  padding: 6px 4px;
}

/* Položka + dělící linka s gradientem (75 % šířky, 0.5px) */
.otrock-services-dropdown__item {
  position: relative;
  padding: 0; /* padding řešíme na odkazu */
}
.otrock-services-dropdown__list {
  list-style: none;
  margin: 0;
  padding: 6px 4px;
}

.otrock-services-dropdown__item {
  position: relative;
  padding: 0; /* padding řeší odkaz */
}

/* Dělící linka na začátku každé položky kromě první */
.otrock-services-dropdown__item + .otrock-services-dropdown__item::before {
  content: "";
  position: absolute;
  left: 12.5%;
  right: 12.5%;
  top: 0;
  height: 1px; /* dříve 0.5px */
  background: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0.02) 0%,
    rgba(255, 255, 255, 0.12) 50%,
    rgba(255, 255, 255, 0.02) 100%
  );
  transform: scaleY(.5);        /* „optická“ půlka pixelu */
  transform-origin: top;
  will-change: transform;       /* stabilnější kompozice */
}

/* Odkaz */
.otrock-services-dropdown__link {
  display: block;
  padding: 10px 14px;
  border-radius: 12px;
  text-decoration: none;
  color: var(--otrock-color-white, #fff);
  line-height: 1.3;
  transition: background-color .15s ease, color .15s ease;
  margin-bottom: 3px;
  margin-top: 3px;
}

/* Hover + aktiv */
.otrock-services-dropdown__link:hover,
.otrock-services-dropdown__link.aktiv {
  background: rgba(255, 255, 255, 0.10);
  color: var(--otrock-color-white, #fff);
}

/* Zarovnání textu (kdybys chtěl ikony, vejde se vlevo) */
.otrock-services-dropdown__label {
  display: inline-block;
  font-family: var(--otrock-font-base);
  font-size: 14px;
  font-weight: 500;
}

/* Zabrání „lámání“ dropdownu přes okraj viewportu (volitelné) */
@media (min-width: 1200px){
  .otrock-header__menu-item.otrock-has-dropdown .otrock-services-dropdown {
    /* pokud je položka blízko pravému okraji a chceš dorovnat:
       right: 0; left: auto;  */
  }
}

/* =========================================
   MOBIL (<=768px) – dropdown pro desktop skrýt
========================================= */
@media (max-width: 768px){
  .otrock-services-dropdown { display: none; }
}

/* =========================================
   TABLET ONLY (768–1024px) — skrýt stejně jako mobil
========================================= */
@media (min-width: 768px) and (max-width: 1024px){
  .otrock-services-dropdown { display: none; }
}


/* MOBIL (<=768px) */
@media (max-width: 768px){
  .otrock-mmenu__submenu{
    overflow: hidden;
    height: 0; /* JS animuje výšku */
    transition: height .35s cubic-bezier(.22,.61,.36,1);
    will-change: height;
    margin-top: 0;
    margin-bottom: 0;
  }
  .otrock-mmenu__submenu-list{
    list-style: none;
    margin: 0;
    padding: 0;
  }
  .otrock-mmenu__submenu-item + .otrock-mmenu__submenu-item{ margin-top: 6px; }
  .otrock-mmenu__submenu-link{
    display:block; padding: 10px 20px;; border-radius:10px; text-decoration:none;
    color: var(--otrock-color-white, #fff); transition: background-color .15s ease;        border-radius: 24px;
  }
  .otrock-mmenu__submenu-link:hover,
  .otrock-mmenu__submenu-link.aktiv{     background: linear-gradient(90deg, #20256E 0%, #353EB7 100%);
} }
}

/* TABLET ONLY (768–1024px) — stejné */
@media (min-width:768px) and (max-width:1024px){
  .otrock-mmenu__submenu{
    overflow:hidden; height:0; transition: height .35s cubic-bezier(.22,.61,.36,1);
    will-change: height; margin-top:8px; margin-bottom:4px;
  }
  .otrock-mmenu__submenu-list{ list-style:none; margin:0; padding:0 0 6px 12px; }
  .otrock-mmenu__submenu-item + .otrock-mmenu__submenu-item{ margin-top:6px; }
  .otrock-mmenu__submenu-link{
    display:block; padding:8px 10px; border-radius:10px; text-decoration:none;
    color: var(--otrock-color-white, #fff); line-height:1.3; transition: background-color .15s ease;
  }
  .otrock-mmenu__submenu-link:hover,
  .otrock-mmenu__submenu-link.aktiv{ background: rgba(255,255,255,.12); }
}


/* === HERO CENTROVÁNÍ + 20% POSUN DOLŮ =============================== */
/* Bezpečné defaulty pro sekci */


/* Jemný mobilní tweak: menší posun (10 %) kvůli menším displejům */
@media (min-width: 1024px) {
.page-id-2 #otrock-homepage-hero {
  display: grid;                 /* Grid = snadné centrování na obě osy */
  place-items: center;           /* Horizontální i vertikální střed */
  min-height: 100svh;            /* Plná výška viewportu, svh = safe viewport na mobilech */
  position: relative;            /* Pro jistotu pro případ dalších prvků */
  overflow: hidden;              /* Ať nic nepřetéká */
}



/* Vnitřní wrapper s posunem 20% dolů od středu */
.page-id-2 #otrock-homepage-hero .otrock-section-boxed-in-full-width {
  height: 100vh;
display: flex;
flex-direction: column;
justify-content: center;
          /* Centrovat text (h6) */
  transform: translateY(20%);    /* Posun od geometrického středu směrem dolů */
  will-change: transform;        /* Hint pro plynulé vykreslení */
   
}
}



/* =========================================
   BLOG ARTICLE TEMPLATE — Single Post Layout
   ========================================= */

/* ============================
   HERO SECTION (Desktop)
   ============================ */
.otrock-article-hero {
  background: var(--otrock-font-color-secondary);
  padding-top: 192px; /* SPACING: Adjust top padding as needed */
  padding-bottom: 64px; /* SPACING: Adjust bottom padding as needed */
}

.otrock-article-hero__badge-wrap {
  text-align: center;
  margin-bottom: 20px; /* SPACING: Adjust gap below badge */
}

.otrock-article-hero__title {
  text-align: center;
  margin-bottom: 32px; /* SPACING: Adjust gap below title */
}

.otrock-article-hero__date {
  text-align: center;
  font-family: var(--otrock-font-base);
  color: var(--otrock-font-color-body);
  margin-bottom: 32px; /* SPACING: Adjust gap below date */
}

.otrock-article-hero__image {
  width: 100%;
  border-radius: 8px;
  overflow: hidden;
  position: relative;
}

.otrock-article-hero__image img {
  width: 100%;
  height: auto;
  aspect-ratio: 16/9;
  object-fit: cover;
  display: block;
  max-height: 600px; /* SPACING: Adjust max height of featured image */
}

/* ============================
   MAIN CONTENT SECTION (Desktop)
   ============================ */
.otrock-article-main {
  background: var(--otrock-font-color-secondary);
  padding-top: 64px; /* SPACING: Adjust top padding as needed */
  padding-bottom: 96px; /* SPACING: Adjust bottom padding as needed */
}

.otrock-article-grid {
  display: grid;
  grid-template-columns: 1fr 4fr; /* 20/80 split: sidebar LEFT, content RIGHT */
  gap: 64px; /* SPACING: Adjust gap between sidebar and content */
  align-items: start;
}

/* ============================
   SIDEBAR (Desktop)
   ============================ */
.otrock-article-sidebar {
  position: sticky;
  top: 128px; /* SPACING: Adjust sticky top offset as needed */
  align-self: flex-start;
}

/* ============================
   TABLE OF CONTENTS (TOC)
   ============================ */
.otrock-article-toc {
  margin-bottom: 40px; /* SPACING: Adjust gap between TOC and Share section */
}


.otrock-article-toc__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0; /* No gap - borders should connect */
}

.otrock-article-toc__item {
  position: relative;
  padding-left: 30px;
  padding-top: 4px; /* SPACING: Adjust vertical padding of TOC items */
  padding-bottom: 4px; /* SPACING: Adjust vertical padding of TOC items */
  transition: all 0.3s ease;
}

/* Vertical line on the left - thin by default (SVG) */
.otrock-article-toc__item::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 1px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1' height='100'%3E%3Cline x1='0.5' y1='0' x2='0.5' y2='100' stroke='%2316203F' stroke-width='1'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: 1px 100%;
  transition: all 0.3s ease;
}

/* Active item - thicker line, centered horizontally (SVG) */
.otrock-article-toc__item.is-active::before {
  width: 2px;
  left: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='2' height='100'%3E%3Cline x1='1' y1='0' x2='1' y2='100' stroke='%23FFF' stroke-width='2'/%3E%3C/svg%3E");
  background-size: 2px 100%;
}

.otrock-article-toc__link {
  color: #FFF;
  text-decoration: none;
  font-family: var(--otrock-font-base);
  font-size: 16px;
  line-height: 1.5;
  display: block;
  transition: color 0.3s ease;
}

.otrock-article-toc__link:hover {
  color: var(--otrock-font-color-primary);
}

.otrock-article-toc__item.is-active .otrock-article-toc__link {
  color: var(--otrock-font-color-primary);
  font-weight: 600;
  font-size: 20px;
}

/* ============================
   SHARE SECTION
   ============================ */
.otrock-article-share {
  margin-bottom: 40px; /* SPACING: Adjust gap between Share and Author section */
}

.otrock-article-share__title {
  margin-bottom: 20px; /* SPACING: Adjust gap below Share title */
}

.otrock-article-share__icons {
  display: flex;
  gap: 16px; /* SPACING: Adjust gap between icons */
}

.otrock-article-share__icon {
  display: block;
  transition: opacity 0.3s ease;
}

.otrock-article-share__icon:hover {
  opacity: 0.7;
}

.otrock-article-share__icon img {
  display: block;
  width: 40px;
  height: 40px;
}

/* ============================
   AUTHOR SECTION
   ============================ */
.otrock-article-author__title {
  margin-bottom: 20px; /* SPACING: Adjust gap below Author title */
}

.otrock-article-author__card {
  display: flex;
  align-items: center;
  gap: 12px; /* SPACING: Adjust gap between avatar and name */
  border-radius: 12px;
background:  #0744F8;
  padding: 12px; /* SPACING: Adjust internal padding of author card */
}

.otrock-article-author__avatar {
  flex-shrink: 0;
}

.otrock-article-author__avatar img {
  display: block;
  width: 30px;
  height: 30px;
  border-radius: 6px;
}

.otrock-article-author__name {
  margin: 0;
  font-size: 18px;
  font-weight: 500;
}

/* ============================
   CONTENT AREA
   ============================ */
.otrock-article-content {
  color: var(--otrock-font-color-body);
}

.otrock-article-content > *:first-child {
  margin-top: 0 !important; /* Remove top margin from first element */
}

.otrock-article-content h2,
.otrock-article-content h3 {
  color: var(--otrock-font-color-primary);
  margin-top: 0; /* SPACING: Adjust spacing above headings */
  margin-bottom: 20px; /* SPACING: Adjust spacing below headings */
}

.otrock-article-content p {
   margin-top: 0; 
  margin-bottom: 20px; /* SPACING: Adjust spacing between paragraphs */
}

.otrock-article-content ul,
.otrock-article-content ol {
   margin-top: 0; 
  margin-bottom: 20px; /* SPACING: Adjust spacing for lists */
}




/* ============================
   MOBILE META SECTION (Hidden on Desktop)
   ============================ */
.otrock-article-meta-mobile {
  display: none;
  background: var(--otrock-font-color-secondary);
}

.otrock-article-meta-mobile .otrock-article-share,
.otrock-article-meta-mobile .otrock-article-author {
  margin-bottom: 32px; /* SPACING: Adjust gap between sections on mobile */
}

.otrock-article-meta-mobile .otrock-article-author {
  margin-bottom: 0;
}

/* ============================
   MOBIL (<=768px)
   ============================ */
@media (max-width: 768px){
  .otrock-article-hero {
    padding-top: 64px; /* SPACING: Adjust top padding on mobile */
    padding-bottom: 0; /* SPACING: Adjust bottom padding on mobile */
  }

  .otrock-article-hero__image {
    width: 100vw;
    margin-left: calc(-1 * var(--otrock-site-gutter-mob));
    border-radius: 0;
  }

  .otrock-article-main {
    padding-top: 48px; /* SPACING: Adjust top padding on mobile */
    padding-bottom: 64px; /* SPACING: Adjust bottom padding on mobile */
  }

  .otrock-article-grid {
    grid-template-columns: 1fr; /* Single column on mobile */
    gap: 32px; /* SPACING: Adjust gap on mobile */
  }

  /* Hide sidebar on mobile */
  .otrock-article-sidebar {
    display: none;
  }

  /* Show mobile meta section */
  .otrock-article-meta-mobile {
    display: block;
  }

  .otrock-article-hero__date {
    margin-bottom: 24px; /* SPACING: Adjust on mobile */
  }
  .single-post .otrock-btn-kontakt {width: 100%;}

  .single-post .otrock-porce-zabavy__content {
    display: block;
    width: 100%;
  }
  .single-post .otrock-porce-zabavy__content .otrock-h3 {
    font-size: 28px;
    line-height: 1.2;
    margin-top: 0;
}
.single-post .otrock-porce-zabavy__content .otrock-h6{
    margin-bottom: 0;
  }
}

/* ============================
   TABLET ONLY (768–1024px) — Same as mobile
   ============================ */
@media (min-width: 768px) and (max-width: 1024px){
  .otrock-article-hero {
    padding-top: 64px; /* SPACING: Adjust top padding on tablet */
    padding-bottom: 48px; /* SPACING: Adjust bottom padding on tablet */
  }



  .otrock-article-hero__image {
    width: 100vw;
    margin-left: calc(-1 * var(--otrock-site-gutter-mob));
    border-radius: 0;
  }

  .otrock-article-main {
    padding-top: 48px; /* SPACING: Adjust top padding on tablet */
    padding-bottom: 64px; /* SPACING: Adjust bottom padding on tablet */
  }

  .otrock-article-grid {
    grid-template-columns: 1fr; /* Single column on tablet */
    gap: 32px; /* SPACING: Adjust gap on tablet */
  }

  /* Hide sidebar on tablet */
  .otrock-article-sidebar {
    display: none;
  }

  /* Show mobile meta section */
  .otrock-article-meta-mobile {
    display: block;
  }

  .otrock-article-hero__date {
    margin-bottom: 24px; /* SPACING: Adjust on tablet */
  }
    .single-post .otrock-btn-kontakt {width: 100%;}

  .single-post .otrock-porce-zabavy__content {
    display: block;
    width: 100%;
  }
  .single-post .otrock-porce-zabavy__content .otrock-h3 {
    font-size: 28px;
    line-height: 1.2;
    margin-top: 0;
}
.single-post .otrock-porce-zabavy__content .otrock-h6{
    margin-bottom: 0;
  }

 .single-post  .otrock-porce-zabavy__cta {
  max-width: 100%;
 }
}

/* ============================
   ENERGETIKA V2 – KEY SOLUTION SECTION
   ============================ */

/* Hlavní sekce - full width pozadí */
.otrock-key-solution {
  position: relative;
  padding-top: 120px;
  padding-bottom: 120px;
}

/* Pozadí s obrázkem + gradient overlay v jednom */
.otrock-key-solution__bg {
  position: absolute;
  inset: 0;
  /* Gradient je první (navrchu), obrázek druhý (pod ním) */
  /* Obrázek se nastaví inline v HTML */
  background-size: 80% auto;
  background-position: center top;
  background-repeat: no-repeat;
  z-index: 0;
}


/* Wrapper pro obsah */
.otrock-key-solution__wrapper {
  position: relative;
  z-index: 2;
  max-width: var(--otrock-site-max);
  margin: 0 auto;
}

/* Content wrapper */
.otrock-key-solution__content {
  position: relative;
}

/* Head: Badge + Title + Intro */
.otrock-key-solution__head {
  text-align: center;
  margin: 0 auto 72px;
}

.otrock-key-solution__head .otrock-badge {
  margin-bottom: 40px;
}

/* Gradient text pro title */
.otrock-key-solution__title {
  background: linear-gradient(180deg, #56C5ED 0%, #FFF 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  margin-bottom: 40px;
}

.otrock-key-solution__intro {
  max-width: 500px;
  margin: 0 auto;
  text-align: center;
}

/* Grid pro desktop - 4 karty */
.otrock-key-solution__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}

/* Slider skrytý na desktopu */
.otrock-key-solution__slider-wrapper {
  display: none;
}

/* Jednotlivá karta */
.otrock-key-solution-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 22px;
  padding: 40px;
  text-align: center;

  /* Glass efekt */
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(19, 72, 239, 0.5);
  border-radius: 24px;
  backdrop-filter: blur(50px);
  -webkit-backdrop-filter: blur(50px);
  box-shadow: inset 0 0 20px rgba(255, 255, 255, 0.1);
  transition: border-color 0.3s ease, box-shadow 0.3s ease;
}



/* Ikona karty */
.otrock-key-solution-card__icon {
  width: 60px;
  height: 60px;
  background: #fff;
  border-radius: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
}

.otrock-key-solution-card__icon img {
  width: 35px;
  height: 35px;
  display: block;
}

/* Title a text karty */
.otrock-key-solution-card__title {
  margin-bottom: 0;
}

.otrock-key-solution-card__text {
  margin-bottom: 0;
  color: #FFF;
}

/* Mobilní slider wrapper - skrytý na desktopu */
.otrock-key-solution__slider-wrapper {
  display: none;
}

/* Arrows - defaultně skryté */
.otrock-key-solution__arrows {
  display: none;
}

/* Glide slider baseline */
#otrock-key-solution-slider .glide__track {
  overflow: hidden;
}

#otrock-key-solution-slider .glide__slides {
  display: flex;
  list-style: none;
  margin: 0;
  padding: 0;
}

#otrock-key-solution-slider .glide__slide {
  flex-shrink: 0;
}

#otrock-key-solution-slider .otrock-key-solution-card {
  min-height: 350px;
}

/* ============================
   ARCHITECTURE SOLUTION BANNER
   ============================ */
.otrock-architecture-solution {
  position: relative;
  border-radius: 48px;
  overflow: hidden;
  margin-top: 64px;
  max-width: var(--otrock-site-max);
  margin-left: auto;
  margin-right: auto;
}

.otrock-architecture-solution__bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  z-index: 0;
}

.otrock-architecture-solution__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom right, #050C33 0%, rgba(5, 12, 51, 0.00) 85%) bottom right / 50% 50% no-repeat,   linear-gradient(to bottom left,  #050C33 0%, rgba(5, 12, 51, 0.00) 85%) bottom left  / 50% 50% no-repeat,   linear-gradient(to top left,     #050C33 0%, rgba(5, 12, 51, 0)    82%) top left     / 50% 50% no-repeat,   linear-gradient(to top right,    #050C33 0%, rgba(5, 12, 51, 0.00) 85%) top right    / 50% 50% no-repeat;
  z-index: 1;
}

.otrock-architecture-solution__content {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding:182px 40px;
}

/* Badge row s ikonkami */
.otrock-architecture-solution__badge-row {
  display: flex;
  align-items: center;
  gap: 24px;
  margin-bottom: 32px;
}

.otrock-architecture-solution__divider {
  width: 80px;
  height: 2px;
  display: inline-block;
}

.otrock-architecture-solution__divider--left {
  background: linear-gradient(90deg, #050C33 0%, #AEB4FF 100%);
}

.otrock-architecture-solution__divider--right {
  background: linear-gradient(90deg, #AEB4FF 0%, #050C33 100%);
}

.otrock-architecture-solution__badge-text {
  font-family: var(--otrock-font-base);
  font-weight: 600;
  font-size: 18px;
  line-height: 1;
  color: #AEB4FF;
  white-space: nowrap;
}

.otrock-architecture-solution__title {
  margin-bottom: 32px;
}

.otrock-architecture-solution__text {
  max-width: 500px;
  margin: 0 auto;
  color: #FFF;
}

/* ============================
   RESPONSIVE: TABLET (768-1024px)
   ============================ */
@media (min-width: 768px) and (max-width: 1024px) {
  .otrock-key-solution {
    padding-top: 80px;
    padding-bottom: 80px;
  }

  .otrock-key-solution__grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .otrock-key-solution-card {
    padding: 32px;
  }

  .otrock-architecture-solution {
    border-radius: 32px;
    margin-top: 48px;
  }

  .otrock-architecture-solution__content {
    padding: 80px 30px;
    min-height: 450px;
  }
}

/* ============================
   RESPONSIVE: MOBIL (<=768px)
   ============================ */
@media (max-width: 768px) {
  .otrock-key-solution {
    padding-top: 48px;
    padding-bottom: 48px;
    padding-left: 0;
    padding-right: 0;
    overflow: hidden;
  }

  .otrock-key-solution__wrapper {
    padding: 0 var(--otrock-site-gutter-mob);
  }

  .otrock-key-solution__head {
    margin-bottom: 40px;
  }

  .otrock-key-solution__title {
    font-size: 32px;
    line-height: 48px;
  }

  .otrock-key-solution__title br {
    display: none;
  }

  .otrock-key-solution__intro {
    max-width: 100%;
  }

  /* Na mobilu skrýt grid a ukázat slider */
  .otrock-key-solution__grid {
    display: none;
  }

  .otrock-key-solution__slider-wrapper {
    display: block;
    /* Rozšíříme wrapper doprava přes padding rodiče */
    margin-right: calc(-1 * var(--otrock-site-gutter-mob));
  }

  /* Slider - track může přetékat doprava */
  #otrock-key-solution-slider {
    overflow: visible;
  }

  #otrock-key-solution-slider .glide__track {
    overflow: visible;
  }

  #otrock-key-solution-slider .glide__slides {
    overflow: visible;
  }

  /* Šipky pod sliderem, zarovnané doprava */
  .otrock-key-solution__arrows {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    margin-top: 32px;
    padding-right: var(--otrock-site-gutter-mob);
  }

  /* Styl šipek - identický jako .otrock-blog__arrow */
  .otrock-key-solution__arrow {
    all: unset;
    width: 68px;
    height: 32px;
    display: inline-block;
    background-image: var(--btn-base);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
  }

  .otrock-key-solution__arrow:hover,
  .otrock-key-solution__arrow:focus-visible {
    background-image: var(--btn-hover);
  }

  /* Prev: default bez transformace, hover otočí */
  .otrock-key-solution__arrow--prev:hover,
  .otrock-key-solution__arrow--prev:focus-visible {
    transform: scaleX(-1);
  }

  /* Next: default otočená, hover bez transformace */
  .otrock-key-solution__arrow--next {
    transform: scaleX(-1);
  }

  .otrock-key-solution__arrow--next:hover,
  .otrock-key-solution__arrow--next:focus-visible {
    transform: none;
  }

  .otrock-key-solution-card {
    min-height: 320px;
    padding: 32px 24px;
  }

  .otrock-key-solution-card__icon {
    width: 64px;
    height: 64px;
    padding: 12px;
  }

  .otrock-key-solution-card__icon img {
    width: 40px;
    height: 40px;
  }

  /* Architecture banner - full width na mobilu */
  .otrock-architecture-solution {
    border-radius: 0;
    margin-top: 48px;
    margin-left: 0;
    margin-right: 0;
    width: 100%;
  }

  .otrock-architecture-solution__content {
    padding: 64px var(--otrock-site-gutter-mob);
    min-height: 400px;
  }

  .otrock-architecture-solution__badge-row {
    gap: 12px;
  }

  .otrock-architecture-solution__divider {
    width: 40px;
  }

  .otrock-architecture-solution__badge-text {
    font-size: 12px;
  }

  .otrock-architecture-solution__title {
    font-size: 28px;
    line-height: 40px;
  }
}

/* ============================
   TARGET SEGMENTS SECTION
   ============================ */
.otrock-target-segments {
  padding-top: 120px;
  padding-bottom: 120px;
  background: var(--otrock-bg);
}

.otrock-target-segments__head {
  text-align: center;
  margin: 0 auto 72px;
}

.otrock-target-segments__head .otrock-badge {
  margin-bottom: 40px;
}

.otrock-target-segments__title {
  margin-bottom: 40px;
}

.otrock-target-segments__intro {
  max-width: 650px;
  margin: 0 auto;
  text-align: center;
  color: #FFF
}

/* Grid pro desktop - 4 karty */
.otrock-target-segments__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}

/* Technologické pilíře - desktop: 3 v 1. řádku, 2 v 2. řádku (50/50) */
@media (min-width: 1025px) {
  .otrock-tech-pillars .otrock-target-segments__grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }

  .otrock-tech-pillars .otrock-target-segments__grid .otrock-segment-card {
    grid-column: span 2;
  }

  .otrock-tech-pillars .otrock-target-segments__grid .otrock-segment-card:nth-child(n+4) {
    grid-column: span 3;
  }
}

@media (max-width: 1024px) {
  .otrock-tech-pillars .otrock-target-segments__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .otrock-tech-pillars .otrock-target-segments__grid .otrock-segment-card,
  .otrock-tech-pillars .otrock-target-segments__grid .otrock-segment-card:nth-child(n+4) {
    grid-column: auto;
  }
}

/* Slider skrytý na desktopu */
.otrock-target-segments__slider-wrapper {
  display: none;
}

/* Jednotlivá karta - základní styly */
.otrock-segment-card {
  position: relative;
  width: 100%;
  height:500px;
}

/* Content box - glass efekt */
.otrock-segment-card__content {
  position: absolute;
  left: 0;
  width: 100%;
  height: 350px;
  padding: 40px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  z-index: 2;
  justify-content: space-between;

  /* Glass efekt */
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(19, 72, 239, 0.5);
  border-radius: 24px;
  backdrop-filter: blur(50px);
  -webkit-backdrop-filter: blur(50px);
  box-shadow: inset 0 0 20px rgba(255, 255, 255, 0.1);
}

/* Image container */
.otrock-segment-card__image {
  position: absolute;
  left: 0;
  width: 100%;
  height: 170px;
  z-index: 1;
  overflow: hidden;
}

.otrock-segment-card__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Varianta 1: Text nahoře, obrázek dole */
.otrock-segment-card--text-top .otrock-segment-card__content {
  top: 0;
}

.otrock-segment-card--text-top .otrock-segment-card__image {
  bottom: 0;
  top: auto;
  border-radius: 0 0 24px 24px;
}

.otrock-segment-card--text-top .otrock-segment-card__image img {
  border-radius: 0 0 24px 24px;
}

/* Varianta 2: Obrázek nahoře, text dole */
.otrock-segment-card--image-top .otrock-segment-card__content {
  bottom: 0;
  top: auto;
}

.otrock-segment-card--image-top .otrock-segment-card__image {
  top: 0;
  border-radius: 24px 24px 0 0;
}

.otrock-segment-card--image-top .otrock-segment-card__image img {
  border-radius: 24px 24px 0 0;
}

/* Title a text karty */
.otrock-segment-card__title {
  font-family: var(--otrock-font-base);
  font-weight: 700;
  font-size: 30px;
  line-height: 1.5;
  color: #fff;
  margin: 0;
}

#otrock-energy-tech-pillars .otrock-segment-card__title {

  font-size: 39px;

}

.otrock-segment-card__text {
  font-family: var(--otrock-font-base);
  font-weight: 400;
  font-size: 16px;
  line-height: 32px;
  color: #fff;
  margin: 0;
}

/* Arrows - defaultně skryté */
.otrock-target-segments__arrows {
  display: none;
}

/* ============================
   ENERGETIKA v2 - sjednocení mezer badge / nadpis / text
   ============================ */
#primary.otrock-energy-page {
  --otrock-badge-gap: 32px;
  --otrock-title-gap: 32px;
  --otrock-text-gap: 64px;
}

#primary.otrock-energy-page .otrock-key-solution__head .otrock-badge,
#primary.otrock-energy-page .otrock-target-segments__head .otrock-badge,
#primary.otrock-energy-page .otrock-key-tech__head .otrock-badge,
#primary.otrock-energy-page .otrock-ems__content .otrock-badge,
#primary.otrock-energy-page .otrock-partners__head .otrock-badge,
#primary.otrock-energy-page .otrock-values__head .otrock-badge,
#primary.otrock-energy-page .otrock-architecture-solution__badge-row,
#primary.otrock-energy-page .otrock-sol-design__head .otrock-architecture-solution__badge-row {
  margin: 0 0 var(--otrock-badge-gap);
}

#primary.otrock-energy-page .otrock-key-solution__title,
#primary.otrock-energy-page .otrock-target-segments__title,
#primary.otrock-energy-page .otrock-key-tech__title,
#primary.otrock-energy-page .otrock-ems__title,
#primary.otrock-energy-page .otrock-partners__head .otrock-h3,
#primary.otrock-energy-page .otrock-values__title,
#primary.otrock-energy-page .otrock-architecture-solution__title,
#primary.otrock-energy-page .otrock-sol-design__title {
  margin-top: 0;
  margin-bottom: var(--otrock-title-gap);
}

#primary.otrock-energy-page .otrock-key-solution__intro,
#primary.otrock-energy-page .otrock-target-segments__intro,
#primary.otrock-energy-page .otrock-key-tech__intro,
#primary.otrock-energy-page .otrock-ems__text,
#primary.otrock-energy-page .otrock-partners__head .otrock-paragraph-body,
#primary.otrock-energy-page .otrock-values__text,
#primary.otrock-energy-page .otrock-architecture-solution__text,
#primary.otrock-energy-page .otrock-sol-design__text {
  margin-top: 0;
  margin-bottom: var(--otrock-text-gap);
}

@media (max-width: 768px) {
  #primary.otrock-energy-page {
    --otrock-badge-gap: 20px;
    --otrock-title-gap: 20px;
    --otrock-text-gap: 40px;
  }
}

/* Glide slider baseline */
#otrock-target-segments-slider .glide__track {
  overflow: hidden;
}

#otrock-target-segments-slider .glide__slides {
  display: flex;
  list-style: none;
  margin: 0;
  padding: 0;
}

#otrock-target-segments-slider .glide__slide {
  flex-shrink: 0;
}

/* ============================
   TARGET SEGMENTS - TABLET
   ============================ */
@media (min-width: 768px) and (max-width: 1024px) {
  .otrock-target-segments {
    padding-top: 80px;
    padding-bottom: 80px;
  }

  .otrock-target-segments__grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .otrock-segment-card {
    height: 450px;
  }

  .otrock-segment-card__content {
    height: 290px;
    padding: 32px;
  }

  .otrock-segment-card__image {
    height: 190px;
  }

  .otrock-segment-card__title {
    font-size: 28px;
    line-height: 40px;
  }

  .otrock-segment-card__text {
    font-size: 14px;
    line-height: 24px;
  }
}

/* ============================
   TARGET SEGMENTS - MOBIL
   ============================ */
@media (max-width: 768px) {
  .otrock-target-segments {
    padding-top: 48px;
    padding-bottom: 48px;
    padding-left: 0;
    padding-right: 0;
    overflow: hidden;
  }

  .otrock-target-segments__head {
    margin-bottom: 40px;
    padding: 0 var(--otrock-site-gutter-mob);
  }

  .otrock-target-segments__title {
    font-size: 32px;
    line-height: 48px;
  }

  .otrock-target-segments__intro {
    max-width: 100%;
  }

  /* Na mobilu skrýt grid a ukázat slider */
  .otrock-target-segments__grid {
    display: none;
  }

  .otrock-target-segments__slider-wrapper {
    display: block;
    margin-right: calc(-1 * var(--otrock-site-gutter-mob));
    padding-left: var(--otrock-site-gutter-mob);
  }

  /* Slider - track může přetékat doprava */
  #otrock-target-segments-slider {
    overflow: visible;
  }

  #otrock-target-segments-slider .glide__track {
    overflow: visible;
  }

  #otrock-target-segments-slider .glide__slides {
    overflow: visible;
  }

  /* Šipky pod sliderem, zarovnané doprava */
  .otrock-target-segments__arrows {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    margin-top: 32px;
    padding-right: 64px;
  }

  /* Styl šipek - identický jako key-solution */
  .otrock-target-segments__arrow {
    all: unset;
    width: 68px;
    height: 32px;
    display: inline-block;
    background-image: var(--btn-base);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
  }

  .otrock-target-segments__arrow:hover,
  .otrock-target-segments__arrow:focus-visible {
    background-image: var(--btn-hover);
  }

  .otrock-target-segments__arrow--prev:hover,
  .otrock-target-segments__arrow--prev:focus-visible {
    transform: scaleX(-1);
  }

  .otrock-target-segments__arrow--next {
    transform: scaleX(-1);
  }

  .otrock-target-segments__arrow--next:hover,
  .otrock-target-segments__arrow--next:focus-visible {
    transform: none;
  }

  /* Mobilní karty - menší rozměry */
  .otrock-segment-card {
    height: 400px;
  }

  .otrock-segment-card__content {
    height: 280px;
    padding: 24px;
    gap: 16px;
    /* Solid pozadí zakryje obrázek */
    background: #050C33;
    border: 1px solid rgba(19, 72, 239, 0.5);
    border-radius: 24px;
  }
.otrock-target-segments__title {
  margin-bottom: 20px;
}
  /* Glass efekt vrstva navrchu pomocí ::after */
  .otrock-segment-card__content::after {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.05);
    border-radius: 24px;
    box-shadow: inset 0 0 20px rgba(255, 255, 255, 0.1);
    pointer-events: none;
  }

  .otrock-segment-card__image {
    height: 160px;
  }

  /* Gradient overlay na obrázku - fade out směrem ke content boxu */
  .otrock-segment-card__image::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    height: 60px;
    pointer-events: none;
    z-index: 2;
  }

  /* Text-top: obrázek dole -> gradient fade nahoře obrázku */
  .otrock-segment-card--text-top .otrock-segment-card__image::after {
    top: 0;
    background: linear-gradient(to bottom, rgba(5, 12, 51, 1) 0%, transparent 100%);
  }

  /* Image-top: obrázek nahoře -> gradient fade dole obrázku */
  .otrock-segment-card--image-top .otrock-segment-card__image::after {
    bottom: 0;
    top: auto;
    background: linear-gradient(to top, rgba(5, 12, 51, 1) 0%, transparent 100%);
  }

  .otrock-segment-card__title {
    font-size: 24px;
    line-height: 34px;
  }

  .otrock-segment-card__text {
    font-size: 14px;
    line-height: 24px;
  }
}

/* ============================
   KEY TECHNOLOGY (BESS) SECTION
   ============================ */
.otrock-key-tech {
  padding-top: 120px;
  padding-bottom: 120px;
  background: var(--otrock-font-color-secondary);
}

/* Head: Badge + Title + Intro — zarovnáno doleva */
.otrock-key-tech__head {
  text-align: left;
  margin-bottom: 72px;
  max-width: 876px;
}

.otrock-key-tech__head .otrock-badge {
  margin-bottom: 24px;
}

.otrock-key-tech__title {
  margin-bottom: 32px;
}

.otrock-key-tech__intro {
  max-width: 668px;
  color: #FFF;
}

/* Sub-headings */
.otrock-key-tech__subtitle {
  font-family: var(--otrock-font-base);
  font-weight: 700;
  font-size: 28px;
  line-height: 48px;
  color: #FFF;
  margin: 0 0 32px;
}

.otrock-key-tech__subtitle--products {
  margin-top: 120px;
}

/* ---- Feature cards grid (4 karty) ---- */
.otrock-key-tech__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 24px;
}

/* Slider skrytý na desktopu */
.otrock-key-tech__slider-wrapper {
  display: none;
}

/* Feature karta */
.otrock-key-tech-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 40px;
  padding: 40px;
  min-height: 441px;
  min-width: 0;

  /* Deep card bg s gradientem */
  background: linear-gradient(137.27deg, #060E37 42.16%, #1348EF 123.6%);
  border: 1px solid rgba(19, 72, 239, 0.5);
  border-radius: 24px;
  backdrop-filter: blur(50px);
  -webkit-backdrop-filter: blur(50px);
  box-shadow: inset 0 0 20px rgba(255, 255, 255, 0.1);
}

/* Icon area - pevná výška, ikony vždy na stejné pozici */
.otrock-key-tech-card__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 106px;
  flex-shrink: 0;
}

.otrock-key-tech-card__icon img {
  max-width: 200px;
  max-height: 106px;
  width: auto;
  height: auto;
  display: block;
}

/* Text body - zabere zbytek, obsah zarovnaný nahoru */
.otrock-key-tech-card__body {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.otrock-key-tech-card__title {
  font-family: var(--otrock-font-base);
  font-weight: 700;
  font-size: 28px;
  line-height: 48px;
  color: #FFF;
  margin: 0;
}

.otrock-key-tech-card__text {
  font-family: var(--otrock-font-base);
  font-weight: 400;
  font-size: 16px;
  line-height: 32px;
  color: #FFF;
  margin: 0;
}

/* Arrows - defaultně skryté */
.otrock-key-tech__arrows {
  display: none;
}

/* Glide slider baseline */
#otrock-key-tech-slider .glide__track {
  overflow: hidden;
}

#otrock-key-tech-slider .glide__slides {
  display: flex;
  list-style: none;
  margin: 0;
  padding: 0;
}

#otrock-key-tech-slider .glide__slide {
  flex-shrink: 0;
}

/* ---- Produktové karty (2 karty) ---- */
.otrock-key-tech__products {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}

/* Jednotlivá produktová karta */
.otrock-key-tech-product {
  position: relative;
  min-height: 451px;
  border-radius: 24px;
  overflow: hidden;
  border: 1px solid rgba(19, 72, 239, 0.5);
  min-width: 0;
}

/* Glass efekt overlay - nad všemi vrstvami */
.otrock-key-tech-product::after {
  content: '';
  position: absolute;
  inset: -0.5px;
  border-radius: inherit;
  box-shadow: inset 0 0 20px rgba(255, 255, 255, 0.1);
  pointer-events: none;
  z-index: 3;
}

/* Background: gradient + semi-transparent image */
.otrock-key-tech-product__bg {
  position: absolute;
  inset: 0;
  border-radius: 24px;
  overflow: hidden;
}

.otrock-key-tech-product__bg::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(137.27deg, #060E37 35.83%, #1348EF 114.94%);
  z-index: 0;
}

.otrock-key-tech-product__bg img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.3;
  z-index: 1;
}

/* Title: product name + capacity */
.otrock-key-tech-product__title {
  position: absolute;
  top: 50px;
  left: 40px;
  z-index: 2;
  display: flex;
  flex-direction: column;
  max-width: 425px;
}

.otrock-key-tech-product__name,
.otrock-key-tech-product__capacity {
  font-family: var(--otrock-font-base);
  font-weight: 700;
  font-size: 38px;
  line-height: 54px;
  color: #FFF;
}

/* Bottom area: label nahoře, pak sloupce (bullets + desc) */
.otrock-key-tech-product__bottom {
  position: absolute;
  bottom: 40px;
  left: 40px;
  right: 40px;
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

/* Dva sloupce pod labelem - zarovnané na top */
.otrock-key-tech-product__bottom-cols {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 24px;
}

/* Benefits (Oceňujete:) */
.otrock-key-tech-product__benefits {
  max-width: 305px;
}

.otrock-key-tech-product__benefits-label {
  font-family: var(--otrock-font-base);
  font-weight: 700;
  font-size: 28px;
  line-height: 48px;
  color: #FFF;
}

.otrock-key-tech-product__benefits-list {
  list-style: disc;
  margin: 0;
  padding: 0 0 0 16px;
  color: #FFF;
}

.otrock-key-tech-product__benefits-list li {
  font-family: var(--otrock-font-base);
  font-weight: 400;
  font-size: 16px;
  line-height: 32px;
  color: #FFF;
}

/* Description */
.otrock-key-tech-product__desc {
  font-family: var(--otrock-font-base);
  font-weight: 400;
  font-size: 16px;
  line-height: 32px;
  color: #FFF;
  max-width: 305px;
  margin: 0;
}

/* ============================
   KEY TECHNOLOGY - TABLET
   ============================ */
@media (min-width: 768px) and (max-width: 1024px) {
  .otrock-key-tech {
    padding-top: 80px;
    padding-bottom: 80px;
  }

  .otrock-key-tech__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .otrock-key-tech-card {
    min-height: 380px;
    padding: 32px;
  }

  .otrock-key-tech-card__title {
    font-size: 24px;
    line-height: 36px;
  }

  .otrock-key-tech__products {
    grid-template-columns: minmax(0, 1fr);
  }

  .otrock-key-tech-product {
    min-height: 400px;
  }

  .otrock-key-tech-product__name,
  .otrock-key-tech-product__capacity {
    font-size: 30px;
    line-height: 44px;
  }

  .otrock-key-tech__subtitle--products {
    margin-top: 80px;
  }
}

/* ============================
   KEY TECHNOLOGY - MOBIL
   ============================ */
@media (max-width: 768px) {
  .otrock-key-tech {
    padding-top: 48px;
    padding-bottom: 96px;
    padding-left: 0;
    padding-right: 0;
    overflow: hidden;
  }

  .otrock-key-tech__head {
    margin-bottom: 40px;
    padding: 0 var(--otrock-site-gutter-mob);
    text-align: center;
  }

  .otrock-key-tech__title {
    font-size: 32px;
    line-height: 48px;
  }

  .otrock-key-tech__intro {
    max-width: 100%;
    margin: 0 auto;
  }

  .otrock-key-tech__subtitle {
    font-size: 22px;
    line-height: 34px;
    padding: 0 var(--otrock-site-gutter-mob);
    text-align: center;
  }

  .otrock-key-tech__subtitle--products {
    margin-top: 64px;
  }

  /* Grid skrýt, slider ukázat */
  .otrock-key-tech__grid {
    display: none;
  }

  .otrock-key-tech__slider-wrapper {
    display: block;
    margin-right: calc(-1 * var(--otrock-site-gutter-mob));
    padding-left: var(--otrock-site-gutter-mob);
  }

  #otrock-key-tech-slider {
    overflow: visible;
  }

  #otrock-key-tech-slider .glide__track {
    overflow: visible;
  }

  #otrock-key-tech-slider .glide__slides {
    overflow: visible;
    align-items: stretch;
  }

  #otrock-key-tech-slider .glide__slide {
    height: auto;
  }

  #otrock-key-tech-slider .otrock-key-tech-card {
    height: 100%;
  }

  .otrock-key-tech__arrows {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    margin-top: 32px;
    padding-right: 64px;
  }

  .otrock-key-tech__arrow {
    all: unset;
    width: 68px;
    height: 32px;
    display: inline-block;
    background-image: var(--btn-base);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
  }

  .otrock-key-tech__arrow:hover,
  .otrock-key-tech__arrow:focus-visible {
    background-image: var(--btn-hover);
  }

  .otrock-key-tech__arrow--prev:hover,
  .otrock-key-tech__arrow--prev:focus-visible {
    transform: scaleX(-1);
  }

  .otrock-key-tech__arrow--next {
    transform: scaleX(-1);
  }

  .otrock-key-tech__arrow--next:hover,
  .otrock-key-tech__arrow--next:focus-visible {
    transform: none;
  }

  .otrock-key-tech-card {
    min-height: 350px;
    padding: 32px 24px;
  }

  .otrock-key-tech-card__title {
    font-size: 22px;
    line-height: 34px;
  }

  .otrock-key-tech-card__text {
    font-size: 14px;
    line-height: 24px;
  }

  /* Produktové karty - pod sebou, full width bez okrajů */
  .otrock-key-tech__products {
    grid-template-columns: 1fr;
    padding: 0;
  }

  .otrock-key-tech-product {
    min-height: 380px;
  }

  .otrock-key-tech-product__title {
    top: 32px;
    left: 24px;
  }

  .otrock-key-tech-product__name,
  .otrock-key-tech-product__capacity {
    font-size: 26px;
    line-height: 38px;
  }

  .otrock-key-tech-product__bottom {
    left: 24px;
    right: 24px;
    bottom: 24px;
    gap: 16px;
  }

  .otrock-key-tech-product__bottom-cols {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }

  .otrock-key-tech-product__benefits-label {
    font-size: 20px;
    line-height: 32px;
  }

  .otrock-key-tech-product__benefits-list li {
    font-size: 14px;
    line-height: 24px;
  }

  .otrock-key-tech-product__desc {
    font-size: 14px;
    line-height: 24px;
    max-width: 100%;
  }
}

/* ============================
   ŘÍZENÍ ENERGIE (EMS) SECTION
   ============================ */
.otrock-ems {
  padding-top: 120px;
  padding-bottom: 120px;
  background: var(--otrock-font-color-secondary);
}

/* Boxed kontejner s border-radius */
.otrock-ems__box {
  position: relative;
  border-radius: 48px;
  overflow: hidden;
  min-height: 803px;
  background: #050C33;
}

/* Background image - pravá strana */
.otrock-ems__bg {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 60%;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 0 48px 48px 0;
  z-index: 0;
}

/* Gradient overlay zleva doprava */
.otrock-ems__overlay {
  position: absolute;
  inset: 0;
  border-radius: 48px;
  background: linear-gradient(270deg, rgba(5, 12, 51, 0.00) 37.19%, #050C33 58.55%);
  z-index: 1;
}

/* Content - zarovnaný doleva */
.otrock-ems__content {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 40px;
  max-width: 650px;
}

.otrock-ems__content .otrock-badge {
  margin-bottom: 0;
}

.otrock-ems__title {
  margin-bottom: 0;
}

.otrock-ems__text {
  max-width: 600px;
  margin: 0;
  color: #FFF
}

/* Odrážky */
.otrock-ems__bullets {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-bottom: 40px;
}

.otrock-ems__bullets li {
  display: flex;
  align-items: center;
  gap: 16px;
  font-family: var(--otrock-font-base);
  font-weight: 600;
  font-size: 20px;
  line-height: 32px;
  color: #FFF;
}

.otrock-ems__bullets li::before {
  content: '';
  display: inline-block;
  width: 8px;
  height: 8px;
  flex-shrink: 0;
  background: var(--otrock--color-primary-accent);
  border-radius: 50%;
}

/* ============================
   EMS - TABLET
   ============================ */
@media (min-width: 768px) and (max-width: 1024px) {
  .otrock-ems {
    padding-top: 80px;
    padding-bottom: 80px;
  }

  .otrock-ems__box {
    min-height: 600px;
    border-radius: 32px;
  }

  .otrock-ems__bg {
    border-radius: 0 32px 32px 0;
  }

  .otrock-ems__overlay {
    border-radius: 32px;
  }

  .otrock-ems__content {
    padding: 60px 40px;
    max-width: 55%;
  }
}

/* ============================
   EMS - MOBIL
   ============================ */
@media (max-width: 768px) {
  .otrock-ems {
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 0;
    padding-right: 0;
  }

  .otrock-ems__box {
    min-height: auto;
    border-radius: 0;
  }

  .otrock-ems__bg {
    position: relative;
    width: 100%;
    height: 250px;
    border-radius: 0;
  }

  .otrock-ems__overlay {
    border-radius: 0;
    background: linear-gradient(180deg, rgba(5, 12, 51, 0.00) 0%, #050C33 23%);
  }

  .otrock-ems__content {
    padding: 32px var(--otrock-site-gutter-mob);
    max-width: 100%;
  }
  .otrock-ems__content .otrock-btn-kontakt {
    width: 100%;
  }

  .otrock-ems__title {
    font-size: 32px;
    line-height: 48px;
  }

  .otrock-ems__text {
    max-width: 100%;
  }

  .otrock-ems__bullets {
    text-align: left;
  }

  .otrock-ems__bullets li {
    font-size: 16px;
    line-height: 28px;
  }

  .btn-small-left {
    justify-content: center;
    width: 100%;
  }
}

/* ============================
   ENERGY STEPS – DESKTOP/MOBIL PŘEPÍNÁNÍ
   ============================ */

/* Mobilní layout - skrytý na desktopu */
.otrock-energy-steps__mobile {
  display: none;
}

/* ============================
   ENERGY STEPS - TABLET
   ============================ */
@media (min-width: 768px) and (max-width: 1024px) {
  .otrock-energy-steps__desktop {
    display: none;
  }

  .otrock-energy-steps__mobile {
    display: flex;
    flex-direction: column;
    gap: 16px;
  }

  .otrock-energy-step-card {
    display: flex;
    gap: 24px;
    align-items: flex-start;
    padding: 16px 16px 24px;
    background: rgba(255, 255, 255, 0.05);
    border: 0.5px solid #0744F8;
    border-radius: 16px;
  }

  .otrock-energy-step-card__num {
    flex-shrink: 0;
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.1);
    border: 0.5px solid #0744F8;
    border-radius: 8px;
    font-family: var(--otrock-font-base);
    font-weight: 700;
    font-size: 40px;
    line-height: 56px;
    color: #0744F8;
  }

  .otrock-energy-step-card__body {
    display: flex;
    flex-direction: column;
    gap: 8px;
  }

  .otrock-energy-step-card__title {
    font-family: var(--otrock-font-base);
    font-weight: 700;
    font-size: 20px;
    line-height: 32px;
    color: #FFF;
    margin: 0;
  }

  .otrock-energy-step-card__desc {
    font-family: var(--otrock-font-base);
    font-weight: 400;
    font-size: 18px;
    line-height: 30px;
    color: #AEB4FF;
    margin: 0;
  }

  .otrock-energy-steps__mobile .btn-small {
    margin-top: 24px;
  }
}

/* ============================
   ENERGY STEPS - MOBIL
   ============================ */
@media (max-width: 768px) {
  .otrock-energy-steps__desktop {
    display: none;
  }

  .otrock-energy-steps__mobile {
    display: flex;
    flex-direction: column;
    gap: 24px;
  }

  .otrock-energy-step-card {
    display: flex;
    gap: 24px;
    align-items: flex-start;
    padding: 16px 16px 24px;
    background: rgba(255, 255, 255, 0.05);
    border: 0.5px solid #0744F8;
    border-radius: 16px;
  }

  .otrock-energy-step-card__num {
    flex-shrink: 0;
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.1);
    border: 0.5px solid #0744F8;
    border-radius: 8px;
    font-family: var(--otrock-font-base);
    font-weight: 700;
    font-size: 40px;
    line-height: 56px;
    color: #0744F8;
  }

  .otrock-energy-step-card__body {
    display: flex;
    flex-direction: column;
    gap: 8px;
  }

  .otrock-energy-step-card__title {
    font-family: var(--otrock-font-base);
    font-weight: 700;
    font-size: 20px;
    line-height: 32px;
    color: #FFF;
    margin: 0;
  }

  .otrock-energy-step-card__desc {
    font-family: var(--otrock-font-base);
    font-weight: 400;
    font-size: 18px;
    line-height: 30px;
    color: #AEB4FF;
    margin: 0;
  }

  .otrock-energy-steps__mobile .btn-small {
    margin-top: 24px;
    width: 100%;
  }
}

/* ============================
   HODNOTY A PŘÍSTUP – DESKTOP
   ============================ */
.otrock-values {
  padding-top: 120px;
  padding-bottom: 120px;
  background: var(--otrock-font-color-secondary);
}

.otrock-values__box {
  position: relative;
  border-radius: 48px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.2);
  background: #050C33;
}

.otrock-values__bg {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  opacity: 0.5;
  z-index: 0;
}

.otrock-values__overlay {
  position: absolute;
  inset: 0;
  border-radius: 48px;
  background: linear-gradient(270deg, rgba(5, 12, 51, 0.00) 37.19%, #050C33 58.55%);
  z-index: 1;
}

.otrock-values__content {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 80px 40px;
}

.otrock-values__head {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  max-width: 700px;
}

.otrock-values__head .otrock-badge {
  margin-bottom: 0;
}

.otrock-values__title {
  margin-bottom: 0;
}

.otrock-values__text {
  margin: 0;
  color: #FFF;
}

/* Grid 2×2 */
.otrock-values__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
  width: 75%;
}

/* Karta */
.otrock-values-card {
  position: relative;
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 30px;
  background: rgba(22, 32, 63, 0.5);
  border: 1px solid rgba(22, 32, 63, 0.5);
  border-radius: 24px;
  backdrop-filter: blur(50px);
  -webkit-backdrop-filter: blur(50px);
}

/* Glass inner shadow */
.otrock-values-card::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 24px;
  box-shadow: inset 0 0 20px rgba(255, 255, 255, 0.1);
  pointer-events: none;
  z-index: 3;
}

/* Ikona – kruhová */
.otrock-values-card__icon {
  flex-shrink: 0;
  width: 60px;
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #D7D8F1;
  border-radius: 40px;
}

.otrock-values-card__icon img {
  width: 35px;
  height: 35px;
}

/* Tělo karty */
.otrock-values-card__body {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.otrock-values-card__title {
  font-family: var(--otrock-font-base);
  font-weight: 700;
  font-size: 20px;
  line-height: 32px;
  color: #FFF;
  margin: 0;
}

.otrock-values-card__text {
  font-family: var(--otrock-font-base);
  font-weight: 400;
  font-size: 16px;
  line-height: 30px;
  color: #FFF;
  margin: 0;
}

/* ============================
   HODNOTY A PŘÍSTUP – TABLET
   ============================ */
@media (min-width: 768px) and (max-width: 1024px) {
  .otrock-values {
    padding-top: 80px;
    padding-bottom: 80px;
  }

  .otrock-values__box {
    border-radius: 32px;
  }

  .otrock-values__overlay {
    border-radius: 32px;
  }

  .otrock-values__content {
    padding: 60px 32px;
  }

  .otrock-values__grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .otrock-values-card {
    padding: 32px;
  }
}

/* ============================
   HODNOTY A PŘÍSTUP – MOBIL
   ============================ */
@media (max-width: 768px) {
  .otrock-values {
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 0;
    padding-right: 0;
  }

  .otrock-values__box {
    border-radius: 0;
    border-left: none;
    border-right: none;
    border: none;
  }

  .otrock-values__bg {
    border-radius: 0;
  }

  .otrock-values__overlay {
    border-radius: 0;
    background: #050C33;

  }

  .otrock-values__content {
    padding: 40px var(--otrock-site-gutter-mob);
  }

  .otrock-values__head {
    text-align: center;
  }

  .otrock-values__grid {
    grid-template-columns: 1fr;
    gap: 24px;
    width: 100%;
  }

  .otrock-values-card {
    padding: 24px;
    min-height: auto;
  }

  .otrock-values-card__icon {
    width: 64px;
    height: 64px;
    border-radius: 32px;
  }

  .otrock-values-card__icon img {
    width: 36px;
    height: 36px;
  }

  .otrock-values-card__title {
    font-size: 18px;
    line-height: 28px;
  }

  .otrock-values-card__text {
    font-size: 16px;
    line-height: 26px;
  }
}

/* ============================
   NÁVRH ŘEŠENÍ – DESKTOP
   ============================ */
.otrock-sol-design {
  position: relative;
  padding-top: 0;
  padding-bottom: 0;
  overflow: hidden;
  background: var(--otrock-font-color-secondary);
}

.otrock-sol-design__bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  opacity: 0.2;
  z-index: 0;
  pointer-events: none;
}

.otrock-sol-design__overlay {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, #050C33 0%, rgba(5, 12, 51, 0.00) 25%),
    linear-gradient(270deg, rgba(5, 12, 51, 0.00) 16.31%, #050C33 83.69%);
  z-index: 1;
}

.otrock-sol-design__content {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 64px;
  padding: 105px 0;
  max-width: 910px;
  margin: 0 auto;
}

.otrock-sol-design__body {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}

.otrock-sol-design__head {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  width: 100%;
}

.otrock-sol-design__head .otrock-architecture-solution__badge-row {
  margin-bottom: 0;
}

.otrock-sol-design__title {
  margin-bottom: 0;
}

.otrock-sol-design__text {
  max-width: 586px;
  margin: 0;
  color: #FFF;
}

/* Odrážky s SVG ikonkou */
.otrock-sol-design__bullets {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 474px;
}

.otrock-sol-design__bullets li {
  display: flex;
  align-items: center;
  gap: 16px;
  font-family: var(--otrock-font-base);
  font-weight: 600;
  font-size: 20px;
  line-height: 32px;
  color: #FFF;
}

.otrock-sol-design__check {
  flex-shrink: 0;
  width: 16px;
  height: 12px;
}

/* Tlačítka pod sebou – stejná šířka */
.otrock-sol-design__buttons {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 24px;
  width:300px;
}

.otrock-sol-design__buttons .otrock-btn-kontakt,
.otrock-sol-design__buttons .otrock-btn-kontakt-transparent {
  width: 100%;
  text-align: center;
  justify-content: center;
}

/* ============================
   NÁVRH ŘEŠENÍ – TABLET
   ============================ */
@media (min-width: 768px) and (max-width: 1024px) {
  .otrock-sol-design__content {
    padding: 80px 32px;
    gap: 48px;
  }

  .otrock-sol-design__body {
  }

  .otrock-sol-design__bullets {
    width: 100%;
    max-width: 474px;
  }
  
}

/* ============================
   NÁVRH ŘEŠENÍ – MOBIL
   ============================ */
@media (max-width: 768px) {
  .otrock-sol-design {
    padding-left: 0;
    padding-right: 0;
  }
.otrock-key-solution__bg {
    position: absolute;
    inset: 0;
    background-size: 174% auto;
    background-position: center top;
    background-repeat: no-repeat;
    z-index: 0;
}
  .otrock-sol-design__content {
    padding: 60px var(--otrock-site-gutter-mob);
    gap: 48px;
  }

  .otrock-sol-design__body {

  }

  .otrock-sol-design__head {
  }

  .otrock-sol-design__text {
    max-width: 100%;
  }

  .otrock-sol-design__bullets {
    width: 100%;
  }

  .otrock-sol-design__bullets li {
    font-size: 16px;
    line-height: 28px;
  }

  .otrock-sol-design__buttons {
    width: 100%;
  }

  .otrock-sol-design__buttons .otrock-btn-kontakt,
  .otrock-sol-design__buttons .otrock-btn-kontakt-transparent {
    width: 100%;
  }
}