/*
Theme Name: Porto Child
Theme URI: https://www.portotheme.com/wordpress/porto
Author: P-THEMES
Author URI: https://www.portotheme.com/
Description: Porto Responsive WordPress + eCommerce Theme.
Version: 1.1
Template: porto
License: Commercial
License URI: http://themeforest.net/licenses/regular_extended
Tags: woocommerce, corporate, ecommerce, responsive, blue, black, green, white, light, dark, red, two-columns, three-columns, four-columns, left-sidebar, right-sidebar, fixed-layout, responsive-layout, custom-menu, editor-style, featured-images, flexible-header, full-width-template, microformats, post-formats, rtl-language-support, sticky-post, theme-options, translation-ready, accessibility-ready
*/

/*************** ADD YOUR CUSTOM CSS HERE  ***************/

/******************************************************/
/* Global: Abstand des 1. Inhaltselementes vom Header */
/******************************************************/
.page-content{
	padding-top: 40px !important;
}

div.wpb_single_image .vc_single_image-wrapper.vc_box_rounded img{
	border-radius: 25px !important;
}

/******************************/
/* Globale CSS-Einstellungen: */
/******************************/
.white{color: #fff !important;}
.orange{color: var(--porto-primary-color) !important;}

/******************************/
/* Standardbuttons einfärben: */
/******************************/

.vc_btn3.vc_btn3-color-orange.vc_btn3-style-modern {
    background-color: var(--porto-secondary-color) !important;;
    border-color: var(--porto-secondary-color) !important;;
    color: var(--porto-primary-color) !important;
}

.vc_btn3.vc_btn3-color-danger.vc_btn3-style-modern {
    background-color: var(--porto-primary-color) !important;
    border-color: var(--porto-primary-color) !important;
    color: #fff !important;
}

/*********************************/
/* Import Adobe-Kit-Schriften */
/*********************************/

@import url("https://use.typekit.net/lvh7lnn.css"); /* Font: Gelika Black */

@import url("https://p.typekit.net/p.css?s=1&k=lvh7lnn&ht=tk&f=28677.51826&a=3346760&app=typekit&e=css");

@font-face {
font-family:"priori-sans";
src:url("https://use.typekit.net/af/06ecb6/00000000000000007735b24e/31/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n9&v=3") format("woff2"),url("https://use.typekit.net/af/06ecb6/00000000000000007735b24e/31/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n9&v=3") format("woff"),url("https://use.typekit.net/af/06ecb6/00000000000000007735b24e/31/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n9&v=3") format("opentype");
font-display:auto;font-style:normal;font-weight:900;font-stretch:normal;
}

@font-face {
font-family:"gelica";
src:url("https://use.typekit.net/af/24aa4c/0000000000000000774ba06a/31/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n9&v=3") format("woff2"),url("https://use.typekit.net/af/24aa4c/0000000000000000774ba06a/31/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n9&v=3") format("woff"),url("https://use.typekit.net/af/24aa4c/0000000000000000774ba06a/31/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n9&v=3") format("opentype");
font-display:auto;font-style:normal;font-weight:900;font-stretch:normal;
}

/* Hauptmenü-Links im Mega-Menü */
#mega-menu-wrap-main_menu #mega-menu-main_menu > li.mega-menu-item > a.mega-menu-link {
  font-family: "gelica", sans-serif !important; /* Adobe Font */
  font-weight: 900 !important;                  /* Black */
  color: #e84a3b !important;                    /* Orange Text standard */
  transition: all 0.2s ease-in-out;
}

/* Hover: Unterstrichen, Textfarbe bleibt gleich */
#mega-menu-wrap-main_menu #mega-menu-main_menu > li.mega-menu-item > a.mega-menu-link:hover {
  color: #f2dbb0 !important;
}

/* Alle Headlines H1-H6 */
h1, h2, h3, h4, h5, h6 {
  font-family: "gelica", sans-serif !important;
}

.rkv-floating-menu .menu-item {
  font-family: "gelica", sans-serif !important;
}

.rkv-floating-menu .menu-item::before {
  font-family: "gelica", sans-serif !important;
}

