/*!
Theme Name: Jura Taxi Eichstätt
Author: Internet Agentur Scherer
Author URI: https://www.ia-scherer.de
*/

/* **********************************************

	Fonts

********************************************** */

/* inter-100 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100;
  src: url('fonts/inter-v20-latin-100.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* inter-100italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: italic;
  font-weight: 100;
  src: url('fonts/inter-v20-latin-100italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* inter-200 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: normal;
  font-weight: 200;
  src: url('fonts/inter-v20-latin-200.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* inter-200italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: italic;
  font-weight: 200;
  src: url('fonts/inter-v20-latin-200italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* inter-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: normal;
  font-weight: 300;
  src: url('fonts/inter-v20-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* inter-300italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: italic;
  font-weight: 300;
  src: url('fonts/inter-v20-latin-300italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* inter-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/inter-v20-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* inter-italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: italic;
  font-weight: 400;
  src: url('fonts/inter-v20-latin-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* inter-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  src: url('fonts/inter-v20-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* inter-500italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: italic;
  font-weight: 500;
  src: url('fonts/inter-v20-latin-500italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* inter-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  src: url('fonts/inter-v20-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* inter-600italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: italic;
  font-weight: 600;
  src: url('fonts/inter-v20-latin-600italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* inter-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  src: url('fonts/inter-v20-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* inter-700italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: italic;
  font-weight: 700;
  src: url('fonts/inter-v20-latin-700italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* inter-800 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: normal;
  font-weight: 800;
  src: url('fonts/inter-v20-latin-800.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* inter-800italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: italic;
  font-weight: 800;
  src: url('fonts/inter-v20-latin-800italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* inter-900 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: normal;
  font-weight: 900;
  src: url('fonts/inter-v20-latin-900.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* inter-900italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: italic;
  font-weight: 900;
  src: url('fonts/inter-v20-latin-900italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* **********************************************

	Basics

********************************************** */

:root {
  --tuerkis: #00d0ec;
  --dark: #273f45;
  --white: #ffffff;
  --taxi-yellow: #F7C400;
  --taxi-ink: #1d2c31;
  --header-h: 50px;
  --anchor-gap: 12px;

}

html, body {
  margin: 0;
  padding: 0;
}

body {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 300;
}

body #wrapper {
  width: 100%;
  max-width: 1920px;
  margin: 0 auto;
}

.no-mobile {

}

/* ********************
	Anker setzen
******************** */


/* global smooth scroll (optional) */
html{ scroll-behavior: smooth; }

/* alle Sprungziele bekommen einen oberen Puffer */
.anchored{
  scroll-margin-top: calc(var(--header-h) + var(--anchor-gap));
}

/* **********************************************

	Header

********************************************** */

header {
  height: 50px;
}

header img.logo{
  width:200px;
  height:auto;
  position:fixed;
  top:5px;
  left: max(30px, calc((100vw - 1920px)/2 + 30px));
  z-index:1030;
}

header #header {
  background: var(--dark);
}

header .bg {
  background: var(--dark);
  border-bottom: 1px solid var(--tuerkis);
}


header #navbar .navbar-nav{
  gap: .5rem;
}

header #navbar .navbar-nav .nav-link{
  display: inline-flex;
  align-items: center;
  padding: .5rem .9rem;
  border-radius: 3px;
  background: var(--taxi-yellow);
  color: var(--taxi-ink) !important;
  font-weight: 600;
  line-height: 1;
  text-decoration: none;
  transition: transform .15s ease, background-color .15s ease, box-shadow .15s ease;
}

header #navbar .navbar-nav .nav-link{

}

header #navbar .navbar-nav .nav-link:hover,
header #navbar .navbar-nav .nav-link:focus{
  background: var(--tuerkis);
}

header #navbar .navbar-nav .nav-link:focus-visible{
  outline: 2px solid #fff;
  outline-offset: 2px;
}

header #navbar .navbar-nav .nav-link.active,
header #navbar .current-menu-item > .nav-link{
  background: var(--tuerkis);
}

header .navbar-toggler {
  background: var(--taxi-yellow);
}

header .navbar-toggler:hover,
header .navbar-toggler:focus {
  background: var(--tuerkis);
}

/* ********************
	CTA
******************** */


