/* ============================================================
   Jana Červeňová — osobná trénerka, Liptovský Mikuláš
   Brand: navy #111520 + magenta #E1067E (z jej vlastnej FB grafiky)
   Vizuálny jazyk: bold grotesk, blush plochy, mäkké kruhy,
   bento mriežka služieb, plávajúce karty.
   ============================================================ */

:root{
  --ink:#12151C;
  --ink-soft:#333A49;
  --body:#565D6E;
  --muted:#626878;

  --magenta:#E1067E;
  --magenta-dark:#B00462;
  --magenta-deep:#8E0350;
  --magenta-soft:#FF3D9E;
  --tint:#FFF0F7;
  --tint-2:#FFE3F0;

  --paper:#FFFFFF;
  --cream:#FFF8FB;
  --sand:#FDEDF5;
  --line:#F0DCE8;
  --line-strong:#DCC4D3;

  --radius:20px;
  --radius-lg:28px;
  --radius-sm:14px;
  --shadow:0 1px 2px rgba(18,21,28,.04), 0 10px 30px rgba(142,3,80,.07);
  --shadow-lg:0 2px 6px rgba(18,21,28,.05), 0 28px 64px rgba(142,3,80,.13);

  --wrap:1200px;
  --gutter:clamp(1.15rem, 4vw, 2.5rem);

  --sans:'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --display:'Archivo', 'Inter', system-ui, sans-serif;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* kotvy na podstranke Sluzby - sticky hlavicka nesmie prekryt nadpis */
section[id]{scroll-margin-top:92px}

body{
  margin:0;
  font-family:var(--sans);
  font-size:clamp(1rem,.97rem + .16vw,1.075rem);
  line-height:1.72;
  color:var(--body);
  background:var(--paper);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

img{max-width:100%; height:auto; display:block}
a{color:var(--magenta-dark); text-underline-offset:.18em}
a:hover{color:var(--magenta)}

h1,h2,h3,h4{
  font-family:var(--display);
  color:var(--ink);
  font-weight:700;
  line-height:1.1;
  letter-spacing:-.021em;
  margin:0 0 .5em;
  text-wrap:balance;
}
h1{font-size:clamp(2.35rem,1.5rem + 3.6vw,4.15rem); letter-spacing:-.03em; line-height:1.03}
h2{font-size:clamp(1.8rem,1.28rem + 2.2vw,2.95rem); letter-spacing:-.027em}
h3{font-size:clamp(1.16rem,1.04rem + .5vw,1.4rem); line-height:1.24}
p{margin:0 0 1.05em}
p:last-child{margin-bottom:0}

.wrap{width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:var(--gutter)}
.section{padding-block:clamp(3.6rem,2.3rem + 5.2vw,6.75rem); position:relative; overflow:hidden}
.section--tight{padding-block:clamp(2.6rem,1.8rem + 3.6vw,4.5rem)}
.section--paper{background:var(--paper)}
.section--cream{background:var(--cream); overflow:hidden}
.section--sand{background:var(--sand); overflow:hidden}
.section--ink{background:var(--ink); color:#C9CEDB}
.section--ink h2,.section--ink h3{color:#fff}

/* dekoratívne kruhy v pozadí sekcií */
.section--sand::before,
.section--cream::before{
  content:""; position:absolute; pointer-events:none;
  width:min(46rem,70vw); aspect-ratio:1; border-radius:50%;
  border:1px solid rgba(225,6,126,.09);
  right:-14rem; top:-12rem; z-index:0;
}
.section > .wrap{position:relative; z-index:1}

.eyebrow{
  font-family:var(--sans);
  font-size:.735rem;
  font-weight:700;
  letter-spacing:.15em;
  text-transform:uppercase;
  color:var(--magenta-dark);
  margin:0 0 1rem;
  display:flex; align-items:center; gap:.6rem;
}
.eyebrow::before{content:""; width:22px; height:3px; background:var(--magenta); flex:none; border-radius:3px}
.section--ink .eyebrow{color:#FF7DBD}
.eyebrow--center{justify-content:center}

.lede{font-size:clamp(1.06rem,1rem + .3vw,1.2rem); color:var(--ink-soft); line-height:1.68}
.head{max-width:46rem}
.head--center{margin-inline:auto; text-align:center}
.head--center .eyebrow{justify-content:center}

/* zvýraznenie slova v nadpise — podčiarknuté ťahom štetca ako v predlohe */
.mark{position:relative; white-space:nowrap; color:var(--magenta)}
.mark::after{
  content:""; position:absolute; left:0; right:0; bottom:-.04em; height:.12em;
  background:var(--magenta); opacity:.24; border-radius:.1em;
}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  font-family:var(--sans); font-weight:600; font-size:.965rem; line-height:1;
  padding:1.05rem 1.85rem; border-radius:100px; border:1.5px solid transparent;
  text-decoration:none; cursor:pointer; transition:.2s ease; white-space:nowrap;
}
.btn--primary{background:var(--magenta); color:#fff; box-shadow:0 6px 20px rgba(225,6,126,.28)}
.btn--primary:hover{background:var(--magenta-dark); color:#fff; transform:translateY(-2px); box-shadow:0 12px 28px rgba(225,6,126,.34)}
.btn--ghost{background:transparent; color:var(--ink); border-color:var(--line-strong)}
.btn--ghost:hover{border-color:var(--ink); color:var(--ink); background:rgba(18,21,28,.03)}
.btn--light{background:#fff; color:var(--ink)}
.btn--light:hover{background:#fff; color:var(--magenta-dark); transform:translateY(-2px)}
.btn--outline-light{background:transparent; color:#fff; border-color:rgba(255,255,255,.35)}
.btn--outline-light:hover{color:#fff; border-color:#fff; background:rgba(255,255,255,.08)}
.btn-row{display:flex; flex-wrap:wrap; gap:.8rem; align-items:center}

/* sekundárne CTA s krúžkom (Treina „Watch Intro“) */
.btn-play{
  display:inline-flex; align-items:center; gap:.85rem; text-decoration:none;
  color:var(--ink); font-weight:600; font-size:.965rem;
}
.btn-play span{
  width:54px; height:54px; flex:none; border-radius:50%; background:#fff;
  display:grid; place-items:center; color:var(--magenta);
  box-shadow:0 6px 22px rgba(142,3,80,.14); transition:.2s ease;
}
.btn-play svg{width:20px; height:20px}
.btn-play:hover{color:var(--magenta-dark)}
.btn-play:hover span{transform:scale(1.06); box-shadow:0 10px 28px rgba(142,3,80,.2)}

.textlink{
  font-weight:600; text-decoration:none; color:var(--magenta-dark);
  display:inline-flex; align-items:center; gap:.4rem;
}
.textlink::after{content:"→"; transition:transform .2s ease}
.textlink:hover::after{transform:translateX(3px)}

/* ---------- odkazy na sociálne siete v sekcii výsledkov/recenzií ---------- */
.sociallinks{display:flex; flex-wrap:wrap; gap:.7rem; margin-top:1.1rem}
.sociallinks--center{justify-content:center}
.sociallink{
  display:inline-flex; align-items:center; gap:.55rem;
  padding:.62rem 1.1rem;
  border:1px solid var(--line-strong);
  border-radius:999px;
  background:var(--paper);
  color:var(--ink); text-decoration:none;
  font-weight:600; font-size:.95rem; line-height:1;
  transition:border-color .2s ease, color .2s ease, transform .2s ease;
}
.sociallink svg{width:18px; height:18px; flex:0 0 auto; color:var(--magenta)}
.sociallink:hover{border-color:var(--magenta); color:var(--magenta-dark); transform:translateY(-2px)}

/* ---------- header ---------- */
.site-header{
  position:sticky; top:0; z-index:60;
  background:rgba(255,255,255,.92);
  backdrop-filter:saturate(140%) blur(10px);
  border-bottom:1px solid var(--line);
}
.site-header__inner{display:flex; align-items:center; justify-content:space-between; gap:1rem; min-height:78px}

.brand{display:inline-flex; align-items:center; gap:.65rem; text-decoration:none; color:var(--ink)}
.brand img{width:36px; height:36px}
.brand__name{display:block; font-family:var(--display); font-weight:700; font-size:1.09rem; letter-spacing:-.02em; line-height:1.15; color:var(--ink)}
.brand__role{display:block; font-size:.7rem; letter-spacing:.13em; text-transform:uppercase; color:var(--muted); font-weight:600}

.nav{display:flex; align-items:center; gap:.35rem}
/* > a:not([class]) — bežné odkazy sa štýlujú oddelene od CTA tlačidla,
   inak by `.nav a` prebilo .btn (radius, padding, farbu) */
.nav > a:not([class]){
  text-decoration:none; color:var(--ink-soft); font-weight:500; font-size:.955rem;
  padding:.55rem .8rem; border-radius:9px; transition:.18s ease; white-space:nowrap;
}
.nav > a:not([class]):hover{color:var(--magenta-dark); background:var(--tint)}
.nav > a[aria-current="page"]:not([class]){color:var(--magenta-dark); font-weight:600}
.nav .btn{margin-left:.5rem; padding:.88rem 1.5rem}

.burger{
  display:none; width:46px; height:46px; border:1px solid var(--line-strong);
  background:#fff; border-radius:12px; cursor:pointer; position:relative;
}
.burger span,.burger span::before,.burger span::after{
  content:""; position:absolute; left:50%; width:19px; height:2px;
  background:var(--ink); border-radius:2px; transform:translateX(-50%); transition:.22s ease;
}
.burger span{top:50%; margin-top:-1px}
.burger span::before{top:-6px; left:0; transform:none}
.burger span::after{top:6px; left:0; transform:none}
body.nav-open .burger span{background:transparent}
body.nav-open .burger span::before{top:0; transform:rotate(45deg)}
body.nav-open .burger span::after{top:0; transform:rotate(-45deg)}

.skip-link{
  position:absolute; left:-9999px; top:0; background:var(--ink); color:#fff;
  padding:.7rem 1.1rem; z-index:100; border-radius:0 0 10px 0;
}
.skip-link:focus{left:0; color:#fff}
:focus-visible{outline:3px solid var(--magenta); outline-offset:3px; border-radius:6px}
/* magenta outline by na magenta/tmavých plochách zanikol */
:is(.bento__intro,.cta-card,.cta-band,.section--ink,.reviews-band,.site-footer,.btn--primary) :focus-visible,
.btn--primary:focus-visible{outline-color:#fff; box-shadow:0 0 0 6px rgba(142,3,80,.85)}

/* ============================================================
   HERO — silný a čistý (predloha Formie), na blush ploche
   ============================================================ */
.hero{
  position:relative; overflow:hidden;
  background:linear-gradient(180deg,var(--sand) 0%, var(--cream) 68%, var(--paper) 100%);
  padding-block:clamp(2.5rem,1.2rem + 5vw,4.5rem) 0;
}
.hero__grid{
  display:grid; grid-template-columns:minmax(0,1.14fr) minmax(0,.86fr);
  gap:clamp(1.5rem,4vw,3.5rem); align-items:center;
}
.hero__copy{padding-bottom:clamp(2rem,3vw,3.5rem)}
/* menší strop než globálne h1, aby sa titulok zlomil na 2 vyvážené riadky
   a nezostalo osamotené slovo na vlastnom riadku */
.hero h1{margin-bottom:.42em; font-size:clamp(2.3rem,1.5rem + 2.9vw,3.5rem); text-wrap:balance}
.hero__sub{max-width:33rem; margin-bottom:2.1rem; color:var(--ink-soft)}
.hero .btn-row{gap:1.15rem}

/* skutočná fotka orezaná do kruhu na magenta kruhu */
.hero__media{position:relative; height:clamp(430px,50vw,655px)}
/* Spodok kruhu leží presne na hrane sekcie. Magenta kruh je zámerne väčší než
   fotka, takže okolo bieleho rámu ostáva farebný lem — fotka je jej vlastná,
   preto ju orezávame do kruhu namiesto vystrihovania postavy. */
.hero__blob{
  position:absolute; left:50%; bottom:0; transform:translateX(-50%);
  height:84%; aspect-ratio:1; border-radius:50%;
  background:radial-gradient(circle at 50% 32%, var(--magenta-soft) 0%, var(--magenta) 56%, var(--magenta-dark) 100%);
}
.hero__ring{
  position:absolute; left:50%; bottom:0; transform:translateX(-50%);
  height:99%; aspect-ratio:1; border-radius:50%;
  border:1.5px dashed rgba(225,6,126,.22);
}
.hero__photo{
  position:absolute; z-index:2; left:50%; bottom:7%; transform:translateX(-50%);
  height:70%; aspect-ratio:1; width:auto; max-width:none;
  border-radius:50%; object-fit:cover; object-position:50% 26%;
  border:.55rem solid #fff;
  box-shadow:0 22px 40px rgba(142,3,80,.26);
}
.hero__badge{
  position:absolute; z-index:3; left:-5%; bottom:9%;
  background:#fff; border-radius:var(--radius); padding:.95rem 1.15rem;
  box-shadow:var(--shadow-lg); display:flex; align-items:center; gap:.75rem;
  max-width:15rem;
}
.hero__badge strong{
  font-family:var(--display); font-size:1.85rem; font-weight:700;
  color:var(--ink); line-height:1; letter-spacing:-.03em;
}
/* :not([class]) — inak by tento zápis prefarbil vnorené .stars na sivo */
.hero__badge > span:not([class]){font-size:.755rem; line-height:1.35; color:var(--muted)}
.hero__badge .stars{margin:0 0 .18rem}
.hero__badge .stars svg{width:11px; height:11px}

.hero__chip{
  position:absolute; z-index:3; right:-5%; top:1%;
  background:#fff; border-radius:var(--radius); padding:.85rem 1.05rem;
  box-shadow:var(--shadow-lg); display:flex; align-items:center; gap:.7rem;
  font-size:.8rem; font-weight:600; color:var(--ink); line-height:1.3; max-width:12.5rem;
}
.hero__chip svg{width:32px; height:32px; flex:none; padding:7px; border-radius:50%; background:var(--tint); color:var(--magenta)}

/* pás so štatistikami pod hero */
.statbar{background:var(--paper); border-bottom:1px solid var(--line)}
.statbar__inner{
  display:grid; grid-template-columns:repeat(4,1fr); gap:1rem;
  padding-block:clamp(2rem,1.4rem + 2vw,3rem);
}
.stat strong{
  display:block; font-family:var(--display); font-weight:700;
  font-size:clamp(1.9rem,1.4rem + 1.9vw,2.9rem); color:var(--ink);
  line-height:1; letter-spacing:-.035em; margin-bottom:.4rem;
}
.stat strong i{color:var(--magenta); font-style:normal}
.stat span{font-size:.87rem; color:var(--muted); line-height:1.4; display:block}

/* ---------- page hero (podstránky) ---------- */
.page-hero{
  background:linear-gradient(180deg,var(--sand) 0%,var(--cream) 100%);
  padding-block:clamp(2.2rem,1.6rem + 3vw,3.6rem) clamp(2.6rem,1.8rem + 4vw,4.4rem);
  position:relative; overflow:hidden;
}
.page-hero::before{
  content:""; position:absolute; right:-12rem; top:-14rem;
  width:38rem; aspect-ratio:1; border-radius:50%;
  border:1px solid rgba(225,6,126,.12);
}
.page-hero .wrap{position:relative; z-index:1}
.crumbs{font-size:.83rem; color:var(--muted); margin-bottom:1.3rem}
.crumbs a{color:var(--muted); text-decoration:none}
.crumbs a:hover{color:var(--magenta-dark)}

/* ---------- grids ---------- */
.grid{display:grid; gap:1.5rem}
.grid--2{grid-template-columns:repeat(2,1fr)}
.grid--3{grid-template-columns:repeat(3,1fr)}
.grid--4{grid-template-columns:repeat(4,1fr)}
/* ---------- fakty na tmavom páse (o-mne „V skratke") ----------
   Jedna mriežka, aby sa stĺpce zarovnali; panely dávajú položkám
   ohraničenie, ktoré holý text na tmavom podklade nemal. */
.factgrid > article{
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.11);
  border-radius:var(--radius-sm);
  padding:1.2rem 1.25rem;
}
.factgrid h3{font-size:1rem; margin:0 0 .4rem}
.factgrid p{font-size:.93rem; margin:0; line-height:1.6}


/* ---------- karty ---------- */
.card{
  background:var(--paper); border:1px solid var(--line); border-radius:var(--radius);
  padding:clamp(1.5rem,1.2rem + .9vw,2rem); transition:.24s ease; position:relative;
}
.card__num{
  display:inline-flex; align-items:center; justify-content:center;
  font-family:var(--display); font-weight:700; font-size:.85rem; letter-spacing:.02em;
  color:var(--magenta-dark); background:var(--tint);
  border-radius:100px; padding:.42rem .9rem; margin-bottom:1.05rem;
}
.card h3{margin-bottom:.55rem}
.card > p:not([class]){font-size:.955rem; margin-bottom:0}
.card--hover:hover{transform:translateY(-4px); box-shadow:var(--shadow-lg); border-color:transparent}
.section--paper .card{background:var(--cream)}
.section--sand .card{background:var(--paper); border-color:transparent; box-shadow:var(--shadow)}

/* ---------- split ---------- */
.split{display:grid; grid-template-columns:repeat(2,1fr); gap:clamp(1.8rem,1.2rem + 3.4vw,4rem); align-items:center}
.split--rev .split__media{order:2}
.split__media{position:relative}
.split__media img{
  width:100%; border-radius:var(--radius-lg); object-fit:cover;
  box-shadow:var(--shadow-lg);
}
.split__media--wide img{aspect-ratio:4/3}
.split__media--portrait img{aspect-ratio:4/5; object-position:50% 22%}
/* DUAL POWER: postavy od hláv po chodidlá zaberajú 57 % výšky fotky a strop je nad nimi —
   rám drží dolný okraj, aby boli vidieť celé chodidlá a nad hlavami nebol vysoký strop */
.split__media--dual img{object-position:50% 100%}
.split__media--dual .float-card{bottom:auto; top:2.2rem}
/* mäkký kruh za fotkou */
.split__media::before{
  content:""; position:absolute; z-index:-1; inset:auto -8% -8% auto;
  width:62%; aspect-ratio:1; border-radius:50%; background:var(--tint-2);
}
.split--rev .split__media::before{inset:auto auto -8% -8%}

/* plávajúca karta nad fotkou (Treina „Track Everything“) */
.float-card{
  position:absolute; z-index:3; right:-1.2rem; bottom:2.2rem;
  background:#fff; border-radius:var(--radius); padding:1rem 1.2rem;
  box-shadow:var(--shadow-lg); max-width:13.5rem;
}
.float-card strong{
  display:block; font-family:var(--display); font-size:1.5rem; font-weight:700;
  color:var(--magenta); line-height:1; letter-spacing:-.03em; margin-bottom:.3rem;
}
.float-card span{font-size:.78rem; color:var(--muted); line-height:1.35; display:block}

/* ---------- kroky ---------- */
.steps{list-style:none; margin:1.9rem 0 0; padding:0; display:grid; gap:.85rem}
.steps li{
  display:flex; gap:1rem; align-items:flex-start;
  background:var(--paper); border-radius:var(--radius); padding:1.15rem 1.3rem;
  border:1px solid var(--line); transition:.22s ease;
}
.section--paper .steps li{background:var(--cream)}
.steps li:hover{box-shadow:var(--shadow); border-color:transparent; transform:translateX(3px)}
.step-dot{
  flex:none; width:44px; height:44px; border-radius:50%;
  background:var(--magenta); color:#fff;
  display:grid; place-items:center; font-family:var(--display); font-weight:700; font-size:1.05rem;
}
.steps b{display:block; font-family:var(--display); color:var(--ink); font-size:1.06rem; font-weight:700; margin-bottom:.2rem; letter-spacing:-.015em}
.steps p{font-size:.94rem; margin:0}

/* ---------- bento mriežka služieb (index) ---------- */
.bento{display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem}
.bento__intro{
  background:var(--magenta); color:#fff; border-radius:var(--radius);
  padding:clamp(1.6rem,1.2rem + 1.2vw,2.2rem); display:flex; flex-direction:column; justify-content:center;
}
.bento__intro .eyebrow{color:#fff}
.bento__intro .eyebrow::before{background:#fff}
.bento__intro h2{color:#fff; font-size:clamp(1.5rem,1.2rem + 1.2vw,2rem); margin-bottom:.5rem}
/* :not([class]) — inak by tento zápis prebil .eyebrow (rovnaká špecificita + typ) */
.bento__intro > p:not([class]){color:#fff; font-size:.95rem}
.bento__intro a{color:#fff; margin-top:1.2rem; font-weight:600; text-decoration:none; display:inline-flex; align-items:center; gap:.4rem}
.bento__intro a::after{content:"→"; transition:transform .2s ease}
.bento__intro a:hover::after{transform:translateX(3px)}

.tile{
  position:relative; border-radius:var(--radius); overflow:hidden;
  min-height:230px; display:flex; align-items:flex-end;
  text-decoration:none; color:#fff; isolation:isolate;
}
.tile img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2; transition:transform .5s ease}
.tile::after{
  content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(180deg,rgba(18,21,28,0) 32%,rgba(18,21,28,.78) 100%);
}
.tile:hover img{transform:scale(1.05)}
.tile__body{padding:1.35rem 1.45rem; width:100%}
.tile h3{color:#fff; margin-bottom:.3rem; font-size:1.2rem}
.tile p{color:rgba(255,255,255,.86); font-size:.9rem; margin:0}
.tile__meta{
  display:inline-flex; align-items:center; gap:.4rem; margin-top:.7rem;
  font-size:.82rem; font-weight:600; color:#fff;
}
.tile__meta::after{content:"→"; transition:transform .2s ease}
.tile:hover .tile__meta::after{transform:translateX(3px)}
/* DUAL POWER fotka má za textom svetlý banner fitka — dlaždica už nie je vysoká, tak treba tmavší prekryv všade */
.tile--dual::after{background:linear-gradient(180deg,rgba(18,21,28,.35) 0%,rgba(18,21,28,.88) 100%)}
.tile--tall{grid-row:span 2; min-height:100%}
.tile--tall .tile__body{padding:1.7rem 1.6rem}
.tile--tall h3{font-size:clamp(1.3rem,1.1rem + .7vw,1.6rem)}
/* 6 položiek (intro + 5 dlaždíc, 2 vysoké): intro na dva riadky, aby mriežka 3×3 nemala dieru */
.bento--six .bento__intro{grid-row:span 2}
/* 2×2 dlaždíc bez vysokej: pri 230 px padol nadpis DUAL POWER cez tváre; 270 px + orez dual-power-tile.webp
   (začína tesne nad hlavami, ukotvený hore) drží tváre nad textom na všetkých šírkach */
.bento--six .tile{min-height:270px}

/* ---------- ikona v karte (o-mne) ---------- */
.card__icon{
  width:50px; height:50px; border-radius:14px; background:var(--tint);
  display:grid; place-items:center; color:var(--magenta-dark); margin-bottom:1.15rem;
}
.card__icon svg{width:25px; height:25px}

/* ---------- pás fotiek (vysledky) ---------- */
.photo-strip{display:grid; grid-template-columns:repeat(3,1fr); gap:1.1rem}
.photo-strip img{
  width:100%; aspect-ratio:4/3; object-fit:cover;
  border-radius:var(--radius); box-shadow:var(--shadow);
}

/* ---------- checklist ---------- */
.checklist{list-style:none; margin:1.5rem 0 0; padding:0; display:grid; gap:.75rem}
.checklist li{display:flex; gap:.7rem; align-items:flex-start; font-size:.985rem}
.checklist svg{
  width:22px; height:22px; flex:none; margin-top:.18rem; padding:4px;
  border-radius:50%; background:var(--tint); color:var(--magenta-dark);
}

/* ---------- výsledky ---------- */
.result{
  background:var(--paper); border:1px solid var(--line); border-radius:var(--radius);
  padding:clamp(1.5rem,1.2rem + .9vw,1.9rem); transition:.22s ease;
}
.section--paper .result:not(.result--wide){background:var(--cream)}
.section--sand .result:not(.result--wide){background:var(--paper); border-color:transparent; box-shadow:var(--shadow)}
.result:hover{transform:translateY(-3px); box-shadow:var(--shadow-lg); border-color:transparent}
.result__figure{
  font-family:var(--display); font-weight:700;
  font-size:clamp(2rem,1.5rem + 1.9vw,2.75rem); color:var(--magenta);
  line-height:1; letter-spacing:-.035em; margin:0 0 .4rem;
}
.result__period{font-size:.85rem; font-weight:600; color:var(--muted); margin:0 0 1rem; text-transform:uppercase; letter-spacing:.07em}
.result__name{
  font-family:var(--display); font-weight:700; color:var(--ink);
  font-size:1.08rem; margin:0 0 .55rem; letter-spacing:-.015em;
}
.result > p:not([class]){font-size:.94rem; margin-bottom:0; color:var(--body)}
.result--wide{
  grid-column:1/-1; background:var(--ink); border-color:transparent; color:#C9CEDB;
}
.result--wide .result__figure{color:#FF7DBD}
.result--wide .result__period,
.result--wide .result__name{color:#fff}
.result--wide .result__period{color:#9AA2B4}
.result--wide > p:not([class]){color:#C9CEDB}
.result--wide:hover{transform:none}

.disclaimer{
  margin-top:1.9rem; font-size:.87rem; color:var(--muted);
  border-left:3px solid var(--magenta); padding-left:1.05rem; max-width:52rem; line-height:1.6;
}

/* ---------- recenzie ---------- */
.reviews-band{position:relative; background:var(--ink); overflow:hidden}
.reviews-band__bg{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.2;
}
.reviews-band__inner{position:relative; z-index:1; padding-block:clamp(3.4rem,2.2rem + 5vw,6rem)}
.reviews-band h2{color:#fff}
.reviews-band .eyebrow{color:#FF7DBD}
.reviews-band .eyebrow::before{background:var(--magenta-soft)}
.reviews-band .lede{color:#C9CEDB}

.review{
  background:var(--paper); border-radius:var(--radius); padding:1.75rem;
  margin:0; display:flex; flex-direction:column; box-shadow:var(--shadow-lg);
}
.section--sand .review,.section--cream .review{box-shadow:var(--shadow)}
.stars{display:flex; gap:2px; color:#CE7B00; margin-bottom:.9rem}
.stars svg{width:16px; height:16px}
.review blockquote{margin:0 0 1.3rem; font-size:.99rem; color:var(--ink-soft); line-height:1.66; flex:1}
.review figcaption{
  display:flex; flex-direction:column; font-size:.82rem; color:var(--muted);
  padding-top:1.1rem; border-top:1px solid var(--line);
}
.review figcaption b{font-family:var(--display); color:var(--ink); font-size:1rem; font-weight:700; margin-bottom:.1rem; letter-spacing:-.015em}

.rating-badge{
  display:inline-flex; align-items:center; gap:1rem; margin-top:2.4rem;
  background:var(--paper); border-radius:100px; padding:.85rem 1.7rem .85rem 1.2rem;
  box-shadow:var(--shadow-lg); text-align:left;
}
.rating-badge__score{
  font-family:var(--display); font-weight:700; font-size:2.1rem; color:var(--magenta);
  line-height:1; letter-spacing:-.04em;
}
.rating-badge__txt{font-size:.83rem; color:var(--muted); line-height:1.35; display:flex; flex-direction:column}
.rating-badge__txt b{color:var(--ink); font-weight:600}

/* ---------- dlaždice s číslami ---------- */
.tiles{display:grid; grid-template-columns:repeat(3,1fr); gap:1rem}
.tiles > div{
  background:var(--tint); border-radius:var(--radius-sm); padding:1.15rem 1rem; text-align:center;
}
.section--sand .tiles > div,.section--cream .tiles > div{background:var(--paper)}
.tiles strong{
  display:block; font-family:var(--display); font-weight:700; font-size:1.65rem;
  color:var(--magenta); line-height:1; letter-spacing:-.035em; margin-bottom:.35rem;
}
.tiles span{font-size:.78rem; color:var(--muted); line-height:1.3; display:block}

/* ---------- FAQ ---------- */
.faq{display:grid; gap:.75rem; max-width:52rem; margin-inline:auto}
.faq details{
  background:var(--paper); border:1px solid var(--line);
  border-radius:var(--radius); overflow:hidden; transition:.2s ease;
}
.section--paper .faq details{background:var(--cream)}
.faq details[open]{border-color:transparent; box-shadow:var(--shadow)}
.faq summary{
  cursor:pointer; list-style:none; padding:1.25rem 3.2rem 1.25rem 1.45rem;
  font-family:var(--display); font-weight:700; color:var(--ink); font-size:1.045rem;
  position:relative; letter-spacing:-.015em; line-height:1.35;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:""; position:absolute; right:1.45rem; top:1.55rem;
  width:11px; height:11px; border-right:2.4px solid var(--magenta); border-bottom:2.4px solid var(--magenta);
  transform:rotate(45deg); transition:transform .22s ease;
}
.faq details[open] summary::after{transform:rotate(-135deg); top:1.75rem}
.faq__a{padding:0 1.45rem 1.4rem; font-size:.965rem}
.faq__a p{margin-bottom:.8rem}
.faq__a p:last-child{margin-bottom:0}

/* ---------- CTA pás ---------- */
.cta-band{
  position:relative; overflow:hidden; background:var(--ink); color:#C9CEDB;
  padding-block:clamp(3.2rem,2.2rem + 4.4vw,5.5rem);
}
.cta-band__hex{position:absolute; right:-4rem; top:-3rem; width:22rem; opacity:.10; pointer-events:none}
.cta-band__inner{position:relative; max-width:44rem}
.cta-band h2{color:#fff; margin-bottom:.6rem}
.cta-band .lede{margin-bottom:2rem}
.cta-band .eyebrow{color:#FF7DBD}
.cta-band .eyebrow::before{background:var(--magenta-soft)}

/* magenta CTA karta (Treina newsletter box) */
.cta-card{
  background:var(--magenta); border-radius:var(--radius-lg); color:#fff;
  padding:clamp(1.9rem,1.4rem + 2.2vw,3.2rem);
  display:grid; grid-template-columns:1.35fr 1fr; gap:2rem; align-items:center;
  box-shadow:0 24px 60px rgba(225,6,126,.28); position:relative; overflow:hidden;
}
.cta-card::before{
  content:""; position:absolute; right:-5rem; top:-7rem;
  width:22rem; aspect-ratio:1; border-radius:50%; background:rgba(255,255,255,.09);
}
.cta-card > *{position:relative; z-index:1}
.cta-card h2{color:#fff; margin-bottom:.5rem; font-size:clamp(1.6rem,1.25rem + 1.5vw,2.35rem)}
.cta-card p{color:#fff; margin:0; font-size:1rem}
.cta-card .btn-row{justify-content:flex-end}

/* ---------- note ---------- */
.note{
  background:var(--tint); border-radius:var(--radius-sm); padding:1.15rem 1.3rem;
  font-size:.94rem; color:var(--ink-soft); border-left:3px solid var(--magenta);
}

/* ---------- kontakt ---------- */
.contact-grid{display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,1.2rem + 3.4vw,4rem); align-items:start}
.contact-list{list-style:none; margin:0; padding:0; display:grid; gap:1rem}
.contact-list li{display:flex; gap:.95rem; align-items:flex-start}
.contact-list__ico{
  width:42px; height:42px; flex:none; border-radius:50%;
  display:grid; place-items:center; background:var(--tint); color:var(--magenta-dark);
}
.contact-list__ico svg{width:20px; height:20px}
.contact-list b{display:block; font-family:var(--display); color:var(--ink); font-weight:700; font-size:1rem; margin-bottom:.1rem; letter-spacing:-.015em}
.contact-list a{text-decoration:none; font-weight:500}
.contact-list li > span:not([class]){font-size:.94rem}

.hours{width:100%; border-collapse:collapse; font-size:.95rem}
.hours .off th,.hours .off td{color:var(--muted)}
.hours th,.hours td{padding:.72rem .3rem; text-align:left; border-bottom:1px solid var(--line)}
.hours th{font-weight:500; color:var(--body)}
.hours td{text-align:right; font-weight:600; color:var(--ink)}
.hours tr:last-child th,.hours tr:last-child td{border-bottom:none}

.map-frame{
  border-radius:var(--radius-lg); overflow:hidden; border:1px solid var(--line);
  box-shadow:var(--shadow); line-height:0;
}
.map-frame iframe{width:100%; height:380px; border:0; display:block}

/* ---------- footer ---------- */
.site-footer{background:var(--ink); color:#9AA2B4; padding-block:clamp(3rem,2.2rem + 3vw,4.5rem) 2rem; font-size:.93rem}
.footer-grid{display:grid; grid-template-columns:1.7fr 1fr 1.3fr; gap:clamp(1.8rem,1.2rem + 3vw,4rem)}
.footer-brand{display:flex; align-items:center; gap:.65rem; margin-bottom:1rem}
.footer-brand img{width:34px; height:34px}
.footer-brand span{font-family:var(--display); font-weight:700; font-size:1.12rem; color:#fff; letter-spacing:-.02em}
.footer-heading{
  font-family:var(--sans); font-size:.72rem; letter-spacing:.15em; text-transform:uppercase;
  color:#fff; font-weight:700; margin-bottom:1.05rem;
}
.site-footer ul{list-style:none; margin:0; padding:0; display:grid; gap:.65rem}
.site-footer a{color:#9AA2B4; text-decoration:none}
.site-footer a:hover{color:#fff}
.socials{display:flex; gap:.6rem; margin-top:1.3rem}
.socials a{
  width:42px; height:42px; border-radius:50%; display:grid; place-items:center;
  background:rgba(255,255,255,.07); color:#fff; transition:.2s ease;
}
.socials a:hover{background:var(--magenta); transform:translateY(-2px)}
.socials svg{width:19px; height:19px}
.footer-bottom{
  margin-top:clamp(2.2rem,1.6rem + 2vw,3.2rem); padding-top:1.5rem;
  border-top:1px solid rgba(255,255,255,.1);
  display:flex; flex-wrap:wrap; gap:.6rem 1.5rem; justify-content:space-between;
  font-size:.82rem; color:#7C8395;
}

/* .reveal je zámerne bez animácie — fullPage screenshoty nescrollujú,
   takže čokoľvek závislé na IntersectionObserveri by ostalo prázdne. */

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:1080px){
  .hero__badge{left:-1%; bottom:12%}
  .hero__chip{right:-1%}
}

/* Burger platí do 70em (= 1120 px pri bežnom písme). V em, nie v px: keď má niekto
   v telefóne/tablete zväčšené písmo, prah sa posunie s ním a sedem odkazov + CTA
   nikdy nevytečie mimo obrazovky (body má overflow-x:hidden, takže by sa ticho orezali —
   „stránka sa nezobrazila celá“, 22.9.2026). */
@media (max-width:70em){
  .burger{display:block}
  html.js .nav{
    position:fixed; inset:78px 0 auto 0; z-index:60;
    flex-direction:column; align-items:stretch; gap:0;
    background:#fff; border-bottom:1px solid var(--line);
    padding:1rem var(--gutter) 1.6rem;
    box-shadow:0 22px 40px rgba(18,21,28,.14);
    opacity:0; visibility:hidden; transform:translateY(-10px);
    transition:opacity .2s ease, transform .2s ease, visibility .2s;
    /* na nízkych/landscape displejoch sa menu musí dať doscrollovať */
    max-height:calc(100dvh - 78px); overflow-y:auto; overscroll-behavior:contain;
  }
  html.js body.nav-open .nav{opacity:1; visibility:visible; transform:none}
  html.js body.nav-open::after{
    content:""; position:fixed; inset:78px 0 0 0; z-index:55; background:rgba(18,21,28,.45);
  }
  html.js .nav > a:not([class]){padding:.95rem .2rem; border-bottom:1px solid var(--line); border-radius:0; font-size:1.04rem}
  /* posledný bežný odkaz (Kontakt) — za ním už nasleduje len CTA tlačidlo */
  html.js .nav > a:not([class]):nth-last-of-type(2){border-bottom:none}
  html.js .nav .btn{margin:1.15rem 0 0; width:100%; padding:1.05rem 1.5rem}
  /* bez JS: menu ostáva viditeľné ako zalomený riadok */
  html:not(.js) .burger{display:none}
  html:not(.js) .nav{flex-wrap:wrap; justify-content:flex-end; gap:.15rem}

}

@media (max-width:960px){
  .hero__grid{grid-template-columns:1fr; gap:0}
  .hero__copy{padding-bottom:1rem; text-align:center}
  .hero__copy .eyebrow{justify-content:center}
  .hero__sub{margin-inline:auto}
  .hero .btn-row{justify-content:center}
  .hero__media{height:clamp(380px,74vw,520px); margin-top:1.5rem}
  .hero__badge{left:0; bottom:10%; padding:.8rem .95rem; max-width:13rem}
  .hero__chip{right:0; top:2%; max-width:11rem; font-size:.75rem}

  .statbar__inner{grid-template-columns:repeat(2,1fr); gap:1.6rem 1rem}

  .split{grid-template-columns:1fr; gap:2rem}
  .split--rev .split__media{order:0}
  .split__media--portrait img{aspect-ratio:4/3; object-position:50% 18%}
  /* v 4:3 by sa trojica nezmestila celá (910 px postáv v 900 px výrezu) — štvorec ju vycentruje */
  .split__media--dual img{aspect-ratio:1/1; object-position:50% 84%}
  .float-card{right:1rem; bottom:1rem}

  .grid--4{grid-template-columns:repeat(2,1fr)}
  .contact-grid{grid-template-columns:1fr; gap:2.6rem}
  .footer-grid{grid-template-columns:1fr 1fr; gap:2.2rem}
  .footer-grid > :first-child{grid-column:1/-1}

  .bento{grid-template-columns:repeat(2,1fr)}
  .tile--tall{grid-row:auto; min-height:230px}
  .bento--six .bento__intro{grid-row:auto; grid-column:1/-1}

  .cta-card{grid-template-columns:1fr; gap:1.5rem}
  .cta-card .btn-row{justify-content:flex-start}
}

@media (min-width:641px) and (max-width:900px){
  .grid--3{grid-template-columns:repeat(2,1fr)}
  .grid--3 > :last-child:nth-child(odd){grid-column:1/-1; max-width:calc(50% - .75rem); justify-self:center}
  .grid--3 > .result--wide{grid-column:1/-1; max-width:none}
}

@media (max-width:640px){
  .grid--2,.grid--3,.grid--4{grid-template-columns:1fr}
  .bento{grid-template-columns:1fr}
  .photo-strip{grid-template-columns:1fr}
  .statbar__inner{grid-template-columns:repeat(2,1fr)}
  .footer-grid{grid-template-columns:1fr}
  .footer-bottom{flex-direction:column}
  /* kruh končí presne na hrane sekcie, aby orez fotky pôsobil zámerne */
  .hero__blob,.hero__ring{bottom:0}
  .hero__badge{left:0; bottom:4%; padding:.7rem .9rem; max-width:12rem; gap:.6rem}
  .hero__badge strong{font-size:1.5rem}
  .hero__badge span{font-size:.7rem}
  .hero__chip{display:none}
  /* na mobile by prekryla väčšinu fotky a text sa aj tak opakuje nižšie v krokoch */
  .float-card{display:none}
  .rating-badge{flex-direction:column; text-align:center; border-radius:var(--radius); gap:.5rem; padding:1.4rem 1.6rem}
  .rating-badge__txt{text-align:center}
  .map-frame iframe{height:300px}
  .steps li{padding:1rem 1.05rem; gap:.85rem}
  .step-dot{width:38px; height:38px; font-size:.95rem}
}

@media (max-width:460px){
  .tiles{grid-template-columns:1fr}
  .btn{width:100%}
  .btn-row{gap:.65rem}
  .hero .btn-row .btn{width:100%}
}

@media print{
  .site-header,.burger,.cta-band,.skip-link{display:none}
  body{background:#fff}
}

/* ============================================================
   REZERVÁCIA — žiadosť o termín
   Statická stránka nevie nič uložiť, preto formulár na konci
   poskladá vyplnený e-mail. Žiadne „rezervácia potvrdená“ —
   termín potvrdzuje Jana, formulár len pripraví správu.
   ============================================================ */
.booking{
  background:var(--paper); border:1px solid var(--line); border-radius:var(--radius-lg);
  padding:clamp(1.35rem,1rem + 1.7vw,2.7rem); box-shadow:var(--shadow-lg);
}
.booking__step{border-top:1px solid var(--line); margin-top:1.9rem; padding-top:1.9rem}
.booking__step--first{border-top:0; margin-top:0; padding-top:0}
.booking__legend{
  display:flex; align-items:center; gap:.8rem; margin:0 0 1.2rem;
  font-family:var(--display); font-weight:700; font-size:1.16rem;
  color:var(--ink); letter-spacing:-.01em;
}
.booking__legend i{
  flex:none; width:29px; height:29px; border-radius:50%;
  background:var(--magenta); color:#fff; display:grid; place-items:center;
  font-style:normal; font-size:.84rem; font-weight:700; line-height:1;
}
.booking__hint{margin:-.7rem 0 1.2rem; font-size:.9rem; color:var(--muted)}

/* výber služby / termínu — karty s rádiom */
.opt-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:.85rem}
.opt{
  position:relative; display:block; cursor:pointer;
  border:1.5px solid var(--line); border-radius:var(--radius-sm);
  padding:1.05rem 1.15rem; background:var(--paper); transition:.18s ease;
}
.opt:hover{border-color:var(--line-strong); background:var(--cream)}
.opt input{position:absolute; opacity:0; width:0; height:0}
.opt:has(input:checked){
  border-color:var(--magenta); background:var(--tint);
  box-shadow:0 0 0 3px rgba(225,6,126,.12);
}
.opt:has(input:focus-visible){outline:3px solid var(--magenta-dark); outline-offset:2px}
.opt b{display:block; font-family:var(--display); font-weight:700; color:var(--ink); font-size:1rem}
.opt span{display:block; margin-top:.22rem; font-size:.875rem; line-height:1.5; color:var(--muted)}

/* časové možnosti — menšie dlaždice */
.opt-grid--slim{grid-template-columns:repeat(4,1fr); gap:.7rem}
.opt-grid--slim .opt{padding:.85rem .8rem; text-align:center}
.opt-grid--slim .opt b{font-size:.93rem}
.opt-grid--slim .opt span{font-size:.8rem; margin-top:.1rem}

/* textové polia */
.field-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:1rem}
.field{display:block}
/* `display:block` vyššie by inak prebilo atribút hidden, ktorý prepína JS */
.field[hidden]{display:none}
.field > span{
  display:block; margin-bottom:.42rem; font-size:.885rem;
  font-weight:600; color:var(--ink-soft);
}
.field > span em{font-style:normal; color:var(--muted); font-weight:400}
.field input,.field textarea{
  width:100%; font-family:var(--sans); font-size:1rem; color:var(--ink);
  background:var(--paper); border:1.5px solid var(--line-strong);
  border-radius:var(--radius-sm); padding:.85rem 1rem; transition:.18s ease;
}
.field textarea{min-height:7.5rem; resize:vertical; line-height:1.6}
.field input:hover,.field textarea:hover{border-color:var(--muted)}
.field input:focus,.field textarea:focus{
  outline:0; border-color:var(--magenta); box-shadow:0 0 0 3px rgba(225,6,126,.14);
}
.field--full{grid-column:1/-1}
.field.is-bad input,.field.is-bad textarea{border-color:#C6265A; background:#FFF5F8}
.field__err{display:none; margin-top:.35rem; font-size:.83rem; color:#C6265A}
.field.is-bad .field__err{display:block}

/* zhrnutie výberu */
.booking__summary{
  margin-top:1.9rem; border-radius:var(--radius); background:var(--tint);
  padding:1.15rem 1.3rem; font-size:.94rem; color:var(--ink-soft);
}
.booking__summary b{color:var(--ink)}
.booking__actions{display:flex; flex-wrap:wrap; gap:.8rem; align-items:center; margin-top:1.5rem}
.booking__note{margin-top:1.1rem; font-size:.875rem; color:var(--muted); line-height:1.6}

/* panel po odoslaní — hovorí presne to, čo sa stalo: otvoril sa e-mail */
.booking__out{
  margin-top:1.6rem; border:1.5px solid var(--magenta); border-radius:var(--radius);
  background:var(--tint); padding:1.3rem 1.4rem;
}
.booking__out[hidden]{display:none}
.booking__out h3{margin:0 0 .5rem; font-size:1.1rem}
.booking__out p{margin:0 0 .9rem; font-size:.93rem}
.booking__out pre{
  margin:0 0 1rem; padding:1rem 1.1rem; background:var(--paper);
  border:1px solid var(--line); border-radius:var(--radius-sm);
  font-family:ui-monospace,'Cascadia Code',Consolas,monospace;
  font-size:.83rem; line-height:1.65; color:var(--ink-soft);
  white-space:pre-wrap; word-break:break-word; max-height:19rem; overflow:auto;
}

@media (max-width:860px){
  .opt-grid{grid-template-columns:1fr}
  .opt-grid--slim{grid-template-columns:repeat(2,1fr)}
  .field-grid{grid-template-columns:1fr}
}
@media (max-width:560px){
  .booking__actions .btn{width:100%}
}

/* ============================================================
   V.I.P. PROGRAM (vip-program.html)
   Bonusový balík = karta so zoznamom položiek a hodnotou vpravo.
   Hodnoty sú Janine vlastné čísla z jej PDF — nič sa tu neráta.
   ============================================================ */
.bonus{
  background:var(--paper); border:1px solid var(--line); border-radius:var(--radius-lg);
  padding:clamp(1.4rem,1.1rem + 1.2vw,2.1rem); box-shadow:var(--shadow-lg);
}
.bonus__head{
  display:flex; align-items:flex-end; justify-content:space-between; gap:1rem; flex-wrap:wrap;
  padding-bottom:1rem; margin-bottom:.4rem; border-bottom:1px solid var(--line);
}
.bonus__head h3{margin:0; font-size:1.25rem}
.bonus__total{
  font-family:var(--display); font-weight:700; font-size:clamp(1.7rem,1.3rem + 1.4vw,2.3rem);
  color:var(--magenta); letter-spacing:-.035em; line-height:1;
}
.bonus ul{list-style:none; margin:0; padding:0}
.bonus li{
  display:flex; justify-content:space-between; align-items:flex-start; gap:1rem;
  padding:.85rem 0; border-bottom:1px dashed var(--line);
}
.bonus li:last-child{border-bottom:0; padding-bottom:0}
.bonus li b{display:block; font-family:var(--display); font-weight:700; color:var(--ink); font-size:.98rem; letter-spacing:-.012em; line-height:1.3}
.bonus li small{display:block; font-size:.86rem; color:var(--muted); line-height:1.5; margin-top:.15rem}
.bonus__val{
  flex:none; margin-top:.1rem;
  font-family:var(--display); font-weight:700; font-size:.9rem; letter-spacing:-.01em;
  color:var(--magenta-dark); background:var(--tint); border-radius:100px; padding:.4rem .8rem;
  white-space:nowrap; line-height:1;
}
.bonus__val--text{font-family:var(--sans); font-size:.68rem; letter-spacing:.09em; text-transform:uppercase; padding:.5rem .75rem}

/* citát na záver programu */
.pullquote{
  margin:clamp(2.4rem,1.8rem + 2vw,3.4rem) auto 0; max-width:48rem; text-align:center;
  font-family:var(--display); font-weight:700; color:var(--ink);
  font-size:clamp(1.2rem,1rem + .9vw,1.65rem); letter-spacing:-.022em; line-height:1.35;
}
.pullquote cite{
  display:block; margin-top:1rem; font-family:var(--sans); font-style:normal; font-weight:600;
  font-size:.78rem; letter-spacing:.13em; text-transform:uppercase; color:var(--muted);
}

@media (max-width:520px){
  .bonus li{flex-direction:column; gap:.45rem}
  .bonus__val{align-self:flex-start}
}

/* ============================================================
   ROZVRH SKUPINOVÝCH TRÉNINGOV FIT LADIES
   Zámerne veľký a čitateľný — klientka si pýtala, aby časy
   skupiniek boli na webe vidieť na prvý pohľad.
   ============================================================ */
.schedule-band{background:var(--ink); color:#C9CEDB; position:relative; overflow:hidden}
.schedule-band::before{
  content:""; position:absolute; inset:auto -6rem -9rem auto; width:26rem; height:26rem;
  border-radius:50%; background:radial-gradient(circle,rgba(225,6,126,.35) 0%,rgba(225,6,126,0) 70%);
  pointer-events:none;
}
.schedule{
  position:relative; z-index:1; display:grid; grid-template-columns:1fr 1.15fr;
  gap:clamp(1.8rem,1.2rem + 3vw,3.6rem); align-items:center;
  padding-block:clamp(2.6rem,1.8rem + 3.4vw,4.4rem);
}
.schedule .eyebrow{color:#FF7DBD}
.schedule .eyebrow::before{background:var(--magenta-soft)}
.schedule__intro h2{color:#fff; margin-bottom:.5rem; font-size:clamp(1.75rem,1.3rem + 2vw,2.7rem)}
.schedule__intro p{margin:0; color:#C9CEDB; font-size:1rem; max-width:26rem}
.schedule__slots{display:grid; grid-template-columns:repeat(2,1fr); gap:1.1rem}
.schedule__slot{
  background:rgba(255,255,255,.055); border:1px solid rgba(255,255,255,.14);
  border-radius:var(--radius); padding:1.5rem 1.5rem 1.35rem; text-align:center;
}
.schedule__slot--eve{background:var(--magenta); border-color:transparent; box-shadow:0 14px 34px rgba(225,6,126,.3)}
.schedule__label{
  display:block; font-size:.72rem; font-weight:700; letter-spacing:.15em;
  text-transform:uppercase; color:#FF7DBD; margin-bottom:.45rem;
}
.schedule__slot--eve .schedule__label{color:rgba(255,255,255,.82)}
.schedule__time{
  display:block; font-family:var(--display); font-weight:800; color:#fff;
  font-size:clamp(2.6rem,1.9rem + 3.2vw,4rem); line-height:1; letter-spacing:-.035em;
}
.schedule__day{display:block; margin-top:.5rem; font-size:.87rem; color:#9AA2B4; line-height:1.4}
.schedule__slot--eve .schedule__day{color:rgba(255,255,255,.88)}
.schedule__note{
  grid-column:1/-1; margin:0; padding-top:.3rem; font-size:.9rem; color:#9AA2B4; line-height:1.55;
}
.schedule__note b{color:#fff; font-weight:600}

@media (max-width:860px){
  .schedule{grid-template-columns:1fr; gap:1.8rem}
}
@media (max-width:420px){
  .schedule__slots{grid-template-columns:1fr}
}

/* ============================================================
   NÁŠ TÍM — spoločná fotka + karty členiek tímu
   Poradie kariet aj popis pod fotkou idú zľava doprava presne
   tak, ako stoja na spoločnej fotke (Betka · Janka · Majka).
   ============================================================ */
.team-photo{margin:0 auto; position:relative; max-width:920px}
.team-photo__frame{
  position:relative; border-radius:var(--radius-lg); overflow:hidden;
  box-shadow:var(--shadow-lg);
}
.team-photo__frame img{width:100%; aspect-ratio:4/3; object-fit:cover; display:block}
.team-photo figcaption{
  margin-top:1.05rem; font-size:.9rem; color:var(--muted);
  display:flex; flex-wrap:wrap; align-items:center; justify-content:center;
  gap:.45rem .9rem; text-align:center;
}
.team-photo figcaption span{
  display:inline-flex; align-items:center; gap:.42rem;
  color:var(--ink); font-weight:600;
}
.team-photo figcaption span::before{
  content:""; width:8px; height:8px; border-radius:50%;
  background:var(--magenta); flex:none;
}
.team-photo figcaption em{font-style:normal; font-weight:400; color:var(--muted)}

.team{display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem}
.team__member{
  display:flex; flex-direction:column; overflow:hidden;
  background:var(--paper); border:1px solid var(--line);
  border-radius:var(--radius-lg);
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.section--cream .team__member,
.section--sand .team__member{border-color:transparent; box-shadow:var(--shadow)}
.team__member:hover{transform:translateY(-4px); box-shadow:var(--shadow-lg); border-color:transparent}
.team__photo{position:relative; aspect-ratio:4/5; overflow:hidden; background:var(--tint)}
.team__photo img{
  width:100%; height:100%; object-fit:cover; object-position:50% 14%;
  display:block; transition:transform .5s ease;
}
.team__member:hover .team__photo img{transform:scale(1.04)}
.team__role{
  position:absolute; left:1rem; bottom:1rem; z-index:1;
  background:var(--magenta); color:#fff; border-radius:999px;
  font-size:.688rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  padding:.46rem .85rem; line-height:1.25;
  box-shadow:0 8px 22px rgba(142,3,80,.28);
}
.team__body{display:flex; flex-direction:column; flex:1; padding:1.45rem 1.5rem 1.6rem}
.team__name{
  font-family:var(--display); font-weight:800; color:var(--ink);
  font-size:1.55rem; letter-spacing:-.025em; line-height:1.1; margin:0;
}
.team__full{
  display:block; margin:.3rem 0 .95rem;
  font-size:.83rem; color:var(--muted); font-weight:500; letter-spacing:.01em;
}
.team__body > p{font-size:.95rem; margin-bottom:0}
.team__link{margin-top:auto; padding-top:1.25rem}

/* pás s mottom tímu z podkladov klientky */
.team-motto{
  list-style:none; margin:0; padding:0;
  display:flex; flex-wrap:wrap; justify-content:center;
  gap:.9rem clamp(1.4rem,1rem + 2.4vw,3.2rem);
}
.team-motto li{
  display:inline-flex; align-items:center; gap:.65rem;
  font-family:var(--display); font-weight:700; color:#fff;
  font-size:clamp(.95rem,.86rem + .4vw,1.2rem); letter-spacing:.02em;
}
.team-motto li::before{
  content:""; width:9px; height:9px; border-radius:50%;
  background:var(--magenta-soft); flex:none;
}

@media (max-width:900px){
  .team{grid-template-columns:repeat(3,1fr); gap:1.1rem}
  .team__body{padding:1.2rem 1.15rem 1.35rem}
  .team__name{font-size:1.32rem}
  .team__role{left:.7rem; bottom:.7rem; font-size:.63rem; padding:.4rem .7rem}
}
@media (max-width:720px){
  .team{grid-template-columns:1fr; gap:1.4rem}
  .team__body{padding:1.45rem 1.5rem 1.6rem}
  .team__name{font-size:1.55rem}
  .team__photo{aspect-ratio:3/2}
  /* portréty tim-*.webp sú orezané rovnako (hlava 32 % šírky, 10 % nad hlavou) — jedna hodnota sedí všetkým */
  .team__photo img{object-position:50% 5%}
}

/* zoznam členiek tímu vedľa spoločnej fotky na úvodnej stránke */
.roster{list-style:none; margin:1.2rem 0 0; padding:0; display:grid; gap:.7rem}
.roster li{
  display:flex; flex-wrap:wrap; align-items:baseline; gap:.15rem .75rem;
  padding:.9rem 1.15rem; background:var(--paper);
  border:1px solid var(--line); border-radius:var(--radius-sm);
}
.section--cream .roster li,
.section--sand .roster li{border-color:transparent; box-shadow:var(--shadow)}
.roster b{
  font-family:var(--display); font-weight:700; color:var(--ink);
  font-size:1.06rem; letter-spacing:-.018em; line-height:1.3;
}
.roster span{font-size:.92rem; color:var(--muted); line-height:1.45}


/* ============================================================
   GALÉRIA (galeria.html + pás na úvodnej stránke)
   Mriežka je murivo cez CSS `columns`, aby sa fotky NEOREZÁVALI —
   každá si nesie svoj vlastný pomer strán. Fotky sú jej skutočné,
   takže ich nechávame tak, ako ich odfotila.
   ============================================================ */
.gallery{columns:2; column-gap:1rem}
@media (min-width:640px){.gallery{columns:3; column-gap:1.15rem}}
@media (min-width:1024px){.gallery{columns:4; column-gap:1.3rem}}

.gallery__item{
  display:block; width:100%; padding:0; margin:0 0 1rem;
  border:0; background:none; font:inherit; color:inherit;
  border-radius:var(--radius-sm); overflow:hidden; cursor:zoom-in;
  break-inside:avoid; -webkit-column-break-inside:avoid;
  box-shadow:var(--shadow);
  transition:transform .25s ease, box-shadow .25s ease;
}
@media (min-width:1024px){.gallery__item{margin-bottom:1.3rem}}
.gallery__item img{width:100%; height:auto; border-radius:inherit}
.gallery__item:hover{transform:translateY(-3px); box-shadow:var(--shadow-lg)}
.gallery__item:focus-visible{outline:3px solid var(--magenta); outline-offset:3px}
@media (prefers-reduced-motion:reduce){.gallery__item{transition:none}}

.gallery__note{
  margin-top:1.9rem; font-size:.92rem; color:var(--muted);
}

/* pás šiestich fotiek na úvodnej stránke — samé portréty 3:4, teda bez orezu */
.gallery-strip{display:grid; grid-template-columns:repeat(2,1fr); gap:1rem}
@media (min-width:640px){.gallery-strip{grid-template-columns:repeat(3,1fr); gap:1.15rem}}
@media (min-width:1024px){.gallery-strip{grid-template-columns:repeat(6,1fr); gap:1.1rem}}
.gallery-strip img{
  width:100%; aspect-ratio:3/4; object-fit:cover;
  border-radius:var(--radius-sm); box-shadow:var(--shadow);
}

/* ---------- lightbox ---------- */
.lb{
  position:fixed; inset:0; z-index:200;
  background:rgba(12,10,16,.94);
  align-items:center; justify-content:center;
  padding:clamp(.9rem,3vw,2.4rem);
}
.lb[hidden]{display:none}
.lb:not([hidden]){display:flex}
body.lb-open{overflow:hidden}

.lb__figure{
  margin:0; display:flex; flex-direction:column; align-items:center; gap:.9rem;
  max-width:min(1100px,100%); max-height:100%;
}
.lb__figure img{
  max-width:100%; max-height:calc(100dvh - 9rem);
  width:auto; height:auto; object-fit:contain;
  border-radius:var(--radius-sm); background:#1A1720;
  box-shadow:0 30px 80px rgba(0,0,0,.5);
}
.lb__figure figcaption{
  display:flex; flex-wrap:wrap; align-items:baseline; justify-content:center; gap:.3rem .9rem;
  color:#E4E1E8; font-size:.92rem; line-height:1.5; text-align:center;
}
.lb__count{color:#9C96A6; font-size:.82rem; font-variant-numeric:tabular-nums}

.lb__close,.lb__nav{
  position:absolute; z-index:2;
  display:grid; place-items:center;
  width:48px; height:48px; padding:0;
  border:1px solid rgba(255,255,255,.22); border-radius:50%;
  background:rgba(255,255,255,.1); color:#fff; cursor:pointer;
  transition:background .18s ease, border-color .18s ease;
}
.lb__close:hover,.lb__nav:hover{background:var(--magenta); border-color:transparent}
.lb__close:focus-visible,.lb__nav:focus-visible{outline:3px solid var(--magenta-soft); outline-offset:3px}
.lb__close svg,.lb__nav svg{width:22px; height:22px}
.lb__close{top:clamp(.8rem,2vw,1.5rem); right:clamp(.8rem,2vw,1.5rem)}
.lb__nav--prev{left:clamp(.5rem,2vw,1.8rem); top:50%; transform:translateY(-50%)}
.lb__nav--next{right:clamp(.5rem,2vw,1.8rem); top:50%; transform:translateY(-50%)}
@media (max-width:560px){
  .lb__nav--prev,.lb__nav--next{top:auto; bottom:.9rem; transform:none}
  .lb__figure img{max-height:calc(100dvh - 11rem)}
}

/* Panel s vysledkom formulara — chybovy stav (send.php, 24.9.2026) */
.booking__out.is-err{border-color:#B3261E; background:#FFF3F2}
