:root{--bg:#0e0e0e;--panel:#171717;--line:#2a2a2a;--text:#e8e6e1;--dim:#8d8a84;--accent:#c9b79c;--serif:'Cormorant Garamond',Georgia,serif;--sans:'DM Sans',system-ui,sans-serif}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--text);font-family:var(--sans);font-weight:300;line-height:1.7;min-height:100vh;display:flex;flex-direction:column}
main{flex:1}
a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}
img{max-width:100%;height:auto;display:block}

/* nav */
nav{display:flex;justify-content:space-between;align-items:center;padding:1.2rem 2rem;border-bottom:1px solid var(--line);position:sticky;top:0;background:rgba(14,14,14,.94);backdrop-filter:blur(8px);z-index:20}
.nav-logo{font-family:var(--serif);font-size:1.6rem;color:var(--text);letter-spacing:.04em}
.nav-links{display:flex;gap:2rem;list-style:none;align-items:center}
.nav-links a{color:var(--dim);font-size:.8rem;letter-spacing:.14em;text-transform:uppercase}
.nav-links a:hover,.nav-links a.active{color:var(--text);text-decoration:none}
.nav-drop{position:relative}
.dropdown{display:none;position:absolute;top:100%;left:-1rem;background:var(--panel);border:1px solid var(--line);padding:.6rem 0;min-width:170px}
.nav-drop:hover .dropdown{display:block}
.dropdown a{display:block;padding:.45rem 1.2rem}
.hamburger{display:none;cursor:pointer;flex-direction:column;gap:5px}
.hamburger span{width:24px;height:2px;background:var(--text);display:block}

/* hero */
.hero{min-height:78vh;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding:4rem 2rem 4rem max(2rem,8vw);background-size:cover;background-position:center;border-bottom:1px solid var(--line)}
.eyebrow,.label{font-size:.72rem;letter-spacing:.28em;text-transform:uppercase;color:var(--accent);margin-bottom:1.2rem}
.hero h1{font-family:var(--serif);font-weight:300;font-size:clamp(3rem,8vw,6.5rem);line-height:1.02;margin-bottom:1.4rem}
.hero-desc{max-width:480px;color:#cfccc5;margin-bottom:2rem}
.btn{display:inline-block;background:var(--accent);color:#111;border:1px solid var(--accent);padding:.65rem 1.6rem;font:500 .75rem var(--sans);letter-spacing:.16em;text-transform:uppercase;cursor:pointer}
.btn:hover{opacity:.85;text-decoration:none}
.btn-ghost{background:transparent;color:var(--text);border-color:var(--line)}
.btn-danger{background:transparent;color:#e07a7a;border-color:#5a3030}

/* sections + grid */
.section{max-width:1300px;margin:0 auto;padding:3.5rem 2rem}
.page-title{font-family:var(--serif);font-weight:300;font-size:clamp(2rem,5vw,3.2rem);margin-bottom:1.5rem}
.grid{columns:3 300px;column-gap:12px}
.tile{display:block;margin-bottom:12px;break-inside:avoid;overflow:hidden;background:var(--panel)}
.tile img{width:100%;height:auto;transition:transform .5s,opacity .3s}
.tile:hover img{transform:scale(1.03);opacity:.92}
.chips{display:flex;flex-wrap:wrap;gap:.6rem;margin-bottom:2rem}
.chips a{border:1px solid var(--line);padding:.3rem 1rem;color:var(--dim);font-size:.75rem;letter-spacing:.12em;text-transform:uppercase}
.chips a.on,.chips a:hover{color:var(--text);border-color:var(--accent);text-decoration:none}
.pager{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-top:2.5rem;color:var(--dim);font-size:.85rem}
.empty{color:var(--dim);text-align:center;padding:3rem 0}

/* photo page */
.photo-main{max-height:82vh;width:auto;max-width:100%;margin:0 auto}
.photo-meta{max-width:720px;margin:2rem auto 0;text-align:center}
.photo-meta h1{font-family:var(--serif);font-weight:300;font-size:2rem}
.caption{color:#cfccc5;margin-top:.6rem}.meta{color:var(--dim);font-size:.8rem;margin-top:.8rem;letter-spacing:.08em}

/* about */
.about{display:grid;grid-template-columns:1fr 1fr;gap:4rem}
.about p{margin-bottom:1rem;color:#cfccc5}
.contact{display:flex;flex-direction:column;gap:.8rem}
input[type=text],input[type=email],input[type=url],input[type=password],textarea,select{width:100%;background:var(--panel);border:1px solid var(--line);color:var(--text);padding:.7rem .9rem;font:300 .95rem var(--sans)}
input:focus,textarea:focus,select:focus{outline:none;border-color:var(--accent)}
.ok{color:#7fc89a;margin-bottom:1rem}.err{color:#e07a7a;margin-bottom:1rem}

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

/* login */
.login-body{display:flex;align-items:center;justify-content:center;min-height:100vh}
.login-box{width:min(420px,92vw);background:var(--panel);border:1px solid var(--line);padding:2.2rem}
.login-box h1{font-family:var(--serif);font-weight:400;font-size:1.8rem;margin-bottom:1rem}
.login-box form{display:flex;flex-direction:column;gap:.8rem;margin-top:1rem}
.hint{color:var(--dim);font-size:.85rem}

/* admin */
.admin-bar{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:.6rem;padding:1rem 1.5rem;border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--bg);z-index:10}
.admin-bar nav{position:static;display:flex;gap:1.2rem;padding:0;border:0;background:none;backdrop-filter:none;font-size:.85rem;flex-wrap:wrap}
button.link{background:none;border:0;color:var(--accent);cursor:pointer;font:inherit}
.admin-wrap{max-width:960px;margin:0 auto;padding:1.5rem}
.panel{background:var(--panel);border:1px solid var(--line);padding:1.6rem;margin-bottom:1.5rem}
.panel h2{font-family:var(--serif);font-weight:400;font-size:1.6rem;margin-bottom:.6rem}
.panel form{display:flex;flex-direction:column;gap:.8rem;margin-top:.8rem}
.panel label{display:flex;flex-direction:column;gap:.3rem;font-size:.8rem;color:var(--dim)}
form.inline{flex-direction:row;align-items:center;gap:.8rem;flex-wrap:wrap}
form.inline.row{justify-content:space-between;border-top:1px solid var(--line);padding-top:.6rem}
.photo-card{display:grid;grid-template-columns:200px 1fr;gap:1.2rem;border-top:1px solid var(--line);padding:1.2rem 0}
.photo-card img{width:100%;height:auto}
.photo-card form{margin-top:0}
.flash{padding:.8rem 1rem;margin-bottom:1rem;border:1px solid var(--line);font-size:.9rem}
.flash.success{border-color:#2f5a3e;color:#7fc89a}.flash.error{border-color:#5a3030;color:#e07a7a}.flash.warn{border-color:#5a4d2a;color:#d9bd72}
code{background:#222;padding:0 .3rem}

@media(max-width:760px){
  nav{padding:1rem 1.2rem}
  .hamburger{display:flex}
  .nav-links{display:none;position:absolute;top:100%;left:0;right:0;background:var(--bg);flex-direction:column;align-items:flex-start;padding:1rem 1.5rem;gap:1rem;border-bottom:1px solid var(--line)}
  .nav-links.open{display:flex}
  .dropdown{display:none!important}
  .hero{padding:3rem 1.4rem}
  .about{grid-template-columns:1fr;gap:2.5rem}
  .section{padding:2.5rem 1rem}
  .photo-card{grid-template-columns:1fr}
}
