/* georg schmidt photography — Analog-Redesign. Bewusst nur helles Theme (Print-/Passepartout-Anmutung). */
:root{
  --bg:#f7f7f7; --paper:#ffffff; --ink:#1e1d1b; --muted:#5c5c5c; --faint:#a8a49c;
  --rule:#e2e0db; --accent:#8a2f1d; --film:#111;
  --serif:'Merriweather',Georgia,'Times New Roman',serif;
  --mono:'Courier Prime','Courier New',Courier,monospace; /* Olivetti-Schreibmaschine */
  --type:'Courier Prime','Courier New',Courier,monospace;
}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--muted);font-family:var(--serif);line-height:1.7;-webkit-font-smoothing:antialiased}
.sheet{max-width:1120px;margin:26px auto;background:var(--paper);padding:0 0 60px;box-shadow:0 1px 3px rgba(0,0,0,.06)}
a{color:inherit}

/* Kopf + Navigation */
header.top{text-align:center;padding:54px 20px 8px}
.wordmark{font-family:var(--type);font-size:clamp(18px,2.3vw,25px);letter-spacing:.2em;text-transform:lowercase;color:var(--ink);text-decoration:none;font-weight:700;display:inline-block}
nav.main{display:flex;justify-content:center;flex-wrap:wrap;gap:34px;padding:26px 20px 30px}
nav.main a{font-family:var(--type);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);text-decoration:none;padding-bottom:4px;border-bottom:1px solid transparent}
nav.main a:hover,nav.main a:focus-visible,nav.main a[aria-current]{color:var(--ink);border-bottom-color:var(--accent);outline:none}

/* Thesis */
.thesis{text-align:center;padding:26px 20px 40px}
.thesis h1{font-family:var(--type);font-weight:700;font-size:clamp(20px,2.7vw,30px);color:var(--ink);letter-spacing:.01em;line-height:1.5;text-wrap:balance}
.thesis h1 em{font-style:italic;color:var(--accent)}
.thesis .meta{margin-top:10px;font-family:var(--mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--faint)}

/* Hero mit asymmetrischem Passepartout + Negativ-Entwicklung */
.hero{padding:0 8% 0 14%;position:relative}
.hero .ph{aspect-ratio:3/2;position:relative;overflow:hidden}
.hero .ph::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
.margin-note{position:absolute;right:2.5%;top:12%;writing-mode:vertical-rl;font-family:var(--mono);font-size:10px;letter-spacing:.18em;color:var(--faint);text-transform:uppercase}
.pencil{padding:12px 8% 0 14%;display:flex;justify-content:space-between;flex-wrap:wrap;gap:6px;font-family:var(--mono);font-size:11px;color:var(--faint);letter-spacing:.1em}
.pencil b{font-weight:400;color:var(--muted)}

