/*
 Theme Name:   	Ratio
 Theme URI:    	https://ratio.lorenzundfuchs.de
 Description:  	Custom GeneratePress Child Theme
 Author:       	Lorenz und Fuchs
 Author URI:   	https://lorenzundfuchs.de
 Version:      	1.0
 Template:     	generatepress
*/

/**********************
 * GLOBALS
 * ********************/

@media screen and (min-width: 783px) {
  body.admin-bar header {
    top: 32px !important;
  }
}

html {
	scroll-behavior: smooth !important;
	color-scheme: light only;
}

/* BOX VIEW */
body {
	overflow-x: hidden;
	max-width: 100vw;
	hyphens: none;
}

/* MAIN PADDING */
:root{
--lrPadding: 120px;
--tbPadding: 80px;
}
@media (max-width:1600px){
	:root{--lrPadding: 100px; --tbPadding: 70px;}
}
@media (max-width:1280px){
	:root{--lrPadding: 80px; --tbPadding: 60px;}
}
@media (max-width:1024px){
	:root{--lrPadding: 60px; --tbPadding: 50px;}
}
@media (max-width:768px){
	:root{--lrPadding: 40px; --tbPadding: 50px;}
}
@media (max-width:600px){
	:root{--lrPadding: 20px; --tbPadding: 40px;}
}

/* OFF CANVAS */
:root {
  --gp-slideout-width: clamp(200px, 100%, 480px) !important;
}
#generate-slideout-menu {
	padding:20px !important;
}
#generate-slideout-menu .gp-icon svg {
    height: 1.2em !important;
    width: 1.2em !important;
    top: 0 !important;
}

#generate-slideout-menu .sub-menu{
	box-shadow: none !important;
	padding-left:20px !important;
	padding-top:0 !important;
}

#generate-slideout-menu .main-nav ul ul li a {
    border-bottom: 1px solid rgba(255,255,255,0.2);
	padding-left: 0 !important;
}

#generate-slideout-menu .slideout-menu a {
	font-size: 20px !important;
}
@media(max-width:768px) {
	#generate-slideout-menu .slideout-menu a {
	font-size: 17px !important;
}
}
#generate-slideout-menu .slideout-menu ul a {
	font-size: 15px !important;
}

.slideout-navigation .main-nav {
	margin-bottom:20px !important;
}

.slideout-exit svg rect,
#generate-slideout-menu .gp-icon svg{
	fill: var(--accent) !important;
}

.off-infobox a {
	text-transform:none !important;
	font-size: inherit !important;
}

/* ADDITIONAL FONT STYLE */

.entry-content a, .bc-container a {
     color: var(--base);
	  font-weight:700 !important;
	text-decoration-color:var(--accent);
	text-underline-offset: 4px;
}
.entry-content a:hover, .bc-container a:hover {
	text-decoration-color:var(--base);
}

@media(min-width:1621px) {
	h1 {font-size:46px;}
	#mainHero h1 {font-size:60px;}
	#mainHero h1 span.mh-subline {font-size:32px; display:flex; padding-top:20px;}
	h2 {font-size:34px;}
	h3 {font-size:28px;}
}
@media(max-width:1280px) {
	body {
		hyphens: auto;
	}
}
#mainHero h1 span.mh-subline {display:flex; padding-top:20px;}

.hyphens {
	hyphens: auto !important;	
}
.no-hyphens {
	hyphens:none;
}

@media(max-width:768px){
	h1, h2 { hyphens:none !important; }
}

.ratio-subline {
	font-weight:600 !important;
	font-size:1.3em !important;
	line-height:1.2em !important;
}

/* LINK STYLE */
article .gb-container p a,
article .gb-container li a{
	font-weight:600;
}

/* LISTEN */
ul.wp-block-list {
	margin-left: 20px;
}

ul.wp-block-list li {
	margin-bottom:10px;
}

/* NAVIGATION */
/* .site-header .inside-header,
.is_stuck .inside-navigation{
	padding-left:var(--lrPadding) !important;
	padding-right:var(--lrPadding) !important;
}*/


