/* ============================================================
   FORMOVNA — styles.css
   Barvy a písma vycházejí z brand manuálu Formovny.
   ============================================================ */

:root{
  /* ============================================================
     ZÁVAZNÁ PALETA — Formovna brand styleguide (str. 10)
     Jiné barvy se na webu nepoužívají.
     ============================================================ */
  --color-brand-1: #d9d3a4;
  --color-brand-2: #d3baaa;
  --color-brand-3: #e9dfd0;
  --color-brand-4: #fefaf2;
  --color-brand-5: #f6f5ee;
  --color-brand-6: #ebe7cb;

  --color-black: #11110f;   /* text, linky, primární CTA */
  --color-white: #ffffff;

  /* --- významové role --- */
  --color-bg-primary:   var(--color-brand-4);
  --color-bg-secondary: var(--color-brand-5);
  --color-bg-accent:    var(--color-brand-1);
  --color-bg-soft:      var(--color-brand-3);
  --color-bg-warm:      var(--color-brand-2);
  --color-bg-light:     var(--color-brand-6);

  --color-text-primary:   var(--color-black);
  --color-text-secondary: rgba(17, 17, 15, 0.64);
  --color-text-muted:     rgba(17, 17, 15, 0.62);
  --color-text-invert:    var(--color-brand-4);

  --color-line:      rgba(17, 17, 15, 0.16);
  --color-line-soft: rgba(17, 17, 15, 0.08);

  /* --- typografie (styleguide str. 19) --- */
  --font-display: "Open Sans", Arial, Helvetica, sans-serif;   /* nadpisy: Light 300 */
  --font-label:   "Open Sans", Arial, Helvetica, sans-serif;   /* popisky a tlačítka: Semibold 600 */
  --font-body:    "Open Sans", Arial, Helvetica, sans-serif;   /* text: Light 300 / Regular 400 */

  --wrap: 1220px;
  --gutter: clamp(20px, 4vw, 40px);
  --sec-pad: clamp(68px, 8.5vw, 132px);
  --ease: cubic-bezier(.22,.61,.36,1);
}

/* ============================================================
   OPEN SANS — jediné písmo webu, načítané lokálně z assets/fonts/.
   Žádné externí načítání (Google Fonts) se nepoužívá.
   Hierarchii dělá velikost, váha, kurzíva a prostrkání, ne další font.
   ============================================================ */
@font-face{
  font-family:"Open Sans";
  src:url("assets/fonts/open-sans.light.woff2") format("woff2"),
      url("assets/fonts/open-sans.light.ttf") format("truetype");
  font-style:normal; font-weight:300; font-display:swap;
}
@font-face{
  font-family:"Open Sans";
  src:url("assets/fonts/open-sans.light-italic.woff2") format("woff2"),
      url("assets/fonts/open-sans.light-italic.ttf") format("truetype");
  font-style:italic; font-weight:300; font-display:swap;
}
@font-face{
  font-family:"Open Sans";
  src:url("assets/fonts/open-sans.regular.woff2") format("woff2"),
      url("assets/fonts/open-sans.regular.ttf") format("truetype");
  font-style:normal; font-weight:400; font-display:swap;
}
@font-face{
  font-family:"Open Sans";
  src:url("assets/fonts/open-sans.italic.woff2") format("woff2"),
      url("assets/fonts/open-sans.italic.ttf") format("truetype");
  font-style:italic; font-weight:400; font-display:swap;
}
@font-face{
  font-family:"Open Sans";
  src:url("assets/fonts/open-sans.semibold.woff2") format("woff2"),
      url("assets/fonts/open-sans.semibold.ttf") format("truetype");
  font-style:normal; font-weight:600; font-display:swap;
}
@font-face{
  font-family:"Open Sans";
  src:url("assets/fonts/open-sans.semibold-italic.woff2") format("woff2"),
      url("assets/fonts/open-sans.semibold-italic.ttf") format("truetype");
  font-style:italic; font-weight:600; font-display:swap;
}
@font-face{
  font-family:"Open Sans";
  src:url("assets/fonts/open-sans.bold.woff2") format("woff2"),
      url("assets/fonts/open-sans.bold.ttf") format("truetype");
  font-style:normal; font-weight:700; font-display:swap;
}

/* ---------- reset ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; overflow-x:hidden; }
html, body, button, input, select, textarea{
  font-family:"Open Sans", Arial, Helvetica, sans-serif;
}
body{
  margin:0; background:var(--color-bg-primary); color:var(--color-text-primary);
  font-family:var(--font-body); font-weight:300; font-size:17px; line-height:1.4;
  letter-spacing:0;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
img,svg{ max-width:100%; display:block; }
img{ height:auto; }
h1,h2,h3,h4,p,ul,ol,figure,fieldset{ margin:0; padding:0; }
ul,ol{ list-style:none; }
fieldset{ border:0; min-width:0; }
a{ color:inherit; }
button,input,textarea,select{ font:inherit; color:inherit; }
button{ background:none; border:0; cursor:pointer; }

::selection{ background:var(--color-brand-1); color:var(--color-black); }

/* ---------- přístupnost ---------- */
.visually-hidden{
  position:absolute!important; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}
.skip-link{
  position:absolute; left:-9999px; top:0; z-index:999;
  background:var(--color-black); color:var(--color-brand-4); padding:12px 20px; border-radius:0 0 6px 0;
}
.skip-link:focus{ left:0; }

:focus-visible{
  outline:2px solid var(--color-black);
  outline-offset:3px;
  border-radius:2px;
}
.sec--ink :focus-visible{ outline-color:var(--color-black); }

/* ---------- layout ---------- */
.wrap{ width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:var(--gutter); }
.wrap--narrow{ max-width:900px; }
.sec{ padding-block:var(--sec-pad); position:relative; }
/* rytmus pozadí podle palety styleguidu */
.sec--sand{   background:var(--color-brand-5); }   /* #f6f5ee */
.sec--olive{  background:var(--color-brand-5); }   /* #f6f5ee */
.sec--powder{ background:var(--color-brand-3); }   /* #e9dfd0 */
.sec--warm{   background:var(--color-brand-2); }   /* #d3baaa */
.sec--light{  background:var(--color-brand-6); }   /* #ebe7cb */
.sec--accent{ background:var(--color-brand-1); }   /* #d9d3a4 */
.sec--lilac{  background:var(--color-brand-3); }   /* #e9dfd0 */
.sec--ink{    background:var(--color-brand-1); color:var(--color-black); }  /* #d9d3a4 */
.sec--ink .lead{ color:rgba(17,17,15,.68); }

/* ---------- typografie ----------
   Celý web má jediné písmo (Open Sans). Hierarchii dělá velikost,
   váha, kurzíva, prostrkání a prostor — ne další rodina. */

/* Hlavní nadpisy: Open Sans Light. Nadpisy smí zabrat velkou část
   šířky, aby se zbytečně nelámaly na mnoho řádků. */
.h-display{
  font-family:var(--font-display); font-weight:300; line-height:1.02;
  letter-spacing:-.04em; text-wrap:balance;
  max-width:1100px; width:100%;
}
h1.h-display{ font-size:clamp(2.8rem, 6.2vw, 6.4rem); }
.h2{ font-size:clamp(2.4rem, 5.5vw, 5.2rem); }
.h2--wide{ max-width:1250px; }
.h2--center{ text-align:center; margin-inline:auto; margin-bottom:clamp(36px,5vw,64px); }
.eyebrow--center{ text-align:center; }
/* zvýrazněná část nadpisu: Open Sans Light Italic */
.h-display em{ font-style:italic; font-weight:300; }
.h3{
  font-family:var(--font-label); font-weight:600; font-size:14px; line-height:1.4;
  text-transform:uppercase; letter-spacing:.12em;
}

.eyebrow{
  font-family:var(--font-label); font-size:12.5px; font-weight:600;
  letter-spacing:.12em; text-transform:uppercase;
  color:var(--color-text-secondary); margin-bottom:18px;
}
.h2--center + .steps, .eyebrow + .h2--center{ margin-top:0; }
.sec .eyebrow + .h2--center{ margin-top:-8px; }
.eyebrow--light{ color:var(--color-text-secondary); }
.lead{ font-family:var(--font-body); font-weight:300; font-size:clamp(17px,1.4vw,19.5px); line-height:1.5; color:var(--color-text-secondary); max-width:58ch; }
.muted{ color:var(--color-text-secondary); font-size:15.5px; font-weight:400; line-height:1.5; }
.disclaimer{
  margin-top:28px; font-size:14px; line-height:1.4; color:var(--color-text-secondary);
  max-width:62ch;
}
.disclaimer--strong{ margin-top:34px; }

/* ---------- tlačítka ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:15px 30px; min-height:48px; border-radius:2px;
  font-family:var(--font-label); font-size:14px; font-weight:600;
  text-transform:uppercase; letter-spacing:.08em;
  text-decoration:none; cursor:pointer;
  transition:background-color .3s var(--ease), color .3s var(--ease),
             border-color .3s var(--ease), transform .3s var(--ease);
  border:1px solid transparent; text-align:center;
}
.btn--lg{ padding:18px 36px; min-height:56px; font-size:14.5px; }
.btn--primary{ background:var(--color-brand-1); color:var(--color-black); }
.btn--primary:hover{ background:var(--color-brand-6); color:var(--color-black); transform:none; }
.btn--ghost{ background:transparent; border-color:var(--color-black); color:var(--color-black); }
.btn--ghost:hover{ background:var(--color-brand-6); transform:none; }
/* na béžových plochách potřebuje primární tlačítko silnější kontrast */
.onepart .btn--primary,
.statementband .btn--primary,
.sec--olive .btn--primary,
.sec--ink .btn--primary,
.sec--warm .btn--primary,
.sec--accent .btn--primary,
.sec--light .btn--primary,
.attempt--now .btn--primary{ background:var(--color-black); color:var(--color-brand-4); }
.onepart .btn--primary:hover,
.statementband .btn--primary:hover,
.sec--olive .btn--primary:hover,
.sec--ink .btn--primary:hover,
.sec--warm .btn--primary:hover,
.sec--accent .btn--primary:hover,
.sec--light .btn--primary:hover,
.attempt--now .btn--primary:hover{ background:rgba(17,17,15,.82); color:var(--color-brand-4); }
.sec--ink .book__form .btn--primary{ background:var(--color-black); color:var(--color-brand-4); }
.sec--ink .book__form .btn--primary:hover{ background:rgba(17,17,15,.82); color:var(--color-brand-4); }
.sec--ink .book__form .btn--ghost{ border-color:var(--color-black); color:var(--color-black); }
.sec--ink .book__form .btn--ghost:hover{ border-color:var(--color-black); background:var(--color-brand-6); }
.sec--ink .book__form :focus-visible{ outline-color:var(--color-black); }
.sec--ink .btn--ghost{ border-color:var(--color-black); color:var(--color-black); }
.sec--ink .btn--ghost:hover{ background:var(--color-brand-6); }
.btn--text{
  padding:14px 6px; border-radius:0; background:none; color:var(--color-black);
  border-bottom:1px solid var(--color-line);
}
.btn--text:hover{ border-bottom-color:var(--color-black); transform:none; }
.sec--ink .btn--text,
.sec--warm .btn--text{ color:var(--color-black); border-bottom-color:rgba(17,17,15,.35); }
.sec--ink .btn--text:hover,
.sec--warm .btn--text:hover{ border-bottom-color:var(--color-black); }

/* CTA uvnitř sekcí */
.sec-cta{ margin-top:clamp(38px,5vw,64px); text-align:center; }
.sec-cta--tight{ margin-top:clamp(28px,3.5vw,44px); }
.sec-cta--left{ text-align:left; }
.activation__cta{ margin-top:26px; }
.lead--center{ margin-inline:auto; text-align:center; margin-bottom:clamp(34px,4.5vw,54px); }

.linkbtn{ font-size:13.5px; color:var(--color-text-secondary); text-decoration:underline; text-underline-offset:3px; padding:0; }
.linkbtn:hover{ color:var(--color-black); }

/* ---------- logo ---------- */
/* Logo: originální wordmark z brand styleguidu (vektor).
   Minimální výška 30 px, poměr 6,52:1, contain, bez stínu a deformace.
   Bezpečná zóna kolem loga odpovídá výšce písmene F. */
/* Originální wordmark „Formovna." — poměr 804:123 (6,516:1).
   Styleguide: minimální výška wordmarku 30 px → minimální šířka 196 px.
   object-fit:contain, nikdy cover; žádná deformace, rotace ani ořez. */
.logo-img{
  display:block; width:clamp(200px,15vw,238px); height:auto;
  min-height:30px; object-fit:contain;
  transition:width .35s var(--ease);
}
.hdr.is-stuck .logo-img{ width:clamp(198px,13vw,214px); }
/* ochranná zóna kolem loga ≥ výška písmene F */
.hdr__logo{ display:block; padding:10px 26px 10px 0; }
.ftr__logo{ display:block; width:clamp(230px,24vw,290px); height:auto; object-fit:contain; }

/* ============================================================
   HLAVIČKA
   ============================================================ */
/* Styleguide: černý wordmark vždy na #fefaf2 — hlavička je proto plná,
   nikdy průhledná nad fotografií. */
.hdr{
  position:fixed; inset:0 0 auto 0; z-index:80;
  background:var(--color-brand-4);
  border-bottom:1px solid transparent;
  transition:background-color .35s var(--ease), border-color .35s var(--ease), backdrop-filter .35s;
}
.hdr__in{
  max-width:var(--wrap); margin-inline:auto; padding:24px var(--gutter);
  display:flex; align-items:center; justify-content:space-between; gap:clamp(28px,4vw,56px);
  transition:padding .35s var(--ease);
}
.hdr.is-stuck{
  background:rgba(254,250,242,.97);
  -webkit-backdrop-filter:blur(10px);
          backdrop-filter:blur(10px);
  border-bottom:1px solid var(--color-line-soft);
}
.hdr.is-stuck .hdr__in{ padding-block:13px; }

.hdr__logo{ display:block; flex:0 0 auto; }


.nav{ display:flex; align-items:center; gap:clamp(16px,2vw,34px); }
.nav__list{ display:flex; align-items:center; gap:clamp(12px,1.7vw,26px); }
.nav__list a{
  text-decoration:none; font-family:var(--font-label); font-weight:300;
  font-size:13px; text-transform:uppercase; letter-spacing:.12em; position:relative;
  padding-block:6px; color:var(--color-black);
}
.nav__list a::after{
  content:""; position:absolute; left:0; right:100%; bottom:2px; height:1px;
  background:var(--color-black); transition:right .35s var(--ease);
}
.nav__list a:hover::after{ right:0; }
.nav__cta{ padding:12px 22px; min-height:44px; font-size:12.5px; }

