/* =========================================================================
   Mode Erhard · Menü + Unterseiten (Galerie, Kontakt, Blog) im Stil von F
   Nur bestehende Bausteine: Fraunces/Jost, gedämpftes Rot, Bögen, Kacheln, Tusche.
   ========================================================================= */

/* ---------- Navigation: Menü-Knopf auch am Desktop ---------- */
.nav--plus .nav__burger{display:inline-flex;margin-left:1.8rem;padding-left:1.8rem;border-left:1px solid var(--line-ink)}
.nav--plus .nav__links a[aria-current=page]{color:var(--rosso)}
.nav--plus .nav__tel{border-left:0;padding-left:0;margin-left:2rem}
.nav--plus .nav__links a{white-space:nowrap}
@media (min-width:901px) and (max-width:1240px){.nav--plus .nav__links{gap:1.5rem;letter-spacing:.14em}.nav--plus .nav__tel{display:none}}
@media (min-width:901px) and (max-width:1020px){.nav--plus .nav__links{gap:1.1rem;letter-spacing:.1em}}

/* ---------- Menü ---------- */
.arkade .menu{background:var(--wine);color:var(--paper);justify-content:center;padding:calc(6rem + env(safe-area-inset-top,0px)) var(--g) 3rem}
.arkade .menu::after{content:'';position:absolute;left:0;right:0;bottom:0;height:clamp(48px,7vw,90px);
  background:repeating-linear-gradient(90deg,var(--paper) 0 10%,#9DB5BF 10% 13%,var(--paper) 13% 16%,var(--terra) 16% 26%,var(--sand) 26% 36%,var(--rosso) 36% 46%,var(--oro) 46% 56%,var(--bord) 56% 66%,var(--sand) 66% 76%,var(--terra) 76% 86%,var(--paper) 86% 100%)}
.arkade .menu__inner{display:grid;grid-template-columns:1.3fr .7fr;gap:clamp(2rem,6vw,7rem);align-items:center;max-width:1300px;width:100%;margin:0 auto;padding-bottom:4rem}
.arkade .menu__links{display:grid;grid-template-columns:1fr 1fr;gap:.1rem 2.5rem}
.arkade .menu__links a{display:flex;align-items:baseline;gap:.9rem;font-family:var(--serif);font-weight:330;font-size:clamp(2rem,4.4vw,4rem);line-height:1.18;letter-spacing:-.02em;transition:color .4s var(--ease),transform .5s var(--out)}
.arkade .menu__links a:hover,.arkade .menu__links a[aria-current=page]{font-style:italic;color:#E9C9BF;transform:translateX(.4rem)}
.arkade .menu__no{font-style:italic;font-size:.9rem;opacity:.6;min-width:2.2em}
.arkade .menu__aside{display:grid;grid-template-columns:auto 1fr;gap:1.6rem;align-items:end}
.arkade .menu__arch{margin:0;width:clamp(140px,13vw,210px);aspect-ratio:3/4;border-radius:999px 999px 0 0;overflow:hidden;outline:1px solid rgba(244,238,228,.6);outline-offset:8px}
.arkade .menu__arch img{width:100%;height:100%;object-fit:cover}
.arkade .menu__info{display:grid;gap:.8rem;font-size:.95rem;line-height:1.5}
.arkade .menu__cap{font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;font-weight:500;opacity:.7}
.arkade .menu__info .l-btn{justify-self:start;margin-top:.6rem;background:var(--paper);border-color:var(--paper);color:var(--ink)}
.arkade .menu__info .l-btn:hover{background:var(--rosso);border-color:var(--rosso);color:var(--paper)}
.arkade.menu-open .nav{color:var(--paper);background:transparent;border-color:transparent}
.arkade.menu-open .nav .wordmark em{color:#E9C9BF}

/* ---------- Unterseiten: Kopf ---------- */
.p{padding-top:calc(4.2rem + env(safe-area-inset-top,0px))}
.p-head{padding-top:clamp(4rem,8vw,7rem);padding-bottom:clamp(2.5rem,5vw,4rem)}
.p-head .l-h2{max-width:16ch}
.p-cta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:2rem;padding-top:clamp(4rem,8vw,7rem);padding-bottom:clamp(4rem,8vw,6rem)}

/* ---------- Galerie ---------- */
.g-grid{columns:3 280px;column-gap:clamp(1rem,2.2vw,2rem)}
.g-item{break-inside:avoid;margin-bottom:clamp(1rem,2.2vw,2rem)}
.g-open{appearance:none;border:0;padding:0;background:var(--sand);display:block;width:100%;cursor:zoom-in;overflow:hidden;position:relative}
.g-open img{width:100%;display:block;aspect-ratio:4/3;object-fit:cover;transition:transform 1.2s var(--out)}
.g-item.is-arch .g-open{border-radius:999px 999px 0 0}
.g-item.is-arch .g-open img{aspect-ratio:3/4}
.g-open:hover img{transform:scale(1.04)}
.g-cap{margin-top:.6rem;opacity:.6}
.g-box{border:0;padding:0;background:transparent;max-width:none;max-height:none;width:100vw;height:100vh}
.g-box::backdrop{background:rgba(42,23,20,.92)}
.g-box[open]{display:flex;align-items:center;justify-content:center}
.g-box figure{margin:0;max-width:min(88vw,1400px);display:flex;flex-direction:column;align-items:center;gap:.8rem}
.g-box img{max-width:100%;max-height:82vh;object-fit:contain}
.g-box figcaption{color:var(--paper);opacity:.8}
.g-box__close,.g-box__nav{position:absolute;appearance:none;border:1px solid rgba(244,238,228,.5);background:none;color:var(--paper);width:3rem;height:3rem;border-radius:50%;font-size:1.3rem;cursor:pointer}
.g-box__close{top:1.2rem;right:1.2rem}
.g-box__prev{left:1.2rem;top:50%}
.g-box__next{right:1.2rem;top:50%}

/* ---------- Kontakt ---------- */
.k-contact{background:var(--azz);padding:clamp(4rem,8vw,7rem) 0}
.k-contact__grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(2rem,5vw,5rem);align-items:start}
.k-form{position:relative;background:var(--paper);padding:clamp(1.8rem,4vw,3.6rem);display:grid;gap:1.3rem;box-shadow:0 40px 80px -40px rgba(30,52,64,.5)}
.k-form::before{content:'';position:absolute;inset:10px;border:1px dashed var(--line-ink);pointer-events:none}
.k-form > *{position:relative}
.k-form__row{display:grid;grid-template-columns:1fr 1fr;gap:1.3rem}
.k-form label{display:grid;gap:.45rem}
.k-form label > span{font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;font-weight:500;opacity:.7}
.k-form input,.k-form select,.k-form textarea{font:inherit;font-size:1rem;color:var(--ink);background:transparent;border:0;border-bottom:1px solid var(--ink);padding:.6rem 0;border-radius:0;outline:none;transition:border-color .3s}
.k-form textarea{border:1px solid var(--line-ink);padding:.8rem;resize:vertical}
.k-form input:focus,.k-form select:focus,.k-form textarea:focus{border-color:var(--rosso)}
.k-form .is-error{border-color:var(--rosso)!important;background:rgba(154,46,38,.05)}
.k-form__hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.k-form__check{grid-template-columns:auto 1fr!important;align-items:start;gap:.8rem!important;font-size:.9rem;line-height:1.5}
.k-form__check input{width:1.1rem;height:1.1rem;margin-top:.2rem;accent-color:var(--rosso)}
.k-form__check a{text-decoration:underline;text-underline-offset:3px}
.k-form__foot{display:flex;align-items:center;gap:1.4rem;flex-wrap:wrap;margin-top:.6rem}
.k-form__hint{opacity:.55}
.k-form__status{font-size:.95rem;min-height:1.4em}
.k-form__status.is-ok{color:#2F6E43}
.k-form__status.is-err{color:var(--rosso)}
.k-direct{position:relative;color:var(--ink)}
.k-direct__illu{width:min(100%,24rem);margin:-1rem 0 0}
.k-direct__illu .l-ink{--c:var(--ink)}
.k-direct__sign{font-size:2.4rem;margin:.4rem 0 1.4rem}
.k-direct .l-table{border-top-color:var(--ink)}
.k-direct__map{position:relative;display:block;width:200px;height:200px;border-radius:50%;overflow:hidden;margin-top:2rem;box-shadow:0 0 0 8px var(--paper),0 0 0 9px var(--rosso)}
.k-direct__map img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) sepia(.3) contrast(.92)}
.k-direct__map span{position:absolute;left:50%;bottom:1.4rem;transform:translateX(-50%);background:var(--ink);color:var(--paper);padding:.6rem 1rem;border-radius:999px;white-space:nowrap}

/* ---------- Blog ---------- */

@media (max-width:900px){
  .arkade .menu__inner{grid-template-columns:1fr}
  .arkade .menu__links{grid-template-columns:1fr}
  .arkade .menu__aside{display:none}
  .nav--plus .nav__burger{margin-left:auto;padding-left:0;border-left:0}
  .k-contact__grid{grid-template-columns:1fr}
  .k-form__row{grid-template-columns:1fr}
}
.k-form__check span{text-transform:none!important;letter-spacing:0!important;font-size:.92rem!important;opacity:.9!important}
.k-form__check input.is-error{outline:2px solid var(--rosso);outline-offset:2px}

/* ---------- Rechtstexte im Stil von F ---------- */
.linie .legal{max-width:860px;padding:clamp(4rem,8vw,7rem) var(--g) clamp(5rem,9vw,8rem);padding-top:calc(4.2rem + clamp(3rem,7vw,6rem))}
.linie .legal h1{font-family:var(--serif);font-weight:330;font-variation-settings:'SOFT' 30,'WONK' 0;font-size:clamp(2.6rem,5.6vw,4.8rem);line-height:1;letter-spacing:-.025em;margin-bottom:2.2rem}
.linie .legal h2{font-family:var(--serif);font-weight:400;font-size:clamp(1.4rem,2.2vw,1.8rem);margin:2.6rem 0 .8rem}
.linie .legal .eyebrow{color:var(--rosso);opacity:1;font-size:.8rem}
.linie .legal a{color:var(--rosso)}

/* Personal Shopping: eigene Unterseite (der Abschnitt aus dem roten Kapitel der Startseite) */
.ps-page{overflow:hidden;padding-top:calc(4.2rem + clamp(1.6rem,3.5vw,3.4rem));padding-bottom:clamp(3.4rem,6vw,5.5rem)}
.ps-page .ps{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(2.5rem,6vw,7rem);align-items:center}
.ps-page .ps__steps h2{font-family:var(--serif);font-style:italic;font-weight:400;font-size:1.5rem;margin:.2rem 0 .35rem;letter-spacing:0}
.ps-quote__grid{display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(2.5rem,6vw,7rem);align-items:center}
.ps-quote__fig{margin:0;padding-left:clamp(1.4rem,3vw,2.6rem);border-left:1px solid var(--rosso)}
.ps-quote__fig blockquote{margin:0;font-family:var(--serif);font-weight:330;font-size:clamp(1.5rem,2.3vw,2.2rem);line-height:1.3}
.ps-quote__fig blockquote em{font-style:italic;color:var(--rosso)}
.ps-quote__fig figcaption{display:flex;flex-direction:column;gap:.3rem;margin-top:1.4rem}
.ps-quote__fig .l-script{font-size:clamp(1.6rem,2.2vw,2.1rem);color:var(--rosso)}
.ps-quote__cta .l-lead{margin:0 0 1.6rem}
@media (max-width:900px){.ps-page .ps,.ps-quote__grid{grid-template-columns:1fr}}
.nav--plus .wordmark{font-size:clamp(2.2rem,2.7vw,2.7rem);line-height:.75}

/* Facebook / Instagram: runde Linien-Symbole wie die Slider-Pfeile */
.social{display:flex;align-items:center;gap:1.1rem;margin-top:clamp(1.6rem,3vw,2.2rem)}
.social ul{display:flex;gap:.7rem;list-style:none;margin:0;padding:0}
.social a{display:grid;place-items:center;width:3rem;height:3rem;border:1px solid currentColor;border-radius:50%;color:var(--ink);transition:background .3s,color .3s,border-color .3s}
.social svg{width:1.25rem;height:1.25rem;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.social a:hover,.social a:focus-visible{background:var(--rosso);border-color:var(--rosso);color:var(--paper)}
.social__label{opacity:.7}
.social--paper a{color:var(--paper)}

/* Galerie im Stil des Rundgangs der Startseite: 12er-Raster, breit + Bogen, drei mittlere, Panorama (ohne Filter) */
.g-grid--rund{columns:auto;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(2.4rem,4vw,4rem) clamp(1.4rem,2.6vw,2.6rem);align-items:end;list-style:none;padding-left:var(--g);padding-right:var(--g)}
.g-grid--rund .g-item{margin:0}
.g-grid--rund .g-open{height:var(--h);border-radius:2px}
.g-grid--rund .g-open img{height:100%;aspect-ratio:auto}
.g-grid--rund .g-item.is-arch .g-open{border-radius:999px 999px 0 0;outline:1px solid var(--rosso);outline-offset:12px;margin:14px 14px 0;height:calc(var(--h) - 14px);width:calc(100% - 28px)}
.g-grid--rund .g-item.is-arch .g-open img{aspect-ratio:auto}
.g-grid--rund .g-cap{opacity:.75;margin-top:1rem}
.g-grid--rund .is-wide{grid-column:1/span 7;--h:clamp(340px,60vh,640px)}
.g-grid--rund .is-arch:not(.is-mid){grid-column:8/span 5;--h:clamp(380px,68vh,720px)}
.g-grid--rund .is-mid{grid-column:span 4;--h:clamp(300px,46vh,500px)}
.g-grid--rund .is-mid.is-arch{--h:clamp(340px,54vh,580px)}
.g-grid--rund .is-pano{grid-column:1/-1;--h:clamp(320px,64vh,740px)}
.g-grid--rund .is-pano .g-cap{text-align:right}
@media (max-width:900px){
  .g-grid--rund{grid-template-columns:1fr;gap:2.2rem}
  .g-grid--rund .g-item{grid-column:1/-1!important;--h:auto!important}
  .g-grid--rund .g-open{height:auto;aspect-ratio:4/3}
  .g-grid--rund .g-item.is-arch .g-open{height:auto;aspect-ratio:4/5}
  .g-grid--rund .is-pano .g-cap{text-align:left}
}
.nav--plus .nav__tel{white-space:nowrap}

/* Sprachumschalter DE | IT in der Navigation */
.nav__lang{display:flex;align-items:center;gap:.15rem;margin-left:1.6rem;font-size:.72rem;letter-spacing:.18em;font-weight:500}
.nav__lang a{padding:.35rem .45rem;opacity:.55;transition:opacity .3s,color .3s}
.nav__lang a[aria-current],.nav__lang a:hover{opacity:1;color:var(--rosso)}
@media (max-width:900px){.nav__lang{margin-left:auto;margin-right:.9rem}.nav--plus .nav__burger{margin-left:0}}
/* Menü: Personal Shopping als letzte Zeile über beide Spalten */
.arkade .menu__links li.is-wide{grid-column:1 / -1}
.arkade.menu-open .nav__lang a[aria-current],.arkade.menu-open .nav__lang a:hover{color:#E9C9BF}
.nav__lang{white-space:nowrap;flex-wrap:nowrap}
@media (max-width:900px){.nav__lang{font-size:.66rem;letter-spacing:.12em;margin-right:.6rem}.nav__lang a{padding:.3rem .42rem}}

/* Sprachumschalter: alle Kürzel auf einer Linie, Trennstrich als feine Linie zwischen den Feldern (nicht in der Textzeile) */
.nav__lang{align-items:center;gap:0}
.nav__lang a{position:relative;display:inline-flex;align-items:center;line-height:1;padding:.4rem .55rem}
.nav__lang a + a::before{content:'';position:absolute;left:0;top:50%;width:1px;height:.85em;background:currentColor;opacity:.45;transform:translateY(-50%)}
/* Platz für den Sprachumschalter: Telefonnummer oben erst ab 1500 px (steht auch im Besuch-Bereich), kleine Handys nur das Menü-Symbol */
@media (min-width:901px) and (max-width:1500px){.nav--plus:has(.nav__lang) .nav__tel{display:none}}
@media (max-width:400px){.nav--plus .nav__burger span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.nav__lang{margin-right:.3rem}}
@media (min-width:901px) and (max-width:1180px){.nav--plus:has(.nav__lang) .nav__links{display:none}.nav--plus:has(.nav__lang) .nav__lang{margin-left:auto}}

/* Fußzeile: Powered by Advertos (Logo einfarbig in Textfarbe, wie die Marken-Logos) */
.footer__by{margin:1.6rem 0 0;display:flex;justify-content:center}
.footer__by a{display:inline-flex;align-items:center;gap:.7rem;font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;opacity:.6;transition:opacity .3s}
.footer__by a:hover,.footer__by a:focus-visible{opacity:1}
.footer__adv{display:block;width:5.6rem;aspect-ratio:2560/430;background:currentColor;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}
