/*
Theme Name: Fabian Lamprecht Fotografie
Theme URI: https://fabianlamprecht.com
Author: OpenAI für Fabian Lamprecht
Description: Individuelles Fotografie-Theme mit Portfolio-Seiten, Animationen und automatischer Seiteneinrichtung.
Version: 1.0.0
Requires at least: 6.5
Requires PHP: 7.4
Text Domain: fl-fotografie
*/
:root{
 --bg:#0a0a0a;--surface:#131313;--surface2:#191919;--text:#f3f0e9;
 --muted:#aaa69e;--gold:#b99a5e;--line:rgba(255,255,255,.14);
 --max:1320px;--header:86px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font-family:Arial,Helvetica,sans-serif;line-height:1.7;overflow-x:hidden}
body.menu-open{overflow:hidden}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
h1,h2,h3{font-family:Georgia,"Times New Roman",serif;font-weight:500;line-height:.98;letter-spacing:-.035em;margin:0 0 24px}
h1{font-size:clamp(4.2rem,10vw,9.5rem)}
h2{font-size:clamp(3rem,6.5vw,6.4rem)}
h3{font-size:clamp(2rem,3vw,3.2rem)}
p{margin:0 0 22px}
.site-header{height:var(--header);position:fixed;z-index:1000;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;padding:0 4vw;border-bottom:1px solid transparent;transition:.35s;background:linear-gradient(to bottom,rgba(0,0,0,.55),transparent)}
.site-header.scrolled{background:rgba(10,10,10,.92);backdrop-filter:blur(14px);border-color:var(--line)}
.brand{display:flex;flex-direction:column;line-height:1;position:relative;z-index:1002}
.brand-main{font-size:.87rem;letter-spacing:.19em;font-weight:700}
.brand-sub{font-size:.57rem;letter-spacing:.42em;color:var(--gold);margin-top:9px}
.desktop-nav ul{list-style:none;display:flex;align-items:center;gap:31px;margin:0;padding:0}
.desktop-nav a{font-size:.69rem;letter-spacing:.15em;text-transform:uppercase;position:relative;padding:10px 0}
.desktop-nav a:after{content:"";position:absolute;height:1px;bottom:4px;left:0;width:0;background:var(--gold);transition:.3s}
.desktop-nav a:hover:after,.desktop-nav .current-menu-item>a:after{width:100%}
.menu-toggle{display:none;background:none;border:0;color:#fff;font-size:0;width:38px;height:38px;position:relative;z-index:1002;cursor:pointer}
.menu-toggle:before,.menu-toggle:after{content:"";position:absolute;left:5px;width:28px;height:1px;background:#fff;transition:.3s}
.menu-toggle:before{top:13px}.menu-toggle:after{top:24px}
.menu-toggle.active:before{transform:translateY(5.5px) rotate(45deg)}
.menu-toggle.active:after{transform:translateY(-5.5px) rotate(-45deg)}
.mobile-nav{display:none;position:fixed;inset:0;background:#0b0b0b;z-index:1001;align-items:center;justify-content:center}
.mobile-nav.open{display:flex}
.mobile-nav ul{list-style:none;margin:0;padding:0;text-align:center}
.mobile-nav li{margin:12px 0}
.mobile-nav a{font-family:Georgia,serif;font-size:clamp(2rem,9vw,4rem)}
.eyebrow{font-size:.68rem;letter-spacing:.28em;color:var(--gold);font-weight:700;text-transform:uppercase;margin-bottom:24px}
.hero{min-height:100vh;display:flex;align-items:flex-end;position:relative;padding:160px 7vw 90px;background-size:cover;background-position:center;overflow:hidden}
.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.88) 0%,rgba(0,0,0,.52) 43%,rgba(0,0,0,.14) 100%)}
.hero:after{content:"";position:absolute;inset:-5%;background:inherit;background-size:cover;background-position:center;z-index:-1;animation:kenburns 18s ease-in-out infinite alternate}
@keyframes kenburns{from{transform:scale(1)}to{transform:scale(1.08)}}
.hero-content{position:relative;z-index:2;max-width:1050px}
.hero h1 em,.accent{font-style:italic;color:var(--gold);font-weight:400}
.hero-copy{max-width:650px;color:#dedad2;font-size:1.08rem}
.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:34px}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:16px 26px;border:1px solid var(--gold);font-size:.7rem;letter-spacing:.15em;text-transform:uppercase;transition:.3s;cursor:pointer}
.btn-primary{background:var(--gold);color:#0b0b0b}
.btn:hover{transform:translateY(-3px);box-shadow:0 16px 38px rgba(185,154,94,.2)}
.btn-outline:hover{background:rgba(185,154,94,.1)}
.section{max-width:var(--max);margin:auto;padding:125px 5vw}
.section-full{padding:125px 5vw}
.intro-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:9vw;align-items:end}
.muted{color:var(--muted)}
.gold-line:after{content:"";display:block;width:88px;height:1px;background:var(--gold);margin-top:25px}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:55px}
.section-head p{max-width:420px;color:var(--muted)}
.portfolio-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.portfolio-card{min-height:570px;padding:30px;position:relative;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;background-size:cover;background-position:center}
.portfolio-card:nth-child(3n){grid-column:span 2;min-height:680px}
.portfolio-card:before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.88),rgba(0,0,0,.04) 70%);z-index:1}
.portfolio-card:after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 35%,rgba(255,255,255,.09),transparent 65%);transform:translateX(-120%);transition:.9s}
.portfolio-card:hover:after{transform:translateX(120%)}
.portfolio-card .card-bg{position:absolute;inset:0;background-size:cover;background-position:center;transition:1s cubic-bezier(.2,.8,.2,1)}
.portfolio-card:hover .card-bg{transform:scale(1.06)}
.card-content{position:relative;z-index:2}
.card-content p{color:#d5d0c7;margin-bottom:0;font-size:.85rem}
.card-index{position:absolute;z-index:2;top:28px;left:30px;color:var(--gold);font-size:.65rem}
.statement{min-height:70vh;display:flex;align-items:center;justify-content:center;text-align:center;padding:120px 7vw;background-size:cover;background-position:center;background-attachment:fixed;position:relative}
.statement:before{content:"";position:absolute;inset:0;background:rgba(0,0,0,.64)}
.statement-inner{position:relative;max-width:1100px}
.statement blockquote{font-family:Georgia,serif;font-size:clamp(2.7rem,5.5vw,5.8rem);line-height:1.08;margin:0}
.about-split{display:grid;grid-template-columns:1fr 1fr;background:var(--surface)}
.about-image{min-height:760px;background-size:cover;background-position:center}
.about-copy{padding:10vw 8vw;display:flex;justify-content:center;flex-direction:column}
.service-list{border-bottom:1px solid var(--line)}
.service-row{display:grid;grid-template-columns:60px 1fr 150px;gap:30px;align-items:center;padding:31px 0;border-top:1px solid var(--line)}
.service-row h3{font-size:2.15rem;margin:0 0 7px}
.service-row p{margin:0;color:var(--muted)}
.service-row>span,.service-row>strong{font-size:.66rem;letter-spacing:.12em;color:var(--gold);text-transform:uppercase}
.service-row>strong{text-align:right}
.page-hero{min-height:72vh}
.gallery{display:grid;grid-template-columns:repeat(12,1fr);gap:18px}
.gallery-item{overflow:hidden;min-height:520px}
.gallery-item:nth-child(4n+1){grid-column:span 7}
.gallery-item:nth-child(4n+2){grid-column:span 5}
.gallery-item:nth-child(4n+3){grid-column:span 5}
.gallery-item:nth-child(4n+4){grid-column:span 7}
.gallery-item img{width:100%;height:100%;object-fit:cover;transition:1s}
.gallery-item:hover img{transform:scale(1.05)}
.cta{text-align:center;background:var(--surface);padding:120px 5vw}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:90px}
.contact-details a{display:block;padding:20px 0;border-bottom:1px solid var(--line);color:var(--muted)}
.contact-form label{display:block;font-size:.67rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-bottom:7px}
.contact-form input,.contact-form textarea,.contact-form select{width:100%;background:transparent;border:0;border-bottom:1px solid var(--line);color:var(--text);padding:12px 0 15px;font:inherit;margin-bottom:25px;border-radius:0}
.contact-form textarea{min-height:130px;resize:vertical}
.contact-form input:focus,.contact-form textarea:focus,.contact-form select:focus{outline:0;border-color:var(--gold)}
.site-footer{border-top:1px solid var(--line);padding:55px 5vw;display:grid;grid-template-columns:1fr auto 1fr;gap:30px;align-items:center;color:var(--muted);font-size:.69rem}
.footer-links{display:flex;gap:25px}.site-footer>p{text-align:right;margin:0}
.reveal{opacity:0;transform:translateY(40px);transition:opacity .85s,transform .85s cubic-bezier(.22,1,.36,1)}
.reveal-left{opacity:0;transform:translateX(-45px);transition:opacity .9s,transform .9s cubic-bezier(.22,1,.36,1)}
.reveal-right{opacity:0;transform:translateX(45px);transition:opacity .9s,transform .9s cubic-bezier(.22,1,.36,1)}
.reveal.visible,.reveal-left.visible,.reveal-right.visible{opacity:1;transform:none}
.cursor-glow{position:fixed;width:340px;height:340px;border-radius:50%;pointer-events:none;z-index:0;background:radial-gradient(circle,rgba(185,154,94,.07),transparent 68%);transform:translate(-50%,-50%);display:none}
.admin-bar .site-header{top:32px}
.notice-success{padding:18px;border:1px solid var(--gold);margin-bottom:25px}
@media(max-width:900px){
 .desktop-nav{display:none}.menu-toggle{display:block}
 .intro-grid,.about-split,.contact-grid{grid-template-columns:1fr}
 .portfolio-card:nth-child(3n){grid-column:auto;min-height:570px}
 .about-image{min-height:600px}
 .gallery-item,.gallery-item:nth-child(n){grid-column:span 12;min-height:470px}
 .statement{background-attachment:scroll}
 .service-row{grid-template-columns:40px 1fr}.service-row>strong{grid-column:2;text-align:left}
 .site-footer{grid-template-columns:1fr;align-items:start}.site-footer>p{text-align:left}
}
@media(max-width:600px){
 :root{--header:75px}
 .hero{padding:135px 24px 65px;min-height:92vh}
 .section,.section-full{padding:85px 24px}
 .portfolio-grid{grid-template-columns:1fr}
 .portfolio-card,.portfolio-card:nth-child(3n){min-height:470px}
 .section-head{display:block}.section-head p{margin-top:25px}
 .actions{align-items:flex-start;flex-direction:column}
 .about-copy{padding:85px 25px}
 .about-image{min-height:500px}
 .service-row{gap:15px}
 .contact-grid{gap:50px}
 .footer-links{flex-wrap:wrap}
}
@media(prefers-reduced-motion:reduce){
 *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
 .reveal,.reveal-left,.reveal-right{opacity:1!important;transform:none!important}
}
