@import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:wght@400;600;700&family=Ubuntu:wght@400;500;700&display=swap');

@import url("https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400..900&family=Mulish:wght@400;600;700&display=swap");

:root{
  --font-heading: 'Fraunces', Georgia, 'Times New Roman', serif;
  --font-body: 'Mulish', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  --almond:#DC8A47;
  --indigo:#412929;
  --green:#74515f;
  --lemon:#a98aa1;
  --silk:#c1ceb7;
  --shadow:0 10px 25px rgba(0,0,0,.08);
  --radius:18px;
}

#ContentPane{
  max-width:1400px !important;
  width:100% !important;
  margin:0 auto !important;
}

/*====csunya login elrejtes===*/
/* ===== TOP HEADER ELREJTÉSE ===== */
#topHeader {
    display: none !important;
}

/* ===== ALAP ===== */

body{
  background:#f0ebe7;
  font-family:var(--font-body);
  color:var(--indigo);
  font-weight:400;
}

body.personabar-visible{
  margin-left:0 !important;
}

/* ===== LAYOUT HÁTTÉR ===== */

#breadcrumb{
  display:none !important;
}

main,
main[role="main"],
#mainContent-inner,
.dnnpane{
  background:#f0ebe7 !important;
  border:none !important;
}

/* ===== CÍMEK ===== */

h1, h2, h3,
.lms_heading_3,
.lms_heading_title,
.TitleH2-v2,
.hc-product-card .panel-heading h2{
  font-family:var(--font-heading), serif !important;
  font-weight:700 !important;
  letter-spacing:-0.5px;
}

h1,h2{
  color:var(--indigo);
}

/* ===== HEADER / MENÜ ===== */

header[role="banner"]{
  background:var(--indigo) !important;
  padding:0 !important;
  position:relative;
  background-image: url("/Portals/0/kiskukta_attetszo2.png") !important;
    
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: left !important;
    z-index: 10000 !important; /* Legyen minden felett */

}


/* A logó pontosan olyan magas (46px), mint a H1 címeid */
header[role="banner"]::before {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    left: 24px !important; /* Távolság a képernyő bal szélétől */
    top: 50% !important;
    transform: translateY(-50%) !important;
    
    /* Magasság szinkronizálva a H1-el (46px) */
    height: 46px !important; 
    width: 130px !important; /* Arányos szélesség a képhez */
    
    background-image: url("/Portals/0/kiskukta_proba2.png") !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: left center !important;
    z-index: 10000 !important;
}

/* Segédkód: Ha a tartalom doboza (container) korlátozná a headert, azt is feloldjuk */
.container-fluid, .main-header .container {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
}

header a{
  color:#ffffff !important;
  font-weight:600;
  font-family:var(--font-body), sans-serif;
  
}

header a:hover{
  color:var(--almond) !important;
}


/* ===== LOGÓ ===== */

header img{
  max-height:50px;
}

.navbar-brand{
  padding:0!important;
}

.navbar-brand img{
  max-height:38px;
}


/* ===== MENÜ ===== */

.navbar{
  min-height:44px !important;
}

.navbar-nav > li > a{
  padding:12px 14px !important;
  line-height:20px !important;
}

.navbar-default .navbar-nav > .active > a{
  color:var(--almond) !important;
  border-bottom:3px solid var(--almond);
  background:none !important;
}

.navbar-default .navbar-nav > li > a:hover{
  background:none !important;
}

/* menüsor jobbra igazítása */
.navbar-collapse{
  display:flex !important;
  justify-content:flex-end !important;
}

.navbar-nav{
  float:none !important;
  margin-left:auto !important;
  margin-right:0 !important;
  display:flex !important;
  justify-content:flex-end !important;
}

.navbar-nav > li{
  float:none !important;
}

/* lenyíló menü hoverre nyíljon */
.navbar-nav > li.dropdown:hover > .dropdown-menu{
  display: block !important;
  opacity: 1;
  visibility: visible;
}

/* alapból legyen rejtve szépen */
.navbar-nav > li.dropdown > .dropdown-menu{
  display: none;
}

/* a fő menüpont maradjon aktív hovernél is */
.navbar-nav > li.dropdown:hover > a{
  color: var(--almond) !important;
}

/* ===== TELJES SZÉLESSÉG ===== */

#siteWrapper > .container{
  width:100% !important;
  max-width:100% !important;
  padding-left:24px !important;
  padding-right:24px !important;
}


/* dropdown teljes reset */
.dropdown-menu{
    background: #ffffff !important;
    border: none !important;
    outline: none !important;
    box-shadow: 0 8px 18px rgba(0,0,0,0.12) !important;
    border-radius: 12px !important;
    padding: 0 !important;
}

/* minden belső elem */
.dropdown-menu *{
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    border-radius: 12px !important;
}

/* lista */
.dropdown-menu li{
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* link */
.dropdown-menu li a{
    display: block !important;
    width: 100% !important;
    padding: 12px 18px !important;
    background: transparent !important;
    color: #DC8A47 !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    border-radius: 12px !important;
}

/* hover */
.dropdown-menu li a:hover{
    background: #f3e8f0 !important;
    border-radius: 12px !important;
}

/* header legyen referencia pont */
header[role="banner"]{
  position: relative;
}

/* Mini cart pozicionálása */
#HeaderPane{
  position:absolute;
  top:-70px;
  right:50px;
  z-index:999;
  width:auto !important;
}

/* modul doboz eltüntetése */
#HeaderPane .DnnModule{
  margin:0 !important;
  padding:0 !important;
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
}

/* szerkesztő elemek elrejtése */
#HeaderPane .moduleTitle,
#HeaderPane .dnnActionMenu,
#HeaderPane .dnnControls{
  display:none !important;
}

/* hogy a menü ne menjen rá */
#navbar{
  padding-right: 20px;
}

/* ===== SEARCH ===== */

#dnn_HeaderPane{
  padding-top:0px !important;
  padding-bottom:20px !important;
}

.hc-search-input{
  width:100% !important;
  margin:24px 0 18px !important;
}

.hc-search-input .form-control{
  width:100% !important;
  border-radius:14px;
  border:0;
  box-shadow:var(--shadow);
}

.hc-search-input .btn{
  border-radius:14px;
  background:var(--almond);
  border:0;
  color:#fff;
  box-shadow:var(--shadow);
}


/* ===== STORE ADMIN ===== */

.hc-catalog-admin .alert{
  background:#ffffff !important;
  border:none !important;
  border-radius:var(--radius);
  box-shadow:var(--shadow);
}

.hc-catalog-admin .btn{
  background:var(--almond);
  border:none;
  color:#fff;
  border-radius:12px;
}

/* ===== KATEGÓRIA KÁRTYÁK ===== */

.hc-category .panel{
  border:none;
  border-radius:var(--radius);
  overflow:hidden;
  box-shadow:var(--shadow);
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 200px;

}

.hc-category .panel-footer{
  background:var(--lemon);
  text-align:center;
  font-weight:700;
  color:#ffffff !important;
  width: 100%;
  
}

.hc-category .panel-footer,
.hc-category .panel-footer a,
.hc-category .panel-footer span,
.hc-category .panel-footer div,
.hc-category .panel-footer h2,
.hc-category .panel-footer h2 a{
  color:#ffffff !important;
  text-decoration:none !important;
}

/* Hover effektek megegyeznek a termékkártyákkal */
.hc-category .panel {
  transition: transform .25s ease, box-shadow .25s ease;
}

.hc-category .panel:hover {
  transform: translateY(-6px);
  box-shadow: 0 16px 30px rgba(0,0,0,.12);
}

.hc-category{
  margin-bottom:30px;
}

.hc-category .panel{
  height:420px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  align-items:stretch;
}

.hc-category .panel-body{
  height:320px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px;
  background:#ffffff;
}

.hc-category .panel-body img{
  max-width:100%;
  max-height:240px;
  width:auto;
  height:auto;
  object-fit:contain;
  display:block;
  margin:0 auto;
}

.hc-category .panel-footer{
  min-height:74px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:14px 18px;
}

/* ===== TERMÉK KÁRTYÁK ===== */

hc-product-card .panel{
  border:none;
  border-radius:var(--radius);
  overflow:hidden;
  box-shadow:var(--shadow);
  transition:.2s ease;
}

.hc-product-card .panel:hover{
  transform:translateY(-5px);
}

.hc-product-card .panel-heading{
  background:#ffffff;
  border:none;
}

.hc-product-card .panel-heading h2 a{
  font-size:17px;
  color:var(--indigo) !important;
  text-decoration:none;
}

.hc-product-card .panel-body{
  background:#ffffff;
}

.hc-product-card .hc-price,
.hc-product-card .hc-price span,
.hc-product-card .hc-price *,
.hc-product-card .panel-footer,
.hc-product-card .panel-footer span,
.hc-product-card .panel-footer div,
.hc-product-card .panel-footer a,
.hc-product-card .panel-footer .price{
  color:#ffffff !important;
}

.hc-product-card .panel-footer{
  background:var(--green);
  font-weight:700;
}
/* ===== TERMÉK KÁRTYÁK – EGYSÉGES MÉRET ÉS SORBAN ===== */
/* Konténer: kártyák egy sorban, töréssel ha kell */
.hc-product-card-container {
  display: flex;
  flex-wrap: wrap;    /* több sor, ha nem fér ki */
  gap: 24px;
  justify-content: flex-start;
}

/* Kártyák egységes szélesség és magasság */
.hc-product-card {
  flex: 0 1 250px;    /* fix alap szélesség, rugalmas növekedés */
  display: flex;
  flex-direction: column;
  height: 400px;      /* fix magasság minden kártyának */
  box-sizing: border-box;
}

/* Panel kitöltése, hogy a tartalom szépen oszoljon */
.hc-product-card .panel {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  overflow: hidden;
}

/* Panel body rugalmas, hogy a lábléc a helyén maradjon */
.hc-product-card .panel-body {
  flex: 1 1 auto;
}

/* ===== KÁRTYA HOVER EFFEKT ===== */

.hc-product-card .panel,
.hc-category .panel{
  transition: transform .25s ease, box-shadow .25s ease;
}

.hc-product-card .panel:hover,
.hc-category .panel:hover{
  transform: translateY(-6px);
  box-shadow: 0 16px 30px rgba(0,0,0,.12);
}

/* ===== ADD TO CART ===== */

a.add-to-cart-product{
  display:inline-block;
  margin-top:8px;
  padding:10px 14px;
  background:var(--almond);
  color:#fff !important;
  border-radius:12px;
  font-weight:700;
  text-decoration:none;
  box-shadow:var(--shadow);
}

a.add-to-cart-product:hover{
  background:#c97a36;
  transform:scale(1.03);
}

/* ===== PAGINATION ===== */

.pagination > li > a{
  color:var(--indigo);
  border:none;
}

.pagination > .active > a{
  background:var(--almond) !important;
  border:none;
  color:#fff !important;
}

/* ===== FOOTER ===== */

footer{
  background:var(--green);
  color:var(--indigo);
}

footer a{
  color:var(--indigo);
}

footer a:hover{
  color:var(--almond);
}

/* ===== ALSÓ KAVARODÁS JAVÍTÁSA ===== */

/* footeren belüli plusz sávok eltüntetése */
footer .container,
footer .row,
footer .pane,
footer .dnnpane,
footer .DnnModule,
footer .dnnModuleContent{
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  margin:0 !important;
}

/* footer linkek */
footer a{
  color:#ffffff !important;
}

footer a:hover{
  color:var(--almond) !important;
}


/* ===== KÉT OSZLOPOS LAYOUT ===== */

#mainContent-inner .row.dnnpane{
  display:flex;
  align-items:flex-start;
  gap:32px;
}

#dnn_P2_25_1{
  flex:0 0 260px;
  max-width:260px;
  position:sticky;
  top:20px;
}

#dnn_P2_75_2{
  flex:1 1 0;
  max-width:calc(100% - 292px);
  min-width:0;
}

/* =========================================================
   FŐOLDAL – HERO + HÍREK SZÉPÍTÉS
   ========================================================= */

/* Főoldali felső modul */
#dnn_ctr403_HtmlModule_lblContent{
  max-width: 1280px;
  margin: 24px auto 40px auto;
}

#dnn_ctr403_HtmlModule_lblContent h2{
  display:none !important; /* a sima "Főoldal" cím ne látszódjon */
}

/* A táblázatos hero blokk modernizálása */
#dnn_ctr403_HtmlModule_lblContent table{
  width:100% !important;
  border-collapse:separate !important;
  border-spacing:0 !important;
  background:linear-gradient(135deg, #f6f1eb 0%, #f6f1eb 100%);
  border-radius:28px;
  overflow:hidden;
  box-shadow:0 18px 40px rgba(0,0,0,.08);
}

#dnn_ctr403_HtmlModule_lblContent table tr{
  display:flex;
  align-items:center;
  min-height:460px;
}

#dnn_ctr403_HtmlModule_lblContent table td{
  width:50%;
  vertical-align:middle;
  padding:56px !important;
  border:none !important;
}

/* bal oldali szöveg */
#dnn_ctr403_HtmlModule_lblContent table td:first-child{
  background:transparent;
}

#dnn_ctr403_HtmlModule_lblContent table td:first-child p:first-child{
  font-family:var(--font-heading), serif;
  font-size:48px;
  line-height:1.1;
  font-weight:700;
  color:var(--indigo);
  margin:0 0 18px 0;
  max-width:520px;
}

#dnn_ctr403_HtmlModule_lblContent table td:first-child p:last-child{
  font-size:18px;
  line-height:1.75;
  color:#5f4b5a;
  margin:0;
  max-width:560px;
}

/* jobb oldali kép */
#dnn_ctr403_HtmlModule_lblContent table td:last-child{
  padding:0 !important;
  height:460px;
  margin-right: 30px;
}

#dnn_ctr403_HtmlModule_lblContent table td:last-child img{
  width:100% !important;
  height:100% !important;
  object-fit:cover;
  display:block;
}

/* Hero fölé kis címke */
#dnn_ctr403_HtmlModule_lblContent table td:first-child::before{
  content:"Főzz tudatosan. Vásárolj okosan. Élj fenntarthatóan.";
  display:inline-block;
  margin-bottom:38px;
  padding:8px 14px;
  background:rgba(220,138,71,.12);
  color:var(--almond);
  border-radius:999px;
  font-size:13px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.hero-buttons{
  margin-top:25px;
  display:flex;
  gap:15px;
}

/* fő gomb */
.btn-primary{
  background:#8f6c80;
  color:#fff;
  padding:12px 22px;
  border-radius:12px;
  text-decoration:none;
  font-weight:600;
  transition:all .2s ease;
}

.btn-primary:hover{
  background:#7a5c6e;
}

/* másodlagos */
.btn-secondary{
  background: var(--lemon);
  color:#333;
  padding:12px 22px;
  border-radius:12px;
  text-decoration:none;
  font-weight:500;
  transition:all .2s ease;
}

.btn-secondary:hover{
  background:var(--green);
}

.hero-buttons a{
  text-decoration:none !important;
  color:#ffffff;
}



/*===CIKKEK===*/
/* ===== BLOKK ===== */
.cikk-slider-blokk{
 width:100%;
  max-width:1280px;
  margin:70px auto;
  padding:0 20px;
  box-sizing:border-box;
}

.cikk-slider-blokk *{
  box-sizing:border-box;
}

/* ===== FEJLÉC ===== */
.cikk-slider-fejlec h2{
  margin:0;
  font-size:64px;
  line-height:1.08;
  font-family:var(--font-heading);
  font-weight:700;
  color:#3f2a2a;
}

.cikk-slider-vonal{
  width:110px;
  height:6px;
  margin:0 0 36px;
  background:#c88a47;
  border-radius:999px;
}

/* ===== WRAP ===== */
.cikk-slider-wrap{
  position:relative;
}

.cikk-cel{
  position:absolute;
  top:0;
  left:0;
  width:1px;
  height:1px;
  opacity:0;
  pointer-events:none;
}

/* ===== KERET ===== */
.cikk-slider-keret{
  width:100%;
  overflow:hidden;
}

/* ===== PÁLYA ===== */
.cikk-slider-palya{
  display:flex;
  width:200%;
  transform:translateX(0);
  transition:transform 0.45s ease;
}

/* target alapú lapozás */
#cikk-slide-2:target ~ .cikk-slider-keret .cikk-slider-palya{
  transform:translateX(-50%);
}

#cikk-slide-1:target ~ .cikk-slider-keret .cikk-slider-palya{
  transform:translateX(0);
}

/* ===== OLDAL ===== */
.cikk-oldal{
  width:50%;
  display:flex;
  gap:28px;
  padding:10px 4px 24px;
}

/* ===== KÁRTYA ===== */
.cikk-kartya{
  flex:0 0 calc((100% - 84px) / 4);
  max-width:calc((100% - 84px) / 4);
  min-width:calc((100% - 84px) / 4);

  display:flex;
  flex-direction:column;
  background:#ffffff;
  border-radius:30px;
  overflow:hidden;
  text-decoration:none !important;
  color:inherit !important;
  box-shadow:0 8px 24px rgba(0,0,0,0.08);
  transition:transform 0.25s ease, box-shadow 0.25s ease;
}

.cikk-kartya:hover{
  transform:translateY(-8px);
  box-shadow:0 16px 30px rgba(0,0,0,0.14);
}

.cikk-kartya:link,
.cikk-kartya:visited,
.cikk-kartya:hover,
.cikk-kartya:active{
  text-decoration:none !important;
  color:inherit !important;
}

/* ===== KÉP ===== */
.cikk-kep{
  width:100%;
  height:230px;
  overflow:hidden;
  background:#e9e4df;
  flex-shrink:0;
}

.cikk-kep img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}

/* ===== SZÖVEG ===== */
.cikk-szoveg{
  padding:24px 24px 28px;
  min-height:150px;
  background:#ffffff;
  display:flex;
  align-items:flex-start;
}

.cikk-szoveg h3{
  margin:0;
  font-family:'Playfair Display', serif;
  font-size:22px;
  line-height:1.32;
  font-weight:600;
  color:#3f2a2a !important;
  text-decoration:none !important;
  word-break:break-word;
}

/* ===== ÜRES KÁRTYA ===== */
.cikk-kartya-ures{
  background:transparent;
  box-shadow:none;
  pointer-events:none;
}

/* ===== GOMBOK ===== */
.cikk-gomb{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  z-index:20;

  width:46px;
  height:46px;
  border-radius:50%;
  background:#ffffff;
  color:#3f2a2a !important;
  box-shadow:0 5px 16px rgba(0,0,0,0.14);

  display:flex;
  align-items:center;
  justify-content:center;

  font-size:24px;
  line-height:1;
  text-decoration:none !important;
}

.cikk-gomb-bal{
  left:-20px;
}

.cikk-gomb-jobb{
  right:-22px;
}

.cikk-gomb:hover{
  transform:translateY(-50%) scale(1.06);
  box-shadow:0 8px 20px rgba(0,0,0,0.18);
}

/* ===== PÖTTYÖK ===== */
.cikk-pontok{
  margin-top:14px;
  display:flex;
  gap:10px;
}

.cikk-pont{
  width:12px;
  height:12px;
  border-radius:50%;
  background:#d8cfc7;
  display:inline-block;
  text-decoration:none !important;
}

#cikk-slide-2:target ~ .cikk-pontok .cikk-pont:nth-child(2){
  background:#c88a47;
}

#cikk-slide-2:target ~ .cikk-pontok .cikk-pont:nth-child(1){
  background:#d8cfc7;
}

/* alapállapot: első aktív */
.cikk-pontok .cikk-pont:first-child{
  background:#c88a47;
}

/* ===== TABLET ===== */
@media (max-width:1200px){
  .cikk-kartya{
    flex:0 0 calc((100% - 56px) / 3);
    max-width:calc((100% - 56px) / 3);
    min-width:calc((100% - 56px) / 3);
  }
}

/* ===== MOBIL ===== */
@media (max-width:768px){
  .cikk-slider-fejlec h2{
    font-size:44px;
  }

  .cikk-oldal{
    gap:20px;
  }

  .cikk-kartya{
    flex:0 0 100%;
    max-width:100%;
    min-width:100%;
  }

  .cikk-kep{
    height:190px;
  }

  .cikk-szoveg h3{
    font-size:20px;
  }

  .cikk-gomb{
    width:40px;
    height:40px;
    font-size:20px;
  }

  .cikk-gomb-bal{
    left:-8px;
  }

  .cikk-gomb-jobb{
    right:-8px;
  }
}

.cikk-kep{
  width:100%;
  height:230px;
  overflow:hidden;
  background:#e9e4df;
  flex-shrink:0;
}

.cikk-kep img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}
.cikk-slider-wrap{
  position:relative;
}

.cikk-cel{
  position:fixed;
  top:0;
  left:0;
  width:1px;
  height:1px;
  opacity:0;
  pointer-events:none;
}

#cikk-slide-2:target ~ .cikk-slider-keret .cikk-slider-palya{
  transform:translateX(-50%);
}

#cikk-slide-1:target ~ .cikk-slider-keret .cikk-slider-palya{
  transform:translateX(0);
}
.cikk-szoveg h3 a{
  color:#3f2a2a !important;
  text-decoration:none !important;
  display:block;
}

.cikk-szoveg h3 a:hover{
  color:var(--lemon) !important;
}

/*=======
    miert a kiskukta
    =====*/

.miert-kiskukta-blokk{
  width:100%;
  max-width:1600px;
  margin:70px auto 50px;
  padding:0 clamp(20px, 4vw, 70px);
  box-sizing:border-box;
}

.miert-kiskukta-racs{
  display:grid;
  grid-template-columns:1.1fr 0.9fr;
  gap:42px;
  align-items:center;
}

.miert-kiskukta-szoveg{
  padding:20px 0;
}

.miert-kiskukta-vonal{
  width:90px;
  height:5px;
  background:#c88a47;
  border-radius:999px;
  margin-bottom:20px;
}

.miert-kiskukta-szoveg h2{
  margin:0 0 18px;
  font-size:60px;
  line-height:1.08;
  font-family:'Playfair Display', serif;
  color:#3f2a2a;
}

.miert-kiskukta-bevezeto{
  margin:0 0 26px;
  max-width:720px;
  font-size:19px;
  line-height:1.75;
  color:#6b5a5a;
}

.miert-kiskukta-kartyak{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
}

.miert-kiskukta-kisblokk{
  background:#ffffff;
  border-radius:28px;
  padding:24px 24px 22px;
  box-shadow:0 14px 30px rgba(0,0,0,0.06);
}

.miert-kiskukta-kisblokk h3{
  margin:0 0 10px;
  font-size:24px;
  line-height:1.2;
  font-family:'Playfair Display', serif;
  color:#3f2a2a;
}

.miert-kiskukta-kisblokk p{
  margin:0;
  font-size:17px;
  line-height:1.65;
  color:#6b5a5a;
}

.miert-kiskukta-kep{
  position:relative;
  min-height:520px;
  border-radius:40px;
  overflow:hidden;
  box-shadow:0 20px 45px rgba(0,0,0,0.10);
}

.miert-kiskukta-kep img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}


