/* =========================================================
   Žilní klinika Vlašim — sdílené styly · verze OPTIMAL_3_B4.2 (starorůžová)
   Inspirace: waar Wix Studio návrh (teplá zlato-krémová paleta)
   ========================================================= */

:root {
  --paper: #f9f5f2;
  /* krémový papírový podklad */
  --paper-light: #fffdfc;
  --paper-tint: rgba(249, 245, 242, .78);
  /* nadstavba pro snížení intenzity textury */
  --gold: #94404e;
  /* zlato-hořčicová primární */
  --gold-2: #73303c;
  /* tmavší zlatá */
  --gold-3: #8a3a47;
  /* pro text na kremové */
  --gold-band: #f0e5e2;
  /* ribbon/páska */
  --gold-band-2: #e5d5d0;
  --terra: #a86470;
  /* terakota akcent */
  --terra-2: #94404e;
  --brown: #5f5153;
  /* text tmavý */
  --brown-2: #2f2627;
  --ink: #2f2627;
  --white-warm: #ffffff;
  --white: #ffffff;
  --shadow: 0 20px 60px -30px rgba(60, 44, 10, .35);
  --shadow-lg: 0 30px 80px -40px rgba(60, 44, 10, .5);
  --radius: 14px;
}

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0
}

html {
  scroll-behavior: smooth
}

body {
  font-family: 'Cormorant Garamond', 'Cormorant', Georgia, serif;
  color: var(--ink);
  background-color: var(--paper);
  background-image:
    linear-gradient(var(--paper-tint), var(--paper-tint)),
    none;
  background-repeat: no-repeat, no-repeat;
  background-size: cover, cover;
  background-attachment: fixed, fixed;
  background-position: center, center;
  line-height: 1.55;
  font-size: 19px;
  -webkit-font-smoothing: antialiased;
}

img {
  max-width: 100%;
  display: block
}

a {
  color: inherit;
  text-decoration: none
}

h1,
h2,
h3,
h4 {
  font-family: 'Cinzel', 'Cormorant SC', Georgia, serif;
  font-weight: 500;
  color: var(--gold-3);
  letter-spacing: .03em;
  line-height: 1.14;
  text-transform: uppercase;
}

h3,
h4 {
  letter-spacing: .05em
}

p {
  color: var(--brown)
}

.wrap {
  width: min(1240px, 92%);
  margin-inline: auto
}

/* buttons — outline pill s malým terakotovým "chip" */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 1.1rem;
  font-family: 'Cinzel', serif;
  font-size: .95rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  font-weight: 500;
  color: var(--gold-3);
  background: transparent;
  border: 1.4px solid var(--gold);
  border-radius: 999px;
  padding: .8rem 1.1rem .8rem 1.8rem;
  cursor: pointer;
  transition: .25s;
}

.btn .chip {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: var(--terra);
  display: grid;
  place-items: center;
  color: #fff;
  font-size: .78rem;
  box-shadow: 0 4px 12px -4px rgba(199, 99, 56, .5);
}

.btn:hover {
  background: var(--gold);
  color: #fff
}

.btn:hover .chip {
  background: #fff;
  color: var(--terra)
}

.btn-solid {
  background: var(--terra);
  color: #fff;
  border-color: var(--terra)
}

.btn-solid:hover {
  background: var(--terra-2);
  color: #fff
}

.btn-solid .chip {
  background: #fff;
  color: var(--terra)
}

/* dekorativní elementy */
.arrow-bul::before {
  content: "⤳";
  color: var(--terra);
  margin-right: .55rem;
  font-family: serif;
}

.wave-divider {
  width: 100%;
  height: 120px;
  display: block;
  line-height: 0;
}

/* =========================================================
   Top brand bar (tenký proužek nad hlavičkou)
   ========================================================= */
.brand-bar {
  background: transparent;
  padding: .35rem 0;
  font-size: .78rem;
  color: var(--brown-2);
  letter-spacing: .05em;
  text-align: center;
}

/* =========================================================
   Header
   ========================================================= */
header.site {
  position: sticky;
  top: 0;
  z-index: 60;
  background: var(--paper);
  border-bottom: 1px solid rgba(120, 90, 20, .12);
}

.hdr {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: .9rem 0;
}

.brand {
  display: flex;
  align-items: center;
  gap: .9rem;
}

.brand img {
  width: 44px;
  height: auto
}

.brand .name {
  font-family: 'Cinzel', serif;
  font-size: 1.15rem;
  letter-spacing: .16em;
  color: var(--gold-3);
  text-transform: uppercase;
}

nav.menu {
  display: flex;
  gap: 1.7rem;
  align-items: center
}

nav.menu a {
  font-family: 'Cinzel', serif;
  font-size: .82rem;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--gold-3);
  transition: .2s;
  padding: .35rem 0;
  position: relative;
}

nav.menu a:hover,
nav.menu a.active {
  color: var(--terra)
}

.burger {
  display: none;
  font-size: 1.7rem;
  background: none;
  border: 0;
  color: var(--gold-3);
  cursor: pointer
}

/* kontaktní gold band */
.contact-band {
  background: linear-gradient(180deg, var(--gold-band), var(--gold-band-2));
  color: #fdf5db;
  padding: .55rem 0;
  font-size: .95rem;
}

.contact-band .wrap {
  display: flex;
  justify-content: flex-end;
  gap: 1.5rem;
  flex-wrap: wrap;
  font-family: 'Cormorant Garamond', serif;
  letter-spacing: .02em;
}

.contact-band a {
  color: inherit
}

.contact-band a:hover {
  color: #fff
}

.contact-band .a-mark {
  color: #f8dfa9;
  margin-right: .35rem
}

/* =========================================================
   Hero
   ========================================================= */
.hero {
  position: relative;
  z-index: 2;
  min-height: 600px;
  padding: 3.2rem 0 0;
  background:
    linear-gradient(rgba(250, 241, 220, .55), rgba(250, 241, 220, .55)),
    var(--hero-bg, none);
  background-position: center, center;
  background-size: cover, cover;
  overflow: visible;
}

.hero .wrap {
  display: grid;
  grid-template-columns: 1.12fr .88fr;
  gap: 1.4rem;
  align-items: stretch
}

.hero .wrap>div:first-child {
  display: flex;
  flex-direction: column;
  padding-bottom: 9.5rem
}

/* větší hodnota = tlačítka výš do světlého pozadí */
.hero h1 {
  font-size: clamp(2.3rem, 4.55vw, 3.5rem);
  color: var(--gold-3);
  font-weight: 600;
  letter-spacing: .012em;
  line-height: 1.0;
}

