/* 
Theme Name: webgearing.com - Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: webgearing.com is a child theme of Hello Elementor, created by Elementor team
Author: webgearing AG
Author URI: https://www.webgearing.com
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Utilities */

.no-margin-bottom p {
	margin-bottom:0px !important;
}

.offset {
	width:960px;
	margin:0 auto;
}


/* --- Header Sticky --- */

body .header-bar {
	transition:all ease .5s;
	width:100vw !important;
	background:#fff;
}

body.sticky .header-bar {
	transition:all ease .3s;
	background:#fff;
	padding:15px 60px !important;
}

/*body.sticky .header-bar > .e-con-inner {
	padding-top:15px !important;
	padding-bottom:15px !important;
}*/

body .header-bar .logo {
	height:100px;
	width:auto;
	margin:0;
	transition:all ease .3s;
}

body.sticky .header-bar .logo {
	height:50px;
	margin:0;
	transition:all ease .3s;
}

body .header-bar .logo img {
	opacity:1;
	height:100px;
	width:auto;
	transition:all ease .3s;
}

body.sticky .header-bar .logo img {
	height:50px;
	width:auto;
	transition:all ease .3s;
}
@media (max-width: 767px){
	body .header-bar .logo, body.sticky .header-bar .logo, body .header-bar .logo img, body.sticky .header-bar .logo img {
		height:50px;
	}
}


/* --- Header --- */

.top-header {
	background:var(--e-global-color-primary) !important;
}


.top-header p, .top-header p a {
	font-size:14px;
	color:var(--e-global-color-6bd75dc) !important;
	margin-bottom:0 !important;
}

 /* btn_weiterlesen */



.top-header .btn_weiterlesen .elementor-button-text {
	color:var(--e-global-color-b08d5aa) !important;
}

.top-header .btn_weiterlesen:hover .elementor-button-text {
	color:var(--e-global-color-b08d5aa) !important;
}

@media (max-width: 1024px){
	.top-header .btn_weiterlesen .elementor-button-text {
		font-size:14px !important;
	}
}

@media (max-width: 767px){
	.top-header .btn_weiterlesen .elementor-button-text {
		font-size:12px !important;
	}
}


/* Navigation */

.current-page-ancestor.current-menu-ancestor > a {
	color:var(--e-global-color-primary) !important;
}

.main-menu .sub-menu {
	box-shadow:3px 3px 10px rgba(0,0,0,0.16);
}

.main-menu .sub-menu li a {
	font-weight:500 !important;
	font-size:14px !important;
}

.main-menu .sub-menu li a:hover, .main-menu .sub-menu li.current-menu-item a {
	border-left:2px solid var(--e-global-color-primary) !important;
}

.main-menu .sub-menu {
	min-width:250px !important;
}


/* Typo */

.container-primary .elementor-widget-text-editor a {
	color:var(--e-global-color-6bd75dc) !important;
}

.header-title p {
	font-size:14px !important;
	line-height:1.2em !important;
	font-weight:500 !important;
}

.header-title h1 {
	font-size:40px !important;
	line-height:1.2em !important;
}

.header-title h2 {
	font-size:26px !important;
	line-height:38px !important;
}

.header-title.header-referenzen p {
	font-size:14px;
	line-height:1.2em;
	
}

.header-title.header-referenzen h1 {
	font-size:40px;
	line-height:1.2em;
}


@media (max-width: 767px){  
	.header-title p {
		font-size:14px !important;
		line-height:1.2em !important;
		
	}
	
	.header-title h1 {
		font-size:28px !important;
		line-height:36px !important;
	}
	
	.header-title h2 {
		font-size:20px !important;
		line-height:28px !important;
	}
}


h2 {
	color:var(--e-global-color-primary);
}

@media (max-width: 767px){ 
	
	h2 {
		font-size:28px !important;
		line-height:36px !important;
	}
	
	h3 {
		font-size:20px !important;
		line-height:28px !important;
	}
}

/* Main Content */

main {
	min-height:1000px;
}

/* btn_weiterlesen */

.btn_weiterlesen .elementor-button {
	padding:0px !important;
	position:relative;
	background-color:transparent !important;
	left:0px;
	transition:all ease .3s;
}

.btn_weiterlesen .elementor-button-icon {
	position:absolute;
	top:0;
	left:0;
	z-index:1;
	background-color:var(--e-global-color-text) !important;
	padding:5px !important;
	border-radius:50% !important;
	width:20px !important;
	height:20px !important;
	transition:all ease .3s;
}