.miert-kiskukta-racs{
  grid-template-columns:1.2fr 0.8fr; /* kevesebb hely a képnek */
}

/* kép kisebb */
.miert-kiskukta-kep{
  min-height:420px;   /* eddig 520 volt */
  max-height:420px;
}

/*====
 kinek szol 
 ====*/
 .kinek-blokk{
  width:100%;
  max-width:1600px;
  margin:70px auto 90px;
  padding:0 clamp(20px, 4vw, 70px);
  box-sizing:border-box;
}

.kinek-racs{
  display:grid;
  grid-template-columns:1.05fr 1fr;
  gap:36px;
  align-items:stretch;
}

.kinek-kep{
  min-height:520px;
  border-radius:36px;
  overflow:hidden;
  box-shadow:0 20px 45px rgba(0,0,0,0.10);
}

.kinek-kep img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}

.kinek-tartalom{
  background:#f6f1eb;
  border-radius:36px;
  padding:48px 46px;
  box-shadow:0 18px 40px rgba(0,0,0,0.06);
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.kinek-cimke{
  display:inline-block;
  width:fit-content;
  margin-bottom:16px;
  padding:10px 18px;
  border-radius:999px;
  background:#efe4d7;
  color:#c88a47;
  font-size:14px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.kinek-tartalom h2{
  margin:0;
  font-size:56px;
  line-height:1.08;
  font-family:'Playfair Display', serif;
  color:#3f2a2a;
}

.kinek-vonal{
  width:110px;
  height:5px;
  margin:16px 0 26px;
  background:#c88a47;
  border-radius:999px;
}

.kinek-lista{
  display:flex;
  flex-direction:column;
  gap:14px;
}

.kinek-sor{
  position:relative;
  padding:16px 18px 16px 54px;
  background:#ffffff;
  border-radius:22px;
  color:#5f5353;
  font-size:18px;
  line-height:1.55;
  box-shadow:0 10px 24px rgba(0,0,0,0.05);
}

.kinek-sor::before{
  content:"";
  position:absolute;
  left:18px;
  top:50%;
  transform:translateY(-50%);
  width:20px;
  height:20px;
  border-radius:50%;
  background:#c88a47;
  box-shadow:0 0 0 6px rgba(200,138,71,0.16);
}

.kinek-zaro{
  margin-top:24px;
  padding:18px 22px;
  border-radius:24px;
  background:#3f2a2a;
  color:#ffffff;
  font-size:24px;
  line-height:1.35;
  font-family:'Playfair Display', serif;
  font-weight:700;
  text-align:center;
}


/* =========================================================
   TÉRKÖZÖK
   ========================================================= */

#mainContent-inner{
  max-width:1320px;
  margin:0 auto;
  padding-bottom:100px;
}

#dnn_P1_75_1{
  margin-top:20px !important;
  margin-bottom:10px !important;
}

#dnn_P3_33_1,
#dnn_P3_33_2,
#dnn_P3_33_3{
  margin-top:0 !important;
}
/* ===== LÁGY CTA SZEKCIÓ ===== */

.cta-section-soft{
  max-width: 980px;
  margin: 90px auto 40px auto;
  padding: 10px 20px 0;
  text-align: center;
}

.cta-section-soft h2{
  margin: 0 0 18px 0;
  color: var(--indigo);
  font-family: var(--font-heading);
  font-size: 52px;
  line-height: 1.08;
  font-weight: 700;
  letter-spacing: -0.02em;
}

.cta-section-soft p{
  max-width: 760px;
  margin: 0 auto 30px auto;
  color: #5f4b5a;
  font-family: var(--font-body);
  font-size: 21px;
  line-height: 1.7;
}

.cta-buttons-soft{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}

.cta-primary-soft,
.cta-secondary-soft{
  display: inline-block;
  padding: 14px 26px;
  border-radius: 14px;
  text-decoration: none !important;
  font-family: var(--font-body);
  font-weight: 700;
  transition: all .2s ease;
}

/* első gomb */
.cta-primary-soft,
.cta-primary-soft:visited,
.cta-primary-soft:hover,
.cta-primary-soft:active,
.cta-primary-soft:focus{
  background: #8f6c80;
  color: #ffffff !important;
  text-decoration: none !important;
}

/* második gomb */
.cta-secondary-soft,
.cta-secondary-soft:visited,
.cta-secondary-soft:hover,
.cta-secondary-soft:active,
.cta-secondary-soft:focus{
  background: transparent;
  color: var(--indigo) !important;
  border: 1px solid rgba(65,41,41,0.18);
  text-decoration: none !important;
}

.cta-primary-soft:hover{
  background: #7c5d70;
  transform: translateY(-2px);
}

.cta-secondary-soft:hover{
  background: rgba(255,255,255,0.45);
  border-color: rgba(65,41,41,0.28);
  transform: translateY(-2px);
}


.cta-section-soft{
  max-width: 980px;
  margin: 90px auto 40px auto;
  padding: 30px 20px 0;
  text-align: center;
  position: relative;
}

/* ===== ALMOND CSÍK ===== */
.cta-section-soft::before{
  content: "";
  display: block;
  width: 80px;
  height: 4px;
  background: var(--almond);
  border-radius: 2px;
  margin: 0 auto 40px auto;
}


/*===FOOTER===*/

/*kék eltuntetes*/ 

footer .footer-above{
  border-top: 0 !important;
  padding-top: 0 !important;
  margin-top: 0 !important;
}

footer .footer-below{
  border-top: 0 !important;
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* =========================================================
   HOTCAKES CART – CLEANED
   valódi markuphoz igazítva
   ========================================================= */



/* ===== KOSÁR FEJLÉC – RENDBE TÉVE ===== */

/* fő kosárdoboz */
#dnn_ctr388_ModuleContent .hcMvcView .row-fluid.hc-cart{
  max-width: 1180px;
  margin: 40px auto !important;
  padding: 24px 34px 34px !important;
  /*background: #f5efea !important;*/
  border-radius: 30px !important;
  box-shadow: 0 14px 34px rgba(0,0,0,.06) !important;
  color: #432b29 !important;
  overflow:hidden;
}



/* cím: NEM külön buborék */
#dnn_ctr388_ModuleContent .hcMvcView .row-fluid.hc-cart > .col-xs-12 > .row-fluid.hc-cart-title:first-child h1{
  display: block !important;
  margin: 20 8px 0 0 !important;
  padding: 18px 28px !important;
  background:  linear-gradient(135deg, #f6f1eb 0%, #f6f1eb 100%) !important;
  border: 0 !important;
  border-radius: 999px !important;
  box-shadow: 0 14px 34px rgba(0,0,0,.06) !important;
  font-size: 46px !important;
  line-height: 1.08 !important;
  color: #432b29!important;
}

/* a cím pseudoelemeit kapcsold le */
#dnn_ctr388_ModuleContent .hcMvcView .row-fluid.hc-cart > .col-xs-12 > .row-fluid.hc-cart-title:first-child h1::before,
#dnn_ctr388_ModuleContent .hcMvcView .row-fluid.hc-cart > .col-xs-12 > .row-fluid.hc-cart-title:first-child h1::after{
  content: none !important;
  display: none !important;
}

/* termékszám */
#dnn_ctr388_ModuleContent .hcMvcView .row-fluid.hc-cart > .col-xs-12 > .row-fluid.hc-cart-title:first-child h6{
  margin: 0 !important;
  color: #6f5d58 !important;
  font-size: 18px !important;
  font-weight: 500 !important;
}

/* a második hc-cart-title már ne kapjon ugyanilyen fejléc kinézetet */
#dnn_ctr388_ModuleContent .hcMvcView .row-fluid.hc-cart > .col-xs-12 > .row-fluid.hc-cart-title:not(:first-child){
  background: transparent !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}


/* ===== TÁBLA ===== */
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart .table-responsive{
  overflow-x: visible !important;
}

#dnn_ctr388_ModuleContent .hcMvcView .hc-cart table.table{
  width: 100% !important;
  margin-bottom: 0 !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  table-layout: fixed !important;
  background: transparent !important;
}

/* thead-ben th ÉS td is van */
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart table.table thead th,
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart table.table thead td{
  background: #eee4da !important;
  color: #4b332f !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  text-align: left !important;
  padding: 16px 14px !important;
  border: 0 !important;
  vertical-align: middle !important;
}


/* body */
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart table.table tbody td{
  padding: 18px 14px !important;
  vertical-align: top !important;
  border: 0 !important;
  border-bottom: 1px solid #e6d8cd !important;
  background: transparent !important;
  color: #4b332f !important;
}

/* oszlopszélesség */
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart table.table thead tr > *:nth-child(1),
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart table.table tbody tr > *:nth-child(1){ width: 16% !important; }

#dnn_ctr388_ModuleContent .hcMvcView .hc-cart table.table thead tr > *:nth-child(2),
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart table.table tbody tr > *:nth-child(2){ width: 34% !important; }

#dnn_ctr388_ModuleContent .hcMvcView .hc-cart table.table thead tr > *:nth-child(3),
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart table.table tbody tr > *:nth-child(3){ width: 14% !important; }

#dnn_ctr388_ModuleContent .hcMvcView .hc-cart table.table thead tr > *:nth-child(4),
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart table.table tbody tr > *:nth-child(4){ width: 18% !important; }

#dnn_ctr388_ModuleContent .hcMvcView .hc-cart table.table thead tr > *:nth-child(5),
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart table.table tbody tr > *:nth-child(5){ width: 14% !important; }

#dnn_ctr388_ModuleContent .hcMvcView .hc-cart table.table thead tr > *:nth-child(6),
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart table.table tbody tr > *:nth-child(6){
  width: 4% !important;
  text-align: center !important;
}

/* ===== TERMÉKNÉV ===== */
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart tbody td a{
  color: #432b29 !important;
  text-decoration: none !important;
}

#dnn_ctr388_ModuleContent .hcMvcView .hc-cart tbody td a:hover{
  color: #8f5f4c !important;
}

#dnn_ctr388_ModuleContent .hcMvcView .hc-cart tbody td h6{
  margin: 0 !important;
  font-size: 22px !important;
  line-height: 1.3 !important;
  font-weight: 600 !important;
  color: #432b29 !important;
}

/* ===== KÉP ===== */
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart img.img-responsive{
  width: 125px !important;
  max-width: 100% !important;
  height: auto !important;
  border-radius: 16px !important;
  background: #fffaf6 !important;
  padding: 8px !important;
  border: 1px solid #eadfd5 !important;
}

/* ===== ÁR ===== */
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart td .lead{
  color: #7a5b56 !important;
  background: transparent !important;
  font-size: 18px !important;
  line-height: 1.35 !important;
  font-weight: 400 !important;
  white-space: nowrap !important;
}

/* ===== MENNYISÉG ===== */
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart input.form-control{
  width: 86px !important;
  height: 42px !important;
  padding: 8px 12px !important;
  border-radius: 14px !important;
  border: 1px solid #d8c9bd !important;
  background: #fffaf6 !important;
  color: #4b332f !important;
  box-shadow: none !important;
}

#dnn_ctr388_ModuleContent .hcMvcView .hc-cart .form-inline .form-group{
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 10px !important;
}

/* ===== GOMBOK ALAP ===== */
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart .btn,
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart input[type="submit"]:not(.hc-delete),
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart .hc-action-keepshopping .btn,
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart button{
  min-height: 42px !important;
  padding: 8px 16px !important;
  border-radius: 999px !important;
  border: 1px solid #dccbbd !important;
  background: #f2e7dd !important;
  color: #6a4a45 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  box-shadow: none !important;
  transition: background-color .2s ease, color .2s ease, border-color .2s ease, transform .15s ease !important;
}

#dnn_ctr388_ModuleContent .hcMvcView .hc-cart .btn:hover,
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart input[type="submit"]:not(.hc-delete):hover,
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart button:hover{
  background: #eadccf !important;
  color: #5a3d38 !important;
  border-color: #cfb9a7 !important;
  transform: translateY(-1px);
}

/* fő gomb */
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart .btn-primary{
  background: #d88d45 !important;
  color: #fff !important;
  border-color: #d88d45 !important;
}

#dnn_ctr388_ModuleContent .hcMvcView .hc-cart .btn-primary:hover{
  background: #c77d36 !important;
  border-color: #c77d36 !important;
  color: #fff !important;
}

/* tovább vásárolok */
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart .hc-action-keepshopping .btn{
  margin-top:14px;
  min-height:48px;
}

#dnn_ctr388_ModuleContent .hcMvcView .hc-cart .hc-action-keepshopping .btn:hover{
  background: #efe5dc !important;
  color: #5e433d !important;
}

/* szállítási díj */
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart .hc-popup.btn{
  background: #fffaf6 !important;
  color: #7a5a4f !important;
  border: 1px solid #dccbbd !important;
}

#dnn_ctr388_ModuleContent .hcMvcView .hc-cart .hc-popup.btn:hover{
  background: #f6eee7 !important;
  color: #5f453f !important;
}

/* ===== TÖRLÉS GOMB ===== */
/* a valódi elem: input.hc-delete */
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart input.hc-delete{
  width: 38px !important;
  height: 38px !important;
  min-height: 38px !important;
  padding: 0 !important;
  border-radius: 50% !important;
  border: 1px solid #dbc9ba !important;
  background: #efe5dc !important;
  color: transparent !important;
  font-size: 0 !important;
  line-height: 0 !important;
  box-shadow: none !important;
  position: relative !important;
  cursor: pointer !important;
}

#dnn_ctr388_ModuleContent .hcMvcView .hc-cart input.hc-delete::after{
  content: "×";
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #9b6b57;
  font-size: 22px;
  font-weight: 700;
  line-height: 1;
}

#dnn_ctr388_ModuleContent .hcMvcView .hc-cart input.hc-delete:hover{
  background: #e7d8cb !important;
}

/* ha az input pseudoelem nem jelenne meg bizonyos böngészőben,
   legalább ne legyen óriási gomb */
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart td:last-child{
  text-align: center !important;
  vertical-align: middle !important;
}

/* ===== ALSÓ BLOKKOK ===== */
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart .hc-coupon-section h6,
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart .hc-totals-section th{
  color: #4b332f !important;
}

#dnn_ctr388_ModuleContent .hcMvcView .hc-cart .hc-coupon-section input.form-control{
  width: 82px !important;
}

#dnn_ctr388_ModuleContent .hcMvcView .hc-cart .hc-totals-section table{
  width: 100% !important;
}

#dnn_ctr388_ModuleContent .hcMvcView .hc-cart .hc-totals-section td{
  color: #6a4a45 !important;
  white-space: nowrap !important;
}

/* akciógombok sora */
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart .hc-cart-actions .dnnActions{
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

#dnn_ctr388_ModuleContent .hcMvcView .hc-cart .hc-cart-actions .dnnActions li{
  margin: 0 !important;
}



/* ===== TÖRLÉS GOMB (MODERN KUKA IKONNAL) ===== */
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart input.hc-delete {
  width: 38px !important;
  height: 38px !important;
  min-height: 38px !important;
  padding: 0 !important;
  border-radius: 50% !important;
  border: 1px solid #dbc9ba !important;
  background-color: #efe5dc !important;
  
  /* Eredeti felirat elrejtése */
  color: transparent !important;
  font-size: 0 !important;
  line-height: 0 !important;
  text-indent: -9999px !important;

  /* SVG Kuka ikon beillesztése */
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%239b6b57' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='3 6 5 6 21 6'%3E%3C/polyline%3E%3Cpath d='M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2'%3E%3C/path%3E%3Cline x1='10' y1='11' x2='10' y2='17'%3E%3C/line%3E%3Cline x1='14' y1='11' x2='14' y2='17'%3E%3C/line%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  box-shadow: none !important;
}

#dnn_ctr388_ModuleContent .hcMvcView .hc-cart input.hc-delete:hover {
  background-color: #e7d8cb !important;
  border-color: #c9b4a2 !important;
  transform: scale(1.1); /* Finom nagyítás hoverre */

  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%239b6b57' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='3 6 5 6 21 6'%3E%3C/polyline%3E%3Cpath d='M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2'%3E%3C/path%3E%3Cline x1='10' y1='11' x2='10' y2='17'%3E%3C/line%3E%3Cline x1='14' y1='11' x2='14' y2='17'%3E%3C/line%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
}

/* Az utolsó oszlop (törlés) cellájának finomhangolása */
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart td:last-child {
  text-align: center !important;
  vertical-align: middle !important;
  width: 60px !important; /* Biztosítunk neki elég helyet */
}


/* ===== TERMÉK KÁRTYA FOOTER FIX ===== */

.hc-product-card .panel-footer {
  display: flex !important;
  flex-direction: column !important;
  align-items: center;
  gap: 8px;
  padding: 12px !important;
}

/* ár külön sor */
.hc-product-card .hc-price {
  display: block;
  width: 100%;
  text-align: center;
  font-size: 16px;
}

/* gomb mindig alatta */
.hc-product-card a.add-to-cart-product {
  width: 100%;
  text-align: center;
  margin-top: 5px;
}


/* ===== KÁRTYA STABILIZÁLÁS ===== */

.hc-product-card {
  height: 420px; /* fix magasság */
}

/* panel teljes kitöltés */
.hc-product-card .panel {
  height: 100%;
  display: flex;
  flex-direction: column;
}

/* kép rész fix */
.hc-product-card .panel-body {
  height: 200px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px;
}

/* kép */
.hc-product-card .panel-body img {
  max-height: 100%;
  max-width: 100%;
  object-fit: contain;
}

/* cím fix magasság */
.hc-product-card .panel-heading {
  min-height: 60px;
  display: flex;
  align-items: center;
}

/* footer mindig alul */
.hc-product-card .panel-footer {
  margin-top: auto;
}

/* ===== SZŰRŐ ALSÓ TÁVOLSÁG ===== */

.hc-price-range,
.hc-filter-price {
  margin-bottom: 20px; /* alap térköz */
}

/* ha még nagyobb kell */
#dnn_P2_25_1 > * {
  margin-bottom: 18px;
}

/* utolsó elem ne tolja túl */
#dnn_P2_25_1 > *:last-child {
  margin-bottom: 0;
}

/* ===== HOTCAKES SZŰRŐ – ALSÓ TÁVOLSÁG FIX ===== */

/* teljes szűrő modul */
#dnn_P2_25_1 .DnnModule {
  margin-bottom: 30px !important;
}

/* konkrét Hotcakes filter blokk */
#dnn_P2_25_1 .hc-filter,
#dnn_P2_25_1 .hc-price-range,
#dnn_P2_25_1 .hc-filter-price {
  margin-bottom: 25px !important;
  padding-bottom: 10px;
}

/* az utána jövő szöveg ne tapadjon rá */
#dnn_P2_25_1 .DnnModuleContent > * {
  margin-top: 10px;
}

#dnn_P2_25_1 .DnnModule {
  margin-bottom: 40px !important;
}




/*=== hírlevél blokk ===*/

.hc-news-wrap{
  max-width:1280px;
  margin:70px auto;
  padding:40px;
  background:#f7f1eb;
  border-radius:28px;
  display:grid;
  grid-template-columns:1.1fr 0.9fr;
  gap:40px;
  align-items:start;
}

.hc-news-badge{
  display:inline-block;
  padding:10px 18px;
  border-radius:999px;
  background:#efe3d1;
  color:#c98f46;
  font-size:14px;
  font-weight:700;
  margin-bottom:34px !important;
}

.hc-news-left h2{
  font-size:54px;
  line-height:1.05;
  margin-bottom:18px;
  color:#3b241d;
}

.hc-news-left p{
  font-size:20px;
  line-height:1.7;
  color:#5a4a43;
  margin-bottom:25px;
  max-width:580px;
}

.hc-news-frame{
  border-radius:20px;
  overflow:hidden;
}

.hc-news-frame iframe{
  width:100% !important;
  height:700px !important;
  border:none !important;
  display:block !important;
}

.hc-news-right{
  overflow:hidden;
  border-radius:24px;
}

.hc-news-right img{
  width:100% !important;
  height:700px !important;
  display:block !important;
  border-radius:24px !important;
  margin-top: 70px;
}

@media(max-width:950px){
  .hc-news-wrap{
    grid-template-columns:1fr;
  }

  .hc-news-frame iframe{
    height:620px !important;
  }
}


/* =========================================================
   TERMÉKKÁRTYA ÉS LAYOUT STABILIZÁLÁS (LAPTOP vs MOBIL)
   ========================================================= */

/* 1. ASZTALI NÉZET (Laptop): Soros elrendezés */
.hc-product-card-container .hc-category{
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 24px !important;
    justify-content: flex-start !important;
    width: 100% !important;
}

.hc-product-card .hc-category{
    /* Laptopon: 3 kártya egy sorban, de max 400px szélesek */
    flex: 1 1 300px !important;
    max-width: 400px !important;
    height: auto !important;
    min-height: 440px !important; /* Egységes magasság a kártyáknak */
    display: flex !important;
    flex-direction: column !important;
    margin-bottom: 20px !important;
}

/* Kártya belső felépítésének fixálása */
.hc-product-card .panel .hc-category{
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    margin: 0 !important;
}

.hc-product-card .panel-heading .hc-category{
    min-height: 65px !important; /* Elég hely a hosszú termékneveknek */
    display: flex !important;
    align-items: center !important;
}