.btn-cta {
  display:inline-flex;
  align-items:center;
  padding:.5rem .9rem;
  border-radius:999px;
  background:var(--taxi-yellow);
  color:var(--taxi-ink) !important;
  font-weight:600;
  line-height:1;
  text-decoration:none;
  transition: background-color .15s ease;
  white-space:nowrap;
}

.btn-cta:hover,
.btn-cta:focus{
  background:var(--tuerkis);
}

.btn-cta:focus-visible{
  outline:2px solid #fff;
  outline-offset:2px;
}

.btn-cta a.button {
  color: var(--taxi-ink);
}

.cta-bar {
  position: fixed;
  height: 50px;
  gap:.6rem;
  right: max(30px, calc((100vw - 1920px)/2 + 30px));
}

.hero-wrapper .cta-bar {
  position: relative;
  height: 50px;
  gap:.6rem;
}


.icon-wa,
.icon-ma {
  width: 4.5rem;
  height: 4.5rem;
  display: block;
  color: var(--taxi-ink);
}

.cta-wa,
.cta-ma {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:34px;
  height:34px;
  border-radius:999px;
  background: var(--taxi-yellow);
  color: var(--taxi-ink);
}

.cta-wa:hover,
.cta-wa:focus,
.cta-ma:hover,
.cta-ma:focus {
  background:var(--tuerkis);
}

.cta-wa .icon-wa,
.cta-wa .icon-ma {
  color: currentColor;
  width:1.25rem;
  height:1.25rem;
}



@media (max-width: 991.98px){
	header {
	  height: 100px;
	  background: var(--dark);
	}
	header img.logo{
	  width: 120px;
	  left: 0.8rem;
	}
	header #navbar .navbar-nav {
	  margin-top: 1rem;
	  gap: .4rem;
	}
	header #navbar .navbar-nav .nav-link{

	  display: block;
	  width: 100%;
	  text-align: left;
	  border-radius: .6rem;

	}
	header #navbar .navbar-nav .nav-link {
	  text-align: center;
	}
	header .navbar-toggler {
	  margin-top: 50px;
	}
	.cta-bar {
	  z-index: 1030;
	  right: 0.8rem;
	}
	.btn-cta {
	  background:var(--tuerkis);
	}
	.btn-cta:hover,
	.btn-cta:focus{
	  background:var(--taxi-yellow);
	}
	.cta-wa,
	.cta-ma {
	  background:var(--tuerkis);
	}
	.cta-wa:hover,
	.cta-wa:focus,
	.cta-ma:hover,
	.cta-ma:focus {
	  background:var(--taxi-yellow);
	}
	.no-mobile {
	  display: none !important;
	}
}


/* **********************************************

	Main Hero

********************************************** */

main#main {
  margin-top: -1px;
}

main #hero .bg {
  background: var(--dark);
  border-bottom: 1px solid var(--tuerkis);
}

main #hero .row.bg {
  min-height: clamp(420px, 65vh, 820px);
  align-items: stretch;
}

main #hero .row.bg > [class*="col-"] {
  display: flex;
}

main #hero h1 {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 800;
  font-size: clamp(1.75rem, 5vw + 1rem, 5.5rem);
  line-height: 1.1; 
  color: var(--white);
}

main #hero p {
  font-family: 'Inter', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-style: normal;
  font-weight: 500;
  font-size: clamp(1rem, 0.9vw + 0.7rem, 1.375rem);
  line-height: 1.45;
  color: rgba(255,255,255,0.92);
  max-width: 38ch;
  margin: 0.75rem 0 0;
  letter-spacing: 0.005em;
  text-wrap: balance;
  text-shadow:
    0 1px 0 rgba(0,0,0,0.25),
    0 0 6px rgba(0,208,236,0.25);
}

main #hero .hero-wrapper,
main #hero .hero-media {
  flex: 1 1 auto;
}

main #hero .hero-media {
  position: relative;
  isolation: isolate;
}

main #hero .hero-media {
  position: relative;
  min-height: 320px;
}

main #hero .hero-media::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(
    90deg,
    #273f45 0%,
    rgba(39, 63, 69, 0.9) 16%,
    rgba(0, 208, 236, 0) 50%
  );
  mix-blend-mode: normal;
}

main #hero .hero-picture {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

main #hero .hero-media > img.hero-picture {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

