/*
  Original rebuild inspired by sparse editorial portfolio layouts.
  Replace placeholder SVGs with your Lightroom exports in /images.
*/
:root{
  --paper:#23374C;
  --paper-2:#1b2d42;
  --ink:#FFFFFF;
  --muted:#D5DCE2;
  --accent:#FE5A30;
  --glass:rgba(213,220,226,.095);
  --glass-strong:rgba(255,255,255,.135);
  --gap:1vw;
  --nav:315px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--paper)}
body{
  margin:0;
  background:
    radial-gradient(circle at 20% 8%, rgba(254,90,48,.24) 0, rgba(254,90,48,.10) 22%, transparent 42%),
    radial-gradient(circle at 78% 18%, rgba(213,220,226,.20) 0, rgba(213,220,226,.08) 24%, transparent 42%),
    linear-gradient(135deg,#1d3046 0%,#23374C 48%,#18283b 100%);
  background-attachment:fixed;
  color:var(--ink);
  font-family:"DM Sans",Arial,sans-serif;
  font-size:18px;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px, transparent 1px);
  background-size:44px 44px;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.55),transparent 72%);
}
a{color:inherit;text-decoration:none}
.site-shell{display:flex;min-height:100vh}
.side-nav{
  position:fixed;
  left:18px;
  top:18px;
  bottom:18px;
  width:292px;
  max-width:var(--nav);
  height:auto;
  background:linear-gradient(145deg,rgba(255,255,255,.16),rgba(213,220,226,.055));
  border:1px solid rgba(255,255,255,.20);
  border-right-color:rgba(254,90,48,.20);
  border-radius:28px;
  box-shadow:0 24px 70px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.22);
  backdrop-filter:blur(24px) saturate(1.18);
  -webkit-backdrop-filter:blur(24px) saturate(1.18);
  padding:32px 24px 0 28px;
  overflow:auto;
  z-index:5;
}
.nav-inner{padding-right:8px;padding-bottom:60px}
.logo{display:block;margin-bottom:28px;max-width:100%;font-family:"Playfair Display",Georgia,serif;font-size:34px;line-height:.84;font-weight:800;color:var(--accent);letter-spacing:-.04em}
.logo-image{width:270px;max-width:100%;margin-bottom:22px;filter:drop-shadow(0 10px 22px rgba(0,0,0,.25))}
.logo-image img{display:block;width:100%;height:auto}
.dek{width:190px;margin:0 0 18px;color:rgba(213,220,226,.86);font-size:13px;line-height:1.25;font-weight:300}
.social-links{display:flex;align-items:center;gap:10px;margin:0 0 30px}
.social-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:31px;
  height:31px;
  padding:7px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:999px;
  background:rgba(255,255,255,.06);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.15);
  opacity:.95;
  transition:opacity .18s ease, transform .18s ease, background .18s ease, border-color .18s ease;
}
.social-link img{display:block;width:100%;height:100%;object-fit:contain}
.social-link:hover{opacity:1;transform:translateY(-1px);background:rgba(254,90,48,.18);border-color:rgba(254,90,48,.48)}
nav{display:flex;flex-direction:column;align-items:flex-start;gap:0}
nav a{font-size:13px;line-height:1.62;color:rgba(213,220,226,.86);font-weight:400;letter-spacing:.015em;text-transform:uppercase;display:block;padding:0 0 1px;transition:opacity .18s ease, transform .18s ease, color .18s ease}
nav a:hover{opacity:1;color:var(--accent);transform:translateX(3px)}
.content{width:calc(100vw - 365px);margin:28px 28px 0 348px;min-height:100vh}

