/*
Theme Name: PJT
Description: Template für PJT
Author: Daniel McDonald
Author URI: https://etrnl.de
Author Email: daniel@etrnl.de
Version: 1.0.0
Text Domain: hello-elementor-child
Template: hello-elementor
*/
/* ==========================================================================
   PJT 2026 - Custom Styles
   ========================================================================== */

/* --- CSS Variables / Design Tokens --- */
:root {
    /* Colors */
    --pjt-cream: #F5EFE0
    --pjt-brown-dark: #3D2B1F;
    --pjt-brown-medium: #6B4226;
    --pjt-brown-light: #8B6914;
    --pjt-pink: #E87BAB;
    --pjt-pink-dark: #D4629A;
    --pjt-blue-light: #A8C4F0;
    --pjt-blue-accent: #7EB3E0;
    --pjt-gold: #C4A035;
    --pjt-white: #FFFFFF;
    --pjt-black: #1A1A1A;
}

body {
    font-family: "termina", sans-serif;
    font-weight: 400;
}

h1 { font-weight: 900; }
h2 { font-weight: 700; }
h3 { font-weight: 600; }
h4 { font-weight: 500; }
h1, h2, h3, h4, h5{
    font-family: "termina", sans-serif !important;
    font-weight: 900 !important;
}

html {
/*     overflow-y: scroll; */
}

.elementor-popup-modal:not(:last-of-type) {
    display: none !important;
}


/* ===============================
   LOGO FLOAT ANIMATION
================================= */

.logomovement {
  display: inline-block;
  transform-origin: 50% 50%;
  will-change: transform;
  animation: logoFloat 5s ease-in-out infinite;
}

.logomovement.is-paused {
  animation-play-state: paused;
}

/* Target Elementor image directly */
.logomovement img {
  display: block;
  height: auto;
  transform-origin: 50% 55%;
  will-change: transform, filter;
  user-select: none;
  -webkit-user-drag: none;
}

/* ===============================
   ORGANIC FLOAT
================================= */

@keyframes logoFloat {
  0%   { transform: translate3d(0px, 0px, 0) scale(1); }
  20%  { transform: translate3d(2px, -2px, 0) scale(1.01); }
  40%  { transform: translate3d(-3px, 2px, 0) scale(0.995); }
  60%  { transform: translate3d(3px, 1px, 0) scale(1.008); }
  80%  { transform: translate3d(-2px, -1px, 0) scale(1.003); }
  100% { transform: translate3d(0px, 0px, 0) scale(1); }
}

/* ===============================
   PRESS EFFECT
================================= */

.logomovement img.is-pressing {
  animation: logoPress 360ms cubic-bezier(.25,.1,.25,1) both;
}

@keyframes logoPress {
  0%   { transform: translateY(0px) scale(1);      filter: brightness(1); }
  40%  { transform: translateY(4px) scale(0.96);   filter: brightness(0.95); }
  70%  { transform: translateY(-2px) scale(1.02);  filter: brightness(1.05); }
  100% { transform: translateY(0px) scale(1);      filter: brightness(1); }
}

/* ===============================
   ACCESSIBILITY
================================= */

@media (prefers-reduced-motion: reduce) {
  .logomovement {
    animation: none !important;
  }
  .logomovement img.is-pressing {
    animation: none !important;
  }
}







/* ===============================
   NEWSLETTER FOOTER
================================= */


.elementor-widget-form .elementor-form-fields-wrapper {
    position: relative;
    width: 100%;
}


.elementor-widget-form .elementor-field-group-email {
    width: 100%;
}

.elementor-widget-form .elementor-field-group-email input {
    padding-right: 120px;
}


.elementor-widget-form .elementor-field-type-submit {
    position: absolute;
    top: 40%;
    transform: translateY(-50%);
}

.elementor-widget-form .elementor-button {
    background: transparent !important;
    border: 1px solid #FFFDB7 !important;
    padding: 8px 18px;
}


@media (max-width: 1024px) {
    .elementor-widget-form .elementor-field-type-submit {
        top: 40%;
        transform: translateY(-50%);
    }

    .elementor-widget-form .elementor-field-group-email input {
        padding-right: 140px;
    }
}