.burger{ display:none; width:44px; height:44px; position:relative; z-index:78; margin-right:-10px; }
.burger span{
  position:absolute; left:11px; width:22px; height:1.2px; background:var(--color-black);
  transition:transform .3s var(--ease), opacity .2s;
}
.burger span:nth-child(1){ top:16px; }
.burger span:nth-child(2){ top:21.5px; }
.burger span:nth-child(3){ top:27px; }
.burger[aria-expanded="true"] span:nth-child(1){ transform:translateY(5.5px) rotate(45deg); }
.burger[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.burger[aria-expanded="true"] span:nth-child(3){ transform:translateY(-5.5px) rotate(-45deg); }

.nav-backdrop{
  position:fixed; inset:0; background:rgba(17,17,15,.35); z-index:70;
  opacity:0; transition:opacity .3s var(--ease);
}
.nav-backdrop.is-on{ opacity:1; }

@media (max-width:1080px){
  .burger{ display:block; }
  .nav{
    position:fixed; top:0; right:0; bottom:0; width:min(88vw,380px);
    background:var(--color-brand-4); z-index:75;
    flex-direction:column; align-items:stretch; justify-content:flex-start;
    gap:0; padding:96px 32px 40px;
    transform:translateX(102%); visibility:hidden;
    transition:transform .42s var(--ease), visibility 0s linear .42s;
    overflow-y:auto;
  }
  .nav.is-open{
    transform:none; visibility:visible;
    transition:transform .42s var(--ease), visibility 0s linear 0s;
  }
  .nav__list{ flex-direction:column; align-items:stretch; gap:0; }
  .nav__list li{ border-bottom:1px solid var(--color-line-soft); }
  .nav__list a{ display:block; padding:17px 0; font-size:15px; }
  .nav__list a::after{ display:none; }
  .nav__cta{ margin-top:28px; padding:16px 24px; font-size:15px; }
}

/* ============================================================
   HERO
   ============================================================ */
/* ============================================================
   SPLIT (nadpis + text)
   ============================================================ */
.split{
  display:grid; grid-template-columns:1fr 1fr; gap:clamp(24px,4vw,64px);
  align-items:end; margin-bottom:clamp(44px,6vw,80px);
}
.split__body{ padding-bottom:6px; }
@media (max-width:820px){ .split{ grid-template-columns:1fr; gap:22px; align-items:start; } }

/* ---------- výhody ---------- */
.feats{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(20px,2.6vw,40px); }
.feat{ border-top:1px solid var(--color-line); padding-top:22px; }
.feat__num{
  font-family:var(--font-label); font-size:13px; font-weight:300; letter-spacing:.12em;
  color:var(--color-text-secondary); display:block; margin-bottom:12px; font-variant-numeric:tabular-nums;
}
.feat h3{ font-size:20px; font-weight:300; letter-spacing:-.03em; margin-bottom:8px; }
.feat p{ font-size:15.5px; color:var(--color-text-secondary); }
@media (max-width:900px){ .feats{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:520px){ .feats{ grid-template-columns:1fr; } }

/* ============================================================
   JAK TO FUNGUJE — kroky
   ============================================================ */
.steps{ display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(28px,4vw,72px); align-items:start; }
.steps__nav{ display:grid; gap:0; }
.stepbtn{
  display:flex; gap:18px; align-items:baseline; text-align:left; width:100%;
  padding:22px 4px; border-top:1px solid var(--color-line);
  transition:padding-left .35s var(--ease), color .3s var(--ease);
  color:var(--color-text-secondary);
}
.stepbtn:last-child{ border-bottom:1px solid var(--color-line); }
.stepbtn__num{ font-family:var(--font-label); font-weight:300; font-size:13px; letter-spacing:.12em; font-variant-numeric:tabular-nums; }
.stepbtn__label{ font-size:19px; font-weight:300; letter-spacing:-.03em; }
.stepbtn:hover{ color:var(--color-black); padding-left:12px; }
.stepbtn.is-active{ color:var(--color-black); padding-left:12px; }
.stepbtn.is-active .stepbtn__label{ font-weight:300; }

.steps__panels{ position:relative; }
.steppanel{ display:none; }
.steppanel.is-active{ display:block; animation:fadeUp .5s var(--ease) both; }
.steppanel h3{
  font-family:var(--font-display); font-weight:300; font-size:clamp(26px,3vw,38px);
  line-height:1.1; letter-spacing:-.03em; margin-bottom:14px;
}
.steppanel p{ font-size:clamp(16.5px,1.4vw,19px); color:var(--color-text-secondary); max-width:48ch; }
@media (max-width:820px){ .steps{ grid-template-columns:1fr; } }

/* ---------- vizualizace aktivace ---------- */
.activation{
  margin-top:clamp(56px,7vw,96px);
  display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(28px,4vw,64px);
  align-items:center; background:var(--color-brand-5); padding:clamp(26px,3.6vw,52px);
}
.activation__viz{ background:var(--color-brand-4); padding:clamp(10px,1.6vw,18px); }
.actsvg{ width:100%; height:auto; }
.act-appl{ fill:var(--color-black); }
.act-dot{ fill:var(--color-brand-1); }
.act-wave{ stroke-width:4; opacity:.55; }
.act-wave--1{ stroke:var(--color-brand-2); }
.act-wave--2{ stroke:var(--color-brand-2); }
.act-wave--3{ stroke:var(--color-brand-6); }
.act-wave--4{ stroke:var(--color-brand-1); }
.act-fiber{ fill:none; stroke:var(--color-black); stroke-width:2.4; opacity:.42; stroke-linecap:round; }
.act-skin{ stroke:var(--color-brand-1); stroke-width:10; }
.activation__text h3{ margin-bottom:14px; }
.activation__text p + p{ margin-top:14px; }
@media (max-width:820px){ .activation{ grid-template-columns:1fr; } }

@keyframes actwave{
  0%   { transform:translateY(-12px) scaleX(.94); opacity:0; }
  30%  { opacity:.85; }
  100% { transform:translateY(20px) scaleX(1.02); opacity:0; }
}
@keyframes actfiber{
  0%,100%{ transform:scaleY(1); }
  50%    { transform:scaleY(.9); }
}
.act-wave{ animation:actwave 3s var(--ease) infinite; transform-origin:center; transform-box:view-box; }
.act-wave--2{ animation-delay:.3s; }
.act-wave--3{ animation-delay:.6s; }
.act-wave--4{ animation-delay:.9s; }
.act-fiber{ animation:actfiber 3s var(--ease) infinite; transform-origin:center 226px; transform-box:view-box; }
.act-fiber--2{ animation-delay:.14s; }
.act-fiber--3{ animation-delay:.28s; }

/* ============================================================
   OBLASTI
   ============================================================ */
/* min-width:0 je nutné, aby se sloupec mohl na mobilu zúžit — jinak ho
   roztáhne obsah přepínače partií a vodorovný posuv uvnitř nefunguje */


@media (max-width:1000px){
}
@media (max-width:620px){ .areapanel{ grid-template-columns:1fr; } }

/* ============================================================
   PRO KOHO
   ============================================================ */
.forwho{ display:grid; grid-template-columns:1.2fr .8fr; gap:clamp(32px,5vw,80px); align-items:start; }

.forwho__aside{ background:var(--color-brand-5); padding:clamp(24px,3vw,38px); }
.forwho__aside img{ width:100%; aspect-ratio:16/11; object-fit:cover; margin-bottom:26px; }
.forwho__aside h3{ margin-bottom:10px; }
.forwho__aside p{ font-size:15.5px; color:var(--color-text-secondary); margin-bottom:24px; }
@media (max-width:900px){ .forwho{ grid-template-columns:1fr; } }

/* ============================================================
   GALERIE PROMĚN
   ============================================================ */
.gal__head{
  display:grid; grid-template-columns:1fr auto; gap:24px;
  align-items:end; margin-bottom:clamp(30px,4vw,46px);
}
.gal__head .lead{ margin-top:16px; }
.gal__nav{ display:grid; gap:16px; justify-items:end; }
.gal__count{
  display:flex; align-items:baseline; gap:6px;
  font-weight:300; font-size:16px; letter-spacing:-.03em; font-variant-numeric:tabular-nums;
}
.gal__count-sep{ color:var(--color-text-secondary); font-weight:300; }
.gal__count span:last-child{ color:var(--color-text-secondary); font-weight:300; }
.gal__arrows{ display:flex; gap:8px; }
.gal__arrow{
  width:52px; height:52px; border:1px solid rgba(17,17,15,.28); border-radius:2px;
  display:grid; place-items:center; color:var(--color-black);
  transition:background-color .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease);
}
.gal__arrow svg{ width:20px; height:20px; }
.gal__arrow:hover{ background:var(--color-black); color:var(--color-brand-4); border-color:var(--color-black); }
.gal__arrow[disabled]{ opacity:.28; pointer-events:none; }

.gal{ --gal-slide:86%; --gal-gap:20px; }
.gal__viewport{ overflow:hidden; }
.gal__viewport:focus-visible{ outline-offset:6px; }
.gal__track{
  display:flex; gap:var(--gal-gap); list-style:none; margin:0; padding:0;
  transform:translateX(calc(-1 * var(--i,0) * (var(--gal-slide) + var(--gal-gap))));
  transition:transform .6s var(--ease); will-change:transform;
}
.gal__slide{ flex:0 0 var(--gal-slide); }
.gal__slide figure{ margin:0; }
.gal__frame{ position:relative; background:var(--color-brand-4); }
.gal__slide img{ width:100%; height:auto; aspect-ratio:3/2; object-fit:cover; display:block; }
.gal__labels{
  position:absolute; inset:auto 0 0 0; display:grid; grid-template-columns:1fr 1fr;
  pointer-events:none;
}
.gal__labels span{
  margin:0 0 16px 16px; justify-self:start;
  background:rgba(17,17,15,.82); color:var(--color-brand-4);
  font-size:11.5px; font-weight:300; letter-spacing:.12em; text-transform:uppercase;
  padding:7px 12px;
}
.gal__slide figcaption{ padding:18px 2px 0; display:flex; flex-wrap:wrap; align-items:baseline; gap:6px 14px; }
.gal__slide figcaption p{ font-size:15.5px; color:var(--color-text-secondary); }

.gal__dots{ display:flex; gap:8px; margin-top:22px; }
.gal__dot{
  height:2px; flex:1 1 0; background:rgba(17,17,15,.2); border-radius:0;
  transition:background-color .3s var(--ease);
}
.gal__dot.is-active{ background:var(--color-black); }

.gal__foot{
  margin-top:clamp(30px,4vw,44px);
  display:flex; flex-wrap:wrap; align-items:center; gap:18px 32px;
}
.gal__foot .disclaimer{ margin-top:0; flex:1 1 320px; }

@media (max-width:760px){
  .gal{ --gal-slide:100%; --gal-gap:12px; }
  .gal__head{ grid-template-columns:1fr; align-items:start; }
  .gal__nav{ justify-items:start; grid-template-columns:auto auto; align-items:center; gap:18px; }
  .gal__labels span{ margin:0 0 10px 10px; font-size:10.5px; padding:6px 10px; }
}

/* ============================================================
   PRINCIPY
   ============================================================ */
.principles{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--color-line); border:1px solid var(--color-line); }
.principles li{ background:var(--color-brand-4); padding:clamp(24px,3vw,40px); }
.principles h3{ font-size:19px; font-weight:300; letter-spacing:-.03em; margin-bottom:10px; }
.principles p{ font-size:15.5px; color:var(--color-text-secondary); }
@media (max-width:900px){ .principles{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:520px){ .principles{ grid-template-columns:1fr; } }

/* ============================================================
   CENÍK
   ============================================================ */
/* ============================================================
   PRŮBĚH NÁVŠTĚVY
   ============================================================ */
.visit{ display:grid; grid-template-columns:.75fr 1.25fr; gap:clamp(30px,5vw,80px); align-items:start; }
.visit__media img{ width:100%; aspect-ratio:4/5; object-fit:cover; }
.timeline{ margin-top:clamp(28px,4vw,44px); counter-reset:tl; }
.timeline li{
  position:relative; padding:0 0 30px 52px; counter-increment:tl;
}
.timeline li::before{
  content:counter(tl,decimal-leading-zero);
  position:absolute; left:0; top:2px; font-family:var(--font-label); font-size:13px;
  font-weight:300; letter-spacing:.12em; color:var(--color-text-secondary); font-variant-numeric:tabular-nums;
}
.timeline li::after{
  content:""; position:absolute; left:11px; top:22px; bottom:2px; width:1px; background:var(--color-line);
}
.timeline li:last-child{ padding-bottom:0; }
.timeline li:last-child::after{ display:none; }
.timeline h3{ font-size:19px; font-weight:300; letter-spacing:-.03em; margin-bottom:6px; }
.timeline p{ font-size:15.5px; color:var(--color-text-secondary); max-width:54ch; }
.visit__text .muted{ margin-top:26px; }
@media (max-width:900px){
  .visit{ grid-template-columns:1fr; }
  .visit__media{ max-width:320px; }
}

/* ============================================================
   FAQ
   ============================================================ */
.faq{ border-top:1px solid rgba(17,17,15,.16); }
.faq__item{ border-bottom:1px solid rgba(17,17,15,.16); }
.faq__q{
  width:100%; text-align:left; display:flex; align-items:center; justify-content:space-between;
  gap:20px; padding:24px 2px; font-family:var(--font-body); font-weight:300;
  font-size:clamp(17px,1.6vw,20px); line-height:1.4; color:var(--color-black);
  transition:color .25s var(--ease);
}
.faq__q:hover{ color:var(--color-text-secondary); }
.faq__ico{ position:relative; flex:0 0 auto; width:16px; height:16px; }
.faq__ico::before,.faq__ico::after{
  content:""; position:absolute; background:var(--color-black); transition:transform .35s var(--ease), opacity .25s;
}
.faq__ico::before{ left:0; top:7.5px; width:16px; height:1px; }
.faq__ico::after{ left:7.5px; top:0; width:1px; height:16px; }
.faq__q[aria-expanded="true"] .faq__ico::after{ transform:scaleY(0); }
.faq__a{ overflow:hidden; }
.faq__a > p{ font-size:16.5px; line-height:1.4; color:var(--color-text-secondary); max-width:68ch; padding-bottom:4px; }
.faq__a > p:first-child{ padding-top:2px; }
.faq__a > p + p{ margin-top:12px; }
.faq__a-inner{ padding-bottom:26px; }

/* ============================================================
   FORMULÁŘ
   ============================================================ */
.book{ display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(34px,5vw,84px); align-items:start; }
.book__intro .lead{ margin-top:22px; }
.book__points{ margin-top:30px; display:grid; gap:12px; }
.book__points li{
  font-size:16px; color:var(--color-text-secondary); padding-left:22px; position:relative;
}
.book__points li::before{
  content:""; position:absolute; left:0; top:.7em; width:10px; height:1px; background:var(--color-black);
}

.book__form{ background:var(--color-brand-4); color:var(--color-black); padding:clamp(24px,3.4vw,48px); border:1px solid var(--color-line); }


.opts--inline{ display:flex; flex-wrap:wrap; }
@media (max-width:560px){ .opts{ grid-template-columns:1fr; } }
.opts--one{ grid-template-columns:1fr; }

/* vybraný balíček */
.pkg__head{ display:flex; align-items:baseline; justify-content:space-between; gap:14px; }
.pkg__label{ font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--color-text-secondary); }
.pkg__price{ font-size:15px; color:var(--color-text-secondary); margin-top:4px; }

/* rekapitulace v děkovacím stavu */
.recap{ margin-top:26px; border-top:1px solid var(--color-line); }
.recap__row{
  display:grid; grid-template-columns:110px 1fr; gap:14px;
  padding:11px 0; border-bottom:1px solid var(--color-line-soft);
}
.recap dt{ font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--color-text-secondary); padding-top:3px; }
.recap dd{ margin:0; font-size:16px; }
@media (max-width:420px){ .recap__row{ grid-template-columns:1fr; gap:2px; } }

/* vložený rezervační kalendář */
/* ---------- vložený rezervační kalendář (Reservio) ----------
   Výšku iframu nastavuje script.js podle config.js. Kalendář běží
   na cizí doméně, takže si výšku sám poslat nemůže. */
.bookembed{ position:relative; }
.bookembed__status{
  font-size:14.5px; color:var(--color-text-secondary); text-align:center;
  padding:26px 0 18px;
}
.bookembed iframe{
  display:block; width:100%; max-width:100%; border:0;
  background:var(--color-brand-4);
  /* záloha, kdyby se nespustil JavaScript — přesnou výšku
     nastavuje script.js podle config.js */
  min-height:1000px;
  /* jemné objevení po načtení, ať to neblikne */
  opacity:0; transition:opacity .35s var(--ease);
}
.bookembed iframe.is-ready{ opacity:1; }
.bookembed__fallback{ margin-top:16px; font-size:14px; color:var(--color-text-secondary); text-align:center; }
.bookembed__fallback a{ color:var(--color-black); }


/* Kalendář potřebuje šířku — na mobilu proto užší rámování karty. */
@media (max-width:759px){
  .bookembed iframe{ min-height:1180px; }   /* jen záloha bez JS */
  /* karta s kalendářem má na mobilu co nejmenší rámování,
     aby Reservio dostalo plnou šířku */
  .book__form:has(.bookembed:not([hidden])){ padding:14px; }
  /* místo pod kalendářem, aby ho nepřekryla mobilní sticky lišta */
  #rezervace{ padding-bottom:calc(var(--sec-pad) + 76px); }
}

/* Kotvy pod fixní hlavičkou. JS u rezervace odsazení dopočítává
   přesně, tohle je záloha pro odkazy z jiných stránek a pro
   prohlížeče bez JS. */
:target{ scroll-margin-top:104px; }
#rezervace{ scroll-margin-top:104px; }

@media (prefers-reduced-motion: reduce){
  .bookembed iframe{ opacity:1; transition:none; }
}

/* varianta s odkazem do rezervačního systému */
.booklink{ text-align:center; padding:clamp(12px,2vw,26px) 0; }
.booklink__title{ font-size:clamp(1.8rem,2.6vw,2.4rem); line-height:1.1; letter-spacing:-.03em; margin-bottom:14px; }
.booklink p{ color:var(--color-text-secondary); max-width:42ch; margin:0 auto 28px; }

.opt-note{ text-transform:none; letter-spacing:0; }
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
@media (max-width:560px){ .field-row{ grid-template-columns:1fr; gap:0; } }

/* chybový stav: bez barvy mimo paletu — řeší se černou linkou, tučnějším
   rámečkem a textovou hláškou (kontrast i bezbarvá rozlišitelnost) */

.field--check{ margin-top:26px; }


#submitBtn[disabled]{ opacity:.6; pointer-events:none; }

/* Reservio potřebuje šířku, proto se sloupce skládají pod sebe
   už na tabletu (dřív to bylo od 900 px). */
@media (max-width:1080px){ .book{ grid-template-columns:1fr; } }

/* ============================================================
   KONTAKT
   ============================================================ */
