/*
	Theme Name: KNOLLE-DESIGN-Theme
	Theme URI: https://knolle.biz/
	Description: Willkommen zum Knolle-Theme – die perfekte Grundlage für dein Webprojekt! Entwickelt und bereitgestellt von Jens Knolle, bietet dieses Theme eine Auswahl an durchdachten Features, die deine Arbeit mit Wordpress noch effizienter und kreativer machen.
	Author: Jens Knolle
	Author URI: https://knolle.biz/
	Template: Divi
	Version: 1.0.0
	Tag: Child Theme, Knolle Biz 
	License: GNU General Public License v2 or later
	License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/


/* ==========================================================================
   ROOT SECTION
   ========================================================================== */

* {
	margin:0;
	padding:0;
	box-sizing: border-box;
}

html {
	font-size: 62.5%;
}

#page-container {overflow:hidden}
 
a[href^="#"] {
	cursor:pointer;
}

:root {
	--kdac: #88724e;

	--c3: #f28b2d; /* Orange */
	--c4: #e6007e; /* pink */
	
	--c5: #422713; /* Dunkelbraun */
	--c6: #16172f; /* Dunkelblau */
	--c7: #b2bbde; /* Hellblau */
	--c8: #f1f1f1; /* lightgrey */
	
	--bp1:767px; /* breakpoint mobile */
	--bp2:980px; /* breakpoint tablet */
	--bp3:1280px; /* breakpoint narrow screen */
}


.mce-panel .mce-stack-layout-item.mce-first {
	position: sticky!important;
	top: -60px;
}


body.admin-bar .et-l--header {
  top: 32px; /* Höhe der WP-Adminbar */
}
@media (max-width: 782px) {
  body.admin-bar .et-l--header {
    top: 46px; /* höhere mobile Adminbar */
  }
}



.kd_align_center_section,
.kd_align_center_row .et_pb_column,
.kd_align_center_module {
   display: flex;
   flex-direction: column;
   justify-content: center;
}


.kd_align_center_section_2,
.kd_align_center_row_2 .et_pb_column,
.kd_align_center_module_2 {
   display: flex;
   flex-direction: row;
   align-items: center;
	flex-wrap:wrap;
}

/* ==========================================================================
   MENU SECTION
   ========================================================================== */

/* Active-Status im Submenü */
/*
.current_page_item a span{
  color: var(--c3);
}
*/
/* END Active-Status im Submenü */




/* Top-Header */
@media (max-width: 360px) {
	.top_header p {
	  font-size:11px !important;
	}
	.top_header_icon .et-pb-icon {
	  font-size:16px !important;
	}
}
@media (min-width: 361px) {
	.top_header p {
	  font-size:14px !important;
	}
	.top_header_icon .et-pb-icon {
	  font-size:20px !important;
	}	
}



/* ==========================================================================
   CONTENT SECTION
   ========================================================================== */


	/*  Dynamische Fontgrößen  */
	.et_pb_module.et_pb_text h1, 
	.header-content h1, 
	.et_pb_column .et_pb_module h1, 
	h1, 
	.et_pb_module.et_pb_text.h1_substitute p {
/*		font-size: clamp(3.6rem, 5vw, 6rem);
		line-height: clamp(4rem, 6vw, 7rem); */
	    font-size: clamp(3.6rem, 3.4vw, 6rem);
	    line-height: clamp(4rem, 4vw, 7rem);		
		}

	.et_pb_module.et_pb_text h2, 
	.header-content h2, 
	.et_pb_column .et_pb_module h2, 
	.et_pb_de_mach_content h2, 
	h2 {
/*		font-size: clamp(2.4rem, 5vw, 3.8rem);
		line-height: clamp(3rem, 5vw, 4rem); */
	    font-size: clamp(2.4rem, 3.2vw, 3.8rem);
    	line-height: clamp(3rem, 3.8vw, 4rem);		
		}

	.et_pb_module.et_pb_text h3, 
	.header-content h3, 
	.et_pb_column .et_pb_module h3,
	h3 {
/*		font-size: clamp(2.2rem, 5vw, 3rem);
		line-height: clamp(2.6rem, 5vw, 3.6rem); */
	    font-size: clamp(2.2rem, 3vw, 3rem);
	    line-height: clamp(2.6rem, 3.4vw, 3.6rem);		
		}

	.et_pb_module.et_pb_text h4, 
	.header-content h4, 
	.et_pb_column .et_pb_module h4, 
	h4 {
/* 		font-size: clamp(2.2rem, 5vw, 2.4rem);
		line-height: clamp(2.2rem, 5vw, 3.8rem); */
	    font-size: clamp(2.0rem, 2.8vw, 2.4rem);
	    line-height: clamp(2.2rem, 3vw, 3.2rem);	
		}

	.et_pb_module.et_pb_text h5, 
	.header-content h5, 
	.et_pb_column .et_pb_module h5, 
	h5 {
/*		font-size: clamp(2rem, 5vw, 2.2rem);
		line-height: clamp(2.2rem, 5vw, 3rem); */
	    font-size: clamp(3.6rem, 3.4vw, 6rem);
    	line-height: clamp(4rem, 4vw, 7rem);	
		}

	.et_pb_module.et_pb_text h6, 
	.header-content h6, 
	.et_pb_column .et_pb_module h6, 
	h6 {
/*		font-size: clamp(1.8rem, 5vw, 2.0rem);
		line-height: clamp(2rem, 5vw, 2.5rem); */
	    font-size: clamp(1.7rem, 2.4vw, 2rem);
	    line-height: clamp(2rem, 2.8vw, 2.5rem);		
		}

	.et_pb_module.et_pb_text p, 
	.et_pb_module.et_pb_text span, 
	.et_pb_module.et_pb_text li,
	.et_pb_blurb_description p,
	.et_pb_de_mach_content p, 
	.et_pb_de_mach_content li,
	.et_pb_de_mach_content,
	.dmach-acf-item-content p,
	.dmach-acf-value p,
	.dmach-acf-value span,
	.dmach-acf-value li {
/* 		font-size: clamp(1.8rem, 5vw, 2rem);
		line-height: clamp(2.4rem,5vw,3rem); */
	    font-size: clamp(1.7rem, 2.1vw, 2rem);
	    line-height: clamp(2.4rem, 2.6vw, 3rem);	
		}

	.et_pb_module.et_pb_text p a {
		}

	/* END Dynamische Fontgrößen  */