.hero .kicker {
  font-family: 'Cormorant Garamond', serif;
  font-style: normal;
  font-weight: 500;
  color: var(--brown);
  font-size: 1.5rem;
  letter-spacing: .02em;
  margin: 1.1rem 0 2rem;
}

.hero-actions {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
  margin-top: auto
}

.hero-illustration {
  display: flex;
  justify-content: center;
  align-items: flex-end;
}

.hero-illustration img {
  max-height: 470px;
  width: auto;
  margin-bottom: -6px;
  /* původní sépiové ladění do zlato-krémové palety */
  filter: grayscale(1) sepia(.85) saturate(1.35) hue-rotate(-8deg) contrast(1.06) brightness(1.03);
  mix-blend-mode: multiply;
  opacity: .5;
}

/* tvar tlačítek v heru podle vzoru — dvojitý zlatý rámeček, jemné zaoblení, terakotová šipka */
.hero-actions .btn {
  border: 3.5px double var(--gold);
  border-radius: 7px;
  padding: .62rem 1.4rem .62rem 1.6rem;
  gap: .7rem;
}

.hero-actions .btn .chip {
  width: auto;
  height: auto;
  background: none;
  border-radius: 0;
  color: var(--terra);
  font-size: 1.15rem;
  line-height: 1;
  box-shadow: none;
  transform: none;
}

.hero-actions .btn:hover {
  background: rgba(177, 138, 30, .10)
}

.hero-actions .btn:hover .chip {
  background: none;
  color: var(--terra-2)
}

/* symetrická vlna — overlay v popředí, svislým středem přesně na dotyku obrázku 2-min a videa podkoží */
.hero-wave {
  position: absolute;
  left: 0;
  right: 0;
  top: 100%;
  /* horní okraj vlny na spodní hraně hera (= horní hrana videa) */
  transform: translateY(-50%);
  /* posun o polovinu výšky → střed vlny přesně na linii dotyku */
  z-index: 6;
  /* v popředí před obrázkem i videem */
  pointer-events: none;
  line-height: 0;
}

.hero-wave img {
  width: 100%;
  display: block;
  max-width: none
}

/* video pruh (podkoží) — přímo navazuje na spodní okraj obrázku 2-min (dotyk) */
.video-band {
  position: relative;
  z-index: 1;
  height: clamp(520px, 52vw, 700px);
  /* vyšší, aby se vešel nápis + otázky */
  margin-top: 0;
  /* video začíná přesně tam, kde končí obrázek 2-min */
  overflow: hidden;
  background: #98831f;
  line-height: 0;
}

.video-band video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  /* z černobílého do světle okrového tónu 2-min.jpg */
  filter: grayscale(1) sepia(1) saturate(1.4) hue-rotate(-4deg) brightness(1.5) contrast(.42);
}

/* jemné okrové sjednocení tónu videa */
.video-band::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background: rgba(151, 126, 28, .62);
  mix-blend-mode: normal;
}

/* nápis nad pozadím podkoží — stejný jako v původním návrhu (Wix) */
.video-caption {
  position: absolute;
  inset: 0;
  z-index: 4;
  /* nad videem i jeho zlatým překryvem */
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1.6rem;
  text-align: center;
  padding: 2rem 1.5rem;
  pointer-events: none;
}

.video-caption h2 {
  margin: 0;
  font-family: 'Cinzel', serif;
  color: #fdf6df;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .06em;
  line-height: 1.28;
  font-size: clamp(1.45rem, 3.3vw, 2.9rem);
  text-shadow: 0 2px 14px rgba(55, 38, 5, .55), 0 1px 3px rgba(55, 38, 5, .5);
}

/* otázky pod nadpisem — přes video podkoží */
.video-caption .vc-qs {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 500;
  font-size: clamp(1.15rem, 1.8vw, 1.6rem);
  line-height: 1.45;
  color: #fdf6df;
  text-shadow: 0 2px 12px rgba(55, 38, 5, .6), 0 1px 2px rgba(55, 38, 5, .5);
  max-width: 56rem;
}

.video-caption .vc-qs p {
  margin: .35rem 0;
  color: #fdf6df;
}

.video-caption .vc-qs p::before {
  content: "⤳ ";
  color: var(--terra);
  font-weight: 700
}

.video-caption .heart-divider {
  margin-top: .4rem
}

/* vlna — ukončení videa dole (stejná jako nahoře), svislým středem na spodní hraně videa */
.section-wave {
  position: relative;
  height: 0;
  line-height: 0;
  z-index: 6;
  pointer-events: none;
}

.section-wave img {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  transform: translateY(-50%);
  /* střed vlny přesně na dotyku videa a další sekce */
  width: 100%;
  display: block;
  max-width: none;
}

/* wave divider (SVG s barvou paper→gold) */
.divider-to-gold {
  height: 120px;
  background: linear-gradient(180deg, var(--paper) 0%, transparent 100%);
  position: relative;
}

/* =========================================================
   Gold band (otázky)
   ========================================================= */
.section-gold {
  background:
    linear-gradient(0deg, rgba(80, 60, 10, .08), rgba(80, 60, 10, .08)),
    linear-gradient(180deg, var(--gold-band), var(--gold-band-2));
  color: #fdf6df;
  padding: 5rem 0 7rem;
  position: relative;
}

.section-gold::before,
.section-gold::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 60px;
  background: radial-gradient(60% 100% at 50% 0%, var(--paper) 0%, transparent 60%);
  background-size: 100% 100%;
}

.section-gold::before {
  top: -1px;
  transform: rotate(180deg)
}

.section-gold::after {
  bottom: -1px
}

.section-gold .qs {
  text-align: center;
  font-family: 'Cormorant Garamond', serif;
  font-weight: 500;
  font-size: 1.7rem;
  line-height: 1.4;
  color: #fdf6df;
}

.section-gold .qs p {
  margin: .5rem 0;
  color: #fdf6df
}

.section-gold .qs p::before {
  content: "⤳ ";
  color: var(--terra);
  font-weight: 700;
}

.heart-divider {
  display: flex;
  justify-content: center;
  margin-top: 2.5rem;
}

.heart-divider .heart {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .15);
  border: 1.5px solid rgba(255, 255, 255, .35);
  display: grid;
  place-items: center;
  color: var(--terra);
  font-size: 1.6rem;
}

/* =========================================================
   PROČ SI VYBRAT NÁS — hero photo section
   ========================================================= */
.why-hero {
  position: relative;
  padding: 8rem 0 4rem;
  min-height: 520px;
  background-position: center;
  background-size: cover;
  background-image:
    linear-gradient(180deg, rgba(160, 120, 20, .6), rgba(140, 105, 15, .5)),
    var(--why-bg, none);
}