.contact{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--color-line); border:1px solid var(--color-line); }
.contact__cell{ background:var(--color-brand-4); padding:clamp(22px,2.6vw,34px); }
.cico{ width:22px; height:22px; color:var(--color-text-secondary); margin-bottom:16px; }
.contact__cell h3{
  font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--color-text-secondary);
  font-weight:300; margin-bottom:12px;
}
.contact__cell p,.contact__cell a{ font-size:16.5px; text-decoration:none; }
.contact__cell a{ border-bottom:1px solid var(--color-line); }
.contact__cell a:hover{ border-color:var(--color-black); }
.contact__cell .muted{ display:block; margin-top:6px; font-size:14px; }
@media (max-width:900px){ .contact{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:520px){ .contact{ grid-template-columns:1fr; } }

/* ============================================================
   PATIČKA
   ============================================================ */
.ftr{ background:var(--color-brand-3); color:var(--color-black); padding-top:clamp(56px,7vw,88px); }
.ftr__grid{
  display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:clamp(28px,4vw,56px);
  padding-bottom:clamp(40px,5vw,64px);
}
.ftr__claim{ margin-top:20px; font-size:15px; color:var(--color-text-secondary); max-width:30ch; }
.ftr__social{ display:flex; gap:16px; margin-top:24px; }
.ftr__social a{
  font-size:13px; letter-spacing:.12em; text-transform:uppercase; text-decoration:none;
  color:var(--color-text-secondary); border-bottom:1px solid rgba(17,17,15,.28); padding-bottom:2px;
}
.ftr__social a:hover{ color:var(--color-black); border-color:var(--color-black); }
.ftr__col h2{
  font-size:12px; letter-spacing:.12em; text-transform:uppercase; font-weight:300;
  color:var(--color-text-muted); margin-bottom:18px;
}
.ftr__col ul{ display:grid; gap:11px; }
.ftr__col a{ font-size:15px; text-decoration:none; color:var(--color-text-secondary); }
.ftr__col a:hover{ color:var(--color-black); text-decoration:underline; text-underline-offset:4px; }
.ftr__col li{ font-size:15px; color:var(--color-text-secondary); }
.ftr__bottom{
  border-top:1px solid rgba(17,17,15,.14); padding-block:26px 34px;
  display:grid; gap:10px;
}
.ftr__bottom p{ font-size:13.5px; color:var(--color-text-muted); }
.ftr__note{ max-width:80ch; }
@media (max-width:900px){ .ftr__grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .ftr__grid{ grid-template-columns:1fr; } }

/* ============================================================
   STICKY CTA (mobil)
   ============================================================ */
.sticky-cta{
  position:fixed; left:0; right:0; bottom:0; z-index:60; display:none;
  gap:10px; padding:10px 14px calc(10px + env(safe-area-inset-bottom));
  background:rgba(254,250,242,.92);
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
  border-top:1px solid var(--color-line-soft);
  transform:translateY(110%); transition:transform .4s var(--ease);
}
.sticky-cta.is-on{ transform:none; }
.sticky-cta__call{
  flex:0 0 auto; width:52px; height:52px; border:1px solid var(--color-line);
  border-radius:2px; display:grid; place-items:center; text-decoration:none; color:var(--color-black);
}
.sticky-cta__call svg{ width:22px; height:22px; }
.sticky-cta__call span{ display:none; }
.sticky-cta__btn{ flex:1 1 auto; padding:16px 20px; }
@media (max-width:820px){
  .sticky-cta{ display:flex; }
  body{ padding-bottom:0; }
}

/* ============================================================
   PRÁVNÍ PODSTRÁNKY
   ============================================================ */
.legal{ padding-top:clamp(130px,16vh,190px); padding-bottom:var(--sec-pad); }
.legal h1{ margin-bottom:20px; }
.legal .updated{ font-size:13px; letter-spacing:.12em; text-transform:uppercase; color:var(--color-text-secondary); margin-bottom:44px; }
.legal h2{
  font-family:var(--font-display); font-weight:300; font-size:clamp(1.6rem,2.2vw,2.1rem);
  line-height:1.1; letter-spacing:-.03em; margin:44px 0 14px;
}
.legal h3{ font-family:var(--font-label); font-weight:300; font-size:15px; text-transform:uppercase; letter-spacing:.12em; margin:26px 0 8px; }
.legal p,.legal li{ color:var(--color-text-secondary); font-size:16px; }
.legal p + p{ margin-top:14px; }
.legal ul{ margin-top:12px; display:grid; gap:9px; }
.legal ul li{ padding-left:22px; position:relative; }
.legal ul li::before{ content:""; position:absolute; left:0; top:.7em; width:10px; height:1px; background:var(--color-text-secondary); }
.legal a{ color:var(--color-black); text-underline-offset:3px; }
.legal .back{ display:inline-block; margin-top:48px; }

/* stránka poděkování */
.ty{ min-height:70vh; display:grid; place-items:center; text-align:center; padding-top:clamp(130px,16vh,190px); padding-bottom:var(--sec-pad); }
.ty__in{ max-width:620px; }
.ty h1{ margin-bottom:16px; }
.ty p{ color:var(--color-text-secondary); }
.ty .lead{ margin-inline:auto; }
.ty .eyebrow{ margin-bottom:18px; }

/* blok „Potřebujete termín změnit?“ na děkovací stránce */
.tynote{
  margin-top:clamp(34px,4vw,48px); padding:clamp(20px,2.6vw,30px);
  background:var(--color-brand-5); border:1px solid var(--color-line);
  border-radius:2px; text-align:left;
}
.tynote__title{
  font-family:var(--font-label); font-weight:300; font-size:13px;
  text-transform:uppercase; letter-spacing:.12em; margin-bottom:10px;
}
.tynote p{ font-size:15.5px; line-height:1.4; }
.tynote__contact{ margin-top:12px; }
.tynote__contact a{ color:var(--color-black); }

.ty__actions{
  margin-top:clamp(30px,3.6vw,42px);
  display:flex; flex-wrap:wrap; gap:10px 26px;
  align-items:center; justify-content:center;
}
.ty__actions .btn{ margin-top:0; }

/* ============================================================
   ANIMACE
   ============================================================ */
@keyframes fadeUp{ from{ opacity:0; transform:translateY(14px); } to{ opacity:1; transform:none; } }

.reveal{ opacity:0; transform:translateY(18px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
.reveal.is-in{ opacity:1; transform:none; }

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{
    animation-duration:.001ms!important; animation-iteration-count:1!important;
    transition-duration:.001ms!important;
  }
  .reveal{ opacity:1; transform:none; }
  .gal__track{ transition:none; }
}

/* ============================================================
   NOVÉ BLOKY (v2) — asymetrické sekce, typografické momenty
   ============================================================ */

.sec--tight{ padding-block:clamp(46px,5vw,72px); }
.sec--cream2{ background:var(--color-brand-5); }

/* --- typografický moment --- */
.pullquote{
  margin-top:clamp(26px,3vw,38px);
  font-family:var(--font-display); font-weight:300;
  font-size:clamp(1.8rem,3vw,2.8rem); line-height:1.1; letter-spacing:-.03em;
  color:var(--color-black); max-width:20ch;
  padding-left:20px; border-left:1px solid var(--color-black);
}
.pullquote--sm{ font-size:clamp(22px,2.4vw,31px); margin-top:20px; }

.kicker{
  margin-top:clamp(30px,4vw,46px);
  font-family:var(--font-display); font-weight:300; line-height:1.1;
  font-size:clamp(1.5rem,2.2vw,2.1rem); letter-spacing:-.03em;
  color:var(--color-black); max-width:28ch;
}
.kicker--light{ color:var(--color-black); margin-top:28px; }

/* --- sekce PROBLÉM --- */
.problem{
  display:grid; grid-template-columns:1fr 1.05fr;
  gap:clamp(28px,4vw,72px); align-items:center;
  margin-bottom:clamp(46px,6vw,86px);
}
.problem__media{ margin:0; }
.problem__media img{
  width:100%; height:auto; aspect-ratio:3/2; object-fit:cover; object-position:50% 34%;
}
@media (max-width:900px){
  .problem{ grid-template-columns:1fr; gap:30px; }
  .problem__media img{ aspect-ratio:4/3; }
}

/* --- výhody: tenké linky místo karet --- */
.feats{
  display:grid; grid-template-columns:repeat(4,1fr); gap:0;
  border-top:1px solid var(--color-line);
}
.feat{
  border-top:0; border-left:1px solid var(--color-line);
  padding:26px clamp(16px,1.8vw,28px) 8px;
}
.feat:first-child{ border-left:0; padding-left:0; }
@media (max-width:900px){
  .feats{ grid-template-columns:1fr 1fr; }
  .feat:nth-child(odd){ border-left:0; padding-left:0; }
  .feat:nth-child(n+3){ border-top:1px solid var(--color-line); }
}
@media (max-width:560px){
  .feats{ grid-template-columns:1fr; }
  .feat{ border-left:0; padding-left:0; }
  .feat + .feat{ border-top:1px solid var(--color-line); }
}

/* --- PRO KOHO / zrcadlo --- */
.mirror{
  display:grid; grid-template-columns:minmax(420px,48%) minmax(0,52%);
  gap:clamp(42px,4vw,64px); align-items:center;
}
.mirror__media{ margin:0; }
.mirror__media img{ width:100%; height:auto; aspect-ratio:4/5; object-fit:cover; object-position:58% 26%; border-radius:2px; }
@media (max-width:900px){
  .mirror{ grid-template-columns:1fr; gap:26px; }
  .mirror__media img{ aspect-ratio:4/5; max-height:none; }
}

/* --- průběh návštěvy --- */
.visit__media img{ aspect-ratio:4/3; object-position:52% 50%; }

/* --- decentní organická linka --- */
.sec--olive .wrap{ position:relative; }

/* ============================================================
   v3 — IKONY, BAREVNÉ AKCENTY, PROMĚNA PŘED/POTOM, VIZUALIZACE
   ============================================================ */

/* --- ikony --- */
.ico-wrap{ display:inline-flex; flex:0 0 auto; }
.ico-wrap .ico{ width:24px; height:24px; display:block; }
.ico-wrap--lg .ico{ width:32px; height:32px; }

/* --- barevné štítky --- */
.tag{
  display:inline-block; padding:6px 13px; font-size:11.5px; font-weight:300;
  letter-spacing:.12em; text-transform:uppercase; color:var(--color-black);
}
.tag--powder{ background:var(--color-brand-2); }
.tag--olive{ background:var(--color-brand-1); }

/* --- proměna před / potom --- */
.ba{ position:relative; border-radius:2px; overflow:hidden; background:var(--color-brand-4); }
.ba img{ display:block; width:100%; height:auto; }
.ba__labels{
  position:absolute; inset:auto 0 0 0; display:grid; grid-template-columns:1fr 1fr;
  pointer-events:none;
}
.ba__labels span{
  margin:0 0 14px 14px; justify-self:start;
  background:rgba(17,17,15,.84); color:var(--color-brand-4);
  font-size:11px; font-weight:300; letter-spacing:.12em; text-transform:uppercase;
  padding:6px 11px; border-radius:2px;
}
.ba__note{ margin-top:10px; font-size:13px; color:var(--color-text-secondary); }
.ba__tag{
  position:absolute; top:12px; right:12px;
  background:rgba(254,250,242,.9); color:var(--color-text-secondary);
  font-size:10.5px; font-weight:300; letter-spacing:.12em; text-transform:uppercase;
  padding:5px 9px; border-radius:2px; pointer-events:none;
}
@media (max-width:560px){ .ba__tag{ top:8px; right:8px; font-size:9.5px; padding:4px 7px; } }
@media (max-width:560px){
  .ba__labels span{ margin:0 0 9px 9px; font-size:10px; padding:5px 9px; letter-spacing:.12em; }
}

/* --- hero: barevné fakty s ikonami --- */
.factline{
  display:flex; flex-wrap:wrap; gap:10px;
  margin-top:30px; padding-top:0; border-top:0;
}
.fact{
  display:flex; align-items:center; gap:11px;
  padding:11px 16px 11px 12px; border-radius:2px;
}
.fact--olive{ background:rgba(217,211,164,.5); }
.fact--lilac{ background:rgba(211,186,170,.34); }
.fact--blue{ background:rgba(235,231,203,.4); }
.fact__txt{ display:grid; gap:0; }
.fact__txt strong{ font-size:16px; font-weight:300; letter-spacing:-.03em; font-variant-numeric:tabular-nums; }
.fact__txt span{ font-size:12.5px; color:var(--color-text-secondary); letter-spacing:0; }

.hero__media{ position:relative; }
.hero__media .tag{ position:absolute; top:14px; left:14px; z-index:2; }
.hero__media img{ aspect-ratio:auto; object-fit:contain; object-position:center; }
@media (max-width:900px){ .hero__media img{ max-height:none; aspect-ratio:auto; } }

/* --- důvěryhodnostní proužek --- */
.trust{
  margin-top:clamp(30px,4vw,48px); padding-top:clamp(22px,3vw,30px);
  border-top:1px solid var(--color-line);
  display:flex; flex-wrap:wrap; align-items:center; gap:14px clamp(22px,3vw,44px);
}
.trust__title{ font-size:17px; font-weight:300; letter-spacing:-.03em; }
.trust__list{ display:flex; flex-wrap:wrap; gap:10px 22px; }
.trust__list li{ display:flex; align-items:center; gap:9px; font-size:15px; color:var(--color-text-secondary); }

/* --- sekce UPŘÍMNĚ --- */
.honest{
  display:grid; grid-template-columns:1.05fr .95fr;
  gap:clamp(28px,4vw,68px); align-items:center;
}
.honest__media{ margin:0; }
.honest__media img{ width:100%; height:auto; aspect-ratio:3/2; object-fit:cover; object-position:50% 34%; border-radius:2px; }
@media (max-width:900px){
  .honest{ grid-template-columns:1fr; gap:28px; }
  .honest__text{ order:1; } .honest__media{ order:2; }
}

.tried{ margin:clamp(26px,3.4vw,40px) 0 clamp(24px,3vw,34px); display:grid; gap:0; }
.tried__i{
  padding:14px 0 14px 22px; position:relative;
  font-size:clamp(21px,2.4vw,30px); font-weight:300; letter-spacing:-.03em;
  line-height:1.2; color:var(--color-text-secondary);
  opacity:0; transform:translateX(-12px);
  transition:opacity .55s var(--ease), transform .55s var(--ease);
}
.tried.is-in .tried__i{ opacity:1; transform:none; }
.tried.is-in .tried__i:nth-child(2){ transition-delay:.13s; }
.tried.is-in .tried__i:nth-child(3){ transition-delay:.26s; }
.tried.is-in .tried__i:nth-child(4){ transition-delay:.42s; }
.tried__i::before{
  content:""; position:absolute; left:0; top:20px; bottom:20px; width:4px; border-radius:2px;
}
.tried__i--olive::before{ background:var(--color-brand-1); }
.tried__i--powder::before{ background:var(--color-brand-2); }
.tried__i--blue::before{ background:var(--color-brand-6); }
.tried__i--last{ color:var(--color-black); font-size:clamp(25px,3.2vw,40px); font-weight:300; padding-top:20px; }
.tried__i--last::before{ background:var(--color-black); top:26px; }
@media (prefers-reduced-motion: reduce){
  .tried__i{ opacity:1; transform:none; }
}

/* --- barevný typografický box --- */
.statement{
  position:relative; overflow:hidden;
  margin:clamp(34px,4.5vw,58px) 0 clamp(40px,5vw,64px);
  background:var(--color-brand-3); padding:clamp(28px,4vw,52px) clamp(24px,4vw,56px);
  border-radius:2px;
}
/* Dekorativní vodoznak: originální symbol F ze styleguidu, celý,
   neořezaný, nerotovaný, v jedné ze schválených barev. */
.statement__mark{
  position:absolute; right:clamp(16px,3vw,34px); top:clamp(16px,3vw,30px);
  width:min(148px,26vw); height:auto; aspect-ratio:210.15/336.32;
  background-color:rgba(254,250,242,.55);
  -webkit-mask:url(assets/brand/formovna-symbol.svg) no-repeat center / contain;
          mask:url(assets/brand/formovna-symbol.svg) no-repeat center / contain;
  pointer-events:none;
}
.statement__text{
  position:relative; font-family:var(--font-display); font-weight:300;
  font-size:clamp(27px,3.4vw,44px); line-height:1.1; letter-spacing:-.03em;
  max-width:22ch; margin-bottom:26px;
}
.statement .btn{ position:relative; }

/* --- výhody s ikonami a barevným pruhem --- */
.feat{ position:relative; }
.feat .ico-wrap{ margin-bottom:14px; }
.feat::after{ content:""; position:absolute; left:0; top:-1px; width:38px; height:3px; }
.feat:first-child::after{ left:0; }
.feat--olive::after{ background:var(--color-brand-1); }
.feat--powder::after{ background:var(--color-brand-2); }
.feat--lilac::after{ background:var(--color-brand-2); }
.feat--blue::after{ background:var(--color-brand-6); }
@media (max-width:900px){ .feat:nth-child(n+3)::after{ top:-1px; } }

/* --- přepínač partií s ikonami --- */

/* --- sekce přístupu s ikonami --- */
.approach__list li{ display:flex; align-items:center; gap:11px; }

/* --- body u rezervace s ikonami --- */
.book__points--ico li{ display:flex; align-items:center; gap:11px; padding-left:0; }
.book__points--ico li::before{ display:none; }
.book__points--ico .ico__blob{ opacity:.85; }
.book__points--ico .ico__line{ stroke:var(--color-brand-4); }

/* ============================================================
   SKUTEČNÉ RECENZE (vykreslí se jen s reálnými daty)
   ============================================================ */

/* ============================================================
   v4 — HERO S KALENDÁŘEM, INFOPRUH, POKUSY, CELOPLOŠNÉ MOMENTY
   ============================================================ */

/* --- ukazatel postupu stránkou --- */
.progress{
  position:fixed; top:0; right:0; width:2px; height:100vh; z-index:90;
  background:rgba(17,17,15,.06); pointer-events:none;
}
.progress__bar{
  display:block; width:100%; height:0; background:rgba(17,17,15,.3);
  transform-origin:top;
}
@media (max-width:900px){ .progress{ display:none; } }

/* --- HERO --- */
.hero{
  position:relative; isolation:isolate; display:flex; align-items:center;
  min-height:min(90vh, 880px); padding-block:clamp(120px,15vh,170px) clamp(56px,7vw,96px);
  overflow:hidden; background:var(--color-brand-4);
}
.hero__bg{ position:absolute; inset:0; z-index:-2; display:block; }
.hero__bg img{ width:100%; height:100%; object-fit:cover; object-position:72% 50%; display:block; }
.hero::after{
  content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  /* jediný povolený překryv: fade schválené barvy #fefaf2 kvůli čitelnosti textu */
  background:linear-gradient(
    90deg,
    rgba(254,250,242,.97) 0%,
    rgba(254,250,242,.93) 34%,
    rgba(254,250,242,.60) 54%,
    rgba(254,250,242,.18) 74%,
    rgba(254,250,242,.02) 100%);
}
.hero__inner{ position:relative; width:100%; }
.hero__text{ max-width:min(620px,52%); }
.hero .lead{ margin-top:22px; max-width:44ch; }
.hero__cta{ margin-bottom:0;  display:flex; flex-wrap:wrap; align-items:center; gap:10px 24px; margin-top:34px; }
.hero__note{ margin-top:18px; font-size:15px; color:var(--color-text-secondary); }

@media (max-width:900px){
  .hero{
    display:block; min-height:0; padding-top:78px; padding-bottom:0;
    background:var(--color-brand-4);
  }
  .hero::after{ display:none; }
  .hero__bg{ position:relative; inset:auto; z-index:0; margin-top:10px; }
  .hero__bg img{ height:clamp(200px,26vh,250px); object-position:64% 48%; }
  .hero__text{ max-width:none; }
  .hero__inner{ padding-block:22px 6px; }
  .hero .lead{ margin-top:16px; }
  .hero__cta{ margin-top:24px; }
}
@media (max-width:560px){
  h1.h-display{ font-size:clamp(42px,10.5vw,52px); }
  .hero__cta{ flex-direction:column; align-items:stretch; gap:6px; }
  .hero__cta .btn--primary{ width:100%; }
  .hero__cta .btn--text{ align-self:flex-start; }
}

/* --- informační pruh --- */
.infobar{
  display:grid; grid-template-columns:repeat(4,1fr);
  background:var(--color-brand-6);
  border-top:1px solid var(--color-line);
  border-bottom:1px solid var(--color-line);
  border-radius:0; box-shadow:none;
  margin-top:0; position:relative; z-index:3;
}
.infobar li{
  padding:clamp(20px,2.4vw,30px) clamp(16px,2vw,28px);
  border-left:1px solid var(--color-line);
}
.infobar li:first-child{ border-left:0; }
.infobar strong{
  display:block; font-size:clamp(17px,1.7vw,21px); font-weight:300;
  letter-spacing:-.03em; line-height:1.1;
}
.infobar span{ display:block; margin-top:5px; font-size:13.5px; color:var(--color-text-secondary); }
@media (max-width:820px){
  .infobar{ grid-template-columns:1fr 1fr; margin-top:0; }
  .infobar li:nth-child(odd){ border-left:0; }
  .infobar li:nth-child(n+3){ border-top:1px solid var(--color-line); }
}

/* --- sekce KOLIK DALŠÍCH POKUSŮ --- */
/* Horní textová část jde přes celou šířku wrapperu, stejně jako
   panel s kroky pod ní. Žádný úzký levý sloupec. */
.attempts__head{ max-width:none; margin-bottom:clamp(30px,3.6vw,48px); }
.attempts__head .h2{
  max-width:1200px; width:100%;
  font-size:clamp(2.6rem,6vw,5.4rem); line-height:1.0;
}
.attempts__head .lead{ margin-top:clamp(18px,2vw,26px); max-width:860px; }
.attempts{
  display:grid; grid-template-columns:repeat(5,1fr); gap:0;
  border-top:1px solid var(--color-line);
}
.attempt{
  padding:clamp(24px,3vw,38px) clamp(14px,1.6vw,26px) clamp(24px,3vw,34px) 0;
  border-left:1px solid var(--color-line);
  padding-left:clamp(14px,1.6vw,26px);
}
.attempt:first-child{ border-left:0; padding-left:0; }
.attempt__n{
  display:block; font-size:13px; font-weight:300; letter-spacing:.12em;
  color:var(--color-text-secondary); font-variant-numeric:tabular-nums; margin-bottom:14px;
}
.attempt__t{
  position:relative; display:inline-block;
  font-size:clamp(18px,1.9vw,24px); font-weight:300; letter-spacing:-.03em;
  line-height:1.2; color:var(--color-text-secondary);
}
.attempt__strike{
  position:absolute; left:-6px; right:-6px; top:0; width:calc(100% + 12px); height:100%;
  color:var(--color-brand-2); overflow:visible; pointer-events:none;
}
.attempt__strike path{ stroke-dasharray:220; stroke-dashoffset:220; }
.attempts.is-in .attempt__strike path{
  animation:strike .7s var(--ease) forwards;
}
.attempts.is-in .attempt:nth-child(1) .attempt__strike path{ animation-delay:.1s; }
.attempts.is-in .attempt:nth-child(2) .attempt__strike path{ animation-delay:.28s; }
.attempts.is-in .attempt:nth-child(3) .attempt__strike path{ animation-delay:.46s; }
.attempts.is-in .attempt:nth-child(4) .attempt__strike path{ animation-delay:.64s; }
@keyframes strike{ to{ stroke-dashoffset:0; } }

.attempt--now{ background:var(--color-brand-6); }
.attempt--now .attempt__n{ color:var(--color-black); }
.attempt--now .attempt__t{ color:var(--color-black); font-weight:300; font-size:clamp(20px,2.1vw,27px); }
.attempt--now .btn{ margin-top:20px; width:100%; }
@media (prefers-reduced-motion: reduce){
  .attempt__strike path{ stroke-dashoffset:0; animation:none!important; }
}
@media (max-width:900px){
  .attempts{ grid-template-columns:1fr; border-top:0; }
  .attempt{
    border-left:2px solid var(--color-line); border-top:0;
    padding:18px 0 18px 22px; margin-left:2px;
    display:flex; align-items:baseline; gap:14px; flex-wrap:wrap;
  }
  .attempt:first-child{ border-left:2px solid var(--color-line); padding-left:22px; }
  .attempt__n{ margin-bottom:0; }
  .attempt--now{ border-left-color:var(--color-black); padding:22px; margin-left:0; }
  .attempt--now .btn{ width:auto; margin-top:14px; }
}

/* --- celoplošné typografické momenty --- */
.statementband{ background:var(--color-brand-1); color:var(--color-black); padding-block:clamp(46px,6vw,86px); }
.statementband--alt{ background:var(--color-brand-6); color:var(--color-black); }
.statementband__text{
  font-family:var(--font-display); font-weight:300;
  font-size:clamp(2.2rem,4.4vw,4.6rem); letter-spacing:-.03em;
  line-height:1.1; max-width:24ch;
}
.statementband__text em{ font-style:normal; font-weight:300; }

/* --- pomalu plynoucí pruh --- */
@keyframes marquee{ from{ transform:translateX(0) } to{ transform:translateX(-50%) } }
@media (prefers-reduced-motion: reduce){ .marquee__track{ animation:none; } }
@media (max-width:760px){ .marquee__track{ animation:none; width:100%; } .marquee__track span:nth-child(n+2){ display:none; } }

/* --- celoplošný fotografický blok --- */
.fullshot{
  position:relative; isolation:isolate; display:flex; align-items:center;
  min-height:clamp(620px,72vh,760px); overflow:hidden; background:var(--color-brand-4);
}
.fullshot__bg{ position:absolute; inset:0; z-index:-2; display:block; }
.fullshot__bg img{ width:100%; height:100%; object-fit:cover; object-position:70% 44%; display:block; }
.fullshot::after{
  content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:linear-gradient(
    90deg,
    rgba(254,250,242,.97) 0%,
    rgba(254,250,242,.92) 32%,
    rgba(254,250,242,.55) 52%,
    rgba(254,250,242,.12) 76%,
    rgba(254,250,242,0) 100%);
}
.fullshot__inner{ position:relative; width:100%; padding-block:clamp(48px,6vw,80px); }
.fullshot__text{ max-width:min(600px,52%); }
.fullshot .lead{ margin-top:20px; max-width:42ch; }
.fullshot__highlight{
  margin:clamp(24px,3vw,34px) 0 clamp(26px,3vw,34px);
  font-family:var(--font-display); font-weight:300;
  font-size:clamp(1.6rem,2.6vw,2.4rem); line-height:1.1; letter-spacing:-.03em;
  padding-left:20px; border-left:1px solid currentColor; max-width:24ch;
}
@media (max-width:900px){
  .fullshot{ display:block; min-height:0; }
  .fullshot::after{ display:none; }
  .fullshot__bg{ position:relative; inset:auto; z-index:0; }
  .fullshot__bg img{ height:clamp(420px,52vh,520px); object-position:62% 30%; }
  .fullshot__text{ max-width:none; }
  .fullshot__inner{ padding-block:clamp(30px,5vw,44px); }
}

/* --- fotografie v sekci přístupu --- */
.approach{ grid-template-columns:minmax(240px,40%) 1fr; }
.approach__media{ margin:0; }
.approach__media img{ width:100%; height:auto; aspect-ratio:3/2; object-fit:cover; object-position:50% 36%; }
.approach__list{ grid-template-columns:1fr 1fr; }
@media (max-width:820px){ .approach{ grid-template-columns:1fr; } }

/* --- FAQ: tenký plus, žádné kolečko --- */
.faq__ico::before{ height:1.2px; }
.faq__ico::after{ width:1.2px; }

/* ============================================================
   v5 — KARTA PROMĚNY V HERO, PRŮBĚH, JEDNA PARTIE, SOUKROMÍ
   ============================================================ */

/* --- hero: karta s proměnou --- */
.hero__inner{ display:grid; grid-template-columns:1fr auto; gap:clamp(24px,4vw,60px); align-items:center; }
.hero__text{ max-width:min(600px,100%); }

.herocard{
  width:clamp(400px,32vw,460px); margin:0; justify-self:end; align-self:end;
  background:var(--color-brand-4); padding:12px; border-radius:2px;
  border:1px solid var(--color-line); border-top:3px solid var(--color-brand-1);
  transform:translateY(min(6vw,54px));
}
.herocard .ba{ border-radius:2px; }
.herocard img{ width:100%; height:auto; display:block; }
.herocard figcaption{ margin-top:10px; font-size:12.5px; line-height:1.4; color:var(--color-text-secondary); }

@media (max-width:1080px){
  .herocard{ width:clamp(340px,36vw,420px); transform:translateY(28px); }
}
@media (max-width:900px){
  .hero__inner{ display:block; }
  .herocard{
    width:100%; margin-top:26px; transform:none; justify-self:stretch;
    padding:10px 10px 12px;
  }
}

/* --- průběh procedury --- */
.proc__head{ max-width:none; width:100%; margin-bottom:clamp(28px,3.4vw,44px); }
.proc__head .lead{ margin-top:18px; max-width:1100px; width:100%; }
.proc__media{ margin:0 0 clamp(30px,4vw,52px); }
.proc__media img{
  width:100%; height:auto; aspect-ratio:16/7; object-fit:cover; object-position:52% 42%;
  border-radius:2px;
}
.proc{ display:grid; grid-template-columns:repeat(4,1fr); gap:0; border-top:1px solid var(--color-line); }
.proc__step{ padding:clamp(22px,2.6vw,32px) clamp(16px,2vw,28px) 6px; border-left:1px solid var(--color-line); }
.proc__step:first-child{ border-left:0; padding-left:0; }
.proc__n{
  display:block; font-size:clamp(26px,3vw,38px); font-weight:300; letter-spacing:-.03em;
  color:var(--color-brand-2); font-variant-numeric:tabular-nums; line-height:1; margin-bottom:14px;
}
.proc__step h3{ font-size:18px; font-weight:300; letter-spacing:-.03em; margin-bottom:7px; }
.proc__step p{ font-size:15.5px; color:var(--color-text-secondary); }
@media (max-width:900px){
  .proc{ grid-template-columns:1fr 1fr; }
  .proc__step:nth-child(odd){ border-left:0; padding-left:0; }
  .proc__step:nth-child(n+3){ border-top:1px solid var(--color-line); }
  .proc__media img{ aspect-ratio:3/2; }
}
@media (max-width:520px){
  .proc{ grid-template-columns:1fr; }
  .proc__step{ border-left:0; padding-left:0; }
  .proc__step + .proc__step{ border-top:1px solid var(--color-line); }
}

/* --- JEDNA PARTIE (celoplošná sekce s proměnou) --- */
.onepart{ position:relative; overflow:hidden; background:var(--color-brand-6); padding-block:clamp(56px,7vw,104px); }
.onepart__in{
  position:relative; display:grid; grid-template-columns:minmax(0,46%) minmax(0,54%);
  gap:clamp(28px,4vw,64px); align-items:center;
}
.onepart__h{
  font-size:clamp(2.2rem,3.8vw,3.6rem); line-height:1.1; letter-spacing:-.03em;
  margin-bottom:20px;
}
.onepart .lead{ max-width:46ch; margin-bottom:30px; }
.onepart__media{ margin:0; }
.onepart__media .ba{ border:1px solid var(--color-line); }
.onepart__media img{ display:block; width:100%; height:auto; }
@media (max-width:900px){
  .onepart__in{ grid-template-columns:1fr; gap:28px; }
  .onepart__text{ order:1; } .onepart__media{ order:2; }
}

/* --- přepínač partií: čistá linková navigace --- */
@media (max-width:820px){
}

/* --- galerie: modelové zkušenosti --- */
.gal__slide figcaption{ display:block; padding:20px 2px 0; }
.gal__area{
  font-size:12px; font-weight:300; letter-spacing:.12em; text-transform:uppercase;
  color:var(--color-text-secondary); margin-bottom:10px;
}
.gal__quote{
  margin:0 0 12px; font-family:var(--font-display); font-weight:300;
  font-size:clamp(1.3rem,2.1vw,1.9rem); line-height:1.1; letter-spacing:-.03em;
  max-width:44ch;
}
.gal__badge{ font-size:12.5px; color:var(--color-text-secondary); }

/* --- TADY NEMUSÍTE NIC DOKAZOVAT --- */
.privacy{ display:grid; grid-template-columns:55% 45%; gap:clamp(26px,3.6vw,60px); align-items:center; }
.privacy__media{ margin:0; }
.privacy__media img{ width:100%; height:auto; aspect-ratio:3/2; object-fit:cover; object-position:50% 40%; border-radius:2px; }
@media (max-width:820px){
  .privacy{ grid-template-columns:1fr; gap:24px; }
  .privacy__media{ order:1; } .privacy__text{ order:2; }
}


/* ============================================================
   WONDER AXON — technologické sekce
   ============================================================ */

/* --- exkluzivita ve Frýdku-Místku v hero --- */
.hero__place{
  margin-top:clamp(20px,2.4vw,28px); padding-left:18px;
  border-left:1px solid var(--color-black); max-width:44ch;
}
.hero__place-main{
  display:block; font-family:var(--font-label); font-weight:300;
  font-size:13px; letter-spacing:.12em; text-transform:uppercase;
  line-height:1.4; color:var(--color-black);
}
.hero__place-addr{
  display:block; margin-top:6px; font-size:15px; line-height:1.4;
  color:var(--color-text-secondary);
}

/* --- čtyři hlavní argumenty (velká čísla, tenké linky) --- */







/* --- ocenění --- */

.award__place{
  margin-top:clamp(22px,2.6vw,30px); padding-left:18px;
  border-left:1px solid var(--color-black);
  font-family:var(--font-display); font-weight:300;
  font-size:clamp(1.3rem,2vw,1.8rem); line-height:1.1; letter-spacing:-.03em;
  max-width:26ch;
}
.award__addr{ margin-top:8px; padding-left:19px; font-size:15px; }






/* --- tři technologie --- */
.techlist{ margin-top:clamp(40px,5vw,68px); }
.techrow{
  display:grid; grid-template-columns:auto 1.5fr 1fr;
  gap:clamp(20px,3vw,48px); align-items:start;
  padding:clamp(28px,3.4vw,44px) 0;
  border-top:1px solid var(--color-line);
}
.techrow:last-child{ border-bottom:1px solid var(--color-line); }
.techrow__n{
  font-family:var(--font-display); font-weight:300;
  font-size:clamp(2.2rem,3.4vw,3.2rem); line-height:1; letter-spacing:-.03em;
  color:var(--color-text-secondary);
}
.techrow__t{
  font-family:var(--font-display); font-weight:300;
  font-size:clamp(1.5rem,2.4vw,2.1rem); line-height:1.1; letter-spacing:-.03em;
  margin-bottom:8px;
}
.techrow__name{
  font-family:var(--font-label); font-weight:300; font-size:12.5px;
  letter-spacing:.12em; text-transform:uppercase;
  color:var(--color-text-secondary); margin-bottom:14px;
}
.techrow__d{ font-size:16.5px; line-height:1.4; color:var(--color-text-secondary); }
.techrow__benefit{
  padding-left:18px; border-left:1px solid var(--color-black);
  font-size:16.5px; line-height:1.4; color:var(--color-black);
}

/* --- proč není jen další procedura --- */
#proc-axon{ position:relative; overflow:hidden; }
.proc-axon__mark{
  position:absolute; right:clamp(16px,4vw,64px); top:clamp(16px,3vw,48px);
  width:min(160px,22vw); height:auto; aspect-ratio:210.15/336.32;
  background-color:rgba(254,250,242,.5);
  -webkit-mask:url(assets/brand/formovna-symbol.svg) no-repeat center / contain;
          mask:url(assets/brand/formovna-symbol.svg) no-repeat center / contain;
  pointer-events:none;
}
.proc-axon__h{ position:relative; max-width:18ch; }
.whygrid{
  margin-top:clamp(40px,5vw,64px);
  display:grid; grid-template-columns:repeat(3,1fr); gap:0;
  border-top:1px solid rgba(17,17,15,.28);
}
.why{
  padding:clamp(26px,2.8vw,38px) clamp(20px,2.2vw,34px);
  border-left:1px solid rgba(17,17,15,.28);
  border-bottom:1px solid rgba(17,17,15,.28);
}
.why:nth-child(3n+1){ border-left:0; padding-left:0; }
.why__n{
  display:block; font-family:var(--font-display); font-weight:300;
  font-size:clamp(1.8rem,2.6vw,2.4rem); line-height:1; letter-spacing:-.03em;
  margin-bottom:14px;
}
.why__t{
  font-family:var(--font-display); font-weight:300;
  font-size:clamp(1.25rem,1.8vw,1.6rem); line-height:1.1; letter-spacing:-.03em;
  margin-bottom:8px;
}
.why__d{ font-size:15.5px; line-height:1.4; color:rgba(17,17,15,.68); }

/* --- odborníci (skrytá sekce, styly připravené) --- */
.experts{ margin-top:clamp(34px,4vw,52px); display:grid; gap:clamp(20px,2.4vw,32px); }
.expert{ padding-left:20px; border-left:1px solid var(--color-black); max-width:60ch; }
.expert__q{
  font-family:var(--font-display); font-weight:300;
  font-size:clamp(1.3rem,2vw,1.8rem); line-height:1.1; letter-spacing:-.03em;
  margin-bottom:12px;
}
.expert__n{ font-family:var(--font-label); font-weight:300; font-size:13px;
  letter-spacing:.12em; text-transform:uppercase; }
.expert__r{ font-size:15px; color:var(--color-text-secondary); }

/* --- nápověda nad výběrem partie --- */

/* ---------- responzivita nových sekcí ---------- */
@media (max-width:1080px){
  .whygrid{ grid-template-columns:repeat(2,1fr); }
  .why:nth-child(3n+1){ border-left:1px solid rgba(17,17,15,.28); padding-left:clamp(20px,2.2vw,34px); }
  .why:nth-child(2n+1){ border-left:0; padding-left:0; }
  .award{ grid-template-columns:1fr; }
  .award__mark{ max-width:320px; }
  .techrow{ grid-template-columns:auto 1fr; }
  .techrow__benefit{ grid-column:2; }
}
@media (max-width:640px){
  .whygrid{ grid-template-columns:1fr; }
  .why{ border-left:0!important; padding-left:0!important; padding-right:0; }
  .techrow{ grid-template-columns:1fr; gap:14px; }
  .techrow__n{ font-size:2rem; }
  .techrow__benefit{ grid-column:1; }
  .proc-axon__mark{ width:96px; opacity:.7; }
  .hero__place{ max-width:none; }
}



/* ============================================================
   ŽLUTOZELENÁ JAKO HLAVNÍ BARVA WEBU
   Poměr ploch: #fefaf2 ~35 %, #f6f5ee ~20 %, #d9d3a4 ~20 %,
   #ebe7cb ~15 %, #e9dfd0 ~8 %, #d3baaa max ~2 %.
   ============================================================ */

/* pruh s informacemi: žlutozelený podklad, tenké svislé linky,
   žádná plovoucí karta, žádný stín, bez zaoblení */

/* sekce ocenění: žlutozelená plocha s jemnějším pruhem pod pohárem */
#oceneni{ position:relative; overflow:hidden; }

#oceneni .wrap{ position:relative; z-index:1; }

/* aktivní partie žlutozeleně */


@media (max-width:1080px){
  #oceneni::after{ display:none; }
}

/* ---------- ikony v sekci „Proč WONDER® AXON" ----------
   Jedna sada, jednotná tloušťka linky, currentColor, bez kruhů
   a bez barevných podkladů. */
.why__ico{ display:block; margin-bottom:clamp(14px,1.8vw,20px); color:var(--color-black); }
.why__ico svg{ width:clamp(38px,4vw,58px); height:auto; display:block; }
.why__n{ font-size:clamp(1.4rem,1.8vw,1.7rem); color:rgba(17,17,15,.55); margin-bottom:10px; }

/* Open Sans má jiné proporce než původní nadpisové písmo. Po zmenšení
   řádkování na 1.02 potřebují nadpisy zřetelnější odstup od textu. */
.h-display + .lead,
.h-display + p,
.h2 + .lead,
.h2 + p{ margin-top:clamp(18px,2vw,26px); }
.split__head .h-display{ margin-bottom:0; }
.award__text .lead{ margin-top:clamp(18px,2vw,26px); }

/* ============================================================
   SEKCE „TECHNOLOGIE, KTERÁ MĚNÍ PRAVIDLA FORMOVÁNÍ"
   Dva sloupce, oba začínají ve stejné výšce. Žádné vertikální
   centrování, žádná pevná výška, žádné prázdné místo nad
   prvním bodem.
   ============================================================ */

@media (max-width:1024px){
}

/* ============================================================
   OCENĚNÍ — jeden propojený blok, ne tvrdé dělení 50/50.
   Levý text ~62 %, pravý panel s oceněním ~38 %.
   ============================================================ */
.award{
  display:grid; grid-template-columns:62% 38%;
  gap:clamp(28px,4vw,64px); align-items:start;
}
.award__text .h2{ max-width:15ch; }
.award__panel{
  background:var(--color-brand-4);
  border:1px solid var(--color-line);
  border-radius:2px; box-shadow:none;
  padding:clamp(24px,3vw,40px) clamp(20px,2.4vw,32px);
  text-align:center;
}
.award__badge{
  display:block; width:clamp(180px,20vw,260px); height:auto;
  object-fit:contain; margin:0 auto clamp(16px,2vw,24px);
}
.award__badge-name{
  font-weight:600; font-size:12.5px; letter-spacing:.12em;
  text-transform:uppercase; line-height:1.5;
}
.award__badge-year{
  font-weight:300; font-size:clamp(1.6rem,2.2vw,2rem);
  line-height:1; letter-spacing:-.04em; margin-top:6px;
}
.award__badge-cat{
  margin-top:14px; padding-top:14px;
  border-top:1px solid var(--color-line);
  font-size:13.5px; line-height:1.5; color:var(--color-text-secondary);
}

@media (max-width:1024px){
  .award{ grid-template-columns:1fr; }
  .award__panel{ max-width:360px; }
  .award__text .h2{ max-width:none; }
}

/* poslední aktivní krok odlišený odstínem, ne stejnou barvou jako sekce */
.attempt--now{ background:var(--color-brand-6); }

/* ============================================================
   ODBORNÉ ZDROJE — tři publikace, zjednodušená podoba (v53)
   Každá karta: typ zdroje, nadpis, krátký text, odkaz.
   ============================================================ */
.docs__head{ max-width:1100px; }
.docs__head .lead{ max-width:70ch; }
.docs__note{
  margin-top:16px; max-width:70ch;
  font-size:15px; line-height:1.5; font-weight:400;
  color:rgba(17,17,15,.72);
}
.pubs{
  margin:clamp(36px,4.5vw,56px) 0 0; padding:0; list-style:none;
  display:grid; grid-template-columns:repeat(3, minmax(0,1fr));
  gap:clamp(16px,2vw,28px); align-items:stretch;
}
.pub{
  display:flex; flex-direction:column; min-width:0;
  padding:clamp(24px,2.4vw,34px);
  background:var(--color-brand-4);
  border:1px solid var(--color-line); border-radius:2px;
}
.pub__type{
  margin-bottom:14px;
  font-family:var(--font-label); font-weight:600; font-size:11px; line-height:1.4;
  letter-spacing:.1em; text-transform:uppercase; color:var(--color-text-secondary);
}
.pub__name{
  font-family:var(--font-display); font-weight:300;
  font-size:clamp(1.3rem,1.7vw,1.6rem); line-height:1.2; letter-spacing:-.02em;
}
.pub__desc{
  margin:14px 0 26px;
  font-size:15px; line-height:1.55; font-weight:400; color:rgba(17,17,15,.78);
}
.pub__link{
  margin-top:auto; align-self:flex-start;
  display:inline-flex; align-items:center; gap:8px; min-height:44px;
  font-family:var(--font-label); font-weight:600; font-size:12px; letter-spacing:.08em;
  text-transform:uppercase; color:var(--color-black); text-decoration:none;
  border-bottom:1px solid var(--color-line);
}
.pub__link:hover{ border-bottom-color:var(--color-black); }
.pub__link:focus-visible{ outline:2px solid var(--color-black); outline-offset:3px; }
.pub__ext{ flex:0 0 auto; }
.docs__result{
  margin-top:24px;
  font-size:13.5px; line-height:1.5; font-weight:400; color:var(--color-text-secondary);
}

/* tablet a mobil: karty pod sebou */
@media (max-width:860px){ .pubs{ grid-template-columns:1fr; } }

/* Na úzkých displejích potřebují české háčky a čárky o něco víc
   místa mezi řádky, jinak se dotýkají dolních dotažnic nad nimi. */
@media (max-width:700px){
  .h-display{ line-height:1.08; }
  .attempts__head .h2{ line-height:1.06; }
}

/* ============================================================
   PŘECHOD DO REZERVAČNÍHO SYSTÉMU
   Nahrazuje vypnutý vložený kalendář. Design zůstává Formovny.
   ============================================================ */
.bookgo{ text-align:left; }
.bookgo__eyebrow{
  font-family:var(--font-label); font-weight:600; font-size:12.5px;
  letter-spacing:.12em; text-transform:uppercase;
  color:var(--color-text-secondary); margin-bottom:16px;
}
.bookgo__title{
  font-weight:300; font-size:clamp(1.6rem,2.6vw,2.3rem);
  line-height:1.1; letter-spacing:-.04em; margin-bottom:12px;
}
.bookgo__lead{
  font-size:16.5px; line-height:1.5; color:var(--color-text-secondary);
  max-width:38ch; margin-bottom:clamp(24px,3vw,32px);
}
.bookgo__cta{ width:100%; }
.bookgo__note{
  margin-top:16px; font-size:13.5px; line-height:1.5;
  color:var(--color-text-secondary);
}
@media (min-width:560px){
  .bookgo__cta{ width:auto; }
}

/* ============================================================
   ÚPRAVY PODLE ZADÁNÍ 10/9
   ============================================================ */

/* Technologická sekce: oba sloupce začínají nahoře.
   .split má jinde align-items:end, tady by vznikla prázdná plocha. */
#technologie .split{ align-items:start; }
#technologie .split__body{ padding-bottom:0; }
#technologie .split__head .h2{ margin-bottom:0; }

/* ---------- informační panel: krátký nadpis, menší vysvětlení ---------- */
.infobar li{ display:flex; flex-direction:column; }
.infobar strong{
  font-size:clamp(16px,1.5vw,19px); font-weight:600; letter-spacing:-.02em;
  line-height:1.25; margin-bottom:8px;
}
.infobar span{ font-size:13.5px; line-height:1.5; }

/* ---------- lišta s tématy (pod hlavičkou) ---------- */
.ticker{
  background:var(--color-brand-1);
  color:#11110f;
  border-top:1px solid rgba(17,17,15,.16);
  border-bottom:1px solid rgba(17,17,15,.16);
  overflow:hidden; overflow:clip;   /* clip: prohlížeč lištu sám neposouvá */
  position:relative;
}
/* Hlavička je position:fixed, lišta proto začíná přesně pod ní, aby ji
   hlavička nepřekryla. Výška hlavičky nahoře = 2 × 24 px odsazení
   + 2 × 10 px ochranná zóna loga + 1 px linka + výška loga
   (šířka loga clamp(200px,15vw,238px) × poměr 123/804).
   Při změně velikosti loga nebo odsazení hlavičky upravte i tento výpočet. */
.ticker--top{ margin-top:calc(69px + clamp(200px,15vw,238px) * 123 / 804); }

.ticker__viewport{
  display:flex; width:max-content;
  animation:tickerRun 64s linear infinite;
}
.ticker:hover .ticker__viewport,
.ticker:focus-within .ticker__viewport{ animation-play-state:paused; }
/* Ovládání klávesnicí: lišta se vrátí do výchozí polohy, aby zaostřený
   odkaz nebyl mimo obrazovku; prohlížeč k němu lištu sám posune. */
.ticker:has(.ticker__link:focus-visible) .ticker__viewport{
  animation:none; width:100%; overflow-x:auto; scrollbar-width:none;
}
.ticker:has(.ticker__link:focus-visible) .ticker__track--copy{ display:none; }
.ticker__viewport::-webkit-scrollbar{ display:none; }

.ticker__track{
  display:flex; align-items:stretch; flex:0 0 auto;
  min-width:100vw;                 /* ani na širokém monitoru nevznikne mezera ve smyčce */
  justify-content:space-around;
  margin:0; padding:0; list-style:none;
}
.ticker__track li{ display:flex; }
.ticker__link{
  display:flex; align-items:center;
  min-height:52px;
  padding:0 clamp(22px,2.4vw,34px);
  font-family:"Open Sans", Arial, sans-serif; font-weight:600;
  font-size:12.5px; line-height:1.3; letter-spacing:.09em;
  text-transform:uppercase; white-space:nowrap;
  color:#11110f; text-decoration:none;
  border-left:1px solid rgba(17,17,15,.22);     /* jemná svislá linka mezi položkami */
}
.ticker__link:hover{ text-decoration:underline; text-underline-offset:4px; }
.ticker__link:focus-visible{ outline:2px solid #11110f; outline-offset:-6px; }
@keyframes tickerRun{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }

/* Hero pod lištou: bez dvojího odsazení kvůli fixní hlavičce. */
.ticker--top + .hero{ padding-top:clamp(24px,4vh,48px); }

/* Dotyková zařízení, tablet na výšku a mobil: žádný automatický pohyb.
   Lišta je statická, posouvá se prstem, bez viditelného posuvníku. */
@media (max-width:900px), (hover:none){
  .ticker__viewport{
    animation:none; width:100%;
    overflow-x:auto; overscroll-behavior-x:contain;
    scrollbar-width:none; -webkit-overflow-scrolling:touch;
  }
  .ticker__viewport::-webkit-scrollbar{ display:none; }
  .ticker__track{ min-width:0; justify-content:flex-start; }
  .ticker__track--copy{ display:none; }
  .ticker__link{ min-height:48px; padding:0 18px; font-size:12px; }
  .ticker__track li:first-child .ticker__link{ border-left:0; }
}
@media (max-width:900px){
  .ticker--top + .hero{ padding-top:0; }
}

/* Omezení animací: pohyb vypnout, jedna sada odkazů, ruční posun. */
@media (prefers-reduced-motion: reduce){
  .ticker__viewport{
    animation:none; width:100%;
    overflow-x:auto; scrollbar-width:none;
  }
  .ticker__viewport::-webkit-scrollbar{ display:none; }
  .ticker__track{ min-width:0; justify-content:flex-start; }
  .ticker__track--copy{ display:none; }
}

/* Kotvy z lišty: cílový obsah nesmí zůstat pod fixní hlavičkou
   (po odscrollování má 78 px). */
#aktivace-svalu,
#rychla-regenerace,
#paleni-tuku,
#technologie,
#proc-axon,
#odbornici{ scroll-margin-top:110px; }

/* ---------- nová sekce „Která partie vás štve" ---------- */
.partie{
  display:grid; grid-template-columns:1fr 1fr;
  gap:clamp(28px,4vw,72px); align-items:center;
}
.partie__text .lead{ max-width:52ch; margin-top:clamp(18px,2vw,26px); }
.partie__media img{
  display:block; width:100%; height:auto;
  aspect-ratio:4/5; object-fit:cover; object-position:50% 30%;
  border-radius:2px;
}
@media (max-width:900px){
  .partie{ grid-template-columns:1fr; }
  .partie__media{ order:-1; }
  .partie__media img{ aspect-ratio:4/3; }
}

/* ---------- otázky místo odrážek ---------- */
.qlist{
  margin:clamp(26px,3vw,36px) 0 0; padding:0; list-style:none;
  border-top:1px solid var(--color-line);
}
.qlist__i{
  display:grid; grid-template-columns:auto 1fr;
  gap:clamp(14px,2vw,24px); align-items:baseline;
  padding:clamp(14px,1.8vw,20px) 0;
  border-bottom:1px solid var(--color-line);
}
.qlist__n{
  font-weight:300; font-size:clamp(1.3rem,1.8vw,1.7rem);
  line-height:1; letter-spacing:-.04em; color:var(--color-text-secondary);
}
.qlist__q{
  font-size:clamp(16px,1.4vw,18px); font-weight:400;
  line-height:1.4; color:var(--color-black); margin:0;
}

/* ---------- benefity soukromí s ikonami ---------- */
.benefs{ margin-top:clamp(26px,3vw,36px); display:grid; gap:clamp(16px,2vw,22px); list-style:none; padding:0; }
.benef{ display:grid; grid-template-columns:auto 1fr; gap:16px; align-items:center; }
.benef__ico{ display:block; color:var(--color-black); }
.benef__ico svg{ display:block; width:clamp(32px,3.4vw,44px); height:auto; }
.benef__t{ font-size:16.5px; line-height:1.4; font-weight:400; }

/* ---------- úvod nad čtyřmi body procedury ---------- */
.procintro{
  width:100%; max-width:none; margin:clamp(40px,5vw,64px) 0 clamp(28px,3.4vw,40px);
}
.procintro__h{
  font-weight:300; font-size:clamp(2rem,3.6vw,3.2rem);
  line-height:1.05; letter-spacing:-.04em; margin-bottom:14px;
}
.procintro__d{ font-size:clamp(16px,1.4vw,18.5px); line-height:1.5; color:var(--color-text-secondary); width:100%; max-width:none; }
.procintro__q{
  margin-top:18px; padding-left:18px; border-left:1px solid var(--color-black);
  font-size:clamp(16px,1.5vw,19px); font-weight:600; line-height:1.4; max-width:none;
}

/* ============================================================
   ÚPRAVY PODLE ZADÁNÍ Z 12. 9.
   ============================================================ */

/* --- 2) menší nadpis v sekci u zrcadla --- */
.mirror__heading{
  font-size:clamp(2rem, 2.8vw, 3.1rem);
  line-height:1.08;
  letter-spacing:-.035em;
  max-width:26ch;
  text-wrap:balance;          /* zabrání osamocenému slovu na konci */
}
@media (max-width:900px){
  .mirror__heading{ font-size:clamp(2rem, 8vw, 2.5rem); max-width:none; }
}

/* --- 3) otazník místo čísel u otázek --- */
.qlist__icon{
  display:block; color:var(--color-text-secondary);
  flex:0 0 auto; line-height:0;
}
.qlist__icon svg{ width:clamp(26px,2.2vw,32px); height:auto; display:block; }
/* ikony i texty začínají ve stejné svislé ose */
.qlist__i{ align-items:start; }
.qlist__q{ padding-top:2px; }

/* --- 4) zvýrazněná věta pod otázkami --- */
.mirror .pullquote--sm{
  width:100%; max-width:none;
  font-size:clamp(1.2rem, 1.55vw, 1.5rem);
  line-height:1.3;
}

/* --- 5) nadpis sekce procedury na jednom řádku --- */
.proc__heading{
  font-size:clamp(2.5rem, 4.3vw, 4.8rem);
  line-height:1.03;
}
@media (min-width:901px){
  .proc__heading{ white-space:nowrap; }
}

/* --- 7) tři texty bloku „Pouhých 25 minut" každý na svém řádku --- */
@media (min-width:1100px){
  .procintro__h,
  .procintro__d,
  .procintro__q{ white-space:nowrap; }
}

/* --- 8) fajfka místo čísel u čtyř výsledků --- */
.proc__check{
  display:block; color:var(--color-black);
  margin-bottom:clamp(12px,1.4vw,18px); line-height:0;
}
.proc__check svg{ width:clamp(28px,2.4vw,34px); height:auto; display:block; }

/* --- 9) patička: jedna souvislá plocha #E8E3C6 --- */
/* Barva #E8E3C6 je pro patičku výslovně schválená klientkou (zadání
   „Oprava patičky"). Za logem není žádná karta ani odlišný panel. */
.ftr{ background-color:#E8E3C6; }
.ftr__grid,
.ftr__brand,
.ftr__col,
.ftr__bottom{ background:transparent; }
.ftr__bottom{ border-top:1px solid rgba(17,17,15,.14); }

/* Širší značkový sloupec jen na desktopu — na mobilu platí
   mřížka z pravidel výše (2 sloupce pod 900 px, 1 pod 560 px). */
@media (min-width:901px){
  .ftr__grid{ grid-template-columns:2.4fr 1fr 1fr 1fr; }
}
@media (max-width:900px){
  /* logo a slogan přes celou šířku nad odkazy */
  .ftr__brand{ grid-column:1 / -1; }
}
.ftr__logo{
  width:min(100%, 430px); height:auto;
  object-fit:contain; display:block;
}
.ftr__claim{
  margin-top:28px;
  max-width:34ch;
  color:#11110f;
  font-family:"Open Sans", Arial, Helvetica, sans-serif;
  font-size:clamp(15px, 1.15vw, 18px);
  font-weight:400;
  line-height:1.55;
}
@media (max-width:900px){
  .ftr__logo{ width:min(100%, 340px); }
}


/* ============================================================
   CENÍK — MODERNIZACE (v48)
   Hlavní doporučenou nabídkou je Měsíční říjnová výzva.
   Zvýraznění: šířka sloupce, barva, rámeček, typografie, černé CTA.
   Bez transform:scale, bez stínů, bez gradientů, zaoblení max. 2 px.
   ============================================================ */
#cenik .pricing__wrap{
  width:min(100% - 48px, 1600px);
  max-width:none; padding-inline:0; margin-inline:auto;
}
/* Úvod a texty pod kartami drží stejnou levou osu jako ostatní sekce,
   široký je jen pás s kartami. */
#cenik .pricing__intro,
#cenik .pricing__wrap > .disclaimer,
#cenik .pricing__wrap > .kicker{
  padding-inline:max(0px, var(--gutter) - 24px, calc((100% - var(--wrap)) / 2 + var(--gutter)));
}
#cenik .pricing__wrap > .disclaimer,
#cenik .pricing__wrap > .kicker{ box-sizing:content-box; }   /* max-width platí jen pro text */
.pricing__lead{ margin-top:18px; }
.pricing__lead strong{
  display:block; margin-top:8px;
  font-weight:600; color:var(--color-black);
}

#plans{
  display:grid;
  grid-template-columns:
    minmax(0, .9fr)
    minmax(0, .95fr)
    minmax(0, 1fr)
    minmax(0, 1.18fr)
    minmax(0, 1fr);
  gap:14px;
  align-items:stretch;
  margin-top:clamp(40px, 5vw, 64px);
}

.plan{
  position:relative;
  display:flex; flex-direction:column;
  min-width:0;
  padding:26px 20px 22px;
  background:var(--color-brand-4);
  border:1px solid rgba(17,17,15,.16);
  border-radius:2px;
  color:var(--color-black);
}

/* 1) typ programu */
.plan__flag{
  display:block; margin-bottom:12px;
  font-family:var(--font-label); font-weight:600; font-size:10.5px; line-height:1.3;
  letter-spacing:.1em; text-transform:uppercase;
  color:var(--color-text-secondary);
}
/* 2) název */
.plan__name{
  font-family:var(--font-display); font-weight:300;
  font-size:clamp(1.25rem, 1.45vw, 1.6rem); line-height:1.12; letter-spacing:-.02em;
}
/* 3) počet vstupů */
.plan__visits{
  margin-top:8px;
  font-family:var(--font-label); font-weight:600; font-size:11.5px;
  letter-spacing:.1em; text-transform:uppercase;
}
/* 4) cena */
.plan__pricebox{ margin-top:18px; padding-top:16px; border-top:1px solid rgba(17,17,15,.16); }
.plan__price{
  font-family:var(--font-display); font-weight:300;
  font-size:clamp(1.9rem, 2.2vw, 2.45rem); line-height:1; letter-spacing:-.03em;
  font-variant-numeric:tabular-nums; white-space:nowrap;
}
.plan__per{ margin-top:6px; font-size:13px; line-height:1.4; font-weight:400; color:var(--color-text-secondary); }
.plan__save{
  display:inline-block; margin-top:10px; padding:4px 8px;
  background:var(--color-brand-6); border-radius:2px;
  font-family:var(--font-label); font-weight:600; font-size:10.5px;
  letter-spacing:.08em; text-transform:uppercase; white-space:nowrap;
}
.plan__validity{ margin-top:6px; font-size:13px; color:var(--color-text-secondary); }

/* 5) stručné vysvětlení, 6) nejdůležitější výhody */
.plan__text{ margin-top:16px; font-size:14px; line-height:1.5; font-weight:400; color:var(--color-text-secondary); }
.plan__list{ margin:14px 0 0; padding:0; list-style:none; display:grid; gap:8px; }
.plan__list li{
  position:relative; padding-left:18px;
  font-size:13.5px; line-height:1.45; font-weight:400; color:rgba(17,17,15,.8);
}
.plan__list li::before{
  content:""; position:absolute; left:0; top:.72em;
  width:9px; height:1px; background:currentColor;
}

/* argument Startovací proměny směrem k Měsíční výzvě */
.plan__compare{
  display:flex; align-items:flex-start; gap:8px;
  margin-top:16px; padding-top:12px; border-top:1px solid rgba(17,17,15,.16);
  font-size:13.5px; line-height:1.45; font-weight:600; color:var(--color-black);
}
.plan__arrow{ flex:0 0 auto; margin-top:1px; color:var(--color-black); }

/* rozbalovací podrobnosti */
.plan__details{ margin-top:auto; padding-top:16px; }
.plan__more{
  display:inline-flex; align-items:center; min-height:44px; padding:0;
  background:none; border:0; cursor:pointer; color:var(--color-black);
  font-family:var(--font-label); font-weight:600; font-size:11px;
  letter-spacing:.09em; text-transform:uppercase;
  text-decoration:underline; text-underline-offset:5px; text-decoration-thickness:1px;
}
.plan__more:hover{ text-decoration-thickness:2px; }
.plan__detail .plan__text:first-child{ margin-top:4px; }
.plan__freq{
  margin-top:12px;
  font-family:var(--font-label); font-weight:600; font-size:11px; line-height:1.5;
  letter-spacing:.08em; text-transform:uppercase;
}
.plan__upsell{
  margin-top:14px; padding:12px 14px;
  background:var(--color-brand-6); border-radius:2px;
  font-size:13.5px; line-height:1.45; font-weight:400;
}

/* 7) CTA na společné spodní ose */
.plan__foot{ margin-top:auto; padding-top:14px; }
.plan__details + .plan__foot{ margin-top:0; }
.plan__ctanote{ margin-bottom:10px; font-size:12.5px; line-height:1.4; font-weight:600; }
#cenik .plan .plan__cta{
  width:100%; min-height:52px; padding:14px 12px;
  font-size:12.5px; letter-spacing:.06em;
  background:var(--color-brand-1); color:var(--color-black); border-color:transparent;
}
#cenik .plan .plan__cta:hover{ background:var(--color-brand-6); color:var(--color-black); }