/* Text farbig hinterlegen */
.kd-highlight {
    background: var(--c4); /* deine Farbe */
    padding: 0.15em 0.35em;

    display: inline;
    line-height: inherit !important;
    font-size: inherit !important;
    font-weight: inherit;
    font-family: inherit;

    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
}






/* autom. Silbentrennung aktivieren */
body {
    -ms-hyphens: auto;
    -webkit-hyphens: auto;
    hyphens: auto;
}

.nohyphens {
    -moz-hyphens: none;
    -ms-hyphens: none;
    -webkit-hyphens: none;
    hyphens: none;
}

.nohyphens.et_pb_module {
    word-wrap: normal!important;
    overflow: visible!important;
}
/* END autom. Silbentrennung aktivieren */


/*Underline Links*/
    p a:hover {
        text-decoration:underline !important;
    }
/*END Underline Links*/



/*White Links*/
    .whitelinks a {
        color:#ffffff;
    }

    .blacklinks a {
        color:#000;
    }
/*END White Links*/



/* Dateinamen unter Gallerybild entfernen */
    .mfp-title {
        display:none !important;
    }
/* END Dateinamen unter Gallerybild entfernen */



/* 3 Bilder nebeneinander on mobile */
    @media only screen and (max-width:980px) {
        .three-columns .et_pb_column {
        width: 33.33%!important;
    }
    }
/* END */





/* ============================
   Gallery pimpen
   ============================ */
@media only screen and (max-width: 980px
)  {
    .et_pb_gallery_grid .et_pb_gallery_item img {
        width:100%;
    }
}




/* ============================
   Hotel A–Z: Grid-Layout
   ============================ */

.az-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  column-gap: 60px;
  row-gap: 60px;
}

.az-item h3 {
  font-weight: 600;
  font-size: 1.9rem;
  margin: 0 0 6px;
}

.az-item p {
  margin: 0;
  font-size: 1.7rem;
  line-height: 1.4;
}

/* Tablet: 2 Spalten */
@media (max-width: 980px) {
  .az-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Phone: 1 Spalte */
@media (max-width: 767px) {
  .az-grid {
    grid-template-columns: 1fr;
  }
}


/* ORT */
.az-item h4 {
    font-size: 1.3rem;
    font-weight: 600;
    color: var(--c4); /* pink, oder Wunschfarbe */
    margin-bottom: 4px;
    line-height: 1.3;
}

/* RESTAURANTNAME */
.az-item h3 {
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--c5); /* Dunkelbraun – aus deinem Set */
    margin-bottom: 8px;
    line-height: 1.3;
}

/* PREISINDEX: immer Farbe c3 */
.price {
    display: inline-block;
    font-size: 0.9em;
    letter-spacing: 1px;
    font-weight: 600;
    margin-bottom: 6px;
    color: var(--c3) !important; /* Orange */
    opacity: 0.9;
}




/* ============================
   BREADCRUMB – CLEAN VERSION
   ============================ */

/* --- Breadcrumb – Reset & Layout --- */
.kd-breadcrumb {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    font-size: 1.6rem;
    color: #565656;
    align-items: center;
}

/* --- Links normalisieren (Divi überschreibt sonst) --- */
.kd-breadcrumb a,
.kd-breadcrumb .current,
.kd-breadcrumb span {
    font-size: inherit;
    line-height: 1.4;         /* FIX: verhindert "Hochhängen" */
    vertical-align: baseline; /* verhindert Baseline-Shifts */
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
}

/* --- Link-Farben --- */
.kd-breadcrumb a {
    color: var(--c3); /* Orange */
    text-decoration: none;
}

.kd-breadcrumb a:hover {
    text-decoration: underline;
}