/* Bildplatzhalter (bis echte Fotos in images/ liegen) */
.ph-img{position:absolute;inset:0;background-size:cover;background-position:center}
.ph-img.g0{background:radial-gradient(120% 90% at 30% 25%,#b9b2a0,#6e6656 60%,#332e24)}
.ph-img.g1{background:radial-gradient(110% 100% at 65% 70%,#c4bba6,#7a7060 58%,#3a342a)}
.ph-img.g2{background:radial-gradient(100% 110% at 50% 20%,#aeb0a4,#5f6156 60%,#2b2d26)}
.ph-img.g3{background:radial-gradient(112% 96% at 42% 78%,#c2b4ac,#6f6058 60%,#332a26)}
.ph-img.g4{background:radial-gradient(108% 104% at 68% 30%,#b4b6ba,#5e6166 62%,#2a2c2f)}
.ph-img.g5{background:radial-gradient(115% 92% at 30% 70%,#c6bda2,#756c50 60%,#363023)}
img.real{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}

/* Negativ → Positiv entwickeln */
.develop{filter:invert(1) contrast(1.15) sepia(.2)}
.develop.done{filter:none;transition:filter 1.2s ease-out}

/* Kategorie-Übersicht (Arbeiten) */
.cats{padding:20px 7% 0;display:grid;grid-template-columns:repeat(2,1fr);gap:34px}
.cat-card{text-decoration:none;display:block}
.cat-card .ph{position:relative;aspect-ratio:4/3;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
.cat-card:hover .ph-img,.cat-card:hover img.real{transform:scale(1.03)}
.cat-card .ph-img,.cat-card img.real{transition:transform .5s ease}
.cat-card h2{font-family:var(--type);margin-top:14px;font-weight:700;font-size:clamp(17px,2vw,22px);color:var(--ink);letter-spacing:.04em;text-transform:uppercase}
.cat-card p{margin-top:4px;font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}

/* Serientitel */
.series-title{padding:56px 7% 0}
.series-title h3{font-family:var(--type);font-weight:700;font-size:clamp(20px,2.8vw,30px);color:var(--ink);line-height:1.4;text-wrap:balance;max-width:30ch}
.series-title p{margin-top:10px;font-family:var(--mono);font-size:11px;color:var(--faint);letter-spacing:.16em;text-transform:uppercase}

/* Kontaktbogen */
.series{padding:64px 7% 0}
.series-head{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:8px;border-bottom:1px solid var(--rule);padding-bottom:12px}
.series-head h2{font-family:var(--type);font-weight:700;font-size:13px;letter-spacing:.24em;text-transform:uppercase;color:var(--ink)}
.series-head .lab{font-family:var(--mono);font-size:10px;letter-spacing:.16em;color:var(--faint);text-transform:uppercase}
.contact-sheet{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;background:var(--film);padding:14px 10px;margin-top:26px}
.neg{position:relative;aspect-ratio:1/1;overflow:hidden;border:0;padding:0;cursor:pointer;background:none}
.neg::before,.neg::after{content:"";position:absolute;left:0;right:0;height:10px;z-index:2;background:radial-gradient(circle,transparent 2.6px,var(--film) 2.8px);background-size:11px 10px;background-repeat:repeat-x}
.neg::before{top:0}.neg::after{bottom:0}
.neg .frame-no{position:absolute;bottom:12px;right:8px;z-index:3;font-family:var(--mono);font-size:9px;color:#e8b64c;letter-spacing:.1em}
.neg .thumb{position:absolute;inset:10px 0;overflow:hidden;transition:transform .5s ease}
.neg:hover .thumb,.neg:focus-visible .thumb{transform:scale(1.05)}
.neg:focus-visible{outline:2px solid #e8b64c;outline-offset:-2px}
.series-caption{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;margin-top:14px;font-family:var(--mono);font-size:11px;color:var(--faint);letter-spacing:.12em}
.series-caption .sel{max-width:60ch}

/* Journal */
.journal{margin:80px 7% 0;border-top:1px solid var(--rule);padding-top:40px;display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.journal h3{font-family:var(--type);font-weight:700;font-size:clamp(19px,2.4vw,26px);color:var(--ink);line-height:1.45;text-wrap:balance}
.journal h3 em{font-style:italic;color:var(--accent)}
.journal p{margin-top:14px;font-size:15px;max-width:52ch}
.journal .ph{position:relative;aspect-ratio:4/3;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
.more{display:inline-block;margin-top:20px;font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:var(--ink);text-decoration:none;border-bottom:1px solid var(--accent);padding-bottom:4px}

/* Prosa-Seiten (Über, Journal-Liste, Recht) */
.prose{padding:20px 7% 0;max-width:66ch}
.prose h1{font-family:var(--type);font-weight:700;font-size:clamp(22px,2.8vw,32px);color:var(--ink);margin-bottom:22px;letter-spacing:.02em;text-transform:uppercase}
.prose h2{font-family:var(--type);font-weight:700;font-size:18px;color:var(--ink);margin:32px 0 10px}
.prose p{margin-bottom:16px;font-size:16px}
.prose a{color:var(--accent)}
.entry{border-top:1px solid var(--rule);padding:22px 0}
.entry .d{font-family:var(--mono);font-size:11px;color:var(--faint);letter-spacing:.16em;text-transform:uppercase}
.entry h2{margin-top:6px}
.entry p{margin-top:6px}

/* Journal-Posts */
.posts{padding:10px 0 0}
.post{padding:44px 7% 0}
.post-text{max-width:66ch;margin:16px 0 4px;font-size:15px;line-height:1.75}
.post .contact-sheet{margin-top:20px}

/* Über mich mit Foto */
.ueber{padding:20px 7% 0;display:grid;grid-template-columns:.8fr 1.2fr;gap:44px;align-items:start}
.ueber .prose{padding:0;max-width:none}
.ueber-foto .ph{position:relative;aspect-ratio:4/5;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
@media (max-width:760px){.ueber{grid-template-columns:1fr;gap:24px}}

/* Footer */
footer.site{margin:70px 7% 0;border-top:1px solid var(--rule);padding-top:24px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:12.5px;color:var(--faint)}
footer.site a{color:var(--faint);text-decoration:none}
footer.site a:hover{color:var(--ink)}

/* Lightbox */
.lb{position:fixed;inset:0;background:rgba(15,14,12,.94);display:none;place-items:center;z-index:100;padding:40px}
.lb.on{display:grid}
.lb figure{max-width:min(90vw,1000px);text-align:center}
.lb .box{position:relative;width:min(90vw,1000px);aspect-ratio:4/3;overflow:hidden}
.lb figcaption{margin-top:14px;font-family:var(--mono);font-size:11px;color:#cfc9bf;letter-spacing:.14em;text-transform:uppercase}
.lb .close{position:absolute;top:20px;right:26px;background:none;border:0;color:#fff;font-family:var(--mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;cursor:pointer}
.lb .nav{position:absolute;top:50%;transform:translateY(-50%);background:none;border:0;color:#fff;font-size:34px;cursor:pointer;padding:20px;opacity:.7}
.lb .nav:hover{opacity:1}
.lb .prev{left:10px}.lb .next{right:10px}

@media (max-width:760px){
  .hero{padding:0 6%}
  .pencil{padding:12px 6% 0}
  .margin-note{display:none}
  .cats{grid-template-columns:1fr}
  .contact-sheet{grid-template-columns:repeat(2,1fr)}
  .journal{grid-template-columns:1fr}
  nav.main{gap:18px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .develop,.develop.done{filter:none;transition:none}
  .neg .thumb,.cat-card .ph-img,.cat-card img.real{transition:none}
}