.white{color: #fff !important;}

/* FAQ-Bereich Farbe Headlines */
.vc_tta-color-orange.vc_tta-style-flat .vc_tta-panel-heading {
    background-color: var(--porto-primary-color) !important;
}

/* Blogbeitrag Detailseite ohne Meta (Autor, Datum, etc.) */
.post-item .post-date, article.post .post-date {
    visibility: hidden;
}

body.single-post article.post .post-meta {
    visibility: hidden;
}

/*********************************/
/* Sticky Buttons im Footer-HTML */
/*********************************/

/* Container mittig rechts */
.rkv-floating-menu {
  position: fixed;
  top: 50%;
  right: 5px;
  transform: translateY(-50%);
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  z-index: 9999;
}

/* Buttons quadratisch, abgerundet */
.rkv-floating-menu .menu-item {
  width: 75px; 
  height: 75px;
  color: #fff !important;
  border-radius: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 9px;
  box-shadow: 0 3px 8px rgba(0,0,0,0.3);
  font-size: 26px;
  position: relative;
  text-decoration: none;
  transition: all 0.2s;
}

/* individuelle Buttonfarben */
.rkv-floating-menu .menu-item:nth-child(1){
  background-color:#a53ef4;
}

.rkv-floating-menu .menu-item:nth-child(2){
  background-color:#f2dbb0;
}

.rkv-floating-menu .menu-item:nth-child(3){
  background-color:#e84a3b;
}

/* Hover Effekt */
.rkv-floating-menu .menu-item:hover {
  background-color:#fff !important;
}

/* Hover Iconfarben */
.rkv-floating-menu .menu-item:nth-child(1):hover {
  color:#a53ef4 !important;
}

.rkv-floating-menu .menu-item:nth-child(2):hover {
  color:#f2dbb0 !important;
}

.rkv-floating-menu .menu-item:nth-child(3):hover {
  color:#e84a3b !important;
}

/* Tooltips links vom Button (nur Desktop) */
.rkv-floating-menu .menu-item::before {
  content: attr(data-label);
  position: absolute;
  right: 110%;
  top: 50%;
  transform: translateY(-50%);
  color: #fff !important;
  font-size: 18px !important;
  padding: 8px 14px;
  border: 1px solid #fff;
  border-radius: 4px;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s;
}

/* Tooltip Farben passend zum Button */
.rkv-floating-menu .menu-item:nth-child(1)::before{
  background:#a53ef4;
}

.rkv-floating-menu .menu-item:nth-child(2)::before{
  background:#f2dbb0;
}

.rkv-floating-menu .menu-item:nth-child(3)::before{
  background:#e84a3b;
}

/* Tooltip nur auf Desktop sichtbar */
@media (min-width: 769px) {
  .rkv-floating-menu .menu-item:hover::before {
    opacity: 1;
  }
}

/* Mobile Tooltips ausblenden */
@media (max-width: 768px) {
  .rkv-floating-menu .menu-item::before {
    display: none;
  }
}

/*********************************/
/*       Mega-Menü Styling       */
/*********************************/

/* Flexbox für Mega-Menü Spalten – flexibel für beliebig viele Spalten */
#mega-menu-wrap-main_menu #mega-menu-main_menu li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-row > ul.mega-sub-menu {
    display: flex !important;
    flex-wrap: wrap;
    gap: 30px; /* Abstand zwischen allen Spalten */
}

/* Jede Spalte flexibel */
#mega-menu-wrap-main_menu #mega-menu-main_menu li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-row > ul.mega-sub-menu > li.mega-menu-column {
    flex: 1 1 0;        /* Jede Spalte gleich breit */
    box-sizing: border-box;
}

/* Untermenü Items Text zentrieren */
#mega-menu-wrap-main_menu #mega-menu-main_menu li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-row > ul.mega-sub-menu > li.mega-menu-column > ul.mega-sub-menu > li.mega-menu-item {
    width: 100%;
    text-align: center !important;
}

/* Mega-Menü Links – Gelica Black, Farbe Orange, Hover-Unterstrich */
#mega-menu-wrap-main_menu #mega-menu-main_menu > li.mega-menu-megamenu > ul.mega-sub-menu li.mega-menu-column-standard > a.mega-menu-link,
#mega-menu-wrap-main_menu #mega-menu-main_menu > li.mega-menu-megamenu > ul.mega-sub-menu li.mega-menu-column > ul.mega-sub-menu > li.mega-menu-item > a.mega-menu-link {
    font-family: "gelica", sans-serif !important;
    font-weight: 900 !important;
    color: #e84a3b !important; /* Standard Orange */
    text-decoration: none !important;
    font-size: 18px;
    text-align: left;
    margin: 0 0 15px 0;
    transition: all 0.2s;
}


/* Responsive: Mobile, Spalten untereinander */
@media only screen and (max-width: 768px) {
    #mega-menu-wrap-main_menu #mega-menu-main_menu li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-row > ul.mega-sub-menu {
        display: block !important;
        gap: 0;
    }

    #mega-menu-wrap-main_menu #mega-menu-main_menu li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-row > ul.mega-sub-menu > li.mega-menu-column {
        flex: none;
        width: 100%;
        margin-right: 0;
    }
}