/* ---------- Měsíční říjnová výzva ---------- */
.plan--featured{
  padding:25px 23px 21px;              /* + 2px rámeček = stejná spodní osa CTA */
  background:var(--color-brand-1);
  border:2px solid var(--color-black);
}
.plan__recommendation{ display:flex; flex-wrap:wrap; gap:6px; margin-bottom:18px; }
.plan__recommendation span{
  display:inline-flex; align-items:center; min-height:28px; padding:5px 9px;
  background:var(--color-black); color:var(--color-brand-4); border-radius:0;
  font-family:var(--font-label); font-size:10px; font-weight:600; line-height:1.2;
  letter-spacing:.08em; text-transform:uppercase;
}
.plan--featured .plan__flag{ color:var(--color-black); }
.plan--featured .plan__name{ font-size:clamp(1.55rem, 1.85vw, 2.05rem); font-weight:400; }
.plan--featured .plan__pricebox{ border-top-color:rgba(17,17,15,.25); }
.plan--featured .plan__price{ font-size:clamp(2.5rem, 3vw, 3.3rem); }
.plan--featured .plan__per,
.plan--featured .plan__text{ color:rgba(17,17,15,.74); }
.plan--featured .plan__list li{ color:rgba(17,17,15,.86); }
.plan--featured .plan__save,
.plan--featured .plan__upsell{ background:var(--color-brand-4); }
.plan__value{
  margin-block:18px 0;
  padding:14px 0;
  border-top:1px solid rgba(17,17,15,.25);
  border-bottom:1px solid rgba(17,17,15,.25);
}
.plan__value strong{ display:block; font-size:16px; line-height:1.35; font-weight:600; }
.plan__value span{ display:block; margin-top:5px; font-size:13px; line-height:1.4; font-weight:400; }
#cenik .plan--featured .plan__cta{ background:var(--color-black); color:var(--color-brand-4); }
#cenik .plan--featured .plan__cta:hover{ background:rgba(17,17,15,.82); color:var(--color-brand-4); }

