/* =======================================
   SP SIMPLE PORTFOLIO – MODERN ENGINEER STYLE
   Grid + Carousel – Egységes megjelenés
   ======================================= */

/* ========================
   KÖZÖS STÍLUSOK
   ======================== */
.sp-simpleportfolio-item-wrap,
.sp-simpleportfolio-grid .sp-simpleportfolio-item-wrap {
    position: relative;
    border-radius: 0px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 8px 22px rgba(0,0,0,0.12);
    transition: transform 0.5s cubic-bezier(0.4,0,0.2,1),
                box-shadow 0.5s cubic-bezier(0.4,0,0.2,1);
}

.sp-simpleportfolio-item:hover .sp-simpleportfolio-item-wrap,
.sp-simpleportfolio-grid .sp-simpleportfolio-item:hover .sp-simpleportfolio-item-wrap {
    transform: translateY(-6px);
    box-shadow: 0 20px 45px rgba(0,0,0,0.25);
}

.sp-simpleportfolio-img,
.sp-simpleportfolio-grid .sp-simpleportfolio-img {
    width: 100%;
    transition: transform 0.6s ease-out;
}

.sp-simpleportfolio-item:hover .sp-simpleportfolio-img,
.sp-simpleportfolio-grid .sp-simpleportfolio-item:hover .sp-simpleportfolio-img {
    transform: scale(1.06);
}

/* ========================
   INFO BLOKK – cím fent, leírás középen, kategória lent
   ======================== */
.sp-simpleportfolio-info,
.sp-simpleportfolio-grid .sp-simpleportfolio-info {
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    height: auto !important;
    padding: 18px !important;
    background: #fff;
    transition: background 0.5s ease-in-out, color 0.5s ease-in-out;
}

.sp-simpleportfolio-item:hover .sp-simpleportfolio-info,
.sp-simpleportfolio-grid .sp-simpleportfolio-item:hover .sp-simpleportfolio-info {
    background: #111;
}

/* Cím */
.sp-simpleportfolio-title a,
.sp-simpleportfolio-grid .sp-simpleportfolio-title a {
    font-size: 20px;
    font-weight: 700;
    color: #111;
    transition: color 0.5s ease-in-out;
}

.sp-simpleportfolio-item:hover .sp-simpleportfolio-title a,
.sp-simpleportfolio-grid .sp-simpleportfolio-item:hover .sp-simpleportfolio-title a {
    color: #ffb600;
}

/* Description */
.sp-simpleportfolio-intro,
.sp-simpleportfolio-grid .sp-simpleportfolio-intro {
    max-height: 120px;
    overflow: hidden;
    opacity: 1;
    margin-top: 8px;
    font-size: 14px;
    line-height: 1.4;
}

/* Kategória */
.sp-simpleportfolio-tags,
.sp-simpleportfolio-grid .sp-simpleportfolio-tags {
    font-size: 13px;
    font-weight: 600;
    color: #777;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-top: 10px;
    transition: color 0.5s ease-in-out;
}

.sp-simpleportfolio-item:hover .sp-simpleportfolio-tags,
.sp-simpleportfolio-grid .sp-simpleportfolio-item:hover .sp-simpleportfolio-tags {
    color: #ccc;
}

/* ========================
   FEHÉR VONAL A KATEGÓRIA FÖLÖTT
   ======================== */
.sp-simpleportfolio-item-wrap::after,
.sp-simpleportfolio-grid .sp-simpleportfolio-item-wrap::after {
    content: "";
    position: absolute;
    left: 0;
    right: 10%;
    bottom: 60px;
    height: 2px;
    background: #fff;
    border-radius: 1px;
}

/* ========================
   SLIDER / CAROUSEL SPECIFIKUS FIX
   ======================== */
.carousel-item .sp-simpleportfolio-item .sp-simpleportfolio-info {
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    height: auto !important;
}

/* ========================
   GRID 3 OSZLOPOS
   ======================== */
.sp-simpleportfolio-grid .sp-simpleportfolio-item.col-sm-4 {
    flex: 0 0 33.333%;
    max-width: 33.333%;
    padding: 10px;
}

@media (max-width: 992px) {
    .sp-simpleportfolio-grid .sp-simpleportfolio-item.col-sm-4 {
        flex: 0 0 50%;
        max-width: 50%;
    }
}

@media (max-width: 768px) {
    .sp-simpleportfolio-grid .sp-simpleportfolio-item.col-sm-4,
    .carousel-item .sp-simpleportfolio-item {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .sp-simpleportfolio-img {
        max-height: 220px;
        object-fit: cover;
    }
}

@media (max-width: 480px) {
    .sp-simpleportfolio-img {
        max-height: 180px;
    }
}
/* SP Simple Portfolio – árnyék eltüntetése slider és grid esetén */
.sp-simpleportfolio-item-wrap,
.sp-simpleportfolio-item-wrap:hover,
.sp-simpleportfolio-grid .sp-simpleportfolio-item-wrap,
.sp-simpleportfolio-grid .sp-simpleportfolio-item-wrap:hover {
    box-shadow: none !important;
}
/* SP Simple Portfolio – stabil, finom hover effekt */
.sp-simpleportfolio-item-wrap {
    transition: transform 0.3s ease; /* finom mozgás */
}

.sp-simpleportfolio-item:hover .sp-simpleportfolio-item-wrap {
    transform: translateY(-5px); /* enyhe emelkedés */
}

/* ==============================
   MENÜ HÁTTÉR - NEM-STICKY ÉS STICKY
   ============================== */
header.header .main-menu-wrapper .main-menu {
    background-color: #4A4A4A !important; /* tetszőleges szín */
}

/* ==============================
   MENÜ LINKEK SZÍNE
   ============================== */
header.header .main-menu-wrapper .main-menu a {
    color: #ffffff !important; /* alap szín */
    text-decoration: none;
}

header.header .main-menu-wrapper .main-menu a:hover,
header.header .main-menu-wrapper .main-menu a:focus {
    color: #ffd700 !important; /* hover szín, pl. sárga */
}

/* ==============================
   AJÁNLATKÉRÉS GOMB SZÍNEK
   ============================== */
#btn-j2nYbKFXDlcotwuo-quWT.sppb-btn-link {
    background-color: #ff6600 !important; /* alap gomb szín */
    color: #ffffff !important; /* gomb szöveg színe */
    border-radius: 0 !important; /* ha kerekítés van, itt nullázva */
}