.hc-product-card .panel-body .hc-category{
    height: 220px !important; /* Fix kép magasság a laptopos sorba rendezéshez */
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.hc-product-card .hc-category .panel-body img {
    max-height: 100% !important;
    max-width: 100% !important;
    object-fit: contain !important;
}

.hc-product-card .hc-category .panel-footer {
    margin-top: auto !important; /* A gombokat a kártya aljára tolja */
}



/* =========================================================
   LOGIN ÉS REGISZTRÁCIÓ GOMBOK + RESZPONZÍV FELÜLET
   ========================================================= */

/* 1. Gombok színezése (Barnás tónusok) */
.hcMvcView .btn-primary, 
.hc-login button, 
.hc-register button,
input[type="submit"].btn-primary {
    background-color: var(--indigo) !important; /* Mélybarna */
    border-color: var(--indigo) !important;
    color: #ffffff !important;
    padding: 12px 24px !important;
    border-radius: 12px !important;
    font-weight: 700 !important;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    transition: all 0.3s ease !important;
}

/* Hover állapot: világosabb barna (Almond) */
.hcMvcView .btn-primary:hover, 
.hc-login button:hover, 
.hc-register button:hover {
    background-color: var(--almond) !important;
    border-color: var(--almond) !important;
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}

/* 2. Felület reszponzivitása */
.hc-login, .hc-register {
    max-width: 500px;
    margin: 40px auto !important;
    background: #ffffff;
    padding: 30px !important;
    border-radius: var(--radius);
    box-shadow: var(--shadow);
}

/* Form elemek (input mezők) igazítása */
.hcMvcView .control-group input[type="text"],
.hcMvcView .control-group input[type="password"],
.hcMvcView .control-group input[type="email"] {
    width: 100% !important;
    height: 45px !important;
    border-radius: 10px !important;
    border: 1px solid #ddd !important;
    padding: 10px 15px !important;
    box-sizing: border-box !important;
}

/* 3. MOBIL NÉZET (991px alatt) */
@media (max-width: 991px) {
    .hc-login, .hc-register {
        width: 90% !important; /* Maradjon margó a telefon szélén */
        padding: 20px !important;
        margin-top: 20px !important;
    }

    /* Gombok teljes szélességűek mobilon a könnyebb kattintásért */
    .hcMvcView .btn-primary, 
    .hc-login button, 
    .hc-register button {
        width: 100% !important;
        margin-bottom: 10px;
    }

    /* Az egymás melletti elemek (pl. "Emlékezz rám" checkbox) tördelése */
    .hcMvcView .controls {
        margin-left: 0 !important;
    }
}

/* ===== BEJELENTKEZÉS CÍMKE (KOSÁR STÍLUS) ===== */

.login-header-box {
    /* A kosár fődobozának színe és stílusa alapján */
    background: #f0ebe7 !important; 
    padding: 20px 30px !important;
    border-radius: 20px !important; /* Mint a kosár felső kerekítése */
    display: inline-block;
    margin-bottom: 25px;
    width: auto;
}

.login-header-box h1 {
    /* A kosár fejléc betűstílusa és színe */
    font-family: var(--font-heading), serif !important;
    font-weight: 700 !important;
    font-size: 46px !important; /* Megegyezik a kosár címével */
    line-height: 1.08 !important;
    color: #432b29 !important; /* A kosárnál használt mélybarna */
    margin: 0 !important;
    padding: 0 !important;
    letter-spacing: -0.5px;
}

/* Opcionális: a szöveg alatti kis almond csík, ha még egyedibbé tennéd */
.login-header-box::after {
    content: "";
    display: block;
    width: 100%;
    height: 4px;
    background: var(--almond);
    border-radius: 2px;
    margin-top: 10px;
}


/* ===== RESZPONZÍV REGISZTRÁCIÓ ÉS JELSZÓ VISSZAÁLLÍTÁS GOMBOK ===== */

.hcMvcView .btn-primary, 
.hc-login button, 
.hc-register button,
input[type="submit"].btn-primary {
    /* Szélesség beállítása: mobilon 100%, de asztalin ne legyen óriási */
    display: inline-block !important;
    width: 100% !important; /* Alapértelmezetten kitölti a helyet (mobil) */
    max-width: 320px !important; /* De nem engedjük 320px-nél szélesebbre */
    
    /* Rugalmas szövegkezelés */
    white-space: normal !important; /* Engedi a szöveget több sorba törni, ha nem fér ki */
    word-wrap: break-word !important;
    
    /* Meglévő stílusod megtartása */
    padding: 12px 20px !important;
    height: auto !important; /* Magasság alkalmazkodik a szöveghez */
    min-height: 48px !important;
    
    text-align: center !important;
    vertical-align: middle !important;
}


/* ===== HOTCAKES REGISZTRÁCIÓ ÉS JELSZÓ GOMBOK FIX ===== */

/* A konkrét Hotcakes gombok és a beküldő gomb célzása */
.hc-register .btn-primary, 
.hc-forgot-password .btn-primary,
.hcMvcView input[type="submit"] {
    display: block !important;
    width: 100% !important; /* Mobilon kitölti a rendelkezésre álló helyet */
    max-width: 400px !important; /* Asztali gépen nem engedjük túl szélesre */
    
    /* Reszponzív szövegkezelés */
    white-space: normal !important; /* Hosszú feliratnál (pl. Jelszó visszaállítása) engedi a tördelést */
    word-wrap: break-word !important;
    height: auto !important; /* A magasság követi a több soros szöveget */
    min-height: 48px !important;
    
    /* Igazítás */
    margin: 15px 0 !important; /* Távolság a többi elemtől */
    padding: 12px 20px !important;
    text-align: center !important;
}

/* A Hotcakes beviteli mezők (inputok) is legyenek reszponzívak */
.hc-register input[type="text"],
.hc-register input[type="password"],
.hc-forgot-password input[type="text"] {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

/* Elrendezési korrekció: Hotcakes néha fix margókat használ balra */
.hcMvcView .controls, 
.hcMvcView .control-group {
    margin-left: 0 !important;
    padding-left: 0 !important;
}


/* ===== VISSZA GOMB STÍLUS ===== */

.back-button-container {
    margin: 20px 0;
    display: block;
}

.btn-back {
    display: inline-flex;
    align-items: center;
    padding: 10px 20px;
    background-color: transparent;
    color: var(--indigo) !important; /* A sötétbarna színed */
    font-family: var(--font-body);
    font-weight: 600;
    text-decoration: none !important;
    border: 2px solid var(--indigo);
    border-radius: var(--radius); /* 18px a fájlod alapján */
    transition: all 0.3s ease;
    cursor: pointer;
}

.btn-back .arrow {
    margin-right: 8px;
    font-size: 1.2em;
    transition: transform 0.3s ease;
}

.btn-back:hover {
    background-color: var(--indigo);
    color: #ffffff !important;
    transform: translateX(-5px); /* Egy kis mozgás balra */
}

.btn-back:hover .arrow {
    transform: translateX(-3px);
}


.custom-search-container {
    max-width: 500px;
    margin: 20px auto;
}

.custom-search-container form {
    margin-top:20px;
    display: flex;
    gap: 10px;
}

.my-search-input {
    flex: 1;
    padding: 12px 20px;
    border-radius: var(--radius); /* 18px */
    border: 2px solid #eee;
    font-family: var(--font-body); /* Mulish */
    box-shadow: var(--shadow);
    outline: none;
    transition: border-color 0.3s;
}

.my-search-input:focus {
    border-color: var(--almond); /* Narancssárga keret fókuszkor */
}

.my-search-btn {
    background-color: var(--almond); /* Narancs gomb */
    color: white;
    border: none;
    padding: 10px 25px;
    border-radius: var(--radius);
    font-family: var(--font-heading); /* Ovo */
    font-weight: bold;
    cursor: pointer;
    transition: transform 0.2s, background-color 0.2s;
}

.my-search-btn:hover {
    background-color: var(--indigo); /* Barna szín hovernél */
    transform: scale(1.05); /* A korábban kért "kiugró" effekt */
}



/* ===== HOTCAKES PRODUCT VIEWER – EGYSÉGES DOBOZ MÉRET ===== */

.hc-productviewer .hc-product,
.hc-productviewer .hc-product-card,
.hc-productviewer .panel{
  height:420px !important;
}

.hc-productviewer .panel{
  display:flex !important;
  flex-direction:column !important;

  border:none !important;
  border-radius:24px !important;
  overflow:hidden !important;

  background:#fff !important;
  box-shadow:0 12px 28px rgba(0,0,0,.08) !important;
}

/* kép */
.hc-productviewer .panel-body{
  height:220px !important;

  display:flex !important;
  align-items:center !important;
  justify-content:center !important;

  padding:18px !important;
}

.hc-productviewer .panel-body img{
  max-width:100% !important;
  max-height:180px !important;
  object-fit:contain !important;
}

/* cím */
.hc-productviewer .panel-heading{
  min-height:70px !important;
  padding:16px 20px !important;
}

/* footer */
.hc-productviewer .panel-footer{
  margin-top:auto !important;
}

/* ===== KISKUKTA FOOTER BLOKKOK ===== */

.kk-footer-block {
  color: #ffffff !important;
  font-family: Inter, Arial, sans-serif;
  padding: 30px 20px;
  max-width: 280px;
  margin: 0 auto;
  box-sizing: border-box;
  text-align: left;
}

.kk-footer-block h2,
.kk-footer-block h3,
.kk-footer-block p,
.kk-footer-block span,
.kk-footer-block strong {
  color: inherit;
}

.kk-footer-block a {
  color: #f3e8df !important;
  text-decoration: none !important;
}

.kk-footer-block a:hover {
  color: #e6b85c !important;
}

.kk-footer-block iframe {
  max-width: 100%;
  display: block;
}

@media (max-width: 768px) {
  .kk-footer-block {
    max-width: 100%;
    text-align: center;
  }

  .kk-footer-block div[style*="height:4px"] {
    margin-left: auto !important;
    margin-right: auto !important;
  }
}
/* ===== FOOTER TELJES SZÉLESSÉGRE SZÉTHÚZVA ===== */

#dnn_footer_25_1,
#dnn_footer_25_2,
#dnn_footer_25_3,
#dnn_footer_25_4 {
  float: left !important;
  box-sizing: border-box !important;
  padding-left: 30px !important;
  padding-right: 30px !important;
}

/* Oszloparányok nagy képernyőn */
@media (min-width: 992px) {
  #dnn_footer_25_1 {
    width: 25% !important;
  }

  #dnn_footer_25_2 {
    width: 25% !important;
  }

  #dnn_footer_25_3 {
    width: 20% !important;
  }

  #dnn_footer_25_4 {
    width: 30% !important;
  }
}

/* A blokkok ne legyenek túl keskenyek */
.kk-footer-block {
  max-width: none !important;
  width: 100% !important;
  margin: 0 auto !important;
  padding: 30px 10px !important;
  box-sizing: border-box !important;
}

/* Első blokk kicsit jobbra, mert szerkesztő nézetben rámegy a DNN oldalsáv */
#dnn_footer_25_1 .kk-footer-block {
  padding-left: 70px !important;
}

/* Térképes rész nagyobb */
#dnn_footer_25_4 .kk-footer-block {
  max-width: 420px !important;
}

#dnn_footer_25_4 iframe {
  width: 100% !important;
  height: 230px !important;
}
/* =====================================================
   DNN BEJELENTKEZÉS + REGISZTRÁCIÓ FORMÁZÁS
   ===================================================== */

body #dnn_HeaderPane {
  
  margin-right: auto !important;
  padding: 40px 20px 0px 20px !important;
  float: none !important;
  box-sizing: border-box !important;
}

body .dnnLogin {
  max-width: 520px !important;
  margin: 45px 0 0 0 !important;
  padding: 0 !important;
}

/* Form sorok */
body .dnnLogin .dnnFormItem {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin-bottom: 11px !important;
    padding-left: 10px;
}

/* Feliratok */
body .dnnLogin .dnnFormLabel,
body .dnnLogin label {
  width: 135px !important;
  min-width: 135px !important;
  text-align: right !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #3b2723 !important;
}

/* Input mezők */
body .dnnLogin input[type="text"],
body .dnnLogin input[type="password"],
body #dnn_ctr419_Login_Login_DNN_txtUsername,
body #dnn_ctr419_Login_Login_DNN_txtPassword {
  width: 280px !important;
  height: 40px !important;
  padding: 7px 12px !important;
  box-sizing: border-box !important;
  border: 1px solid #d8cfc7 !important;
  border-radius: 9px !important;
  background: #ffffff !important;
  color: #3b2723 !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  box-shadow: inset 0 1px 3px rgba(0,0,0,.05) !important;
  outline: none !important;
  transition: all 0.2s ease !important;
}

body .dnnLogin input[type="text"]:focus,
body .dnnLogin input[type="password"]:focus,
body #dnn_ctr419_Login_Login_DNN_txtUsername:focus,
body #dnn_ctr419_Login_Login_DNN_txtPassword:focus {
  border-color: #d28a3c !important;
  box-shadow: 0 0 0 3px rgba(210,138,60,.18), inset 0 1px 3px rgba(0,0,0,.05) !important;
}

/* Emlékezz rám sor */
body .dnnLogin .dnnFormItem:has(.dnnLoginRememberMe) {
  display: block !important;
  margin-left: 151px !important;
  padding-left: 0 !important;
  width: auto !important;
}

body .dnnLogin .dnnFormItem:has(.dnnLoginRememberMe) .dnnFormLabel {
  display: none !important;
}

body .dnnLogin .dnnLoginRememberMe {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 0 !important;
  width: auto !important;
}

body .dnnLogin .dnnLoginRememberMe input[type="checkbox"] {
  position: static !important;
  margin: 0 !important;
  width: 17px !important;
  height: 17px !important;
}

body .dnnLogin .dnnLoginRememberMe label {
  width: auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
  white-space: nowrap !important;
}

/* Bejelentkezés + Mégse gombsor */
body .dnnLogin .dnnActions,
body #dnn_ctr418_Register_actionsRow {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  flex-wrap: nowrap !important;
  margin-left: 151px !important;
  margin-top: 16px !important;
  padding: 0 !important;
  list-style: none !important;
}

body .dnnLogin .dnnActions li,
body #dnn_ctr418_Register_actionsRow li {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  display: inline-flex !important;
}

/* Alsó Regisztráció + Jelszó visszaállítása sor */
body .dnnLogin .dnnFormItem:has(.dnnLoginActions) {
  display: block !important;
  margin-left: 151px !important;
  margin-top: 16px !important;
  padding-left: 0 !important;
  width: auto !important;
}

body .dnnLogin .dnnFormItem:has(.dnnLoginActions) .dnnFormLabel {
  display: none !important;
}

body .dnnLogin .dnnFormItem:has(.dnnLoginActions) .dnnLoginActions,
body .dnnLogin .dnnFormItem:has(.dnnLoginActions) ul.dnnActions {
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  gap: 12px !important;
  flex-wrap: nowrap !important;
  justify-content: flex-start !important;
  width: auto !important;
}

/* Közös gombdesign */
body .dnnLogin .dnnPrimaryAction,
body .dnnLogin .dnnSecondaryAction,
body #dnn_ctr418_Register_registerButton,
body #dnn_ctr418_Register_cancelLink,
body #dnn_ctr419_Login_Login_DNN_cmdLogin,
body #dnn_ctr419_Login_Login_DNN_cancelLink {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 42px !important;
  padding: 0 22px !important;
  border-radius: 10px !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  cursor: pointer !important;
  box-sizing: border-box !important;
  transition: all 0.2s ease !important;
}

/* Elsődleges gomb */
body .dnnLogin .dnnPrimaryAction,
body #dnn_ctr418_Register_registerButton,
body #dnn_ctr419_Login_Login_DNN_cmdLogin {
  background: linear-gradient(180deg, #d28a3c 0%, #bd6f26 100%) !important;
  color: #ffffff !important;
  border: 1px solid #b96522 !important;
  box-shadow: 0 8px 18px rgba(79,45,27,.20) !important;
}

/* Másodlagos gombok */
body .dnnLogin .dnnSecondaryAction,
body #dnn_ctr418_Register_cancelLink,
body #dnn_ctr419_Login_Login_DNN_cancelLink {
  background: #f7f1eb !important;
  color: #3b2723 !important;
  border: 1px solid #d5c4b6 !important;
  box-shadow: 0 8px 18px rgba(55,35,30,.10) !important;
}

/* Alsó két login gomb kisebb */
body .dnnLogin .dnnLoginActions .dnnSecondaryAction {
  min-height: 38px !important;
  padding: 0 10px !important;
  font-size: 13px !important;
  white-space: nowrap !important;
  margin-left: 19px;
}

/* Hover */
body .dnnLogin .dnnPrimaryAction:hover,
body #dnn_ctr418_Register_registerButton:hover,
body #dnn_ctr419_Login_Login_DNN_cmdLogin:hover {
  background: linear-gradient(180deg, #df9a4a 0%, #c9792d 100%) !important;
  color: #ffffff !important;
  transform: translateY(-1px) !important;
}

body .dnnLogin .dnnSecondaryAction:hover,
body #dnn_ctr418_Register_cancelLink:hover,
body #dnn_ctr419_Login_Login_DNN_cancelLink:hover {
  background: #fffaf5 !important;
  color: #3b2723 !important;
  border-color: #c8aa95 !important;
  transform: translateY(-1px) !important;
}



/* ===== REGISZTRÁCIÓ INPUT MEZŐK ===== */

body #dnn_ctr418_Register_userForm input[type="text"],
body #dnn_ctr418_Register_userForm input[type="password"],
body #dnn_ctr418_Register_userForm input[type="email"],
body #dnn_ctr418_Register_userForm select,
body #dnn_ctr418_Register_userForm textarea {
  width: 280px !important;
  height: 40px !important;
  padding: 7px 12px !important;
  box-sizing: border-box !important;

  border: 1px solid #d8cfc7 !important;
  border-radius: 9px !important;

  background: #ffffff !important;
  color: #3b2723 !important;

  font-size: 14px !important;
  font-weight: 500 !important;

  box-shadow: inset 0 1px 3px rgba(0,0,0,.05) !important;
  outline: none !important;
  transition: all 0.2s ease !important;
}

body #dnn_ctr418_Register_userForm input[type="text"]:focus,
body #dnn_ctr418_Register_userForm input[type="password"]:focus,
body #dnn_ctr418_Register_userForm input[type="email"]:focus,
body #dnn_ctr418_Register_userForm select:focus,
body #dnn_ctr418_Register_userForm textarea:focus {
  border-color: #d28a3c !important;
  box-shadow: 0 0 0 3px rgba(210,138,60,.18), inset 0 1px 3px rgba(0,0,0,.05) !important;
}

/*kosár oldal lábléc elrejtés*/

body:has(form[action*="/Kosar_oldal"]) footer[role="contentinfo"],
body:has(form[action*="/Kosar_oldal"]) .footer-above,
body:has(form[action*="/Kosar_oldal"]) .footer {
  display: none !important;
}
/* ===== BREADCRUMB / ÖSSZES TERMÉK GOMB ===== */

.breadcrumb,
#hc-breadcrumb,
.hc-breadcrumb {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin: 25px 0 35px !important;
}

/* maga a doboz */
.breadcrumb > li:first-child a,
.hc-breadcrumb a:first-child {
    display: inline-flex !important;
    align-items: center !important;

    padding: 12px 22px !important;

    background: #ffffff !important;
    color: var(--indigo) !important;

    border-radius: 999px !important;
    text-decoration: none !important;

    font-family: var(--font-body) !important;
    font-weight: 700 !important;
    font-size: 15px !important;

    box-shadow: 0 8px 20px rgba(0,0,0,.06) !important;

    transition: all .25s ease !important;
}

/* hover */
.breadcrumb > li:first-child a:hover,
.hc-breadcrumb a:first-child:hover {
    background: var(--almond) !important;
    color: #ffffff !important;

    transform: translateY(-2px);
    box-shadow: 0 12px 24px rgba(0,0,0,.10) !important;
}

/* elválasztó */
.breadcrumb > li + li:before {
    color: #b79f96 !important;
    padding: 0 10px !important;
}

/* aktuális oldal */
.breadcrumb > .active,
.hc-breadcrumb .active {
    color: #7a6460 !important;
    font-weight: 600 !important;
}

/* mobil */
@media (max-width:768px){

    .breadcrumb > li:first-child a,
    .hc-breadcrumb a:first-child{
        width: 100%;
        justify-content: center;
    }

    .breadcrumb{
        display:flex;
        flex-wrap:wrap;
        gap:10px;
    }
}
/* ===== KATTINTHATÓ LOGÓ ===== */

header[role="banner"]{
    position:relative !important;
}

/* kattintható terület */
header[role="banner"]::after{
    content:"";
    position:absolute;
    left:24px;
    top:50%;
    transform:translateY(-50%);

    width:130px;
    height:46px;

    z-index:10002;
    cursor:pointer;
}

/* mobil */
@media (max-width:768px){
    header[role="banner"]::after{
        left:50%;
        top:15px;
        transform:translateX(-50%);
        width:100px;
        height:38px;
    }
}



/* =========================================================
   HOTCAKES – RELATED ITEMS
   ========================================================= */

.hc-related-items,
.related.items,
.related-products {
  margin-top: 70px;
}

/* cím */
.hc-related-items h2,
.related.items h2,
.related-products h2{
  font-size: 54px;
  line-height: 1.08;
  margin-bottom: 34px;
  color: var(--indigo);
  font-family: var(--font-heading);
  font-weight: 700;
  letter-spacing: -0.03em;
}

/* grid */
.hc-related-items .row,
.related.items .row,
.related-products .row{
  display:flex;
  flex-wrap:wrap;
}

/* =========================================================
   KÁRTYA
   ========================================================= */

.hc-related-items .hc-product-card,
.related.items .hc-product-card,
.related-products .hc-product-card{
  flex:1 1 280px;
  max-width:320px;
  min-width:260px;

  display:flex;
  flex-direction:column;
  height:440px;
}

/* panel */
.hc-related-items .hc-product-card .panel,
.related.items .hc-product-card .panel,
.related-products .hc-product-card .panel{
  height:100%;
  display:flex;
  flex-direction:column;

  border:none !important;
  border-radius:28px !important;
  overflow:hidden;
  background:#ffffff;
  box-shadow:var(--shadow);
  transition:
    transform .25s ease,
    box-shadow .25s ease;
}

/* hover */
.hc-related-items .hc-product-card .panel:hover,
.related.items .hc-product-card .panel:hover,
.related-products .hc-product-card .panel:hover{
  transform:translateY(-8px);
  box-shadow:0 18px 34px rgba(0,0,0,.12);
}

/* =========================================================
   KÉP
   ========================================================= */

.hc-related-items .panel-body,
.related.items .panel-body,
.related-products .panel-body{
  height:240px;
  padding:24px;
  background:#ffffff;

  display:flex;
  align-items:center;
  justify-content:center;
}

.hc-related-items .panel-body img,
.related.items .panel-body img,
.related-products .panel-body img{
  width:100%;
  height:100%;
  object-fit:contain;
}

/* =========================================================
   CÍM
   ========================================================= */

.hc-related-items .panel-heading,
.related.items .panel-heading,
.related-products .panel-heading{
  min-height:88px;
  padding:18px 22px 8px !important;
  background:#ffffff !important;
  border:none !important;
}

.hc-related-items .panel-heading h2,
.related.items .panel-heading h2,
.related-products .panel-heading h2{
  margin:0;
  font-size:24px !important;
  line-height:1.25;
  font-family:var(--font-heading);
  color:var(--indigo) !important;
}

.hc-related-items .panel-heading h2 a,
.related.items .panel-heading h2 a,
.related-products .panel-heading h2 a{
  color:var(--indigo) !important;
  text-decoration:none !important;
}

/* =========================================================
   FOOTER
   ========================================================= */

.hc-related-items .panel-footer,
.related.items .panel-footer,
.related-products .panel-footer{
  margin-top:auto;
  padding:22px !important;

  background:#ffffff !important;
  border:none !important;

  display:flex;
  flex-direction:column;
  gap:14px;
}

/* ár */
.hc-related-items .hc-price,
.related.items .hc-price,
.related-products .hc-price{
  font-size:30px;
  font-weight:700;
  color:var(--almond) !important;
  text-align:center;
}

/* gomb */
.hc-related-items .add-to-cart-product,
.related.items .add-to-cart-product,
.related-products .add-to-cart-product{
  width:100%;
  padding:14px 18px;

  border-radius:16px;
  background:var(--almond);
  color:#ffffff !important;

  text-align:center;
  text-decoration:none !important;

  font-weight:700;
  font-size:15px;
  letter-spacing:.02em;

  transition:
    transform .2s ease,
    background- .2s ease;
}

/* hover */
.hc-related-items .add-to-cart-product:hover,
.related.items .add-to-cart-product:hover,
.related-products .add-to-cart-product:hover{
  background:#c97a36;
  transform:translateY(-2px);
}