.masonry{
  display:flex;
  flex-direction:column;
  gap:clamp(10px,1vw,16px);
  padding-bottom:4%;
}
.gallery-row{
  display:flex;
  gap:clamp(10px,1vw,16px);
  align-items:stretch;
  width:100%;
}
.asset{
  position:relative;
  margin:0;
  min-width:0;
  flex:var(--ratio, .67) 1 0;
  background:rgba(213,220,226,.13);
  line-height:0;
  opacity:0;
  transform:translateY(8px);
  animation:fadeUp .52s ease forwards;
  border-radius:18px;
  overflow:hidden;
  box-shadow:0 16px 42px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.16);
  border:1px solid rgba(255,255,255,.10);
}
.gallery-row:nth-child(1) .asset:nth-child(2){animation-delay:.03s}
.gallery-row:nth-child(1) .asset:nth-child(3){animation-delay:.06s}
.gallery-row:nth-child(2) .asset{animation-delay:.09s}
.gallery-row:nth-child(3) .asset{animation-delay:.15s}
.gallery-row:nth-child(4) .asset{animation-delay:.21s}
.gallery-row:nth-child(n+5) .asset{animation-delay:.27s}
.asset a{
  display:block;
  position:relative;
  cursor:pointer;
  overflow:hidden;
  background:rgba(213,220,226,.12);
  height:clamp(300px,32vw,520px);
}
.asset img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  transition:opacity .22s ease, transform .55s ease, filter .22s ease;
  filter:saturate(.95) contrast(1.02);
}
.asset span{position:absolute;left:10px;right:10px;bottom:10px;padding:10px 12px 9px;background:rgba(35,55,76,.50);border:1px solid rgba(255,255,255,.18);border-radius:999px;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);color:#FFFFFF;font-size:10px;line-height:1.2;text-transform:uppercase;letter-spacing:.04em;opacity:0;transition:opacity .22s ease, transform .22s ease;transform:translateY(5px)}
.asset a:hover img{opacity:.9;transform:scale(1.018);filter:saturate(1.08) contrast(1.04)}
.asset a:hover span{opacity:1;transform:translateY(0)}
.about{max-width:820px;margin-top:4vw;padding:7vw 36px 8vw;display:grid;grid-template-columns:1fr;gap:22px;color:var(--ink);background:linear-gradient(145deg,rgba(255,255,255,.13),rgba(213,220,226,.045));border:1px solid rgba(255,255,255,.15);border-radius:28px;box-shadow:0 24px 70px rgba(0,0,0,.18);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}
.about h1{font-family:Georgia,"Times New Roman",serif;font-size:38px;line-height:1.08;font-weight:400;margin:0;letter-spacing:-.02em}
.about p{font-size:18px;max-width:610px;margin:0;font-weight:300;color:rgba(213,220,226,.88)}.about a{text-decoration:underline;text-underline-offset:3px;color:#FFFFFF}
.mobile-toggle{display:none;position:fixed;top:18px;right:18px;z-index:30;border:1px solid rgba(255,255,255,.18);border-radius:999px;background:rgba(255,255,255,.10);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);color:var(--ink);font:13px/1 "DM Sans",Arial,sans-serif;text-transform:uppercase;padding:10px 13px;cursor:pointer}
.lightbox{position:fixed;inset:0;background:rgba(24,40,59,.90);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);display:none;align-items:center;justify-content:center;z-index:100;padding:54px}.lightbox.open{display:flex}.lightbox img{max-width:min(82vw,980px);max-height:84vh;width:auto;height:auto;box-shadow:0 8px 40px rgba(0,0,0,.35);border-radius:14px}.lightbox-close{position:fixed;right:35px;top:28px;border:0;background:transparent;font-size:42px;line-height:1;color:var(--ink);cursor:pointer;font-weight:300}
@keyframes fadeUp{to{opacity:1;transform:translateY(0)}}
@media (max-width:980px){.content{width:calc(100vw - 280px);margin-left:270px}.masonry{gap:14px}.gallery-row{gap:14px}.asset a{height:clamp(260px,38vw,460px)}.side-nav{width:240px;padding:28px 18px 0 22px}.nav-inner{padding-right:0}.logo-image{width:240px}}
@media (max-width:720px){body{font-size:16px}.mobile-toggle{display:block}.site-shell{display:block}.side-nav{left:12px;right:12px;top:12px;bottom:auto;width:auto;max-width:none;height:auto;min-height:0;padding:68px 24px 24px;transform:translateY(-115%);transition:transform .28s ease;border-radius:24px}.side-nav.open{transform:translateY(0)}.nav-inner{padding:0}.logo-image{width:240px;margin-bottom:24px}.dek{margin-bottom:22px}.content{width:auto;margin:82px 14px 0}.masonry{gap:14px}.gallery-row{display:flex;flex-direction:column;gap:14px}.asset{flex:auto}.asset a{height:auto}.asset img{height:auto;object-fit:contain}.asset{border-radius:16px}.about{padding:48px 22px 60px;margin-top:50px;border-radius:24px}.about h1{font-size:31px}.about p{font-size:16px}.lightbox{padding:20px}.lightbox img{max-width:92vw;max-height:82vh}.lightbox-close{right:18px;top:16px}}