/* Akční vstup: menší důraz */
.plan--akcni-vstup .plan__price{ font-size:clamp(1.75rem, 2vw, 2.2rem); }

/* Od 1280 px: pět karet v řádku, názvy běžných karet na stejné výšce */
@media (min-width:1280px){
  .plan:not(.plan--featured) .plan__name{ min-height:2.24em; }
}
/* nejužší desktop: typ programu může mít dva řádky, názvy zůstanou v řadě */
@media (min-width:1280px) and (max-width:1439px){
  .plan:not(.plan--featured) .plan__flag{ min-height:2.6em; }
}

/* 900–1279 px: doporučená karta první a vedle ní Startovací proměna,
   ve druhém řádku tři menší karty. */
@media (max-width:1279px){
  #plans{ grid-template-columns:repeat(6, minmax(0,1fr)); }
  #plans .plan{ grid-column:span 2; }
  #plans .plan--mesicni-rijnova-vyzva{ grid-column:span 3; order:1; }
  #plans .plan--startovaci-promena{ grid-column:span 3; order:2; }
  #plans .plan--akcni-vstup{ order:3; }
  #plans .plan--jednorazovy-vstup{ order:4; }
  #plans .plan--trimesicni-promena{ order:5; }
  .plan__arrow{ display:none; }          /* sousední karta už není vpravo */
}
/* 680–899 px: nejvýš dvě karty vedle sebe, doporučená přes celou šířku */
@media (max-width:899px){
  #plans{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  #plans .plan,
  #plans .plan--startovaci-promena{ grid-column:span 1; }
  #plans .plan--mesicni-rijnova-vyzva{ grid-column:1 / -1; }
}
/* pod 680 px: jedna karta v řádku, pořadí 1) Měsíční výzva
   2) Startovací 3) Akční 4) Jednorázový 5) 3měsíční */