/* =========================================================
   MOBIL
   ========================================================= */

@media (max-width:768px){

  .hc-related-items h2,
  .related.items h2,
  .related-products h2{
    font-size:38px;
  }

  .hc-related-items .hc-product-card,
  .related.items .hc-product-card,
  .related-products .hc-product-card{
    max-width:100%;
    min-width:100%;
    height:auto;
  }

  .hc-related-items .panel-body,
  .related.items .panel-body,
  .related-products .panel-body{
    height:220px;
  }
}



div.row-fluid.hc-product-cards {
    padding-top: 100px !important;
}



/* =========================================================
   TELJES RESZPONZÍV JAVÍTÁSOK
   ========================================================= */

/* 2. FŐOLDALI HTML MODULOK (Szöveg felül, Kép alul) */
@media (max-width: 768px) {
    /* Minden olyan táblázatos modul, ami a főoldali hero-hoz hasonlóan épül fel */
    #dnn_ctr403_HtmlModule_lblContent table,
    .miert-kiskukta-racs,
    .kinek-racs,
    .hc-news-wrap {
        display: flex !important;
        flex-direction: column !important; /* Egymás alá rendezés */
    }

    /* A táblázatos modulok (pl. Hero) sorrendjének megfordítása */
    #dnn_ctr403_HtmlModule_lblContent table tr {
        display: flex !important;
        flex-direction: column !important; /* Itt a szöveg alapból felül van a HTML sorrend miatt */
    }

    /* Ha a HTML-ben a kép lenne elöl, a column-reverse használatos: */
    .roww, 
    .flex-mobile-reverse {
        display: flex !important;
        flex-direction: column-reverse !important;
    }

    /* Biztosítjuk, hogy a szöveges rész és a kép is 100% széles legyen */
    #dnn_ctr403_HtmlModule_lblContent table td,
    .miert-kiskukta-szoveg,
    .miert-kiskukta-kep,
    .kinek-tartalom,
    .kinek-kep,
    .hc-news-left,
    .hc-news-right {
        width: 100% !important;
        max-width: 100% !important;
        padding: 20px !important;
        display: block !important;
    }

    /* Képek finomhangolása alulra kerülés után */
    #dnn_ctr403_HtmlModule_lblContent table td:last-child,
    .miert-kiskukta-kep,
    .kinek-kep,
    .hc-news-right {
        order: 2 !important; /* Explicitly alulra teszi */
        height: 300px !important; /* Fix magasság mobilon, hogy ne legyen túl hosszú */
        margin-top: 15px !important;
    }

    #dnn_ctr403_HtmlModule_lblContent table td:first-child,
    .miert-kiskukta-szoveg,
    .kinek-tartalom,
    .hc-news-left {
        order: 1 !important; /* Explicitly felülre teszi */
    }
}

/* Sikeres bejelentkezés doboz */
    .login-success-box {
        background: #f0ebe7;
        border: 2px solid var(--almond);
        border-radius: var(--radius);
        padding: 20px;
        margin: 20px 0;
        text-align: center;
        color: var(--indigo);
        box-shadow: var(--shadow);
        font-family: 'Mulish', sans-serif;
    }

    .login-success-box h3 {
        margin-top: 0;
        color: var(--almond);
        font-family: 'Ovo', serif;
    }



@media (min-width:1200px){
  #siteWrapper > .container{
    padding-left:48px !important;
    padding-right:48px !important;
  }
}

/*Miert Kiskukta*/

@media (max-width:1100px){
  .miert-kiskukta-racs{
    grid-template-columns:1fr;
  }

  .miert-kiskukta-kep{
    min-height:340px;
  }
}

@media (max-width:768px){
  .miert-kiskukta-blokk{
    margin:50px auto 35px;
  }

  .miert-kiskukta-szoveg h2{
    font-size:40px;
  }

  .miert-kiskukta-bevezeto{
    font-size:16px;
  }

  .miert-kiskukta-kartyak{
    grid-template-columns:1fr;
  }

  .miert-kiskukta-kisblokk h3{
    font-size:22px;
  }

  .miert-kiskukta-kisblokk p{
    font-size:16px;
  }

  .miert-kiskukta-kep{
    min-height:260px;
    border-radius:28px;
  }
}

/*Kinek blokk*/

@media (max-width:1100px){
  .kinek-racs{
    grid-template-columns:1fr;
  }

  .kinek-kep{
    min-height:360px;
  }

  .kinek-tartalom h2{
    font-size:46px;
  }
}

@media (max-width:768px){
  .kinek-blokk{
    margin:50px auto 65px;
  }

  .kinek-tartalom{
    padding:30px 24px;
    border-radius:26px;
  }

  .kinek-kep{
    min-height:260px;
    border-radius:26px;
  }

  .kinek-tartalom h2{
    font-size:36px;
  }

  .kinek-sor{
    font-size:16px;
    padding:14px 16px 14px 46px;
  }

  .kinek-sor::before{
    width:16px;
    height:16px;
    left:16px;
  }

  .kinek-zaro{
    font-size:20px;
    padding:16px 18px;
  }
}

@media (max-width: 991px){
  .cta-section-soft{
    margin: 70px auto 30px auto;
  }

  .cta-section-soft h2{
    font-size: 40px;
  }

  .cta-section-soft p{
    font-size: 18px;
  }
}

/* =========================================================
   MOBIL
   ========================================================= */

@media (max-width: 991px){

  #dnn_ctr403_HtmlModule_lblContent table tr{
    display:block;
    min-height:auto;
  }

  #dnn_ctr403_HtmlModule_lblContent table td{
    width:100%;
    display:block;
    padding:28px !important;
  }

  #dnn_ctr403_HtmlModule_lblContent table td:first-child p:first-child{
    font-size:34px;
    max-width:none;
  }

  #dnn_ctr403_HtmlModule_lblContent table td:first-child p:last-child{
    font-size:16px;
    max-width:none;
  }

  #dnn_ctr403_HtmlModule_lblContent table td:last-child{
    height:280px;
  }

  #dnn_ctr455_HtmlModule_lblContent h1{
    font-size:34px;
  }

  #dnn_P3_33_1 span a,
  #dnn_P3_33_2 span a,
  #dnn_P3_33_3 span a{
    font-size:24px !important;
  }
}

/* =========================================================
   RESPONSIVE DESIGN (TABLET & MOBILE)
   ========================================================= */

/* ===== TABLET NÉZET (1024px alatt) ===== */
@media (max-width: 1024px) {
    header[role="banner"] {
        padding-left: 160px !important; /* Kicsit kevesebb hely a logónak */
        padding-right: 20px !important;
    }
    
    header[role="banner"]::before {
        height: 40px !important; /* Logó mérete kicsit csökken */
        width: 110px !important;
    }
}

/* ===== MOBIL NÉZET (768px alatt) ===== */
@media (max-width: 768px) {
    /* 1. Header szerkezet átalakítása */
    header[role="banner"] {
        flex-direction: column !important; /* Logó és menü egymás alá */
        padding: 60px 20px 20px 20px !important; /* Hely a logónak felül */
        height: auto !important;
        min-height: 100px !important;
    }

    /* 2. Logó középre rendezése mobilon */
    header[role="banner"]::before {
        left: 50% !important;
        top: 15px !important;
        transform: translateX(-50%) !important; /* Vízszintes középre igazítás */
        height: 38px !important; /* Mobil H1 méretéhez igazodva */
        width: 100px !important;
    }

    /* 3. MENÜ CÍMEK EGYMÁS ALÁ RENDEZÉSE */
    .navbar-collapse {
        width: 100% !important;
        display: block !important; /* Flex helyett blokk az egymás alá kerülő címekhez */
    }

    .navbar-nav {
        flex-direction: column !important; /* Egymás alá rendezés */
        align-items: center !important;
        width: 100% !important;
        margin: 20px 0 0 0 !important;
        padding: 0 !important;
        background-color: var(--indigo);
    }

    .navbar-nav > li {
        width: 100% !important;
        text-align: center !important;
        border-bottom: 1px solid rgba(255,255,255,0.1) !important; /* Enyhe elválasztó vonal */
        background-color: var(--indigo);
    }

    .navbar-nav > li > a {
        padding: 15px 0 !important;
        display: block !important;
    }

    /* 4. Kosár táblázat mobil optimalizálása */
    #dnn_ctr388_ModuleContent .hcMvcView .hc-cart table.table {
        display: block !important;
        overflow-x: auto !important; /* Gördíthető táblázat, ha túl széles */
    }
    
    #dnn_ctr388_ModuleContent .hcMvcView .row-fluid.hc-cart {
        margin: 10px !important;
        padding: 20px 15px !important; /* Kisebb belső margók */
    }

    #dnn_ctr388_ModuleContent .hcMvcView .row-fluid.hc-cart > .col-xs-12 > .row-fluid.hc-cart-title:first-child h1 {
        font-size: 28px !important; /* Kisebb cím mobilon */
    }
}

/* Ez minden HTML modul belső tartalmát reszponzívvá teszi */
.DNN_HTML_Content, 
#dnn_ctr388_ModuleContent .hcMvcView {
    width: 100% !important;
    max-width: 1180px; /* A korábbi kosár szélességed */
    margin-left: auto;
    margin-right: auto;
    overflow-x: hidden; /* Megakadályozza a vízszintes görgetést */
}

/* Ha van benne fix szélességű elem (pl. kép vagy táblázat) */
#dnn_ctr388_ModuleContent img, 
#dnn_ctr388_ModuleContent table {
    max-width: 100% !important;
    height: auto !important;
}

/* ===== HÍRKÁRTYÁK EGYMÁS ALÁ RENDEZÉSE MOBILON ===== */
@media (max-width: 991px) {
    /* A paneleket tartalmazó sor kényszerítése függőleges elrendezésre */
    #mainContent-inner .row {
        display: flex !important;
        flex-direction: column !important;
        gap: 20px !important; /* Távolság a kártyák között */
    }

    /* Az egyes hírpanelek szélességének fixálása 100%-ra */
    #dnn_P3_33_1, 
    #dnn_P3_33_2, 
    #dnn_P3_33_3 {
        width: 100% !important;
        max-width: 100% !important;
        flex: none !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* A kártyák belső táblázatának és képének igazítása */
    #dnn_P3_33_1 .DNNContainer_noTitle,
    #dnn_P3_33_2 .DNNContainer_noTitle,
    #dnn_P3_33_3 .DNNContainer_noTitle {
        margin-bottom: 10px !important;
    }

    /* Mobilon a képek magasságát kicsit lejjebb vehetjük, hogy ne foglaljanak túl sok helyet */
    #dnn_P3_33_1 img:first-child,
    #dnn_P3_33_2 img:first-child,
    #dnn_P3_33_3 img:first-child {
        height: 200px !important;
    }
}

/* ===== MOBIL CÍM DOBOZ STABILIZÁLÁSA ===== */
@media (max-width: 768px) {
    /* Biztosítjuk, hogy a cím konténere mobilon is barna maradjon */
    #dnn_ctr388_ModuleContent .hcMvcView .row-fluid.hc-cart > .col-xs-12 > .row-fluid.hc-cart-title:first-child {
        background: #f0ebe7 !important; /* A barna/bézs háttér kényszerítése */
        display: block !important;     /* Megakadályozza az elcsúszást */
        padding: 20px !important;       /* Belső térköz mobilon */
        border-radius: 20px 20px 0 0 !important; /* Felső kerekítés megtartása */
        margin: -24px -34px 20px -34px !important; /* Kifeszítjük a szélekig, ha a padding eltolná */
        width: calc(100% + 68px) !important; /* Kompenzáljuk a fődoboz paddingját */
    }

    /* A cím és a leírás igazítása a barna sávon belül */
    #dnn_ctr388_ModuleContent .hcMvcView .row-fluid.hc-cart > .col-xs-12 > .row-fluid.hc-cart-title:first-child h1,
    #dnn_ctr388_ModuleContent .hcMvcView .row-fluid.hc-cart > .col-xs-12 > .row-fluid.hc-cart-title:first-child h6,
    .custom-cart-message {
        text-align: left !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
}

body footer .footer-above{
  background: var(--indigo) !important;
}

/* 2. MOBIL NÉZET (991px alatt): Oszlopos elrendezés */
@media (max-width: 991px) {
    /* A kétoszlopos layoutot (szűrő + tartalom) egymás alá rakjuk */
    #mainContent-inner .row.dnnpane {
        display: block !important;
    }

    /* Szűrő oszlop mobilon */
    #dnn_P2_25_1 {
        width: 100% !important;
        max-width: 100% !important;
        position: relative !important;
        top: 0 !important;
        margin-bottom: 40px !important; /* Távolság a szűrő és a termékek között */
    }

    /* Termék lista oszlop mobilon */
    #dnn_P2_75_2 {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    /* Konténer mobilon: kényszerített függőleges sorrend */
    .hc-product-card-container {
        display: block !important; 
    }

    /* Kártyák mobilon: Teljes szélességű oszlopos megjelenés */
    .hc-product-card {
        width: 100% !important;
        max-width: 100% !important;
        min-height: auto !important;
        margin-bottom: 30px !important; /* Hely a kártyák között */
    }

    .hc-product-card .panel-body {
        height: 250px !important; /* Mobilon kicsit nagyobb kép */
    }
}

/* 3. EXTRA MOBIL SIMÍTÁS (480px alatt) */
@media (max-width: 480px) {
    #siteWrapper > .container {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }
    
    .hc-product-card .panel-heading h2 a {
        font-size: 18px !important;
    }
}

/* Mobil nézet (767px alatt) */
@media (max-width: 767px) {
    /* A gombok alatti linkek (elfelejtett jelszó, regisztráció) elrendezése */
    .hcMvcView .hc-login .control-group, 
    .hcMvcView .hc-register .control-group {
        margin-bottom: 20px !important;
    }
    
    /* Hogy a gombok és a linkek ne érjenek össze */
    .hcMvcView .btn-primary {
        margin-bottom: 15px !important;
        font-size: 15px !important;
    }
}

/* Mobil finomítás */
@media (max-width: 768px) {
    .hc-register .btn-primary, 
    .hc-forgot-password .btn-primary {
        font-size: 15px !important; /* Kicsit kisebb betű, hogy kevesebbszer kelljen tördelni */
        max-width: 100% !important; /* Mobilon legyen tényleg faltól falig */
    }
}

/* Mobilon legyen teljes szélességű, ha szükséges */
@media (max-width: 768px) {
    .btn-back {
        width: 100%;
        justify-content: center;
        box-sizing: border-box;
    }
}


/* ===== MOBIL MENÜ BARNA STÍLUS (RESZPONZÍV) ===== */

@media (max-width: 991px) {
    /* 1. A lenyíló menü konténerének háttere */
    .navbar-collapse, 
    .navbar-nav, 
    .mobile-menu-container,
    .hc-mobile-nav {
        background-color: var(--indigo) !important;
        border: none !important;
        align-items: center !important; /* Konténeren belüli középre igazítás */
    }

    /* 2. A menüpontok (listaelemek) és linkek */
    .navbar-nav li, 
    .navbar-nav li a,
    .hc-mobile-nav li a {
        background-color: var(--indigo) !important;
        color: #ffffff !important; /* Fehér szöveg a barnán */
        font-family: var(--font-body);
        padding: 12px 20px !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important; /* Finom elválasztó vonal */
        text-align: left;
    }

    /* 3. Hover és Aktív állapot (kijelölés színe) */
    .navbar-nav li a:hover, 
    .navbar-nav li.active a,
    .hc-mobile-nav li a:active {
        background-color: var(--almond) !important; /* A narancsos barna kiemelés */
        color: #ffffff !important;
    }

    /* 4. A lenyíló gomb (Hamburger ikon) színe, ha még nem az */
    .navbar-toggle, 
    .menu-icon-trigger {
        background-color: var(--indigo) !important;
        border-color: var(--almond) !important;
    }
    
    /* Hamburger ikon vonalai legyenek fehérek */
    .navbar-toggle .icon-bar {
        background-color: #ffffff !important;
    }
}

/* ===== MOBIL MENÜ GOMBOK: LEKEREKÍTÉS, KÖZÉPRE IGAZÍTÁS ÉS ANIMÁCIÓ ===== */

@media (max-width: 991px) {
    
    .navbar-nav > li > a,
    .hc-mobile-nav li a {
        display: block !important;
        margin: 10px 20px !important; /* Térköz a gombok között */
        padding: 14px 20px !important;
        border-radius: var(--radius) !important; /* 18px lekerekítés */
        transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
        text-align: center !important; /* Szöveg középre igazítása a gombon belül */
        color: #ffffff !important;
        border-bottom: none !important;
    }

    /* NYOMÁS ÉS AKTÍV ÁLLAPOT (Kattintáskor vagy aktív oldalnál) */
    .navbar-nav > li > a:active,
    .navbar-nav > li > a:focus,
    .navbar-nav > li.active > a,
    .hc-mobile-nav li a:active,
    .hc-mobile-nav li.active a {
        background-color: #ffffff !important; /* Fehér háttér a kiugráshoz */
        color: var(--almond) !important; /* Narancssárga betűk */
        box-shadow: var(--shadow) !important; /* 0 10px 25px rgba(0,0,0,.08) */
        transform: scale(1.05) translateY(-2px) !important; /* Kiugró animáció */
        font-weight: 700 !important;
    }

    /* Aktív állapotban a betűk maradjanak narancssárgák */
    .navbar-default .navbar-nav > .active > a,
    .navbar-nav > li.active > a {
        color: var(--almond) !important;
        background-color: #ffffff !important;
    }
}

/* Mobil */
@media (max-width: 768px) {
  body #dnn_HeaderPane {
    max-width: 100% !important;
    margin-left: 0 !important;
    padding: 30px 20px 60px 20px !important;
  }

  body .dnnLogin {
    max-width: 100% !important;
  }

  body .dnnLogin .dnnFormItem {
    display: block !important;
  }

  body .dnnLogin .dnnFormLabel,
  body .dnnLogin label {
    display: block !important;
    width: auto !important;
    min-width: 0 !important;
    text-align: left !important;
    margin-bottom: 6px !important;
  }

  body .dnnLogin input[type="text"],
  body .dnnLogin input[type="password"] {
    width: 100% !important;
  }

  body .dnnLogin .dnnFormItem:has(.dnnLoginRememberMe),
  body .dnnLogin .dnnFormItem:has(.dnnLoginActions),
  body .dnnLogin .dnnActions,
  body #dnn_ctr418_Register_actionsRow {
    margin-left: 0 !important;
  }
}



.kk-new-box-simple {
  max-width: 1100px;
  margin: 70px auto;
  padding: 20px 30px;
  text-align: center;
}

.kk-new-box-label {
  position: relative;
  display: inline-block;
  color: #dc8a47;
  font-size: 15px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  margin-bottom: 20px;
  padding-top: 22px;
}

.kk-new-box-label::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 80px;
  height: 4px;
  border-radius: 999px;
  background: #dc8a47;
}

.kk-new-box-simple h2 {
  margin: 0 0 20px;
  color: #3f2d31;
  font-size: 54px;
  line-height: 1.05;
  font-weight: 800;
}

.kk-new-box-simple p {
  max-width: 760px;
  margin: 0 auto 32px;
  color: #4f5555;
  font-size: 19px;
  line-height: 1.7;
}

.kk-new-box-simple-btn {
  display: inline-block;
  padding: 15px 34px;
  border-radius: 16px;
  background: #9a8198;
  color: #fff !important;
  text-decoration: none !important;
  font-weight: 700;
  font-size: 14px;
  transition: .2s ease;
}

.kk-new-box-simple-btn:hover {
  background: #80687e;
}





.kk-box-flow {
  width: 100%;
  padding: 70px 20px 90px;
  background: #f6f1e8;
  box-sizing: border-box;
}

.kk-box-arrived {
  max-width: 980px;
  margin: 0 auto 95px;
  text-align: center;
}

.kk-arrived-line {
  width: 76px;
  height: 4px;
  background: #dc8a47;
  border-radius: 999px;
  margin: 0 auto 18px;
}

.kk-arrived-label {
  color: #dc8a47;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  margin-bottom: 18px;
}

.kk-box-arrived h2 {
  margin: 0 0 22px;
  color: #3f2d31;
  font-size: 52px;
  line-height: 1.1;
  font-weight: 800;
}

.kk-box-arrived p {
  max-width: 760px;
  margin: 0 auto;
  color: #4f5555;
  font-size: 20px;
  line-height: 1.7;
}

.kk-box-section-title {
  max-width: 1320px;
  margin: 0 auto 34px;
  text-align: left;
}

.kk-box-section-title span {
  display: block;
  margin-bottom: 10px;
  color: #789664;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.kk-box-section-title h2 {
  margin: 0;
  color: #3B2E31;
  font-size: 42px;
  line-height: 1.15;
  font-weight: 800;
}

.kk-box-steps-grid {
  max-width: 1320px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 28px;
}

.kk-box-step-card {
  position: relative;
  background: #ffffff;
  border-radius: 30px;
  padding: 18px 18px 32px;
  text-align: center;
  box-shadow: 0 16px 36px rgba(63,45,49,.08);
}

.kk-box-step-card img {
  width: 100%;
  height: 235px;
  object-fit: cover;
  border-radius: 24px;
  margin-bottom: 34px;
}

.kk-step-number {
  position: absolute;
  top: 228px;
  left: 50%;
  transform: translateX(-50%);
  width: 54px;
  height: 54px;
  background: #789664;
  color: #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  font-weight: 800;
}

.kk-box-step-card h3 {
  margin: 0 0 12px;
  color: #253d2c;
  font-size: 24px;
}

.kk-box-step-card p {
  margin: 0 auto;
  color: #4f5555;
  font-size: 17px;
  line-height: 1.6;
  max-width: 260px;
}
.kk-box-flow-cta {
  text-align: center;
  margin-top: 45px;
}

.kk-box-flow-btn {
  display: inline-block;
  padding: 15px 34px;
  border-radius: 16px;
  background: #9a8198;
  color: #fff !important;
  text-decoration: none !important;
  font-weight: 700;
  font-size: 16px;
  transition: .2s ease;
}

.kk-box-flow-btn:hover {
  background: #80687e;
}
.kk-box-flow {
  width: calc(100% - 40px);
  max-width: 1500px;
  margin: 70px auto;
  padding: 70px 20px 90px;
  background: #f6f1e8;
  border-radius: 42px;
  box-sizing: border-box;
}

/* Csak a sárga figyelmeztető doboz elrejtése a Hotcakes Product Viewer modulban */
.ModHotcakesProductViewerC .alert.alert-warning {
    display: none !important;
}

@import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:wght@400;600;700&family=Ubuntu:wght@400;500;700&display=swap');

@import url("https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400..900&family=Mulish:wght@400;600;700&display=swap");

:root{
  --font-heading: 'Fraunces', Georgia, 'Times New Roman', serif;
  --font-body: 'Mulish', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  --almond:#DC8A47;
  --indigo:#412929;
  --green:#74515f;
  --lemon:#a98aa1;
  --silk:#c1ceb7;
  --shadow:0 10px 25px rgba(0,0,0,.08);
  --radius:18px;
}