.why-hero h2 {
  text-align: center;
  color: #fdf6df;
  font-size: clamp(2rem, 4vw, 3.2rem);
  letter-spacing: .05em;
  margin-bottom: 1.5rem;
}

.why-hero .heart {
  display: block;
  margin: 1rem auto 0;
  color: var(--terra);
  text-align: center;
  font-size: 1.6rem;
}

/* =========================================================
   Karty (proč si vybrat nás)
   ========================================================= */
.why-cards {
  padding: 4rem 0 6rem
}

.why-cards .grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr) 1fr;
  gap: 1.4rem;
}

.why-cards .grid .col-photo {
  grid-column: 4/5;
  grid-row: 1/3;
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: var(--shadow);
}

.why-cards .grid .col-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  min-height: 100%
}

.why-card {
  background: var(--paper-light);
  border: 1px solid rgba(180, 140, 30, .35);
  border-radius: var(--radius);
  padding: 1.6rem 1.4rem 1.8rem;
  min-height: 220px;
  display: flex;
  flex-direction: column;
}

.why-card .ico {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: var(--terra);
  color: #fff;
  display: grid;
  place-items: center;
  font-size: 1.35rem;
  margin-bottom: 1rem;
}

.why-card h3 {
  color: var(--terra-2);
  font-family: 'Cinzel', serif;
  font-size: 1.1rem;
  letter-spacing: .05em;
  margin-bottom: .7rem;
}

.why-card p {
  color: var(--brown);
  font-size: 1rem
}

.why-card .link {
  margin-top: auto;
  color: var(--terra);
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-size: 1.05rem;
}

.why-card .link::after {
  content: " ⤳";
}

/* =========================================================
   Doktor / About tým — hero band
   ========================================================= */
.doctor-band {
  position: relative;
  padding: 5rem 0 4rem;
  background-image:
    linear-gradient(180deg, rgba(160, 120, 20, .5), rgba(140, 105, 15, .45)),
    var(--doc-bg, none);
  background-position: center;
  background-size: cover;
  color: #fdf6df;
}

.doctor-band .inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3rem;
  align-items: center
}

.doctor-band img.portrait {
  width: 280px;
  height: 280px;
  object-fit: cover;
  border-radius: 50%;
  box-shadow: var(--shadow-lg);
  border: 5px solid rgba(255, 255, 255, .35);
  justify-self: end;
}

.doctor-band h3 {
  color: #fdf6df;
  font-size: 1.7rem
}

.doctor-band .role {
  color: #f8dfa9;
  font-style: italic;
  margin: .6rem 0 1.2rem;
  font-family: 'Cormorant Garamond', serif;
}

.doctor-band .btn {
  color: #fdf6df;
  border-color: #fdf6df
}

.doctor-band .btn:hover {
  background: #fdf6df;
  color: var(--gold-3)
}

/* =========================================================
   FAQ + legs image
   ========================================================= */
.faq {
  padding: 5rem 0 5rem
}

.faq .inner {
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 2.5rem;
  align-items: start
}

.faq img {
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  aspect-ratio: 3/4;
  object-fit: cover;
  width: 100%
}

.faq h2 {
  font-size: 2.2rem;
  color: var(--gold-3);
  margin-bottom: 1.4rem;
}

.faq-tabs {
  display: flex;
  gap: 1.4rem;
  flex-wrap: wrap;
  border-bottom: 1.5px solid rgba(180, 140, 30, .35);
  padding-bottom: .6rem;
  margin-bottom: 1.5rem
}

.faq-tabs button {
  font-family: 'Cinzel', serif;
  font-size: .82rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  background: none;
  border: 0;
  color: var(--gold-3);
  cursor: pointer;
  padding: .35rem 0;
  border-bottom: 2px solid transparent;
}

.faq-tabs button.active {
  color: var(--terra);
  border-color: var(--terra)
}

.acc {
  background: var(--gold-band);
  color: #fdf6df;
  border-radius: 6px;
  margin-bottom: .55rem;
  overflow: hidden
}

.acc summary {
  cursor: pointer;
  list-style: none;
  padding: 1rem 1.3rem;
  font-family: 'Cormorant Garamond', serif;
  font-weight: 600;
  font-size: 1.15rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.acc summary::-webkit-details-marker {
  display: none
}

.acc summary::after {
  content: "+";
  font-size: 1.4rem;
  color: #fdf6df;
  transition: .2s
}

.acc[open] summary::after {
  transform: rotate(45deg)
}

.acc .content {
  padding: 0 1.3rem 1.2rem;
  color: #fdf6df;
  font-size: 1.05rem;
  line-height: 1.65
}

.acc.static {
  background: var(--paper-light);
  color: var(--brown)
}

.acc.static summary,
.acc.static .content {
  color: var(--brown)
}

.acc.static summary::after {
  color: var(--terra)
}

/* =========================================================
   Testimonials — gold ribbon
   ========================================================= */
.tests {
  background:
    radial-gradient(1200px 200px at 50% 0%, var(--paper) 0%, transparent 60%),
    linear-gradient(180deg, var(--gold-band), var(--gold-band-2));
  color: #fdf6df;
  padding: 6rem 0;
  position: relative;
}

.tests .head {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 2rem;
  flex-wrap: wrap;
  margin-bottom: 2rem;
}

.tests .who {
  display: flex;
  align-items: center;
  gap: .7rem;
  font-family: 'Cormorant Garamond', serif
}

.tests .who .avatar {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .15);
  border: 1px solid rgba(255, 255, 255, .3);
  display: grid;
  place-items: center;
  color: #fdf6df;
  font-size: .9rem;
}

.tests .quote {
  max-width: 52rem;
  margin: 0 auto;
  text-align: center;
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-size: 1.35rem;
  line-height: 1.6;
  color: #fdf6df;
}

.tests .nav {
  display: flex;
  justify-content: center;
  gap: 1rem;
  margin-top: 2rem;
}

.tests .nav button {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .1);
  color: #fdf6df;
  border: 1px solid rgba(255, 255, 255, .35);
  cursor: pointer;
  font-size: 1rem;
}

.tests .nav button:hover {
  background: rgba(255, 255, 255, .25)
}

/* =========================================================
   Kontaktní formulář
   ========================================================= */
.contact {
  padding: 5rem 0 6rem
}

.contact .card {
  background: var(--paper-light);
  border: 1px solid rgba(180, 140, 30, .35);
  border-radius: var(--radius);
  overflow: hidden;
  display: grid;
  grid-template-columns: .9fr 1.1fr;
}