@media (max-width:679px){
  #cenik .pricing__wrap{ width:min(100% - 40px, 1600px); }
  #plans{ grid-template-columns:1fr; gap:12px; }
  #plans .plan,
  #plans .plan--mesicni-rijnova-vyzva{ grid-column:1 / -1; }
  .plan{ padding:24px 20px 20px; }
  .plan--featured{ padding:23px 19px 19px; }
}

/* ============================================================
   O NÁS — TÝM FORMOVNY (v48)
   Sekce se zobrazí až se skutečnou fotografií (config.js → team).
   ============================================================ */
.about[hidden],
[data-team-nav][hidden],
.about__video[hidden]{ display:none !important; }

.about{ background:var(--color-brand-3); }   /* #e9dfd0, sousedé #f6f5ee a #ebe7cb */
#o-nas{ scroll-margin-top:110px; }

.about__layout{
  display:grid;
  grid-template-columns:minmax(0, 56fr) minmax(0, 44fr);
  gap:clamp(36px, 5vw, 80px);
  align-items:center;
}
.about__media{ margin:0; }
.about__media picture{ display:block; }
.about__img{ display:block; width:100%; height:auto; border-radius:2px; }
.about__names{
  display:flex; flex-wrap:wrap; gap:8px 32px; margin-top:14px;
  font-family:var(--font-label); font-weight:600; font-size:12.5px;
  letter-spacing:.1em; text-transform:uppercase;
}
.about__role{
  display:block; margin-top:3px;
  font-weight:400; font-size:13px; letter-spacing:0; text-transform:none;
  color:var(--color-text-secondary);
}
.about__heading{ font-size:clamp(2.2rem, 3.6vw, 3.8rem); }
.about__content .lead{ margin-top:22px; }
.about__highlight{
  margin:26px 0 32px; padding-left:18px;
  border-left:1px solid var(--color-black);
  font-size:clamp(18px, 1.6vw, 22px); line-height:1.45; font-weight:400;
}
.about .btn--primary{ background:var(--color-black); color:var(--color-brand-4); }
.about .btn--primary:hover{ background:rgba(17,17,15,.82); color:var(--color-brand-4); }

/* budoucí video: 16:9, poster, tlačítko „Přehrát video" */
.about__video{ margin-top:clamp(48px, 6vw, 88px); }
.about__videoframe{ position:relative; aspect-ratio:16 / 9; background:var(--color-brand-1); border-radius:2px; overflow:hidden; }
.about__videoel{ display:block; width:100%; height:100%; object-fit:cover; }
.about__play{
  position:absolute; left:50%; top:50%; transform:translate(-50%, -50%);
  display:inline-flex; align-items:center; gap:10px;
  min-height:52px; padding:14px 24px;
  background:var(--color-black); color:var(--color-brand-4);
  border:0; border-radius:2px; cursor:pointer;
  font-family:var(--font-label); font-weight:600; font-size:13px;
  letter-spacing:.08em; text-transform:uppercase;
}
.about__play:hover{ background:rgba(17,17,15,.82); }

@media (max-width:900px){
  .about__layout{ grid-template-columns:1fr; gap:28px; }
  .about .btn{ width:100%; }
}

/* ---------- navigace s položkou „O nás" (v48) ----------
   Platí jen tehdy, když je „O nás" zapnuté (config.js → team).
   Logo se nezmenšuje, odkazy se nezalamují, mezery jsou mírně menší
   a mobilní menu se zapne dřív (do 1200 px), aby CTA zůstalo viditelné. */
.nav__list a, .nav__cta{ white-space:nowrap; }
.hdr__in:has([data-team-nav]:not([hidden])){ gap:clamp(28px, 3vw, 44px); }
.nav:has([data-team-nav]:not([hidden])){ gap:clamp(16px, 1.6vw, 24px); }
.nav:has([data-team-nav]:not([hidden])) .nav__list{ gap:clamp(12px, 1.1vw, 16px); }

@media (min-width:1081px) and (max-width:1200px){
  .hdr:has([data-team-nav]:not([hidden])) .burger{ display:block; }
  .hdr:has([data-team-nav]:not([hidden])) .nav{
    position:fixed; top:0; right:0; bottom:0; width:min(88vw,380px);
    background:var(--color-brand-4); z-index:75;
    flex-direction:column; align-items:stretch; justify-content:flex-start;
    gap:0; padding:96px 32px 40px;
    transform:translateX(102%); visibility:hidden;
    transition:transform .42s var(--ease), visibility 0s linear .42s;
    overflow-y:auto;
  }
  .hdr:has([data-team-nav]:not([hidden])) .nav.is-open{
    transform:none; visibility:visible;
    transition:transform .42s var(--ease), visibility 0s linear 0s;
  }
  .hdr:has([data-team-nav]:not([hidden])) .nav__list{ flex-direction:column; align-items:stretch; gap:0; }
  .hdr:has([data-team-nav]:not([hidden])) .nav__list li{ border-bottom:1px solid var(--color-line-soft); }
  .hdr:has([data-team-nav]:not([hidden])) .nav__list a{ display:block; padding:17px 0; font-size:15px; }
  .hdr:has([data-team-nav]:not([hidden])) .nav__list a::after{ display:none; }
  .hdr:has([data-team-nav]:not([hidden])) .nav__cta{ margin-top:28px; padding:16px 24px; font-size:15px; }
}

/* „Nastavení cookies" v patičce: vypadá jako ostatní odkazy */
.ftr__cookiebtn{
  padding:0; margin:0; border:0; background:none; cursor:pointer;
  font:inherit; color:var(--color-text-secondary); text-align:left;
}
.ftr__col .ftr__cookiebtn{ font-size:15px; }
.ftr__cookiebtn:hover{ color:var(--color-black); text-decoration:underline; text-underline-offset:4px; }
.ftr__cookiebtn:focus-visible{ outline:2px solid var(--color-black); outline-offset:3px; }

/* ============================================================
   PATIČKA — firemní údaje (v54)
   ============================================================ */
.ftr__company{ display:grid; gap:11px; }
.ftr__company li{ font-size:15px; line-height:1.45; color:var(--color-text-secondary); }
.ftr__company strong{ font-weight:600; color:var(--color-black); }
.ftr__company a{ text-decoration:none; color:var(--color-text-secondary); }
.ftr__company a:hover{ color:var(--color-black); text-decoration:underline; text-underline-offset:4px; }
.ftr__bottom .ftr__legal{ max-width:90ch; color:var(--color-text-secondary); }

/* ============================================================
   PRÁVNÍ STRÁNKY — struktura a čitelnost (v54)
   ============================================================ */
.legal h2{ scroll-margin-top:110px; }
.legal p, .legal li{ line-height:1.6; }
.legal .updated{ margin-bottom:32px; }
.legal__toc{
  margin:0 0 12px; padding:20px 24px;
  background:var(--color-brand-5); border:1px solid var(--color-line); border-radius:2px;
}
.legal__toc-title, .legal__docs-title{
  font-family:var(--font-label); font-weight:600; font-size:12px;
  letter-spacing:.12em; text-transform:uppercase; margin-bottom:10px; color:var(--color-black);
}
.legal__toc ol{ margin:0; padding-left:1.4em; columns:2; column-gap:40px; }
.legal__toc li{ font-size:15px; padding:3px 0; break-inside:avoid; }
.legal__toc a{ text-decoration:none; }
.legal__toc a:hover{ text-decoration:underline; }
.legal__box{
  margin:16px 0 0; padding:18px 22px;
  border:1px solid var(--color-line); border-left:2px solid var(--color-black);
  background:var(--color-brand-4); border-radius:2px; display:grid; gap:8px;
}
.legal__box div{ display:grid; grid-template-columns:10em minmax(0,1fr); gap:14px; }
.legal__box dt{ font-family:var(--font-label); font-weight:600; font-size:12px; letter-spacing:.08em; text-transform:uppercase; line-height:1.9; color:var(--color-text-secondary); }
.legal__box dd{ margin:0; font-size:16px; line-height:1.55; color:var(--color-black); font-weight:400; overflow-wrap:anywhere; }
.legal__note{
  padding:14px 18px; background:var(--color-brand-5);
  border-left:2px solid var(--color-black); color:var(--color-black) !important; font-weight:400;
}
.legal ol{ margin-top:12px; }
.legal__table{ margin-top:18px; overflow-x:auto; }
.legal table{ width:100%; border-collapse:collapse; font-size:14.5px; line-height:1.5; }
.legal th{
  text-align:left; padding:10px 12px; border-bottom:1px solid var(--color-black);
  font-family:var(--font-label); font-weight:600; font-size:11.5px; letter-spacing:.08em; text-transform:uppercase;
}
.legal td{ padding:12px; border-bottom:1px solid var(--color-line); vertical-align:top; color:var(--color-text-secondary); }
.legal td code{ font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size:13px; color:var(--color-black); overflow-wrap:anywhere; }
.legal__docs{ margin-top:56px; padding-top:24px; border-top:1px solid var(--color-line); }
.legal__docs ul{ display:flex; flex-wrap:wrap; gap:10px 28px; margin-top:0; }
.legal__docs ul li{ padding-left:0; }
.legal__docs ul li::before{ display:none; }
.legal__docs a[aria-current="page"]{ font-weight:600; text-decoration:none; }
.legal__effective{ margin-top:36px; font-weight:600; color:var(--color-black) !important; }
.legal__inline-btn{
  padding:0; border:0; background:none; font:inherit; color:var(--color-black);
  text-decoration:underline; text-underline-offset:3px; cursor:pointer;
}
.legal__inline-btn:focus-visible{ outline:2px solid var(--color-black); outline-offset:2px; }
.legal .back{ margin-top:36px; }

