/* Vzor P10: zaverecna vyzva, centrovany nadpis a jednoradkovy formular
   nad fotografickym pasem pres celou sirku.
   Hodnoty nactene z jejich stylesheetu (source/sections/10.css):
     sekce: radius nahore 48, margin-top -48, padding-top 144, padding-bottom 328,
            overflow hidden (tablet padding-bottom 248, spacer 80)
     obsah: padding-global 2.5rem, container 84rem, nadpis max-width 828, na stred
     minatury v nadpisu: 111x40, margin-bottom -4 (mobil 100x36)
     mezera nadpis/formular: 40
     formular: bila, border 1px #e3e3e45c, radius 24, padding 6, max-width 440, flex
     pole: radius 14, vyska 46 (v ramu 100 %), padding 12/16, 15px/135 %, ramecek pruhledny
     tlacitko: radius 16, padding 14/18, 15px/135 %
     pas: sirka 1440, zarovnany dolu, na stred pres translate(-50 %), vyska 725
     kruzitko za mysi: mix-blend-mode overlay, posun 370/320, prechod opacity .5s
     mobil: formular pod sebe, tlacitko na celou sirku */

.p10{ position:relative; overflow:hidden; padding-block:144px 328px; }
.p10__inner{
  position:relative; z-index:1;
  width:100%; max-width:calc(84rem + 5rem);
  margin-inline:auto; padding-inline:2.5rem;
}

.p10__h{
  max-width:828px; margin:0 auto; text-align:center; color:var(--zinc-950);
}
.p10__thumbs{
  display:inline-flex; align-items:center; vertical-align:middle;
  width:111px; height:40px; margin-block-end:-4px;
}
.p10__thumbs img{
  width:40px; height:40px; border-radius:var(--r-pill); object-fit:cover; object-position:50% 50%;
  border:2px solid var(--zinc-0); box-shadow:var(--shadow-card);
}
.p10__thumbs img + img{ margin-inline-start:-5px; }

.p10__form{
  display:flex; align-items:center; gap:0;
  width:100%; max-width:440px; margin:var(--sp-40) auto 0;
  background:var(--zinc-0); border:1px solid rgba(227,227,228,.36);
  border-radius:24px; padding:6px;
}
.p10__label{ position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.p10__input{ flex:1; border-color:transparent; height:48px; }
.p10__input:focus{ outline:none; border-color:var(--zinc-200); }
.p10__input.has-error{ border-color:#fd9b82; }
.p10__submit{ flex:none; }

.p10__note{ text-align:center; margin:var(--sp-16) 0 0; }

/* pas fotografie pres celou sirku, nahore mekce prechazi do bile */
.p10__band{
  position:absolute; inset:auto auto 0 50%; transform:translateX(-50%);
  /* jejich pas ma pevnych 1440, ale nad 1440 by zbyly bile okraje, proto min-width */
  width:100%; min-width:1440px; max-width:none; height:300px;
  pointer-events:none; z-index:0;
}
.p10__band img{
  width:100%; height:100%; object-fit:cover; object-position:50% 62%;
  -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 34%);
  mask-image:linear-gradient(to bottom,transparent 0,#000 34%);
}

.p10__glow{
  position:absolute; top:0; left:0; width:740px; height:640px;
  border-radius:var(--r-pill); pointer-events:none; z-index:0; opacity:0;
  mix-blend-mode:overlay; transition:opacity .5s;
  background:radial-gradient(closest-side,rgba(52,168,83,.55),rgba(52,168,83,0) 70%);
}

@media (max-width:991px){
  .p10{ padding-block:80px 248px; }
  .p10__h{ font-size:var(--fs-40); }
  .p10__band{ height:280px; }
}
@media (max-width:640px){
  .p10{ padding-block:64px 200px; }
  .p10__inner{ padding-inline:1rem; }
  .p10__h{ font-size:var(--fs-32); }
  .p10__thumbs{ width:100px; height:36px; }
  .p10__thumbs img{ width:36px; height:36px; }
  .p10__form{ flex-direction:column; gap:6px; }
  .p10__input{ width:100%; }
  .p10__submit{ width:100%; }
  .p10__band{ height:280px; }
}