:root { color-scheme: dark; --ink: #f7f8fc; --night: #040219; --accent: #6ec1e4; --muted: #bcc2d4; }
* { box-sizing: border-box; }
html { background: var(--night); font-family: Inter, ui-sans-serif, system-ui, sans-serif; }
body { margin: 0; background: var(--night); color: var(--ink); font-size: 18px; line-height: 1.6; }
body.page-home { height: 100svh; overflow: hidden; }
body.page-home .site-footer { position: fixed; z-index: 2; right: 0; bottom: 0; left: 0; padding-top: .75rem; padding-bottom: .75rem; background: linear-gradient(transparent, rgb(4 2 25 / .55)); }
body.page-rejser, body.page-restauranter, body.page-bettemus, body.page-om-os { background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; }
body.page-rejser { background-image: linear-gradient(rgb(4 2 25 / .30), rgb(4 2 25 / .30)), url("/static/images/home/20221019-185832-0053_iPhone-13-Pro-scaled-1600.webp"); }
body.page-bettemus { background-image: linear-gradient(rgb(4 2 25 / .30), rgb(4 2 25 / .30)), url("/static/images/home/20150104-165011-01_C07D-scaled-1600.webp"); }
body.page-om-os { background-image: linear-gradient(rgb(4 2 25 / .30), rgb(4 2 25 / .30)), url("/static/images/home/20170527-141811-0001_Canon-EOS-7D-scaled-1600.webp"); }
body.page-restauranter { background-image: linear-gradient(rgb(4 2 25 / .30), rgb(4 2 25 / .30)), url("/static/images/home/20230511-185737-0003_iPhone-13-Pro-1600.webp"); }
a { color: inherit; }
.site-header { position: sticky; z-index: 10; top: 0; display: flex; align-items: center; min-height: 76px; padding: 0 5vw; background: rgb(4 2 25 / .92); backdrop-filter: blur(12px); }
.brand { margin-right: auto; font: 600 1.15rem/1 "Plus Jakarta Sans", Inter, sans-serif; letter-spacing: .02em; text-decoration: none; }
.primary-nav { display: flex; gap: 1.6rem; }
.primary-nav a { color: var(--muted); font-size: .92rem; font-weight: 650; text-decoration: none; }
.primary-nav a:hover, .primary-nav a[aria-current] { color: var(--accent); }
.menu-toggle { display: none; border: 1px solid #6ec1e4; border-radius: .35rem; padding: .45rem .7rem; color: var(--ink); background: transparent; }
.hero { min-height: calc(100svh - 76px); display: grid; place-items: center; padding: 4rem 5vw; background: linear-gradient(rgb(4 2 25 / .30), rgb(4 2 25 / .30)), center / cover no-repeat; }
.hero--1 { background-image: linear-gradient(rgb(4 2 25 / .30), rgb(4 2 25 / .30)), url("/static/images/home/IMG_9057-scaled-1600.webp"); }
.hero-content { max-width: 720px; text-align: center; text-shadow: 0 2px 16px #000; }
h1 { margin: 0 0 1rem; font: 600 clamp(2.6rem, 7vw, 5rem)/1.05 "Plus Jakarta Sans", Inter, sans-serif; letter-spacing: -.04em; }
.hero-content p { margin: .65rem auto; max-width: 62ch; }
.eyebrow { margin: 0 0 .6rem; color: var(--accent); font-size: .8rem; font-weight: 750; letter-spacing: .13em; text-transform: uppercase; }
.content-page { width: min(100% - 2.5rem, 920px); min-height: calc(100svh - 150px); margin: 0 auto; padding: clamp(4rem, 10vw, 8rem) 0; }
.content-page > p { max-width: 68ch; }
.album-grid, .gallery-grid { display: grid; gap: 1.2rem; margin-top: 3rem; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.album-group { margin-top: 4rem; }.album-group h2 { color: var(--accent); font: 600 clamp(1.6rem, 4vw, 2.4rem)/1.1 "Plus Jakarta Sans", Inter, sans-serif; }
.album-card { overflow: hidden; background: #141129; color: var(--ink); text-decoration: none; }
.album-card img, .gallery-item img { display: block; width: 100%; aspect-ratio: 3 / 2; object-fit: cover; transition: transform .25s ease; }
.album-card:hover img, .gallery-item:hover img { transform: scale(1.03); }
.album-card span { display: grid; gap: .45rem; padding: 1rem; }
.album-card small { color: var(--muted); line-height: 1.4; }
.gallery-item { overflow: hidden; padding: 0; border: 0; background: #141129; cursor: zoom-in; }
.site-footer { padding: 2rem 5vw; color: var(--muted); font-size: .85rem; text-align: center; }
.lightbox { width: min(96vw, 1400px); max-width: none; border: 0; padding: 1rem; color: var(--ink); background: rgb(4 2 25 / .98); }
.lightbox::backdrop { background: rgb(0 0 0 / .88); }
.lightbox figure { display: grid; justify-items: center; margin: 0; }
.lightbox figure img { max-width: 100%; max-height: 80vh; object-fit: contain; }
.lightbox figcaption { min-height: 1.8rem; padding-top: .8rem; color: var(--muted); text-align: center; }
.lightbox button { position: absolute; border: 0; color: white; background: rgb(0 0 0 / .48); font-size: 2.5rem; cursor: pointer; }
.lightbox-close { top: .5rem; right: .7rem; }
.lightbox-previous, .lightbox-next { top: 45%; padding: .25rem .75rem; }
.lightbox-previous { left: .5rem; }.lightbox-next { right: .5rem; }
@media (max-width: 700px) { .menu-toggle { display: block; }.primary-nav { display: none; position: absolute; top: 76px; right: 0; left: 0; flex-direction: column; gap: 0; padding: .7rem 5vw 1.2rem; background: var(--night); }.primary-nav.is-open { display: flex; }.primary-nav a { padding: .6rem 0; }.album-grid, .gallery-grid { grid-template-columns: 1fr; }.hero { min-height: calc(80svh - 76px); }.content-page { width: min(100% - 2rem, 920px); } }
@media (min-width: 701px) and (max-width: 1050px) { .album-grid, .gallery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }