:root {
  --zlta: #EAD374; --tmava: #231F20; --strana: #EFEBE3; --tlmena: #5E5759;
  --sans: Arial, Helvetica, sans-serif; --heavy: 'Arial Black', Arial, Helvetica, sans-serif;
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--strana); color: var(--tmava); font-family: var(--sans); }
main { max-width: 600px; margin: 0 auto; padding: 24px 16px 40px; }
.uvod { display: flex; justify-content: space-between; align-items: flex-end; gap: 12px;
        background: var(--zlta); border-radius: 16px 16px 0 0; padding: 32px 0 0 39px; overflow: hidden; }
.uvod-text { padding-bottom: 36px; }
.logo { display: block; width: 96px; height: auto; margin-bottom: 40px; }
h1 { margin: 0; font-family: var(--heavy); font-size: 44px; line-height: 1.02; letter-spacing: -0.02em; }
.adela { display: block; width: 220px; height: auto; flex-shrink: 0; }
.telo { background: #fff; border-radius: 0 0 16px 16px; padding: 36px 44px 40px; }
p { margin: 0 0 18px; font-size: 16px; line-height: 1.65; }
.tlacidlo { display: inline-block; margin: 8px 0 32px; padding: 15px 28px; border-radius: 26px;
            background: var(--tmava); color: var(--zlta); font-weight: bold; text-decoration: none; }
.tlacidlo:hover { background: #000; }
.tlacidlo:focus-visible { outline: 3px solid var(--zlta); outline-offset: 3px; }
.podpis { margin: 0; }
footer { padding: 22px 16px 0; font-size: 12px; line-height: 1.6; color: var(--tlmena); text-align: center; }
@media (max-width: 520px) {
  .uvod { padding-left: 22px; }
  .logo { margin-bottom: 28px; }
  h1 { font-size: 34px; }
  .adela { width: 136px; }
  .telo { padding: 28px 22px 32px; }
}
.srdce { width: 16px; height: 16px; vertical-align: -2px; margin-right: 4px; }