/* ---------------------- Hover Icon 3. Ebene + Hover-Schriftart ---------------------- */
@media (min-width: 769px) {
    /* 3. Ebene: Links – normale Schriftart unverändert */
    #mega-menu-wrap-main_menu #mega-menu-main_menu li.mega-menu-megamenu ul.mega-sub-menu li.mega-menu-column > ul.mega-sub-menu > li.mega-menu-item > ul.mega-sub-menu > li.mega-menu-item > a.mega-menu-link {
        position: relative !important;
        padding-left: 30px !important; /* Platz für Icon */
        background: transparent !important; /* keine weiße Hinterlegung */
        color: inherit !important; /* Standardfarbe übernehmen */
        transition: color 0.2s ease, font-family 0.2s ease !important;
    }

    /* Pseudo-Element für Icon */
    #mega-menu-wrap-main_menu #mega-menu-main_menu li.mega-menu-megamenu ul.mega-sub-menu li.mega-menu-column > ul.mega-sub-menu > li.mega-menu-item > ul.mega-sub-menu > li.mega-menu-item > a.mega-menu-link::before {
        content: '' !important;
        position: absolute !important;
        left: 0 !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        width: 20px !important;
        height: 20px !important;
        background-image: url('https://foodtruck-catering.com/2026/wp-content/uploads/2026/03/hovericon.png') !important;
        background-size: contain !important;
        background-repeat: no-repeat !important;
        opacity: 0 !important;
        transition: opacity 0.2s ease !important;
    }

    /* Hover-Effekt: Schriftfarbe + Gelica + Icon */
    #mega-menu-wrap-main_menu #mega-menu-main_menu li.mega-menu-megamenu ul.mega-sub-menu li.mega-menu-column > ul.mega-sub-menu > li.mega-menu-item > ul.mega-sub-menu > li.mega-menu-item > a.mega-menu-link:hover {
        color: var(--porto-secondary-color) !important; /* Hover-Farbe */
        background: transparent !important; /* keine weiße Hinterlegung */
        font-family: "gelica", sans-serif !important; /* Nur beim Hover */
    }

    /* Icon beim Hover einblenden */
    #mega-menu-wrap-main_menu #mega-menu-main_menu li.mega-menu-megamenu ul.mega-sub-menu li.mega-menu-column > ul.mega-sub-menu > li.mega-menu-item > ul.mega-sub-menu > li.mega-menu-item > a.mega-menu-link:hover::before {
        opacity: 1 !important;
    }
}


/* ---------------------- Rechte Spalte im Menü "Service" als Text mit Kasten ---------------------- */

#mega-menu-wrap-main_menu #mega-menu-main_menu li.submenue-rechts{
	border: 1px solid #000 !important;
	border-radius: 20px !important;
	padding: 20px !important;
	background: #fff !important;
}

#mega-menu-wrap-main_menu #mega-menu-main_menu li.submenue-rechts h4,
#mega-menu-wrap-main_menu #mega-menu-main_menu li.submenue-rechts p{
	color: var(--porto-primary-color) !important;
	text-align: left !important;
}

.subnaviheaderbild{
	border-radius: 20px 20px 0 0 !important;
}

/**************************************/
/* Startseite abgerundeter Infokasten */
/**************************************/

/* Row bleibt Fullwidth */
.custom-card-row{
    width:100%;
}

/* eigentliche Karte */
.custom-card-row{
    max-width: 85%;   /* HIER steuerst du die Breite */
    margin-left:auto;
    margin-right:auto;
    border-radius:40px;
    overflow:hidden;
}

/* Spalten Padding entfernen */
.custom-card-row .vc_column-inner{
    padding:0;
}

/* Bild */
.custom-card-image img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}

/* Text */
.custom-card-text{
    background:#f2dbb0;
    padding:60px;
    display:flex;
    flex-direction:column;
    justify-content:center;
}

/* Headline */
.custom-card-text h2{
    color:#e0482c;
}

/* Text */
.custom-card-text p{
    color:#e0482c;
}

/***********************************************/
/*    Bildgalerien Kacheln mit runden Ecken    */
/***********************************************/

.wpb_image_grid_ul li.isotope-item {
  border-radius: 20px;
  overflow: hidden;
}

.wpb_image_grid_ul li.isotope-item img {
  display: block;
  width: 100%;
  height: auto;
}




