@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;1,300;1,400&family=Jost:wght@100;300;400;500&display=swap');

*{margin:0;padding:0;box-sizing:border-box}
:root{
  --cream:#F5F2EE;
  --ink:#1C1B18;
  --ink-mid:#4A4844;
  --ink-muted:#8A8780;
  --border:#D5D0C8;
  --accent:#C8A86B;
}
html{font-size:16px}
body{font-family:'Jost',sans-serif;background:var(--cream);color:var(--ink);font-weight:300;overflow-x:hidden}
::-webkit-scrollbar{width:4px}
::-webkit-scrollbar-track{background:var(--cream)}
::-webkit-scrollbar-thumb{background:var(--border)}

/* NAV */
nav{
  position:fixed;top:0;left:0;right:0;z-index:1000;
  padding:0 3rem;height:60px;
  display:flex;align-items:center;justify-content:space-between;
  background:rgba(245,242,238,0.93);
  backdrop-filter:blur(10px);
  border-bottom:0.5px solid var(--border);
}
.nav-logo{
  font-family:'Jost',sans-serif;
  font-size:11px;font-weight:300;letter-spacing:0.18em;text-transform:uppercase;
  text-decoration:none;color:var(--ink-muted);
}
.nav-links{display:flex;gap:3rem;align-items:center}
.nav-links a{
  font-size:11px;letter-spacing:0.18em;text-transform:uppercase;
  color:var(--ink-muted);text-decoration:none;
  transition:color .2s;position:relative;
}
.nav-links a::after{
  content:'';position:absolute;bottom:-3px;left:0;
  width:0;height:0.5px;background:var(--ink);transition:width .3s;
}
.nav-links a:hover{color:var(--ink)}
.nav-links a:hover::after{width:100%}
.nav-links a.active{color:var(--ink)}
.nav-links a.active::after{width:100%}

/* SHARED */
.page-wrap{padding-top:60px}
.section-eyebrow{font-size:11px;letter-spacing:0.18em;text-transform:uppercase;color:var(--ink-muted);margin-bottom:1rem}
.section-title{font-family:'Cormorant Garamond',serif;font-size:clamp(36px,5vw,60px);font-weight:300}
.back-btn{
  display:inline-flex;align-items:center;gap:0.5rem;
  font-size:11px;letter-spacing:0.15em;text-transform:uppercase;
  color:var(--ink-muted);text-decoration:none;
  font-family:'Jost',sans-serif;font-weight:300;
  transition:color .2s;margin-bottom:1.5rem;
}
.back-btn:hover{color:var(--ink)}
.back-btn::before{content:'←';font-size:14px}

/* PROJ THUMBNAILS */
.cat-section{padding:3rem 3rem 0}
.cat-label{
  font-size:11px;letter-spacing:0.2em;text-transform:uppercase;color:var(--ink-muted);
  display:flex;align-items:center;gap:1.5rem;margin-bottom:2rem;
}
.cat-label::after{content:'';flex:1;height:0.5px;background:var(--border)}
.cat-alpha{font-family:'Cormorant Garamond',serif;font-size:72px;font-weight:300;color:var(--border);display:inline-block;margin-right:0.25rem;line-height:1}
.proj-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;padding-bottom:3rem}
.proj-grid.cols-2{grid-template-columns:repeat(2,1fr)}
.proj-thumb{text-decoration:none;color:inherit;display:block}
.proj-thumb-img{
  width:100%;aspect-ratio:4/3;overflow:hidden;
  background:#D5D0C8;position:relative;
}
.proj-thumb-img img{width:100%;height:100%;object-fit:cover;filter:brightness(0.88);transition:filter .5s,transform .5s}
.proj-thumb:hover .proj-thumb-img img{filter:brightness(1);transform:scale(1.03)}
.proj-placeholder{
  width:100%;height:100%;
  display:flex;align-items:center;justify-content:center;
  font-family:'Cormorant Garamond',serif;font-size:12px;
  letter-spacing:0.1em;color:var(--ink-muted);
}
.proj-thumb-info{padding:0.9rem 0 0}
.proj-thumb-type{font-size:10px;letter-spacing:0.18em;text-transform:uppercase;color:var(--ink-muted);margin-bottom:0.3rem}
.proj-thumb-name{font-family:'Cormorant Garamond',serif;font-size:19px;font-weight:400;line-height:1.2}
.proj-thumb-year{font-size:12px;color:var(--ink-muted);margin-top:0.2rem}

/* COLLAGE */
.collage-row{display:grid;gap:1rem;margin-bottom:1rem}
.collage-row.c1{grid-template-columns:1fr}
.collage-row.c2{grid-template-columns:1fr 1fr}
.collage-row.c3{grid-template-columns:1fr 1fr 1fr}
.collage-row.c21{grid-template-columns:2fr 1fr}
.collage-row.c12{grid-template-columns:1fr 2fr}
.collage-img{width:100%;overflow:hidden;background:#D5D0C8}
.collage-img img{width:100%;height:100%;object-fit:cover;display:block}
.collage-img.land{aspect-ratio:4/3}
.collage-img.port{aspect-ratio:3/4}
.collage-img.wide{aspect-ratio:16/9}
.collage-img.sq{aspect-ratio:1}
.collage-ph{
  width:100%;height:100%;display:flex;align-items:center;justify-content:center;
  font-family:'Cormorant Garamond',serif;font-size:12px;
  letter-spacing:0.1em;color:var(--ink-muted);
}

@media(max-width:768px){
  nav{padding:0 1.5rem}
  .nav-links{gap:1.5rem}
  .proj-grid{grid-template-columns:1fr 1fr}
  .cat-section{padding:2rem 1.5rem 0}
}

/* beskyttelse */
img{-webkit-user-drag:none;user-drag:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;pointer-events:none}