:root{
  --bg:#eeebe1;
  --bg2:#e3ddcc;
  --ink:#17332b;
  --dim:#5b6b62;
  --brass:#93711f;
  --teal:#3e6b6e;
  --line: rgba(23,51,43,.18);
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family: Georgia, "Times New Roman", serif;
  line-height:1.6;
}
img{ display:block; max-width:100%; }
a{ color:inherit; }
h1,h2,h3,p,blockquote{ margin:0; }
.sans, nav, .tag, .legend, .about .bio, footer{ font-family:"Century Gothic","Segoe UI",sans-serif; }

/* ---------- masthead ---------- */
.masthead{ text-align:center; padding:2.4rem 5vw 1.6rem; }
.masthead .tag{ color:var(--teal); font-size:.68rem; letter-spacing:.18em; text-transform:uppercase; }
.masthead h1{ font-size:clamp(1.9rem,4.4vw,3rem); letter-spacing:.06em; margin:.5rem 0 1rem; }
.rule{ height:1px; background:var(--ink); opacity:.7; max-width:120px; margin:0 auto; }
.rule + .rule{ margin-top:3px; max-width:60px; }
nav{ display:flex; gap:1.6rem; justify-content:center; margin-top:1.3rem; font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; flex-wrap:wrap; }
nav a{ text-decoration:none; color:var(--dim); }
nav a:hover{ color:var(--brass); }

/* ---------- hero ---------- */
.hero{ position:relative; margin:1.6rem 5vw 0; height:78vh; min-height:420px; overflow:hidden; }
.hero-img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.hero-coord{ position:absolute; top:1.4rem; right:1.6rem; z-index:2; background:rgba(238,235,225,.85); padding:.4rem .7rem; font-family:"Century Gothic","Segoe UI",sans-serif; font-size:.68rem; letter-spacing:.08em; font-variant-numeric:tabular-nums; }
.hero-caption{ position:absolute; left:0; right:0; bottom:0; background:var(--bg); padding:1.6rem 2rem; display:flex; justify-content:space-between; align-items:flex-end; gap:1.5rem; flex-wrap:wrap; }
.hero-caption h2{ font-size:clamp(1.6rem,3.4vw,2.6rem); max-width:16ch; }
.hero-caption p{ color:var(--dim); max-width:34ch; font-size:.98rem; font-family:"Century Gothic","Segoe UI",sans-serif; }

/* ---------- category spreads ---------- */
section.spread{ padding:5.5rem 5vw; border-top:1px solid var(--line); scroll-margin-top:1rem; }
.spread-head{ display:flex; justify-content:space-between; align-items:baseline; margin-bottom:2.4rem; flex-wrap:wrap; gap:.6rem; }
.spread-head h2{ font-size:clamp(1.7rem,3.2vw,2.4rem); }
.spread-head .tag{ font-size:.68rem; letter-spacing:.18em; text-transform:uppercase; color:var(--brass); }

.grid{ display:grid; grid-template-columns:1.5fr 1fr; gap:1.4rem; }
.grid-reverse{ grid-template-columns:1fr 1.5fr; }
.grid-reverse .stack{ order:1; }
.grid-drone{ grid-template-columns:1.3fr .9fr .6fr; }
.stack{ display:flex; flex-direction:column; gap:1.4rem; }

.ph{ width:100%; height:100%; object-fit:cover; border-radius:2px; cursor:zoom-in; transition:transform .4s ease; }
.ph:hover{ transform:scale(1.015); }
.ph.big{ aspect-ratio:4/3; }
.ph.small{ aspect-ratio:16/10; flex:1; }
.ph.tall{ aspect-ratio:2/3; }

@media(max-width:820px){
  .grid, .grid-reverse, .grid-drone{ grid-template-columns:1fr; }
  .grid-reverse .stack{ order:0; }
}

/* ---------- about ---------- */
.about{ padding:6rem 5vw; border-top:1px solid var(--line); display:grid; grid-template-columns:.7fr 1.3fr; gap:3.5rem; align-items:center; }
.about img.ph{ aspect-ratio:4/5; }
.about blockquote{ font-size:clamp(1.3rem,2.6vw,1.9rem); line-height:1.4; max-width:26ch; font-style:italic; }
.about h2{ font-size:clamp(1.5rem,2.8vw,2rem); margin-bottom:1.2rem; }
.about p.bio{ margin-top:0; margin-bottom:1rem; color:var(--dim); font-size:.94rem; max-width:48ch; }
.about blockquote{ margin-top:1.4rem; color:var(--ink); }
@media(max-width:820px){ .about{ grid-template-columns:1fr; } }

/* ---------- kontakt ---------- */
.kontakt{ padding:5rem 5vw 6rem; border-top:1px solid var(--line); display:flex; justify-content:center; }
.legend{ border:1px solid var(--ink); padding:2.2rem 2.4rem; width:min(460px,100%); }
.legend h3{ font-size:1.5rem; margin-bottom:1.2rem; font-family:Georgia,serif; }
.legend .row{ display:flex; align-items:center; gap:.7rem; padding:.5rem 0; font-size:.85rem; }
.legend .row::before{ content:""; width:8px; height:8px; background:var(--teal); flex:none; }
.legend a{ text-decoration:none; }
.cta{ display:inline-block; margin-top:1.3rem; background:var(--brass); color:#fff; padding:.75rem 1.5rem; text-decoration:none; font-size:.78rem; letter-spacing:.1em; text-transform:uppercase; }
.cta:hover{ background:var(--ink); }

footer{ text-align:center; padding:2rem; font-size:.7rem; color:var(--dim); border-top:1px solid var(--line); }

/* ---------- lightbox ---------- */
.lightbox{ display:none; position:fixed; inset:0; z-index:1000; background:rgba(23,51,43,.92); align-items:center; justify-content:center; padding:4vh 4vw; }
.lightbox-large{ max-width:100%; max-height:92vh; box-shadow:0 10px 40px rgba(0,0,0,.4); }
.lightbox .close{ position:absolute; top:1.4rem; right:2rem; color:#eeebe1; font-size:2.2rem; cursor:pointer; line-height:1; font-family:"Century Gothic","Segoe UI",sans-serif; }