.btn_weiterlesen .elementor-button-text {
	padding:0px !important;
	line-height:20px !important;
	z-index:2;
	margin-left:30px !important;
	font-size:16px !important;
	color:var(--e-global-color-primary) !important;
	font-weight:500 !important;
	text-align:left;
}

.btn_weiterlesen:hover .elementor-button {
	padding:0px !important;
	position:relative;
	background-color:transparent !important;
	left:10px;
	transition:all ease .3s;
}

.btn_weiterlesen.btn_weiss .elementor-button-text {
	color:#fff !important;
}


/* Tablepress

.tablepress {
	--head-active-bg-color:var(--e-global-color-primary) !important;
	--head-bg-color:var(--e-global-color-primary) !important;
  --text-color: var(--e-global-color-text);
  --head-text-color: var(--e-global-color-6bd75dc);
  --odd-text-color: var(--text-color);
  --odd-bg-color: #fff;
  --even-text-color: var(--text-color);
  --even-bg-color: #f9f9f9;
  --hover-text-color: var(--text-color);
  --hover-bg-color: #f3f3f3;
  --border-color: #ddd;
  --padding: 0.5rem;

} */

/* Tabellen */

@media (max-width: 767px) {
  .table-scroll {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    width: 100%;
  }

  .table-scroll table {
    min-width: 800px;
    width: max-content;
  }
}


/*-- Projekte --*/

.projekt-teaser {
	min-height:400px;
	max-height:400px;
	padding:30px;
}

.projekt-teaser:before {
	background-image: url("https://relaunch2025.webgearing.com/wp-content/uploads/2025/06/pattern.gif");
	--background-overlay: '';
	transition:all ease .3s;
}

.projekt-teaser .text-box {
	background:var(--e-global-color-b08d5aa);
	padding:30px;
	transition:all ease .3s;
	overflow:hidden;
	height:100%;
}

.projekt-teaser .text-box .kunde {
	font-weight:500;
	font-size:14px;
	line-height:1.42em;
}

@media (max-width: 767px){ 
	.projekt-teaser .text-box .kunde, .projekt-teaser .text-box .projekttitel {
		max-height:35% !important;
		font-size:12px;
		line-height:20px;
		overflow:hidden;
	}
}

.projekt-teaser .text-box .projekttitel {
	font-weight:700;
	font-size:18px;
	line-height:1.42em;
}

.projekt-teaser .text-box p:last-child {
	margin-block-end:15px;
}


.projekt-teaser {
	position:relative;
}

.projekt-teaser .btn_weiterlesen {
	position:absolute;
	bottom:30px;
	left:30px;
}

/* =======================================================
   Elementor Taxonomy Filter → Dropdown Styling
   Nutzt Global Fonts & Global Colors
   ======================================================= */

.wg-taxfilter-select{
  display: grid;
  gap: 6px;
  margin-bottom: 16px;
  position: relative;
}