.contact .visual {
  background: var(--photo, none) center/cover no-repeat;
  min-height: 520px;
}

.contact .side {
  padding: 2.4rem 2.2rem
}

.contact h4.line {
  color: var(--terra);
  text-transform: uppercase;
  font-family: 'Cinzel', serif;
  font-size: 1.02rem;
  letter-spacing: .12em;
  margin-bottom: .4rem;
}

.contact p.sub {
  color: var(--brown);
  margin-bottom: 1.4rem;
  font-size: 1.05rem
}

.contact .grid2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem
}

.contact label {
  display: block;
  color: var(--gold-3);
  font-family: 'Cinzel', serif;
  font-size: .72rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  margin-bottom: .25rem;
  padding-top: .6rem
}

.contact input,
.contact textarea {
  width: 100%;
  padding: .65rem 0;
  border: 0;
  border-bottom: 1.2px solid var(--gold);
  background: transparent;
  font: inherit;
  font-family: 'Cormorant Garamond', serif;
  color: var(--brown);
}

.contact input:focus,
.contact textarea:focus {
  outline: 0;
  border-color: var(--terra)
}

.contact .gdpr {
  margin-top: 1.2rem;
  display: flex;
  gap: .6rem;
  align-items: flex-start;
  font-size: .95rem;
  color: var(--brown)
}

.contact .gdpr input {
  width: auto
}

.contact .submit {
  margin-top: 1.4rem
}

/* =========================================================
   Footer
   ========================================================= */
footer.site {
  background:
    linear-gradient(0deg, rgba(80, 60, 10, .08), rgba(80, 60, 10, .08)),
    linear-gradient(180deg, var(--gold-band), var(--gold-band-2));
  color: #fdf6df;
  padding: 4.5rem 0 1.5rem;
  border-radius: 22px 22px 0 0;
  margin-top: 2rem;
}

footer.site .foot {
  display: grid;
  grid-template-columns: 1.3fr .8fr .8fr .6fr 1.1fr;
  gap: 2rem
}

footer.site h4 {
  color: #fdf6df;
  font-family: 'Cinzel', serif;
  font-size: 1rem;
  letter-spacing: .1em;
  margin-bottom: 1rem
}

footer.site a,
footer.site p {
  color: #fdf6df;
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.02rem
}

footer.site a {
  display: block;
  padding: .15rem 0
}

footer.site a:hover {
  color: #fff
}

footer.site .brand-foot {
  display: flex;
  align-items: center;
  gap: .9rem;
  margin-bottom: 1.5rem
}

footer.site .brand-foot img {
  width: 42px
}

footer.site .brand-foot .name {
  font-family: 'Cinzel', serif;
  letter-spacing: .15em;
  font-size: 1.05rem;
  color: #fdf6df;
  text-transform: uppercase
}

footer.site .icon-line {
  display: flex;
  gap: .9rem;
  align-items: center;
  font-size: .98rem;
  margin-bottom: .5rem
}

footer.site .icon-line .i {
  width: 26px;
  text-align: center;
  color: #f8dfa9
}

footer.site .socials {
  display: flex;
  gap: .7rem
}

footer.site .socials a {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: 1.2px solid rgba(255, 255, 255, .4);
  display: grid;
  place-items: center;
  padding: 0;
}

footer.site .socials a:hover {
  background: rgba(255, 255, 255, .15)
}

footer.site .foot-bot {
  border-top: 1px solid rgba(255, 255, 255, .2);
  margin-top: 2rem;
  padding-top: 1.2rem;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 1rem;
  font-size: .88rem;
  color: #f5e6b8;
}

/* =========================================================
   Fixed side buttons (top, chat)
   ========================================================= */
.side-btn {
  position: fixed;
  right: 22px;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: var(--paper-light);
  border: 1.5px solid var(--terra);
  color: var(--terra);
  display: grid;
  place-items: center;
  font-size: 1.2rem;
  cursor: pointer;
  box-shadow: 0 12px 32px -14px rgba(120, 90, 10, .5);
  z-index: 70;
}

.side-btn.top {
  bottom: 100px
}

.side-btn.chat {
  bottom: 34px;
  background: var(--terra);
  color: #fff
}

/* =========================================================
   Page hero (pro podstránky)
   ========================================================= */
.page-hero {
  padding: 5rem 0 4rem;
  text-align: center;
}

.page-hero h1 {
  font-size: clamp(2.3rem, 4.5vw, 3.4rem);
  color: var(--gold-3);
  letter-spacing: .06em;
}

.page-hero .sub {
  color: var(--brown);
  font-style: italic;
  font-size: 1.2rem;
  margin-top: .6rem;
}

/* =========================================================
   Trust bar (pojišťovny + kredity)
   ========================================================= */
.trust-bar {
  padding: 2.8rem 0 6rem;
  background: var(--paper-light);
  border-top: 1px solid rgba(180, 140, 30, .15);
  border-bottom: 1px solid rgba(180, 140, 30, .15)
}

.trust-bar .cols {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2.5rem;
  align-items: center
}

.trust-bar h4 {
  color: var(--gold-3);
  font-size: .75rem;
  letter-spacing: .14em;
  text-align: center;
  margin-bottom: 1rem;
  font-family: 'Cinzel', serif;
  text-transform: uppercase
}

.trust-row {
  display: flex;
  flex-wrap: wrap;
  gap: .7rem;
  justify-content: center
}

.trust-badge {
  background: #fff;
  border: 1px solid rgba(180, 140, 30, .3);
  border-radius: 8px;
  padding: .6rem 1rem;
  text-align: center;
  min-width: 82px;
  box-shadow: 0 4px 12px -6px rgba(60, 44, 10, .15)
}

.trust-badge b {
  display: block;
  font-family: 'Cinzel', serif;
  color: var(--gold-3);
  font-size: .9rem;
  letter-spacing: .06em
}

.trust-badge span {
  display: block;
  font-family: 'Cormorant Garamond', serif;
  color: var(--brown);
  font-size: .7rem;
  margin-top: .15rem;
  letter-spacing: .05em
}

.trust-badge.cred {
  background: var(--gold-band);
  color: #fdf6df;
  border-color: var(--gold-band-2)
}

.trust-badge.cred b {
  color: #fdf6df
}

.trust-badge.cred span {
  color: #fdf6df;
  opacity: .85
}

@media(max-width:820px) {
  .trust-bar .cols {
    grid-template-columns: 1fr
  }
}

/* =========================================================
   Screening kvíz
   ========================================================= */
.quiz-wrap {
  padding: 4rem 0;
  background: transparent
}

.quiz-lead {
  text-align: center;
  max-width: 44rem;
  margin: 0 auto 1.6rem
}