.main-navigation a {
	font-size:16px;
	letter-spacing:0.5px;
	font-weight:400;
}

.main-navigation .main-nav ul li:last-child a {
padding-right:0 !important;
}

/* STICKY HEADER */



#sticky-navigation {
	background:var(--base);
}

header * {
  transition: all 0.25s ease;
}

header {
 position: fixed !important;
top: 0;
  left: 0;
  right: 0;
	transform: translateY(0);
  transition: all 0.25s ease;
}

header.header-sticky {

}

header .inside-header {
	padding-left:var(--lrPadding) !important;
	padding-right:var(--lrPadding) !important;
}

header .main-navigation .main-nav ul ul li a {
	border-bottom: 1px solid rgba(255,255,255,0.2);
		font-size:16px;
	padding-left:0;
}
header .main-navigation .main-nav ul ul li:last-child a {
	border-bottom: none;
}


header.header-hidden {
    transform: translateY(-100%);
}

header.header-sticky .site-logo {
    transform: scale(0.8);
	transform-origin: left center;
}

header.header-sticky .main-navigation .main-nav ul li a, 
header.header-sticky .menu-toggle, 
header.header-sticky .main-navigation .menu-bar-item > a {
    line-height: 60px;

}

header.header-sticky .main-navigation .main-nav ul ul li a {
	line-height:normal !important;
}

.main-navigation .sub-menu {
	padding-left:30px;
	padding-right:30px;
	padding-bottom:20px;
	padding-top:0;
}

.main-navigation .sub-menu a {
	text-transform: none;
	font-weight:300;
}

.main-navigation .main-nav ul li:last-child a {
	padding-right:0 !important;
}


#menu-main .menu-item-has-children .dropdown-menu-toggle {
	padding-left:0 !important;
	padding-right:0 !important;

}
header .menu-toggle {
	line-height:80px !important;	
}

.gp-icon svg {
    height: 2em;
    width: 2em;
    top: .5em;
    position: relative;
    fill: currentColor;
	transform: translateY(1px);
}

#menu-main .menu-item-has-children .dropdown-menu-toggle .gp-icon svg {
    height: 1.25em;
    width: 1.25em;
    top: .25em;
    position: relative;
    fill: var(--accent);
	transform: translateY(0px);
}

@media(max-width:1600px) {
	.main-navigation .main-nav ul li a {
		line-height:80px;
		letter-spacing:0;
		padding-left:16px;
		padding-right:16px;
	}
}

@media(max-width:1280px){
		
	    .main-navigation .menu-toggle {
        font-size: 18px;
			padding-right: 0;
    }
}

@media(max-width:1024px){
	header .menu-toggle, 
	header.header-sticky .menu-toggle{
line-height:60px !important;
	}
}

@media(max-width:768px){
	
header .site-logo {
	max-width:140px !important;
	}
	
	    .main-navigation .menu-toggle {
        font-size: 12px;
			padding-right: 0;
    }
	
	header.header-sticky .site-logo {
    transform: none;
	transform-origin: left center;
}
	
		.site-header .header-image {
    width: 220px;
}
	
	
}

/* TEAM PAGE HERO */
.header-raster,
.header-raster > .gb-grid-column{
	height:100%;
}

.hero-subline {
	font-weight:400 !important;
	font-size:1.6em !important;
	line-height:1.4em !important;
	letter-spacing:1px !important;
}

/* BILDFORMATE */

.aspect-11 {
    aspect-ratio: 1 / 1;
    position: relative;
    overflow: hidden;
}

.aspect-11 figure {
    margin: 0;
    width: 100%;
    height: 100%;
    position: relative;
}

.aspect-11 figure img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}

.aspect-23 {
    aspect-ratio: 2 / 3;
    position: relative;
    overflow: hidden;
}

.aspect-23 figure {
    margin: 0;
    width: 100%;
    height: 100%;
    position: relative;
}

.aspect-23 figure img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}

.aspect-34 {
    aspect-ratio: 3 / 4;
    position: relative;
    overflow: hidden;
}

.aspect-34 figure {
    margin: 0;
    width: 100%;
    height: 100%;
    position: relative;
}