@media (max-width: 991.98px) {
	  main #hero .hero-media::after {
	    content: "";
	    position: absolute;
	    inset: 0;
	    pointer-events: none;
	    background: linear-gradient(
	      180deg,
	      var(--dark) 0%,
	      rgba(39, 63, 69, 0.88) 5%,
	      rgba(0, 208, 236, 0) 30%
	    );
	    mix-blend-mode: normal;
	  }
	  main #hero .row.bg {
	    min-height: clamp(360px, 52vh, 640px);
	  }
	  main #hero .hero-media {
	    min-height: 260px;
	  }
}

/* **********************************************

	Main Content

********************************************** */

main#main .container.content {
  margin-top: 10rem;
}

main#main .container.content a.site {
  color: var(--dark);
  display: inline-block;
  overflow: hidden;
  text-decoration: none;
}

main#main .container.content a.site::after {
  border-bottom: 2px solid var(--tuerkis);
  content: '';
  display: block;
  opacity: 0;
  margin-top: 3px;
  position: relative;
  left: -180px;
  transition: all .35s ease-in-out;
}

main#main .container.content a.site:hover::after {
  opacity: 1;
  left: 0;
}


main#main .container.content h1 {
  font-weight: 800;
}

main#main .container.content h2 {
  font-weight: 800;
}

main#main .container.content .container.h1 {
  position: relative;
  display: flex;
  align-items: center;
  margin: 0;
  padding: 0;
}


main#main .container.content .container.h1 img {
  position: absolute;
  top: 50%; /* Positionierung in der Mitte */
  transform: translateY(-50%); /* Korrigiert den vertikalen Versatz */
  width: 50px;
  height: 50px;
}

main#main .container.content .container.h1 h1 {
  color: var(--dark);
  margin-left: 40px;
}

main#main .container.content p.after-h1 {
  margin-left: 40px;
}

main#main .container.content .container.h2 {
  position: relative;
  display: flex;
  align-items: center;
  margin: 0;
  padding: 0;
}

main#main .container.content .container.h2 img {
  position: absolute;
  top: 50%; /* Positionierung in der Mitte */
  transform: translateY(-50%); /* Korrigiert den vertikalen Versatz */
  width: 50px;
  height: 50px;
}

main#main .container.content .container.h2 h2 {
  color: var(--dark);
  margin-left: 40px;
}

main#main .container.content p.after-h2 {
  margin-left: 40px;
}

main#legal a {
  color: var(--bs-body-color);
  display: inline-block;
  overflow: hidden;
  text-decoration: none;
}

main#legal a::after {
  border-bottom: 2px solid var(--tuerkis);
  content: '';
  display: block;
  opacity: 0;
  margin-top: 3px;
  position: relative;
  left: -180px;
  transition: all .35s ease-in-out;
}

main#legal a:hover::after {
  opacity: 1;
  left: 0;
}

.teaser-tiles .card {
  background: var(--dark)
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 1rem;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.teaser-tiles .card:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 24px rgba(0,0,0,.25), 0 0 20px rgba(0,208,236,.12);
  border-color: rgba(0,208,236,.35);
}
.teaser-tiles .tile-title {
  color: var(--tuerkis);
  text-shadow: 0 1px 0 rgba(0,0,0,.25);
}
.teaser-tiles p {
  color: rgba(255,255,255,.9);
  line-height: 1.45;
}

.teaser-tiles .card {
  background: #22353b;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 1rem;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.teaser-tiles .card:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 24px rgba(0,0,0,.25), 0 0 20px rgba(0,208,236,.12);
  border-color: rgba(0,208,236,.35);
}
.teaser-tiles .tile-title {
  color: var(--tuerkis);
  text-shadow: 0 1px 0 rgba(0,0,0,.25);
}

.teaser-tiles h3 {
  color: var(--tuerkis);
  line-height: 1.45;
}

.teaser-tiles p {
  color: rgba(255,255,255,.9);
  line-height: 1.45;
}

#ueber-uns .owner-figure{margin:0}
#ueber-uns .owner-figure img{width:100%; height:auto; border-radius:.5rem}
#ueber-uns .owner-figure figcaption {
  border-radius: 1rem;
  background: #22353b;
  text-align: center;
  font-size:.9rem;
  color: var(--tuerkis);
  margin-top:.25rem;
  padding: 1rem;
}