@media (max-width: 767px) {

    .elementor-widget-form .elementor-form-fields-wrapper {
        position: relative;
    }

    .elementor-widget-form .elementor-field-type-submit {
		position: absolute;
        top: 130%;
        transform: translateY(-50%);
    }
	
    .elementor-widget-form .elementor-field-group-email input {
        padding-right: 20px;
        height: 60px;
        font-size: 16px;
    }

    .elementor-widget-form .elementor-button {
        padding: 8px 20px;
        font-size: 14px;
        color: #FFFDB7 !important;
    }
}

/*GALERIE CSS*/

/* 1) jedes Loop-Item ist die eigentliche Karte */
.page-id-3630 .e-loop-item {
  position: relative;
}

/* 2) der innere Elementor-Container wird zur quadratischen Flex-Karte */
.page-id-3630 .e-loop-item > .elementor-element.elementor-element-a120e74 {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  width: 100%;
  aspect-ratio: 1 / 1;
  overflow: hidden;
}

/* 3) Bild-Widget zurück in den normalen Layout-Flow */
.page-id-3630 .e-loop-item > .elementor-element.elementor-element-a120e74 .elementor-widget-image {
  position: relative !important;
  inset: auto !important;
  width: 100%;
  height: 100%;
  flex: 1 1 auto;
}

/* 4) Link + Bild füllen die Karte */
.page-id-3630 .e-loop-item > .elementor-element.elementor-element-a120e74 .elementor-widget-image a,
.page-id-3630 .e-loop-item > .elementor-element.elementor-element-a120e74 .elementor-widget-image img {
  display: block;
  width: 100%;
  height: 100%;
}

/* 5) Bild sauber croppen */
.page-id-3630 .e-loop-item > .elementor-element.elementor-element-a120e74 .elementor-widget-image img {
  position: static !important;
  max-width: none;
  object-fit: cover;
  object-position: center;
}

/* 6) Heading als Overlay */
.page-id-3630 .e-loop-item > .elementor-element.elementor-element-a120e74 .elementor-widget-heading {
  position: absolute !important;
  left: 18px;
  right: 18px;
  bottom: 18px;
  z-index: 2;
  margin: 0;
  pointer-events: none;
}

/* 7) Überschrift stabil umbrechen */
.page-id-3630 .e-loop-item > .elementor-element.elementor-element-a120e74 .elementor-heading-title {
  margin: 0;
  line-height: 0.95;
  overflow-wrap: break-word;
  word-break: normal;
}

/* 8) Mobile feinjustieren */
@media (max-width: 767px) {
  .page-id-3630 .e-loop-item > .elementor-element.elementor-element-a120e74 .elementor-widget-heading {
    left: 14px;
    right: 14px;
    bottom: 14px;
  }

  .page-id-3630 .e-loop-item > .elementor-element.elementor-element-a120e74 .elementor-heading-title {
    font-size: 34px;
    line-height: 0.95;
  }
}

.dakm-gallery-back-wrap {
	padding: 18px 0;
}

.dakm-gallery-back {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 24px;
    border: 0;
    border-radius: 999px;
    background: #bdd3fb;
    color: #4a3625 !important;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.2em;
    box-shadow: none;
    transition: background-color .2s ease, transform .2s ease, color .2s ease;
}

.dakm-gallery-back:hover,
.dakm-gallery-back:focus {
    background: #b3caf7;
    color: #4a3625 !important;
    text-decoration: none;
    transform: translateY(-1px);
}

.dakm-gallery-back:visited {
    color: #4a3625 !important;
}


.dakm-lightbox {
    position: fixed;
    inset: 0;
    z-index: 999999;
    background: rgba(0,0,0,.92);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem;
}

.dakm-lightbox[hidden] {
    display: none !important;
}