.quiz-lead h2 {
  color: var(--gold-3);
  font-size: 1.9rem;
  letter-spacing: .04em;
  margin-bottom: .4rem
}

.quiz-lead p {
  color: var(--brown);
  font-style: italic;
  font-size: 1.05rem
}

.quiz {
  max-width: 640px;
  margin: 0 auto;
  background: var(--paper-light);
  border: 1px solid rgba(180, 140, 30, .35);
  border-radius: var(--radius);
  padding: 2.2rem 2rem;
  box-shadow: var(--shadow)
}

.quiz .progress {
  height: 6px;
  background: rgba(180, 140, 30, .2);
  border-radius: 999px;
  margin-bottom: 1.6rem;
  overflow: hidden
}

.quiz .progress .bar {
  height: 100%;
  background: var(--terra);
  transition: .35s;
  width: 20%
}

.quiz .q-num {
  font-family: 'Cinzel', serif;
  font-size: .78rem;
  color: var(--terra);
  letter-spacing: .15em;
  text-align: center;
  text-transform: uppercase;
  margin-bottom: .6rem
}

.quiz .q-text {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.35rem;
  color: var(--brown);
  text-align: center;
  line-height: 1.35;
  margin-bottom: 1.8rem;
  min-height: 3.6em
}

.quiz .q-opts {
  display: flex;
  gap: 1rem;
  justify-content: center
}

.quiz .q-opts button {
  flex: 1;
  max-width: 180px;
  padding: .85rem 1rem;
  border-radius: 999px;
  border: 1.4px solid var(--gold);
  background: transparent;
  color: var(--gold-3);
  font-family: 'Cinzel', serif;
  text-transform: uppercase;
  font-size: .85rem;
  letter-spacing: .14em;
  cursor: pointer;
  transition: .2s
}

.quiz .q-opts button:hover {
  background: var(--gold);
  color: #fff
}

.quiz .q-opts .yes:hover {
  background: var(--terra);
  border-color: var(--terra);
  color: #fff
}

.quiz .result {
  text-align: center;
  display: none;
  padding: .5rem 0
}

.quiz .result.show {
  display: block
}

.quiz .result .score {
  font-family: 'Cinzel', serif;
  color: var(--terra);
  font-size: .85rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  margin-bottom: .8rem
}

.quiz .result h3 {
  color: var(--gold-3);
  font-size: 1.5rem;
  margin-bottom: .6rem;
  text-transform: none;
  letter-spacing: .02em
}

.quiz .result p {
  color: var(--brown);
  font-size: 1.05rem;
  margin-bottom: 1.5rem;
  line-height: 1.5
}

.quiz .result .btn {
  margin: .4rem
}

/* =========================================================
   Patient journey — Co Vás čeká
   ========================================================= */
.journey {
  padding: 4.5rem 0
}

.journey-head {
  text-align: center;
  max-width: 44rem;
  margin: 0 auto 3rem
}

.journey-head h2 {
  color: var(--gold-3);
  font-size: 2rem;
  letter-spacing: .04em;
  margin-bottom: .5rem
}

.journey-head p {
  color: var(--brown);
  font-style: italic;
  font-size: 1.1rem
}

.journey-timeline {
  position: relative;
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: .8rem
}

.journey-timeline::before {
  content: "";
  position: absolute;
  top: 28px;
  left: 8%;
  right: 8%;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--gold-band), transparent);
  z-index: 1
}

.j-step {
  text-align: center;
  padding: 0 .4rem;
  position: relative;
  z-index: 2
}

.j-step .n {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: var(--terra);
  color: #fff;
  display: grid;
  place-items: center;
  font-family: 'Cinzel', serif;
  font-size: 1.15rem;
  margin: 0 auto 1rem;
  box-shadow: 0 8px 20px -8px rgba(199, 99, 56, .5);
  border: 3px solid var(--paper)
}

.j-step h3 {
  color: var(--gold-3);
  font-size: .85rem;
  letter-spacing: .06em;
  margin-bottom: .4rem
}

.j-step p {
  color: var(--brown);
  font-size: .9rem;
  line-height: 1.4
}

@media(max-width:820px) {
  .journey-timeline {
    grid-template-columns: 1fr 1fr;
    row-gap: 1.6rem
  }

  .journey-timeline::before {
    display: none
  }
}

/* =========================================================
   Google recenze widget
   ========================================================= */
.g-reviews {
  padding: 4.5rem 0
}

.g-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 1rem;
  margin-bottom: 2rem
}

.g-badge {
  display: flex;
  gap: 1rem;
  align-items: center
}

.g-logo {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: #fff;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  place-items: center;
  font-family: Arial, sans-serif;
  font-weight: 800;
  box-shadow: 0 4px 12px -6px rgba(0, 0, 0, .25);
  overflow: hidden
}

.g-logo span {
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
  font-size: .85rem
}

.g-logo span:nth-child(1) {
  color: #4285F4
}

.g-logo span:nth-child(2) {
  color: #EA4335
}

.g-logo span:nth-child(3) {
  color: #FBBC05
}

.g-logo span:nth-child(4) {
  color: #34A853
}

.g-meta b {
  display: block;
  font-family: 'Cinzel', serif;
  color: var(--gold-3);
  font-size: .9rem;
  letter-spacing: .06em
}

.g-meta .g-stars {
  color: #F5B300;
  letter-spacing: .15em;
  font-size: 1rem;
  margin-top: .15rem
}

.g-meta .g-stars b {
  display: inline;
  color: var(--brown);
  font-family: 'Cormorant Garamond', serif;
  font-size: .95rem;
  letter-spacing: .02em;
  margin-left: .4rem
}

.g-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.3rem
}

.g-card {
  background: var(--paper-light);
  border: 1px solid rgba(180, 140, 30, .3);
  border-radius: var(--radius);
  padding: 1.4rem;
  box-shadow: var(--shadow)
}

.g-card .r-head {
  display: flex;
  gap: .8rem;
  align-items: center;
  margin-bottom: .7rem
}

.g-card .r-avatar {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--terra);
  color: #fff;
  font-family: 'Cinzel', serif;
  display: grid;
  place-items: center;
  flex: none
}

.g-card .r-avatar.blue {
  background: #4285F4
}

.g-card .r-avatar.green {
  background: #34A853
}

.g-card .r-name b {
  display: block;
  font-family: 'Cinzel', serif;
  color: var(--gold-3);
  font-size: .88rem;
  letter-spacing: .05em
}

.g-card .r-name small {
  color: #888;
  font-size: .78rem;
  font-family: 'Cormorant Garamond', serif
}