/* Label */
.wg-taxfilter-select label{
  font-family: var(--e-global-typography-text-font-family, inherit);
  font-size: var(--e-global-typography-text-font-size, 13px);
  font-weight: 600;
  color: var(--e-global-color-text, #0F172A);
  margin: 0;
}

/* Select Basis */
.wg-taxfilter-select select{
  width: 100%;
  min-height: 46px;

  /* Platz für Chevron rechts */
  padding: 10px 46px 10px 14px;

  border-radius: 10px;

  font-family: var(--e-global-typography-text-font-family, inherit);
  font-size: var(--e-global-typography-text-font-size, 15px);
  font-weight: 500;
  color: var(--e-global-color-text, #0F172A);

  background-color: var(--e-global-color-ffffff, #ffffff);

  border: 1px solid color-mix(
    in srgb,
    var(--e-global-color-text, #0F172A) 14%,
    transparent
  );

  transition:
    border-color .15s ease,
    box-shadow .15s ease,
    background-color .15s ease;

  /* Native Select Look reduzieren */
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;

  /* ===== Zentriertes Chevron ===== */
  background-repeat: no-repeat;
  background-position: right 14px center;
  background-size: 18px 18px;

  /* Chevron Farbe = Textfarbe (#0F172A) */
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Cpath fill='%230F172A' d='M5.6 7.7 10 12.1l4.4-4.4 1.1 1.1L10 14.3 4.5 8.8z'/%3E%3C/svg%3E");
}

/* Hover */
.wg-taxfilter-select select:hover{
  border-color: color-mix(
    in srgb,
    var(--e-global-color-primary, #1e3a8a) 60%,
    transparent
  );
}

/* Focus */
.wg-taxfilter-select select:focus{
  outline: none;

  border-color: var(--e-global-color-primary, #1e3a8a);

  box-shadow: 0 0 0 4px color-mix(
    in srgb,
    var(--e-global-color-primary, #1e3a8a) 18%,
    transparent
  );
}

/* Disabled State */
.wg-taxfilter-select select:disabled{
  opacity: .6;
  cursor: not-allowed;
}

/* Mobile etwas kompakter */
@media (max-width: 767px){
  .wg-taxfilter-select select{
    min-height: 48px;
    font-size: 16px;
  }
}

/* Falls noch altes Pseudo-Chevron existiert → killen */
.wg-taxfilter-select::after{
  content: none !important;
  display: none !important;
}





/* Services */

.col3 > div.elementor-element  {
	padding-right:30px !important; 
	border-right:2px dotted var(--e-global-color-6270654) !important;
}

.col3 > div.elementor-element:last-child {
	border-right:none;
}



/* Vorteile */

.vorteil-item {
	padding:30px;
	background:var( --e-global-color-primary );
	border-radius:45px 5px 45px 5px;
}

.vorteil-item h3 {
	font-size:20px;
	line-height:28px;
	color:var( --e-global-color-b08d5aa ) !important;
}

.vorteil-item .elementor-icon-box-icon svg {
	fill:var( --e-global-color-b08d5aa ) !important;
}

/* Text Section mit Button */

.text-button {
	margin-bottom:60px;
}

/* --- Footer --- */

.footer p, .footer p a {
	font-family:var(--e-global-typography-text-font-family) !important;
	color:#fff !important;
	font-size:18px;
}

.footer h3 {
	font-family:var(--e-global-typography-secondary-font-family) !important;
	color:#fff !important;
	font-size:22px;
	font-weight:500 !important;
}

/* btn_weiterlesen */

.footer .btn_weiterlesen .elementor-button-icon {
	background-color:var(--e-global-color-6bd75dc) !important;
}

.footer .btn_weiterlesen .elementor-button-text {
	color:var(--e-global-color-6bd75dc) !important;
}

.footer .btn_weiterlesen:hover .elementor-button {
	padding:0px !important;
	position:relative;
	background-color:transparent !important;
	left:10px;
	transition:all ease .3s;
}

.footer .elementor-button {
	fill:var(--e-global-color-text) !important;
}

.cookie-notice-container span, .cn-buttons-container a {
	font-family: var( --e-global-typography-text-font-family ), Sans-serif !important;
}

/* Titel Deko 

.titel-deko h2:after {
	content: "";
	background: var(--e-global-color-684232c);
	height: 2px;
	width: 120px;
	display: inline-block;
	margin-left: 30px;
}*/

/* Welle */

.welle.small {
	max-height:250px !important;
}

/* Angebote */

.angebot-item {
	border-left:var(--e-global-color-684232c) dotted 2px !important;
}

.angebot-item-titel h3 {
	font-size:22px !important;	
	color:var(--e-global-color-text) !important;
}

.angebot-item-text p {
	font-size:20px !important;
}

.angebot-item-text p:last-child {
	margin-bottom:0px !important;
}

/* Aufzählungsliste */

.hentry ul {
  list-style: none;
  margin-left: 0;
  padding-left: 0;
}

.hentry ul li {
  position: relative;
  padding-left: 1.6em; /* Abstand Text vom Bullet */
  font-size:18px;
  margin-bottom:10px;
}

@media (max-width: 767px){
	.hentry ul li {
	  margin-bottom:3px;
	}
}

.hentry ul li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.35em;               /* vertikale Ausrichtung */
  width: 0.9em;              /* Bullet-Größe */
  height: 0.9em;
  background: url("/wp-content/themes/webgearing2025/images/bullet.svg") no-repeat center / contain;
}

.hentry ul li.elementor-icon-list-item::before {
	background: none !important;
}

/* Facts */

.facts_box .elementor-icon-wrapper {
	text-align:left !important;
}

/* Aktuelles */

.category-aktuell h2 {
	margin-top:60px !important;
	font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;
	color:var(--e-global-color-primary);
}

.category-aktuell .claim h2 {
	margin-top:0px !important;
}

.category-aktuell h3 {
	font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;
	color:var(--e-global-color-text);
	font-size:22px;
	font-weight:700;
	margin-top:40px !important;
}