.wpb_image_grid_ul li.isotope-item a {
  display: block;
  margin: 8px;
  border-radius: 20px;
  overflow: hidden;
}

.wpb_image_grid_ul li.isotope-item img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 20px;
}







/*********************************/
/*         Kontaktformular       */
/*********************************/

/* ---------------------- Grundcontainer ---------------------- */
.ffc-form-container,
.wpcf7-form.ffc-form-container {
    background-color: #e84a3b !important;
    padding: 40px 30px !important;
    border-radius: 30px !important;
    color: #fff !important;
    font-family: sans-serif !important;
    box-sizing: border-box !important;
}

/* ---------------------- Zweispaltige Felder Desktop ---------------------- */
.ffc-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 25px !important;
    margin-bottom: 30px !important;
}

/* ---------------------- Einzelne Felder ---------------------- */
.ffc-field {
    display: flex !important;
    flex-direction: column !important;
    margin-bottom: 0px !important;
}

/* ---------------------- Inputs / Textareas / Selects ---------------------- */
.ffc-input,
.ffc-textarea,
.ffc-form-container select,
.ffc-form-container textarea {
    width: 100% !important;
    padding: 16px 18px !important;
    border-radius: 30px !important;
    background: #fff !important;
    color: #e84a3b !important;
    font-size: 15px !important;
    margin-bottom: 20px !important;
	margin-top: 10px !important;
    box-sizing: border-box !important;
    line-height: 1.4 !important;
}

/* Textarea Höhe */
.ffc-textarea {
    min-height: 100px !important;
}

/* ---------------------- Überschriften ---------------------- */
.ffc-section-title-full {
    font-family: "gelica", sans-serif !important;    
    font-size: 1.2em !important;
    font-weight: 700 !important;
    margin: 35px 0 45px !important;
    padding: 10px 15px !important;
    border-radius: 20px !important;
    background-color: #fff !important;
    color: #e84a3b !important;
}

/* Sub-Absätze */
.ffc-subsection {
    margin-bottom: 20px !important;
}
.ffc-subtitle {
    margin-bottom: 12px !important;
    font-weight: 600 !important;
}

/* ---------------------- Checkbox / Radio ---------------------- */
.ffc-subsection .wpcf7-list-item-label,
.ffc-subsection .wpcf7-list-item-label span {
    color: #fff !important;
    font-weight: normal !important;
}

.ffc-form-container input[type="checkbox"],
.ffc-form-container input[type="radio"] {
    width: auto !important;
    margin: -5px 5px 0 0 !important;
    vertical-align: middle !important;
    position: relative !important;
    top: 1px !important;
}

/* ---------------------- Fehlermeldungen ---------------------- */
.wpcf7-not-valid-tip {
    color: #fff !important;
    background: rgba(0,0,0,0.2) !important;
    padding: 5px 10px !important;
    border-radius: 10px !important;
    margin-top: 5px !important;
}

/* ---------------------- Submit Button ---------------------- */
.ffc-submit {
    font-family: "gelica", sans-serif !important;
	padding: 12px 25px !important;
    border-radius: 30px !important;
    border: none !important;
    background-color: #fff !important;
    color: #e84a3b !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    margin-top: 25px !important;
}

/* ---------------------- Datenschutzerklärung ---------------------- */
.ffc-datenschutz-container {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin-top: 20px !important;
    margin-bottom: 20px !important;
    flex-wrap: wrap !important;
}

.ffc-datenschutz {
    color: #fff !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
}

.ffc-datenschutz-link a {
    color: #fff !important;
    text-decoration: underline !important;
    font-weight: 600 !important;
}

/* ---------------------- Responsive Mobile ---------------------- */
@media (max-width: 768px) {
    .ffc-grid {
        grid-template-columns: 1fr !important; /* Zweispaltig → 1 Spalte */
        gap: 15px !important;
    }

    .ffc-input,
    .ffc-textarea,
    .ffc-form-container select,
    .ffc-form-container textarea {
        width: 100% !important;
    }

    .ffc-datenschutz-container {
        flex-direction: row !important;
        flex-wrap: wrap !important;
        gap: 5px !important;
    }

    .ffc-datenschutz-link {
        flex-basis: 100% !important;
    }
}

/*********************************/
/*       Footer Styling       */
/*********************************/

/* Weiße Linie in Welle unterdrücken */

.footer-wave{
    background:#fff;
    line-height:0;
    overflow:hidden;
}

.footer-wave svg{
    display:block;
    width:100%;
    height:140px;
}

.footer-wave path{
    transform:translateY(1px);
}

