﻿<style>
/* STORY */
.df-story-s{padding:0 0 80px 0}
.df-story-g{
 display:grid;grid-template-columns:1fr 1fr;gap:60px;
 align-items:center;max-width:1200px;margin:0 auto;padding:0 20px
}
.df-story-img{position:relative}
.df-story-img img{
 width:100%;border-radius:20px;box-shadow:0 20px 50px rgba(0,0,0,.15);
 transition:.3s
}
.df-story-img:hover img{transform:scale(1.02)}
.df-story-cap{
 position:absolute;bottom:20px;left:20px;background:rgba(255,255,255,.9);
 padding:10px 20px;border-radius:12px;
 box-shadow:0 5px 15px rgba(0,0,0,.1);font-weight:700;color:var(--d)
}
.df-story-c p{margin-bottom:20px;font-size:16px;line-height:1.8;color:#4A5568}
.df-quote{
 border-left:4px solid var(--o);padding-left:20px;
 font-style:italic;font-size:18px;color:var(--p);margin:30px 0;font-weight:500
}
/* TRUST */
.df-trust-i{
 text-align:center;padding:20px;background:var(--w);
 border-radius:var(--r);box-shadow:0 4px 10px rgba(0,0,0,.05)
}
.df-trust-icon{
 font-size:40px;color:var(--p);margin-bottom:20px;background:#E6FFFA;
 width:80px;height:80px;display:inline-flex;align-items:center;justify-content:center;
 border-radius:50%;box-shadow:0 10px 20px rgba(0,0,0,.05)
}
.df-trust-i h3{font-size:18px;margin-bottom:10px;color:var(--d)}
@media(max-width:1024px){
 #df-home .df-g4{grid-template-columns:repeat(2,1fr)}
 #df-home .df-g3{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:900px){
 .df-story-g{grid-template-columns:1fr;gap:40px}
 .df-story-img{order:-1}
 .df-sec-t{text-align:center!important}
 .df-story-c{text-align:center}
 .df-quote{border-left:none;border-top:4px solid var(--o);padding-top:20px;padding-left:0}
}
@media(max-width:600px){
 #df-home .df-g4,#df-home .df-g3{grid-template-columns:1fr}
 #df-home .df-hero-ht{font-size:32px}
 #df-home .df-hero-i{flex-direction:column;text-align:center}
 .df-hero-b,.df-hero-badge{justify-content:center}
 .df-hero-sc{display:none}
}
/* --- Jednotná velikost chipů "Čo u nás nájdete" --- */
/* Desktop / tablet – kapsle mají minimální šířku, vypadají stejně */
#df-home .df-chip-row{
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
    gap:10px;
}
#df-home .df-chip{
    display:flex;
    align-items:center;
    justify-content:center;
    min-width:210px;          /* všechny minimálně stejně široké */
    text-align:center;
}
/* Mobil – každý chip přes celou šířku (všechny stejně velké) */
@media (max-width: 600px){
  #df-home .df-chip-row{
      justify-content:center;
      align-items:stretch;
  }
  #df-home .df-chip{
      width:100%;
      max-width:320px;        /* aby to nebylo úplně přes celý monitor */
      margin:0 auto;
  }
}
</style>