:root{--primary-color:#292d32;--secondary-color:#c0a98e;--surface:#32373d;--surface-soft:#373c42;--muted:#c5c8cc;--line:rgba(255,255,255,.12)}
body{font-size:1.08rem;line-height:1.65}p{text-wrap:pretty}h1,h2,h3{letter-spacing:-.025em}h2{font-size:clamp(2.7rem,5vw,4.6rem);line-height:1}.hero,.about-me-inner,.projects,.contact-inner{max-width:1180px}.hero,.about-me-inner,.projects,.contact{padding-left:clamp(1.25rem,4vw,3rem);padding-right:clamp(1.25rem,4vw,3rem)}
#main-header{height:76px;border-bottom:1px solid var(--line);background:rgba(41,45,50,.92);backdrop-filter:blur(14px)}#logo-link{width:44px;height:44px}#main-header nav a{font-size:.76rem;font-weight:600;letter-spacing:.15em}.eyebrow{color:var(--secondary-color);font-size:.74rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase}
.hero{min-height:calc(100svh - 76px);display:grid;grid-template-columns:1fr;align-content:center;gap:3rem;text-align:left}.hero-content{align-items:flex-start;gap:1.35rem;order:1}.hero h1{max-width:760px;margin:0;font-size:clamp(3.3rem,8vw,6.7rem);line-height:.92;text-align:left}.hero h1 span{display:block;margin:0;font-family:var(--font-family-heading);font-size:inherit;color:var(--secondary-color)}.hero-intro{max-width:650px;color:var(--muted);font-size:clamp(1.05rem,2vw,1.28rem);text-align:left}.button-box{justify-content:flex-start;flex-wrap:wrap;margin-top:.35rem}.link-as-btn-primary,.link-as-btn-secondary{padding:.75rem 1.25rem;border-radius:0;font-size:.8rem;font-weight:600;letter-spacing:.08em;text-transform:none}
.hero-portrait-wrap{position:relative;justify-self:center;width:min(76vw,400px);padding:1.5rem;background:linear-gradient(145deg,#3a3f45,#24282d);border:1px solid var(--line);box-shadow:0 28px 70px rgba(0,0,0,.28)}.hero-portrait-wrap:before{content:"";position:absolute;inset:11px;border:1px solid rgba(192,169,142,.28);pointer-events:none}.hero-image{display:block;width:100%;max-width:none;aspect-ratio:1;object-fit:cover;filter:grayscale(1) contrast(1.02)}.portrait-kicker{display:block;margin:-.1rem 0 1rem;color:var(--secondary-color);font-size:.68rem;letter-spacing:.18em;text-transform:uppercase}.availability{position:absolute;right:-1rem;bottom:1.25rem;max-width:230px;padding:.7rem .85rem;background:#f3eee8;color:#292d32;font-size:.72rem;line-height:1.35;box-shadow:0 10px 25px rgba(0,0,0,.24)}.availability span,.employment-note>span{display:inline-block;width:.55rem;height:.55rem;margin-right:.45rem;border-radius:50%;background:#6b956f;box-shadow:0 0 0 4px rgba(107,149,111,.13)}
.about-me{background:#f1ede8;color:#292d32}.about-me-inner{min-height:auto;display:grid;grid-template-columns:1fr;gap:3.5rem;padding-top:clamp(5rem,9vw,8rem);padding-bottom:clamp(5rem,9vw,8rem);text-align:left}.about-me-content{align-items:flex-start;gap:1.25rem}.about-me-content h2{max-width:650px;text-align:left}.about-me-content h2 span{color:#8f765e}.about-me-content>p:not(.eyebrow){max-width:690px;color:#575b60;text-align:left}.text-link{margin-top:.6rem;padding-bottom:.2rem;border-bottom:1px solid #8f765e;color:#292d32;font-weight:600;text-decoration:none}.text-link:hover{color:#8f765e}.skills-grid{display:grid;grid-template-columns:1fr;border-top:1px solid rgba(41,45,50,.18)}.skills-grid article{position:relative;padding:1.5rem 0;border-bottom:1px solid rgba(41,45,50,.18)}.skills-grid article>span{color:#8f765e;font-size:.68rem;letter-spacing:.14em}.skills-grid h3{margin:.2rem 0 .4rem;font-family:var(--font-family-heading);font-size:1.65rem;font-weight:400}.skills-grid p{color:#62666b;font-size:.94rem;text-align:left}
.projects{padding-top:clamp(5rem,9vw,8rem)!important;padding-bottom:clamp(5rem,9vw,8rem)!important}.projects-heading>span{color:var(--muted)}.project-card{background:var(--surface);border-color:var(--line)}
.contact{min-height:auto!important;padding-top:clamp(5rem,9vw,8rem);padding-bottom:clamp(5rem,9vw,8rem);background:var(--surface-soft)}.contact>h2{color:#fff}.contact .contact-lead{margin-top:-.75rem;color:var(--secondary-color);font-family:var(--font-family-base);font-size:.82rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase}.contact-inner{align-items:start}.contact-inner>div p{color:var(--muted);text-align:left}.employment-note{padding:1rem;border-left:2px solid var(--secondary-color);background:rgba(0,0,0,.1);color:#fff!important;font-size:.9rem}.contact-form>div:not(.honeypot){display:grid;gap:.35rem}.contact-form label{color:#e9e9e9;font-size:.78rem;letter-spacing:.06em}.contact-form input,.contact-form textarea{padding:.7rem .8rem;border:1px solid rgba(255,255,255,.18);border-radius:0;outline:none;background:rgba(20,22,25,.22);color:#fff;font-family:inherit}.contact-form input:focus,.contact-form textarea:focus{border-color:var(--secondary-color);box-shadow:0 0 0 3px rgba(192,169,142,.12)}.contact-form textarea{min-height:170px;resize:vertical}.privacy-note{color:#b9bdc1;font-size:.72rem;line-height:1.5;text-align:left}.privacy-note a{color:#e3d4c3}
footer{padding:2rem 1rem;background:#22262a;color:#c3c6c9;font-size:.8rem}footer a{color:#e1d3c3}
@media(min-width:700px){.skills-grid{grid-template-columns:repeat(2,1fr)}.skills-grid article{padding:1.5rem}.skills-grid article:nth-child(odd){padding-left:0;border-right:1px solid rgba(41,45,50,.18)}}
@media(min-width:960px){.hero{grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);gap:clamp(3rem,7vw,7rem)}.hero-content{order:0}.about-me-inner{grid-template-columns:.9fr 1.1fr;align-items:start;gap:clamp(4rem,8vw,8rem)}.contact-inner{gap:clamp(3rem,7vw,7rem)}}
@media(min-width:1200px){.hero,.about-me,.projects,.contact{height:auto}.hero{min-height:calc(100svh - 76px)}.hero>div,.about-me-inner div{flex:initial}}
@media(max-width:600px){.hero{padding-top:3rem;padding-bottom:4.5rem}.hero-portrait-wrap{width:min(82vw,340px)}.availability{right:-.6rem}.button-box{width:100%}.button-box a{flex:1 1 150px}.contact-form textarea{min-height:180px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
.hero-portrait-wrap .hero-image{transform:scaleX(-1)}

/* Hero-Ausgleich: ruhiger, großzügiger und ohne Rahmen um das runde Portrait */
#main-header .header-inner{gap:1.5rem}
#main-header nav ul{gap:clamp(1rem,2.2vw,2rem)}
#main-header nav a{white-space:nowrap}
.hero{gap:clamp(2.5rem,5vw,5rem)}
.hero h1{max-width:670px;font-size:clamp(3rem,5.8vw,5rem);line-height:.98}
.hero-intro{max-width:590px}
.hero-portrait-wrap{width:min(44vw,520px);padding:0;border:0;background:transparent;box-shadow:none}
.hero-portrait-wrap:before{display:none}
.hero-portrait-wrap .hero-image{width:100%;filter:grayscale(1) contrast(1.04);filter:drop-shadow(0 28px 35px rgba(0,0,0,.27)) grayscale(1) contrast(1.04)}
.availability{right:2%;bottom:8%;max-width:245px}

@media(min-width:960px){
  .hero{grid-template-columns:minmax(0,1.08fr) minmax(380px,.92fr)}
}
@media(min-width:900px) and (max-width:1050px){
  #main-header nav ul{gap:.85rem}
  #main-header nav a{font-size:.69rem;letter-spacing:.1em}
}
@media(max-width:959px){
  .hero-portrait-wrap{width:min(78vw,450px)}
}
@media(max-width:600px){
  .hero h1{font-size:clamp(2.8rem,13vw,4.1rem)}
  .hero-portrait-wrap{width:min(88vw,410px)}
  .availability{right:0;bottom:5%}
}

/* Bildfreier, typografischer Hero */
.hero{grid-template-columns:1fr;max-width:1180px}
.hero-content{max-width:850px}
.hero h1{max-width:820px;font-size:clamp(3.15rem,6.3vw,5.7rem)}
.hero-intro{max-width:700px}
.hero-aside{align-self:end;width:100%;max-width:460px;padding:1.6rem 0;border-top:1px solid var(--secondary-color);border-bottom:1px solid var(--line)}
.hero-aside>p{margin-bottom:.75rem;color:var(--secondary-color);font-size:.7rem;letter-spacing:.18em;text-align:left;text-transform:uppercase}
.hero-aside ul{margin:0;padding:0;list-style:none}
.hero-aside li{display:grid;grid-template-columns:2.4rem 1fr;padding:.38rem 0;color:#eceeef;font-size:.95rem}
.hero-aside li span{color:#8f949a;font-size:.68rem;letter-spacing:.1em}
.hero-status{margin-top:1.2rem;color:var(--muted);font-size:.78rem}
.hero-status>span{display:inline-block;width:.55rem;height:.55rem;margin-right:.5rem;border-radius:50%;background:#6b956f;box-shadow:0 0 0 4px rgba(107,149,111,.13)}
@media(min-width:960px){.hero{grid-template-columns:minmax(0,1.5fr) minmax(290px,.5fr);align-items:center}.hero-aside{align-self:center}.hero-content{order:0}}
@media(max-width:959px){.hero-aside{justify-self:start}}

/* Dynamische Bühne im Hero */
.hero{position:relative;isolation:isolate;overflow:hidden}
.hero:before{content:"";position:absolute;z-index:-3;inset:7% 2% 8% 34%;background:repeating-linear-gradient(90deg,transparent 0,transparent calc(25% - 1px),rgba(255,255,255,.045) calc(25% - 1px),rgba(255,255,255,.045) 25%);transform:skewX(-8deg);pointer-events:none}
.hero:after{content:"";position:absolute;z-index:-2;width:36vw;height:2px;right:-5vw;top:25%;background:linear-gradient(90deg,transparent,var(--secondary-color));transform:rotate(-18deg);transform-origin:right center;opacity:.75}
.hero-content,.hero-aside,.scroll-cue{position:relative;z-index:2}
.hero-motion{position:absolute;z-index:-1;inset:0;overflow:hidden;pointer-events:none}
.motion-word{position:absolute;right:-.04em;bottom:-.19em;color:transparent;font-family:var(--font-family-heading);font-size:clamp(14rem,33vw,34rem);line-height:1;-webkit-text-stroke:1px rgba(255,255,255,.055);letter-spacing:-.06em;animation:word-drift 12s ease-in-out infinite alternate}
.motion-ring{position:absolute;border:1px solid rgba(192,169,142,.24);border-radius:50%;animation:ring-float 9s ease-in-out infinite alternate}
.motion-ring:after{content:"";position:absolute;width:.65rem;height:.65rem;top:12%;left:12%;border-radius:50%;background:var(--secondary-color);box-shadow:0 0 22px rgba(192,169,142,.8)}
.motion-ring-one{width:clamp(230px,31vw,500px);height:clamp(230px,31vw,500px);right:4%;top:8%}
.motion-ring-two{width:clamp(130px,18vw,290px);height:clamp(130px,18vw,290px);right:21%;top:28%;border-color:rgba(255,255,255,.1);animation-delay:-4s;animation-duration:11s}
.motion-block{position:absolute;width:clamp(60px,8vw,120px);height:clamp(120px,16vw,250px);right:8%;top:30%;background:linear-gradient(180deg,rgba(192,169,142,.3),rgba(192,169,142,.02));transform:rotate(24deg);mix-blend-mode:screen;animation:block-pulse 7s ease-in-out infinite alternate}
.hero h1{position:relative;text-shadow:0 15px 45px rgba(0,0,0,.22)}
.hero h1:after{content:"";display:block;width:clamp(80px,12vw,170px);height:5px;margin-top:1.1rem;background:linear-gradient(90deg,var(--secondary-color) 0 70%,transparent 70%);box-shadow:36px 0 0 rgba(255,255,255,.22)}
.hero-aside{background:linear-gradient(90deg,rgba(41,45,50,.9),rgba(41,45,50,.54));backdrop-filter:blur(5px)}
.scroll-cue{position:absolute;left:clamp(1.25rem,4vw,3rem);bottom:1.2rem;display:flex;align-items:center;gap:.65rem;color:#9fa3a8;font-size:.62rem;letter-spacing:.18em;text-decoration:none;text-transform:uppercase}
.scroll-cue span{position:relative;width:42px;height:1px;background:rgba(255,255,255,.28);overflow:hidden}
.scroll-cue span:after{content:"";position:absolute;inset:0;background:var(--secondary-color);transform:translateX(-100%);animation:scroll-line 2.2s ease-in-out infinite}
@keyframes word-drift{to{transform:translate3d(-1.5%, -1.5%,0)}}
@keyframes ring-float{to{transform:translate3d(-18px,20px,0) rotate(18deg)}}
@keyframes block-pulse{to{transform:translate3d(-15px,18px,0) rotate(31deg);opacity:.5}}
@keyframes scroll-line{50%,100%{transform:translateX(100%)}}
@media(max-width:959px){.motion-ring-one{right:-12%;top:4%}.motion-ring-two{right:18%;top:13%}.motion-block{right:4%;top:18%}.hero:before{inset:4% -10% 5% 18%}.hero-aside{background:rgba(41,45,50,.78)}}
@media(max-width:600px){.motion-word{right:-.08em;bottom:.02em;font-size:65vw}.motion-ring-one{right:-30%;top:8%}.motion-ring-two{display:none}.motion-block{top:10%;opacity:.6}.scroll-cue{display:none}.hero h1:after{height:3px}}
@media(prefers-reduced-motion:reduce){.motion-word,.motion-ring,.motion-block,.scroll-cue span:after{animation:none}}

/* Individueller Mauszeiger */
@media(hover:hover) and (pointer:fine){
  body,body a,body button,body input,body textarea,body select,body summary{cursor:none}
  .custom-cursor-dot,.custom-cursor-ring{position:fixed;z-index:99999;top:0;left:0;pointer-events:none;opacity:0;will-change:transform}
  .custom-cursor-visible .custom-cursor-dot,.custom-cursor-visible .custom-cursor-ring{opacity:1}
  .custom-cursor-dot{width:7px;height:7px;margin:-3.5px 0 0 -3.5px;border-radius:50%;background:var(--secondary-color);box-shadow:0 0 12px rgba(192,169,142,.52);transition:width .22s ease,height .22s ease,margin .22s ease,background .22s ease,opacity .2s ease}
  .custom-cursor-ring{display:grid;place-items:center;width:38px;height:38px;margin:-19px 0 0 -19px;border:1px solid rgba(192,169,142,.85);border-radius:50%;background:rgba(192,169,142,.04);backdrop-filter:blur(1px);color:#292d32;font-size:.52rem;font-weight:700;letter-spacing:.1em;transition:width .3s ease,height .3s ease,margin .3s ease,background .3s ease,border-color .3s ease,opacity .2s ease}
  .custom-cursor-ring.is-active{width:54px;height:54px;margin:-27px 0 0 -27px;border-color:var(--secondary-color);background:rgba(192,169,142,.2)}
  .custom-cursor-ring.is-project{width:76px;height:76px;margin:-38px 0 0 -38px;background:var(--secondary-color);border-color:var(--secondary-color)}
  .custom-cursor-ring.is-project:after{content:"ÖFFNEN"}
  .custom-cursor-ring.is-project+.custom-cursor-dot{background:#292d32;box-shadow:none}
}
@media(prefers-reduced-motion:reduce){.custom-cursor-ring{transition:none!important}}

.project-progress{display:grid;grid-template-columns:auto 1fr;gap:.8rem 1.2rem;align-items:start;max-width:720px;margin-top:1.5rem;padding:1rem 1.2rem;border:1px solid rgba(192,169,142,.35);background:rgba(192,169,142,.06);text-align:left}
.project-progress strong{color:var(--secondary-color);font-size:.67rem;letter-spacing:.14em;text-transform:uppercase;white-space:nowrap}
.project-progress span{color:#c9ccd0;font-size:.82rem;line-height:1.45}
@media(max-width:600px){.project-progress{grid-template-columns:1fr}}

/* Lesefreundliches Dokumentlayout für die Datenschutzerklärung */
.datenschutz{max-width:900px;padding:clamp(3.5rem,7vw,6.5rem) clamp(1.25rem,4vw,3rem) clamp(5rem,9vw,8rem);font-size:1rem;line-height:1.72}
.datenschutz>header{margin:0 0 clamp(3.5rem,7vw,5.5rem);padding-bottom:1.8rem;border-bottom:1px solid var(--line)}
.datenschutz>header h1{max-width:760px;font-size:clamp(2.9rem,6vw,4.8rem);line-height:.98;text-align:left}
.datenschutz h2{margin:4.5rem 0 1.6rem;padding-top:.85rem;border-top:1px solid rgba(192,169,142,.35);color:#f5f5f3;font-family:var(--font-family-heading);font-size:clamp(1.85rem,3.2vw,2.5rem);line-height:1.15;text-align:left}
.datenschutz h3{margin:2.6rem 0 .8rem;color:var(--secondary-color);font-family:var(--font-family-base);font-size:1.28rem;font-weight:600;line-height:1.3;text-align:left}
.datenschutz h4{margin:1.8rem 0 .55rem;color:#ece6df;font-family:var(--font-family-base);font-size:1.04rem;font-weight:600;line-height:1.4;text-align:left}
.datenschutz p{margin:0 0 1.15rem;color:#d1d4d7;font-size:1rem;line-height:1.72;text-align:left}
.datenschutz ul{margin:.25rem 0 1.5rem;padding-left:1.4rem;color:#d1d4d7}
.datenschutz li{margin:.6rem 0;padding-left:.25rem}
.datenschutz a{color:#d8c2a8;text-decoration-color:rgba(216,194,168,.55);text-underline-offset:.18em;overflow:visible}
.datenschutz a:hover{color:#fff;text-decoration-color:var(--secondary-color)}
.datenschutz strong{color:#eee9e3}
.datenschutz h2:first-of-type{margin-top:0}
@media(max-width:600px){.datenschutz{font-size:.96rem}.datenschutz h2{margin-top:3.5rem}.datenschutz h3{margin-top:2.2rem}.datenschutz p{font-size:.96rem}}

/* Passendes Dokumentlayout für das Impressum */
.impressum{max-width:900px;padding:clamp(3.5rem,7vw,6.5rem) clamp(1.25rem,4vw,3rem) clamp(5rem,9vw,8rem);font-size:1rem;line-height:1.72}
.impressum>header{margin:0 0 clamp(3.5rem,7vw,5.5rem);padding-bottom:1.8rem;border-bottom:1px solid var(--line)}
.impressum>header h1{max-width:760px;font-size:clamp(2.9rem,6vw,4.8rem);line-height:.98;text-align:left}
.impressum h2{margin:3.8rem 0 .8rem;padding-top:.85rem;border-top:1px solid rgba(192,169,142,.35);color:var(--secondary-color);font-family:var(--font-family-base);font-size:1.28rem;font-weight:600;line-height:1.3;text-align:left}
.impressum h2:first-child{margin-top:0}
.impressum p{margin:0 0 1.15rem;color:#d1d4d7;font-size:1rem;line-height:1.72;text-align:left}
.impressum section>br{display:none}
.impressum a{color:#d8c2a8;text-decoration-color:rgba(216,194,168,.55);text-underline-offset:.18em;overflow:visible}
.impressum a:hover{color:#fff;text-decoration-color:var(--secondary-color)}
.impressum strong{color:#eee9e3}
@media(max-width:600px){.impressum{font-size:.96rem}.impressum h2{margin-top:3.2rem}.impressum p{font-size:.96rem}}