@media (max-width:680px){
  .legal__toc ol{ columns:1; }
  .legal__box div{ grid-template-columns:1fr; gap:0; }
  .legal__box dt{ line-height:1.4; margin-top:6px; }
  /* tabulka cookies na mobilu jako karty */
  .legal table, .legal thead, .legal tbody, .legal tr, .legal td{ display:block; width:100%; }
  .legal thead{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
  .legal tr{ border:1px solid var(--color-line); background:var(--color-brand-4); margin-bottom:12px; padding:6px 0; }
  .legal td{ border-bottom:0; padding:6px 14px; display:grid; grid-template-columns:8.5em minmax(0,1fr); gap:10px; }
  .legal td::before{
    content:attr(data-label); font-family:var(--font-label); font-weight:600; font-size:11px;
    letter-spacing:.06em; text-transform:uppercase; color:var(--color-black); line-height:1.9;
  }
}
/* čitelnost dlouhých právních textů: tmavší a o stupeň silnější písmo */
.legal p, .legal li{ color:rgba(17,17,15,.82); font-weight:400; }
.legal__toc ol{ list-style:decimal; }
.legal__toc li::marker{ color:var(--color-text-secondary); font-size:13px; }
.legal ul li::before{ background:var(--color-black); opacity:.5; }
.legal dl + p, .legal ul + p, .legal .legal__table + p, .legal .legal__note + p, .legal p + .legal__note{ margin-top:14px; }
.legal td{ color:rgba(17,17,15,.82); }
.legal td code{ overflow-wrap:normal; word-break:normal; }
/* hlavička podstránek: tlačítko „Zpět na web" na jednom řádku i na mobilu */
.hdr__in > .btn{ white-space:nowrap; }
@media (max-width:480px){
  .hdr__in:has(> .btn){ gap:12px; }
  .hdr__in > .btn{ padding:10px 12px; min-height:40px; font-size:11.5px; }
}

/* ============================================================
   COOKIE PANEL (v55)
   Menší plovoucí panel u spodního okraje. „Povolit vše" je primární,
   „Pouze nezbytné" je stejně velké a dobře čitelné, „Nastavit" je
   textové tlačítko vedle. Všechny volby jsou vidět hned.
   ============================================================ */
.cookiebar[hidden]{ display:none !important; }
.cookiebar [hidden]{ display:none !important; }   /* .btn má display:inline-flex, hidden jinak nestačí */
.cookiebar{
  /* nad sticky CTA (60) a pozadím menu (70), pod otevřeným mobilním menu (75) a hlavičkou (80) */
  position:fixed; z-index:72;
  left:50%; bottom:calc(16px + env(safe-area-inset-bottom, 0px));
  transform:translateX(-50%);
  width:min(820px, calc(100% - 32px));
  max-height:calc(100vh - 120px); max-height:calc(100dvh - 120px);
  overflow-y:auto; overscroll-behavior:contain;
  background:var(--color-brand-4); color:var(--color-black);
  border:1px solid var(--color-line); border-radius:4px;
  box-shadow:0 12px 36px rgba(17,17,15,.12), 0 2px 6px rgba(17,17,15,.06);
}
.cookiebar__in{ padding:22px 24px 20px; display:grid; gap:16px; }
.cookiebar__title{
  font-family:var(--font-display); font-weight:400;
  font-size:clamp(1.15rem, 1.6vw, 1.3rem); line-height:1.25; letter-spacing:-.01em;
}
.cookiebar__desc{ margin-top:6px; font-size:14.5px; line-height:1.55; font-weight:400; color:rgba(17,17,15,.8); }
.cookiebar__desc a{ color:var(--color-black); text-decoration:underline; text-underline-offset:3px; white-space:nowrap; }
.cookiebar__status{ margin-top:8px; font-size:13.5px; line-height:1.45; font-weight:600; }

.cookiebar__actions{ display:flex; align-items:center; justify-content:space-between; gap:12px 20px; flex-wrap:wrap; }
.cookiebar__buttons{ display:flex; gap:10px; flex-wrap:wrap; }
.cookiebar__btn{ min-height:48px; padding:12px 22px; font-size:12.5px; white-space:nowrap; }
.cookiebar .btn--primary{ background:var(--color-black); color:var(--color-brand-4); border-color:var(--color-black); }
.cookiebar .btn--primary:hover{ background:rgba(17,17,15,.84); color:var(--color-brand-4); }
.cookiebar .btn--ghost{ background:transparent; color:var(--color-black); border-color:rgba(17,17,15,.55); }
.cookiebar .btn--ghost:hover{ background:var(--color-brand-6); border-color:var(--color-black); }
.cookiebar__link{
  min-height:44px; padding:0 2px; border:0; background:none; cursor:pointer;
  font-family:var(--font-label); font-weight:600; font-size:12.5px; letter-spacing:.08em;
  text-transform:uppercase; color:var(--color-black);
  text-decoration:underline; text-underline-offset:5px; text-decoration-thickness:1px;
}
.cookiebar__link:hover{ text-decoration-thickness:2px; }
.cookiebar button:focus-visible, .cookiebar a:focus-visible{ outline:2px solid var(--color-black); outline-offset:3px; }

/* detailní nastavení */
.cookiebar__prefs{ border-top:1px solid var(--color-line); padding-top:6px; }
.cookieprefs{ border:0; margin:0; padding:0; display:grid; }
.cookiepref{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:12px 0; border-bottom:1px solid var(--color-line-soft); cursor:pointer;
}
div.cookiepref{ cursor:default; }
.cookiepref__text{ display:grid; gap:2px; min-width:0; }
.cookiepref__name{ font-weight:600; font-size:14.5px; line-height:1.35; }
.cookiepref__desc{ font-size:13.5px; line-height:1.45; font-weight:400; color:rgba(17,17,15,.72); }
.cookiepref__always{ flex:0 0 auto; font-size:12.5px; font-weight:600; color:rgba(17,17,15,.72); white-space:nowrap; }

/* přepínač (checkbox s role="switch"), výchozí stav vypnuto */
.cookiepref__switch{
  -webkit-appearance:none; appearance:none; flex:0 0 auto; margin:0; cursor:pointer;
  width:46px; height:26px; border-radius:13px; position:relative;
  background:var(--color-brand-6); border:1px solid rgba(17,17,15,.35);
  transition:background-color .2s var(--ease), border-color .2s var(--ease);
}
.cookiepref__switch::after{
  content:""; position:absolute; top:3px; left:3px; width:18px; height:18px; border-radius:50%;
  background:var(--color-brand-4); box-shadow:0 1px 2px rgba(17,17,15,.25);
  transition:transform .2s var(--ease);
}
.cookiepref__switch:checked{ background:var(--color-black); border-color:var(--color-black); }
.cookiepref__switch:checked::after{ transform:translateX(20px); }
.cookiepref__switch:focus-visible{ outline:2px solid var(--color-black); outline-offset:3px; }
@media (prefers-reduced-motion: reduce){
  .cookiepref__switch, .cookiepref__switch::after{ transition:none; }
}

/* mobil: téměř přes celou šířku s okrajem 12 px, tlačítka pod sebou */
@media (max-width:640px){
  .cookiebar{ width:calc(100% - 24px); bottom:calc(12px + env(safe-area-inset-bottom, 0px)); }
  .cookiebar__in{ padding:18px 16px 14px; gap:14px; }
  .cookiebar__desc{ font-size:14px; }
  .cookiebar__actions{ flex-direction:column-reverse; align-items:stretch; gap:6px; }
  .cookiebar__buttons{ flex-direction:column-reverse; gap:8px; }
  .cookiebar__btn{ width:100%; }
  .cookiebar__link{ align-self:center; }
}
/* sticky CTA se během zobrazení lišty dočasně skryje, aby se nepřekrývaly */
.has-cookiebar .sticky-cta{ visibility:hidden; }
/* v detailním nastavení je primární „Uložit nastavení", „Povolit vše" ustoupí */
.cookiebar.is-prefs .btn--primary[data-consent="accept"]{ background:transparent; color:var(--color-black); border-color:rgba(17,17,15,.55); }
.cookiebar.is-prefs .btn--primary[data-consent="accept"]:hover{ background:var(--color-brand-6); }

/* ============================================================
   MOBILNÍ NAVIGACE — oprava ořezu menu po odscrollování (v56)
   backdrop-filter na .hdr.is-stuck vytvoří pro potomky s position:fixed
   nový referenční blok. Mobilní .nav (uvnitř .hdr) se pak nepočítala
   k obrazovce, ale k ~78 px vysoké hlavičce, a menu se ořízlo.
   Na šířkách s vysouvacím menu proto hlavička rozmazání nepoužívá
   (plné pozadí stejné barvy) a při otevřeném menu se vypne vždy.
   ============================================================ */
@media (max-width:1200px){
  .hdr.is-stuck{
    -webkit-backdrop-filter:none; backdrop-filter:none;
    background:var(--color-brand-4);
  }
}
.hdr:has(.nav.is-open){ -webkit-backdrop-filter:none !important; backdrop-filter:none !important; }

/* ============================================================
   MOBIL — dotykové cíle a sticky CTA (v56)
   Bez vizuální změny: jen větší klikací plocha a rezerva pod patičkou.
   ============================================================ */
/* tlačítko menu se na úzkých displejích nesmí zúžit pod 44 px */
.burger{ flex:0 0 44px; }

/* tečky galerie jsou 2px linky, klikací plocha se rozšíří neviditelně */
.gal__dot{ position:relative; }
.gal__dot::before{ content:""; position:absolute; left:0; right:0; top:-21px; bottom:-21px; }

/* telefon a e-mail v sekci Kontakt a odkazy v patičce: vyšší dotyková plocha */
@media (max-width:1080px){
  .contact__cell a{ display:inline-block; padding-block:10px; margin-block:-10px; }
  .ftr__col a, .ftr__cookiebtn, .ftr__company a{ display:inline-block; padding-block:8px; margin-block:-8px; }
}

/* sticky CTA (jen na stránkách, kde je) nesmí na konci stránky zakrýt patičku */
@media (max-width:820px){
  body:has(#stickyCta) .ftr__bottom{ padding-bottom:calc(34px + 76px + env(safe-area-inset-bottom, 0px)); }
}

/* ============================================================
   RECENZE Z GOOGLE (v57)
   Sekce ve stylu Formovny, karty inspirované vzhledem Google
   recenzí. Roboto (lokálně, Apache 2.0) jen uvnitř karet.
   ============================================================ */
@font-face{ font-family:"Roboto"; src:url("assets/fonts/roboto-regular.woff2") format("woff2"); font-weight:400; font-style:normal; font-display:swap; }
@font-face{ font-family:"Roboto"; src:url("assets/fonts/roboto-medium.woff2") format("woff2"); font-weight:500; font-style:normal; font-display:swap; }

.google-reviews{ background:var(--color-brand-5); padding-block:clamp(52px,5.5vw,84px); }
.google-reviews [hidden]{ display:none !important; }
.google-reviews__header{
  display:flex; align-items:flex-end; justify-content:space-between; gap:24px 48px; flex-wrap:wrap;
  margin-bottom:clamp(28px,3.5vw,44px);
}
.google-reviews__intro{ max-width:640px; }
.google-reviews__title{ font-size:clamp(2rem,3.6vw,3.2rem); }
.google-reviews__intro .lead{ margin-top:16px; }
.google-reviews__source{
  display:flex; align-items:center; flex-wrap:wrap; gap:10px 14px;
  padding:12px 18px; background:#fff; border:1px solid rgba(17,17,15,.1); border-radius:12px;
}
.google-reviews__logo{ display:block; width:88px; height:auto; }
.google-reviews__stars{ display:inline-flex; gap:1px; color:#fbbc04; }
.google-reviews__stars svg{ width:18px; height:18px; }
.google-reviews__source-text{ font-size:14px; font-weight:600; color:var(--color-black); }

/* carousel */
.google-reviews__viewport{
  --gr-gap:22px; --gr-per:3;
  overflow-x:auto; overflow-y:hidden; overscroll-behavior-x:contain;
  scroll-snap-type:x mandatory; scroll-behavior:smooth;
  scrollbar-width:none; -webkit-overflow-scrolling:touch;
  padding:6px 4px 14px; margin:-6px -4px -14px;       /* místo pro jemný stín a focus */
  border-radius:16px;
}
.google-reviews__viewport::-webkit-scrollbar{ display:none; }
.google-reviews__viewport:focus-visible{ outline:2px solid var(--color-black); outline-offset:4px; }
.google-reviews__viewport.is-dragging{ scroll-snap-type:none; scroll-behavior:auto; cursor:grabbing; user-select:none; }
.google-reviews__track{ display:flex; gap:var(--gr-gap); align-items:stretch; }

.google-review{
  flex:0 0 calc((100% - (var(--gr-per) - 1) * var(--gr-gap)) / var(--gr-per));
  min-width:0; scroll-snap-align:start;
  display:flex; flex-direction:column;
  padding:22px 24px 18px;
  background:#fff; border:1px solid rgba(17,17,15,.1); border-radius:14px;
  box-shadow:0 1px 2px rgba(17,17,15,.04), 0 6px 18px rgba(17,17,15,.04);
  font-family:Roboto, Arial, sans-serif; color:var(--color-black);
}
.google-review__head{ display:flex; align-items:center; gap:12px; }
.google-review__avatar{
  flex:0 0 40px; width:40px; height:40px; border-radius:50%; object-fit:cover; display:block;
}
.google-review__avatar--initial{
  display:grid; place-items:center; color:#fff;
  font-family:Roboto, Arial, sans-serif; font-weight:500; font-size:18px; line-height:1;
}
.google-review__who{ min-width:0; }
.google-review__name{ font-family:Roboto, Arial, sans-serif; font-weight:500; font-size:15.5px; line-height:1.3; letter-spacing:0; }
.google-review__meta{ margin-top:2px; font-size:13px; line-height:1.35; color:rgba(17,17,15,.62); }
.google-review__rating{ display:flex; align-items:center; flex-wrap:wrap; gap:6px 10px; margin-top:14px; }
.google-review__stars{ display:inline-flex; gap:1px; color:#fbbc04; }
.google-review__stars svg{ width:16px; height:16px; }
.google-review__time{ font-size:13px; color:rgba(17,17,15,.62); }
.google-review__badge{
  font-size:12px; line-height:1; padding:4px 6px;
  border:1px solid rgba(17,17,15,.35); border-radius:4px; color:var(--color-black);
}
.google-review__text{ margin-top:12px; font-size:15.5px; line-height:1.55; font-weight:400; color:rgba(17,17,15,.88); }
.google-review__source{
  margin-top:auto; padding-top:16px; font-size:12.5px; font-weight:500; letter-spacing:.01em;
  color:rgba(17,17,15,.55);
}

/* ovládání pod kartami */
.google-reviews__controls{ display:flex; align-items:center; justify-content:center; gap:8px; margin-top:22px; }
.google-reviews__arrow{
  width:44px; height:44px; display:grid; place-items:center; flex:0 0 44px;
  background:#fff; color:var(--color-black); border:1px solid rgba(17,17,15,.25); border-radius:50%;
  cursor:pointer; transition:background-color .2s var(--ease), border-color .2s var(--ease);
}
.google-reviews__arrow:hover:not(:disabled){ background:var(--color-brand-6); border-color:var(--color-black); }
.google-reviews__arrow:disabled{ opacity:.35; cursor:default; }
.google-reviews__arrow:focus-visible, .google-reviews__dot:focus-visible{ outline:2px solid var(--color-black); outline-offset:2px; }
.google-reviews__dots{ display:flex; align-items:center; }
.google-reviews__dot{
  width:44px; height:44px; padding:0; border:0; background:none; cursor:pointer; display:grid; place-items:center;
}
.google-reviews__dot::before{
  content:""; width:8px; height:8px; border-radius:50%;
  background:rgba(17,17,15,.22); transition:background-color .2s var(--ease), width .2s var(--ease);
}
.google-reviews__dot.is-active::before{ width:20px; border-radius:4px; background:var(--color-black); }

.google-reviews__cta{ margin-top:20px; text-align:center; }

/* tablet: dvě karty; mobil: jedna karta a začátek další */
@media (max-width:1099px){ .google-reviews__viewport{ --gr-per:2; --gr-gap:18px; } }
@media (max-width:680px){
  .google-reviews__viewport{ --gr-per:1.12; --gr-gap:14px; }
  .google-review{ padding:20px 18px 16px; }
  .google-reviews__source{ width:100%; }
}
@media (prefers-reduced-motion: reduce){
  .google-reviews__viewport{ scroll-behavior:auto; }
  .google-reviews__dot::before, .google-reviews__arrow{ transition:none; }
}

/* ============================================================
   MOBILNÍ MENU PŘES CELOU OBRAZOVKU (v57)
   Otevřené menu musí zakrýt celý viewport neprůhledně — obsah
   stránky (např. recenze) pod ním nesmí prosvítat ani jít kliknout.
   Hlavička s tlačítkem pro zavření zůstává nad menu (z-index 80).
   ============================================================ */
@media (max-width:1080px){
  .nav{ width:100%; }
}
@media (min-width:1081px) and (max-width:1200px){
  .hdr:has([data-team-nav]:not([hidden])) .nav{ width:100%; }
}

/* odkaz na všechny recenze na Googlu (v58) — sekundární tlačítko */
.google-reviews__cta{ margin-top:26px; text-align:center; }
.google-reviews__all{
  display:inline-flex; align-items:center; justify-content:center; gap:12px;
  max-width:100%; min-height:48px; padding:11px 22px;
  background:#fff; color:var(--color-black); text-decoration:none;
  border:1px solid rgba(17,17,15,.55); border-radius:999px;
  font-family:var(--font-label); font-weight:600; font-size:13.5px; line-height:1.3;
  transition:background-color .2s var(--ease), border-color .2s var(--ease);
}
.google-reviews__all img{ display:block; width:62px; height:auto; flex:0 0 auto; }
.google-reviews__all span{ text-align:left; }
.google-reviews__all-arrow{ flex:0 0 auto; transition:transform .2s var(--ease); }
.google-reviews__all:hover{ background:var(--color-brand-6); border-color:var(--color-black); }
.google-reviews__all:hover .google-reviews__all-arrow{ transform:translateX(3px); }
.google-reviews__all:focus-visible{ outline:2px solid var(--color-black); outline-offset:3px; }
@media (max-width:480px){
  .google-reviews__all{ width:100%; padding:11px 16px; gap:10px; font-size:13px; }
}
@media (prefers-reduced-motion: reduce){
  .google-reviews__all, .google-reviews__all-arrow{ transition:none; }
}

/* dlouhé recenze (v61): vizuální zkrácení + rozbalení přímo v kartě */
.google-review__text{
  display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:7; line-clamp:7; overflow:hidden;
}
.google-review.is-expanded .google-review__text{ display:block; -webkit-line-clamp:unset; line-clamp:none; overflow:visible; }
.google-review__more{
  align-self:flex-start; min-height:44px; margin-top:2px; padding:0;
  background:none; border:0; cursor:pointer; color:var(--color-black);
  font-family:Roboto, Arial, sans-serif; font-weight:500; font-size:14px;
  text-decoration:underline; text-underline-offset:4px; text-decoration-thickness:1px;
}
.google-review__more:hover{ text-decoration-thickness:2px; }
.google-review__more:focus-visible{ outline:2px solid var(--color-black); outline-offset:2px; border-radius:2px; }
.google-review__more + .google-review__source{ padding-top:6px; }
/* po rozbalení se ostatní karty nenatahují na výšku rozbalené */
.google-reviews__track.has-expanded{ align-items:flex-start; }
@media (max-width:680px){
  .google-review__text{ -webkit-line-clamp:10; line-clamp:10; }
}

/* ============================================================
   v64 — SKUTEČNÉ FOTOGRAFIE (proměna klientky, procedura, O nás)
   Používají se jen stávající barvy, písmo a tvarosloví webu.
   ============================================================ */

/* --- proměna na výšku: fotografie už obsahuje obě poloviny --- */
.ba--real img{ width:100%; height:auto; display:block; }

/* přepínač pohledů v hero */
.baviews{ display:flex; gap:8px; margin-top:10px; }
.baviews__btn{
  flex:1 1 0; min-height:44px; padding:10px 6px;
  background:transparent; border:1px solid var(--color-line); border-radius:2px;
  font-family:var(--font-label); font-size:11.5px; font-weight:600;
  letter-spacing:.1em; text-transform:uppercase; color:var(--color-text-secondary);
  cursor:pointer; transition:background .2s ease, color .2s ease, border-color .2s ease;
}
.baviews__btn:hover{ border-color:var(--color-black); color:var(--color-black); }
.baviews__btn.is-active{ background:var(--color-black); border-color:var(--color-black); color:var(--color-brand-4); }
.baviews__btn:focus-visible{ outline:2px solid var(--color-black); outline-offset:2px; }

.herocard__cap{ display:block; margin-top:10px; }
.herocard__cap-main{ display:block; font-size:12.5px; color:var(--color-text-secondary); }
.herocard__cap-note{ display:block; margin-top:2px; font-size:11.5px; color:var(--color-text-secondary); opacity:.8; }

@media (prefers-reduced-motion: reduce){
  .baviews__btn{ transition:none; }
}

/* --- dvojice reálných pohledů v sekci „Vaše tělo si zaslouží…" --- */
.onepart__in--real{ grid-template-columns:minmax(0,42%) minmax(0,58%); align-items:center; }
.realpair{
  display:grid; grid-template-columns:minmax(0,1.42fr) minmax(0,1fr);
  grid-template-areas:"eyebrow eyebrow" "main side" "cap cap";
  gap:14px clamp(14px,1.6vw,22px); margin:0;
}
.realpair__eyebrow{ grid-area:eyebrow; margin:0; }
.realpair__main{ grid-area:main; }
.realpair__side{ grid-area:side; align-self:end; }
.realpair .ba{ border:1px solid var(--color-line); }
.realpair__cap{
  grid-area:cap; margin:0; font-size:12.5px; line-height:1.45;
  color:var(--color-text-secondary);
}
@media (max-width:900px){
  .onepart__in--real{ grid-template-columns:1fr; }
  .realpair{ grid-template-columns:1fr; grid-template-areas:"eyebrow" "main" "side" "cap"; }
  .realpair__side{ align-self:auto; }
}

/* --- fotografie z procedury: hlavní záběr + pás detailů --- */
.procshots{
  display:grid; grid-template-columns:minmax(0,46%) minmax(0,54%);
  gap:clamp(18px,2.4vw,34px); align-items:stretch;
  margin:0 0 clamp(30px,4vw,52px);
}
.procshots__main{ margin:0; }
.procshots__main img{
  display:block; width:100%; height:auto; aspect-ratio:4/5; object-fit:cover;
  object-position:50% 42%; border-radius:2px;
}

.shotstrip{ min-width:0; display:flex; flex-direction:column; }
.shotstrip .shotstrip__controls{ margin-top:auto; padding-top:14px; }
.shotstrip__viewport{
  overflow-x:auto; overflow-y:hidden; scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch; scrollbar-width:none;
}
.shotstrip__viewport::-webkit-scrollbar{ display:none; }
.shotstrip__viewport:focus-visible{ outline:2px solid var(--color-black); outline-offset:3px; }
.shotstrip__track{
  display:grid; grid-auto-flow:column;
  grid-auto-columns:calc((100% - 14px) / 1.7);
  gap:14px; margin:0; padding:0; list-style:none;
}
.shotstrip__item{ scroll-snap-align:start; }
.shotstrip__item figure{ margin:0; }
.shotstrip__item img{
  display:block; width:100%; height:auto; aspect-ratio:3/4; object-fit:cover;
  border-radius:2px;
}
.shotstrip__controls{ display:flex; align-items:center; gap:10px; margin-top:14px; }
.shotstrip__arrow{
  width:44px; height:44px; display:inline-flex; align-items:center; justify-content:center;
  background:transparent; border:1px solid var(--color-line); border-radius:50%;
  color:var(--color-black); cursor:pointer;
}
.shotstrip__arrow svg{ width:18px; height:18px; }
.shotstrip__arrow:hover:not(:disabled){ border-color:var(--color-black); }
.shotstrip__arrow:disabled{ opacity:.3; cursor:default; }
.shotstrip__arrow:focus-visible{ outline:2px solid var(--color-black); outline-offset:2px; }
.shotstrip__dots{ display:flex; gap:2px; }
.shotstrip__dot{
  width:28px; height:44px; padding:0; background:none; border:0; cursor:pointer;
  position:relative;
}
.shotstrip__dot::after{
  content:""; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  width:7px; height:7px; border-radius:50%; background:var(--color-line);
  transition:background .2s ease, width .2s ease;
}
.shotstrip__dot.is-active::after{ width:18px; border-radius:4px; background:var(--color-black); }
.shotstrip__dot:focus-visible{ outline:2px solid var(--color-black); outline-offset:2px; border-radius:4px; }

@media (max-width:900px){
  .procshots{ grid-template-columns:1fr; }
  .procshots__main img{ aspect-ratio:3/4; }
  .shotstrip__track{ grid-auto-columns:78%; }
}
@media (prefers-reduced-motion: reduce){
  .shotstrip__dot::after{ transition:none; }
}

/* --- průběh návštěvy: větší reálná fotografie --- */
.visit--real{ grid-template-columns:minmax(0,57%) minmax(0,43%); align-items:center; }
.visit__media--real img{ aspect-ratio:3/2; object-position:50% 40%; }
@media (max-width:900px){
  .visit--real{ grid-template-columns:1fr; }
  .visit--real .visit__media{ max-width:none; }
  .visit__media--real img{ aspect-ratio:4/3; }
}

/* --- O nás: skutečné fotografie Barbory a Lucie --- */
.about__layout{
  grid-template-columns:minmax(0,40fr) minmax(0,60fr);
  grid-template-areas:"media head" "media body" "studio body" "studio cta";
  align-items:start; gap:clamp(24px,3.4vw,56px) clamp(32px,5vw,72px);
}
.about__head{ grid-area:head; }
.about__body{ grid-area:body; }
.about__media{ grid-area:media; }
.about__studio{ grid-area:studio; margin:0; }
.about__cta{ grid-area:cta; margin:0; align-self:start; }
.about__media img{ aspect-ratio:4/5; object-fit:cover; object-position:50% 28%; }
.about__studio img{
  display:block; width:84%; margin-left:auto; height:auto;
  aspect-ratio:4/5; object-fit:cover; object-position:50% 30%; border-radius:2px;
}
.about__body p + p{ margin-top:16px; }
.about__wide{ margin:26px 0; }
.about__wide img{
  display:block; width:100%; height:auto; aspect-ratio:3/2; object-fit:cover;
  border-radius:2px;
}
@media (max-width:900px){
  .about__layout{
    grid-template-columns:1fr;
    grid-template-areas:"head" "media" "body" "studio" "cta";
    gap:22px;
  }
  .about__media img{ aspect-ratio:4/5; }
  .about__studio img{ width:100%; margin-left:0; }
  .about__wide img{ aspect-ratio:4/3; }
}