#ContentPane{
  max-width:1400px !important;
  width:100% !important;
  margin:0 auto !important;
}

/*====csunya login elrejtes===*/
/* ===== TOP HEADER ELREJTÉSE ===== */
#topHeader {
    display: none !important;
}

/* ===== ALAP ===== */

body{
  background:#f0ebe7;
  font-family:var(--font-body);
  color:var(--indigo);
  font-weight:400;
}

body.personabar-visible{
  margin-left:0 !important;
}

/* ===== LAYOUT HÁTTÉR ===== */

#breadcrumb{
  display:none !important;
}

main,
main[role="main"],
#mainContent-inner,
.dnnpane{
  background:#f0ebe7 !important;
  border:none !important;
}

/* ===== CÍMEK ===== */

h1, h2, h3,
.lms_heading_3,
.lms_heading_title,
.TitleH2-v2,
.hc-product-card .panel-heading h2{
  font-family:var(--font-heading), serif !important;
  font-weight:700 !important;
  letter-spacing:-0.5px;
}

h1,h2{
  color:var(--indigo);
}

/* ===== HEADER / MENÜ ===== */

header[role="banner"]{
  background:var(--indigo) !important;
  padding:0 !important;
  position:relative;
  background-image: url("/Portals/0/kiskukta_attetszo2.png") !important;
    
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: left !important;
    z-index: 10000 !important; /* Legyen minden felett */

}


/* A logó pontosan olyan magas (46px), mint a H1 címeid */
header[role="banner"]::before {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    left: 24px !important; /* Távolság a képernyő bal szélétől */
    top: 50% !important;
    transform: translateY(-50%) !important;
    
    /* Magasság szinkronizálva a H1-el (46px) */
    height: 46px !important; 
    width: 130px !important; /* Arányos szélesség a képhez */
    
    background-image: url("/Portals/0/kiskukta_proba2.png") !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: left center !important;
    z-index: 10000 !important;
}

/* Segédkód: Ha a tartalom doboza (container) korlátozná a headert, azt is feloldjuk */
.container-fluid, .main-header .container {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
}

header a{
  color:#ffffff !important;
  font-weight:600;
  font-family:var(--font-body), sans-serif;
  
}

header a:hover{
  color:var(--almond) !important;
}


/* ===== LOGÓ ===== */

header img{
  max-height:50px;
}

.navbar-brand{
  padding:0!important;
}

.navbar-brand img{
  max-height:38px;
}


/* ===== MENÜ ===== */

.navbar{
  min-height:44px !important;
}

.navbar-nav > li > a{
  padding:12px 14px !important;
  line-height:20px !important;
}

.navbar-default .navbar-nav > .active > a{
  color:var(--almond) !important;
  border-bottom:3px solid var(--almond);
  background:none !important;
}

.navbar-default .navbar-nav > li > a:hover{
  background:none !important;
}

/* menüsor jobbra igazítása */
.navbar-collapse{
  display:flex !important;
  justify-content:flex-end !important;
}

.navbar-nav{
  float:none !important;
  margin-left:auto !important;
  margin-right:0 !important;
  display:flex !important;
  justify-content:flex-end !important;
}

.navbar-nav > li{
  float:none !important;
}

/* lenyíló menü hoverre nyíljon */
.navbar-nav > li.dropdown:hover > .dropdown-menu{
  display: block !important;
  opacity: 1;
  visibility: visible;
}

/* alapból legyen rejtve szépen */
.navbar-nav > li.dropdown > .dropdown-menu{
  display: none;
}

/* a fő menüpont maradjon aktív hovernél is */
.navbar-nav > li.dropdown:hover > a{
  color: var(--almond) !important;
}

/* ===== TELJES SZÉLESSÉG ===== */

#siteWrapper > .container{
  width:100% !important;
  max-width:100% !important;
  padding-left:24px !important;
  padding-right:24px !important;
}


/* dropdown teljes reset */
.dropdown-menu{
    background: #ffffff !important;
    border: none !important;
    outline: none !important;
    box-shadow: 0 8px 18px rgba(0,0,0,0.12) !important;
    border-radius: 12px !important;
    padding: 0 !important;
}

/* minden belső elem */
.dropdown-menu *{
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    border-radius: 12px !important;
}

/* lista */
.dropdown-menu li{
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* link */
.dropdown-menu li a{
    display: block !important;
    width: 100% !important;
    padding: 12px 18px !important;
    background: transparent !important;
    color: #DC8A47 !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    border-radius: 12px !important;
}

/* hover */
.dropdown-menu li a:hover{
    background: #f3e8f0 !important;
    border-radius: 12px !important;
}

/* header legyen referencia pont */
header[role="banner"]{
  position: relative;
}

/* Mini cart pozicionálása */
#HeaderPane{
  position:absolute;
  top:-70px;
  right:50px;
  z-index:999;
  width:auto !important;
}

/* modul doboz eltüntetése */
#HeaderPane .DnnModule{
  margin:0 !important;
  padding:0 !important;
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
}

/* szerkesztő elemek elrejtése */
#HeaderPane .moduleTitle,
#HeaderPane .dnnActionMenu,
#HeaderPane .dnnControls{
  display:none !important;
}

/* hogy a menü ne menjen rá */
#navbar{
  padding-right: 20px;
}

/* ===== SEARCH ===== */

#dnn_HeaderPane{
  padding-top:0px !important;
  padding-bottom:20px !important;
}

.hc-search-input{
  width:100% !important;
  margin:24px 0 18px !important;
}

.hc-search-input .form-control{
  width:100% !important;
  border-radius:14px;
  border:0;
  box-shadow:var(--shadow);
}

.hc-search-input .btn{
  border-radius:14px;
  background:var(--almond);
  border:0;
  color:#fff;
  box-shadow:var(--shadow);
}


/* ===== STORE ADMIN ===== */

.hc-catalog-admin .alert{
  background:#ffffff !important;
  border:none !important;
  border-radius:var(--radius);
  box-shadow:var(--shadow);
}

.hc-catalog-admin .btn{
  background:var(--almond);
  border:none;
  color:#fff;
  border-radius:12px;
}

/* ===== KATEGÓRIA KÁRTYÁK ===== */

.hc-category .panel{
  border:none;
  border-radius:var(--radius);
  overflow:hidden;
  box-shadow:var(--shadow);
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 200px;

}

.hc-category .panel-footer{
  background:var(--lemon);
  text-align:center;
  font-weight:700;
  color:#ffffff !important;
  width: 100%;
  
}

.hc-category .panel-footer,
.hc-category .panel-footer a,
.hc-category .panel-footer span,
.hc-category .panel-footer div,
.hc-category .panel-footer h2,
.hc-category .panel-footer h2 a{
  color:#ffffff !important;
  text-decoration:none !important;
}

/* Hover effektek megegyeznek a termékkártyákkal */
.hc-category .panel {
  transition: transform .25s ease, box-shadow .25s ease;
}

.hc-category .panel:hover {
  transform: translateY(-6px);
  box-shadow: 0 16px 30px rgba(0,0,0,.12);
}

.hc-category{
  margin-bottom:30px;
}

.hc-category .panel{
  height:420px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  align-items:stretch;
}

.hc-category .panel-body{
  height:320px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px;
  background:#ffffff;
}

.hc-category .panel-body img{
  max-width:100%;
  max-height:240px;
  width:auto;
  height:auto;
  object-fit:contain;
  display:block;
  margin:0 auto;
}

.hc-category .panel-footer{
  min-height:74px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:14px 18px;
}

/* ===== TERMÉK KÁRTYÁK ===== */

hc-product-card .panel{
  border:none;
  border-radius:var(--radius);
  overflow:hidden;
  box-shadow:var(--shadow);
  transition:.2s ease;
}

.hc-product-card .panel:hover{
  transform:translateY(-5px);
}

.hc-product-card .panel-heading{
  background:#ffffff;
  border:none;
}

.hc-product-card .panel-heading h2 a{
  font-size:17px;
  color:var(--indigo) !important;
  text-decoration:none;
}

.hc-product-card .panel-body{
  background:#ffffff;
}

.hc-product-card .hc-price,
.hc-product-card .hc-price span,
.hc-product-card .hc-price *,
.hc-product-card .panel-footer,
.hc-product-card .panel-footer span,
.hc-product-card .panel-footer div,
.hc-product-card .panel-footer a,
.hc-product-card .panel-footer .price{
  color:#ffffff !important;
}

.hc-product-card .panel-footer{
  background:var(--green);
  font-weight:700;
}
/* ===== TERMÉK KÁRTYÁK – EGYSÉGES MÉRET ÉS SORBAN ===== */
/* Konténer: kártyák egy sorban, töréssel ha kell */
.hc-product-card-container {
  display: flex;
  flex-wrap: wrap;    /* több sor, ha nem fér ki */
  gap: 24px;
  justify-content: flex-start;
}

/* Kártyák egységes szélesség és magasság */
.hc-product-card {
  flex: 0 1 250px;    /* fix alap szélesség, rugalmas növekedés */
  display: flex;
  flex-direction: column;
  height: 400px;      /* fix magasság minden kártyának */
  box-sizing: border-box;
}

/* Panel kitöltése, hogy a tartalom szépen oszoljon */
.hc-product-card .panel {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  overflow: hidden;
}

/* Panel body rugalmas, hogy a lábléc a helyén maradjon */
.hc-product-card .panel-body {
  flex: 1 1 auto;
}

/* ===== KÁRTYA HOVER EFFEKT ===== */

.hc-product-card .panel,
.hc-category .panel{
  transition: transform .25s ease, box-shadow .25s ease;
}

.hc-product-card .panel:hover,
.hc-category .panel:hover{
  transform: translateY(-6px);
  box-shadow: 0 16px 30px rgba(0,0,0,.12);
}

/* ===== ADD TO CART ===== */

a.add-to-cart-product{
  display:inline-block;
  margin-top:8px;
  padding:10px 14px;
  background:var(--almond);
  color:#fff !important;
  border-radius:12px;
  font-weight:700;
  text-decoration:none;
  box-shadow:var(--shadow);
}

a.add-to-cart-product:hover{
  background:#c97a36;
  transform:scale(1.03);
}

/* ===== PAGINATION ===== */

.pagination > li > a{
  color:var(--indigo);
  border:none;
}

.pagination > .active > a{
  background:var(--almond) !important;
  border:none;
  color:#fff !important;
}

/* ===== FOOTER ===== */

footer{
  background:var(--green);
  color:var(--indigo);
}

footer a{
  color:var(--indigo);
}

footer a:hover{
  color:var(--almond);
}

/* ===== ALSÓ KAVARODÁS JAVÍTÁSA ===== */

/* footeren belüli plusz sávok eltüntetése */
footer .container,
footer .row,
footer .pane,
footer .dnnpane,
footer .DnnModule,
footer .dnnModuleContent{
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  margin:0 !important;
}

/* footer linkek */
footer a{
  color:#ffffff !important;
}

footer a:hover{
  color:var(--almond) !important;
}


/* ===== KÉT OSZLOPOS LAYOUT ===== */

#mainContent-inner .row.dnnpane{
  display:flex;
  align-items:flex-start;
  gap:32px;
}

#dnn_P2_25_1{
  flex:0 0 260px;
  max-width:260px;
  position:sticky;
  top:20px;
}

#dnn_P2_75_2{
  flex:1 1 0;
  max-width:calc(100% - 292px);
  min-width:0;
}

/* =========================================================
   FŐOLDAL – HERO + HÍREK SZÉPÍTÉS
   ========================================================= */

/* Főoldali felső modul */
#dnn_ctr403_HtmlModule_lblContent{
  max-width: 1280px;
  margin: 24px auto 40px auto;
}

#dnn_ctr403_HtmlModule_lblContent h2{
  display:none !important; /* a sima "Főoldal" cím ne látszódjon */
}

/* A táblázatos hero blokk modernizálása */
#dnn_ctr403_HtmlModule_lblContent table{
  width:100% !important;
  border-collapse:separate !important;
  border-spacing:0 !important;
  background:linear-gradient(135deg, #f6f1eb 0%, #f6f1eb 100%);
  border-radius:28px;
  overflow:hidden;
  box-shadow:0 18px 40px rgba(0,0,0,.08);
}

#dnn_ctr403_HtmlModule_lblContent table tr{
  display:flex;
  align-items:center;
  min-height:460px;
}

#dnn_ctr403_HtmlModule_lblContent table td{
  width:50%;
  vertical-align:middle;
  padding:56px !important;
  border:none !important;
}

/* bal oldali szöveg */
#dnn_ctr403_HtmlModule_lblContent table td:first-child{
  background:transparent;
}

#dnn_ctr403_HtmlModule_lblContent table td:first-child p:first-child{
  font-family:var(--font-heading), serif;
  font-size:48px;
  line-height:1.1;
  font-weight:700;
  color:var(--indigo);
  margin:0 0 18px 0;
  max-width:520px;
}

#dnn_ctr403_HtmlModule_lblContent table td:first-child p:last-child{
  font-size:18px;
  line-height:1.75;
  color:#5f4b5a;
  margin:0;
  max-width:560px;
}

/* jobb oldali kép */
#dnn_ctr403_HtmlModule_lblContent table td:last-child{
  padding:0 !important;
  height:460px;
  margin-right: 30px;
}

#dnn_ctr403_HtmlModule_lblContent table td:last-child img{
  width:100% !important;
  height:100% !important;
  object-fit:cover;
  display:block;
}

/* Hero fölé kis címke */
#dnn_ctr403_HtmlModule_lblContent table td:first-child::before{
  content:"Főzz tudatosan. Vásárolj okosan. Élj fenntarthatóan.";
  display:inline-block;
  margin-bottom:38px;
  padding:8px 14px;
  background:rgba(220,138,71,.12);
  color:var(--almond);
  border-radius:999px;
  font-size:13px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.hero-buttons{
  margin-top:25px;
  display:flex;
  gap:15px;
}

/* fő gomb */
.btn-primary{
  background:#8f6c80;
  color:#fff;
  padding:12px 22px;
  border-radius:12px;
  text-decoration:none;
  font-weight:600;
  transition:all .2s ease;
}

.btn-primary:hover{
  background:#7a5c6e;
}

/* másodlagos */
.btn-secondary{
  background: var(--lemon);
  color:#333;
  padding:12px 22px;
  border-radius:12px;
  text-decoration:none;
  font-weight:500;
  transition:all .2s ease;
}

.btn-secondary:hover{
  background:var(--green);
}

.hero-buttons a{
  text-decoration:none !important;
  color:#ffffff;
}



/*===CIKKEK===*/
/* ===== BLOKK ===== */
.cikk-slider-blokk{
 width:100%;
  max-width:1280px;
  margin:70px auto;
  padding:0 20px;
  box-sizing:border-box;
}

.cikk-slider-blokk *{
  box-sizing:border-box;
}

/* ===== FEJLÉC ===== */
.cikk-slider-fejlec h2{
  margin:0;
  font-size:64px;
  line-height:1.08;
  font-family:var(--font-heading);
  font-weight:700;
  color:#3f2a2a;
}

.cikk-slider-vonal{
  width:110px;
  height:6px;
  margin:0 0 36px;
  background:#c88a47;
  border-radius:999px;
}

/* ===== WRAP ===== */
.cikk-slider-wrap{
  position:relative;
}

.cikk-cel{
  position:absolute;
  top:0;
  left:0;
  width:1px;
  height:1px;
  opacity:0;
  pointer-events:none;
}

/* ===== KERET ===== */
.cikk-slider-keret{
  width:100%;
  overflow:hidden;
}

/* ===== PÁLYA ===== */
.cikk-slider-palya{
  display:flex;
  width:200%;
  transform:translateX(0);
  transition:transform 0.45s ease;
}

/* target alapú lapozás */
#cikk-slide-2:target ~ .cikk-slider-keret .cikk-slider-palya{
  transform:translateX(-50%);
}

#cikk-slide-1:target ~ .cikk-slider-keret .cikk-slider-palya{
  transform:translateX(0);
}

/* ===== OLDAL ===== */
.cikk-oldal{
  width:50%;
  display:flex;
  gap:28px;
  padding:10px 4px 24px;
}

/* ===== KÁRTYA ===== */
.cikk-kartya{
  flex:0 0 calc((100% - 84px) / 4);
  max-width:calc((100% - 84px) / 4);
  min-width:calc((100% - 84px) / 4);

  display:flex;
  flex-direction:column;
  background:#ffffff;
  border-radius:30px;
  overflow:hidden;
  text-decoration:none !important;
  color:inherit !important;
  box-shadow:0 8px 24px rgba(0,0,0,0.08);
  transition:transform 0.25s ease, box-shadow 0.25s ease;
}

.cikk-kartya:hover{
  transform:translateY(-8px);
  box-shadow:0 16px 30px rgba(0,0,0,0.14);
}

.cikk-kartya:link,
.cikk-kartya:visited,
.cikk-kartya:hover,
.cikk-kartya:active{
  text-decoration:none !important;
  color:inherit !important;
}

/* ===== KÉP ===== */
.cikk-kep{
  width:100%;
  height:230px;
  overflow:hidden;
  background:#e9e4df;
  flex-shrink:0;
}

.cikk-kep img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}

/* ===== SZÖVEG ===== */
.cikk-szoveg{
  padding:24px 24px 28px;
  min-height:150px;
  background:#ffffff;
  display:flex;
  align-items:flex-start;
}

.cikk-szoveg h3{
  margin:0;
  font-family:'Playfair Display', serif;
  font-size:22px;
  line-height:1.32;
  font-weight:600;
  color:#3f2a2a !important;
  text-decoration:none !important;
  word-break:break-word;
}

/* ===== ÜRES KÁRTYA ===== */
.cikk-kartya-ures{
  background:transparent;
  box-shadow:none;
  pointer-events:none;
}

/* ===== GOMBOK ===== */
.cikk-gomb{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  z-index:20;

  width:46px;
  height:46px;
  border-radius:50%;
  background:#ffffff;
  color:#3f2a2a !important;
  box-shadow:0 5px 16px rgba(0,0,0,0.14);

  display:flex;
  align-items:center;
  justify-content:center;

  font-size:24px;
  line-height:1;
  text-decoration:none !important;
}

.cikk-gomb-bal{
  left:-20px;
}

.cikk-gomb-jobb{
  right:-22px;
}

.cikk-gomb:hover{
  transform:translateY(-50%) scale(1.06);
  box-shadow:0 8px 20px rgba(0,0,0,0.18);
}

/* ===== PÖTTYÖK ===== */
.cikk-pontok{
  margin-top:14px;
  display:flex;
  gap:10px;
}

.cikk-pont{
  width:12px;
  height:12px;
  border-radius:50%;
  background:#d8cfc7;
  display:inline-block;
  text-decoration:none !important;
}

#cikk-slide-2:target ~ .cikk-pontok .cikk-pont:nth-child(2){
  background:#c88a47;
}

#cikk-slide-2:target ~ .cikk-pontok .cikk-pont:nth-child(1){
  background:#d8cfc7;
}

/* alapállapot: első aktív */
.cikk-pontok .cikk-pont:first-child{
  background:#c88a47;
}

/* ===== TABLET ===== */
@media (max-width:1200px){
  .cikk-kartya{
    flex:0 0 calc((100% - 56px) / 3);
    max-width:calc((100% - 56px) / 3);
    min-width:calc((100% - 56px) / 3);
  }
}

/* ===== MOBIL ===== */
@media (max-width:768px){
  .cikk-slider-fejlec h2{
    font-size:44px;
  }

  .cikk-oldal{
    gap:20px;
  }

  .cikk-kartya{
    flex:0 0 100%;
    max-width:100%;
    min-width:100%;
  }

  .cikk-kep{
    height:190px;
  }

  .cikk-szoveg h3{
    font-size:20px;
  }

  .cikk-gomb{
    width:40px;
    height:40px;
    font-size:20px;
  }

  .cikk-gomb-bal{
    left:-8px;
  }

  .cikk-gomb-jobb{
    right:-8px;
  }
}

.cikk-kep{
  width:100%;
  height:230px;
  overflow:hidden;
  background:#e9e4df;
  flex-shrink:0;
}

.cikk-kep img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}
.cikk-slider-wrap{
  position:relative;
}

.cikk-cel{
  position:fixed;
  top:0;
  left:0;
  width:1px;
  height:1px;
  opacity:0;
  pointer-events:none;
}

#cikk-slide-2:target ~ .cikk-slider-keret .cikk-slider-palya{
  transform:translateX(-50%);
}

#cikk-slide-1:target ~ .cikk-slider-keret .cikk-slider-palya{
  transform:translateX(0);
}
.cikk-szoveg h3 a{
  color:#3f2a2a !important;
  text-decoration:none !important;
  display:block;
}

.cikk-szoveg h3 a:hover{
  color:var(--lemon) !important;
}

/*=======
    miert a kiskukta
    =====*/

.miert-kiskukta-blokk{
  width:100%;
  max-width:1600px;
  margin:70px auto 50px;
  padding:0 clamp(20px, 4vw, 70px);
  box-sizing:border-box;
}

.miert-kiskukta-racs{
  display:grid;
  grid-template-columns:1.1fr 0.9fr;
  gap:42px;
  align-items:center;
}

.miert-kiskukta-szoveg{
  padding:20px 0;
}

.miert-kiskukta-vonal{
  width:90px;
  height:5px;
  background:#c88a47;
  border-radius:999px;
  margin-bottom:20px;
}

.miert-kiskukta-szoveg h2{
  margin:0 0 18px;
  font-size:60px;
  line-height:1.08;
  font-family:'Playfair Display', serif;
  color:#3f2a2a;
}

.miert-kiskukta-bevezeto{
  margin:0 0 26px;
  max-width:720px;
  font-size:19px;
  line-height:1.75;
  color:#6b5a5a;
}

.miert-kiskukta-kartyak{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
}

.miert-kiskukta-kisblokk{
  background:#ffffff;
  border-radius:28px;
  padding:24px 24px 22px;
  box-shadow:0 14px 30px rgba(0,0,0,0.06);
}

.miert-kiskukta-kisblokk h3{
  margin:0 0 10px;
  font-size:24px;
  line-height:1.2;
  font-family:'Playfair Display', serif;
  color:#3f2a2a;
}

.miert-kiskukta-kisblokk p{
  margin:0;
  font-size:17px;
  line-height:1.65;
  color:#6b5a5a;
}

.miert-kiskukta-kep{
  position:relative;
  min-height:520px;
  border-radius:40px;
  overflow:hidden;
  box-shadow:0 20px 45px rgba(0,0,0,0.10);
}

.miert-kiskukta-kep img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}


.miert-kiskukta-racs{
  grid-template-columns:1.2fr 0.8fr; /* kevesebb hely a képnek */
}

/* kép kisebb */
.miert-kiskukta-kep{
  min-height:420px;   /* eddig 520 volt */
  max-height:420px;
}

/*====
 kinek szol 
 ====*/
 .kinek-blokk{
  width:100%;
  max-width:1600px;
  margin:70px auto 90px;
  padding:0 clamp(20px, 4vw, 70px);
  box-sizing:border-box;
}

.kinek-racs{
  display:grid;
  grid-template-columns:1.05fr 1fr;
  gap:36px;
  align-items:stretch;
}