main#main .container.content a.no {
  color: var(--bs-body-color);
  text-decoration: none;
}

main#main .container.content a.no:hover {
  color: var(--bs-body-color);
  text-decoration: underline;
}

/* **********************************************

	Kontakt

********************************************** */

.card.contact {
  background: #22353b;
  border: 1px solid rgba(255, 255, 255, .06);
  border-radius: 1rem;
}

.card.contact h2 {
  color: var(--tuerkis);
}

.card.contact p {
  color: var(--white);
}

.card.contact a {
  color: var(--white);
}

.card.contact a:hover {
  color: var(--tuerkis);
}

.wpcf7-form textarea{ 
  width: 100% !important;
  height:50px;
}

.wpcf7 {
  border: 1px solid var(--dark);
  padding: 10px;
  border-radius: 1rem;
}

.wpcf7-form input,
.wpcf7-form textarea,
.wpcf7-form select {
  max-width: 100%;
  box-sizing: border-box;
}
.wpcf7-form label { display:block; }

/* **********************************************

	Footer

********************************************** */

footer#footer {
  padding-top: 1rem;
  background-color: var(--dark) !important;
  border-top: 2px solid var(--tuerkis);
}

footer#footer p {
 color: var(--white);
}

footer#footer a {
  color: var(--white);
  display: inline-block;
  overflow: hidden;
  text-decoration: none;
}

footer#footer a {
  color: var(--white);
  display: inline-block;
  overflow: hidden;
  text-decoration: none;
}

#footer .menu-item a[aria-current=page] {
  color: var(--white);
}

footer#footer a::after {
  border-bottom: 2px solid var(--tuerkis);
  content: '';
  display: block;
  opacity: 0;
  margin-top: 3px;
  position: relative;
  left: -180px;
  transition: all .35s ease-in-out;
}

footer#footer a:hover::after {
  opacity: 1;
  left: 0;
}

@media (max-width: 991.98px){
	#footer img.logo-footer {
	  margin: 0 auto;
	}
}








/* **********************************************

	Summary

********************************************** */


/* Basis */
details {
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 12px;
  background: rgba(39,63,69,.20);            /* leichtes Dark */
  margin: 0 0 0.75rem 0;
  overflow: hidden;
}
details[open] { background: var(--dark); }

summary {
  display: flex;
  align-items: center;
  gap: .6rem;
  padding: .8rem 1rem;
  cursor: pointer;
  list-style: none;                           /* Firefox */
  color: rgba(255,255,255,.95);
  background: var(--dark);
  font-weight: 600;
}
summary::-webkit-details-marker { display: none; }  /* Chrome/Safari */

summary::before {
  content: "";
  flex: 0 0 auto;
  width: 1.05rem;
  height: 1.05rem;
  background: currentColor;                   /* erbt Textfarbe */
  /* Chevron als Mask (monochrom, skaliert sauber) */
  -webkit-mask: url('data:image/svg+xml;utf8,\
<svg xmlns="http://www.w3.org/2000/svg" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"black\" stroke-width=\"3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"8 4 16 12 8 20\"/></svg>') no-repeat center / contain;
          mask: url('data:image/svg+xml;utf8,\
<svg xmlns="http://www.w3.org/2000/svg" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"black\" stroke-width=\"3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"8 4 16 12 8 20\"/></svg>') no-repeat center / contain;
  transition: transform .2s ease;
}
details[open] > summary::before { transform: rotate(90deg); }

/* Hover/Focus States */
summary:hover {
  color: var(--tuerkis);
}
summary:focus-visible {
  outline: 2px solid var(--tuerkis);
  outline-offset: 2px;
  border-radius: 10px;
}

details:hover { border-color: rgba(0,208,236,.35); }

/* Inhalt */
details > *:not(summary) {
  padding: 0 1rem 1rem 1rem;
  color: rgba(255,255,255,.9);
  line-height: 1.5;
  border-top: 1px solid rgba(255,255,255,.06);
}

/* Kompakter auf Mobile */
@media (max-width: 575.98px) {
  summary { padding: .7rem .9rem; }
  details > *:not(summary) { padding: 0 .9rem .9rem .9rem; }
}

/* Bewegungsreduktion respektieren */
@media (prefers-reduced-motion: reduce) {
  summary::before { transition: none; }
}