/* Freigegebener Entwurf 20.10.2026 · lokal gehostete Schriften und Fotografie. */
@font-face{font-family:"Bodoni Moda";font-style:normal;font-weight:500;font-display:swap;src:url("fonts/bodoni-moda-500-latin.woff2") format("woff2")}
@font-face{font-family:"Bodoni Moda";font-style:italic;font-weight:500;font-display:swap;src:url("fonts/bodoni-moda-500-italic-latin.woff2") format("woff2")}
:root{--salon-green:#102d25;--salon-cream:#f5f0e6;--salon-gold:#d8bc7e;--salon-line:rgba(216,188,126,.65);--salon-serif:"Bodoni Moda",Georgia,"Times New Roman",serif;--salon-sans:"Helvetica Neue",Helvetica,Arial,sans-serif;--gutter:clamp(28px,5.9vw,110px)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}
body.salon-home{margin:0;background:var(--salon-green);color:var(--salon-cream);font-family:var(--salon-sans);-webkit-font-smoothing:antialiased}
.salon-home a{color:inherit;text-decoration:none}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--salon-gold);outline-offset:6px}
.skip-link{position:absolute;top:15px;left:24px;padding:12px 18px;background:var(--salon-cream);color:var(--salon-green)!important;z-index:20;transform:translateY(-180%)}.skip-link:focus{transform:translateY(0)}
.salon-hero{position:relative;isolation:isolate;display:flex;flex-direction:column;min-height:clamp(750px,54.8vw,930px);background:#1c1712}
.hero-photo{position:absolute;inset:0;z-index:-3;width:100%;height:100%;object-fit:cover;object-position:center 57%;pointer-events:none}
.salon-hero::before{content:"";position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,rgba(3,24,19,.95) 0%,rgba(3,24,19,.83) 25%,rgba(4,20,15,.40) 53%,rgba(0,0,0,.09) 78%),linear-gradient(180deg,rgba(0,0,0,.26),transparent 26%,transparent 72%,rgba(0,0,0,.3))}
.salon-hero::after{content:"";position:absolute;inset:15px 15px 0;z-index:4;border:1px solid var(--salon-line);outline:1px solid rgba(216,188,126,.6);outline-offset:4px;border-bottom:0;pointer-events:none}
.site-header{display:flex;align-items:flex-start;justify-content:space-between;gap:28px;padding:32px var(--gutter) 22px;position:relative;z-index:5}
.brand{display:inline-flex;align-items:center;gap:38px;text-decoration:none;color:var(--salon-gold)!important;flex:none}
.brand-wordmark{display:flex;flex-direction:column;text-align:center;width:140px;padding:4px 0 10px;border-top:1px solid var(--salon-line);border-bottom:1px solid var(--salon-line)}
.brand-the{font-family:var(--salon-sans);font-size:9px;letter-spacing:5px;text-transform:uppercase;padding-left:5px;line-height:1.4}
.brand-name{font-family:var(--salon-serif);font-size:26px;font-weight:500;line-height:1.45;white-space:nowrap}
.brand-salon{font-family:var(--salon-sans);font-size:10px;line-height:1.4;letter-spacing:7px;padding-left:7px;text-transform:uppercase}
.brand-city{font-family:var(--salon-sans);font-size:9px;letter-spacing:4px;text-transform:uppercase;padding-left:30px;border-left:1px solid var(--salon-line);line-height:36px}
.site-nav{display:flex;gap:40px;align-items:center;padding-top:13px;font-size:14px;letter-spacing:.035em}
.site-nav a{text-decoration:none;color:var(--salon-cream);padding:8px 0;white-space:nowrap;transition:color .18s}.site-nav a:hover{color:var(--salon-gold)}.nav-waitlist span{color:var(--salon-gold);margin-left:10px}
.hero-content{padding:14px var(--gutter) 28px;flex:1;position:relative;z-index:1}
.eyebrow{font-family:var(--salon-sans);font-size:11px;font-weight:500;line-height:1.7;letter-spacing:.32em;text-transform:uppercase;color:var(--salon-gold)}.edition{margin:0 0 21px}
.salon-hero h1{font-family:var(--salon-serif);font-weight:500;font-size:clamp(70px,6.65vw,112px);line-height:.96;letter-spacing:-.05em;margin:0 0 14px;text-wrap:balance}.salon-hero h1 span{display:block}
.hero-question{font-family:var(--salon-serif);font-size:clamp(28px,3.05vw,48px);font-weight:500;font-style:italic;line-height:1.25;letter-spacing:-.035em;color:var(--salon-gold);margin:0 0 16px}
.hero-intro{font-family:Georgia,"Times New Roman",serif;font-size:clamp(17px,1.42vw,23px);line-height:1.5;margin:0 0 25px;max-width:610px}
.salon-button{display:inline-flex;justify-content:center;align-items:center;gap:14px;background:var(--salon-cream);border:1px solid var(--salon-cream);color:var(--salon-green)!important;padding:16px 30px;font-family:var(--salon-sans);font-size:16px;line-height:1.35;text-decoration:none;transition:background .18s,border-color .18s}.salon-button:hover{background:var(--salon-gold);border-color:var(--salon-gold)}
.invitation{font-family:Georgia,"Times New Roman",serif;font-size:12px;letter-spacing:.24em;line-height:1.6;margin:12px 0 0}
.location-caption{position:absolute;right:var(--gutter);bottom:142px;font-family:Georgia,"Times New Roman",serif;font-size:14px;letter-spacing:.025em;text-shadow:0 1px 8px #000;margin:0}.location-caption span{padding:0 8px}
.salon-facts{display:grid;grid-template-columns:repeat(3,1fr);position:relative;border-top:1px solid var(--salon-line);background:rgba(4,34,27,.78);padding:18px var(--gutter) 20px}
.salon-facts p{text-align:center;margin:0;display:flex;flex-direction:column;align-items:center}.salon-facts p+p{border-left:1px solid var(--salon-line)}
.fact-number{font-family:var(--salon-serif);font-weight:500;font-size:64px;line-height:1;color:var(--salon-gold);letter-spacing:-.04em}.fact-label{font-size:10px;line-height:1.5;letter-spacing:.32em;text-transform:uppercase;margin-top:8px}
.salon-hosts{background:var(--salon-cream);color:#17241d;padding:27px var(--gutter) 34px}
.section-label{display:flex;align-items:center;gap:18px;margin:0 0 20px;color:#a17e3d;font-weight:500}.section-label::before{content:"";width:42px;height:1px;background:currentColor}
.host-grid{display:grid;grid-template-columns:1fr 1fr}.host-grid>div{text-align:center;padding:0 24px}.host-grid>div+div{border-left:1px solid #b8a780}
.host-grid h3{font-family:var(--salon-serif);font-size:clamp(30px,3.5vw,56px);line-height:1.15;font-weight:500;letter-spacing:-.04em;margin:0 0 12px}.host-grid p{font-family:Georgia,"Times New Roman",serif;font-size:14px;letter-spacing:.2em;line-height:1.7;margin:0}
.salon-invitation{padding:80px var(--gutter) 75px;max-width:1100px;margin:0 auto;text-align:center}.salon-invitation .section-label{justify-content:center;color:var(--salon-gold)}.salon-invitation .section-label::after{content:"";width:42px;height:1px;background:currentColor}
.salon-invitation h2{font-family:var(--salon-serif);font-size:clamp(36px,4.2vw,62px);font-weight:500;line-height:1.15;letter-spacing:-.035em;margin:0 0 25px}.invitation-copy{font-size:16px;line-height:1.8;max-width:650px;margin:0 auto 30px;color:#e2dacb}.invitation-hint{font-size:12px;color:#c5bda9;line-height:1.7;margin:18px 0 0}
.salon-footer{border-top:1px solid rgba(216,188,126,.25);padding:28px var(--gutter);display:flex;flex-wrap:wrap;gap:18px 32px;justify-content:space-between;color:#c5bda9;font-size:12px;line-height:1.5}.salon-footer nav{display:flex;gap:24px}.salon-footer a:hover{text-decoration:underline}.photo-credit{width:100%;font-size:10px;opacity:.8}
/* Gemeinsamer Rahmen der bestehenden Formular- und Pflichtseiten. */
body.salon-subpage{background:var(--salon-green);color:var(--salon-cream)}
.salon-subpage .site-header{max-width:1600px;margin:0 auto;text-align:left;align-items:center;border-bottom:1px solid rgba(216,188,126,.25)}.salon-subpage .site-nav{font-family:var(--salon-sans);font-weight:400;letter-spacing:.035em;text-transform:none}
.salon-subpage .block{padding-top:60px}.salon-subpage h1,.salon-subpage h2,.salon-subpage .bewerbung legend{font-family:var(--salon-serif);font-weight:500}.salon-subpage .page{padding-top:45px}
.salon-subpage .page{hyphens:auto;overflow-wrap:anywhere}.salon-subpage .page h1{font-size:clamp(28px,4.5vw,38px);line-height:1.2}
.salon-subpage .cta{border-color:var(--salon-gold);background:var(--salon-cream)!important;color:var(--salon-green)!important;text-transform:none;letter-spacing:.04em;font-size:15px;font-weight:400}.salon-subpage .cta:hover{background:var(--salon-gold)!important}.salon-subpage footer{background:#0c251e}
@media(min-width:1700px){.hero-content{padding-top:25px}.hero-intro{margin-bottom:30px}.site-header{padding-top:38px}}
@media(max-width:1100px){.site-nav{gap:24px}.brand{gap:20px}.brand-city{padding-left:20px}.salon-hero{min-height:760px}.location-caption{font-size:11px;right:30px;bottom:132px}.hero-content{padding-top:24px;padding-bottom:45px}.hero-question{max-width:660px}.fact-number{font-size:58px}}
@media(max-width:760px){
 :root{--gutter:28px}.salon-hero{min-height:0}.salon-hero::after{inset:10px 10px 0;outline-offset:3px}.hero-photo{object-position:68% center}
 .salon-hero::before{background:linear-gradient(90deg,rgba(3,24,19,.92),rgba(3,24,19,.65) 60%,rgba(4,20,15,.25)),linear-gradient(180deg,rgba(0,0,0,.15),transparent 60%,rgba(3,24,19,.72))}
 .site-header{padding:25px var(--gutter) 18px;align-items:center;gap:18px}.brand-wordmark{width:112px}.brand-name{font-size:21px}.brand-the{font-size:8px}.brand-salon{font-size:9px;letter-spacing:5px;padding-left:5px}.brand-city{display:none}
 .site-nav{gap:0;padding:0;font-size:12px}.site-nav a:not(.nav-waitlist){display:none}.site-nav .nav-waitlist{display:inline-flex;gap:5px;align-items:center}.nav-waitlist span{margin:0}
 .hero-content{padding-top:32px;padding-bottom:26px}.eyebrow{font-size:9px;letter-spacing:.19em}.edition{margin-bottom:24px}
 .salon-hero h1{font-size:clamp(48px,11.3vw,84px);line-height:1.02;letter-spacing:-.04em;margin-bottom:18px}.hero-question{font-size:clamp(27px,6.7vw,39px);max-width:400px;line-height:1.18;margin-bottom:23px}
 .hero-intro{font-size:16px;line-height:1.6;max-width:390px;margin-bottom:26px}.hero-intro br{display:none}.salon-button{padding:15px 23px;font-size:15px;min-height:52px}.invitation{font-size:10px;letter-spacing:.15em;margin-top:13px}
 .location-caption{position:static;margin:0 var(--gutter) 23px;font-size:10px;color:#e1d6c3;letter-spacing:.02em}
 .salon-facts{padding:20px 16px 22px;background:rgba(4,34,27,.72)}.fact-number{font-size:44px}.fact-label{font-size:8px;letter-spacing:.2em}
 .salon-hosts{padding:30px var(--gutter) 37px}.section-label{font-size:9px;letter-spacing:.2em;gap:12px;margin-bottom:27px}.section-label::before{width:28px}
 .host-grid{grid-template-columns:1fr;gap:26px}.host-grid>div{padding:0}.host-grid>div+div{border-left:0;border-top:1px solid #d7cbb1;padding-top:27px}.host-grid h3{font-size:38px;margin-bottom:9px}.host-grid p{font-size:11px;letter-spacing:.15em}
 .salon-invitation{padding:58px var(--gutter)}.salon-invitation h2{font-size:36px}.invitation-copy{font-size:15px;line-height:1.8}.salon-invitation .section-label{font-size:8px;letter-spacing:.16em;gap:10px}.salon-invitation .section-label::before,.salon-invitation .section-label::after{width:20px}
 .salon-footer{padding:25px var(--gutter);font-size:11px;gap:18px}.salon-footer>span:first-child{width:100%}
 .salon-subpage .site-header{padding:24px 22px}.salon-subpage .site-nav a{display:block!important}.salon-subpage .site-nav a[href*="#"]{display:none!important}.salon-subpage .block{padding-top:40px}.salon-subpage .page{padding-top:30px}
}
@media(max-width:360px){:root{--gutter:23px}.site-nav{font-size:11px}.hero-content{padding-top:26px}.salon-hero h1{font-size:45px}.hero-question{font-size:26px}.hero-intro{font-size:15px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important}}
