/* ********** Scrolling ********** */
html { 
	scroll-behavior: smooth; 
}

/* ********** Schriften ********** */

/* Cormorant Garamond – Variable Font */
@font-face {
    font-family: 'Cormorant Garamond Variable';
    src: url('/wp-content/uploads/CormorantGaramond-Italic.woff2')
         format('woff2');
    font-style: italic;
    font-weight: 300 700;
    font-display: swap;
}
/* Manrope – Variable Font */
@font-face {
    font-family: 'Manrope';
    src: url('/wp-content/uploads/manrope.woff2')
         format('woff2');
    font-style: normal;
    font-weight: 300 700;
    font-display: swap;
}

/* Grundschrift für die gesamte Website */
body {
    font-family: 'Manrope', Arial, sans-serif;
    font-weight: 400;
}

/* Elegante Schrift für grosse Überschriften */
h1, h2 {
    font-family: 'Cormorant Garamond Variable', Georgia, serif;
    font-weight: 500;
    font-variant-numeric: lining-nums;
}

/* Kleinere Überschriften in der modernen Schrift */
h3, h4, h5, h6 {
    font-family: 'Manrope', Arial, sans-serif;
    font-weight: 600;
}

/* Font Peb */
@font-face {
    font-family: peb;
    src: url('/wp-content/uploads/peb.ttf');
		src: url('/wp-content/uploads/peb.woff');
    src: url('/wp-content/uploads/peb.woff2');
    font-weight: normal;
    font-style: normal;
	font-display: block;
}
.peb{
	font-family: peb;
	font-size: 115%;
	text-transform: none;
}
.peb{
	font-family: peb;
}
.peb-icon-before{
	font-family: peb;
	display: inline;
	margin-right: 7px;
	font-size: 115%;
}
.peb-icon-in-btn{
	font-family: peb;
	display: inline;
	margin-right: 0;
	font-size: 115%;
	text-transform: none;
}

h1{
	font-size: 4em;
}
h2{
	/*font-size: 3.2em;
	line-height: 1.1;	*/
	font-size: 4em;
  line-height: 1.12;
  font-weight: 500;
}
h3{
	font-size: 1.4em;
	font-weight: 700;
}

.text-primary {
	color: var(--c99a6b);
}
.text-smaller{
	font-size: 85%;
}

/* ********** Buttons ********** */
.brxe-button{
	cursor: pointer;
	text-transform: uppercase;
	font-weight: 700;
	line-height: 1;
	padding: 0.8em 1em;
	border-radius: 5px;
	transition: transform .4s, filter .7s;
}
.brxe-button:hover{
	filter: brightness(1.08);
	transform: scale(1) !important;
} 

/* Login-Button */
.pebweb-authform .button-primary {
    border: none;
		border-radius: 5px;
}    

/* ********** Menu ********** */
.bricks-nav-menu li{						/* Grossbuchstaben */
	text-transform: uppercase;
}
.show-mobile-menu  .bricks-mobile-menu-toggle{
	display: none;						/* Schliessen Btn von Mobile ausblenden */
}

/* ********** Header ********** */
@media (max-width: 478px) {
  #brxe-tjffab { /* container */
    display: flex;
    flex-direction: column;
    align-items: center;
    flex-wrap: nowrap;
		height: 145px !important;
		padding: 15px;
  }
}

/* ********** Hero ********** */
@media(max-width:479px){ /* Hero Section */
	#brxe-ncsiyf{
		background-position: calc(100vw - 840px) 0 !important;
		padding: 15px 15px 30px !important;
	}
	#brxe-lpinzt{ /* wrap navi + CTA */
		width: 185px;
		margin: 0 auto;
		justify-content: space-around !important;
	}
}

/* ********** Öffnungszeiten-Tabelle ********** */
table.openingsTable{
	background: #c99a6b14;
	padding: 15px;
	border-radius: 10px;
}
table.openingsTable td{
	line-height: 1.12;
}
table.openingsTable td:not(:last-child) {
    padding-right: 10px;
}
table.openingsTable tr:not(:last-child) td{
	border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

/* ********** Kontakt Seite ********** */
body.page-id-65 #brxe-nktygk{
	padding-top: 70px;
}

/* ********** Eyebrow: Haarverlängerung in Kreuzlingen ********** */
@keyframes haarverlaengerung {
    0%, 100% {
        letter-spacing: inherit;
    }
    45% {
        letter-spacing: 0.3em;
    }
}
/* Animation beim Laden der Seite */
.eyebrow-animation {
    animation: haarverlaengerung 2s ease-in-out 0.2s 1;
}
/* Barrierefreiheit: reduzierte Bewegung respektieren */
@media (prefers-reduced-motion: reduce) {
    .eyebrow-animation {
        animation: none;
    }
}