.dakm-lightbox-figure {
    margin: 0;
    max-width: min(96vw, 1600px);
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.dakm-lightbox-image {
    display: block;
    max-width: 100%;
    max-height: calc(90vh - 3rem);
    width: auto;
    height: auto;
    object-fit: contain;
    box-shadow: 0 10px 40px rgba(0,0,0,.4);
}

.dakm-lightbox-caption {
    margin-top: .75rem;
    color: #fff;
    text-align: center;
    font-size: .95rem;
}

.dakm-lightbox-close,
.dakm-lightbox-prev,
.dakm-lightbox-next {
    position: absolute;
    border: 0;
    background: rgba(255,255,255,.12);
    color: #fff;
    cursor: pointer;
    border-radius: 999px;
    width: 48px;
    height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 28px !important;
	padding-bottom: 12px !important;
    line-height: 1;
    backdrop-filter: blur(6px);
}

.dakm-lightbox-close {
    top: 20px;
    right: 20px;
}

.dakm-lightbox-prev {
    left: 20px;
    top: 50%;
    transform: translateY(-50%);
}

.dakm-lightbox-next {
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
}

html.dakm-lightbox-open,
html.dakm-lightbox-open body {
    overflow: hidden;
}

.wp-block-gallery img,
.gallery img {
    cursor: zoom-in;
}

.elementor-popup-modal.dialog-type-lightbox {
    backdrop-filter: blur(3px);
}










/* =========================
   HAMBURGER BUTTON
   Sitzt direkt im <body>, außerhalb
   jedes Elementor-Stacking-Contexts
========================= */
.hamburger-btn {
	position: fixed;
	top: 4.8rem;
	right: 4rem;
	z-index: 999999;
	width: 58px;
	height: 26px;
	cursor: pointer;
	display: inline-block;
}

.hamburger-btn span {
	display: block;
	position: absolute;
	left: 0;
	width: 100%;
	height: 0;
	border-top: 6px solid #5A3406;
	border-radius: 100px;
	transition:
		transform .25s cubic-bezier(0.22, 0.61, 0.36, 1),
		top .25s cubic-bezier(0.22, 0.61, 0.36, 1),
		border-color .3s ease;
}

.hamburger-btn span:nth-child(1) { top: 0; }
.hamburger-btn span:nth-child(2) { top: 16px; }

body.menu-active .hamburger-btn span {
	border-top: 5px solid #BED5FF;
}
body.menu-active .hamburger-btn span:nth-child(1) {
	top: 8px;
	transform: rotate(45deg);
}
body.menu-active .hamburger-btn span:nth-child(2) {
	top: 8px;
	transform: rotate(-45deg);
}

/* Elementor-Widget verstecken (falls noch vorhanden) */
.hamburger-cover {
	display: none !important;
}

/* custom-header darf Seiteninhalt nicht blockieren */
.custom-header {
	pointer-events: none !important;
}
.custom-header * {
	pointer-events: auto !important;
}

/* Logo ausblenden wenn Menü offen */
body.menu-active .circellogo img {
	display: none !important;
}

/* =========================
   MENU CONTAINER
========================= */
.custom-menu {
	width: 100vw;
	position: fixed;
	left: 0;
	top: 0;
	z-index: 10000;
	opacity: 0;
	height: 0;
	overflow: hidden;
	visibility: hidden;
	pointer-events: none;
	transition:
		opacity .3s ease,
		height .3s ease,
		visibility 0s linear .3s;
}

.custom-menu::-webkit-scrollbar { width: 0; }

body.menu-active .custom-menu {
	opacity: 1;
	height: 100vh;
	overflow-y: scroll;
	visibility: visible;
	pointer-events: auto;
	transition:
		opacity .3s ease,
		height .3s ease,
		visibility 0s linear 0s;
}

/* =========================
   MENU ITEMS ANIMATION
========================= */
.custom-menu-item {
	opacity: 0;
	transform: translateY(100%);
	transition: opacity 0.2s ease, transform 0.3s ease !important;
}

body.menu-active .custom-menu-item {
	opacity: 1;
	transform: translateY(0);
	transition: opacity 0.5s ease, transform 0.5s ease !important;
}

body.menu-active .menu-item-1 { transition-delay: .6s !important; }
body.menu-active .menu-item-2 { transition-delay: .7s !important; }
body.menu-active .menu-item-3 { transition-delay: .8s !important; }
body.menu-active .menu-item-4 { transition-delay: .9s !important; }
body.menu-active .menu-item-5 { transition-delay: 1s !important; }
body.menu-active .menu-item-6 { transition-delay: 1.1s !important; }

.custom-menu-item a.active { color: #ffffff !important; }

/* =========================
   SUBMENU
========================= */
.has-sub-menu .custom-menu-item { cursor: pointer; }

.has-sub-menu .custom-menu-item h3 {
	padding-right: 40px;
	position: relative;
}

.has-sub-menu .custom-menu-item h3::after {
	content: '';
	width: 20px;
	height: 20px;
	display: block;
	position: absolute;
	right: 0;
	top: 50%;
	background-image: url(/wp-content/uploads/2025/04/Arrow-3.svg);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	transform: rotate(180deg) translateY(12px);
	transition: transform 0.3s ease, opacity 0.3s ease;
	filter: invert(1) brightness(1000);
	opacity: .4;
}

.has-sub-menu .custom-sub-menu {
	max-height: 0;
	opacity: 0;
	overflow: hidden;
	transform: translateY(-10px);
	transition: max-height 0.5s ease, opacity 0.5s ease, transform 0.5s ease;
}

.has-sub-menu.sub-menu-active .custom-sub-menu {
	max-height: 193px;
	opacity: 1;
	transform: translateY(0);
}

.has-sub-menu.sub-menu-active .custom-menu-item h3::after {
	transform: rotate(0deg) translateY(-50%);
	filter: initial;
	opacity: 1;
}

/* =========================
   EXTRA ELEMENTE
========================= */
.menu-line {
	width: 0;
	transition: all 0.5s ease !important;
}
body.menu-active .menu-line {
	width: 100%;
	transition-delay: 1.2s !important;
}

.custom-social-icon,
.menu-form {
	opacity: 0;
	transform: translateY(100%);
	transition: opacity 0.2s ease, transform 0.3s ease !important;
}
body.menu-active .custom-social-icon {
	opacity: 1;
	transform: translateY(0);
	transition: opacity 0.5s ease, transform 0.5s ease !important;
	transition-delay: 1.4s !important;
}
body.menu-active .menu-form {
	opacity: 1;
	transform: translateY(0);
	transition: opacity 0.5s ease, transform 0.5s ease !important;
	transition-delay: 1.3s !important;
}

/* =========================
   MOBILE
========================= */
@media (max-width: 768px) {
	.hamburger-btn {
		width: 40px;
		height: 22px;
		top: 1.8rem;
		right:2rem;
	}
	body.menu-active .hamburger-btn {
    top: 1.9rem; /* anderer Wert wenn Menü offen */
}

	.hamburger-btn span { border-top: 4px solid #5A3406; }
	.hamburger-btn span:nth-child(1) { top: 0; }
	.hamburger-btn span:nth-child(2) { top: 14px; }

	body.menu-active .hamburger-btn span { border-top: 4px solid #BED5FF; }
	body.menu-active .hamburger-btn span:nth-child(1),
	body.menu-active .hamburger-btn span:nth-child(2) { top: 7px; }

	.has-sub-menu.sub-menu-active .custom-sub-menu {
		margin-top: 8px !important;
		max-height: 172px;
	}
}





footer {
    background-color: #231402 !important;
}

.slidervideo1-mobile {
    width: 100%;
    height: 100%;
}

.slidervideo1-mobile .pjt-mobile-video {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: contain !important;
    background-color: transparent !important;
}




/* marquee base */
.marquee {
  overflow: hidden;
  white-space: nowrap;
  display: flex;
}

.marquee-content {
  display: inline-block;
  padding-right: 10px !important;
  animation: scroll 20s linear infinite;
  color: #FFFDB7;
  font-family: 'Lexend', sans-serif;
  font-weight: 500;
  font-size: 15px;
}

/* only no-gap version */
.no-gap-marquee .marquee-content {
  animation: noGapScroll 10s linear infinite;
}

/* default animation */
@keyframes scroll {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-100%);
  }
}

/* gap fix animation */
@keyframes noGapScroll {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-50%);
  }
}

.elementor-150 .elementor-element.elementor-element-64214b1{--align-items: unset;}