/* =========================================================
   Elementor × Whole You
   Načíta sa len na stránkach postavených v Elementore.

   Pozor: väčšinu dizajnu prináša `elementor-most.css`, ktorý sa generuje
   priamo z hlavného štýlu (mk2.py → most_css). Sem patrí len to, čo sa
   z témy odvodiť nedá — teda preklad našich tried na štruktúru,
   ktorú Elementor vykresľuje (obal widgetu, .elementor-button, figure…).
   ========================================================= */

/* ---------- kontajnery bez vlastných odsadení ---------- */
.elementor .e-con,
.elementor .e-con-inner{
  --padding-block-start:0;--padding-block-end:0;
  --padding-inline-start:0;--padding-inline-end:0;
  --margin-block-start:0;--margin-block-end:0;
  /* medzeru medzi prvkami nesie štýl témy (gap na .hero-cta, .steps…),
     Elementor si sem inak dá svojich 20px */
  --gap:0px;--row-gap:0px;--column-gap:0px;
  gap:0
}

/* ---------- nadpisy ----------
   Základná typografia je v elementor-most.css (v hlavičke), aby ju kontextové
   pravidlá témy vedeli prebiť. Tu ostáva len to, čo z témy odvodiť nevieme. */
.elementor .band-brown .elementor-widget-heading .elementor-heading-title,
.elementor .band-sage .elementor-widget-heading .elementor-heading-title{color:#FCF8EF}

/* ---------- odstavce ----------
   Text widget obalí odstavec ďalším divom. Medzeru preto nesie obal
   (nastavuje ju mostík), vnútorný odstavec ju mať nesmie. */
.elementor .elementor-widget-text-editor{color:inherit}
/* Odsadenie odstavca nesie obal widgetu (pozri elementor-most.css),
   samotný <p> vnútri ho mať nesmie — inak by sa medzery zdvojili. */
.elementor.elementor .elementor-widget-text-editor p{margin:0}
/* zoznam je celý vnútri textového editora, odsadenie si nesie sám */
.elementor.elementor .elementor-widget.elementor-widget.elementor-widget.wy-zoznam{margin-block-end:0}
.elementor .elementor-widget-text-editor a{text-decoration:underline;text-underline-offset:2px}
.elementor .elementor-widget-text-editor a:hover{color:var(--terra)}

/* ---------- tlačidlá ----------
   Triedy z pôvodného HTML sedia na obale widgetu, nie na odkaze, preto majú
   predponu wy- (inak by štýl témy nakreslil tlačidlo dvakrát). */
/* Widget je v riadkovom kontajneri bežný blok — bez tohto by sa roztiahol
   na celú šírku a riadok by sa zalomil. */
.elementor .e-con.hero-cta > .elementor-widget,
.elementor .e-con.s-cta > .elementor-widget,
.elementor .e-con.sl-cta > .elementor-widget,
.elementor .e-con.sl-pata > .elementor-widget{width:auto;flex:0 0 auto}
/* v pätke karty je aj vnorený kontajner s tlačidlami — ten sa tiež
   nesmie roztiahnuť, inak sa cena a tlačidlá rozídu na dva riadky */
.elementor .e-con.sl-pata > *,
.elementor .e-con.sl-pata2 > *{width:auto;flex:0 1 auto}
.elementor .elementor-button{
  display:inline-flex;align-items:center;gap:.6em;line-height:1.75;font-family:var(--sans);
  font-size:.75rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  text-decoration:none;padding:15px 30px;border-radius:100px;border:1.5px solid transparent;
  cursor:pointer;transition:.25s ease;white-space:nowrap;background:none;color:inherit
}
.elementor .elementor-button .elementor-button-content-wrapper{gap:.6em}
.elementor .wy-btn-sm .elementor-button{padding:11px 22px;font-size:.7rem}
.elementor .wy-btn-primary .elementor-button{background:var(--brown);color:#FCF8EF}
.elementor .wy-btn-primary .elementor-button:hover{background:#5F4726;transform:translateY(-2px);box-shadow:0 8px 22px rgba(121,91,51,.28)}
.elementor .wy-btn-terra .elementor-button{background:var(--terra);color:#fff}
.elementor .wy-btn-ghost .elementor-button{border-color:var(--brown);color:var(--brown)}
.elementor .wy-btn-ghost .elementor-button:hover{background:var(--brown);color:var(--paper)}
.elementor .wy-btn-light .elementor-button{border-color:rgba(252,248,239,.65);color:#FCF8EF}
.elementor .wy-btn-light .elementor-button:hover{background:#FCF8EF;color:var(--sage)}
.elementor .wy-btn-solid-light .elementor-button{background:#FCF8EF;color:var(--brown);border-color:#FCF8EF}
.elementor .wy-btn-solid-light .elementor-button:hover{background:#fff;transform:translateY(-2px)}
.elementor .wy-more .elementor-button{
  padding:0;border:0;background:none;color:var(--terra);
  font-size:.72rem;font-weight:600;letter-spacing:.13em
}
.elementor .wy-more .elementor-button:hover{text-decoration:underline;transform:none;box-shadow:none}

/* ---------- fotky v kartách ----------
   Elementor obalí <img> do .elementor-widget-container a <figure>,
   takže „výplňovú“ fotku treba roztiahnuť cez oba obaly. */
.elementor .sl-obr .elementor-widget-container,
.elementor .sl-obr figure,
.elementor .sl-obr a,
.elementor .sl-obr2 .elementor-widget-container,
.elementor .sl-obr2 figure{position:absolute;inset:0;height:100%;width:100%;margin:0}
.elementor .sl-obr img,
.elementor .sl-obr2 img{width:100%;height:100%;object-fit:cover;display:block}

/* ---------- hlavička podstránky v Elementore ---------- */
.elementor .e-con.pagehead-el{padding:76px 24px 30px;gap:0}
.elementor .pagehead-el h1{margin-bottom:.3em}

/* ---------- stredovanie ---------- */
.elementor .e-con.center{align-items:stretch}

/* ---------- ozdoby vložené cez HTML widget ----------
   Elementor dá každému widgetu `position:relative`, takže naše absolútne
   umiestnené ozdoby (aura za Gabi, tvary a vodoznak v sekciách) sa viažu
   na obal widgetu namiesto sekcie a vyletia hore. */
.elementor .elementor-widget-html{position:static}

/* ---------- odkrývanie sekcií v editore ----------
   Sekcie majú triedu `.reveal` (opacity:0) a viditeľnými ich robí až náš
   pozorovateľ v theme.js, ktorý im pri scrollovaní pridá `.in`. V editore
   Elementora sa widgety prekresľujú za behu, pozorovateľ ich už nezachytí —
   a Gabi by videla prázdne farebné pásy. V editore ich preto odkrývame hneď. */
body.elementor-editor-active .reveal,
body.elementor-editor-active .elementor .e-con.reveal,
body.elementor-editor-active .elementor .elementor-widget.reveal{
  opacity:1 !important;transform:none !important;transition:none !important
}

/* ---------- mriežky kariet ----------
   Karta je odkaz (`<a class="card">`), takže ostáva ako HTML widget. Elementor
   ju ale obalí ďalším divom, a ten sa v mriežke stane bunkou — karta by potom
   nedorástla do výšky riadku. Obal preto rozťahujeme na celú bunku. */
.elementor .e-con.cards > .elementor-widget,
.elementor .e-con.cats > .elementor-widget,
.elementor .e-con.posts > .elementor-widget{display:grid}

/* ---------- kroky: čísla dopĺňa počítadlo ----------
   V Elementore sa krok pridáva a presúva myšou, takže číslo nemôže byť
   napísané v texte — inak by ho bolo treba prepisovať ručne. */
.elementor .e-con.steps{counter-reset:krok}
.elementor .e-con.step{counter-increment:krok;position:relative;row-gap:0;column-gap:20px}
.elementor .e-con.step::before{
  content:counter(krok);
  width:44px;height:44px;border-radius:50%;background:var(--cream);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--serif);font-size:1.15rem;color:var(--brown);
  grid-row:1;grid-column:1;align-self:start
}
.elementor .e-con.step > *{grid-column:2}
.elementor .e-con.step .elementor-heading-title{font-size:1.08rem;margin-bottom:.3em}
.elementor.elementor .e-con.step .elementor-widget.elementor-widget.elementor-widget-text-editor{margin-block-end:0;font-size:.95rem;color:var(--muted)}

/* ---------- hero ---------- */
.elementor .e-con.hero h1 em{font-style:italic;color:var(--gold)}
.elementor .e-con.hero-fig .elementor-widget-image{position:relative;z-index:1}