/* ==========================================================================
   ARÁNYTARTÓ MÉRETEZÉS – EGY HELYEN ÁLLÍTHATÓ
   A Canva-terv 1024 px széles vászon. A gyökér betűméret ehhez skáláz, és
   minden méret (betű, térköz, képmagasság) ebből származik. A középső érték
   csökkentése az EGÉSZ oldalt arányosan kisebbé teszi.
   1,375vw = a terv 1:1 mérete · 1,24vw = ~10%-kal visszafogottabb
   ========================================================================== */
html{ font-size:clamp(13.5px, 1.24vw, 20px) !important; }
@media (max-width:1024px){ html{ font-size:14.5px !important; } }

/* ==========================================================================
   Tasty Stories – finom mozgások és felületi hatások
   Minden effekt visszafogott: a cél az elegáns, nyugodt megjelenés, nem a
   figyelemelterelés. Aki csökkentett mozgást kért a rendszerében, annak
   minden animáció kikapcsol (lásd a fájl végén).
   ========================================================================== */

/* -------------------------------------------------- görgetésre megjelenés */
.ts-reveal{
  opacity:0;
  transform:translateY(22px);
  will-change:opacity, transform;
}
.ts-reveal-in{
  opacity:1;
  transform:none;
  transition:opacity .85s cubic-bezier(.22,.61,.36,1),
             transform .85s cubic-bezier(.22,.61,.36,1);
}
/* a képek egy hajszálnyit nagyítva úsznak be */
.ts-reveal-img{ opacity:0; transform:scale(1.04); }
.ts-reveal-img.ts-reveal-in{
  opacity:1; transform:none;
  transition:opacity 1s ease, transform 1.2s cubic-bezier(.22,.61,.36,1);
}

/* ------------------------------------------------------------ hero indítás */
.ts-hero .elementor-widget{ animation:ts-hero-in 1.1s cubic-bezier(.22,.61,.36,1) both; }
.ts-hero .elementor-widget:nth-child(1){ animation-delay:.05s; }
.ts-hero .elementor-widget:nth-child(2){ animation-delay:.18s; }
.ts-hero .elementor-widget:nth-child(3){ animation-delay:.34s; }
@keyframes ts-hero-in{
  from{ opacity:0; transform:translateY(26px); }
  to  { opacity:1; transform:none; }
}

/* ------------------------------------------------------------- fejléc menü */
.ts-header .elementor-nav-menu--main .elementor-item{
  position:relative;
  transition:opacity .3s ease;
}
.ts-header .elementor-nav-menu--main .elementor-item::after{
  content:"";
  position:absolute;
  left:0; right:0; bottom:-.35em;
  height:1px;
  background:currentColor;
  transform:scaleX(0);
  transform-origin:right center;
  transition:transform .45s cubic-bezier(.22,.61,.36,1);
  opacity:.75;
}
.ts-header .elementor-nav-menu--main .elementor-item:hover::after,
.ts-header .elementor-nav-menu--main .elementor-item:focus::after{
  transform:scaleX(1);
  transform-origin:left center;
}

/* ------------------------------------------------------------------ képek */
/* a képkeret levágja a nagyítást, így csak a fotó mozdul */
.ts-vol-img, .ts-story-img, .ts-prod-img, .ts-land-vol,
.ts-why-img, .ts-vol-hero, .ts-gal-img, .ts-prod-hero, .ts-prod-wide,
.ts-hero-card{
  overflow:hidden;
}
.ts-vol-img img, .ts-story-img img, .ts-prod-img img, .ts-land-vol img,
.ts-why-img img, .ts-vol-hero img, .ts-gal-img img, .ts-prod-hero img,
.ts-prod-wide img{
  transition:transform 1.1s cubic-bezier(.22,.61,.36,1), opacity .4s ease;
}
.ts-vol-col:hover .ts-vol-img img,
.ts-story-card:hover .ts-story-img img,
.ts-prod-img:hover img,
.ts-gal-img:hover img,
.ts-why-img:hover img{
  transform:scale(1.045);
}

