/* =========================================================
   SHOWA EU — a showagroup.com/eu-en főoldal újraépítése.

   Használja: ../../template-showa-landing.php és a mellette lévő index.html.

   A szabályok az eredeti oldal saját stíluslapjának (themes/showa/assets/css/
   app.min.css + a Bootstrap 4 rács a plugins.min.css-ből) átirata: ugyanazok a
   méretek, színek, törésponti értékek és osztálynevek — .banner, .card-slider,
   .product-card, .oval-shape-content, .contact-card és társaik. Ahol eltérünk,
   ott a helyén álló megjegyzés mondja meg, miért.

   AMI SZÁNDÉKOSAN KIMARADT: az eredeti fejléce (utility-bar, main-bar, mega
   menü, mobil drawer), a lábléce és a Cookiebot-widget — ezeket a bestlab
   get_header()/get_footer()-e, illetve a Bestlab Suite Cookie Consent modulja
   adja. A finder-bar sáv marad, csak a háttere lett az eredetié.

   BETŰTÍPUS: az eredeti Gotham/Gotham Book — nem licencelhető, ezért Montserrat
   megy helyette (ugyanaz a geometrikus grotesk karakter, 400/500/700/900).

   MINDEN szabály a .blf-showa burkoló alá van tolva — a változók és a törzs-
   beállítások is azon ülnek. Ez nem kozmetika: a sablon a bestlab fejlécét
   használja, így a theme main.css-e ugyanazon a lapon fut. Hatókör nélkül az
   itteni reset (Montserrat 900 címsorok, listajel nélküli ul, 1140px-es
   .container, a:hover aláhúzás nélkül) a fejlécet is átfestené. Új szabály is
   .blf-showa alá kerüljön — különösen a generikus nevűek (.container, .row,
   .card, .btn, .title), amelyekből a theme is használ egyet-kettőt.
   ========================================================= */

.blf-showa{
  --green:#8fc547;
  --ink:#212020;
  --grey:#aaabab;
  --muted:#545555;
  --fill:#ebebeb;
  --rule:rgba(52,51,51,.1);

  --font:"Montserrat","Gotham","Helvetica Neue",Arial,sans-serif;
  --ease:ease-in-out;

  /* Az eredetiben ezek képfájlok a témában; nálunk az asset-mappában ülnek. */
  --img:url("../img/");
}

.blf-showa,.blf-showa *,.blf-showa *::before,.blf-showa *::after{box-sizing:border-box}
.blf-showa,.blf-showa *,.blf-showa *::before,.blf-showa *::after{z-index:10}

/* A dekorációs rétegek nem foghatnak el kattintást.

   A fenti sor minden pozicionált elemre z-index:10-et tesz, a hírszekció
   tartalma viszont z-index:9 (.all-news .content) — vagyis a díszítés a
   kártyák *fölött* van. Ez addig nem tűnik fel, amíg valamelyik réteg nem
   nagy: a .bottom-line-wrap ágon a .horizontal-line:after egy 100vw széles,
   570px magas doboz a szekció alján, ami pont a hírkártyák alsó felét és az
   „Összes hír” gombot takarja. Mindegyik réteg aria-hidden dísz, tehát
   kattintás szempontjából ne is létezzen. (A .tl-lines lentebb már így megy.) */
.blf-showa .vertical-lines,
.blf-showa .bottom-line-wrap,
.blf-showa .banner-symbol{pointer-events:none}