.g-card .r-stars {
  color: #F5B300;
  letter-spacing: .1em;
  font-size: .95rem;
  margin-bottom: .55rem
}

.g-card .r-body {
  font-family: 'Cormorant Garamond', serif;
  color: var(--brown);
  font-size: 1rem;
  line-height: 1.55
}

.g-card .r-verified {
  margin-top: .85rem;
  font-size: .72rem;
  color: #666;
  display: flex;
  align-items: center;
  gap: .4rem;
  font-family: 'Cormorant Garamond', serif
}

.g-card .r-verified::before {
  content: "✓";
  color: #4285F4;
  font-weight: 700
}

.g-cta {
  text-align: center;
  margin-top: 2.2rem
}

@media(max-width:900px) {
  .g-cards {
    grid-template-columns: 1fr
  }
}

/* =========================================================
   Video card (placeholder)
   ========================================================= */
.video-card {
  background: linear-gradient(135deg, var(--paper-light), var(--paper));
  border: 2px dashed rgba(180, 140, 30, .5);
  border-radius: var(--radius);
  padding: 3.4rem 2rem;
  text-align: center;
  margin: 2rem 0
}

.video-card .play {
  width: 88px;
  height: 88px;
  border-radius: 50%;
  background: var(--terra);
  color: #fff;
  display: grid;
  place-items: center;
  font-size: 2rem;
  margin: 0 auto 1.3rem;
  box-shadow: 0 12px 30px -8px rgba(199, 99, 56, .55);
  cursor: pointer;
  transition: .25s
}

.video-card .play:hover {
  transform: scale(1.05)
}

.video-card h3 {
  color: var(--gold-3);
  font-size: 1.4rem;
  letter-spacing: .05em;
  margin-bottom: .6rem
}

.video-card p {
  color: var(--brown);
  font-size: 1.05rem;
  margin: 0 auto 1rem;
  max-width: 44rem
}

.video-card small {
  color: #888;
  font-family: 'Cormorant Garamond', serif;
  font-style: italic
}

.video-embed {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  margin: 2rem 0
}

.video-embed iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0
}

/* =========================================================
   Před/Po galerie
   ========================================================= */
.ba-notice {
  background: var(--paper-light);
  border: 1px dashed rgba(180, 140, 30, .5);
  border-radius: var(--radius);
  padding: 1.4rem 1.6rem;
  color: var(--brown);
  font-family: 'Cormorant Garamond', serif;
  font-size: 1rem;
  text-align: center;
  margin: 1.5rem auto;
  max-width: 640px
}

.ba-notice b {
  color: var(--terra);
  font-family: 'Cinzel', serif;
  font-size: .78rem;
  letter-spacing: .14em;
  display: block;
  text-transform: uppercase;
  margin-bottom: .4rem
}

.ba-hidden {
  display: none
}

.ba-hidden.show {
  display: block
}

.ba-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.5rem;
  padding: 1rem 0
}

.ba-item {
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: var(--shadow);
  background: var(--paper-light);
  border: 1px solid rgba(180, 140, 30, .3)
}

.ba-photos {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-bottom: 1px solid rgba(180, 140, 30, .25)
}

.ba-photos .ph {
  aspect-ratio: 3/4;
  display: grid;
  place-items: center;
  color: var(--gold-3);
  font-family: 'Cinzel', serif;
  letter-spacing: .14em;
  font-size: .78rem;
  position: relative;
  background: repeating-linear-gradient(135deg, rgba(180, 140, 30, .08), rgba(180, 140, 30, .08) 12px, rgba(180, 140, 30, .14) 12px, rgba(180, 140, 30, .14) 24px)
}

.ba-photos .ph.after {
  background: repeating-linear-gradient(135deg, rgba(199, 99, 56, .08), rgba(199, 99, 56, .08) 12px, rgba(199, 99, 56, .14) 12px, rgba(199, 99, 56, .14) 24px);
  color: var(--terra)
}

.ba-item .cap {
  padding: 1rem 1.2rem
}

.ba-item .cap h4 {
  color: var(--gold-3);
  font-size: .9rem;
  letter-spacing: .05em
}

.ba-item .cap p {
  color: var(--brown);
  font-size: .95rem;
  margin-top: .3rem
}

@media(max-width:720px) {
  .ba-grid {
    grid-template-columns: 1fr
  }
}

/* =========================================================
   Sticky mobile CTA bar (spodní pruh na mobilu)
   ========================================================= */
.mobile-cta {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 80;
  display: none;
  background: linear-gradient(180deg, rgba(244, 236, 208, .97), var(--paper) 60%);
  border-top: 1px solid rgba(180, 140, 30, .35);
  box-shadow: 0 -14px 40px -18px rgba(60, 44, 10, .35);
  padding: .55rem .8rem calc(.55rem + env(safe-area-inset-bottom, 0));
  gap: .6rem;
}

.mobile-cta a {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  font-family: 'Cinzel', serif;
  font-size: .85rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  padding: .75rem .8rem;
  border-radius: 999px;
  text-align: center;
}

.mobile-cta a.call {
  background: transparent;
  border: 1.4px solid var(--gold);
  color: var(--gold-3)
}

.mobile-cta a.book {
  background: var(--terra);
  color: #fff;
  border: 1.4px solid var(--terra)
}

.mobile-cta a.call::before {
  content: "✆";
  font-size: 1.1rem
}

.mobile-cta a.book::before {
  content: "→";
  font-family: serif
}

/* =========================================================
   Cookie / GDPR banner
   ========================================================= */
.cookie-bar {
  position: fixed;
  left: 20px;
  right: 20px;
  bottom: 20px;
  max-width: 520px;
  margin-left: auto;
  z-index: 90;
  background: var(--paper-light);
  border: 1px solid rgba(180, 140, 30, .4);
  border-radius: var(--radius);
  box-shadow: var(--shadow-lg);
  padding: 1.2rem 1.4rem;
  display: none;
  font-family: 'Cormorant Garamond', serif;
  color: var(--brown);
  font-size: 1rem;
  line-height: 1.5;
}

.cookie-bar.show {
  display: block
}

.cookie-bar h4 {
  font-family: 'Cinzel', serif;
  color: var(--gold-3);
  font-size: .85rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  margin-bottom: .4rem;
}

.cookie-bar p {
  color: var(--brown);
  margin-bottom: .9rem;
  font-size: .96rem
}

.cookie-bar p a {
  color: var(--terra);
  text-decoration: underline
}

.cookie-bar .actions {
  display: flex;
  gap: .6rem;
  flex-wrap: wrap
}