/* ------------------------------------------------------------ pakk-kártyák */
.ts-vol-col, .ts-story-card{
  transition:transform .5s cubic-bezier(.22,.61,.36,1),
             box-shadow .5s ease, border-color .5s ease;
}
.ts-vol-col:hover, .ts-story-card:hover{
  transform:translateY(-4px);
}
.ts-story-card:hover{
  border-color:#6E6448;
  box-shadow:0 14px 34px rgba(62,55,34,.11);
}
.ts-vol-link a, .ts-vol-link a::after{ transition:all .4s cubic-bezier(.22,.61,.36,1); }
.ts-vol-col:hover .ts-vol-link a{ letter-spacing:2.4px; }

/* ---------------------------------------------------------------- gombok */
.elementor-widget-button .elementor-button{
  position:relative;
  transition:background-color .35s ease, color .35s ease, border-color .35s ease,
             transform .35s cubic-bezier(.22,.61,.36,1), letter-spacing .35s ease;
}
.elementor-widget-button .elementor-button:hover{
  transform:translateY(-2px);
}
.elementor-widget-button .elementor-button:active{ transform:translateY(0); }

/* --------------------------------------------------------- partnerlogók */
.ts-partner-logo img{
  transition:opacity .4s ease, transform .5s cubic-bezier(.22,.61,.36,1);
}
.ts-partner-logo img:hover{ transform:translateY(-3px); }

/* Megjegyzés: a rögzített hátterű (parallax) megoldást szándékosan NEM
   használjuk – a `cover` méretezéssel együtt elrontaná a fotók tervezett
   képkivágását. A mélységérzetet a görgetésre megjelenő elemek adják. */

/* -------------------------------------------------------------- embléma */
.ts-emblem img{ transition:transform .6s cubic-bezier(.22,.61,.36,1), opacity .3s ease; }
.ts-emblem a:hover img{ transform:rotate(-4deg) scale(1.05); }

/* ------------------------------------------------------------- kapcsolat */
.ts-contact-value a{
  background-image:linear-gradient(currentColor, currentColor);
  background-size:0 1px;
  background-repeat:no-repeat;
  background-position:left 100%;
  transition:background-size .45s cubic-bezier(.22,.61,.36,1);
  text-decoration:none;
}
.ts-contact-value a:hover{ background-size:100% 1px; }

/* ---------------------------------------------------------------- űrlap */
.ts-form .elementor-field-textual{
  transition:border-color .3s ease, background-color .3s ease, box-shadow .3s ease;
}
.ts-form .elementor-field-textual:focus{
  background:#fff;
  box-shadow:0 0 0 3px rgba(122,108,94,.12);
}
.ts-form .elementor-button[type="submit"]{
  transition:background-color .3s ease, transform .3s cubic-bezier(.22,.61,.36,1),
             box-shadow .3s ease;
}
.ts-form .elementor-button[type="submit"]:hover{
  transform:translateY(-2px);
  box-shadow:0 10px 24px rgba(122,108,94,.28);
}

/* --------------------------------------------------- vissza a tetejére */
.ts-top{
  position:fixed; right:1.6rem; bottom:1.6rem; z-index:60;
  width:2.9rem; height:2.9rem; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:rgba(83,73,30,.82); color:#F7F3E6;
  border:1px solid rgba(247,243,230,.35);
  opacity:0; visibility:hidden; transform:translateY(10px);
  transition:opacity .4s ease, transform .4s ease, visibility .4s, background-color .3s ease;
  cursor:pointer; backdrop-filter:blur(4px);
}
.ts-top.ts-top-on{ opacity:1; visibility:visible; transform:none; }
.ts-top:hover{ background:rgba(83,73,30,.96); }
.ts-top svg{ width:1rem; height:1rem; }

@media (max-width:767px){
  .ts-top{ right:1rem; bottom:1rem; width:42px; height:42px; }
  .ts-top svg{ width:15px; height:15px; }
}

/* --------------------------------------- csökkentett mozgás tiszteletben */
@media (prefers-reduced-motion:reduce){
  .ts-reveal, .ts-reveal-img{ opacity:1 !important; transform:none !important; }
  .ts-hero .elementor-widget{ animation:none !important; }
  *{ transition-duration:.01ms !important; animation-duration:.01ms !important; }
}

