:root{--hp-foto:url("/wp-content/themes/HumanRights-1.4/landing/assets/img/hp-hero-1600.webp")}
@media (max-width:900px){:root{--hp-foto:url("/wp-content/themes/HumanRights-1.4/landing/assets/img/hp-hero-768.webp")}}
@media (min-width:1700px),(min-resolution:1.5dppx){:root{--hp-foto:url("/wp-content/themes/HumanRights-1.4/landing/assets/img/hp-hero-2048.webp")}}


a{color:#8C2326}a:hover{color:#7A1D20}
.hp-hero{background:linear-gradient(90deg,rgba(251,247,241,.96) 0%,rgba(251,247,241,.92) calc(50% - 230px),rgba(251,247,241,.55) calc(50% - 110px),rgba(251,247,241,0) calc(50% + 40px)),#EFDDD1 var(--hp-foto) right center / auto 100% no-repeat}
@media (min-width:1441px){.hp-hero{min-height:min(43.3vw,900px)!important;background-size:auto,77.5% auto}}
.faq summary::-webkit-details-marker{display:none}.faq .faq-ic{background:#F2EAE0;color:#8C2326}.faq[open] .faq-ic{background:#8C2326;color:#FBF7F1}.faq[open] .faq-v{display:none}.faq[open]{border-color:#C9BCA8}






/* Formulář: vzhled podle makety, značky z našeho mp-contact-form. */
.hp-form .form{display:flex;flex-direction:column;gap:14px;margin:0}
.hp-form .dvoj{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.hp-form .dvoj .cely{grid-column:1 / -1}
.hp-form label{display:block;margin:0}
.hp-form .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.hp-form .pole{box-sizing:border-box;width:100%;height:58px;padding:0 18px;border:1px solid #E4CFB6;
  border-radius:14px;background:#FBF7F1;font-family:'Source Serif 4',Georgia,serif;font-size:16px;color:#231F21}
.hp-form textarea.pole{height:auto;min-height:130px;padding:16px 18px;line-height:1.45;resize:vertical}
.hp-form .pole:focus{outline:2px solid #8C2326;outline-offset:1px}
.hp-form .pole-soubor{padding:12px}
.hp-form .prilohy-pozn{margin:0;font-family:'Source Serif 4',Georgia,serif;font-size:13px;color:#6E655E}
.hp-form .souhlas{display:flex;align-items:flex-start;gap:10px;font-family:'Source Serif 4',Georgia,serif;
  font-size:14px;line-height:1.45;color:#231F21}
.hp-form .souhlas input{margin-top:3px;width:18px;height:18px;accent-color:#8C2326}
.hp-form .odeslat{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.hp-form .odeslat span{font-family:'Source Serif 4',Georgia,serif;font-size:13px;color:#6E655E}
.hp-form .odeslat .btn{display:inline-flex;align-items:center;justify-content:center;height:52px;padding:0 26px;
  border:0;border-radius:999px;background:linear-gradient(180deg,#A32B2E,#7A1D20);color:#FBF7F1;
  font-family:'Lexend',system-ui,sans-serif;font-size:15px;font-weight:600;cursor:pointer}
.hp-form .mp-cf-status{font-family:'Source Serif 4',Georgia,serif;font-size:14px}
@media (max-width:640px){.hp-form .dvoj{grid-template-columns:1fr}}
/* Šablona webu psala text tlačítek verzálkami, maketa je má normálně. */
.hp-form .odeslat .btn{text-transform:none;letter-spacing:0}

/* ------------------------------------------------------------------ mobil
   Maketa je kreslená pro šířku 1440 px a veškeré míry má přímo ve značkách.
   Na užších obrazovkách je proto přepisujeme tady. */
@media (max-width:1100px){
  .hp2 section > div{padding-left:40px!important;padding-right:40px!important}
  .hp2 [style*="grid-template-columns: 560px"]{grid-template-columns:1fr!important}
}
@media (max-width:900px){
  .hp2 section > div{padding-left:20px!important;padding-right:20px!important}
  .hp2 [style*="grid-template-columns"]{grid-template-columns:1fr!important}
  .hp2 .hp-hero{min-height:0!important;background-image:none!important;background-color:#FBF7F1!important}
  .hp2 h1 span:first-child{font-size:34px!important;line-height:1.1!important}
  .hp2 h1 span:last-child{font-size:20px!important}
  .hp2 h2{font-size:27px!important;line-height:1.15!important}
  .hp2 [style*="width: 290px"],.hp2 [style*="width: 300px"],.hp2 [style*="width: 560px"]{width:auto!important;max-width:100%!important}
  .hp2 [style*="position: absolute"][style*="bottom: 22px"]{position:static!important;margin:16px}
  .hp2 [style*="min-height: 400px"]{min-height:220px!important}
  .hp2 img{max-width:100%}
  .hp2 [style*="max-width: 720px"]{max-width:100%!important}
}
@media (max-width:640px){
  .hp2 h1 span:first-child{font-size:28px!important}
  .hp2 [style*="justify-content: space-between"]{flex-wrap:wrap!important}
}