#btn-j2nYbKFXDlcotwuo-quWT.sppb-btn-link:hover,
#btn-j2nYbKFXDlcotwuo-quWT.sppb-btn-link:focus {
    background-color: #e65c00 !important; /* hover szín */
    color: #ffffff !important;
}

.left-sticky-bar .tw-sticky-menu {
  position: fixed;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 9999;
  display: flex;
  flex-direction: column;
}

/* GOMB – alapállapot */
.left-sticky-bar .item {
  display: flex;
  align-items: center;
  gap: 2px;                        /* ikonok közti minimális távolság */
  background: #f5f5f5;              /* világos prémium szürke */
  color: #3B3940;                   /* ikon + szöveg */
  padding: 12px 14px;
  margin-bottom: 1px;               /* finom vizuális elválasztás */
  text-decoration: none;
  border-radius: 0;                  /* szögletes */
  white-space: nowrap;
  width: 48px;                       /* csak ikon látszik alapban */
  overflow: hidden;
  transition: all 0.3s ease;

  /* enyhe shadow + finom inset a mélységhez */
  box-shadow: 0 1.5px 3px rgba(0,0,0,0.15), inset 0 -1px 0 rgba(0,0,0,0.03);
}

/* Ikon */
.left-sticky-bar .item i {
  font-size: 18px;
  width: 20px;
  text-align: center;
  flex-shrink: 0;
}

/* Szöveg – alapból rejtve */
.left-sticky-bar .item span {
  opacity: 0;
  margin-left: 10px;
  transition: opacity 0.3s ease;
  color: #3B3940;
}

/* Hover – nyíljon ki a gomb, sárga box */
.left-sticky-bar .item:hover {
  width: 240px;                      /* kinyílás mérete */
  background: #FFC900;               /* sárga hover */
  color: #fff;                        /* ikon + szöveg fehér */
}

/* Hover – szöveg látszik */
.left-sticky-bar .item:hover span {
  opacity: 1;
}

/* Mobilon elrejtve */
@media (max-width: 991px) {
  .left-sticky-bar {
    display: none;
  }
}

.form-builder-radio-label:hover {
    color: #000000;
}

input[type="radio"]:checked + .form-builder-radio-label {
    color: #000000;
    font-weight: 600;
}

/* === FORCE FULL WIDTH – Konstra + Helix safe === */

/* container széthúzása */
.force-fullwidth #sp-main-body .container {
  max-width: 100% !important;
  padding-left: 0;
  padding-right: 0;
}

/* main content teljes szélesség */
.force-fullwidth #sp-main-body main,
.force-fullwidth #sp-main-body .sp-main-body {
  flex: 0 0 100% !important;
  max-width: 100% !important;
}

/* ha sidebar grid még élne */
.force-fullwidth #sp-main-body .row > [class*="col-"] {
  max-width: 100% !important;
  flex: 0 0 100% !important;
}

/* SP Page Builder container se szűkítsen */
.force-fullwidth .sppb-row-container {
  max-width: 100%;
}

/* ======================================
   N3T Cookie Consent – FULL SQUARE UI
   Konstra compatible
   ====================================== */

/* Global radius reset */
.cc_div *,
.cc_div *::before,
.cc_div *::after,
.cc-trigger,
.cc-trigger * {
    border-radius: 0 !important;
}

/* Buttons */
.cc_div .c-bn,
.cc_div button,
.cc_div input,
.cc_div a {
    border-radius: 0 !important;
}

/* Dialogs & containers */
#cm,
#s-inr,
#cs,
#s-hdr,
#s-bns,
#s-bl,
.cc_div .c-bl {
    border-radius: 0 !important;
}

/* Toggles (VERY IMPORTANT) */
.cc_div .b-tg,
.cc_div .b-tg .c-tg,
.cc_div .b-tg .c-tg::after {
    border-radius: 0 !important;
}

/* Trigger handle – all positions */
.cc-trigger.cc-trigger-handle,
.cc-trigger.cc-trigger-handle.cc-trigger-bottom,
.cc-trigger.cc-trigger-handle.cc-trigger-top,
.cc-trigger.cc-trigger-handle.cc-trigger-middle {
    border-radius: 0 !important;
}

/* Iframe consent buttons */
div[data-service] .c-l-b,
div[data-service] .c-la-b {
    border-radius: 0 !important;
}

/* Kill round loader */
div[data-service] .c-ld,
div[data-service] .c-ld::after {
    border-radius: 0 !important;
}