.kinek-kep{
  min-height:520px;
  border-radius:36px;
  overflow:hidden;
  box-shadow:0 20px 45px rgba(0,0,0,0.10);
}

.kinek-kep img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}

.kinek-tartalom{
  background:#f6f1eb;
  border-radius:36px;
  padding:48px 46px;
  box-shadow:0 18px 40px rgba(0,0,0,0.06);
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.kinek-cimke{
  display:inline-block;
  width:fit-content;
  margin-bottom:16px;
  padding:10px 18px;
  border-radius:999px;
  background:#efe4d7;
  color:#c88a47;
  font-size:14px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.kinek-tartalom h2{
  margin:0;
  font-size:56px;
  line-height:1.08;
  font-family:'Playfair Display', serif;
  color:#3f2a2a;
}

.kinek-vonal{
  width:110px;
  height:5px;
  margin:16px 0 26px;
  background:#c88a47;
  border-radius:999px;
}

.kinek-lista{
  display:flex;
  flex-direction:column;
  gap:14px;
}

.kinek-sor{
  position:relative;
  padding:16px 18px 16px 54px;
  background:#ffffff;
  border-radius:22px;
  color:#5f5353;
  font-size:18px;
  line-height:1.55;
  box-shadow:0 10px 24px rgba(0,0,0,0.05);
}

.kinek-sor::before{
  content:"";
  position:absolute;
  left:18px;
  top:50%;
  transform:translateY(-50%);
  width:20px;
  height:20px;
  border-radius:50%;
  background:#c88a47;
  box-shadow:0 0 0 6px rgba(200,138,71,0.16);
}

.kinek-zaro{
  margin-top:24px;
  padding:18px 22px;
  border-radius:24px;
  background:#3f2a2a;
  color:#ffffff;
  font-size:24px;
  line-height:1.35;
  font-family:'Playfair Display', serif;
  font-weight:700;
  text-align:center;
}


/* =========================================================
   TÉRKÖZÖK
   ========================================================= */

#mainContent-inner{
  max-width:1320px;
  margin:0 auto;
  padding-bottom:100px;
}

#dnn_P1_75_1{
  margin-top:20px !important;
  margin-bottom:10px !important;
}

#dnn_P3_33_1,
#dnn_P3_33_2,
#dnn_P3_33_3{
  margin-top:0 !important;
}
/* ===== LÁGY CTA SZEKCIÓ ===== */

.cta-section-soft{
  max-width: 980px;
  margin: 90px auto 40px auto;
  padding: 10px 20px 0;
  text-align: center;
}

.cta-section-soft h2{
  margin: 0 0 18px 0;
  color: var(--indigo);
  font-family: var(--font-heading);
  font-size: 52px;
  line-height: 1.08;
  font-weight: 700;
  letter-spacing: -0.02em;
}

.cta-section-soft p{
  max-width: 760px;
  margin: 0 auto 30px auto;
  color: #5f4b5a;
  font-family: var(--font-body);
  font-size: 21px;
  line-height: 1.7;
}

.cta-buttons-soft{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}

.cta-primary-soft,
.cta-secondary-soft{
  display: inline-block;
  padding: 14px 26px;
  border-radius: 14px;
  text-decoration: none !important;
  font-family: var(--font-body);
  font-weight: 700;
  transition: all .2s ease;
}

/* első gomb */
.cta-primary-soft,
.cta-primary-soft:visited,
.cta-primary-soft:hover,
.cta-primary-soft:active,
.cta-primary-soft:focus{
  background: #8f6c80;
  color: #ffffff !important;
  text-decoration: none !important;
}

/* második gomb */
.cta-secondary-soft,
.cta-secondary-soft:visited,
.cta-secondary-soft:hover,
.cta-secondary-soft:active,
.cta-secondary-soft:focus{
  background: transparent;
  color: var(--indigo) !important;
  border: 1px solid rgba(65,41,41,0.18);
  text-decoration: none !important;
}

.cta-primary-soft:hover{
  background: #7c5d70;
  transform: translateY(-2px);
}

.cta-secondary-soft:hover{
  background: rgba(255,255,255,0.45);
  border-color: rgba(65,41,41,0.28);
  transform: translateY(-2px);
}


.cta-section-soft{
  max-width: 980px;
  margin: 90px auto 40px auto;
  padding: 30px 20px 0;
  text-align: center;
  position: relative;
}

/* ===== ALMOND CSÍK ===== */
.cta-section-soft::before{
  content: "";
  display: block;
  width: 80px;
  height: 4px;
  background: var(--almond);
  border-radius: 2px;
  margin: 0 auto 40px auto;
}


/*===FOOTER===*/

/*kék eltuntetes*/ 

footer .footer-above{
  border-top: 0 !important;
  padding-top: 0 !important;
  margin-top: 0 !important;
}

footer .footer-below{
  border-top: 0 !important;
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* =========================================================
   HOTCAKES CART – CLEANED
   valódi markuphoz igazítva
   ========================================================= */



/* ===== KOSÁR FEJLÉC – RENDBE TÉVE ===== */

/* fő kosárdoboz */
#dnn_ctr388_ModuleContent .hcMvcView .row-fluid.hc-cart{
  max-width: 1180px;
  margin: 40px auto !important;
  padding: 24px 34px 34px !important;
  /*background: #f5efea !important;*/
  border-radius: 30px !important;
  box-shadow: 0 14px 34px rgba(0,0,0,.06) !important;
  color: #432b29 !important;
  overflow:hidden;
}



/* cím: NEM külön buborék */
#dnn_ctr388_ModuleContent .hcMvcView .row-fluid.hc-cart > .col-xs-12 > .row-fluid.hc-cart-title:first-child h1{
  display: block !important;
  margin: 20 8px 0 0 !important;
  padding: 18px 28px !important;
  background:  linear-gradient(135deg, #f6f1eb 0%, #f6f1eb 100%) !important;
  border: 0 !important;
  border-radius: 999px !important;
  box-shadow: 0 14px 34px rgba(0,0,0,.06) !important;
  font-size: 46px !important;
  line-height: 1.08 !important;
  color: #432b29!important;
}

/* a cím pseudoelemeit kapcsold le */
#dnn_ctr388_ModuleContent .hcMvcView .row-fluid.hc-cart > .col-xs-12 > .row-fluid.hc-cart-title:first-child h1::before,
#dnn_ctr388_ModuleContent .hcMvcView .row-fluid.hc-cart > .col-xs-12 > .row-fluid.hc-cart-title:first-child h1::after{
  content: none !important;
  display: none !important;
}

/* termékszám */
#dnn_ctr388_ModuleContent .hcMvcView .row-fluid.hc-cart > .col-xs-12 > .row-fluid.hc-cart-title:first-child h6{
  margin: 0 !important;
  color: #6f5d58 !important;
  font-size: 18px !important;
  font-weight: 500 !important;
}

/* a második hc-cart-title már ne kapjon ugyanilyen fejléc kinézetet */
#dnn_ctr388_ModuleContent .hcMvcView .row-fluid.hc-cart > .col-xs-12 > .row-fluid.hc-cart-title:not(:first-child){
  background: transparent !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}


/* ===== TÁBLA ===== */
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart .table-responsive{
  overflow-x: visible !important;
}

#dnn_ctr388_ModuleContent .hcMvcView .hc-cart table.table{
  width: 100% !important;
  margin-bottom: 0 !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  table-layout: fixed !important;
  background: transparent !important;
}

/* thead-ben th ÉS td is van */
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart table.table thead th,
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart table.table thead td{
  background: #eee4da !important;
  color: #4b332f !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  text-align: left !important;
  padding: 16px 14px !important;
  border: 0 !important;
  vertical-align: middle !important;
}


/* body */
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart table.table tbody td{
  padding: 18px 14px !important;
  vertical-align: top !important;
  border: 0 !important;
  border-bottom: 1px solid #e6d8cd !important;
  background: transparent !important;
  color: #4b332f !important;
}

/* oszlopszélesség */
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart table.table thead tr > *:nth-child(1),
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart table.table tbody tr > *:nth-child(1){ width: 16% !important; }

#dnn_ctr388_ModuleContent .hcMvcView .hc-cart table.table thead tr > *:nth-child(2),
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart table.table tbody tr > *:nth-child(2){ width: 34% !important; }

#dnn_ctr388_ModuleContent .hcMvcView .hc-cart table.table thead tr > *:nth-child(3),
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart table.table tbody tr > *:nth-child(3){ width: 14% !important; }

#dnn_ctr388_ModuleContent .hcMvcView .hc-cart table.table thead tr > *:nth-child(4),
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart table.table tbody tr > *:nth-child(4){ width: 18% !important; }

#dnn_ctr388_ModuleContent .hcMvcView .hc-cart table.table thead tr > *:nth-child(5),
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart table.table tbody tr > *:nth-child(5){ width: 14% !important; }

#dnn_ctr388_ModuleContent .hcMvcView .hc-cart table.table thead tr > *:nth-child(6),
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart table.table tbody tr > *:nth-child(6){
  width: 4% !important;
  text-align: center !important;
}

/* ===== TERMÉKNÉV ===== */
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart tbody td a{
  color: #432b29 !important;
  text-decoration: none !important;
}

#dnn_ctr388_ModuleContent .hcMvcView .hc-cart tbody td a:hover{
  color: #8f5f4c !important;
}

#dnn_ctr388_ModuleContent .hcMvcView .hc-cart tbody td h6{
  margin: 0 !important;
  font-size: 22px !important;
  line-height: 1.3 !important;
  font-weight: 600 !important;
  color: #432b29 !important;
}

/* ===== KÉP ===== */
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart img.img-responsive{
  width: 125px !important;
  max-width: 100% !important;
  height: auto !important;
  border-radius: 16px !important;
  background: #fffaf6 !important;
  padding: 8px !important;
  border: 1px solid #eadfd5 !important;
}

/* ===== ÁR ===== */
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart td .lead{
  color: #7a5b56 !important;
  background: transparent !important;
  font-size: 18px !important;
  line-height: 1.35 !important;
  font-weight: 400 !important;
  white-space: nowrap !important;
}

/* ===== MENNYISÉG ===== */
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart input.form-control{
  width: 86px !important;
  height: 42px !important;
  padding: 8px 12px !important;
  border-radius: 14px !important;
  border: 1px solid #d8c9bd !important;
  background: #fffaf6 !important;
  color: #4b332f !important;
  box-shadow: none !important;
}

#dnn_ctr388_ModuleContent .hcMvcView .hc-cart .form-inline .form-group{
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 10px !important;
}

/* ===== GOMBOK ALAP ===== */
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart .btn,
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart input[type="submit"]:not(.hc-delete),
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart .hc-action-keepshopping .btn,
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart button{
  min-height: 42px !important;
  padding: 8px 16px !important;
  border-radius: 999px !important;
  border: 1px solid #dccbbd !important;
  background: #f2e7dd !important;
  color: #6a4a45 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  box-shadow: none !important;
  transition: background-color .2s ease, color .2s ease, border-color .2s ease, transform .15s ease !important;
}

#dnn_ctr388_ModuleContent .hcMvcView .hc-cart .btn:hover,
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart input[type="submit"]:not(.hc-delete):hover,
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart button:hover{
  background: #eadccf !important;
  color: #5a3d38 !important;
  border-color: #cfb9a7 !important;
  transform: translateY(-1px);
}

/* fő gomb */
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart .btn-primary{
  background: #d88d45 !important;
  color: #fff !important;
  border-color: #d88d45 !important;
}

#dnn_ctr388_ModuleContent .hcMvcView .hc-cart .btn-primary:hover{
  background: #c77d36 !important;
  border-color: #c77d36 !important;
  color: #fff !important;
}

/* tovább vásárolok */
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart .hc-action-keepshopping .btn{
  margin-top:14px;
  min-height:48px;
}

#dnn_ctr388_ModuleContent .hcMvcView .hc-cart .hc-action-keepshopping .btn:hover{
  background: #efe5dc !important;
  color: #5e433d !important;
}

/* szállítási díj */
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart .hc-popup.btn{
  background: #fffaf6 !important;
  color: #7a5a4f !important;
  border: 1px solid #dccbbd !important;
}

#dnn_ctr388_ModuleContent .hcMvcView .hc-cart .hc-popup.btn:hover{
  background: #f6eee7 !important;
  color: #5f453f !important;
}

/* ===== TÖRLÉS GOMB ===== */
/* a valódi elem: input.hc-delete */
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart input.hc-delete{
  width: 38px !important;
  height: 38px !important;
  min-height: 38px !important;
  padding: 0 !important;
  border-radius: 50% !important;
  border: 1px solid #dbc9ba !important;
  background: #efe5dc !important;
  color: transparent !important;
  font-size: 0 !important;
  line-height: 0 !important;
  box-shadow: none !important;
  position: relative !important;
  cursor: pointer !important;
}

#dnn_ctr388_ModuleContent .hcMvcView .hc-cart input.hc-delete::after{
  content: "×";
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #9b6b57;
  font-size: 22px;
  font-weight: 700;
  line-height: 1;
}

#dnn_ctr388_ModuleContent .hcMvcView .hc-cart input.hc-delete:hover{
  background: #e7d8cb !important;
}

/* ha az input pseudoelem nem jelenne meg bizonyos böngészőben,
   legalább ne legyen óriási gomb */
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart td:last-child{
  text-align: center !important;
  vertical-align: middle !important;
}

/* ===== ALSÓ BLOKKOK ===== */
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart .hc-coupon-section h6,
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart .hc-totals-section th{
  color: #4b332f !important;
}

#dnn_ctr388_ModuleContent .hcMvcView .hc-cart .hc-coupon-section input.form-control{
  width: 82px !important;
}

#dnn_ctr388_ModuleContent .hcMvcView .hc-cart .hc-totals-section table{
  width: 100% !important;
}

#dnn_ctr388_ModuleContent .hcMvcView .hc-cart .hc-totals-section td{
  color: #6a4a45 !important;
  white-space: nowrap !important;
}

/* akciógombok sora */
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart .hc-cart-actions .dnnActions{
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

#dnn_ctr388_ModuleContent .hcMvcView .hc-cart .hc-cart-actions .dnnActions li{
  margin: 0 !important;
}



/* ===== TÖRLÉS GOMB (MODERN KUKA IKONNAL) ===== */
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart input.hc-delete {
  width: 38px !important;
  height: 38px !important;
  min-height: 38px !important;
  padding: 0 !important;
  border-radius: 50% !important;
  border: 1px solid #dbc9ba !important;
  background-color: #efe5dc !important;
  
  /* Eredeti felirat elrejtése */
  color: transparent !important;
  font-size: 0 !important;
  line-height: 0 !important;
  text-indent: -9999px !important;

  /* SVG Kuka ikon beillesztése */
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%239b6b57' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='3 6 5 6 21 6'%3E%3C/polyline%3E%3Cpath d='M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2'%3E%3C/path%3E%3Cline x1='10' y1='11' x2='10' y2='17'%3E%3C/line%3E%3Cline x1='14' y1='11' x2='14' y2='17'%3E%3C/line%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  box-shadow: none !important;
}

#dnn_ctr388_ModuleContent .hcMvcView .hc-cart input.hc-delete:hover {
  background-color: #e7d8cb !important;
  border-color: #c9b4a2 !important;
  transform: scale(1.1); /* Finom nagyítás hoverre */

  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%239b6b57' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='3 6 5 6 21 6'%3E%3C/polyline%3E%3Cpath d='M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2'%3E%3C/path%3E%3Cline x1='10' y1='11' x2='10' y2='17'%3E%3C/line%3E%3Cline x1='14' y1='11' x2='14' y2='17'%3E%3C/line%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
}

/* Az utolsó oszlop (törlés) cellájának finomhangolása */
#dnn_ctr388_ModuleContent .hcMvcView .hc-cart td:last-child {
  text-align: center !important;
  vertical-align: middle !important;
  width: 60px !important; /* Biztosítunk neki elég helyet */
}


/* ===== TERMÉK KÁRTYA FOOTER FIX ===== */

.hc-product-card .panel-footer {
  display: flex !important;
  flex-direction: column !important;
  align-items: center;
  gap: 8px;
  padding: 12px !important;
}

/* ár külön sor */
.hc-product-card .hc-price {
  display: block;
  width: 100%;
  text-align: center;
  font-size: 16px;
}

/* gomb mindig alatta */
.hc-product-card a.add-to-cart-product {
  width: 100%;
  text-align: center;
  margin-top: 5px;
}


/* ===== KÁRTYA STABILIZÁLÁS ===== */

.hc-product-card {
  height: 420px; /* fix magasság */
}

/* panel teljes kitöltés */
.hc-product-card .panel {
  height: 100%;
  display: flex;
  flex-direction: column;
}

/* kép rész fix */
.hc-product-card .panel-body {
  height: 200px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px;
}

/* kép */
.hc-product-card .panel-body img {
  max-height: 100%;
  max-width: 100%;
  object-fit: contain;
}

/* cím fix magasság */
.hc-product-card .panel-heading {
  min-height: 60px;
  display: flex;
  align-items: center;
}

/* footer mindig alul */
.hc-product-card .panel-footer {
  margin-top: auto;
}

/* ===== SZŰRŐ ALSÓ TÁVOLSÁG ===== */

.hc-price-range,
.hc-filter-price {
  margin-bottom: 20px; /* alap térköz */
}

/* ha még nagyobb kell */
#dnn_P2_25_1 > * {
  margin-bottom: 18px;
}

/* utolsó elem ne tolja túl */
#dnn_P2_25_1 > *:last-child {
  margin-bottom: 0;
}

/* ===== HOTCAKES SZŰRŐ – ALSÓ TÁVOLSÁG FIX ===== */

/* teljes szűrő modul */
#dnn_P2_25_1 .DnnModule {
  margin-bottom: 30px !important;
}

/* konkrét Hotcakes filter blokk */
#dnn_P2_25_1 .hc-filter,
#dnn_P2_25_1 .hc-price-range,
#dnn_P2_25_1 .hc-filter-price {
  margin-bottom: 25px !important;
  padding-bottom: 10px;
}

/* az utána jövő szöveg ne tapadjon rá */
#dnn_P2_25_1 .DnnModuleContent > * {
  margin-top: 10px;
}

#dnn_P2_25_1 .DnnModule {
  margin-bottom: 40px !important;
}




/*=== hírlevél blokk ===*/

.hc-news-wrap{
  max-width:1280px;
  margin:70px auto;
  padding:40px;
  background:#f7f1eb;
  border-radius:28px;
  display:grid;
  grid-template-columns:1.1fr 0.9fr;
  gap:40px;
  align-items:start;
}

.hc-news-badge{
  display:inline-block;
  padding:10px 18px;
  border-radius:999px;
  background:#efe3d1;
  color:#c98f46;
  font-size:14px;
  font-weight:700;
  margin-bottom:34px !important;
}

.hc-news-left h2{
  font-size:54px;
  line-height:1.05;
  margin-bottom:18px;
  color:#3b241d;
}

.hc-news-left p{
  font-size:20px;
  line-height:1.7;
  color:#5a4a43;
  margin-bottom:25px;
  max-width:580px;
}

.hc-news-frame{
  border-radius:20px;
  overflow:hidden;
}

.hc-news-frame iframe{
  width:100% !important;
  height:700px !important;
  border:none !important;
  display:block !important;
}

.hc-news-right{
  overflow:hidden;
  border-radius:24px;
}

.hc-news-right img{
  width:100% !important;
  height:700px !important;
  display:block !important;
  border-radius:24px !important;
  margin-top: 70px;
}

@media(max-width:950px){
  .hc-news-wrap{
    grid-template-columns:1fr;
  }

  .hc-news-frame iframe{
    height:620px !important;
  }
}


/* =========================================================
   TERMÉKKÁRTYA ÉS LAYOUT STABILIZÁLÁS (LAPTOP vs MOBIL)
   ========================================================= */

/* 1. ASZTALI NÉZET (Laptop): Soros elrendezés */
.hc-product-card-container .hc-category{
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 24px !important;
    justify-content: flex-start !important;
    width: 100% !important;
}

.hc-product-card .hc-category{
    /* Laptopon: 3 kártya egy sorban, de max 400px szélesek */
    flex: 1 1 300px !important;
    max-width: 400px !important;
    height: auto !important;
    min-height: 440px !important; /* Egységes magasság a kártyáknak */
    display: flex !important;
    flex-direction: column !important;
    margin-bottom: 20px !important;
}

/* Kártya belső felépítésének fixálása */
.hc-product-card .panel .hc-category{
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    margin: 0 !important;
}

.hc-product-card .panel-heading .hc-category{
    min-height: 65px !important; /* Elég hely a hosszú termékneveknek */
    display: flex !important;
    align-items: center !important;
}

