/* Schriften lokal gehostet (keine Verbindung zu Google) */
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:300;font-display:swap;src:url(fonts/bricolage-grotesque-latin-300-normal.woff2) format('woff2')}
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/bricolage-grotesque-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:800;font-display:swap;src:url(fonts/bricolage-grotesque-latin-800-normal.woff2) format('woff2')}
@font-face{font-family:'Newsreader';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/newsreader-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Newsreader';font-style:italic;font-weight:400;font-display:swap;src:url(fonts/newsreader-latin-400-italic.woff2) format('woff2')}

#v-prod{background:#141416;color:#e4ddd0;min-height:100vh;padding:6.5rem var(--pad) 3rem}
#v-prod .pd-in{max-width:72rem;margin:0 auto;animation:pdin .7s cubic-bezier(.2,.7,.2,1) both}
@keyframes pdin{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
#v-prod .pd-back{display:inline-block;margin:0 0 1.6rem;color:#c9bfae;font:600 .9rem var(--d);text-decoration:none;opacity:.85}
#v-prod .pd-back:hover{opacity:1;text-decoration:underline}
#v-prod .pd-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(1.6rem,4vw,4rem);align-items:start}
#v-prod .pd-media{position:static}
#v-prod .pd-media .ko-rot{width:100%;max-width:36rem;border-radius:.6rem;margin:0 auto}
#v-prod .pd-info small{display:block;font:600 .75rem/1 var(--d);letter-spacing:.22em;text-transform:uppercase;opacity:.6}
#v-prod .pd-info h1{font-size:clamp(2.4rem,6vw,4.4rem);letter-spacing:-.04em;line-height:.95;margin:.8rem 0 .6rem}
#v-prod .pd-sub{margin:0 0 1rem;font-size:1.1rem;opacity:.8}
#v-prod .pd-price{font:500 1.15rem var(--d);margin:0 0 1.6rem;opacity:.9}
#v-prod .pd-text p{margin:0 0 1rem;line-height:1.6;opacity:.85}
#v-prod .pd-facts{list-style:none;margin:1.4rem 0 1.8rem;padding:0;border-top:1px solid rgba(228,221,208,.15)}
#v-prod .pd-facts li{padding:.7rem 0;border-bottom:1px solid rgba(228,221,208,.15);font:400 .95rem var(--d);display:flex;justify-content:space-between;gap:1rem}
#v-prod .pd-facts li span:last-child{opacity:.6;text-align:right}
#v-prod .pd-cta{padding:.9rem 1.7rem;border:0;border-radius:99px;background:#e4ddd0;color:#141416;font:600 1rem var(--d);cursor:pointer;transition:background .2s,transform .2s}
#v-prod .pd-cta:hover{background:#c9bfae;transform:translateY(-2px)}
#v-prod .pd-hint{margin:.9rem 0 0;font-size:.9rem;opacity:.65;max-width:28rem}
#v-prod .pd-more{max-width:72rem;margin:clamp(3.5rem,8vw,6rem) auto 0;padding-top:2rem;border-top:1px solid rgba(228,221,208,.15)}
#v-prod .pd-more h2{font-size:clamp(1.6rem,4vw,2.4rem);letter-spacing:-.03em;margin:0 0 1.2rem}
#v-prod .pd-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(.6rem,2vw,1.4rem)}
#v-prod .pd-card{display:block;color:inherit;text-decoration:none;background:rgba(14,14,16,.7);border:1px solid rgba(228,221,208,.12);border-radius:.5rem;overflow:hidden;transition:border-color .3s,transform .3s}
#v-prod .pd-card:hover{border-color:rgba(228,221,208,.4);transform:translateY(-3px)}
#v-prod .pd-card img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;background:#e9e7e2}
#v-prod .pd-card b{display:block;padding:.7rem .8rem .2rem;font:600 clamp(.85rem,2.4vw,1.05rem) var(--d)}
#v-prod .pd-card span{display:block;padding:0 .8rem .8rem;font-size:.82rem;opacity:.65}
.ko-card .ko-rot{cursor:pointer}
a.ko-btn{display:inline-block;text-decoration:none}
@media(max-width:860px){#v-prod{padding-top:5.5rem}#v-prod .pd-grid{grid-template-columns:1fr}#v-prod .pd-media{position:static}}
@media(prefers-reduced-motion:reduce){#v-prod .pd-in{animation:none}}

/* Koara-Cursor-Set: nur auf den Kunstseiten (Koara, Einzelseiten) */
:is(body:has(#v-art:not([hidden])),body:has(#v-prod:not([hidden]))){cursor:url(cur/arrow.png) 1 1,auto;cursor:-webkit-image-set(url(cur/arrow.png) 1x,url(cur/arrow@2x.png) 2x) 1 1,auto;cursor:image-set(url(cur/arrow.png) 1x,url(cur/arrow@2x.png) 2x) 1 1,auto;}
:is(body:has(#v-art:not([hidden])),body:has(#v-prod:not([hidden]))) :is(a[href],button,summary,select,label[for],input[type=checkbox],input[type=submit],[role=button],.ko-btn,.ko-reel,.pd-card){cursor:url(cur/hand.png) 9 6,auto;cursor:-webkit-image-set(url(cur/hand.png) 1x,url(cur/hand@2x.png) 2x) 9 6,auto;cursor:image-set(url(cur/hand.png) 1x,url(cur/hand@2x.png) 2x) 9 6,auto;}
:is(body:has(#v-art:not([hidden])),body:has(#v-prod:not([hidden]))) :is(.ko-rot.spin,.ko-rot.spin *,.ko-rot.spin.dr){cursor:url(cur/rot.png) 17 17,auto;cursor:-webkit-image-set(url(cur/rot.png) 1x,url(cur/rot@2x.png) 2x) 17 17,auto;cursor:image-set(url(cur/rot.png) 1x,url(cur/rot@2x.png) 2x) 17 17,auto;}

/* Text- und Preisbereich unten auf den Shooting-Seiten */
.inf .two{align-items:start}
.inf-t p,.inf-hd p,.inf .two>div>p{margin:0 0 1.1rem;line-height:1.65}
.inf-hd{max-width:46rem;margin-bottom:2rem}.inf-hd p{opacity:.8}
.inf-pk{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1rem,2vw,1.6rem)}
.pk{display:flex;flex-direction:column;padding:1.6rem 1.5rem 1.5rem;border:1px solid rgba(38,38,42,.18);border-radius:.8rem;background:var(--paper)}
.pk.hl{border-color:var(--ink);box-shadow:0 10px 30px rgba(0,0,0,.08)}
.pk h3{font-size:1.5rem;letter-spacing:-.02em;margin:0 0 .5rem;line-height:1.1}.pk h3 span{display:block;font-size:.9rem;font-weight:400;letter-spacing:0;opacity:.65;margin-top:.3rem}
.pk-p{margin:0 0 .8rem}.pk-p b{font:500 2rem var(--d);letter-spacing:-.03em}.pk-p i{font-style:normal;font-size:.95rem;opacity:.65;margin-left:.3rem}
.pk p{font-size:1rem;line-height:1.55;margin:0 0 .9rem}
.inf-b{list-style:none;margin:.4rem 0 1.4rem;padding:0}
.inf-b li{position:relative;padding:.35rem 0 .35rem 1.5rem;font-size:.98rem;line-height:1.45;border-top:1px solid rgba(38,38,42,.1)}
.inf-b li::before{content:"";position:absolute;left:.15rem;top:.85rem;width:.55rem;height:.3rem;border-left:2px solid var(--ink);border-bottom:2px solid var(--ink);transform:rotate(-45deg)}
.pk .inf-b{flex:1}
.pk-a{align-self:flex-start;display:inline-block;padding:.7rem 1.4rem;border-radius:99px;background:var(--ink);color:var(--paper);text-decoration:none;font:500 .95rem var(--d);transition:background .3s}.pk-a:hover{background:var(--accent);color:var(--deep)}
.inf-h3{font-size:1.25rem;letter-spacing:-.01em;margin:1.8rem 0 .6rem}
.inf-w{list-style:none;margin:0 0 1.2rem;padding:0}.inf-w li{padding:.7rem 0;border-top:1px solid rgba(38,38,42,.15);line-height:1.5}.inf-w li:last-child{border-bottom:1px solid rgba(38,38,42,.15)}
.inf-fl{list-style:none;counter-reset:f;margin:2.4rem 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1.2rem,3vw,3rem)}
.inf-fl li{counter-increment:f;position:relative;padding-top:3.2rem;border-top:1px solid var(--ink)}
.inf-fl li::before{content:counter(f);position:absolute;top:.8rem;left:0;width:2rem;height:2rem;border-radius:50%;background:var(--ink);color:var(--paper);display:grid;place-items:center;font:500 .9rem var(--d)}
.inf-fl h3{font-size:1.25rem;letter-spacing:-.01em;margin:0 0 .5rem}.inf-fl p{margin:0;line-height:1.6;font-size:1rem}
.cta-s p{max-width:40rem}
@media(max-width:860px){.inf-pk,.inf-fl{grid-template-columns:1fr}}

/* "Zu den Preisen" im Hero: heller Rahmen */
a.btn.o[href="#preise"]{background:transparent;color:var(--cream);border:1px solid var(--cream);padding:calc(.9rem - 1px) calc(1.8rem - 1px)}
a.btn.o[href="#preise"]:hover{background:var(--cream);color:var(--deep)}

/* Hochzeit-Hero (Desktop): Bildausschnitt weiter unten, weniger Himmel oben */
@media(min-width:861px){.hero .bg.has img[src*="e045"]{transform:translateY(-9%)}}

/* Galerien: gleich hohe Reihen (Justified), alle Kategorien */
.gal.jr{display:block}
.jr .jrow{display:flex;gap:1.1rem;margin-bottom:1.1rem;align-items:flex-start}
.jr .jrow:last-child{margin-bottom:0}
.jr figure{min-width:0;margin:0!important}
.jr .jm{display:none}
@media(max-width:860px){.jr .jd{display:none}.jr .jm{display:block}.jr .jrow{gap:.6rem;margin-bottom:.6rem}}
.extra .gal.jr{display:block}
.gal.jr,.jr .jd,.jr .jm,.jr .jrow{width:100%;box-sizing:border-box}
.extra .gal.jr{grid-column:auto}
#v-cat .gal.jr,.gal.jr{display:block!important}
#v-cat .jr figure:nth-child(n){margin:0!important}

/* Tiere: Ablauf-Block */
.tw-lead{margin:0 0 1rem;line-height:1.65}
.tw-wrap{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(.9rem,2vw,1.4rem)}
.tw-c{padding:1.5rem 1.5rem 1.4rem;border:1px solid rgba(38,38,42,.18);border-radius:.8rem;background:var(--cream)}
.tw-c small{display:block;font:600 .72rem/1 var(--d);letter-spacing:.18em;text-transform:uppercase;opacity:.55;margin-bottom:.7rem}
.tw-c h3{font-size:1.4rem;letter-spacing:-.02em;margin:0 0 .5rem;line-height:1.1}
.tw-c p{margin:0;line-height:1.55;font-size:1rem}
.tw-k{grid-column:1/-1;margin:0;padding:1.2rem 1.5rem;border-radius:.8rem;background:var(--ink);color:var(--cream);line-height:1.55}
.tw-k b{font-family:var(--d);font-weight:600}
.tw-tip{margin:1.6rem 0 0;padding-left:1.1rem;border-left:3px solid var(--accent);max-width:44rem;line-height:1.6}
.tw-tip b{font-family:var(--d)}
@media(max-width:860px){.tw-wrap{grid-template-columns:1fr}}
.tw-q{grid-column:1/-1;margin:0;font-size:clamp(1.4rem,3vw,2rem)!important;letter-spacing:-.03em}
.tw-k{max-width:none!important}.tw-lead{margin-top:1.4rem}

/* Hero-Buttons: Abstand, auf dem Handy untereinander in voller Breite */
p:has(>a.btn.o[href="#preise"]){display:flex;flex-wrap:wrap;gap:.8rem}
p>a.btn.o[href="#preise"]{margin:0!important}
@media(max-width:560px){p:has(>a.btn.o[href="#preise"]){flex-direction:column;gap:.7rem;align-items:stretch}p:has(>a.btn.o[href="#preise"])>a.btn{text-align:center;justify-self:auto}}

/* Hero-Überschriften: keine Silbentrennung, Wörter bleiben ganz */
#v-cat .hero h1,.hero h1{hyphens:none!important;-webkit-hyphens:none!important;overflow-wrap:normal!important;word-break:normal!important}
@media(max-width:560px){#v-cat .hero h1,.hero h1{font-size:clamp(2.3rem,11.4vw,3.6rem)!important;max-width:none!important}}
@media(max-width:560px){#v-cat section.dark .two .h2{font-size:clamp(1.5rem,6.4vw,2.2rem);overflow-wrap:normal;hyphens:none}}

/* Mobiles Menü: linksbündig, ruhige Zeilen mit Trennlinien, Untermenü eingerückt */
@media(max-width:860px){
nav ul#menu{align-items:stretch;gap:0;padding-top:5.5rem}
nav ul#menu>li{width:100%;border-bottom:1px solid rgba(241,235,224,.14)}
nav ul#menu>li>a,nav ul#menu>li.dd>button{display:flex;justify-content:space-between;align-items:center;width:100%;text-align:left;padding:1rem 0;font-size:1.6rem;line-height:1.2}
nav ul#menu>li>a.cta{border:1px solid var(--cream);border-radius:99px;justify-content:center;text-align:center;padding:.9rem 1rem;font-size:1.25rem;margin:1.6rem 0 0}
nav ul#menu>li:has(>a.cta){border-bottom:0}
nav ul#menu .dd>button::after{width:.55rem;height:.55rem;margin-right:.3rem}
nav ul#menu ul.sub{align-items:stretch;padding:0 0 1rem 1rem;margin:0 0 .4rem .1rem;border-left:2px solid var(--accent)}
nav ul#menu ul.sub>li{width:100%}
nav ul#menu ul.sub a{display:block;text-align:left;font-size:1.1rem;font-weight:400;padding:.55rem 0 .55rem .2rem;opacity:.85;color:var(--cream)}
nav ul#menu ul.sub a:active,nav ul#menu ul.sub a:hover{opacity:1}
}

/* Hochzeit: kompakter Getting-Ready-Bereich */
section.dark:has(>.wrap.extra){padding-block:clamp(2.2rem,4.5vw,3.6rem)}
.extra{grid-template-columns:1fr!important;gap:1.4rem!important;align-items:start!important}
.extra>div:first-child{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:1.2rem clamp(1.5rem,5vw,4rem);align-items:end}
.extra h2{font-size:clamp(1.8rem,3.6vw,3rem)!important;margin:0!important}
.extra>div:first-child p{margin:0;max-width:34rem;opacity:.85}
.extra .jr .jrow{gap:.7rem;margin-bottom:.7rem}
@media(max-width:860px){.extra>div:first-child{grid-template-columns:1fr}}

/* Featured-Hochzeit: Scroller + alle Bilder */
.fw{background:var(--cream)}
.fw-hd{display:flex;justify-content:space-between;align-items:end;gap:1.5rem 3rem;flex-wrap:wrap;margin-bottom:1.6rem}
.fw-hd h2{font-size:clamp(2rem,4.4vw,3.6rem)}
.fw-hd p{margin:.7rem 0 0;max-width:34rem;opacity:.8}
.fw-ar{display:flex;gap:.5rem}
.fw-ar button{width:2.8rem;height:2.8rem;border-radius:50%;border:1px solid var(--ink);background:none;color:var(--ink);font:500 1.1rem var(--d);cursor:pointer;transition:background .25s,color .25s}
.fw-ar button:hover{background:var(--ink);color:var(--paper)}
.fw-s{display:flex;gap:.8rem;overflow-x:auto;scroll-snap-type:x proximity;padding-bottom:.9rem;margin-inline:calc(-1*var(--pad));padding-inline:var(--pad);scroll-padding-inline:var(--pad);scrollbar-width:thin}
.fw-s figure{flex:0 0 auto;margin:0;height:clamp(13rem,29vw,24rem);scroll-snap-align:start}
.fw-s .ph{height:100%;width:auto;padding:0}
.fw-more{margin-top:1.1rem;padding:.8rem 1.5rem;border-radius:99px;border:1px solid var(--ink);background:none;color:var(--ink);font:500 .95rem var(--d);cursor:pointer;transition:background .25s,color .25s}
.fw-more:hover{background:var(--ink);color:var(--paper)}
.fw-all{margin-top:1.4rem}
.fw-all[hidden]{display:none}

/* Kategorie-Header (Handy): Bild oben frei sichtbar, darunter Titel + Text; kleines "Fotografie"-Label entfällt */
@media(max-width:860px){
#v-cat .hero:has(>.bg.has){display:flex;flex-direction:column;padding-top:0!important;min-height:0}
#v-cat .hero:has(>.bg.has)>.bg.has{position:relative!important;inset:auto!important;order:-1;opacity:1!important;height:min(98vw,32rem);margin:0 calc(-1*var(--pad));width:auto!important;flex:none}
#v-cat .hero:has(>.bg.has)>.bg.has{overflow:hidden}
#v-cat .hero:has(>.bg.has)>.bg.has img{filter:none;width:100%!important;height:100%!important;object-fit:cover;transform:none!important}
#v-cat .hero:has(>.bg.has)>.bg.has::after{background:linear-gradient(0deg,#1b1b1e 0,rgba(27,27,30,0) 30%)}
#v-cat .hero:has(>.bg.has)>.bg.has img[src*="r11"]{object-position:40% 25%}
#v-cat .hero>p.kind{display:none}
#v-cat .hero:has(>.bg.has) h1{margin-top:1.4rem}
}

/* Footer: Instagram mit Symbol */
footer a.ig{display:inline-flex;align-items:center;gap:.45rem}
footer a.ig svg{flex:none}

/* Impressum / Datenschutz als Fenster */
dialog.legal{max-width:min(92vw,52rem);margin:auto}
dialog.legal .lg-body{background:var(--cream);color:var(--ink);padding:clamp(1.4rem,4vw,2.6rem);max-height:82vh;overflow-y:auto;border-radius:.4rem;font:1rem/1.65 var(--d)}
dialog.legal h2{font-size:clamp(1.8rem,4vw,2.6rem);letter-spacing:-.03em;margin:0 0 1.2rem}
dialog.legal h3{font-size:1.15rem;letter-spacing:-.01em;margin:1.8rem 0 .5rem}
dialog.legal p,dialog.legal li{margin:0 0 .9rem;font-size:.98rem;line-height:1.65}
dialog.legal ul{margin:0 0 1rem;padding-left:1.2rem}
dialog.legal a{color:inherit;text-decoration:underline}
dialog.legal [hidden]{display:none}
dialog.legal ol{margin:0 0 1rem;padding-left:0;list-style:none}
dialog.legal ol li{position:relative;padding-left:2rem}
dialog.legal ol li::before{content:attr(value)".";position:absolute;left:0;opacity:.6}

/* Startseite: "Gesamtes Portfolio ansehen" als dunkler Button */
a.btn.o[href="#portfolio"]{background:#1b1b1e!important;color:#f1ebe0!important;text-decoration:none!important;padding:1rem 2rem}
a.btn.o[href="#portfolio"]:hover{background:var(--accent)!important;color:#1b1b1e!important}

/* Portfolio-Übersicht (Handy): niedriger, hellere und kleinere Bildkacheln, Verlauf nur hinter dem Text */
@media(max-width:860px){
#v-cat .hero:has(>.bg.coll){min-height:0;padding-top:6rem;padding-bottom:2.2rem}
#v-cat .hero:has(>.bg.coll)>.bg.coll{grid-template-columns:repeat(5,minmax(0,1fr));grid-template-rows:repeat(4,minmax(0,1fr));gap:3px}
#v-cat .hero:has(>.bg.coll)>.bg.coll img:nth-child(n+17){display:block}
#v-cat .hero:has(>.bg.coll)>.bg.coll img:nth-child(n+21){display:none}
#v-cat .hero:has(>.bg.coll)>.bg.coll img{filter:brightness(.8) saturate(.95)}
#v-cat .hero:has(>.bg.coll)>.bg.coll::after{background:linear-gradient(0deg,rgba(20,20,22,.96) 0,rgba(20,20,22,.88) 38%,rgba(20,20,22,.2) 68%,rgba(20,20,22,.35) 100%)}
}

/* Archiv: verkaufte Stücke bleiben sichtbar */
.ko-soldc{position:relative}
.ko-soldc .ko-ph,.ko-soldc .ko-rot img{filter:grayscale(.55) brightness(.82)}
.ko-sold-b{position:absolute;top:.8rem;left:.8rem;z-index:2;padding:.35rem .8rem;border-radius:99px;background:rgba(14,14,16,.82);border:1px solid rgba(228,221,208,.35);color:#e4ddd0;font:600 .72rem/1 var(--d);letter-spacing:.14em;text-transform:uppercase}
.ko-soldc .ko-btn{background:transparent;color:#e4ddd0;border:1px solid rgba(228,221,208,.4)}
.ko-soldc .ko-btn:hover{background:#e4ddd0;color:#141416}
@media(min-width:900px){#ko-sold .ko-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:1.2rem}#ko-sold .ko-card{flex:0 0 calc((100% - 3*1.2rem)/4);min-width:0}#ko-sold .ko-body{padding:.85rem .9rem 1rem}#ko-sold .ko-body h3{font-size:1.1rem}#ko-sold .ko-body p{font-size:.85rem}#ko-sold .ko-btn{padding:.6rem 1.1rem;font-size:.85rem}}

/* Shop-Karten: Nummer der Figur statt Kurztext */
.ko-body p.ko-nr{font:600 .72rem/1 var(--d);letter-spacing:.14em;text-transform:uppercase;opacity:.55;margin-top:.5rem}

/* 360°-Hinweis als Icon oben rechts */
.ko-badge{left:auto!important;bottom:auto!important;right:.7rem;top:.7rem;display:inline-flex;align-items:center;gap:.35rem;padding:.32rem .6rem!important;font-family:'Bricolage Grotesque',system-ui,sans-serif!important;font-weight:700!important;font-size:.72rem!important;line-height:1!important;letter-spacing:.08em;pointer-events:none}
.ko-badge b{font-weight:700}
.ko-badge svg{display:block}

.ko-sec[hidden]{display:none!important}

/* "Ansehen"-Cursor: aus dem Layout nehmen, sonst schiebt er beim ersten Hover die Startseite um ~29px nach unten */
@media(min-width:861px){.cur{position:fixed!important;left:0;top:0;margin:14px 0 0 16px;z-index:70;pointer-events:none;opacity:0;transition:opacity .18s;padding:.42rem .85rem;border-radius:99px;background:#f1ebe0;color:#1b1b1d;font-family:'Bricolage Grotesque',system-ui,sans-serif;font-weight:600;font-size:.78rem;line-height:1;letter-spacing:.02em;white-space:nowrap;box-shadow:0 4px 18px rgba(0,0,0,.28)}.cur.on{opacity:1}}

/* Startseite Desktop: dauerhaft etwas Farbfläche zwischen Header und Bild-/Reel-Leiste */
@media(min-width:861px){.hero .pane .pv{top:6rem!important;height:calc(46% - 9.2rem)!important}}

/* Hochzeit: Bildbänder zwischen den Textblöcken */
.band{padding-block:clamp(1.2rem,3vw,2.4rem)}
.rp .fw-all{margin-top:1.1rem}

.fw.pf{background:var(--deep);color:var(--cream)}.fw.pf .fw-ar button{border-color:var(--cream);color:var(--cream)}.fw.pf .fw-ar button:hover{background:var(--cream);color:var(--deep)}