/* ---------------------------------------------------- hero slideshow ---- */
/* Az Elementor csúszkájának takaró rétege alapból teljesen fed – a fotónak
   át kell látszania rajta. */
.ts-hero-slider .elementor-background-overlay{ opacity:.38 !important; }
.ts-hero-slider .swiper-slide-bg{ background-size:cover !important;
  background-position:center center !important; }
.ts-hero-slider .elementor-slide-heading,
.ts-hero-slider .elementor-slide-description{
  text-shadow:0 2px 14px rgba(30,26,12,.55);
}


/* ==========================================================================
   HERO – lassú közelítés/távolodás (Ken Burns) és a szöveg beúszása
   ========================================================================== */
.ts-hero-slider .swiper-slide-bg{
  transform-origin:center center;
  will-change:transform;
  backface-visibility:hidden;
}
/* csak az éppen látható dia mozog, így minden váltásnál újraindul */
.ts-hero-slider .swiper-slide-active .swiper-slide-bg{
  animation:ts-zoom-in 12s ease-out both;
}
.ts-hero-slider .swiper-slide-active[data-swiper-slide-index="1"] .swiper-slide-bg{
  animation-name:ts-zoom-out;
}
@keyframes ts-zoom-in { from{ transform:scale(1); }    to{ transform:scale(1.10); } }
@keyframes ts-zoom-out{ from{ transform:scale(1.10); } to{ transform:scale(1); } }

.ts-hero-slider .swiper-slide-active .elementor-slide-heading,
.ts-hero-slider .swiper-slide-active .elementor-slide-description{
  animation:ts-rise .9s cubic-bezier(.22,.61,.36,1) both;
}
.ts-hero-slider .swiper-slide-active .elementor-slide-description{ animation-delay:.14s; }
@keyframes ts-rise{ from{ opacity:0; transform:translateY(14px); } to{ opacity:1; transform:none; } }

@media (prefers-reduced-motion:reduce){
  .ts-hero-slider .swiper-slide-active .swiper-slide-bg,
  .ts-hero-slider .swiper-slide-active .elementor-slide-heading,
  .ts-hero-slider .swiper-slide-active .elementor-slide-description{ animation:none !important; }
}

/* ==========================================================================
   MOBIL FINOMHANGOLÁS
   ========================================================================== */
@media (max-width:1024px){
  .ts-hero-slider .elementor-slide-heading{ font-size:2.6rem !important; line-height:1.12 !important; }
  .ts-hero-slider .elementor-slide-description{ font-size:1.2rem !important; }
  .ts-pakk-foto img{ height:17rem; }
}

@media (max-width:767px){
  /* hero: kisebb, de arányos felirat, kényelmes magasság */
  .ts-hero-slider .elementor-slide-heading{ font-size:2.15rem !important; }
  .ts-hero-slider .elementor-slide-description{ font-size:1.05rem !important; line-height:1.45 !important; }
  .ts-hero-slider .elementor-slides .swiper-slide-inner{ padding:0 1.4rem; }
  /* a nyilak mobilon zavaróak – a pöttyök és a húzás marad */
  .ts-hero-slider .elementor-swiper-button,
  .ts-hero-slider .elementor-swiper-button-prev,
  .ts-hero-slider .elementor-swiper-button-next{ display:none !important; }
  .ts-hero-slider .swiper-pagination{ bottom:14px; }

  /* aloldalak nyitóképe ne legyen aránytalanul magas */
  .ts-pakk-hero{ min-height:20rem; }
  .ts-page-title .elementor-heading-title{ line-height:1.1; }

  /* lenyíló tételek: nagyobb érintőfelület, olvasható méret */
  .ts-pakk-lista .elementor-tab-title{
    min-height:44px; display:flex; align-items:center; padding:.8rem 0;
    font-size:15px !important; line-height:1.4 !important;
  }
  .ts-pakk-lista .elementor-tab-content{ font-size:14.5px !important; line-height:1.6 !important; }
  .ts-pakk-lista .elementor-accordion-icon{ min-width:1.4rem; }
  .ts-pakk-ar p{ display:block; text-align:center; padding:.8rem 1rem; }
  .ts-pakk-foto img{ height:13rem; }

  /* menü: kényelmes érintőfelület a lenyílóban */
  .ts-header .elementor-nav-menu--dropdown a{ min-height:3rem; display:flex;
    align-items:center; justify-content:center; }
  .ts-header .elementor-menu-toggle{ padding:.4rem; }

  /* a BEST SELLER jelvény ne lógjon ki a képernyőről */
  .ts-bestseller::after{ top:-8px; right:6px; }

  /* képek: sehol ne legyen vízszintes túlcsordulás */
  .elementor-section, .elementor-column{ max-width:100%; }
  img{ max-width:100%; height:auto; }

  /* a rögzített hátterek mobilon akadoznak – görgethető háttér */
  .ts-philosophy, .ts-footerband, .ts-rolunk-story, .ts-pakk-hero{
    background-attachment:scroll !important;
  }
}