.aspect-34 figure img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}

.aspect-32 {
    aspect-ratio: 3 / 2;
    position: relative;
    overflow: hidden;
}

.aspect-32 figure {
    margin: 0;
    width: 100%;
    height: 100%;
    position: relative;
}

.aspect-32 figure img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}

/* BREADCRUMBS */
.bc-container {
	font-size:0.9em;
	color:#000 !important;
}

/* ACCORDION */
.gb-button.gb-accordion__toggle,
.gb-accordion__content .gb-container{
	background-color:transparent !important;
	color:inherit;
}

.gb-accordion__toggle {
	position: relative;
	padding-left:0;
	font-size: 1.1em;
    font-weight: 700;
}
@media(max-width:768px) {

.gb-accordion__toggle {
		font-size: 1em;
	}
}

.gb-button.gb-accordion__toggle {
		padding-left:30px;
	padding-right:0;
}
.gb-accordion__toggle::before {
	content: '';
	position: absolute;
	top: 28px;
	left: 0;
	width: 20px;
	height: 20px;
	background: url('https://stb.lorenzundfuchs.de/wp-content/uploads/2026/04/arrow-white.svg') no-repeat center center;
	background-size: contain;
	transform: translateY(-50%) rotate(0deg);
	transition: transform 0.2s ease-in-out;
	pointer-events: none;
}
.accordion-invert .gb-accordion__toggle::before {
	background: url('https://stb.lorenzundfuchs.de/wp-content/uploads/2026/04/arrow-dark.svg') no-repeat center center;
}

.gb-accordion__toggle.gb-block-is-current::before {
	transform: translateY(-50%) rotate(90deg);
}
.gb-accordion__toggle h4 {
	margin-bottom: 15px;
	padding-bottom: 15px;
	padding-top: 10px;
	max-width: 85%;
	font-weight: 600 !important;
}
.gb-accordion__toggle.gb-block-is-current h4 {
	text-decoration: underline !important;
}
.gb-accordion__item:not(:last-child) {
	border-bottom: 1px solid var(--white);
}
.accordion-invert .gb-accordion__item:not(:last-child) {
	border-bottom: 1px solid var(--base);
}

.gb-accordion__content {
	max-width: 95%;
}
.gb-accordion__icon,
.gb-accordion__icon-open,
.gb-accordion__toggle .gb-icon{
	display: none !important;
}

.gb-accordion__content .gb-container {
	padding-left:30px;
}

/* ARROW NAVIGATION */
.arrow-navigation h4 a {
  text-decoration: none;
	width:100%;
}

.arrow-navigation h4 {
  display: flex;
  align-items: center;
  gap: 10px;
	width:100%;
	justify-content: space-between;
}

.arrow-navigation h4 .gb-icon {
  order: 2; 
}

.arrow-navigation h4 .gb-headline-text {
  order: 1; 
}

.arrow-link h3,
.arrow-link h4,
.arrow-link p,
.arrow-link p strong{
	color: var(--base) !important;
}
.arrow-link:hover h3,
.arrow-link:hover h4,
.arrow-link:hover p,
.arrow-link:hover p strong{
	color: var(--accent) !important;
}

.arrow-link h4 .gb-icon {
  transition: transform 0.2s ease;
}

.arrow-link:hover h4 .gb-icon {
  transform: translateX(10px);
}


.arrow-link h4 .gb-icon svg path {
  stroke: transparent;
}
.arrow-link:hover h4 .gb-icon svg path {
  stroke: transparent;
}

/* Buttons */
a.gb-button {
	padding: 2px 0 !important;
  background-color: transparent !important;
  color: var(--base) !important;
  font-size: 1.1em;
	font-weight:700;
  letter-spacing: 0;
transition: all 0.2s ease;
	position:relative;
}

a.gb-button::after {
content: "";
    position: absolute;
    bottom: -5px;
    left: 0;
    width: 30%;
    height: 2px;
    background-color: var(--base);
    transition: width 0.2s ease;
}
a.gb-button:hover::after {
content: "";
    position: absolute;
    bottom: -5px;
    left: 0;
    width: 100%;
    background-color: var(--accent);
    transition: width 0.2s ease;
}