.cookie-bar button {
  flex: 1;
  min-width: 120px;
  font-family: 'Cinzel', serif;
  font-size: .78rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  padding: .6rem .9rem;
  border-radius: 999px;
  cursor: pointer;
  transition: .2s;
}

.cookie-bar .accept {
  background: var(--terra);
  color: #fff;
  border: 1.4px solid var(--terra)
}

.cookie-bar .accept:hover {
  filter: brightness(.96)
}

.cookie-bar .decline {
  background: transparent;
  color: var(--gold-3);
  border: 1.4px solid var(--gold)
}

.cookie-bar .decline:hover {
  background: var(--paper)
}

/* =========================================================
   Responsive
   ========================================================= */
@media (max-width:1000px) {
  .why-cards .grid {
    grid-template-columns: repeat(2, 1fr)
  }

  .why-cards .grid .col-photo {
    grid-column: auto;
    grid-row: auto;
    min-height: 280px
  }

  .contact .card {
    grid-template-columns: 1fr
  }

  .contact .visual {
    min-height: 260px
  }

  .doctor-band .inner {
    grid-template-columns: 1fr;
    text-align: center
  }

  .doctor-band img.portrait {
    justify-self: center
  }

  .faq .inner {
    grid-template-columns: 1fr
  }

  .faq img {
    max-width: 420px;
    margin-inline: auto
  }

  footer.site .foot {
    grid-template-columns: 1fr 1fr
  }
}

@media (max-width:720px) {
  body {
    font-size: 16px;
    padding-bottom: 78px
  }

  nav.menu {
    display: none
  }

  .burger {
    display: block
  }

  .hero .wrap {
    grid-template-columns: 1fr
  }

  .hero-illustration {
    order: -1
  }

  .hero-illustration img {
    max-height: 340px
  }

  .contact-band .wrap {
    justify-content: center;
    gap: .6rem
  }

  .why-cards .grid {
    grid-template-columns: 1fr
  }

  footer.site .foot {
    grid-template-columns: 1fr
  }

  .mobile-cta {
    display: flex
  }

  .side-btn {
    display: none
  }

  .cookie-bar {
    left: 12px;
    right: 12px;
    bottom: 82px;
    padding: 1rem 1.1rem
  }
}
/* =========================================================
   Scroll-reveal animace (ve stylu Wixu) — třídy přidává site.js,
   takže bez JS zůstává obsah plně viditelný.
   ========================================================= */
.reveal{
  opacity:0;
  transform:translateY(26px);
  transition:opacity .7s ease, transform .75s cubic-bezier(.22,.61,.36,1);
  will-change:opacity, transform;
}
.reveal.in{ opacity:1; transform:none; }
.reveal-left{ transform:translateX(-30px); }
.reveal-right{ transform:translateX(30px); }
.reveal-zoom{ transform:scale(.94); }
.reveal-left.in, .reveal-right.in, .reveal-zoom.in{ transform:none; }

/* jemné hover efekty (ve stylu Wixu) */
.why-card, .trust-badge, .g-card{ transition:transform .25s ease, box-shadow .25s ease; }
.why-card:hover{ transform:translateY(-6px); box-shadow:var(--shadow-lg); }
.g-card:hover{ transform:translateY(-5px); box-shadow:var(--shadow-lg); }
.trust-badge:hover{ transform:translateY(-3px); }

/* šipka dolů — scrollovací vodítko mezi sekcemi (jako na Wixu) */
.scroll-cue{
  display:flex; justify-content:center; margin:1.6rem 0 .2rem;
}
.scroll-cue span{
  width:52px; height:52px; border-radius:50%;
  border:1.5px solid rgba(199,99,56,.55);
  display:grid; place-items:center; color:var(--terra);
  font-size:1.3rem; line-height:1;
  animation:cueBob 1.8s ease-in-out infinite;
}
@keyframes cueBob{ 0%,100%{ transform:translateY(0) } 50%{ transform:translateY(7px) } }

@media (prefers-reduced-motion: reduce){
  .reveal, .reveal-left, .reveal-right, .reveal-zoom{
    opacity:1 !important; transform:none !important; transition:none !important;
  }
  .scroll-cue span{ animation:none; }
}

/* výraznější načítací animace hera — nadpis a ilustrace ženy (ve stylu Wixu) */
.hero h1.reveal{ transform:translateY(48px); transition-duration:1s; }
.hero .kicker.reveal{ transition-duration:.9s; }
.hero .hero-illustration.reveal.reveal-right{ transform:translateX(50px) scale(1.05); transition-duration:1.15s; }
.hero .hero-illustration.reveal.reveal-right.in{ transform:none; }

/* === načítací animace hera přesně podle Wixu (přepis dřívějšího) ===
   nadpis přijede ZLEVA, ilustrace ženy se odkryje OD STŘEDU kruhově (jako kolo) */
.hero h1.reveal.reveal-left{ transform:translateX(-72px); transition-duration:1s; }
.hero h1.reveal.reveal-left.in{ transform:none; }
.hero-illustration img.reveal.reveal-wheel{
  transform:none;
  clip-path:circle(0% at 50% 50%);
  transition:clip-path 1.25s cubic-bezier(.3,.7,.3,1), opacity .9s ease;
}
.hero-illustration img.reveal.reveal-wheel.in{ transform:none; clip-path:circle(80% at 50% 50%); }

/* === FINÁLNÍ hero animace (přepisuje předchozí bloky) — přesně dle Wixu ===
   nadpis, podtitul i tlačítka se jen PROLNOU na místě (žádný pohyb),
   ilustrace ženy se odkryje kruhově od středu (o ~10 % pomaleji),
   tlačítka po naskočení trvale pomalu plují nahoru/dolů. */
.hero h1.reveal.reveal-fade,
.hero .kicker.reveal.reveal-fade,
.hero-actions.reveal.reveal-fade{
  transform:none !important;
  transition:opacity .9s ease !important;
}
.hero h1.reveal.reveal-fade.in,
.hero .kicker.reveal.reveal-fade.in,
.hero-actions.reveal.reveal-fade.in{ transform:none !important; opacity:1; }

.hero-illustration img.reveal.reveal-wheel{
  transform:none;
  clip-path:circle(0% at 50% 50%);
  transition:clip-path 1.4s cubic-bezier(.3,.7,.3,1), opacity 1s ease;
}
.hero-illustration img.reveal.reveal-wheel.in{ transform:none; clip-path:circle(80% at 50% 50%); }