.hc-product-card .panel-body .hc-category{
    height: 220px !important; /* Fix kép magasság a laptopos sorba rendezéshez */
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.hc-product-card .hc-category .panel-body img {
    max-height: 100% !important;
    max-width: 100% !important;
    object-fit: contain !important;
}

.hc-product-card .hc-category .panel-footer {
    margin-top: auto !important; /* A gombokat a kártya aljára tolja */
}



/* =========================================================
   LOGIN ÉS REGISZTRÁCIÓ GOMBOK + RESZPONZÍV FELÜLET
   ========================================================= */

/* 1. Gombok színezése (Barnás tónusok) */
.hcMvcView .btn-primary, 
.hc-login button, 
.hc-register button,
input[type="submit"].btn-primary {
    background-color: var(--indigo) !important; /* Mélybarna */
    border-color: var(--indigo) !important;
    color: #ffffff !important;
    padding: 12px 24px !important;
    border-radius: 12px !important;
    font-weight: 700 !important;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    transition: all 0.3s ease !important;
}

/* Hover állapot: világosabb barna (Almond) */
.hcMvcView .btn-primary:hover, 
.hc-login button:hover, 
.hc-register button:hover {
    background-color: var(--almond) !important;
    border-color: var(--almond) !important;
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}

/* 2. Felület reszponzivitása */
.hc-login, .hc-register {
    max-width: 500px;
    margin: 40px auto !important;
    background: #ffffff;
    padding: 30px !important;
    border-radius: var(--radius);
    box-shadow: var(--shadow);
}

/* Form elemek (input mezők) igazítása */
.hcMvcView .control-group input[type="text"],
.hcMvcView .control-group input[type="password"],
.hcMvcView .control-group input[type="email"] {
    width: 100% !important;
    height: 45px !important;
    border-radius: 10px !important;
    border: 1px solid #ddd !important;
    padding: 10px 15px !important;
    box-sizing: border-box !important;
}

/* 3. MOBIL NÉZET (991px alatt) */
@media (max-width: 991px) {
    .hc-login, .hc-register {
        width: 90% !important; /* Maradjon margó a telefon szélén */
        padding: 20px !important;
        margin-top: 20px !important;
    }

    /* Gombok teljes szélességűek mobilon a könnyebb kattintásért */
    .hcMvcView .btn-primary, 
    .hc-login button, 
    .hc-register button {
        width: 100% !important;
        margin-bottom: 10px;
    }

    /* Az egymás melletti elemek (pl. "Emlékezz rám" checkbox) tördelése */
    .hcMvcView .controls {
        margin-left: 0 !important;
    }
}

/* ===== BEJELENTKEZÉS CÍMKE (KOSÁR STÍLUS) ===== */

.login-header-box {
    /* A kosár fődobozának színe és stílusa alapján */
    background: #f0ebe7 !important; 
    padding: 20px 30px !important;
    border-radius: 20px !important; /* Mint a kosár felső kerekítése */
    display: inline-block;
    margin-bottom: 25px;
    width: auto;
}

.login-header-box h1 {
    /* A kosár fejléc betűstílusa és színe */
    font-family: var(--font-heading), serif !important;
    font-weight: 700 !important;
    font-size: 46px !important; /* Megegyezik a kosár címével */
    line-height: 1.08 !important;
    color: #432b29 !important; /* A kosárnál használt mélybarna */
    margin: 0 !important;
    padding: 0 !important;
    letter-spacing: -0.5px;
}

/* Opcionális: a szöveg alatti kis almond csík, ha még egyedibbé tennéd */
.login-header-box::after {
    content: "";
    display: block;
    width: 100%;
    height: 4px;
    background: var(--almond);
    border-radius: 2px;
    margin-top: 10px;
}


/* ===== RESZPONZÍV REGISZTRÁCIÓ ÉS JELSZÓ VISSZAÁLLÍTÁS GOMBOK ===== */

.hcMvcView .btn-primary, 
.hc-login button, 
.hc-register button,
input[type="submit"].btn-primary {
    /* Szélesség beállítása: mobilon 100%, de asztalin ne legyen óriási */
    display: inline-block !important;
    width: 100% !important; /* Alapértelmezetten kitölti a helyet (mobil) */
    max-width: 320px !important; /* De nem engedjük 320px-nél szélesebbre */
    
    /* Rugalmas szövegkezelés */
    white-space: normal !important; /* Engedi a szöveget több sorba törni, ha nem fér ki */
    word-wrap: break-word !important;
    
    /* Meglévő stílusod megtartása */
    padding: 12px 20px !important;
    height: auto !important; /* Magasság alkalmazkodik a szöveghez */
    min-height: 48px !important;
    
    text-align: center !important;
    vertical-align: middle !important;
}


/* ===== HOTCAKES REGISZTRÁCIÓ ÉS JELSZÓ GOMBOK FIX ===== */

/* A konkrét Hotcakes gombok és a beküldő gomb célzása */
.hc-register .btn-primary, 
.hc-forgot-password .btn-primary,
.hcMvcView input[type="submit"] {
    display: block !important;
    width: 100% !important; /* Mobilon kitölti a rendelkezésre álló helyet */
    max-width: 400px !important; /* Asztali gépen nem engedjük túl szélesre */
    
    /* Reszponzív szövegkezelés */
    white-space: normal !important; /* Hosszú feliratnál (pl. Jelszó visszaállítása) engedi a tördelést */
    word-wrap: break-word !important;
    height: auto !important; /* A magasság követi a több soros szöveget */
    min-height: 48px !important;
    
    /* Igazítás */
    margin: 15px 0 !important; /* Távolság a többi elemtől */
    padding: 12px 20px !important;
    text-align: center !important;
}

/* A Hotcakes beviteli mezők (inputok) is legyenek reszponzívak */
.hc-register input[type="text"],
.hc-register input[type="password"],
.hc-forgot-password input[type="text"] {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

/* Elrendezési korrekció: Hotcakes néha fix margókat használ balra */
.hcMvcView .controls, 
.hcMvcView .control-group {
    margin-left: 0 !important;
    padding-left: 0 !important;
}


/* ===== VISSZA GOMB STÍLUS ===== */

.back-button-container {
    margin: 20px 0;
    display: block;
}

.btn-back {
    display: inline-flex;
    align-items: center;
    padding: 10px 20px;
    background-color: transparent;
    color: var(--indigo) !important; /* A sötétbarna színed */
    font-family: var(--font-body);
    font-weight: 600;
    text-decoration: none !important;
    border: 2px solid var(--indigo);
    border-radius: var(--radius); /* 18px a fájlod alapján */
    transition: all 0.3s ease;
    cursor: pointer;
}

.btn-back .arrow {
    margin-right: 8px;
    font-size: 1.2em;
    transition: transform 0.3s ease;
}

.btn-back:hover {
    background-color: var(--indigo);
    color: #ffffff !important;
    transform: translateX(-5px); /* Egy kis mozgás balra */
}

.btn-back:hover .arrow {
    transform: translateX(-3px);
}


.custom-search-container {
    max-width: 500px;
    margin: 20px auto;
}

.custom-search-container form {
    margin-top:20px;
    display: flex;
    gap: 10px;
}

.my-search-input {
    flex: 1;
    padding: 12px 20px;
    border-radius: var(--radius); /* 18px */
    border: 2px solid #eee;
    font-family: var(--font-body); /* Mulish */
    box-shadow: var(--shadow);
    outline: none;
    transition: border-color 0.3s;
}

.my-search-input:focus {
    border-color: var(--almond); /* Narancssárga keret fókuszkor */
}

.my-search-btn {
    background-color: var(--almond); /* Narancs gomb */
    color: white;
    border: none;
    padding: 10px 25px;
    border-radius: var(--radius);
    font-family: var(--font-heading); /* Ovo */
    font-weight: bold;
    cursor: pointer;
    transition: transform 0.2s, background-color 0.2s;
}

.my-search-btn:hover {
    background-color: var(--indigo); /* Barna szín hovernél */
    transform: scale(1.05); /* A korábban kért "kiugró" effekt */
}



/* ===== HOTCAKES PRODUCT VIEWER – EGYSÉGES DOBOZ MÉRET ===== */

.hc-productviewer .hc-product,
.hc-productviewer .hc-product-card,
.hc-productviewer .panel{
  height:420px !important;
}

.hc-productviewer .panel{
  display:flex !important;
  flex-direction:column !important;

  border:none !important;
  border-radius:24px !important;
  overflow:hidden !important;

  background:#fff !important;
  box-shadow:0 12px 28px rgba(0,0,0,.08) !important;
}

/* kép */
.hc-productviewer .panel-body{
  height:220px !important;

  display:flex !important;
  align-items:center !important;
  justify-content:center !important;

  padding:18px !important;
}

.hc-productviewer .panel-body img{
  max-width:100% !important;
  max-height:180px !important;
  object-fit:contain !important;
}

/* cím */
.hc-productviewer .panel-heading{
  min-height:70px !important;
  padding:16px 20px !important;
}

/* footer */
.hc-productviewer .panel-footer{
  margin-top:auto !important;
}

/* ===== KISKUKTA FOOTER BLOKKOK ===== */

.kk-footer-block {
  color: #ffffff !important;
  font-family: Inter, Arial, sans-serif;
  padding: 30px 20px;
  max-width: 280px;
  margin: 0 auto;
  box-sizing: border-box;
  text-align: left;
}

.kk-footer-block h2,
.kk-footer-block h3,
.kk-footer-block p,
.kk-footer-block span,
.kk-footer-block strong {
  color: inherit;
}

.kk-footer-block a {
  color: #f3e8df !important;
  text-decoration: none !important;
}

.kk-footer-block a:hover {
  color: #e6b85c !important;
}

.kk-footer-block iframe {
  max-width: 100%;
  display: block;
}

@media (max-width: 768px) {
  .kk-footer-block {
    max-width: 100%;
    text-align: center;
  }

  .kk-footer-block div[style*="height:4px"] {
    margin-left: auto !important;
    margin-right: auto !important;
  }
}
/* ===== FOOTER TELJES SZÉLESSÉGRE SZÉTHÚZVA ===== */

#dnn_footer_25_1,
#dnn_footer_25_2,
#dnn_footer_25_3,
#dnn_footer_25_4 {
  float: left !important;
  box-sizing: border-box !important;
  padding-left: 30px !important;
  padding-right: 30px !important;
}

/* Oszloparányok nagy képernyőn */
@media (min-width: 992px) {
  #dnn_footer_25_1 {
    width: 25% !important;
  }

  #dnn_footer_25_2 {
    width: 25% !important;
  }

  #dnn_footer_25_3 {
    width: 20% !important;
  }

  #dnn_footer_25_4 {
    width: 30% !important;
  }
}

/* A blokkok ne legyenek túl keskenyek */
.kk-footer-block {
  max-width: none !important;
  width: 100% !important;
  margin: 0 auto !important;
  padding: 30px 10px !important;
  box-sizing: border-box !important;
}

/* Első blokk kicsit jobbra, mert szerkesztő nézetben rámegy a DNN oldalsáv */
#dnn_footer_25_1 .kk-footer-block {
  padding-left: 70px !important;
}

/* Térképes rész nagyobb */
#dnn_footer_25_4 .kk-footer-block {
  max-width: 420px !important;
}

#dnn_footer_25_4 iframe {
  width: 100% !important;
  height: 230px !important;
}
/* =====================================================
   DNN BEJELENTKEZÉS + REGISZTRÁCIÓ FORMÁZÁS
   ===================================================== */

body #dnn_HeaderPane {
  
  margin-right: auto !important;
  padding: 40px 20px 0px 20px !important;
  float: none !important;
  box-sizing: border-box !important;
}

body .dnnLogin {
  max-width: 520px !important;
  margin: 45px 0 0 0 !important;
  padding: 0 !important;
}

/* Form sorok */
body .dnnLogin .dnnFormItem {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin-bottom: 11px !important;
    padding-left: 10px;
}

/* Feliratok */
body .dnnLogin .dnnFormLabel,
body .dnnLogin label {
  width: 135px !important;
  min-width: 135px !important;
  text-align: right !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #3b2723 !important;
}

/* Input mezők */
body .dnnLogin input[type="text"],
body .dnnLogin input[type="password"],
body #dnn_ctr419_Login_Login_DNN_txtUsername,
body #dnn_ctr419_Login_Login_DNN_txtPassword {
  width: 280px !important;
  height: 40px !important;
  padding: 7px 12px !important;
  box-sizing: border-box !important;
  border: 1px solid #d8cfc7 !important;
  border-radius: 9px !important;
  background: #ffffff !important;
  color: #3b2723 !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  box-shadow: inset 0 1px 3px rgba(0,0,0,.05) !important;
  outline: none !important;
  transition: all 0.2s ease !important;
}

body .dnnLogin input[type="text"]:focus,
body .dnnLogin input[type="password"]:focus,
body #dnn_ctr419_Login_Login_DNN_txtUsername:focus,
body #dnn_ctr419_Login_Login_DNN_txtPassword:focus {
  border-color: #d28a3c !important;
  box-shadow: 0 0 0 3px rgba(210,138,60,.18), inset 0 1px 3px rgba(0,0,0,.05) !important;
}

/* Emlékezz rám sor */
body .dnnLogin .dnnFormItem:has(.dnnLoginRememberMe) {
  display: block !important;
  margin-left: 151px !important;
  padding-left: 0 !important;
  width: auto !important;
}

body .dnnLogin .dnnFormItem:has(.dnnLoginRememberMe) .dnnFormLabel {
  display: none !important;
}

body .dnnLogin .dnnLoginRememberMe {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 0 !important;
  width: auto !important;
}

body .dnnLogin .dnnLoginRememberMe input[type="checkbox"] {
  position: static !important;
  margin: 0 !important;
  width: 17px !important;
  height: 17px !important;
}

body .dnnLogin .dnnLoginRememberMe label {
  width: auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
  white-space: nowrap !important;
}

/* Bejelentkezés + Mégse gombsor */
body .dnnLogin .dnnActions,
body #dnn_ctr418_Register_actionsRow {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  flex-wrap: nowrap !important;
  margin-left: 151px !important;
  margin-top: 16px !important;
  padding: 0 !important;
  list-style: none !important;
}

body .dnnLogin .dnnActions li,
body #dnn_ctr418_Register_actionsRow li {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  display: inline-flex !important;
}

/* Alsó Regisztráció + Jelszó visszaállítása sor */
body .dnnLogin .dnnFormItem:has(.dnnLoginActions) {
  display: block !important;
  margin-left: 151px !important;
  margin-top: 16px !important;
  padding-left: 0 !important;
  width: auto !important;
}

body .dnnLogin .dnnFormItem:has(.dnnLoginActions) .dnnFormLabel {
  display: none !important;
}

body .dnnLogin .dnnFormItem:has(.dnnLoginActions) .dnnLoginActions,
body .dnnLogin .dnnFormItem:has(.dnnLoginActions) ul.dnnActions {
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  gap: 12px !important;
  flex-wrap: nowrap !important;
  justify-content: flex-start !important;
  width: auto !important;
}

/* Közös gombdesign */
body .dnnLogin .dnnPrimaryAction,
body .dnnLogin .dnnSecondaryAction,
body #dnn_ctr418_Register_registerButton,
body #dnn_ctr418_Register_cancelLink,
body #dnn_ctr419_Login_Login_DNN_cmdLogin,
body #dnn_ctr419_Login_Login_DNN_cancelLink {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 42px !important;
  padding: 0 22px !important;
  border-radius: 10px !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  cursor: pointer !important;
  box-sizing: border-box !important;
  transition: all 0.2s ease !important;
}

/* Elsődleges gomb */
body .dnnLogin .dnnPrimaryAction,
body #dnn_ctr418_Register_registerButton,
body #dnn_ctr419_Login_Login_DNN_cmdLogin {
  background: linear-gradient(180deg, #d28a3c 0%, #bd6f26 100%) !important;
  color: #ffffff !important;
  border: 1px solid #b96522 !important;
  box-shadow: 0 8px 18px rgba(79,45,27,.20) !important;
}

/* Másodlagos gombok */
body .dnnLogin .dnnSecondaryAction,
body #dnn_ctr418_Register_cancelLink,
body #dnn_ctr419_Login_Login_DNN_cancelLink {
  background: #f7f1eb !important;
  color: #3b2723 !important;
  border: 1px solid #d5c4b6 !important;
  box-shadow: 0 8px 18px rgba(55,35,30,.10) !important;
}

/* Alsó két login gomb kisebb */
body .dnnLogin .dnnLoginActions .dnnSecondaryAction {
  min-height: 38px !important;
  padding: 0 10px !important;
  font-size: 13px !important;
  white-space: nowrap !important;
  margin-left: 19px;
}

/* Hover */
body .dnnLogin .dnnPrimaryAction:hover,
body #dnn_ctr418_Register_registerButton:hover,
body #dnn_ctr419_Login_Login_DNN_cmdLogin:hover {
  background: linear-gradient(180deg, #df9a4a 0%, #c9792d 100%) !important;
  color: #ffffff !important;
  transform: translateY(-1px) !important;
}

body .dnnLogin .dnnSecondaryAction:hover,
body #dnn_ctr418_Register_cancelLink:hover,
body #dnn_ctr419_Login_Login_DNN_cancelLink:hover {
  background: #fffaf5 !important;
  color: #3b2723 !important;
  border-color: #c8aa95 !important;
  transform: translateY(-1px) !important;
}



/* ===== REGISZTRÁCIÓ INPUT MEZŐK ===== */

body #dnn_ctr418_Register_userForm input[type="text"],
body #dnn_ctr418_Register_userForm input[type="password"],
body #dnn_ctr418_Register_userForm input[type="email"],
body #dnn_ctr418_Register_userForm select,
body #dnn_ctr418_Register_userForm textarea {
  width: 280px !important;
  height: 40px !important;
  padding: 7px 12px !important;
  box-sizing: border-box !important;

  border: 1px solid #d8cfc7 !important;
  border-radius: 9px !important;

  background: #ffffff !important;
  color: #3b2723 !important;

  font-size: 14px !important;
  font-weight: 500 !important;

  box-shadow: inset 0 1px 3px rgba(0,0,0,.05) !important;
  outline: none !important;
  transition: all 0.2s ease !important;
}

body #dnn_ctr418_Register_userForm input[type="text"]:focus,
body #dnn_ctr418_Register_userForm input[type="password"]:focus,
body #dnn_ctr418_Register_userForm input[type="email"]:focus,
body #dnn_ctr418_Register_userForm select:focus,
body #dnn_ctr418_Register_userForm textarea:focus {
  border-color: #d28a3c !important;
  box-shadow: 0 0 0 3px rgba(210,138,60,.18), inset 0 1px 3px rgba(0,0,0,.05) !important;
}

/*kosár oldal lábléc elrejtés*/

body:has(form[action*="/Kosar_oldal"]) footer[role="contentinfo"],
body:has(form[action*="/Kosar_oldal"]) .footer-above,
body:has(form[action*="/Kosar_oldal"]) .footer {
  display: none !important;
}
/* ===== BREADCRUMB / ÖSSZES TERMÉK GOMB ===== */

.breadcrumb,
#hc-breadcrumb,
.hc-breadcrumb {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin: 25px 0 35px !important;
}

/* maga a doboz */
.breadcrumb > li:first-child a,
.hc-breadcrumb a:first-child {
    display: inline-flex !important;
    align-items: center !important;

    padding: 12px 22px !important;

    background: #ffffff !important;
    color: var(--indigo) !important;

    border-radius: 999px !important;
    text-decoration: none !important;

    font-family: var(--font-body) !important;
    font-weight: 700 !important;
    font-size: 15px !important;

    box-shadow: 0 8px 20px rgba(0,0,0,.06) !important;

    transition: all .25s ease !important;
}

/* hover */
.breadcrumb > li:first-child a:hover,
.hc-breadcrumb a:first-child:hover {
    background: var(--almond) !important;
    color: #ffffff !important;

    transform: translateY(-2px);
    box-shadow: 0 12px 24px rgba(0,0,0,.10) !important;
}

/* elválasztó */
.breadcrumb > li + li:before {
    color: #b79f96 !important;
    padding: 0 10px !important;
}

/* aktuális oldal */
.breadcrumb > .active,
.hc-breadcrumb .active {
    color: #7a6460 !important;
    font-weight: 600 !important;
}

/* mobil */
@media (max-width:768px){

    .breadcrumb > li:first-child a,
    .hc-breadcrumb a:first-child{
        width: 100%;
        justify-content: center;
    }

    .breadcrumb{
        display:flex;
        flex-wrap:wrap;
        gap:10px;
    }
}
/* ===== KATTINTHATÓ LOGÓ ===== */

header[role="banner"]{
    position:relative !important;
}

/* kattintható terület */
header[role="banner"]::after{
    content:"";
    position:absolute;
    left:24px;
    top:50%;
    transform:translateY(-50%);

    width:130px;
    height:46px;

    z-index:10002;
    cursor:pointer;
}

/* mobil */
@media (max-width:768px){
    header[role="banner"]::after{
        left:50%;
        top:15px;
        transform:translateX(-50%);
        width:100px;
        height:38px;
    }
}



/* =========================================================
   HOTCAKES – RELATED ITEMS
   ========================================================= */

.hc-related-items,
.related.items,
.related-products {
  margin-top: 70px;
}

/* cím */
.hc-related-items h2,
.related.items h2,
.related-products h2{
  font-size: 54px;
  line-height: 1.08;
  margin-bottom: 34px;
  color: var(--indigo);
  font-family: var(--font-heading);
  font-weight: 700;
  letter-spacing: -0.03em;
}

/* grid */
.hc-related-items .row,
.related.items .row,
.related-products .row{
  display:flex;
  flex-wrap:wrap;
}

/* =========================================================
   KÁRTYA
   ========================================================= */

.hc-related-items .hc-product-card,
.related.items .hc-product-card,
.related-products .hc-product-card{
  flex:1 1 280px;
  max-width:320px;
  min-width:260px;

  display:flex;
  flex-direction:column;
  height:440px;
}

/* panel */
.hc-related-items .hc-product-card .panel,
.related.items .hc-product-card .panel,
.related-products .hc-product-card .panel{
  height:100%;
  display:flex;
  flex-direction:column;

  border:none !important;
  border-radius:28px !important;
  overflow:hidden;
  background:#ffffff;
  box-shadow:var(--shadow);
  transition:
    transform .25s ease,
    box-shadow .25s ease;
}

/* hover */
.hc-related-items .hc-product-card .panel:hover,
.related.items .hc-product-card .panel:hover,
.related-products .hc-product-card .panel:hover{
  transform:translateY(-8px);
  box-shadow:0 18px 34px rgba(0,0,0,.12);
}

/* =========================================================
   KÉP
   ========================================================= */

.hc-related-items .panel-body,
.related.items .panel-body,
.related-products .panel-body{
  height:240px;
  padding:24px;
  background:#ffffff;

  display:flex;
  align-items:center;
  justify-content:center;
}

.hc-related-items .panel-body img,
.related.items .panel-body img,
.related-products .panel-body img{
  width:100%;
  height:100%;
  object-fit:contain;
}

/* =========================================================
   CÍM
   ========================================================= */

.hc-related-items .panel-heading,
.related.items .panel-heading,
.related-products .panel-heading{
  min-height:88px;
  padding:18px 22px 8px !important;
  background:#ffffff !important;
  border:none !important;
}

.hc-related-items .panel-heading h2,
.related.items .panel-heading h2,
.related-products .panel-heading h2{
  margin:0;
  font-size:24px !important;
  line-height:1.25;
  font-family:var(--font-heading);
  color:var(--indigo) !important;
}

.hc-related-items .panel-heading h2 a,
.related.items .panel-heading h2 a,
.related-products .panel-heading h2 a{
  color:var(--indigo) !important;
  text-decoration:none !important;
}

/* =========================================================
   FOOTER
   ========================================================= */

.hc-related-items .panel-footer,
.related.items .panel-footer,
.related-products .panel-footer{
  margin-top:auto;
  padding:22px !important;

  background:#ffffff !important;
  border:none !important;

  display:flex;
  flex-direction:column;
  gap:14px;
}

/* ár */
.hc-related-items .hc-price,
.related.items .hc-price,
.related-products .hc-price{
  font-size:30px;
  font-weight:700;
  color:var(--almond) !important;
  text-align:center;
}

/* gomb */
.hc-related-items .add-to-cart-product,
.related.items .add-to-cart-product,
.related-products .add-to-cart-product{
  width:100%;
  padding:14px 18px;

  border-radius:16px;
  background:var(--almond);
  color:#ffffff !important;

  text-align:center;
  text-decoration:none !important;

  font-weight:700;
  font-size:15px;
  letter-spacing:.02em;

  transition:
    transform .2s ease,
    background- .2s ease;
}

/* hover */
.hc-related-items .add-to-cart-product:hover,
.related.items .add-to-cart-product:hover,
.related-products .add-to-cart-product:hover{
  background:#c97a36;
  transform:translateY(-2px);
}

/* =========================================================
   MOBIL
   ========================================================= */

@media (max-width:768px){

  .hc-related-items h2,
  .related.items h2,
  .related-products h2{
    font-size:38px;
  }

  .hc-related-items .hc-product-card,
  .related.items .hc-product-card,
  .related-products .hc-product-card{
    max-width:100%;
    min-width:100%;
    height:auto;
  }

  .hc-related-items .panel-body,
  .related.items .panel-body,
  .related-products .panel-body{
    height:220px;
  }
}



