/* Vzor P07: zed recenzi. Tri sloupce ruzne vysokych karet, mezi nimi vetsi
   karta s fotkou, spodek zdi je prekryty prechodem s tlacitkem.
   Hodnoty nactene z jejich stylesheetu (source/sections/07.css):
     sekce: bg gray-100, horni radius 48, spacer 64 nahore
     tagy: gap 6 | tag border 1px gray-100, bg gray-50, r12, padding 4px 10px, 13px/155%, w500
     odsazeni: tagy -> nadpis 28, nadpis -> zed 48
     nadpis: 40px, w600, lh 128%, na stred (tablet 32, mobil 28)
     zed: grid 1fr 1fr 1fr, gap 12 | sloupec: grid, gap 12
     karta: bila, r36, padding-block 28, overflow hidden
     hlavicka: gap 16, margin-bottom 24, padding-inline 28
     portret: 64x64, r64 | jmeno 20px w700 lh148 | pozice 14px w300 lh168, firma w600
     text: padding-inline 28, 16px w400 lh150
     media: horni radius 28, u karty s fotkou padding-bottom 0
     prekryv: gradient gray-100 (0 -> 67 % -> 100 %), padding 160 nahore, 120 dole */
#p07{ padding-block:var(--sp-64) 0; }
#p07 .container-1344{ max-width:calc(1344px + 2*40px); padding-inline:40px; }

.p07__tags{ display:flex; justify-content:center; align-items:center; gap:6px; }
.p07__tag{
  display:inline-flex; align-items:center; gap:4px;
  border:1px solid var(--zinc-100); background:var(--zinc-50); color:var(--zinc-700);
  border-radius:var(--r-chip); padding:4px 10px;
  font-size:var(--fs-13); font-weight:500; line-height:var(--lh-155);
}
.p07__h2{
  margin:var(--sp-28) 0 0; text-align:center;
  font-size:var(--fs-40); font-weight:600; line-height:var(--lh-128); color:var(--zinc-950);
}

.p07__wall{ position:relative; overflow:hidden; margin-block-start:var(--sp-48); max-height:860px; }
.p07__wall.is-open{ max-height:none; }
.p07__cols{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:12px; align-items:start; }
.p07__col{ display:grid; gap:12px; }

.p07__card{
  background:var(--zinc-0); border-radius:var(--r-card);
  padding-block:var(--sp-28); overflow:hidden;
}
.p07__card--media{ padding-block-end:0; }

.p07__head{
  display:flex; align-items:center; gap:var(--sp-16);
  margin-block-end:var(--sp-24); padding-inline:var(--sp-28);
}
.p07__ava{
  flex:none; width:64px; height:64px; border-radius:64px;
  display:flex; align-items:center; justify-content:center;
  background:var(--zinc-150); color:var(--zinc-600);
  font-size:var(--fs-20); font-weight:600; letter-spacing:.02em;
}
.p07__who{ display:flex; flex-direction:column; gap:2px; min-width:0; }
.p07__name{ font-size:var(--fs-20); font-weight:700; line-height:var(--lh-148); color:var(--zinc-900); }
.p07__role{
  display:flex; flex-wrap:wrap; align-items:center; column-gap:4px;
  font-size:var(--fs-14); font-weight:300; line-height:var(--lh-168); color:var(--zinc-600);
}
.p07__role b{ font-weight:600; color:var(--zinc-900); }

.p07__body{ padding-inline:var(--sp-28); }
.p07__text{ margin:0; font-size:var(--fs-16); font-weight:400; line-height:var(--lh-150); color:var(--zinc-800); }

.p07__media{
  margin:var(--sp-20) 0 0; position:relative; overflow:hidden;
  border-start-start-radius:var(--r-inner); border-start-end-radius:var(--r-inner);
  aspect-ratio:4/3; background:var(--zinc-100);
}
.p07__media img{ width:100%; height:100%; object-fit:cover; }

.p07__more{
  position:absolute; inset:auto 0 0; z-index:10;
  display:flex; justify-content:center; align-items:flex-end;
  padding-block:160px var(--sp-64);
  background-image:linear-gradient(rgba(244,244,245,0), rgba(244,244,245,.67) 21%, var(--zinc-100) 44%);
}
.p07__more .btn{ border:1px solid var(--zinc-0); box-shadow:var(--shadow-card); }

@media (max-width:1023px){
  .p07__h2{ font-size:var(--fs-32); }
  .p07__cols{ grid-template-columns:1fr 1fr; }
  .p07__col:last-child{ display:none; }
}
@media (max-width:639px){
  #p07 .container-1344{ padding-inline:16px; }
  .p07__h2{ font-size:28px; }
  .p07__cols{ grid-template-columns:1fr; }
  .p07__col:last-child{ display:grid; }
  .p07__wall{ max-height:620px; }
  .p07__ava{ width:56px; height:56px; }
}