/* --- Aktuelle Seite --- */
.kd-breadcrumb .current {
    color: #565656;
    font-weight: 600;
}

/* --- Trenner / --- */
.kd-breadcrumb span {
    color: var(--c4); /* pink */
}

/* --- Mobile --- */
@media (max-width: 767px) {
    .kd-breadcrumb {
        font-size: 1.3rem;
        gap: 4px;
        line-height: 1.3;
        margin-top: 10px;
        margin-bottom: 20px;
    }
}

@media (max-width: 360px) {
    .kd-breadcrumb {
        font-size: 1.2rem;
        gap: 3px;
    }
}



/* ============================================
   HERO BUTTONS – MOBILE OPTIMIERUNG
   ============================================ */

/* Basis (Desktop) unangetastet lassen */

/* Tablet Portrait & kleiner (≤ 980px) */
@media (max-width: 980px) {
    .et_pb_button.kd-hero-btn {
        font-size: 18px !important;
        padding: 14px 32px !important;
        border-radius: 10px !important;
    }
}

/* Buttons auf mittelgroßen Tablets anpassen (768–900px) */
@media (min-width: 768px) and (max-width: 900px) {
    .et_pb_button.kd-hero-btn {
        font-size: 16px !important;
        padding: 14px 28px !important;
    }
}


/* Mobile Landscape & smaller (≤ 767px) */
@media (max-width: 767px) {
    .et_pb_button.kd-hero-btn {
        font-size: 16px !important;
        padding: 12px 26px !important;
        border-radius: 10px !important;
    }
}

/* Small Phones (≤ 480px) */
@media (max-width: 480px) {
    .et_pb_button.kd-hero-btn {
        font-size: 15px !important;
        padding: 10px 22px !important;
        border-radius: 8px !important;
    }
}

/* Very Small Phones (≤ 360px) */
@media (max-width: 360px) {
    .et_pb_button.kd-hero-btn {
        font-size: 14px !important;
        padding: 9px 18px !important;
        border-radius: 8px !important;
    }
}




/* Gäste Info-Center Grid
   -------------------------------------------------- */
/* Gäste-Infocenter Karten – Bild wie Hintergrund, fix 240px hoch */
.gi-blurb .et_pb_main_blurb_image {
    height: 320px;
    overflow: hidden;          /* schneidet überstehendes Bild ab */
}

.gi-blurb .et_pb_main_blurb_image img {
    width: 100%;
    height: 100%;
    object-fit: cover;         /* verhält sich wie background-size: cover */
    object-position: center center; /* Wichtig! Bild zentriert */
    display: block;
}






/* TV-Sender-Liste
   -------------------------------------------------- */
/* Headings */
.tv-list-title {
  margin-bottom: 8px;
}

/* UL Styling */
.tv-list {
  list-style: none;
  padding-left: 0;
  margin: 0 0 32px 0;
}

.tv-list li {
  padding: 2px 0;
  font-size: 1.6rem;
  line-height: 1.4;
  border-bottom: 1px solid rgba(0,0,0,0.06);
}

.tv-list li:last-child {
  border-bottom: none;
}

/* Klein “free” */
.free {
  font-size: 1.4rem;
  opacity: 0.6;
}












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


	/* oberer Footer Teil */
	.kd_footer {}
	/* End oberer Footer Teil */


	/* Footer Menu und KD-Icon stylen */
		.kd_footer_bottom .et_pb_column {
			display:flex;
			flex-direction:row;
			align-items:center;
			justify-content: space-between;
			padding: 0 !important;
		}

		.kd_footer_bottom .et_pb_image {
		  width:20px;
		  max-width:20px;
		  margin-top:3px;
		}

		.kd_footer_bottom .et_pb_menu__menu {
		  padding:0
		}

		.kd_footer_bottom .et_pb_module {
		  width:100%
		}
	/* END Footer Menu und KD-Icon stylen */



	/* Footer Menü Schriftgröße */
		.kd_footer_menu .et_pb_menu__menu {
		font-size: clamp(0.875rem, 0.8rem + 0.375vw, 1.25rem);
		}
	/* END Footer Menü Schriftgröße */



	/*  FOOTER KEIN HAMBURGER MENU */
		.et-l.et-l--footer .et_pb_menu__menu {
			display: block !important;
		}
		.et-l.et-l--footer .et_mobile_nav_menu {
			display: none !important;
		}
	/* END FOOTER KEIN HAMBURGER MENU */



	/* Footer-Menü linksbündig auf tablet und Mobile */
	@media only screen and (max-width: 980px){
		.et_pb_menu--style-left_aligned .et_pb_menu__wrap{
			justify-content: flex-start !important;
		}
	}
	/* Footer-Menü linksbündig auf tablet und Mobile */


	/* Quicklinks im Footer - h4 */
		.quicklinks h4 {
		}







/* ==========================================================================
   KUDO SECTION
   ========================================================================== */
.kd-heart::after {
    content: "\e089";
    font-family: 'ETmodules';
    color: var(--kdac);
	}
	
	
	/* END OF ALL */