:root{--ink:#111;--bg:#fff;--line:#e7e7e7}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#fff;color:#111;font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit}img,video{display:block;width:100%}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.site-header{height:clamp(220px,28vw,390px);display:grid;place-items:center;position:relative}.logo{width:clamp(190px,27vw,360px);margin:0}.logo img{height:auto}.menu-btn{position:absolute;right:clamp(24px,5vw,64px);top:50%;transform:translateY(-50%);width:38px;height:28px;padding:0;border:0;background:transparent;display:flex;flex-direction:column;justify-content:space-between;cursor:pointer}.menu-btn span:not(.sr-only){height:3px;background:#111;width:100%}
.menu{position:fixed;inset:0;z-index:100;background:#fff;display:flex;flex-direction:column}.menu[hidden]{display:none}.menu-close{position:absolute;right:clamp(24px,5vw,64px);top:28px;border:0;background:none;font-size:3.2rem;font-weight:200;cursor:pointer}.menu nav{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:38px}.menu nav a{font-size:clamp(1.7rem,3vw,2.7rem)}.menu-bottom{min-height:112px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:24px clamp(24px,5vw,64px);font-size:.72rem;text-transform:uppercase;letter-spacing:.07em}.menu-bottom div{display:flex;gap:22px}
.home-grid{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:56px;gap:10px}.home-item{position:relative;overflow:hidden;background:#eee}.home-item img{height:100%;object-fit:cover;transition:transform .35s ease,opacity .2s ease}.home-item:hover img{transform:scale(1.012);opacity:.94}.label{position:absolute;left:11px;bottom:10px;background:#fff;padding:6px 8px 5px;font-size:.63rem;letter-spacing:.08em;opacity:0;transform:translateY(4px);transition:.18s ease}.home-item:hover .label{opacity:1;transform:none}.oskar{grid-column:1/span 3;grid-row:span 8}.wedding{grid-column:4/span 5;grid-row:span 8}.place{grid-column:9/span 4;grid-row:span 8}.portrait{grid-column:1/span 4;grid-row:span 8}.design{grid-column:5/span 5;grid-row:span 8}.wedding2{grid-column:10/span 3;grid-row:span 8}.footer{min-height:150px;padding:30px clamp(20px,3vw,48px);display:grid;grid-template-columns:1fr 1fr auto;gap:20px;align-items:end;font-size:.7rem;text-transform:uppercase;letter-spacing:.05em}.footer a{border-bottom:1px solid currentColor;padding-bottom:2px}
.project-top{position:sticky;top:0;z-index:20;height:68px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(16px,2.5vw,36px);background:rgba(255,255,255,.94);backdrop-filter:blur(10px);border-bottom:1px solid rgba(0,0,0,.06);font-size:.72rem;text-transform:uppercase;letter-spacing:.07em}.project-top .mini-logo{width:90px;height:auto}.project-top a:last-child{border-bottom:1px solid currentColor;padding-bottom:2px}
.project-intro{min-height:46vh;padding:10vh clamp(18px,5vw,74px) 5vh;display:flex;flex-direction:column;justify-content:flex-end}.kicker{font-size:.68rem;letter-spacing:.1em;margin:0 0 12px}.project-intro h1{margin:0;font-size:clamp(4rem,10vw,10.5rem);line-height:.8;letter-spacing:-.075em;font-weight:500}.project-meta{margin-top:28px;display:flex;gap:26px;flex-wrap:wrap;font-size:.75rem;text-transform:uppercase;letter-spacing:.06em;color:#555}
.project-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:10px}.block{overflow:hidden;background:#eee;margin:0}.block img,.block video{width:100%;height:100%;object-fit:cover}.full{grid-column:1/-1}.left5{grid-column:1/span 5}.right7{grid-column:6/span 7}.left7{grid-column:1/span 7}.right5{grid-column:8/span 5}.center8{grid-column:3/span 8}.left4{grid-column:1/span 4}.mid4{grid-column:5/span 4}.right4{grid-column:9/span 4}.land{aspect-ratio:16/10}.tall{aspect-ratio:4/5}.video-wrap{position:relative;background:#000;aspect-ratio:16/9}.video-tag{position:absolute;left:12px;bottom:11px;background:#fff;padding:6px 8px 5px;font-size:.6rem;letter-spacing:.08em}.project-end{min-height:38vh;padding:9vh clamp(18px,5vw,74px);display:flex;justify-content:space-between;align-items:flex-end;gap:30px;border-top:1px solid var(--line);margin-top:10px}.project-end p{margin:0;max-width:28ch;font-size:clamp(1.5rem,3vw,3.2rem);line-height:1.02;letter-spacing:-.04em}.project-end a{font-size:.74rem;text-transform:uppercase;letter-spacing:.07em;border-bottom:1px solid currentColor;padding-bottom:2px}
.info-main{min-height:calc(100vh - 68px);padding:14vh clamp(24px,7vw,100px) 8vh;display:grid;grid-template-columns:1.4fr .7fr;gap:10vw;align-items:end}.info-main h1{margin:0;font-size:clamp(4rem,10vw,10rem);line-height:.82;letter-spacing:-.07em;font-weight:500;max-width:9ch}.info-copy{font-size:1rem;line-height:1.5}.info-copy p{margin:0 0 26px}.info-copy a{border-bottom:1px solid currentColor}
@media(max-width:760px){.site-header{height:200px}.logo{width:205px}.menu-btn{right:22px;width:31px;height:24px}.home-grid{grid-template-columns:repeat(2,1fr);grid-auto-rows:auto;gap:6px}.home-item{grid-column:auto!important;grid-row:auto!important;aspect-ratio:4/5}.home-item:nth-child(3n){grid-column:1/-1!important;aspect-ratio:16/10}.label{display:none}.footer{grid-template-columns:1fr;gap:8px;align-items:start}.project-intro{min-height:38vh}.project-intro h1{font-size:clamp(4rem,17vw,7rem)}.project-grid{grid-template-columns:1fr;gap:6px}.block{grid-column:1!important;aspect-ratio:auto}.block img{height:auto;object-fit:contain;background:#fff}.video-wrap{aspect-ratio:16/9}.project-end{flex-direction:column;align-items:flex-start}.info-main{grid-template-columns:1fr;gap:12vh;align-items:start}}

.project-seo{
  max-width:1080px;
  margin:0 auto;
  padding:clamp(70px,10vw,140px) clamp(18px,5vw,74px);
}
.project-seo p{margin:0}
.project-seo-lead{
  max-width:31ch;
  font-size:clamp(1.55rem,3.2vw,3.45rem);
  line-height:1.02;
  letter-spacing:-.045em;
}
.project-seo-artists{
  margin-top:34px!important;
  max-width:72ch;
  font-size:.78rem;
  line-height:1.6;
  text-transform:uppercase;
  letter-spacing:.055em;
}
.project-seo-sv{
  margin-top:18px!important;
  max-width:70ch;
  font-size:.78rem;
  line-height:1.55;
  color:#666;
}
@media(max-width:760px){
  .project-seo{padding-top:70px;padding-bottom:70px}
}

/* V8: remove large dead white spaces inside project grids while preserving
   the small editorial gutter. Paired/triple blocks are equalized by JS. */
.project-grid{
  gap:6px;
}
.project-grid > .block{
  align-self:stretch;
}
.project-grid > .block img,
.project-grid > .block video{
  width:100%;
  height:100%;
  object-fit:cover;
}
@media(max-width:760px){
  .project-grid{gap:6px}
  .project-grid > .block{height:auto!important}
  .project-grid > .block img{
    height:auto;
    object-fit:contain;
  }
  .project-grid > .video-wrap{
    aspect-ratio:16/9;
  }
  .project-grid > .video-wrap video{
    height:100%;
    object-fit:cover;
  }
}

/* V9: consistent editorial gutters between every adjacent project asset.
   Keep the V8 equal-height rows, but make sure neighboring images/videos
   never visually merge into one another. */
.project-grid{
  column-gap:10px !important;
  row-gap:10px !important;
}
.project-grid > .block{
  min-width:0;
  overflow:hidden;
  background:#fff;
}
.project-grid > .block img,
.project-grid > .block video{
  display:block;
}

/* Give adjacent media a crisp white separation even where browser rounding
   would otherwise make the grid seam disappear. */
.project-grid > .block{
  outline:1px solid #fff;
  outline-offset:-1px;
}

@media(max-width:760px){
  .project-grid{
    column-gap:0 !important;
    row-gap:8px !important;
  }
  .project-grid > .block{
    outline:none;
  }
}

/* V10: explicit editorial rows.
   This replaces auto-placement for project galleries so every intended seam
   has a real, consistent white gutter and rows cannot collapse/overlap. */
.project-grid{
  display:block !important;
  width:100%;
  overflow-x:hidden;
}

.media-row{
  display:grid;
  gap:10px;
  width:100%;
  margin:0 0 10px 0;
  overflow:hidden;
}

.media-row:last-child{ margin-bottom:0; }

.media-row--full{
  grid-template-columns:minmax(0,1fr);
}

.media-row--5-7{
  grid-template-columns:minmax(0,5fr) minmax(0,7fr);
  height:clamp(480px,46vw,820px);
}

.media-row--7-5{
  grid-template-columns:minmax(0,7fr) minmax(0,5fr);
  height:clamp(480px,46vw,820px);
}

.media-row--thirds{
  grid-template-columns:repeat(3,minmax(0,1fr));
  height:clamp(390px,32vw,640px);
}

.media-row--landscape-pair{
  grid-template-columns:minmax(0,7fr) minmax(0,5fr);
  height:clamp(350px,34vw,620px);
}

.media-row--5-7-landscape{
  grid-template-columns:minmax(0,5fr) minmax(0,7fr);
  height:clamp(350px,34vw,620px);
}

.media-row--center{
  grid-template-columns:minmax(0,2fr) minmax(0,8fr) minmax(0,2fr);
}
.media-row--center > .block{
  grid-column:2;
}

.media-row > .block{
  grid-column:auto !important;
  width:100%;
  min-width:0;
  height:100%;
  margin:0;
  overflow:hidden;
  background:#111;
  outline:none !important;
  aspect-ratio:auto !important;
}

.media-row--full > .block{
  height:auto;
  aspect-ratio:16/9 !important;
}

.media-row--center > .block{
  height:auto;
  aspect-ratio:4/5 !important;
}

.media-row > .block img,
.media-row > .block video{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}

.media-row .video-wrap{
  aspect-ratio:auto !important;
}

@media(max-width:760px){
  .media-row,
  .media-row--5-7,
  .media-row--7-5,
  .media-row--thirds,
  .media-row--landscape-pair,
  .media-row--5-7-landscape,
  .media-row--center{
    display:block;
    height:auto;
    margin-bottom:8px;
  }

  .media-row > .block,
  .media-row--center > .block{
    width:100%;
    height:auto !important;
    margin:0 0 8px 0;
    aspect-ratio:auto !important;
  }

  .media-row > .block:last-child{ margin-bottom:0; }

  .media-row > figure.block img{
    height:auto;
    object-fit:contain;
  }

  .media-row > .video-wrap{
    aspect-ratio:16/9 !important;
  }

  .media-row > .video-wrap video{
    height:100%;
    object-fit:cover;
  }
}

/* V11: fix final centered portrait row.
   The generic .media-row > .block rule previously overrode grid-column:2,
   which pushed the final image into the narrow first column. */
.media-row--center{
  grid-template-columns:minmax(0,1.5fr) minmax(0,9fr) minmax(0,1.5fr);
}
.media-row--center > .block{
  grid-column:2 !important;
  width:100%;
}
@media(max-width:760px){
  .media-row--center > .block{
    grid-column:auto !important;
  }
}

.festival-day-nav{
  display:flex;
  gap:22px;
  flex-wrap:wrap;
  align-items:center;
  justify-content:flex-end;
}
.festival-day-nav a{
  font-size:.74rem;
  text-transform:uppercase;
  letter-spacing:.07em;
  border-bottom:1px solid currentColor;
  padding-bottom:2px;
}
@media(max-width:760px){
  .festival-day-nav{
    justify-content:flex-start;
  }
}

/* V15: smaller final image on all project pages */
.media-row--center{
  grid-template-columns:minmax(0,2.5fr) minmax(0,7fr) minmax(0,2.5fr) !important;
}
.media-row--center > .block{
  grid-column:2 !important;
  width:100%;
  max-width:none;
}
@media(max-width:760px){
  .media-row--center{
    display:block !important;
  }
  .media-row--center > .block{
    grid-column:auto !important;
    width:100%;
  }
}

/* V16: genuinely small, centered final image */
.media-row--center{
  display:flex !important;
  justify-content:center !important;
  align-items:flex-start !important;
  width:100% !important;
  height:auto !important;
  grid-template-columns:none !important;
  margin-top:10px !important;
}
.media-row--center > .block{
  grid-column:auto !important;
  flex:0 1 560px !important;
  width:min(42vw, 560px) !important;
  max-width:560px !important;
  height:auto !important;
  aspect-ratio:auto !important;
  background:transparent !important;
}
.media-row--center > figure.block img{
  display:block !important;
  width:100% !important;
  height:auto !important;
  object-fit:contain !important;
}
@media(max-width:760px){
  .media-row--center{
    display:flex !important;
    justify-content:center !important;
  }
  .media-row--center > .block{
    width:min(76vw, 460px) !important;
    max-width:460px !important;
    flex:0 1 auto !important;
  }
}

/* INFO: clearer but still minimal Instagram CTA */
.info-social{
  margin-top:28px;
}
.info-social a{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:12px 15px;
  border:1px solid currentColor;
  text-decoration:none;
  font-size:.82rem;
  line-height:1;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.info-social a:hover{
  opacity:.58;
}

/* V17 clean launch homepage: only real projects */
.home-grid{
  min-height:auto;
}
.home-grid .oskar{
  grid-column:1 / span 4 !important;
  grid-row:span 8 !important;
}
.home-grid .wedding{
  grid-column:5 / span 5 !important;
  grid-row:span 8 !important;
}
.home-grid .place{
  grid-column:10 / span 3 !important;
  grid-row:span 8 !important;
}
@media(max-width:760px){
  .home-grid .oskar,
  .home-grid .wedding,
  .home-grid .place{
    grid-column:1 / -1 !important;
    grid-row:auto !important;
  }
}