.blf-showa{
  margin:0;
  /* A dekorációs vonalak (vertical-lines, tl-lines, bottom-lines) szándékosan
     kilógnak a képernyőn túlra — az eredetiben a body overflow-x:hidden fogja
     meg őket, itt a burkoló. clip és nem hidden: nem csinál görgethető dobozt. */
  overflow-x:clip;
  font-family:var(--font);
  font-size:16px;
  line-height:1.5;
  color:var(--ink);
  background:#fff;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
.blf-showa img{max-width:100%; height:auto; display:block}
.blf-showa a{color:inherit; text-decoration:none; transition:.5s all var(--ease)}
.blf-showa ul{margin:0; padding:0; list-style:none}
.blf-showa h1,.blf-showa h2,.blf-showa h3,.blf-showa h4,.blf-showa h5,.blf-showa h6{margin:0}
.blf-showa p{margin:0 0 25px; font-size:16px; line-height:24px}
.blf-showa p:last-child{margin-bottom:0}
.blf-showa button{font:inherit; color:inherit; background:transparent; border:0; padding:0; cursor:pointer}
.blf-showa sup{font-size:.6em; vertical-align:super}
.blf-showa :focus-visible{outline:2px solid var(--green); outline-offset:3px}
.blf-showa .sr-only,
.blf-showa .screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------------------------------------------------------
   Rács — a Bootstrap 4 .container / .row / .col-md-* annyija,
   amennyit az oldal használ. A theme nem tölti be a Bootstrapet.
   --------------------------------------------------------- */
.blf-showa .container{width:100%; padding-right:15px; padding-left:15px; margin-right:auto; margin-left:auto}
@media (min-width:576px){ .blf-showa .container{max-width:540px} }
@media (min-width:768px){ .blf-showa .container{max-width:720px} }
@media (min-width:992px){ .blf-showa .container{max-width:960px} }
@media (min-width:1200px){ .blf-showa .container{max-width:1140px} }
@media (max-width:580px){ .blf-showa .container{max-width:100%; padding-left:15px; padding-right:15px} }

.blf-showa .row{display:flex; flex-wrap:wrap; margin-right:-15px; margin-left:-15px}
.blf-showa [class^="col-md-"]{position:relative; width:100%; padding-right:15px; padding-left:15px}
@media (min-width:768px){
  .blf-showa .col-md-1{flex:0 0 8.333333%; max-width:8.333333%}
  .blf-showa .col-md-3{flex:0 0 25%; max-width:25%}
  .blf-showa .col-md-4{flex:0 0 33.333333%; max-width:33.333333%}
  .blf-showa .col-md-6{flex:0 0 50%; max-width:50%}
  .blf-showa .col-md-8{flex:0 0 66.666667%; max-width:66.666667%}
  .blf-showa .col-md-12{flex:0 0 100%; max-width:100%}
}

/* ---------------------------------------------------------
   Gombok
   --------------------------------------------------------- */
.blf-showa .btn{
  display:inline-flex; text-transform:uppercase;
  border-radius:30px; min-width:130px; padding:15px 30px;
  align-items:center; justify-content:center; text-align:center;
  transition:.4s all; font-weight:500; font-size:14px; line-height:14px;
  background:0 0; font-family:var(--font); cursor:pointer; border:0;
}
.blf-showa input.btn{padding:15px 30px}
.blf-showa .btn.btn-black{background-color:#212020; color:#fff}
.blf-showa .btn.btn-black:hover{background-color:#8fc547; color:#212020}
.blf-showa .btn.btn-black.white-hover:hover{background-color:#fff; color:#212020}
.blf-showa .btn.btn-primary{background-color:#8fc547; color:#212020}
.blf-showa .btn.btn-primary:hover{background-color:#fff; color:#8fc547}
.blf-showa .btn.btn-primary.black-hover:hover{background-color:#212020; color:#fff}
.blf-showa .btn.btn-light{background-color:#fff; color:#000}
.blf-showa .btn.btn-light:hover{background-color:#8fc547; color:#fff}
.blf-showa .btn.btn-xlg{padding:20px 30px}
.blf-showa .btn-link{font-weight:700; text-decoration:underline; font-size:16px; line-height:28px; color:#212020}
.blf-showa .btn-link:hover{color:#8fc547; text-decoration:underline}
@media (max-width:1200px){ .blf-showa .btn.btn-lg{font-size:16px} }
@media (max-width:720px){ .blf-showa .btn{min-width:110px; line-height:18px} }
@media (max-width:320px){ .blf-showa .btn{font-size:12px} }

/* ---------------------------------------------------------
   Szekciócímek
   --------------------------------------------------------- */
.blf-showa .title h2{
  display:inline-flex; align-items:center; text-transform:uppercase;
  font-weight:700; font-size:42px; line-height:44px; color:#aaabab; margin-bottom:40px;
}
@media (max-width:1200px){ .blf-showa .title h2{font-size:36px; line-height:44px} }
.blf-showa .title h3{font-size:26px; line-height:32px; font-weight:900; text-transform:uppercase; color:#212020; margin-bottom:40px}
.blf-showa .title.dark h1,.blf-showa .title.dark h2,.blf-showa .title.dark h3,
.blf-showa .title.dark h4,.blf-showa .title.dark h5,.blf-showa .title.dark h6{color:#212020}
.blf-showa .title.white h1,.blf-showa .title.white h2,.blf-showa .title.white h3,
.blf-showa .title.white h4,.blf-showa .title.white h5,.blf-showa .title.white h6{color:#fff}

/* ---------------------------------------------------------
   Kártyás csúszkák — az eredeti a slick.js-t hívja, itt a
   .slick-* osztálynevekre épülő saját, könyvtár nélküli
   megvalósítás fut (lásd main.js). Ami látszik belőle —
   a sáv szélessége, a kártyaköz, a nyilak helye és mérete,
   a diaszám töréspontonként — az eredetié.
   A --per a láthatóan megjelenő kártyák száma (slidesToShow).
   --------------------------------------------------------- */
.blf-showa .slider-container{position:relative}
.blf-showa .card-slider{position:relative}
.blf-showa .card-slider .slick-list{overflow:hidden}
.blf-showa .card-slider .slick-track{display:flex; transition:transform .9s cubic-bezier(.4,0,.2,1)}
.blf-showa .card-slider .card-item{flex:0 0 calc(100% / var(--per)); max-width:calc(100% / var(--per)); min-width:0}
.blf-showa .card-slider[data-locked="1"] .slick-arrow{display:none}

.blf-showa .slick-arrow{
  width:70px; height:50px; min-height:50px; background:#aaabab; padding:0;
  position:absolute; top:0; z-index:9;
  display:flex; align-items:center; justify-content:space-around;
  transition:all .4s var(--ease);
}
.blf-showa .slick-arrow:hover{background-color:#8fc547}
.blf-showa .slick-arrow.arrow-left{left:-70px}
.blf-showa .slick-arrow.arrow-right{right:-70px}
.blf-showa .slick-arrow .icon{color:#fff; font-size:21px; display:flex; width:100%; justify-content:center}
.blf-showa .slick-arrow .icon svg{width:21px; height:21px; fill:none; stroke:currentColor; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round}
.blf-showa .slick-arrow[disabled]{opacity:.35; pointer-events:none}
@media (max-width:1200px){
  .blf-showa .slick-arrow{width:40px; height:auto; min-height:auto; bottom:0; top:auto; right:0; background-color:#fff}
  .blf-showa .slick-arrow .icon{color:#212020}
  .blf-showa .slick-arrow.arrow-left{right:70px; left:auto}
  .blf-showa .slick-arrow.arrow-right{right:10px}
}
@media (max-width:990px){ .blf-showa .slick-arrow:hover{background-color:transparent} }
@media (max-width:720px){ .blf-showa .slick-arrow{bottom:13px} }

/* =========================================================
   BANNER (hero)
   ========================================================= */
.blf-showa .banner{height:372px; position:relative}
.blf-showa .banner .banner-symbol{position:absolute; top:70px; left:0; z-index:1}
@media (max-width:1365px){ .blf-showa .banner .banner-symbol{display:none} }

.blf-showa .banner .banner-inner-wrap{position:relative; height:372px; overflow:hidden}
.blf-showa .banner .banner-inner-item{position:absolute; inset:0; opacity:0; visibility:hidden; transition:opacity .9s var(--ease), visibility .9s}
.blf-showa .banner .banner-inner-item.is-active{opacity:1; visibility:visible}
.blf-showa .banner .banner-inner-item .caption-wrapper{position:absolute; width:100%; z-index:99}
.blf-showa .banner .banner-inner-item .caption-wrapper .container{position:relative; min-height:372px}
.blf-showa .banner .banner-inner-item .caption-wrapper .container .caption{position:absolute; bottom:60px}
.blf-showa .banner .banner-inner-item .caption-wrapper .container .caption h1,
.blf-showa .banner .banner-inner-item .caption-wrapper .container .caption .banner-title{
  font-weight:900; font-size:42px; line-height:44px; color:#fff; text-transform:uppercase; margin-bottom:23px;
}
.blf-showa .banner .banner-inner-item .caption-wrapper .container .caption p{
  font-weight:400; font-size:20px; line-height:28px; color:#fff; max-width:615px;
}
.blf-showa .banner .banner-inner-item .caption-wrapper .container .caption .cta-wrap{margin-top:55px}
.blf-showa .banner .banner-inner-item .banner-bg{width:100%; position:relative; height:372px}
.blf-showa .banner .banner-inner-item .banner-bg:before{
  content:""; width:200%; height:100%; position:absolute; z-index:1;
  background:linear-gradient(rgba(5,5,5,.6) 0, rgba(10,10,10,.25) 100%);
}
.blf-showa .banner .banner-inner-item .banner-bg img{width:100%; object-fit:cover; height:372px; min-width:100px}
@media (max-width:1200px){
  .blf-showa .banner .banner-inner-item .caption-wrapper .container .caption h1, .blf-showa .banner .banner-inner-item .caption-wrapper .container .caption .banner-title{font-weight:900; font-size:32px; line-height:32px}
}
@media (max-width:720px){
  .blf-showa .banner .banner-inner-item .caption-wrapper .container .caption{bottom:40px; width:100%; left:0; padding:0 20px}
  .blf-showa .banner .banner-inner-item .caption-wrapper .container .caption h1, .blf-showa .banner .banner-inner-item .caption-wrapper .container .caption .banner-title{max-width:275px; line-height:32px}
  .blf-showa .banner .banner-inner-item .caption-wrapper .container .caption h1 br, .blf-showa .banner .banner-inner-item .caption-wrapper .container .caption .banner-title br{display:none}
  .blf-showa .banner .banner-inner-item .caption-wrapper .container .caption .cta-wrap{display:flex; justify-content:flex-end}
}

/* A szerkeszthető banner kiegészítései (inc/banner-slides.php) — az eredetin
   nincsenek: több gomb egy dián, termékfotó a jobb oldalon, és a kép nélküli
   dia sötét lapja (különben a fehér felirat fehér alapon állna). */
.blf-showa .banner .banner-inner-item .caption-wrapper .container .caption .cta-wrap{display:flex; flex-wrap:wrap; gap:12px}
.blf-showa .banner .banner-inner-item .banner-bg--empty{background:#212020}

.blf-showa .banner .banner-inner-item .caption-wrapper .container .banner-product{
  position:absolute; top:24px; bottom:0; right:15px; width:40%;
  display:flex; align-items:flex-end; justify-content:flex-end; pointer-events:none;
}
.blf-showa .banner .banner-inner-item .caption-wrapper .container .banner-product img{
  width:auto; height:auto; max-width:100%; max-height:100%; object-fit:contain;
}
.blf-showa .banner .banner-inner-item.has-product .caption-wrapper .container .caption{max-width:58%}
@media (max-width:720px){
  /* Mobilon a felirat a teljes szélességet kéri; a fotó a háttérben úgyis ott van. */
  .blf-showa .banner .banner-inner-item .caption-wrapper .container .banner-product{display:none}
  .blf-showa .banner .banner-inner-item.has-product .caption-wrapper .container .caption{max-width:none}
}

/* A banner a SHOWA sablonokon kívül: a renderelő saját .blf-showa burkolót tesz
   köré. A bolt SHOWA oldalain (--showa) marad az eredeti arculat; a többin
   (--bestlab) a theme betűje és színei — narancs gomb, navy üres dia. */
.blf-showa.blf-banner-host--bestlab{--font:var(--bl-font,system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif)}
.blf-showa.blf-banner-host--bestlab .banner .btn.btn-primary{background-color:var(--bl-orange,#E8550D); color:#fff}
.blf-showa.blf-banner-host--bestlab .banner .btn.btn-primary:hover{background-color:#fff; color:var(--bl-navy,#0B2C5A)}
.blf-showa.blf-banner-host--bestlab .banner .btn.btn-light:hover{background-color:var(--bl-navy,#0B2C5A); color:#fff}
.blf-showa.blf-banner-host--bestlab .banner .banner-inner-item .banner-bg--empty{background:var(--bl-navy,#0B2C5A)}

/* A látogató léptetője (blf_banner_nav_html(), main.js heroSlider()): előző /
   következő, pöttyök, megállítás — egy sávban alul középen, mert ott nem takar
   feliratot (az 60 px-re ül az aljától, mobilon 40-re) és termékfotót sem.
   Csak JS-sel látszik (.has-nav); a 100-as z-index a feliratok (99) fölé emeli. */
.blf-showa .banner .banner-nav{
  display:none; position:absolute; left:50%; bottom:12px; z-index:100; transform:translateX(-50%);
  align-items:center; gap:2px; padding:2px 6px; border-radius:999px; background:rgba(0,0,0,.38);
}
.blf-showa .banner.has-nav .banner-nav{display:flex}
.blf-showa .banner .banner-nav button{
  display:inline-flex; align-items:center; justify-content:center; flex:none;
  margin:0; padding:0; border:0; background:none; color:#fff; cursor:pointer;
}
.blf-showa .banner .banner-arrow,
.blf-showa .banner .banner-pause{width:32px; height:32px; border-radius:50%; transition:background-color .2s var(--ease), color .2s var(--ease)}
.blf-showa .banner .banner-arrow:hover,
.blf-showa .banner .banner-pause:hover{background:var(--green); color:#212020}
.blf-showa .banner .banner-arrow svg,
.blf-showa .banner .banner-pause svg{width:16px; height:16px}
.blf-showa .banner .banner-pause{margin-left:4px}
.blf-showa .banner .banner-pause .i-play,
.blf-showa .banner .banner-pause.is-paused .i-pause{display:none}
.blf-showa .banner .banner-pause.is-paused .i-play{display:block}
.blf-showa .banner .banner-dots{display:flex; align-items:center}
.blf-showa .banner .banner-dot{width:22px; height:32px}
.blf-showa .banner .banner-dot::before{
  content:""; width:10px; height:10px; border-radius:50%;
  background:rgba(255,255,255,.55); box-shadow:0 0 0 1px rgba(0,0,0,.15);
  transition:background-color .2s var(--ease), transform .2s var(--ease);
}
.blf-showa .banner .banner-dot:hover::before{background:#fff}
.blf-showa .banner .banner-dot.is-active::before{background:var(--green); transform:scale(1.3)}
/* Húzás (main.js heroSlider()): a dia a mutatóval megy, a szomszédja (.is-peek)
   beúszik mellé; elengedve .is-settling alatt csúszik a helyére, maga a csere
   (.is-instant) áttűnés nélkül. pan-y: függőleges ujjmozdulatra a lap görög. */
.blf-showa .banner .banner-inner-wrap.is-draggable{cursor:grab; -webkit-user-select:none; user-select:none; touch-action:pan-y}
.blf-showa .banner .banner-inner-wrap.is-draggable img,
.blf-showa .banner .banner-inner-wrap.is-draggable a{-webkit-user-drag:none}
.blf-showa .banner .banner-inner-wrap.is-dragging{cursor:grabbing}
.blf-showa .banner .banner-inner-wrap.is-dragging .banner-inner-item,
.blf-showa .banner .banner-inner-wrap.is-instant .banner-inner-item{transition:none}
.blf-showa .banner .banner-inner-wrap.is-settling .banner-inner-item{transition:transform .35s cubic-bezier(.2,.7,.3,1)}
.blf-showa .banner .banner-inner-item.is-peek{opacity:1; visibility:visible}
@media (max-width:720px){
  /* Mobilon söprés és pötty; a nyíl a felirat alá szorulna. */
  .blf-showa .banner .banner-nav{bottom:6px}
  .blf-showa .banner .banner-arrow{display:none}
  .blf-showa .banner .banner-dot,
  .blf-showa .banner .banner-pause{height:28px}
}
@media (prefers-reduced-motion:reduce){
  .blf-showa .banner .banner-dot::before{transition:none}
}
.blf-showa.blf-banner-host--bestlab .banner .banner-arrow:hover,
.blf-showa.blf-banner-host--bestlab .banner .banner-pause:hover{background:var(--bl-orange,#E8550D); color:#fff}
.blf-showa.blf-banner-host--bestlab .banner .banner-dot.is-active::before{background:var(--bl-orange,#E8550D)}

/* =========================================================
   EXPLORE OUR RANGE
   ========================================================= */
.blf-showa .explore-our-range{
  background-image:url("../img/bg-image.png");
  background-color:#8fc547;
  padding:40px 0;
}
.blf-showa .explore-our-range .row{align-items:center; margin:0}
.blf-showa .explore-our-range .row .col-md-4{max-width:380px; padding:0}
.blf-showa .explore-our-range .row .col-md-4 .protective-gloves{position:relative}
.blf-showa .explore-our-range .row .col-md-4 .protective-gloves:before{
  position:absolute; content:""; top:-30px; left:-30px;
  background-color:rgba(255,255,255,.1);
  width:calc(100% + 60px); height:calc(100% + 60px); border-radius:52%;
  box-shadow:20px 20px 60px rgba(255,255,255,.1), -20px -20px 60px rgba(255,255,255,.1);
}
.blf-showa .explore-our-range .row .col-md-4 .protective-gloves .img-wrap{position:relative}
.blf-showa .explore-our-range .row .col-md-4 .protective-gloves .img-wrap img{max-width:100%}
.blf-showa .explore-our-range .row .col-md-8{max-width:756px; padding:0 0 0 90px}
.blf-showa .explore-our-range .row .col-md-8 .protective-gloves-details h3{
  font-weight:900; font-size:26px; line-height:32px; color:#212020; margin-bottom:15px; text-transform:uppercase;
}
.blf-showa .explore-our-range .row .col-md-8 .protective-gloves-details p{
  font-weight:400; font-size:16px; line-height:24px; text-align:left; color:rgba(33,32,32,.7);
}
@media (max-width:1200px){
  .blf-showa .explore-our-range .row .col-md-4{max-width:300px}
  .blf-showa .explore-our-range .row .col-md-8{padding:0 0 0 45px; max-width:550px}
}
@media (max-width:990px){
  .blf-showa .explore-our-range{padding:50px 0}
  .blf-showa .explore-our-range .row{flex-flow:column-reverse}
  .blf-showa .explore-our-range .row .col-md-4{margin-top:50px}
  .blf-showa .explore-our-range .row .col-md-4,
  .blf-showa .explore-our-range .row .col-md-8{flex:0 0 100%; max-width:100%}
  .blf-showa .explore-our-range .row .col-md-8{padding:0}
}

/* =========================================================
   QUICK LINKS (kategóriasáv)
   ========================================================= */
.blf-showa .quick-links{position:relative; overflow:visible}
.blf-showa .quick-links .bg-fill-dark{padding:15px 0; background-color:#212020}
.blf-showa .quick-links .content .row{margin:0; align-items:center}
.blf-showa .quick-links .content .row .col-md-3{flex:0 0 200px; max-width:200px; padding:0}
.blf-showa .quick-links .content .row .col-md-8{flex:0 0 815px; max-width:815px; padding:0}
.blf-showa .quick-links .content .row .col-md-1{flex:0 0 95px; max-width:95px; padding:0}
.blf-showa .quick-links .content .row .col-md-1 .cta-wrap .btn-toggle{display:flex; justify-content:space-between; align-items:center}
.blf-showa .quick-links .content .row .col-md-1 .cta-wrap .btn-toggle span.less{display:none}
.blf-showa .quick-links .content .links-title{display:flex; margin-top:0}
.blf-showa .quick-links .content .links-title h4{font-weight:700; font-size:17px; line-height:29.6px; color:#8fc547}
.blf-showa .quick-links .content .links-title .cta-wrap{display:flex; align-items:center}
.blf-showa .quick-links .content .links-title .cta-wrap .btn-toggle{display:none}
.blf-showa .quick-links .content .navbar{width:100%}
.blf-showa .quick-links .content .navbar ul.menu{display:flex; align-items:center; flex-wrap:wrap}
.blf-showa .quick-links .content .navbar ul.menu li{margin-left:5px}
.blf-showa .quick-links .content .navbar ul.menu li + li{margin-left:15px}
.blf-showa .quick-links .content .navbar ul.menu li a{
  font-weight:500; font-size:16px; line-height:28px; color:#fff; text-transform:uppercase; transition:all .4s var(--ease);
}
.blf-showa .quick-links .content .navbar ul.menu li a:hover{color:#8fc547}
/* Aminek nincs archívuma a katalógusban, az link nélküli szövegként megy ki —
   ugyanúgy, ahogy a finder-bar kezeli a nem feloldható tételeket. */
.blf-showa .quick-links .content .navbar ul.menu li span{
  font-weight:500; font-size:16px; line-height:28px; color:rgba(255,255,255,.55); text-transform:uppercase;
}
.blf-showa .quick-links .content .btn-toggle{
  padding:0 0 0 10px; font-weight:500; font-size:16px; line-height:28px; color:#aaabab; border-left:1px solid #fff;
}
.blf-showa .quick-links .content .btn-toggle .icon{margin-left:12px; transition:all .4s var(--ease); font-size:22px; display:inline-flex}
.blf-showa .quick-links .content .btn-toggle .icon svg{width:14px; height:14px; fill:none; stroke:currentColor; stroke-width:2.6; stroke-linecap:round; stroke-linejoin:round}
.blf-showa .quick-links .quick-links-dropdown{display:none; width:100%; z-index:1}
.blf-showa .quick-links .quick-links-dropdown .bg-fill-dark{padding:0 0 5px; margin-top:-4px}
.blf-showa .quick-links .quick-links-dropdown .bg-fill-dark .content .row .col-md-8 .navbar ul.menu{max-width:100%; display:flex; flex-wrap:wrap}
.blf-showa .quick-links .quick-links-dropdown .bg-fill-dark .content .row .col-md-8 .navbar ul.menu li{margin-right:28px; margin-left:0; margin-bottom:10px}
.blf-showa .quick-links.show .quick-links-dropdown{display:block}
.blf-showa .quick-links.show .content .links-title .btn-toggle .icon,
.blf-showa .quick-links.show .content .col-md-1 .cta-wrap .btn-toggle .icon{transform:rotate(180deg)}
.blf-showa .quick-links.show .content .col-md-1 .cta-wrap .btn-toggle span.more{display:none}
.blf-showa .quick-links.show .content .col-md-1 .cta-wrap .btn-toggle span.less{display:flex}
@media (max-width:1200px){
  .blf-showa .quick-links .content .row .col-md-3{flex:0 0 300px; max-width:300px}
  .blf-showa .quick-links .content .row .col-md-1{display:none}
  .blf-showa .quick-links .content .links-title .cta-wrap .btn-toggle{display:flex; border-left:none}
  .blf-showa .quick-links .content .navbar ul.menu li{margin-right:28px; margin-top:15px; margin-left:0}
  .blf-showa .quick-links .content .navbar ul.menu li + li{margin-left:0}
  .blf-showa .quick-links .quick-links-dropdown .bg-fill-dark{padding:0 0 15px}
  .blf-showa .quick-links .quick-links-dropdown .bg-fill-dark .content .row .col-md-8 .navbar ul.menu li{margin-top:0}
}
@media (max-width:990px){
  .blf-showa .quick-links .bg-fill-dark{padding:50px 0}
  .blf-showa .quick-links .content .row .col-md-3{flex:1 0 251px; max-width:239px; padding:0}
  .blf-showa .quick-links .content .row .col-md-8{flex:0 0 100%; max-width:100%}
  .blf-showa .quick-links .content .btn-toggle{display:none}
  .blf-showa .quick-links .content .links-title .cta-wrap .btn-toggle{display:flex}
  .blf-showa .quick-links .quick-links-dropdown{position:relative; top:-30px}
  .blf-showa .quick-links .quick-links-dropdown .bg-fill-dark{padding:0 0 50px}
}
@media (max-width:720px){
  .blf-showa .quick-links .content .row .col-md-3{flex:0 0 300px; max-width:100%; padding:0}
  .blf-showa .quick-links .content .links-title h4{font-size:22px}
  .blf-showa .quick-links .content .navbar ul.menu{flex-flow:column; align-items:flex-start}
}

/* =========================================================
   ALL NEWS
   ========================================================= */
.blf-showa .all-news{padding:90px 0}
.blf-showa .all-news.bottom-line-shape,
.blf-showa .all-news .container{position:relative}
.blf-showa .all-news .title h2{text-transform:capitalize}
.blf-showa .all-news .content{position:relative; z-index:9}

.blf-showa .all-news .vertical-lines{width:80%; position:absolute; right:-380px; top:40px}
.blf-showa .all-news .vertical-lines span{width:100%; height:11px; background-image:linear-gradient(to right, rgba(255,0,0,0), #b4b4b4); display:block}
.blf-showa .all-news .vertical-lines span + span{margin-top:11px}

.blf-showa .all-news .container .bottom-line-wrap{position:absolute; left:-100vw}
.blf-showa .all-news .container .bottom-line-wrap .horizontal-line{width:60%; position:absolute}
.blf-showa .all-news .container .bottom-line-wrap .horizontal-line span{width:100%; background-color:rgba(52,51,51,.1); display:block; height:11px}
.blf-showa .all-news .container .bottom-line-wrap .horizontal-line span + span{margin-top:11px}
.blf-showa .all-news .container .bottom-line-wrap .horizontal-line:after{
  position:absolute; content:"";
  background-image:url("../img/bottom-lines.svg");
  background-repeat:no-repeat; background-position:left; background-size:contain;
  bottom:0; width:100%; height:570px; left:100%;
}
.blf-showa .all-news .container .bottom-line-wrap .horizontal-line.bottom-line{width:100vw; left:calc(-100% - 100px); top:auto; bottom:-50px}

.blf-showa .all-news .content .slider-container{max-width:calc(100% - 170px); margin-left:auto; margin-right:auto}
.blf-showa .all-news .content .card-slider{margin:0 -15px; --per:5}
.blf-showa .all-news .content .card-slider .card-item{padding:0 15px}
.blf-showa .all-news .content .cta-wrap{text-align:center; margin-top:80px}

@media (max-width:1660px){ .blf-showa .all-news .content .card-slider{--per:4} }
@media (max-width:1440px){
  .blf-showa .all-news .vertical-lines{right:-300px}
  .blf-showa .all-news .content .card-slider{--per:3}
}
@media (max-width:1200px){
  .blf-showa .all-news{padding:50px 0}
  .blf-showa .all-news .vertical-lines{display:none}
  .blf-showa .all-news .container .bottom-line-wrap .horizontal-line,
  .blf-showa .all-news .container .bottom-line-wrap .horizontal-line:after{display:none}
  .blf-showa .all-news .content .slider-container{max-width:960px; padding-left:15px; padding-right:15px}
  .blf-showa .all-news .content .card-slider{margin:0 -10px; padding-bottom:50px}
  .blf-showa .all-news .content .card-slider .card-item{padding:0 10px}
  .blf-showa .all-news .content .card-slider .slick-arrow{height:auto; bottom:0; top:auto; right:0; background-color:#fff}
  .blf-showa .all-news .content .card-slider .slick-arrow.arrow-left{right:70px; left:auto}
  .blf-showa .all-news .content .card-slider .slick-arrow.arrow-right{right:10px}
  .blf-showa .all-news .content .cta-wrap{margin-top:0}
}
@media (max-width:990px){
  .blf-showa .all-news .content .slider-container{max-width:720px}
  .blf-showa .all-news .content .card-slider{--per:2}
}
@media (max-width:720px){
  .blf-showa .all-news .content .card-slider{--per:1; margin-left:-30px; margin-right:-30px}
  .blf-showa .all-news .content .card-slider .slick-arrow{bottom:13px; margin-right:15px}
  .blf-showa .all-news .content .cta-wrap{margin-top:0; padding-top:40px; border-top:2px solid #707070; margin-left:15px; margin-right:15px}
}

/* hír-kártya */
.blf-showa .card{display:block}
.blf-showa .card .card-image{width:100%; overflow:hidden}
.blf-showa .card .card-image img{width:100%; transition:all .4s var(--ease)}
.blf-showa .card:hover .card-image img{transform:scale(1.05)}
.blf-showa .card .programmes{
  display:flex; flex-wrap:wrap; align-items:center;
  font-weight:500; font-size:11px; line-height:24px; color:#545555;
  transition:all .4s var(--ease); margin-top:10px;
}
.blf-showa .card .programmes .center-line{width:90px; margin:0 30px; border-bottom:1px solid #545555}
.blf-showa .card .card-content h3{
  margin-top:30px; font-weight:700; font-size:22px; line-height:24px; color:#8fc547;
  transition:all .4s var(--ease); text-transform:uppercase;
}
.blf-showa .card .card-content h3 br{display:none}
.blf-showa .card:hover .card-content h3{color:#212020}
@media (max-width:1200px){ .blf-showa .card .programmes .center-line{margin:0 10px; width:10%} }
@media (max-width:720px){
  .blf-showa .card .programmes{font-size:14px; line-height:30px}
  .blf-showa .card .programmes .center-line{width:25%; margin:0 15px}
  .blf-showa .card .card-content{padding-left:15px; padding-right:15px}
  .blf-showa .card .card-content h3{font-size:26px; line-height:28px}
  .blf-showa .card .card-content h3 br{display:block}
}

/* =========================================================
   ABOUT (videó + szöveg)
   ========================================================= */
.blf-showa .about{position:relative; z-index:9; padding:60px 0}
.blf-showa .bg-fill{background-image:url("../img/bg-image.png")}

.blf-showa .oval-shape-content .row{margin:0 -33px; align-items:center; justify-content:flex-end}
.blf-showa .oval-shape-content .row .col-md-6{padding-left:33px; padding-right:33px; height:100%}
.blf-showa .oval-shape-content .row .col-md-6:nth-child(1){position:absolute; display:flex; align-items:center; left:0; padding-left:0}
.blf-showa .oval-shape-content .row .col-md-6:nth-child(even){display:flex; align-items:center; height:auto; min-height:475px}
.blf-showa .oval-shape-content .row .col-md-6 .oval-bg{
  width:100%; border-radius:0 240px 240px 0; height:475px;
  background-position:center; background-repeat:no-repeat; background-size:cover;
}
.blf-showa .oval-shape-content .row .col-md-6 .content-wrap{max-width:100%; width:100%}
.blf-showa .oval-shape-content .row .col-md-6 .content-wrap .title{max-width:100%}
.blf-showa .oval-shape-content .row .col-md-6 .content-wrap .title h2{font-weight:900; font-size:42px; line-height:44px; text-transform:uppercase}
.blf-showa .oval-shape-content .row .col-md-6 .content-wrap .body-copy p{font-weight:400; font-size:20px; line-height:28px; color:#212020; opacity:1}
.blf-showa .oval-shape-content .row .col-md-6 .content-wrap .cta-wrap{margin-top:55px}
@media (max-width:1200px){
  .blf-showa .oval-shape-content .row .col-md-6{display:flex; align-items:center}
  .blf-showa .oval-shape-content .row .col-md-6 .content-wrap .title h2{font-size:32px; line-height:34px}
  .blf-showa .oval-shape-content .row .col-md-6 .content-wrap .cta-wrap{margin-top:0}
}
@media (max-width:990px){
  .blf-showa .about{padding:50px 0; min-height:auto}
  .blf-showa .oval-shape-content .row{height:auto; flex-flow:column}
  .blf-showa .oval-shape-content .row .col-md-6{flex:0 0 100%; max-width:100%}
  .blf-showa .oval-shape-content .row .col-md-6:nth-child(1){position:relative; left:-10px; margin-bottom:40px}
  .blf-showa .oval-shape-content .row .col-md-6:nth-child(even){flex:0 0 100%; max-width:100%; min-height:auto}
}
@media (max-width:720px){
  .blf-showa .oval-shape-content .row .col-md-6:nth-child(1){left:auto}
  .blf-showa .oval-shape-content .row .col-md-6 .oval-bg{height:247px}
  .blf-showa .oval-shape-content .row .col-md-6 .content-wrap .cta-wrap{margin-top:40px; display:flex; justify-content:center}
}

/* lejátszógomb — az eredeti oldalon a fejlécbe szúrt <style> adja */
.blf-showa .oval-bg{position:relative; cursor:pointer}
.blf-showa .oval-bg .play-btn{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  width:68px; height:68px; background-color:rgba(0,0,0,.75); border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  transition:all .3s ease; z-index:5; box-shadow:0 4px 15px rgba(0,0,0,.3);
}
.blf-showa .oval-bg .play-btn::after{
  content:""; display:block; width:0; height:0; border-style:solid;
  border-width:10px 0 10px 18px; border-color:transparent transparent transparent #fff;
  margin-left:4px;
}
.blf-showa .oval-bg:hover .play-btn{background-color:#000; transform:translate(-50%,-50%) scale(1.1)}
.blf-showa .oval-bg iframe{width:100%; height:100%; border:0; border-radius:0 240px 240px 0}

/* =========================================================
   PRODUCT HIGHLIGHTS

   ELTÉRÉS AZ EREDETITŐL: a sáv kártyái nem a SHOWA szürke dobozai,
   hanem a bestlab saját terméklapkájának (main.css .blf-card--product)
   látványát viselik — fehér lap, 1px keret, 10px sugár, felül négyzetes
   képmező halvány háttéren, navy cím, halvány jellemzők, alul ár és
   narancs „Termék megtekintése”. Így a SHOWA-oldal terméksávja ugyanazt
   a nyelvet beszéli, mint a főoldali terméksor. A markup és a csúszka
   mechanikája marad (a main.js a .slick-* osztályokra épül), csak a
   megjelenés vált.

   A főoldal tokenjeit (--bl-navy, --bl-line, --bl-radius, --bl-font…)
   használjuk: a styles.css a bestlab-fast stíluslaptól függ, így azok
   itt is élnek. Ahol a .blf-showa saját resetje (Montserrat, öröklött
   linkszín, nagybetűs címsorok) felülütné a lapka szabályait, ott a
   szabály itt külön ki van mondva.
   ========================================================= */
.blf-showa .product-highlights{padding:56px 0; font-family:var(--bl-font)}

/* Szekciófej — a főoldali .blf-section__head mása. */
.blf-showa .product-highlights .content .title{
  display:flex; align-items:baseline; justify-content:space-between;
  gap:20px; flex-wrap:wrap; margin-bottom:28px;
}
.blf-showa .product-highlights .content .title h2{
  font-family:var(--bl-font); text-transform:none; letter-spacing:0;
  font-size:clamp(1.5rem,3vw,2rem); line-height:1.15; font-weight:800;
  color:var(--bl-navy); margin:0;
}
.blf-showa .product-highlights .content .title .btn-link{
  font-family:var(--bl-font); font-weight:600; font-size:.92rem; line-height:1.4;
  color:var(--bl-blue); text-decoration:none; white-space:nowrap;
}
.blf-showa .product-highlights .content .title .btn-link:after{content:" \2192"}
.blf-showa .product-highlights .content .title .btn-link:hover{color:var(--bl-blue-d); text-decoration:underline}

/* A sáv a szekció konténerével egy vonalban áll — a főoldali rács így ül. */
.blf-showa .product-highlights .content .slider-container{
  width:100%; max-width:1140px; margin-left:auto; margin-right:auto;
  padding-left:15px; padding-right:15px;
}
.blf-showa .product-highlights .content .card-slider{margin:0 -10px; --per:5}
.blf-showa .product-highlights .content .card-slider .card-item{padding:0 10px; display:flex}
/* A lapka a diaréssel egy magas: a card-item flexbox, a lapka kitölti. */
.blf-showa .product-highlights .content .card-slider .card-item > .product-card{flex:1 1 auto; min-width:0}

/* Nyilak: fehér korong világos kerettel — a lapkák keretével egy nyelven. */
.blf-showa .product-highlights .slick-arrow{
  width:44px; height:44px; min-height:0; padding:0;
  top:38%; bottom:auto; transform:translateY(-50%);
  border-radius:50%; background-color:#fff; border:1px solid var(--bl-line);
  box-shadow:var(--bl-shadow); transition:background-color .15s,border-color .15s;
}
.blf-showa .product-highlights .slick-arrow .icon{color:var(--bl-navy)}
.blf-showa .product-highlights .slick-arrow .icon svg{width:18px; height:18px}
.blf-showa .product-highlights .slick-arrow:hover{background-color:var(--bl-blue); border-color:var(--bl-blue)}
.blf-showa .product-highlights .slick-arrow:hover .icon{color:#fff}
.blf-showa .product-highlights .slick-arrow.arrow-left{left:-22px; right:auto}
.blf-showa .product-highlights .slick-arrow.arrow-right{right:-22px; left:auto}

/* CTA — a főoldal .blf-btn párosa: tömör kék + szellős másodlagos. */
.blf-showa .product-highlights .content .cta-group{
  display:flex; justify-content:center; flex-wrap:wrap; gap:12px; margin-top:48px;
  padding-left:15px; padding-right:15px;
}
.blf-showa .product-highlights .content .cta-group .btn.btn-black{
  font-family:var(--bl-font); text-transform:none; border-radius:8px;
  min-width:0; padding:.8em 1.5em; font-weight:600; font-size:.95rem; line-height:1.4;
  background-color:var(--bl-blue); color:#fff; border:1px solid var(--bl-blue);
}
.blf-showa .product-highlights .content .cta-group .btn.btn-black:hover{
  background-color:var(--bl-blue-d); border-color:var(--bl-blue-d); color:#fff;
}
.blf-showa .product-highlights .content .cta-group .btn.btn-black + .btn.btn-black{
  margin-left:0; margin-top:0; background-color:transparent;
  color:var(--bl-navy); border-color:var(--bl-line);
}
.blf-showa .product-highlights .content .cta-group .btn.btn-black + .btn.btn-black:hover{
  background-color:transparent; color:var(--bl-navy); border-color:var(--bl-navy);
}
/* „Összes SHOWA termék” — a pár elé, SHOWA-zölden; sötét felirat, fehéren a zöld nem olvasható. */
.blf-showa .product-highlights .content .cta-group .btn.btn-showa-all{
  font-family:var(--bl-font); text-transform:none; border-radius:8px;
  min-width:0; padding:.8em 1.5em; font-weight:600; font-size:.95rem; line-height:1.4;
  background-color:#8FC547; color:#212020; border:1px solid #8FC547;
}
.blf-showa .product-highlights .content .cta-group .btn.btn-showa-all:hover{
  background-color:#7DB236; border-color:#7DB236; color:#212020;
}

@media (max-width:1260px){
  .blf-showa .product-highlights .slick-arrow.arrow-left{left:-8px}
  .blf-showa .product-highlights .slick-arrow.arrow-right{right:-8px}
}
@media (max-width:1200px){
  .blf-showa .product-highlights{padding:40px 0}
  .blf-showa .product-highlights .content .slider-container{max-width:960px}
  .blf-showa .product-highlights .content .card-slider{--per:3}
  /* Oldalt nincs hely: a nyilak a sáv alá, jobbra ülnek. */
  .blf-showa .product-highlights .slick-arrow{top:auto; bottom:-58px; transform:none}
  .blf-showa .product-highlights .slick-arrow.arrow-left{left:auto; right:56px}
  .blf-showa .product-highlights .slick-arrow.arrow-right{right:0; left:auto}
  .blf-showa .product-highlights .content .cta-group{margin-top:92px}
}
@media (max-width:990px){
  .blf-showa .product-highlights .content .slider-container{max-width:720px}
  .blf-showa .product-highlights .content .card-slider{--per:2}
}
/* A sáv és a szekciófej egy vonalban: a .container lépcsői (1140/960/720/540,
   580 alatt 100%) itt is végig érvényesek. */
@media (min-width:581px) and (max-width:767px){
  .blf-showa .product-highlights .content .slider-container{max-width:540px}
}
@media (max-width:580px){
  .blf-showa .product-highlights .content .slider-container{max-width:100%}
}
@media (max-width:720px){
  .blf-showa .product-highlights .content .title{flex-flow:column; align-items:flex-start; justify-content:flex-start}
  .blf-showa .product-highlights .content .title h2{margin-bottom:10px}
  .blf-showa .product-highlights .content .card-slider{--per:1}
  .blf-showa .product-highlights .content .cta-group{flex-direction:column; align-items:stretch; margin-top:88px}
}

/* ---------------------------------------------------------
   Termékkártya — a főoldali .blf-card--product látványa.
   A markup a SHOWA-é marad (a > .card-content, majd .card-footer),
   ezért a .card-footer display:contents-szel feloldódik: az ár és a
   kép így a kártya közvetlen flex-gyerekei lesznek, és order-rel a
   kép a lap tetejére kerül — pontosan úgy, ahogy a főoldali lapkán.
   --------------------------------------------------------- */
.blf-showa .product-card{
  font-family:var(--bl-font);
  display:flex; flex-flow:column; height:100%; min-height:0;
  padding:0; background:#fff;
  border:1px solid var(--bl-line); border-radius:var(--bl-radius);
  overflow:hidden; position:relative;
  transition:box-shadow .18s,transform .18s,border-color .18s;
}
.blf-showa .product-card:hover{box-shadow:var(--bl-shadow-lg); transform:translateY(-3px)}
.blf-showa .product-card > a{display:block; order:2; padding:14px 16px 0}
.blf-showa .product-card .card-footer{display:contents}

/* Képmező — négyzetes, halvány háttéren, mint a .blf-card__media. */
.blf-showa .product-card .card-footer .product-img{
  order:1; flex:0 0 auto; position:relative; display:block; width:100%; height:auto;
  aspect-ratio:1/1; background:var(--bl-soft); overflow:hidden;
}
.blf-showa .product-card .card-footer .product-img .img-wrap{width:100%; height:100%}
.blf-showa .product-card .card-footer .product-img .img-wrap a{display:block; width:100%; height:100%}
.blf-showa .product-card .card-footer .product-img .img-wrap img{
  width:100%; height:100%; max-width:100%; object-fit:contain; mix-blend-mode:multiply;
}
/* Szöveges rész */
.blf-showa .product-card .card-content{max-width:none}
.blf-showa .product-card .card-content h3{
  font-family:var(--bl-font); font-size:1rem; line-height:1.3; font-weight:700;
  color:var(--bl-navy); text-transform:none; margin:0 0 8px; min-height:2.6em;
}
.blf-showa .product-card .card-content h3 strong{display:inline; font-weight:800}
.blf-showa .product-card:hover .card-content h3{color:var(--bl-blue)}
.blf-showa .product-card .card-content h4{
  font-family:var(--bl-font); font-weight:700; font-size:.72rem; line-height:1.2;
  letter-spacing:.06em; color:var(--bl-muted); text-transform:uppercase; margin:0 0 6px;
}
.blf-showa .product-card .card-content ul.features{
  font-size:.82rem; line-height:1.45; color:var(--bl-muted); max-height:none; overflow:hidden;
}
/* Három tétel, tételenként legfeljebb két sor — így a lapkák egy magasak. */
.blf-showa .product-card .card-content ul.features li{
  position:relative; padding-left:14px;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.blf-showa .product-card .card-content ul.features li + li{margin-top:6px}
.blf-showa .product-card .card-content ul.features li:before{
  position:absolute; content:""; background-color:var(--bl-blue);
  width:4px; height:4px; border-radius:50%; top:.55em; left:2px;
}
.blf-showa .product-card .card-content ul.features li:nth-child(1n + 4){display:none}

/* Lábrész: ár + „Termék megtekintése”.

   A .price doboz a főoldali .blf-card__price mása, a benne ülő .text pedig
   a .blf-card__link-é. A tipográfia szándékosan a dobozon ül és nem az
   .amount-on: a Tax_Switcher a „nettó/bruttó” utótagot <br>-rel az összeg
   alá teszi (bl-price-suffix), és a boltban ez a második sor is az ár
   betűjét viseli — így a két lapka ára ugyanúgy néz ki. */
.blf-showa .product-card .card-footer .price{
  order:3; margin-top:auto; padding:12px 16px 16px; max-width:none;
  display:block; text-align:left; position:static;
  font-weight:800; font-size:1.05rem; line-height:1.3; color:var(--bl-navy);
}
.blf-showa .product-card .card-footer .price .amount,
.blf-showa .product-card .card-footer .price .woocommerce-Price-amount{color:var(--bl-navy)}
/* Akciós ár — a bolt .blf-card.is-on-sale kezelése: áthúzott halvány régi ár,
   narancs új ár. (del/ins csak akciónál kerül a kimenetbe.) */
.blf-showa .product-card .card-footer .price del{
  color:var(--bl-muted); font-weight:600; font-size:.92em;
  margin-right:6px; text-decoration:line-through;
}
.blf-showa .product-card .card-footer .price del .amount{color:var(--bl-muted)}
.blf-showa .product-card .card-footer .price ins{text-decoration:none; color:var(--bl-orange); font-weight:800}
.blf-showa .product-card .card-footer .price ins .amount{color:var(--bl-orange)}
.blf-showa .product-card .card-footer .price .text{
  display:block; font-weight:600; font-size:.9rem; line-height:1.4;
  color:var(--bl-orange); text-transform:none; margin-top:10px; transition:color .15s;
}
.blf-showa .product-card .card-footer .price .text:after{content:" \2192"}
.blf-showa .product-card:hover .card-footer .price .text{color:var(--bl-orange-d)}

/* =========================================================
   TESTIMONIAL — az eredetin ez egy üres, csak háttérképes sáv
   (a márkacsúszkája nem ad ki elemet), a tetején sötét átmenettel.
   ========================================================= */
.blf-showa .testimonial{
  background-position:center; background-repeat:no-repeat; background-size:cover;
  padding:90px 0; position:relative;
}
.blf-showa .testimonial:after{
  position:absolute; content:""; width:100%; height:100%; top:0; left:0;
  background:linear-gradient(#212020 0, rgba(106,106,106,0) 100%);
}
.blf-showa .testimonial .content{position:relative; z-index:1}
.blf-showa .testimonial .content .title{margin-bottom:30px}
@media (max-width:1200px){ .blf-showa .testimonial{padding:50px 0 55px} }
@media (max-width:720px){ .blf-showa .testimonial{padding:50px 0 90px} }

/* =========================================================
   STAY CONNECTED
   ========================================================= */
.blf-showa .stay-connected{padding:90px 0; position:relative}
.blf-showa .stay-connected .content .row{justify-content:space-between}
.blf-showa .stay-connected .content .row .col-md-6:nth-child(odd){max-width:505px}
.blf-showa .stay-connected .content .row .col-md-6:nth-child(even){max-width:605px}
.blf-showa .testimonial + .stay-connected .contact-card{margin-top:0}

.blf-showa .tl-lines{position:relative; right:0; margin-left:30vw; margin-top:0; top:100px; pointer-events:none}
.blf-showa .tl-lines span{
  width:200%; display:block; height:470px; position:absolute; margin-top:11px;
  border:11px solid rgba(52,51,51,.1); top:0; border-radius:78px 0 0;
  border-right:none; border-bottom:none;
}
.blf-showa .tl-lines span:nth-child(2){left:23px; top:22px; border-radius:50px 0 0}
.blf-showa .tl-lines span:nth-child(3){left:-22px; top:-20px; border-radius:100px 0 0}
.blf-showa .tl-lines span:nth-child(4){left:-44px; top:-41px; border-radius:126px 0 0}
.blf-showa .tl-lines span:nth-child(5){left:-66px; top:-62px; border-radius:147px 0 0}
.blf-showa .stay-connected .tl-lines span:after{
  content:""; width:100vh; height:11px; background-color:rgba(52,51,51,.1);
  position:absolute; right:100%; bottom:0;
}

.blf-showa .contact-card{max-width:475px; position:relative}
.blf-showa .contact-card .card-image img{max-width:100%}
.blf-showa .contact-card .card-content{background-color:#212020; padding:70px 50px 35px}
.blf-showa .contact-card .card-content h4{
  font-weight:900; font-size:26px; line-height:28px; color:#fff; margin-bottom:45px; text-transform:uppercase;
}
.blf-showa .contact-card .card-content h4 br{display:block}
.blf-showa .contact-card .card-content p{font-weight:400; font-size:18px; line-height:26px; color:rgba(255,255,255,.7); margin-bottom:25px}
.blf-showa .contact-card .card-content .cta-wrap{position:relative; z-index:1}

.blf-showa .contact-card.signup{max-width:570px}
.blf-showa .contact-card.signup .card-content{
  background-color:#8fc547; display:flex; flex-flow:column; justify-content:space-between; padding:70px 50px 90px;
}
.blf-showa .contact-card.signup .card-content h4{color:#212020}
.blf-showa .contact-card.signup .card-content .form-wrap{display:flex; align-items:center; justify-content:space-between; position:relative}
.blf-showa .contact-card.signup .card-content .form-wrap .input-group{width:100%}
.blf-showa .contact-card.signup .card-content .form-wrap .input-group .form-control{
  border:none; background-color:transparent; border-bottom:2px solid #212020; padding-bottom:10px; min-width:100%;
  font-family:var(--font); font-size:18px; line-height:26px; color:#212020;
}
.blf-showa .contact-card.signup .card-content .form-wrap .input-group .form-control::placeholder{
  color:#212020; font-weight:400; font-size:18px; line-height:26px; opacity:1;
}
.blf-showa .contact-card.signup .card-content .form-wrap .cta-wrap{margin-left:15px}
/* A hozzájárulás-jelölő és a visszajelzés a theme hírlevélsávjából örökli az
   osztályneveket, azok viszont a sötét láblécsávra vannak színezve — a zöld
   kártyán sötét szöveg kell. */
.blf-showa .contact-card.signup .blf-newsletter__consent{color:rgba(33,32,32,.85); margin-top:16px}
.blf-showa .contact-card.signup .blf-newsletter__consent a{color:#212020}
.blf-showa .contact-card.signup .blf-newsletter__consent input{accent-color:#212020}
.blf-showa .contact-card.signup .blf-newsletter__status{color:#212020}
.blf-showa .contact-card.signup .blf-newsletter__status.is-error{color:#7a1a00}
.blf-showa .contact-card.signup .blf-newsletter__status.is-success{color:#123f1c}

/* A sáv jobb oldali kártyája — „Kesztyűkereső”. Ez NEM az eredetiből jön: ott
   hírlevél-feliratkozás állt, ami kikerült. A zöld tömböt és a szélességet
   viszont a .signup-tól örökli, hogy a sáv arányai ne mozduljanak; a tartalma
   a kesztyűkereső két útvonala. Markup: template-parts/showa/stay-connected.php. */
.blf-showa .contact-card.finder-cta{max-width:570px; height:100%; display:flex}
.blf-showa .contact-card.finder-cta .card-content{
  background-color:#8fc547; width:100%; padding:60px 50px; display:flex; flex-flow:column;
}
.blf-showa .contact-card.finder-cta .finder-cta__eyebrow{
  font-weight:700; font-size:13px; line-height:16px; letter-spacing:.18em; text-transform:uppercase;
  color:rgba(33,32,32,.6); margin:0 0 16px;
}
.blf-showa .contact-card.finder-cta .card-content h4{
  color:#212020; font-size:30px; line-height:34px; margin-bottom:18px;
}
.blf-showa .contact-card.finder-cta .finder-cta__lead{
  color:rgba(33,32,32,.8); font-weight:400; font-size:17px; line-height:26px; margin:0 0 28px; max-width:420px;
}

.blf-showa .finder-cta__routes{display:flex; flex-flow:column; gap:14px; margin:0 0 26px}
.blf-showa .finder-route{
  display:flex; align-items:center; gap:18px; position:relative; overflow:hidden;
  background-color:#fff; color:#212020; padding:20px 22px;
}
/* A bal szélen felfutó zöld csík — a kártyarácsok hover-mozdulatának a párja. */
.blf-showa .finder-route:before{
  content:""; position:absolute; left:0; top:0; bottom:0; width:4px; background-color:#8fc547;
  transform:scaleY(0); transform-origin:bottom; transition:transform .35s var(--ease);
}
.blf-showa .finder-route:hover{background-color:#212020; color:#fff}
.blf-showa .finder-route:hover:before{transform:scaleY(1)}
.blf-showa .finder-route__icon{
  flex:0 0 52px; width:52px; height:52px; border-radius:50%; background-color:var(--fill);
  display:flex; align-items:center; justify-content:center; transition:.4s all var(--ease);
}
.blf-showa .finder-route:hover .finder-route__icon{background-color:#8fc547; color:#212020}
.blf-showa .finder-route__body{flex:1 1 auto; min-width:0}
.blf-showa .finder-route__title{
  display:block; font-weight:900; font-size:16px; line-height:20px; text-transform:uppercase;
}
.blf-showa .finder-route__meta{
  display:block; margin-top:5px; font-size:13px; line-height:19px; color:var(--muted);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.blf-showa .finder-route:hover .finder-route__meta{color:rgba(255,255,255,.6)}
.blf-showa .finder-route__more{font-weight:700; color:#212020}
.blf-showa .finder-route:hover .finder-route__more{color:#8fc547}
.blf-showa .finder-route__go{flex:0 0 auto; display:flex; transition:transform .35s var(--ease)}
.blf-showa .finder-route:hover .finder-route__go{transform:translateX(4px)}

.blf-showa .contact-card.finder-cta .finder-cta__foot{
  display:flex; flex-wrap:wrap; align-items:baseline; gap:6px 10px;
  margin:auto 0 0; padding-top:24px; border-top:2px solid rgba(33,32,32,.2);
  font-weight:400; font-size:15px; line-height:24px; color:rgba(33,32,32,.75);
}
.blf-showa .contact-card.finder-cta .finder-cta__foot a{
  font-weight:700; color:#212020; text-decoration:underline; text-underline-offset:3px;
}
.blf-showa .contact-card.finder-cta .finder-cta__foot a:hover{color:#fff}
.blf-showa .contact-card.finder-cta .finder-cta__dot{color:rgba(33,32,32,.4)}

/* A .contact-card törésponti szabályai a .card-content-re szólnak, az itteni
   osztályos változat viszont erősebb náluk — ezért kap sajátot. */
@media (max-width:1200px){
  .blf-showa .contact-card.finder-cta .card-content{padding:30px}
  .blf-showa .contact-card.finder-cta .card-content h4{font-size:26px; line-height:30px}
  .blf-showa .contact-card.finder-cta .finder-cta__lead{font-size:16px; margin-bottom:22px}
  .blf-showa .finder-route{padding:16px; gap:14px}
  .blf-showa .finder-route__icon{flex:0 0 44px; width:44px; height:44px}
}
@media (max-width:990px){
  .blf-showa .contact-card.finder-cta{max-width:100%}
  .blf-showa .finder-route__meta{white-space:normal}
}
@media (max-width:720px){
  .blf-showa .contact-card.finder-cta .card-content{padding:40px 20px}
  .blf-showa .testimonial + .stay-connected .contact-card.finder-cta{margin-top:50px}
}
@media (max-width:580px){ .blf-showa .finder-route__go{display:none} }
@media (max-width:1200px){
  .blf-showa .stay-connected{padding:50px 0}
  .blf-showa .stay-connected .content .row .col-md-6:nth-child(odd),
  .blf-showa .stay-connected .content .row .col-md-6:nth-child(even){max-width:50%; flex:0 0 50%}
  .blf-showa .contact-card .card-image{max-width:100%}
  .blf-showa .contact-card .card-image img{height:100%; width:100%}
  .blf-showa .contact-card .card-content{width:100%; padding:30px}
  .blf-showa .contact-card .card-content h4{margin-bottom:20px}
  .blf-showa .contact-card .card-content h4 br{display:none}
  .blf-showa .contact-card.signup .card-content{width:100%; padding:30px; height:100%}
  .blf-showa .contact-card.signup .card-content .form-wrap{align-items:flex-end}
  .blf-showa .contact-card.signup .card-content .form-wrap .input-group .form-control{border-bottom:none; min-width:auto; width:100%}
  .blf-showa .contact-card.signup .card-content .form-wrap .cta-wrap{margin-left:0}
  .blf-showa .stay-connected .tl-lines{top:120px}
}
@media (max-width:990px){
  .blf-showa .contact-card.signup,
  .blf-showa .contact-card.signup .card-content,
  .blf-showa .contact-card.signup .card-image{max-width:100%}
}
@media (max-width:720px){
  .blf-showa .stay-connected{padding:0 0 50px}
  .blf-showa .stay-connected .content .row{margin-right:-15px; margin-left:-15px}
  .blf-showa .stay-connected .content .row .col-md-6:nth-child(odd),
  .blf-showa .stay-connected .content .row .col-md-6:nth-child(even){max-width:100%; flex:0 0 100%}
  .blf-showa .contact-card,
  .blf-showa .contact-card .card-content,
  .blf-showa .contact-card .card-image{max-width:100%}
  .blf-showa .contact-card .card-image{width:100%}
  .blf-showa .contact-card .card-content{width:100%; padding:40px 20px}
  .blf-showa .contact-card .card-content h4{margin-bottom:30px; line-height:32px}
  .blf-showa .contact-card .card-content .cta-wrap{display:flex; justify-content:flex-end}
  .blf-showa .testimonial + .stay-connected .contact-card.signup{margin-top:50px}
  .blf-showa .tl-lines{display:none}
}
@media (max-width:580px){ .blf-showa .contact-card{margin-top:50px} }

@media (prefers-reduced-motion:reduce){
  .blf-showa,.blf-showa *{animation-duration:.01ms !important; transition-duration:.01ms !important; scroll-behavior:auto !important}
}

/* =========================================================
   Finder bar mega menus — "Kesztyűkeresés veszélyforrás /
   iparág szerint". Geometry from the source's search-nav:
   panel padding 35px, radius 0 0 28px 28px, six items per
   row, 60px ring → 52px disc → icon. A sáv háttere az eredeti
   search-nav-wrap mintája (header-pattern.png).
   ========================================================= */

/* A sáv minden hangolható értéke --blf-fb-* custom property, a var() második
   fele pedig az EREDETI érték: ha nincs mentett beállítás (Megjelenés →
   Kesztyűkereső sáv), a sáv pontosan úgy néz ki, ahogy itt meg van írva. A
   változókat a renderelő teszi ki a .finder-bar style attribútumába
   (inc/finder-bar.php, blf_finder_bar_style_attr()) — a média-lekérdezések így
   továbbra is felül tudják írni az oszlopszámot. */
/* A sáv görgetéskor a fejléc alá tapad. A .blf-header maga is sticky (top:0),
   a magassága viszont a menütől és a képernyőmérettől függ — a main.js
   stickyFinderBar() blokkja méri, és a --blf-header-h custom propertyn adja át.
   A sticky ugyanúgy pozicionált elem, mint a korábbi relative volt, így a
   .finder-panel abszolút pozíciója továbbra is ehhez a sávhoz igazodik. */
.blf-showa .finder-bar{
  position:sticky; top:var(--blf-header-h,0px); z-index:999;
  background:var(--blf-fb-bg, url("../img/header-pattern.png") repeat center/auto);
  height:50px;
}
/* A bolt SHOWA oldalain (inc/showa-shop-bar.php) NEM a sáv a ragadós elem,
   hanem a burkolója — és ez nem stílusízlés, hanem a sticky működése. Egy
   sticky elem csak a SZÜLŐJE dobozán belül tud utazni: a mikrooldalon a
   .blf-showa az egész lapot körbeöleli, ezért van hova tapadnia, a boltban
   viszont a burkoló pontosan akkora, mint a sáv — ott a sáv sticky-je néma
   maradna, és a sáv egyszerűen elgörögne. A burkoló a <body> közvetlen
   gyermeke (header.php, blf_after_header), tehát neki az egész lap az útja.

   A sáv így csak position:relative: a .finder-panel abszolút lenyílója
   továbbra is hozzá igazodik.

   z-index 79 a burkolón: a mega panel a .blf-header (9000) saját rétegében
   ül, azt úgysem lehet átütni; a lényeg a lapot elsötétítő scrim (body::before,
   80) ALATT maradni, de a „vissza a tetejére” gomb (70) és az archívum ragadós
   oldalsávja (20) fölött. A burkoló ezzel rétegkontextus, a lenyíló benti
   z-index:50-je már csak azon belül számít. A mikrooldalon marad a 999 a
   sávon: ott a banner feliratai (99) különben a sáv fölé kerülnének.

   overflow:visible: a .blf-showa alap overflow-x:clip-jét itt nem kérjük, a
   burkolóban a sávon kívül úgysincs semmi, a lenyílónak viszont ki kell
   lógnia belőle. */
.blf-showa.blf-showa-shopbar{
  position:sticky; top:var(--blf-header-h,0px); z-index:79;
  overflow:visible;
}
.blf-showa.blf-showa-shopbar .finder-bar{ position:relative; top:auto; z-index:auto }
/* A sáv fix 50px magas, a belseje kitölti: a feliratok így függőlegesen az
   align-items:center-rel, vízszintesen a justify-content:center-rel ülnek
   pontosan középen. Az utolsó felirat jobb oldali térközét kinullázzuk, mert
   az különben 22px-szel balra tolná a látszólagos középpontot. */
.blf-showa .finder-inner{display:flex; align-items:center; justify-content:center; gap:0; height:100%}
.blf-showa .finder-sep{width:1px; height:16px; background:var(--blf-fb-sep,#D6D6D6); margin-right:22px}
.blf-showa .finder-item{ position:static; display:flex; align-items:center; height:100% }
.blf-showa .finder-item:last-child .finder-link{ padding-right:0 }

/* A felirat lehet <button> (puszta lenyíló-kapcsoló) vagy <a> (a csoportnak van
   áttekintő oldala) — a gomb az <a> ingyen kapott reszetjét is kéri. */
.blf-showa .finder-link{
  display:inline-flex; align-items:center; gap:10px;
  height:100%; padding:0 var(--blf-fb-link-gap,22px) 0 0;
  background:none; border:0; cursor:pointer;
  font-family:inherit; font-size:17px; font-weight:800;
  letter-spacing:.09em; text-transform:uppercase; color:var(--blf-fb-link,#545555);
  transition:color .2s; text-decoration:none;
}
.blf-showa .finder-link:focus-visible{ outline:2px solid var(--green); outline-offset:-2px; border-radius:4px }
.blf-showa .finder-caret{ display:inline-flex; transition:transform .25s var(--ease) }
.blf-showa .finder-item.is-open .finder-caret{ transform:rotate(180deg) }

/* Panel drops from the bar, centred on the container. */
.blf-showa .finder-panel{
  position:absolute; left:0; right:0; top:100%; z-index:50;
  max-width:var(--blf-fb-panel-maxw,1140px); margin-inline:auto;
  padding:var(--blf-fb-panel-pad,35px); background:var(--blf-fb-panel-bg,#EBEBEB);
  border-radius:0 0 var(--blf-fb-panel-radius,28px) var(--blf-fb-panel-radius,28px);
  box-shadow:0 18px 40px rgba(0,0,0,.14);
}
.blf-showa .finder-panel[hidden]{ display:none }
/* [hidden] is dropped a frame before the fade so the transition can run. */
.blf-showa .finder-panel{ opacity:0; transform:translateY(-10px); transition:opacity .3s linear, transform .3s linear }
.blf-showa .finder-item.is-open .finder-panel{ opacity:1; transform:translateY(0) }

.blf-showa .finder-grid{ display:flex; flex-wrap:wrap; margin:-10px; list-style:none; padding:0 }
.blf-showa .finder-grid > li{ flex:0 0 calc(100% / var(--blf-fb-cols,6)); max-width:calc(100% / var(--blf-fb-cols,6)); padding:10px }
.blf-showa .finder-grid a,
.blf-showa .finder-grid > li > span{
  display:flex; flex-direction:column; align-items:center; text-align:center;
  gap:6px; height:100%; text-decoration:none;
}
/* Amihez a katalógus nem tud célt adni: ott van, csak halványabban. */
.blf-showa .finder-grid > li.is-unmapped{ opacity:.62 }
.blf-showa .finder-ico{
  width:var(--blf-fb-ring,60px); height:var(--blf-fb-ring,60px); border-radius:50%;
  background:var(--blf-fb-ring-bg,var(--green)); border:1px solid #fff;
  display:flex; align-items:center; justify-content:center;
  transition:background .25s var(--ease);
}
.blf-showa .finder-grid > li.is-featured .finder-ico{ box-shadow:0 0 0 3px var(--blf-fb-ring-hover,#77ab34) }
.blf-showa .finder-disc{
  width:var(--blf-fb-disc,52px); height:var(--blf-fb-disc,52px); border-radius:50%;
  background:var(--blf-fb-disc-bg,var(--ink)); border:1px solid #fff; color:var(--blf-fb-icon,#fff);
  display:flex; align-items:center; justify-content:center;
}
.blf-showa .finder-name{ font-size:var(--blf-fb-name-size,14px); line-height:1.2; color:var(--blf-fb-name,#545555); transition:color .2s }
.blf-showa .finder-grid a:hover .finder-name{ color:var(--blf-fb-name-hover,var(--ink)) }
.blf-showa .finder-grid a:hover .finder-ico{ background:var(--blf-fb-ring-hover,#77ab34) }
.blf-showa .finder-grid a:focus-visible{ outline:2px solid var(--green); outline-offset:4px; border-radius:6px }

@media (max-width:1100px){
  .blf-showa .finder-grid > li{ flex-basis:calc(100% / var(--blf-fb-cols-md,4)); max-width:calc(100% / var(--blf-fb-cols-md,4)) }
}
@media (max-width:820px){
  .blf-showa .finder-panel{ padding:24px 20px; border-radius:0; top:100% }
  .blf-showa .finder-grid > li{ flex-basis:calc(100% / var(--blf-fb-cols-sm,3)); max-width:calc(100% / var(--blf-fb-cols-sm,3)) }
  .blf-showa .finder-bar{ height:auto }
  .blf-showa .finder-inner{ height:auto; flex-wrap:wrap; gap:4px 0 }
  .blf-showa .finder-item{ height:40px }
}
@media (max-width:520px){
  .blf-showa .finder-grid > li{ flex-basis:calc(100% / var(--blf-fb-cols-xs,2)); max-width:calc(100% / var(--blf-fb-cols-xs,2)) }
  .blf-showa .finder-link{ font-size:10.5px; padding-right:14px }
  .blf-showa .finder-sep{ margin-right:14px }
}
@media (prefers-reduced-motion:reduce){
  .blf-showa .finder-panel,.blf-showa .finder-caret{ transition:none }
}

/* =========================================================
   SZÖVEGES SZAKASZ (.blf-showa-text)

   A márkaoldal (template-showa-landing.php) és a két kereső-áttekintő lap
   (template-parts/showa/finder-group-page.php) SEO-munkafüzetből jövő
   szövege: cím + bevezető, választási szempontok, GYIK, következő lépés.
   Az eredeti showagroup.com-on nincs ilyen szekció — olvasható hasáb a lap
   saját betűjével és színeivel. A szöveget az inc/showa-seo-import.php írja
   a lap, illetve a márkacímke mezőibe.
   ========================================================= */
.blf-showa .blf-showa-text{padding:56px 0; color:var(--ink)}
.blf-showa .blf-showa-text--intro{padding:48px 0 0}
.blf-showa .blf-showa-text__inner{max-width:880px}
.blf-showa .blf-showa-text h1{font-weight:900; font-size:36px; line-height:40px; text-transform:uppercase; margin:0 0 16px; color:var(--ink)}
.blf-showa .blf-showa-text h2{font-weight:800; font-size:26px; line-height:32px; margin:40px 0 12px; color:var(--ink)}
.blf-showa .blf-showa-text h2:first-child{margin-top:0}
.blf-showa .blf-showa-text h3{font-weight:700; font-size:19px; line-height:26px; margin:24px 0 8px; color:var(--ink)}
.blf-showa .blf-showa-text p,
.blf-showa .blf-showa-text li{font-size:17px; line-height:27px; color:var(--muted)}
.blf-showa .blf-showa-text p{margin:0 0 14px}
.blf-showa .blf-showa-text .blf-showa-text__lead{font-size:19px; line-height:29px; color:var(--ink)}
.blf-showa .blf-showa-text ul{margin:0 0 16px; padding-left:20px; list-style:disc}
.blf-showa .blf-showa-text li{margin:4px 0}
.blf-showa .blf-showa-text a:not(.blf-btn){color:var(--ink); text-decoration:underline; text-underline-offset:2px}
.blf-showa .blf-showa-text a:not(.blf-btn):hover{color:var(--green)}
.blf-showa .blf-showa-text .blf-showa-cta{margin:20px 0 8px}
/* `.blf-showa a{color:inherit}` outranks `.blf-btn--orange`; the button keeps its white label. */
.blf-showa .blf-showa-text a.blf-btn--orange,.blf-showa .blf-showa-text a.blf-btn--orange:hover{color:#fff}
@media (max-width:720px){
  .blf-showa .blf-showa-text{padding:40px 0}
  .blf-showa .blf-showa-text--intro{padding:36px 0 0}
  .blf-showa .blf-showa-text h1{font-size:28px; line-height:32px}
  .blf-showa .blf-showa-text h2{font-size:22px; line-height:28px}
}