/* nagyon keskeny kijelzőn se törjön meg a fejléc */
@media (max-width:400px){
  .ts-wordmark .elementor-heading-title{ font-size:1.15rem !important; }
  .ts-hero-slider .elementor-slide-heading{ font-size:1.85rem !important; }
}


/* ==========================================================================
   LANDING – szövegbuborékok és számlálók a terv szerint
   ========================================================================== */
/* a buborékok FEHÉREK (nem krémek), nagyobb belső tér, lefelé mutató farokkal */
.ts-buborekok .elementor-column > .elementor-widget-wrap{
  background:#FFFFFF !important;
  border-radius:1.5rem !important;
  padding:2.7rem 2.2rem !important;
  position:relative;
  box-shadow:none !important;
}
.ts-buborekok .elementor-column > .elementor-widget-wrap::after{
  content:"" !important; position:absolute;
  left:2.1rem; bottom:-3rem; top:auto;
  width:3.3rem; height:3.3rem;
  background:#FFFFFF !important;
  clip-path:polygon(0 0, 100% 0, 0 100%);
  border-radius:0 0 0 .15rem;
}
/* a buborékok alá kell hely a faroknak */
.ts-buborekok{ margin-bottom:3.4rem !important; }
.ts-buborekok .elementor-heading-title{ line-height:1.4; }