div.row-fluid.hc-product-cards {
    padding-top: 100px !important;
}



/* =========================================================
   TELJES RESZPONZÍV JAVÍTÁSOK
   ========================================================= */

/* 2. FŐOLDALI HTML MODULOK (Szöveg felül, Kép alul) */
@media (max-width: 768px) {
    /* Minden olyan táblázatos modul, ami a főoldali hero-hoz hasonlóan épül fel */
    #dnn_ctr403_HtmlModule_lblContent table,
    .miert-kiskukta-racs,
    .kinek-racs,
    .hc-news-wrap {
        display: flex !important;
        flex-direction: column !important; /* Egymás alá rendezés */
    }

    /* A táblázatos modulok (pl. Hero) sorrendjének megfordítása */
    #dnn_ctr403_HtmlModule_lblContent table tr {
        display: flex !important;
        flex-direction: column !important; /* Itt a szöveg alapból felül van a HTML sorrend miatt */
    }

    /* Ha a HTML-ben a kép lenne elöl, a column-reverse használatos: */
    .roww, 
    .flex-mobile-reverse {
        display: flex !important;
        flex-direction: column-reverse !important;
    }

    /* Biztosítjuk, hogy a szöveges rész és a kép is 100% széles legyen */
    #dnn_ctr403_HtmlModule_lblContent table td,
    .miert-kiskukta-szoveg,
    .miert-kiskukta-kep,
    .kinek-tartalom,
    .kinek-kep,
    .hc-news-left,
    .hc-news-right {
        width: 100% !important;
        max-width: 100% !important;
        padding: 20px !important;
        display: block !important;
    }

    /* Képek finomhangolása alulra kerülés után */
    #dnn_ctr403_HtmlModule_lblContent table td:last-child,
    .miert-kiskukta-kep,
    .kinek-kep,
    .hc-news-right {
        order: 2 !important; /* Explicitly alulra teszi */
        height: 300px !important; /* Fix magasság mobilon, hogy ne legyen túl hosszú */
        margin-top: 15px !important;
    }

    #dnn_ctr403_HtmlModule_lblContent table td:first-child,
    .miert-kiskukta-szoveg,
    .kinek-tartalom,
    .hc-news-left {
        order: 1 !important; /* Explicitly felülre teszi */
    }
}

/* Sikeres bejelentkezés doboz */
    .login-success-box {
        background: #f0ebe7;
        border: 2px solid var(--almond);
        border-radius: var(--radius);
        padding: 20px;
        margin: 20px 0;
        text-align: center;
        color: var(--indigo);
        box-shadow: var(--shadow);
        font-family: 'Mulish', sans-serif;
    }

    .login-success-box h3 {
        margin-top: 0;
        color: var(--almond);
        font-family: 'Ovo', serif;
    }



@media (min-width:1200px){
  #siteWrapper > .container{
    padding-left:48px !important;
    padding-right:48px !important;
  }
}

/*Miert Kiskukta*/

@media (max-width:1100px){
  .miert-kiskukta-racs{
    grid-template-columns:1fr;
  }

  .miert-kiskukta-kep{
    min-height:340px;
  }
}

@media (max-width:768px){
  .miert-kiskukta-blokk{
    margin:50px auto 35px;
  }

  .miert-kiskukta-szoveg h2{
    font-size:40px;
  }

  .miert-kiskukta-bevezeto{
    font-size:16px;
  }

  .miert-kiskukta-kartyak{
    grid-template-columns:1fr;
  }

  .miert-kiskukta-kisblokk h3{
    font-size:22px;
  }

  .miert-kiskukta-kisblokk p{
    font-size:16px;
  }

  .miert-kiskukta-kep{
    min-height:260px;
    border-radius:28px;
  }
}

/*Kinek blokk*/

@media (max-width:1100px){
  .kinek-racs{
    grid-template-columns:1fr;
  }

  .kinek-kep{
    min-height:360px;
  }

  .kinek-tartalom h2{
    font-size:46px;
  }
}

@media (max-width:768px){
  .kinek-blokk{
    margin:50px auto 65px;
  }

  .kinek-tartalom{
    padding:30px 24px;
    border-radius:26px;
  }

  .kinek-kep{
    min-height:260px;
    border-radius:26px;
  }

  .kinek-tartalom h2{
    font-size:36px;
  }

  .kinek-sor{
    font-size:16px;
    padding:14px 16px 14px 46px;
  }

  .kinek-sor::before{
    width:16px;
    height:16px;
    left:16px;
  }

  .kinek-zaro{
    font-size:20px;
    padding:16px 18px;
  }
}

@media (max-width: 991px){
  .cta-section-soft{
    margin: 70px auto 30px auto;
  }

  .cta-section-soft h2{
    font-size: 40px;
  }

  .cta-section-soft p{
    font-size: 18px;
  }
}

/* =========================================================
   MOBIL
   ========================================================= */

@media (max-width: 991px){

  #dnn_ctr403_HtmlModule_lblContent table tr{
    display:block;
    min-height:auto;
  }

  #dnn_ctr403_HtmlModule_lblContent table td{
    width:100%;
    display:block;
    padding:28px !important;
  }

  #dnn_ctr403_HtmlModule_lblContent table td:first-child p:first-child{
    font-size:34px;
    max-width:none;
  }

  #dnn_ctr403_HtmlModule_lblContent table td:first-child p:last-child{
    font-size:16px;
    max-width:none;
  }

  #dnn_ctr403_HtmlModule_lblContent table td:last-child{
    height:280px;
  }

  #dnn_ctr455_HtmlModule_lblContent h1{
    font-size:34px;
  }

  #dnn_P3_33_1 span a,
  #dnn_P3_33_2 span a,
  #dnn_P3_33_3 span a{
    font-size:24px !important;
  }
}

/* =========================================================
   RESPONSIVE DESIGN (TABLET & MOBILE)
   ========================================================= */

/* ===== TABLET NÉZET (1024px alatt) ===== */
@media (max-width: 1024px) {
    header[role="banner"] {
        padding-left: 160px !important; /* Kicsit kevesebb hely a logónak */
        padding-right: 20px !important;
    }
    
    header[role="banner"]::before {
        height: 40px !important; /* Logó mérete kicsit csökken */
        width: 110px !important;
    }
}

/* ===== MOBIL NÉZET (768px alatt) ===== */
@media (max-width: 768px) {
    /* 1. Header szerkezet átalakítása */
    header[role="banner"] {
        flex-direction: column !important; /* Logó és menü egymás alá */
        padding: 60px 20px 20px 20px !important; /* Hely a logónak felül */
        height: auto !important;
        min-height: 100px !important;
    }

    /* 2. Logó középre rendezése mobilon */
    header[role="banner"]::before {
        left: 50% !important;
        top: 15px !important;
        transform: translateX(-50%) !important; /* Vízszintes középre igazítás */
        height: 38px !important; /* Mobil H1 méretéhez igazodva */
        width: 100px !important;
    }

    /* 3. MENÜ CÍMEK EGYMÁS ALÁ RENDEZÉSE */
    .navbar-collapse {
        width: 100% !important;
        display: block !important; /* Flex helyett blokk az egymás alá kerülő címekhez */
    }

    .navbar-nav {
        flex-direction: column !important; /* Egymás alá rendezés */
        align-items: center !important;
        width: 100% !important;
        margin: 20px 0 0 0 !important;
        padding: 0 !important;
        background-color: var(--indigo);
    }

    .navbar-nav > li {
        width: 100% !important;
        text-align: center !important;
        border-bottom: 1px solid rgba(255,255,255,0.1) !important; /* Enyhe elválasztó vonal */
        background-color: var(--indigo);
    }

    .navbar-nav > li > a {
        padding: 15px 0 !important;
        display: block !important;
    }

    /* 4. Kosár táblázat mobil optimalizálása */
    #dnn_ctr388_ModuleContent .hcMvcView .hc-cart table.table {
        display: block !important;
        overflow-x: auto !important; /* Gördíthető táblázat, ha túl széles */
    }
    
    #dnn_ctr388_ModuleContent .hcMvcView .row-fluid.hc-cart {
        margin: 10px !important;
        padding: 20px 15px !important; /* Kisebb belső margók */
    }

    #dnn_ctr388_ModuleContent .hcMvcView .row-fluid.hc-cart > .col-xs-12 > .row-fluid.hc-cart-title:first-child h1 {
        font-size: 28px !important; /* Kisebb cím mobilon */
    }
}

/* Ez minden HTML modul belső tartalmát reszponzívvá teszi */
.DNN_HTML_Content, 
#dnn_ctr388_ModuleContent .hcMvcView {
    width: 100% !important;
    max-width: 1180px; /* A korábbi kosár szélességed */
    margin-left: auto;
    margin-right: auto;
    overflow-x: hidden; /* Megakadályozza a vízszintes görgetést */
}

/* Ha van benne fix szélességű elem (pl. kép vagy táblázat) */
#dnn_ctr388_ModuleContent img, 
#dnn_ctr388_ModuleContent table {
    max-width: 100% !important;
    height: auto !important;
}

/* ===== HÍRKÁRTYÁK EGYMÁS ALÁ RENDEZÉSE MOBILON ===== */
@media (max-width: 991px) {
    /* A paneleket tartalmazó sor kényszerítése függőleges elrendezésre */
    #mainContent-inner .row {
        display: flex !important;
        flex-direction: column !important;
        gap: 20px !important; /* Távolság a kártyák között */
    }

    /* Az egyes hírpanelek szélességének fixálása 100%-ra */
    #dnn_P3_33_1, 
    #dnn_P3_33_2, 
    #dnn_P3_33_3 {
        width: 100% !important;
        max-width: 100% !important;
        flex: none !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* A kártyák belső táblázatának és képének igazítása */
    #dnn_P3_33_1 .DNNContainer_noTitle,
    #dnn_P3_33_2 .DNNContainer_noTitle,
    #dnn_P3_33_3 .DNNContainer_noTitle {
        margin-bottom: 10px !important;
    }

    /* Mobilon a képek magasságát kicsit lejjebb vehetjük, hogy ne foglaljanak túl sok helyet */
    #dnn_P3_33_1 img:first-child,
    #dnn_P3_33_2 img:first-child,
    #dnn_P3_33_3 img:first-child {
        height: 200px !important;
    }
}

/* ===== MOBIL CÍM DOBOZ STABILIZÁLÁSA ===== */
@media (max-width: 768px) {
    /* Biztosítjuk, hogy a cím konténere mobilon is barna maradjon */
    #dnn_ctr388_ModuleContent .hcMvcView .row-fluid.hc-cart > .col-xs-12 > .row-fluid.hc-cart-title:first-child {
        background: #f0ebe7 !important; /* A barna/bézs háttér kényszerítése */
        display: block !important;     /* Megakadályozza az elcsúszást */
        padding: 20px !important;       /* Belső térköz mobilon */
        border-radius: 20px 20px 0 0 !important; /* Felső kerekítés megtartása */
        margin: -24px -34px 20px -34px !important; /* Kifeszítjük a szélekig, ha a padding eltolná */
        width: calc(100% + 68px) !important; /* Kompenzáljuk a fődoboz paddingját */
    }

    /* A cím és a leírás igazítása a barna sávon belül */
    #dnn_ctr388_ModuleContent .hcMvcView .row-fluid.hc-cart > .col-xs-12 > .row-fluid.hc-cart-title:first-child h1,
    #dnn_ctr388_ModuleContent .hcMvcView .row-fluid.hc-cart > .col-xs-12 > .row-fluid.hc-cart-title:first-child h6,
    .custom-cart-message {
        text-align: left !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
}

body footer .footer-above{
  background: var(--indigo) !important;
}

/* 2. MOBIL NÉZET (991px alatt): Oszlopos elrendezés */
@media (max-width: 991px) {
    /* A kétoszlopos layoutot (szűrő + tartalom) egymás alá rakjuk */
    #mainContent-inner .row.dnnpane {
        display: block !important;
    }

    /* Szűrő oszlop mobilon */
    #dnn_P2_25_1 {
        width: 100% !important;
        max-width: 100% !important;
        position: relative !important;
        top: 0 !important;
        margin-bottom: 40px !important; /* Távolság a szűrő és a termékek között */
    }

    /* Termék lista oszlop mobilon */
    #dnn_P2_75_2 {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    /* Konténer mobilon: kényszerített függőleges sorrend */
    .hc-product-card-container {
        display: block !important; 
    }

    /* Kártyák mobilon: Teljes szélességű oszlopos megjelenés */
    .hc-product-card {
        width: 100% !important;
        max-width: 100% !important;
        min-height: auto !important;
        margin-bottom: 30px !important; /* Hely a kártyák között */
    }

    .hc-product-card .panel-body {
        height: 250px !important; /* Mobilon kicsit nagyobb kép */
    }
}

/* 3. EXTRA MOBIL SIMÍTÁS (480px alatt) */
@media (max-width: 480px) {
    #siteWrapper > .container {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }
    
    .hc-product-card .panel-heading h2 a {
        font-size: 18px !important;
    }
}

/* Mobil nézet (767px alatt) */
@media (max-width: 767px) {
    /* A gombok alatti linkek (elfelejtett jelszó, regisztráció) elrendezése */
    .hcMvcView .hc-login .control-group, 
    .hcMvcView .hc-register .control-group {
        margin-bottom: 20px !important;
    }
    
    /* Hogy a gombok és a linkek ne érjenek össze */
    .hcMvcView .btn-primary {
        margin-bottom: 15px !important;
        font-size: 15px !important;
    }
}

/* Mobil finomítás */
@media (max-width: 768px) {
    .hc-register .btn-primary, 
    .hc-forgot-password .btn-primary {
        font-size: 15px !important; /* Kicsit kisebb betű, hogy kevesebbszer kelljen tördelni */
        max-width: 100% !important; /* Mobilon legyen tényleg faltól falig */
    }
}

/* Mobilon legyen teljes szélességű, ha szükséges */
@media (max-width: 768px) {
    .btn-back {
        width: 100%;
        justify-content: center;
        box-sizing: border-box;
    }
}


/* ===== MOBIL MENÜ BARNA STÍLUS (RESZPONZÍV) ===== */

@media (max-width: 991px) {
    /* 1. A lenyíló menü konténerének háttere */
    .navbar-collapse, 
    .navbar-nav, 
    .mobile-menu-container,
    .hc-mobile-nav {
        background-color: var(--indigo) !important;
        border: none !important;
        align-items: center !important; /* Konténeren belüli középre igazítás */
    }

    /* 2. A menüpontok (listaelemek) és linkek */
    .navbar-nav li, 
    .navbar-nav li a,
    .hc-mobile-nav li a {
        background-color: var(--indigo) !important;
        color: #ffffff !important; /* Fehér szöveg a barnán */
        font-family: var(--font-body);
        padding: 12px 20px !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important; /* Finom elválasztó vonal */
        text-align: left;
    }

    /* 3. Hover és Aktív állapot (kijelölés színe) */
    .navbar-nav li a:hover, 
    .navbar-nav li.active a,
    .hc-mobile-nav li a:active {
        background-color: var(--almond) !important; /* A narancsos barna kiemelés */
        color: #ffffff !important;
    }

    /* 4. A lenyíló gomb (Hamburger ikon) színe, ha még nem az */
    .navbar-toggle, 
    .menu-icon-trigger {
        background-color: var(--indigo) !important;
        border-color: var(--almond) !important;
    }
    
    /* Hamburger ikon vonalai legyenek fehérek */
    .navbar-toggle .icon-bar {
        background-color: #ffffff !important;
    }
}

/* ===== MOBIL MENÜ GOMBOK: LEKEREKÍTÉS, KÖZÉPRE IGAZÍTÁS ÉS ANIMÁCIÓ ===== */

@media (max-width: 991px) {
    
    .navbar-nav > li > a,
    .hc-mobile-nav li a {
        display: block !important;
        margin: 10px 20px !important; /* Térköz a gombok között */
        padding: 14px 20px !important;
        border-radius: var(--radius) !important; /* 18px lekerekítés */
        transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
        text-align: center !important; /* Szöveg középre igazítása a gombon belül */
        color: #ffffff !important;
        border-bottom: none !important;
    }

    /* NYOMÁS ÉS AKTÍV ÁLLAPOT (Kattintáskor vagy aktív oldalnál) */
    .navbar-nav > li > a:active,
    .navbar-nav > li > a:focus,
    .navbar-nav > li.active > a,
    .hc-mobile-nav li a:active,
    .hc-mobile-nav li.active a {
        background-color: #ffffff !important; /* Fehér háttér a kiugráshoz */
        color: var(--almond) !important; /* Narancssárga betűk */
        box-shadow: var(--shadow) !important; /* 0 10px 25px rgba(0,0,0,.08) */
        transform: scale(1.05) translateY(-2px) !important; /* Kiugró animáció */
        font-weight: 700 !important;
    }

    /* Aktív állapotban a betűk maradjanak narancssárgák */
    .navbar-default .navbar-nav > .active > a,
    .navbar-nav > li.active > a {
        color: var(--almond) !important;
        background-color: #ffffff !important;
    }
}

/* Mobil */
@media (max-width: 768px) {
  body #dnn_HeaderPane {
    max-width: 100% !important;
    margin-left: 0 !important;
    padding: 30px 20px 60px 20px !important;
  }

  body .dnnLogin {
    max-width: 100% !important;
  }

  body .dnnLogin .dnnFormItem {
    display: block !important;
  }

  body .dnnLogin .dnnFormLabel,
  body .dnnLogin label {
    display: block !important;
    width: auto !important;
    min-width: 0 !important;
    text-align: left !important;
    margin-bottom: 6px !important;
  }

  body .dnnLogin input[type="text"],
  body .dnnLogin input[type="password"] {
    width: 100% !important;
  }

  body .dnnLogin .dnnFormItem:has(.dnnLoginRememberMe),
  body .dnnLogin .dnnFormItem:has(.dnnLoginActions),
  body .dnnLogin .dnnActions,
  body #dnn_ctr418_Register_actionsRow {
    margin-left: 0 !important;
  }
}



.kk-new-box-simple {
  max-width: 1100px;
  margin: 70px auto;
  padding: 20px 30px;
  text-align: center;
}

.kk-new-box-label {
  position: relative;
  display: inline-block;
  color: #dc8a47;
  font-size: 15px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  margin-bottom: 20px;
  padding-top: 22px;
}

.kk-new-box-label::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 80px;
  height: 4px;
  border-radius: 999px;
  background: #dc8a47;
}

.kk-new-box-simple h2 {
  margin: 0 0 20px;
  color: #3f2d31;
  font-size: 54px;
  line-height: 1.05;
  font-weight: 800;
}

.kk-new-box-simple p {
  max-width: 760px;
  margin: 0 auto 32px;
  color: #4f5555;
  font-size: 19px;
  line-height: 1.7;
}

.kk-new-box-simple-btn {
  display: inline-block;
  padding: 15px 34px;
  border-radius: 16px;
  background: #9a8198;
  color: #fff !important;
  text-decoration: none !important;
  font-weight: 700;
  font-size: 14px;
  transition: .2s ease;
}

.kk-new-box-simple-btn:hover {
  background: #80687e;
}





.kk-box-flow {
  width: 100%;
  padding: 70px 20px 90px;
  background: #f6f1e8;
  box-sizing: border-box;
}

.kk-box-arrived {
  max-width: 980px;
  margin: 0 auto 95px;
  text-align: center;
}

.kk-arrived-line {
  width: 76px;
  height: 4px;
  background: #dc8a47;
  border-radius: 999px;
  margin: 0 auto 18px;
}

.kk-arrived-label {
  color: #dc8a47;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  margin-bottom: 18px;
}

.kk-box-arrived h2 {
  margin: 0 0 22px;
  color: #3f2d31;
  font-size: 52px;
  line-height: 1.1;
  font-weight: 800;
}

.kk-box-arrived p {
  max-width: 760px;
  margin: 0 auto;
  color: #4f5555;
  font-size: 20px;
  line-height: 1.7;
}

.kk-box-section-title {
  max-width: 1320px;
  margin: 0 auto 34px;
  text-align: left;
}

.kk-box-section-title span {
  display: block;
  margin-bottom: 10px;
  color: #789664;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.kk-box-section-title h2 {
  margin: 0;
  color: #3B2E31;
  font-size: 42px;
  line-height: 1.15;
  font-weight: 800;
}

.kk-box-steps-grid {
  max-width: 1320px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 28px;
}

.kk-box-step-card {
  position: relative;
  background: #ffffff;
  border-radius: 30px;
  padding: 18px 18px 32px;
  text-align: center;
  box-shadow: 0 16px 36px rgba(63,45,49,.08);
}

.kk-box-step-card img {
  width: 100%;
  height: 235px;
  object-fit: cover;
  border-radius: 24px;
  margin-bottom: 34px;
}

.kk-step-number {
  position: absolute;
  top: 228px;
  left: 50%;
  transform: translateX(-50%);
  width: 54px;
  height: 54px;
  background: #789664;
  color: #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  font-weight: 800;
}

.kk-box-step-card h3 {
  margin: 0 0 12px;
  color: #253d2c;
  font-size: 24px;
}

.kk-box-step-card p {
  margin: 0 auto;
  color: #4f5555;
  font-size: 17px;
  line-height: 1.6;
  max-width: 260px;
}
.kk-box-flow-cta {
  text-align: center;
  margin-top: 45px;
}

.kk-box-flow-btn {
  display: inline-block;
  padding: 15px 34px;
  border-radius: 16px;
  background: #9a8198;
  color: #fff !important;
  text-decoration: none !important;
  font-weight: 700;
  font-size: 16px;
  transition: .2s ease;
}

.kk-box-flow-btn:hover {
  background: #80687e;
}
.kk-box-flow {
  width: calc(100% - 40px);
  max-width: 1500px;
  margin: 70px auto;
  padding: 70px 20px 90px;
  background: #f6f1e8;
  border-radius: 42px;
  box-sizing: border-box;
}

/* Az Értékelések felirat és a sárga figyelmeztető doboz együttes elrejtése */
.ModHotcakesProductViewerC a[name="reviews"] + .row-fluid h3,
.ModHotcakesProductViewerC .alert.alert-warning {
    display: none !important;
}


/* 1. Az Értékelések (0) felirat és a sárga figyelmeztető doboz elrejtése */
.ModHotcakesProductViewerC a[name="reviews"] + .row-fluid h3,
.ModHotcakesProductViewerC .alert.alert-warning {
    display: none !important;
}

/* 2. A hc-rating (értékelési csillagok) elrejtése globalitásában */
.hc-rating {
    display: none !important;
}

/* A teljes címsor elrejtése a benne lévő span-nel együtt */
a[name="reviews"] + .row-fluid h3 {
    display: none !important;
}


/* Az Értékelés írása gomb teljes elrejtése */
#hcWriteReviewBtn,
#hcWriteReviewbtn {
    display: none !important;
}


/* Csak a felső Értékelések link melletti (0) szám elrejtése */
.ModHotcakesProductViewerC a[href="#reviews"] span {
    display: none !important;
}

/* Sárga DNN warning doboz elrejtése */
.dnnFormMessage.dnnFormWarning {
    display: none !important;
}