/* trvalé jemné plování tlačítek (spustí se po naskočení hera) */
.hero-actions.reveal.reveal-fade.in .btn{ animation:btnFloat 3.6s ease-in-out 1.9s infinite; }
.hero-actions.reveal.reveal-fade.in .btn:nth-child(2){ animation-delay:2.4s; }
@keyframes btnFloat{ 0%,100%{ transform:translateY(0) } 50%{ transform:translateY(-9px) } }
@media (prefers-reduced-motion: reduce){ .hero-actions .btn{ animation:none !important; } }

/* zachovat vámi nastavenou průhlednost ženy (.5) i během kruhového odkrytí — animuje se jen clip */
.hero-illustration img.reveal.reveal-wheel,
.hero-illustration img.reveal.reveal-wheel.in{ opacity:.5; }

/* === nadpis se ODHALÍ ZLEVA (setře se zleva doprava, stojí na místě) === */
.hero h1.reveal.reveal-wipe{
  opacity:1 !important;
  transform:none !important;
  clip-path:inset(0 100% 0 0);
  transition:clip-path 1.05s cubic-bezier(.4,0,.2,1) !important;
}
.hero h1.reveal.reveal-wipe.in{ opacity:1 !important; transform:none !important; clip-path:inset(0 0 0 0); }


/* =========================================================
   OPTIMAL_3_B4.2 — starorůžová paleta (světlé pásy)
   Přebarvení: zlaté pásy → pudrově růžové, text na nich tmavý.
   ========================================================= */
.contact-band { color: #5f5153; border-bottom: 1px solid #e4d6d2 }
.contact-band a { color: #5f5153 }
.contact-band a:hover { color: #94404e }
.contact-band .a-mark { color: #a86470 }

.section-gold, .section-gold .qs, .section-gold .qs p { color: #2f2627 }
.heart-divider .heart { background: rgba(148, 64, 78, .06); border-color: #e4d6d2 }

.why-hero { background-image: linear-gradient(180deg, rgba(249, 245, 242, .86) 0%, rgba(249, 245, 242, .5) 40%, rgba(249, 245, 242, .18) 100%), var(--why-bg, none) }
.why-hero h2 { color: #2f2627; text-shadow: none }

.why-card .ico { background: #f6e9ea; color: #94404e; box-shadow: inset 0 0 0 1px #ecd3d7 }
.why-card h3 { color: #2f2627 }

.trust-badge.cred { background: #fffdfc; color: #2f2627; border-color: #e4d6d2 }
.trust-badge.cred b { color: #2f2627 }
.trust-badge.cred span { color: #8b7d7f }

.doctor-band { background-image: linear-gradient(180deg, rgba(240, 229, 226, .9), rgba(229, 213, 208, .74)), var(--doc-bg, none); color: #5f5153 }
.doctor-band h3 { color: #2f2627 }
.doctor-band .role { color: #8a3a47 }
.doctor-band p { color: #5f5153 !important }
.doctor-band .btn { color: #8a3a47; border-color: #94404e }
.doctor-band .btn:hover { background: #94404e; color: #fff }
.doctor-band .portrait { border-color: #fffdfc }

.journey-timeline::before { background: linear-gradient(90deg, transparent, #e0cfcb, transparent) }
.journey .j-step .n { background: #fffdfc; color: #94404e; border: 1.5px solid #94404e; box-shadow: 0 0 0 6px #f9f5f2 }
.journey .j-step h3 { color: #2f2627 }

.acc { background: #f0e5e2; color: #2f2627; border: 1px solid #e4d6d2 }
.acc summary { color: #2f2627 }
.acc summary::after { color: #94404e }
.acc .content { color: #5f5153 }
.acc[open] { background: #fffdfc; border-color: #94404e }

.tests { color: #2f2627 }
.tests .quote, .tests .who, .tests .who b { color: #2f2627 }
.tests .who .avatar { background: #f6e9ea; border-color: #ecd3d7; color: #94404e }
.tests .nav button { background: #fffdfc; color: #94404e; border-color: #e4d6d2 }
.tests .nav button:hover { background: #f6e9ea }

footer.site { color: #5f5153; border-top: 1px solid #e4d6d2 }
footer.site h4 { color: #8a3a47 }
footer.site a, footer.site p, footer.site div, footer.site label, footer.site input { color: #5f5153 }
footer.site a:hover { color: #94404e }
footer.site .brand-foot .name { color: #2f2627 }
footer.site .icon-line .i { color: #a86470 }
footer.site .socials a { border-color: #cfbab5; color: #94404e }
footer.site .socials a:hover { background: rgba(148, 64, 78, .1) }
footer.site .foot-bot { border-top-color: #e0cfcb }
footer.site input { border-bottom-color: #cfbab5 !important; color: #2f2627 !important }
footer.site .btn { color: #8a3a47 !important; border-color: #94404e !important }

.side-btn { background: #94404e; color: #fff }

/* video pruh v B4.2 — světlý pudrový závoj místo zlatého */
.video-band { background: #f0e5e2 }
.video-band::after { background: linear-gradient(180deg, rgba(240, 229, 226, .86), rgba(240, 229, 226, .72)) }
.video-band video { filter: grayscale(.85) contrast(.95) opacity(.65) }
.video-caption h2 { color: #2f2627; text-shadow: none }
.video-caption .vc-qs, .video-caption .vc-qs p { color: #5f5153; text-shadow: none }
.video-caption .vc-qs p::before, .video-caption .heart-divider .heart { color: #a86470 }
.video-caption .heart-divider .heart { background: rgba(255, 255, 255, .55); border-color: #e0cfcb }
footer.site form label, footer.site form label a { color: #5f5153 !important }
footer.site form label a { text-decoration: underline }

/* vlny nesmí překrývat obsah pod sebou */
.section-wave { position: relative; z-index: 0; line-height: 0 }
.section-wave img { display: block; width: 100% }
.hero-wave { z-index: 3 }
.trust-bar { position: relative; z-index: 2; background: var(--paper) }
.doctor-band .portrait { object-fit: cover }

.why-hero h2 { text-shadow: 0 1px 10px rgba(249, 245, 242, .9) }
.doctor-band .inner > div { text-shadow: 0 1px 8px rgba(249, 245, 242, .55) }

/* papírová textura z Wixu nahrazena čistým podkladem */
body { background-image: none !important; background-color: var(--paper) !important }

/* hero — světlý závoj zleva, aby byl nadpis čitelný přes fotku */
.hero { background: linear-gradient(90deg, rgba(249, 245, 242, .96) 0%, rgba(249, 245, 242, .86) 40%, rgba(249, 245, 242, .55) 100%), var(--hero-bg, none) }
.hero h1 { text-shadow: 0 1px 10px rgba(249, 245, 242, .85) }
.hero-illustration img { border-radius: 14px; box-shadow: 0 24px 60px -36px rgba(47, 38, 39, .5) }