/* stránka index foto pod menu */
    .hero {
      position: relative;

      height: 60vh;
      margin: 40px auto;
      background-size: cover;
      background-position: center;
      background-repeat: no-repeat;
      background-blend-mode: overlay;
      background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.3), rgba(245, 245, 245, 1)), url("https://source.unsplash.com/1600x900/?nature");
      box-shadow: 0 10px 25px rgba(0, 0, 0, 0.3);
      border-radius: 10px;
      transition: background-image 1s ease-in-out;

      /* Efekt zmizení do pozadí */
     /* Průhledné okraje pomocí masky */
  -webkit-mask-image: radial-gradient(ellipse at center, black 70%, transparent 100%);
  mask-image: radial-gradient(ellipse at center, black 70%, transparent 100%);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
}
}

    .menu {
      text-align: center;
      padding: 20px;
    }

 .content {
  max-width: 800px;
  margin: -200px auto 40px auto; /* << posun nahoru přes obrázek */
  padding: 30px;
  background-color: white;
  border-radius: 12px;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
  position: relative;
  z-index: 2;
}

    @media (max-width: 768px) {
      .hero {
        height: 40vh;
      }
    }

/* stránka index foto pod menu */



/* stránka HOME */

body{margin:0;font-family:system-ui,Roboto,Arial,sans-serif;line-height:1.6;color:#0f172a;background:#f8fafc}
:root{
--brand:#0ea5e9;
--brand-600:#0284c7;
--muted:#475569;
--card:#ffffff;
--radius:18px;
--shadow:0 10px 30px rgba(2,8,23,.08),0 4px 12px rgba(2,8,23,.06);
}
.container{max-width:1200px;margin-inline:auto;}
.services{display:flex;flex-direction:column;gap:40px}
.card{display:flex;flex-direction:column;background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden;border:1px solid #e2e8f0}
.card-info{display:flex;flex-direction:column;background:var(--card);border-radius:var(--radius);overflow:hidden;border:1px solid #e2e8f0}

.card-info p{font-size:21px; margin:0 0 .8rem}
.card__ikona{min-width:324px; min-height:280px;background:#fff}
.card__media{flex:1;min-height:280px;background:#e2e8f0}
.card__body{flex:1;padding: 5px 10px 5px 25px;display:flex;flex-direction:column;justify-content:center}


/* střídání layoutu */
.card.layout-left{flex-direction:row}
.card.layout-right{flex-direction:row-reverse}


/* karta informace prijeti layoutu */
.card-info.layout-left{flex-direction:row}
.card-info.layout-right{flex-direction:row-reverse}





@media(max-width:768px){
.card.layout-left,.card.layout-right{flex-direction:column}
.card-info.layout-left,.card-info.layout-right{flex-direction:column}





}


.card h2{font-size:32px;font-weight:600;color:#0076BE;text-transform:uppercase;margin-bottom:20px}
.card p{margin:0 0 .8rem}




.features{display:grid;gap:10px;margin:14px 0 18px;padding:0;list-style:none}
.feature{display:flex;gap:10px;align-items:flex-start}
.feature .dot{width:10px;height:10px;flex:none;border-radius:999px; margin: 10px 0px 0px 0px; background:var(--brand)}
.feature span{flex:1}
.card__footer{display:flex;gap:10px;align-items:center;justify-content:flex-start;padding:14px 18px;}
.btn{display:inline-flex;align-items:center;border-radius:999px;padding:.5em 1em;font-weight:600;border:1px solid transparent;transition:.2s}
.btn-primary{background:var(--brand);color:white}
.btn-primary:hover{background:var(--brand-600)}


.container1{max-width:1200px;margin-inline:auto;padding:clamp(16px,3vw,15px)}
.services1{display:flex;flex-direction:column;gap:40px}
.card1{display:flex;flex-direction:column;background:var(--card);border-radius:var(--radius);overflow:hidden;border:1px solid #e2e8f0}
.card__media1{flex:1;min-height:280px;background:#e2e8f0}
.card__body1{flex:1;display:flex;flex-direction:column;justify-content:center}


/* střídání layoutu */
.card.layout-left1{flex-direction:row}
.card.layout-right1{flex-direction:row-reverse}


@media(max-width:768px){
.card1.layout-left,.card1.layout-right{flex-direction:column}
}


.card1 h2{font-size:21px;font-weight:600;color: #0076BE; margin-bottom:20px; }
.card1 p{text-align: justify; margin:0 0 .8rem}
.features{display:grid;gap:10px;margin:14px 0 18px;padding:0;list-style:none}
.feature{display:flex;gap:10px;align-items:flex-start}
.feature .dot{width:10px;height:10px;flex:none;border-radius:999px; margin: 10px 0px 0px 0px; background:var(--brand)}
.feature span{flex:1}
.card__footer{display:flex;gap:10px;align-items:center;justify-content:flex-start;padding:14px 18px;}
.btn{display:inline-flex;align-items:center;border-radius:999px;padding:.5em 1em;font-weight:600;border:1px solid transparent;transition:.2s}
.btn-primary{background:var(--brand);color:white}
.btn-primary:hover{background:var(--brand-600)}


.card1 {
  position: relative;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  min-width: 0;
  word-wrap: break-word;
  background-color: #fff;
  background-clip: border-box;
  border: 0px solid rgba(0,0,0,.125);
  border-radius: 0%;
}



.nadpis 
{
width: 100%;
height: 60px;  
border-bottom: 2px solid #0076BE;
position: relative;

display: -ms-flexbox;

-ms-flex-direction: column;
flex-direction: column;
word-wrap: break-word;
background-color: #fff;
background-clip: border-box;
}


.nadpis h2{font-size:30px; color: #0076BE; margin-bottom:20px; }















/* stránka HOME */















/* stránka CHRANENI BYDLENI AS */




.card {
  position: relative;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  min-width: 0;
  word-wrap: break-word;
  background-color: #fff;
  background-clip: border-box;

}




.features1 {
  list-style: none;
  margin: 14px 0 18px;
  padding: 0;
}

.feature1 {
  display: flex;
  gap: 10px;
  align-items: flex-start; /* číslo/tečka a text nahoře na řádku */
  margin-bottom: 0.8em;
}

.feature1 .dot {
  min-width: 1.5em;     /* rezerva pro čísla 1., 2., 10. */
  text-align: right;    /* zarovnat čísla doprava */
  font-weight: bold;
  color: #000;       /* modrá */
}

/* stránka CHRANENI BYDLENI AS */




/* stránka CHRANENI BYDLENI INFO A DOZP */

/* Hlavní seznam – písmena a), b), c) */
.outer-list {
  counter-reset: item;
  list-style-type: none;   /* vypne výchozí číslování */
  padding-left: 0;
}

.outer-list > li {
  counter-increment: item;
  margin-bottom: 1em;
  position: relative;
  padding-left: 2em;
}

.outer-list > li::before {
  content: counter(item, lower-alpha) ") ";
  position: absolute;
  left: 0;
}

/* Vnořený seznam – čísla 1,2,3 */
.outer-list > li > ol {
  list-style: decimal !important;   /* vynutí klasické číslování */
  margin-top: 0.5em;
  padding-left: 2em;                /* odsazení čísel od textu */
}

.outer-list > li > ol > li {
  display: list-item !important;    /* zajistí vykreslení čísel */
  list-style: decimal !important;
}








.features1 {
  list-style: none;
  margin: 14px 0 18px;
  padding: 0;
}

.feature1 {
  display: flex;
  gap: 10px;
  align-items: flex-start; /* číslo/tečka a text nahoře na řádku */
  margin-bottom: 0.8em;
}

.feature1 .dot {
  min-width: 1.5em;     /* rezerva pro čísla 1., 2., 10. */
  text-align: right;    /* zarovnat čísla doprava */
  font-weight: bold;
  color: #000;
}




/* Druhý typ seznamu - písmena a), b), c) s odsazením */
.outer-list2 {
  counter-reset: item;
  list-style-type: none;
  padding-left: 3em; /* posun celého seznamu od okraje stránky */
}

.outer-list2 > li {
  counter-increment: item;  
  margin-bottom: 0.5em;
  position: relative;
  padding-left: 2em;        /* mezera pro písmeno */
  display: list-item;
}

.outer-list2 > li::before {
  content: counter(item, lower-alpha) ") ";
  position: absolute;
  left: 0;
}