a.gb-button.alt-btn {
		padding: 5px 20px !important;
  border: 1px solid var(--bg-accent);
	  color: var(--white) !important;
	  letter-spacing: 1px;
}
a.gb-button.alt-btn::after {
	display:none;
}



a.gb-button.alt-btn-dark {
		padding: 5px 20px !important;
  border: 1px solid var(--base);
	  color: var(--white) !important;
	  letter-spacing: 1px;
	background-color: var(--base) !important;
}
a.gb-button.alt-btn-dark::after {
	display:none;
}


a.gb-button.light-btn {
	  color: var(--white) !important;
}
a.gb-button.light-btn::after {
	background-color: var(--white);
}
a.gb-button.light-btn:hover::after {
	background-color: var(--accent);
}



a.gb-button:hover.alt-btn {
border: 1px solid var(--bg-accent);
	background-color: var(--bg-accent) !important;
	color: var(--base) !important;
}
a.gb-button:hover.alt-btn-dark {
border: 1px solid var(--accent);
	background-color: var(--accent) !important;
	color: var(--text) !important;
}



a.gb-button svg {
	transform: translatex(0);
	transition: all 0.2s ease;
}

a.gb-button:hover svg {
	transform: translatex(5px);
	transition: all 0.2s ease;
}
/* BASE HERO */

	.header-raster	h1 {
		hyphens:auto;
	}

@media (max-width: 1600px) and (min-width: 1025px) {
	
	.header-raster	h1 {
		font-size: 46px;
	}
	
.header-raster > .gb-grid-column{
	width:60% !important;
}
	.header-raster > .gb-grid-column:first-child{
	width:40% !important;
}
}

/* TEASER RASTER */
.arrow-link .img-container img {
	transform:scale(1);
		transition: all 0.2s ease;
}
.arrow-link:hover .img-container img {
	transform:scale(1.1);
		transition: all 0.2s ease;
}

/* TABLE GRID */
.table-grid {
	margin-bottom:30px;
}
.table-grid p {
	margin-bottom:10px;
}


@media (max-width: 768px) {
  .table-grid {
    display: block !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    min-width: 0 !important;
  }

  .table-grid .table-inner {
    display: flex !important;
    flex-wrap: nowrap !important;
    min-width: 700px !important;
  }

  .table-grid .table-col {
	  display: flex !important;
	  width:100% !important;
	  flex-direction: column;
   /* flex: 0 0 auto !important;*/
  }
	
	.table-grid .gb-grid-column {
		display:flex !important;
	}

	
		/* 2-spaltig */
  .table-grid.table-grid--2col .gb-grid-column:nth-child(1) { width: 35% !important; }
  .table-grid.table-grid--2col .gb-grid-column:nth-child(2) { width: 65% !important; }
	
	/* 3-spaltig */
  .table-grid.table-grid--3col .gb-grid-column:nth-child(1) { width: 30% !important; }
  .table-grid.table-grid--3col .gb-grid-column:nth-child(2) { width: 35% !important; }
  .table-grid.table-grid--3col .gb-grid-column:nth-child(3) { width: 35% !important; }

  /* 4-spaltig */
  .table-grid.table-grid--4col .gb-grid-column:nth-child(1) { width: 25% !important; }
  .table-grid.table-grid--4col .gb-grid-column:nth-child(2) { width: 25% !important; }
  .table-grid.table-grid--4col .gb-grid-column:nth-child(3) { width: 25% !important; }
  .table-grid.table-grid--4col .gb-grid-column:nth-child(4) { width: 25% !important; }

  .table-grid .table-row > .gb-container {
    min-width: 700px !important;
  }
}



/* GLOBAL FONT FIX */
code {
	font-family:inherit !important;
	font-size: inherit !important;
}


/* FOOTER */

#footerContainer a {
	text-decoration:none;	
}

#menu-footer {
 margin:0;
}
#menu-footer li{
	list-style:none;
	margin-bottom:10px;
}
#menu-footer li a{
	text-decoration:none;
}