/*
Theme Name: Kafi Theodor
Theme URI: https://kafitheodor.ch
Author: Kafi Theodor / Quellenhof-Stiftung
Description: Original-Design von kafitheodor.ch («locked»), alle Inhalte im Customizer unter «Kafi Theodor – Inhalte». Keine Plugins nötig: Kontaktformular mit Honeypot, Zeit-Token, Nonce und Rate-Limit ist eingebaut.
Version: 1.2.0
Requires at least: 6.7
Tested up to: 7.2
Requires PHP: 8.2
License: GNU General Public License v2 or later
Text Domain: kafitheodor
*/

/* ===== Original-CSS kafitheodor.ch (unverändert; Info-Box-Regeln entfernt, da durch Popup ersetzt) ===== */
body,
html {
    --theogreen: #074C2C;
    --clip-path-hexagon: polygon(50% 0.5%, 0.5% 25%, 0.5% 75%, 50% 99.5%, 99.5% 75%, 99.5% 25%);
    margin: 0;
    padding: 0;
    font-family: filson-pro, sans-serif;
    font-weight: 500;
    font-style: normal;
    color: var(--theogreen);
    background-color: white;
    scroll-behavior: smooth;
    max-width: 100vw;
    overflow-x: hidden
}
h1, h2, h3, h4, p { margin: 0; line-height: 1.6; max-width: 30em }
h1, h2, h3, h4, h5 { line-height: 1; letter-spacing: -.025em; margin-bottom: .5em }
h1 { font-size: max(2em, 4.5vw) }
h2 { font-size: max(1.5em, 3vw) }
h3 { font-size: max(1.25em, 2vw) }
p { margin-bottom: .5em; font-size: 1em; font-weight: 300 !important; letter-spacing: .05em; line-height: 1.7 }
address { font-style: normal }
article a { font-weight: 500 }
article>a, article>address { line-height: 1.9; display: inline-block; }
a.button::before, a.button::after { font-size: 1.5em; position: relative; top: .1em }
a.button { display: inline-block; margin-bottom: 1.5em }
article a::before { content: "["; padding-right: .2em }
article a::after { content: "]"; padding-left: .2em }
input, select, textarea {
    font-size: 1em; font-family: filson-pro, sans-serif; padding: .75em; width: calc(100% - 1em);
    border: none; border-radius: 0; background-color: rgba(200, 200, 200, 0.1); margin-bottom: .5em;
    -webkit-appearance: none; outline: none; position: relative; border: .2em solid transparent; color: var(--theogreen)
}
input[type=submit], select { width: 100% }
form :focus { border: 0.2em solid var(--theogreen) }
a { color: #000000; color: inherit; text-decoration: none; cursor: pointer }
a:hover { text-decoration: underline }
body { max-width: 100vw; overflow-x: hidden }
main { padding: 0 25vw; max-width: 100vw; overflow-x: hidden; overflow-y: scroll; max-height: 100vh; perspective: 360px; scroll-behavior: smooth }
main section:target article { transform: translateZ(-2em) scale(1.15, 1.15); transition: all 1s; transition-delay: .25s }
main>section { margin: 0; padding: 0; width: 100%; position: relative; margin-bottom: -25%; float: left; }
main>section:last-of-type { padding-bottom: 10em }
main>section::before { content: ""; display: block; float: left; padding-top: 115.473% }
main>section:nth-child(odd) { margin-left: -26% }
main>section:nth-child(odd) figure:first-child { margin-left: -104.5%; transform: translateZ(-4em) scale(1.025, 1.025); z-index: -3 }
main>section:nth-child(odd) figure:only-child { margin-left: 0 !important; transform: translateZ(-1em) scale(1.01, 1.01); z-index: -3 }
main>section:nth-child(odd) figure:nth-child(3) { margin-left: 104.5%; transform: translateZ(-2em) scale(1.01, 1.01); z-index: -3 }
main>section:nth-child(even) { margin-left: 26% }
main>section:nth-child(even) figure:first-child { margin-left: -104.5%; transform: translateZ(-6em) scale(1.125, 1.125); z-index: -3 }
main>section:nth-child(even) figure:only-child { margin-left: 0 !important; transform: translateZ(-3em) scale(1.11, 1.11); z-index: -3 }
main>section:nth-child(even) figure:nth-child(3) { margin-left: 104.5%; transform: translateZ(-5em) scale(1.11, 1.11); z-index: -3 }
main>section article~figure { margin-left: 104.5%; transform: translateZ(-1em) scale(1.1, 1.1); z-index: -3 }
main>section img { background-color: #F1E6D8; object-fit: cover; mix-blend-mode: multiply }
main>section:nth-of-type(odd) figure img:nth-of-type(odd) { background-color: #E9F8EC; background-color: #b3bfbe }
main>section figure {
    margin: 0; padding: 0; position: absolute; top: 0; left: 0; width: 100%; padding-bottom: 115.473%;
    display: block; object-fit: cover; display: flex; flex-direction: column; justify-content: center;
    transform: translateZ(-2em) scale(0.95, 0.95); z-index: 1; transform-style: preserve-3d; perspective: 360px;
    transition: perspective-origin .05s;
}
main>section figure img, main>section figure iframe {
    width: 100%; height: 100%; position: absolute; top: 0; left: 0;
    -webkit-clip-path: var(--clip-path-hexagon); clip-path: var(--clip-path-hexagon);
    transform: translateZ(-2em) scale(0.95, 0.95);
}
main>section iframe { -webkit-clip-path: var(--clip-path-hexagon); clip-path: var(--clip-path-hexagon); transform: translateZ(-1em) scale(0.9, 0.9) }
main>section article {
    margin-top: 10em; z-index: 1; width: calc(100% - max(4rem, 10vw)); padding-left: max(2rem, 5vw); padding-right: max(2rem, 5vw);
    transition: all .5s; transition-delay: 0s; padding-bottom: 5em; position: relative;
}
main iframe { position: absolute; left: 0; top: 0; width: 100%; height: 100%; pointer-events: none }
@media (max-width: 800px) { main { padding: 0 17vw } }
@media (min-width: 1200px) { main { padding: 0 30vw } }
header {
    position: fixed; top: 1em; z-index: 9999; display: flex; justify-content: space-between; align-items: flex-start;
    font-size: max(1.125em, 1vw + 0.75em); left: 2em; height: calc(100% - 1em); flex-direction: column; pointer-events: none
}
header nav { pointer-events: all }
header nav ul { padding: 0; margin: 0; list-style: none }
header nav ul li a { display: inline-block; color: inherit; text-decoration: none; padding: .05em; margin: .25em; border-bottom: .15em solid transparent }
header nav ul li a:hover { border-bottom-color: #074C2C; text-decoration: none }
header .logo { position: fixed; pointer-events: none; width: 4em; height: 4em; left: 50%; transform: translateX(-50%) }
header .logo img { width: 100%; height: 100%; object-fit: contain }
header aside { height: 5.5em }
@media (max-width: 800px) {
    body>header { left: 1em }
    nav ul { padding-top: .5em !important; transition: padding .5s; cursor: pointer }
    nav ul li { font-size: .5em; display: block; transition: all .25s; pointer-events: none }
    nav ul li a { padding: 0; margin: 0; color: transparent !important; background-color: var(--theogreen); height: .1em; overflow-y: hidden }
    nav::before { content: ""; display: block; position: fixed; background-color: white; width: 200%; height: 200%; top: 0; left: -250%; transform: translateX(0%); transition: all .5s; z-index: -1 }
    nav.open ul { font-size: 1.5em; padding-top: 4em !important }
    nav.open ul li { pointer-events: all; font-size: 1em }
    nav.open ul li a { padding: 0; margin: 0; color: var(--theogreen) !important; background-color: transparent; height: auto; overflow-y: auto }
    nav.open::before { transform: translateX(100%) }
}
em { font-style: normal }
.aktuell_content_wrap { margin-top: 1rem; width: calc(100% + 450px); float: left; }
.aktuell_content_wrap h4 { font-size: 1.25em; }
.two_div_column { width: 100%; float: left; }
.two_div_column .div_column { width: 43%; float: left; margin-right: 2%; }
.two_div_column .div_column_right { width: 53%; }
.two_div_column p { line-height: 1.5; max-width: 100%; }
.two_div_column p b { font-weight: 700; }
.two_div_column p span { font-weight: 400; }
@media (max-width: 991px) {
    .aktuell_content_wrap { width: calc(100% + 200px); }
    .two_div_column .div_column { width: 100% !important; }
    .two_div_column .div_column small { display: none; }
}
@media (max-width: 575px) {
    main>section article~figure { margin-left: auto; position: relative; left: 120px; display: block; width: 270px; transform: none; perspective: none; margin-top: -60px; padding-bottom: 60px; }
    main>section article~figure img { width: 100%; height: 100%; object-fit: cover; position: unset; background: #fff !important; }
    .aktuell_content_wrap { width: calc(100% + 65%); }
}
@media (max-width: 480px) {
    .two_div_column p { font-size: 14px; }
    .two_div_column p span { display: block; }
}
@media (max-width: 400px) { header aside { font-size: 14px; } }
.popup { left: 50%; top: 50%; background-color: white; transform: translate(-50%, -50%); position: fixed; z-index: 99999; padding: 2em; box-shadow: 0 2em 0em 50em rgba(0, 0, 0, .5); }
.popup p { max-width: 30em; }

/* ===== WordPress-Anpassungen ===== */
header .logo a { display: block; width: 100%; height: 100%; }
.icon { width: 1.25em; height: 1.25em; vertical-align: -.25em; fill: currentColor; }
@media (max-width: 800px) { nav:not(.open) .icon { display: none; } }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.kt-notice { font-weight: 500 !important; }
.kt-notice--err { color: #a02020; }
.popup[hidden] { display: none; }
.popup h4 { cursor: pointer; }
body.admin-bar header { top: calc(1em + 32px); }
#kontakt .hinweis { font-weight: 500 !important; }
a.tel { white-space: nowrap; font-size: 1.25em; margin-bottom: 1.5em; }