/* számlálók: vékony vonal fölöttük, sötét felirat – ahogy a terven */
.ts-szamlalok{
  border-top:1px solid rgba(62,55,34,.5);
  padding-top:2.8rem !important;
}
.ts-szamlalok .elementor-heading-title{ color:#3A3A2A !important; }
.ts-szamlalok .elementor-widget-text-editor,
.ts-szamlalok .elementor-widget-text-editor p{
  color:#3A3A2A !important; letter-spacing:.4px;
}

@media (max-width:767px){
  .ts-buborekok .elementor-column > .elementor-widget-wrap{ padding:1.8rem 1.4rem !important; }
  .ts-buborekok .elementor-column > .elementor-widget-wrap::after{
    left:1.5rem; bottom:-2.2rem; width:2.4rem; height:2.4rem;
  }
  .ts-buborekok .elementor-column{ margin-bottom:3rem; }
  .ts-buborekok{ margin-bottom:1rem !important; }
  .ts-szamlalok{ padding-top:2rem !important; }
}


/* --- finomítás: térköz a buborékok között, teljes szélességű vonal ------- */
/* a buborékok ne érjenek össze középen */
.ts-buborekok > .elementor-container > .elementor-column:first-child
  > .elementor-widget-wrap{ margin-right:.9rem; }
.ts-buborekok > .elementor-container > .elementor-column:last-child
  > .elementor-widget-wrap{ margin-left:.9rem; }

/* a számlálók fölötti vonal a teljes képernyőszélességet fogja át */
.ts-szamlalok{ border-top:0 !important; position:relative; }
.ts-szamlalok::before{
  content:""; position:absolute; top:0; left:50%;
  transform:translateX(-50%);
  width:100vw; height:1px;
  background:rgba(62,55,34,.5);
}

@media (max-width:767px){
  .ts-buborekok > .elementor-container > .elementor-column:first-child
    > .elementor-widget-wrap,
  .ts-buborekok > .elementor-container > .elementor-column:last-child
    > .elementor-widget-wrap{ margin-left:0; margin-right:0; }
}


/* ==========================================================================
   Ügyfél-visszajelzés (2026-08-12)
   ========================================================================== */
/* 5. „Miért épp tőlünk?” – az Optima itt rosszul hozza az „ő”-t → Lato,
      és a leíró szöveg nagyobb, hogy látványosabb legyen */
.ts-reason,
.ts-reason p,
.ts-reason .ts-reason-title,
.ts-reason .ts-reason-body{
  font-family:'Lato', sans-serif !important;
}
.ts-reason .ts-reason-body{ font-size:1.02rem !important; line-height:1.6 !important; }
.ts-reason .ts-reason-title{ font-size:1.02rem !important; }

/* 7. aloldalak menüje: hover/aktív állapotban fehér, ne halványzöld */
.ts-topnav .elementor-nav-menu--main .elementor-item:hover,
.ts-topnav .elementor-nav-menu--main .elementor-item:focus,
.ts-topnav .elementor-nav-menu--main .elementor-item.elementor-item-active,
.ts-topnav .elementor-nav-menu--main .elementor-item.highlighted,
.ts-header .elementor-nav-menu--dropdown a:hover,
.ts-header .elementor-nav-menu--dropdown a.elementor-item-active{
  color:#FFFFFF !important; opacity:1 !important;
}

@media (max-width:767px){
  .ts-reason .ts-reason-body{ font-size:15px !important; }
  .ts-reason .ts-reason-title{ font-size:15px !important; }
}


/* --- 1./2./3. pont: fejléc a képre fut, keret nélküli slideshow, világos
       Rólunk-blokk (a mellékelt két kép szerint) --------------------------- */

/* a fejléc ne külön sávban legyen, hanem a hero fotón üljön */
.ts-header-home{
  position:absolute !important; top:0; left:0; right:0; z-index:20;
  background:transparent !important; background-color:transparent !important;
}
.ts-header-home .elementor-background-overlay{ display:none !important; }
/* a menü szövege a fotón is olvasható maradjon */
.ts-header-home .elementor-item{ text-shadow:0 1px 12px rgba(30,26,12,.55); }

/* a slideshow fusson ki teljesen – ne legyen fehér keret körülötte */
.ts-hero-wrap,
.ts-hero-wrap > .elementor-container,
.ts-hero-wrap .elementor-column,
.ts-hero-wrap .elementor-widget-wrap,
.ts-hero-wrap .elementor-widget-slides{
  padding:0 !important; margin:0 !important;
}
.ts-hero-wrap .elementor-widget-slides .elementor-slides{ border-radius:0 !important; }

/* Rólunk blokk: világosabb háttér, ahogy a terven */
.ts-rolunk-blokk{ background-color:#FFFCF2 !important; }
.ts-rolunk-blokk .elementor-background-overlay{ display:none !important; }
/* a két kép között legyen látható köz, és azonos magasak legyenek */
.ts-rolunk-kep img{ height:24rem !important; }
.ts-rolunk-blokk .elementor-inner-section .elementor-column:first-child
  .ts-rolunk-kep{ padding-right:.6rem; }
.ts-rolunk-blokk .elementor-inner-section .elementor-column:last-child
  .ts-rolunk-kep{ padding-left:.6rem; }

@media (max-width:767px){
  .ts-header-home{ position:relative !important; background:rgba(83,73,30,.92) !important; }
  .ts-header-home .elementor-item{ text-shadow:none; }
  .ts-rolunk-kep img{ height:15rem !important; }
  .ts-rolunk-blokk .elementor-inner-section .elementor-column .ts-rolunk-kep{
    padding-left:0; padding-right:0;
  }
}


/* --- fejléc: embléma + felirat balra, menü jobbra (átlátszó, a fotón) ----- */
.ts-fejlec-ikon img{ width:2.4rem; height:auto; display:block; }
.ts-header-home .ts-wordmark .elementor-heading-title{
  text-shadow:0 1px 12px rgba(30,26,12,.55);
}
.ts-header-home .elementor-nav-menu--main{ justify-content:flex-end !important; }
.ts-header-home .elementor-nav-menu--main .elementor-nav-menu{
  justify-content:flex-end !important; gap:2.4rem !important; white-space:nowrap;
}
@media (max-width:1024px){
  .ts-header-home .elementor-nav-menu--main .elementor-nav-menu{ gap:1.5rem !important; }
  .ts-fejlec-ikon img{ width:2rem; }
}
@media (max-width:767px){
  .ts-fejlec-ikon img{ width:1.8rem; }
  .ts-header-home .elementor-inner-section .elementor-column{ width:auto !important; }
}


/* ==========================================================================
   Ügyfél-lista: 8., 9., 12., 13., 17., 18., 20. pont
   ========================================================================== */

/* 8. Rólunk aloldal – sorkizárt, rendezettebb szövegtömbök */
.ts-rolunk-blokk .elementor-widget-text-editor,
.ts-rolunk-story .elementor-widget-text-editor{
  text-align:justify !important; hyphens:auto; -webkit-hyphens:auto;
}
.ts-rolunk-blokk .elementor-widget-text-editor p:last-child,
.ts-rolunk-story .elementor-widget-text-editor p:last-child{ margin-bottom:0; }

/* 9. világosabb háttér a bézs szekciókban */
.ts-sec-pakkok, .ts-sec-termelok, .ts-sec-stories,
.ts-sec-miert, .ts-sec-miert-cta{
  background-color:#FFFCF2 !important;
}

/* 13./17. a válogatások neve nagybetűvel */
.ts-vol-label .elementor-heading-title,
.ts-pakk-blokk > .elementor-container .elementor-widget-heading:first-of-type
  .elementor-heading-title{
  text-transform:uppercase;
}

/* 12./18./20. szűkebb térközök a hosszú szöveges részeken */
.ts-igeret-lista + .elementor-widget-divider{ margin-top:1.2rem !important; }
.ts-bovebben{ margin-bottom:.2rem !important; }
.ts-pakk-blokk .elementor-widget-text-editor{ margin-bottom:.6rem !important; }

/* 20. „Neked csak választani kell.” kerüljön közelebb a fölötte lévő szöveghez */
.ts-valasztani{ margin-top:-1.2rem !important; }

@media (max-width:767px){
  .ts-rolunk-blokk .elementor-widget-text-editor,
  .ts-rolunk-story .elementor-widget-text-editor{ text-align:left !important; }
}


/* 15. az ár a leírás alatt, alatta a MEGRENDELEM gomb keretben */
.ts-pakk-ar p{
  display:inline-block; border:0; padding:0; letter-spacing:.5px;
}
.ts-megrendelem .elementor-button{ border-radius:1.6rem; }


/* 10./19./23. a kép és a mellette futó szöveg egy vonalban záruljon */
.ts-pakk-blokk > .elementor-container,
.ts-rolunk-blokk > .elementor-container,
.ts-rolunk-story > .elementor-container{ align-items:stretch; }
.ts-pakk-foto, .ts-landing-portre, .ts-rolunk-portre{
  height:100%; display:flex;
}
.ts-pakk-foto img, .ts-landing-portre img, .ts-rolunk-portre img{
  height:100% !important; min-height:18rem; width:100%; object-fit:cover;
}
/* 22. a landing VOLUME nevei kattinthatók */
.ts-land-vol-link a, .ts-land-vol a{ display:block; color:inherit; text-decoration:none;
  transition:opacity .25s ease; }
.ts-land-vol-link a:hover, .ts-land-vol a:hover{ opacity:.78; }

@media (max-width:767px){
  .ts-pakk-foto img, .ts-landing-portre img, .ts-rolunk-portre img{
    height:14rem !important; min-height:0;
  }
}
