/* Curated landing page. The archive keeps its original column widths and images. */
.landing-page {
    --landing-ink: #0c0d0e;
    --landing-paper: #ecece8;
}

.landing-page .landing-kicker {
    margin: 0;
    font: 11px/1.6 var(--font-mono);
    letter-spacing: 1.1px;
    text-transform: uppercase;
}

.featured-project {
    min-height: 100vh;
    min-height: 100svh;
    padding: 112px clamp(20px, 4vw, 72px) 32px;
    display: flex;
    flex-direction: column;
    gap: 26px;
    background-color: var(--landing-ink);
    color: var(--landing-paper);
}

.featured-project__topline,
.featured-project__heading,
.featured-project__footer {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 32px;
}

.featured-project__topline {
    color: #aeb3b3;
}

.featured-project__topline a {
    font: 11px/1.6 var(--font-mono);
    color: inherit;
}

.featured-project__topline a span { margin-left: 12px; }

.landing-page .featured-project .featured-project__title {
    margin: 0;
    color: var(--landing-paper);
    font-size: clamp(44px, 5.5vw, 88px);
    font-weight: 500;
    line-height: 1.05;
    letter-spacing: -.055em;
    max-width: 16ch;
}

.featured-project__meta {
    flex-shrink: 0;
    display: flex;
    gap: 28px;
    margin: 0;
    max-width: 280px;
    font-size: 12px;
    line-height: 1.5;
}

.featured-project .featured-project__title span { display: inline-block; }

.featured-project__meta dt {
    margin-bottom: 5px;
    font: 10px/1.5 var(--font-mono);
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #aeb3b3;
}

.featured-project__meta dd { margin: 0; }
.featured-project__meta > div:last-child { flex-shrink: 0; }
.featured-project__meta > div:last-child dd { white-space: nowrap; }

.featured-project__footer { align-items: center; }

.featured-project__footer p {
    margin: 0;
    max-width: 53ch;
    color: #bdc0be;
    font-size: 14px;
    line-height: 1.65;
}

.landing-page .landing-link {
    display: inline-flex;
    align-items: center;
    gap: 24px;
    padding: 10px 0;
    border-bottom: 1px solid currentColor;
    color: var(--theme-text);
    font-family: var(--font-sans);
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
}

.landing-link span { transition: transform 180ms ease; }
.landing-link:hover span { transform: translate(3px, -3px); }
.landing-page .featured-project .landing-link,
.landing-page .landing-next .landing-link { color: var(--landing-paper); }

.landing-intro {
    box-sizing: border-box;
    min-height: 100vh;
    min-height: 100svh;
    padding: 100px 0 max(24px, env(safe-area-inset-bottom));
    display: flex;
    flex-direction: column;
}
.landing-intro > .container {
    display: flex;
    flex: 1;
    flex-direction: column;
    min-width: 0;
}
.landing-intro__main {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: clamp(24px, 4vh, 64px) 0;
}
.landing-intro .landing-kicker { color: var(--theme-accent); margin-bottom: 32px; }
.landing-intro__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px 24px;
    border-top: 1px solid var(--theme-border);
    padding-top: 20px;
}
.landing-intro__footer .landing-kicker { margin: 0; color: var(--theme-muted); }
.landing-intro__explore { flex-shrink: 0; }
.landing-intro__explore:hover span { transform: translateY(3px); }

.landing-intro__row,
.landing-next__row {
    display: grid;
    grid-template-columns: 1.25fr 1fr;
    gap: clamp(32px, 7vw, 110px);
    align-items: start;
}
.landing-intro__row { grid-template-columns: minmax(0, 1.65fr) minmax(0, 1fr); align-items: center; }

.landing-page .landing-intro h1,
.landing-page .landing-next h2 {
    margin: 0;
    font-size: clamp(32px, 4.2vw, 60px);
    font-weight: 500;
    line-height: 1.1;
    letter-spacing: -.045em;
}

.landing-intro__copy p {
    max-width: 42ch;
    margin: 0 0 22px;
    font-size: 17px;
    line-height: 1.75;
}

.archive-section { padding-top: clamp(40px, 6vw, 80px); padding-bottom: 96px; scroll-margin-top: 96px; }
.archive-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 24px;
    padding-top: 32px;
    border-top: 1px solid var(--theme-border);
    margin-bottom: 28px;
}

.archive-heading .landing-kicker { margin-bottom: 14px; }
.landing-page .archive-heading h2 {
    margin: 0;
    font-size: clamp(32px, 4vw, 52px);
    font-weight: 500;
    line-height: 1.1;
    letter-spacing: -.04em;
}

.archive-status {
    margin: 0;
    font: 11px/1.6 var(--font-mono);
    text-align: right;
}

.work-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 0 22px;
    padding-bottom: 24px;
    margin-bottom: 12px;
}

.work-filters[hidden] { display: none; }
.work-filters button {
    min-height: 44px;
    padding: 10px 0;
    border: 0;
    border-bottom: 1px solid transparent;
    border-radius: 0;
    background: transparent;
    color: var(--theme-text);
    font: 500 12px/1.5 var(--font-sans);
    cursor: pointer;
    opacity: .6;
    transition: opacity 180ms ease, border-color 180ms ease;
}

.work-filters button[aria-pressed="true"] {
    opacity: 1;
    border-bottom-color: var(--theme-accent);
}

.work-filters button:hover { opacity: 1; }
.landing-page a:focus-visible,
.landing-page button:focus-visible {
    outline: 2px solid var(--theme-accent);
    outline-offset: 4px;
}

.landing-page .featured-project a:focus-visible,
.landing-page .landing-next a:focus-visible { outline-color: #ff8077; outline-offset: -4px; }
.landing-back-to-top { font-size: 12px; }

.landing-next { padding: clamp(64px, 8vw, 120px) 0; background: var(--landing-ink); }
.landing-next .landing-kicker { color: #aeb3b3; margin-bottom: 32px; }
.landing-page .landing-next h2 { color: var(--landing-paper); }
.landing-next__links { display: flex; flex-direction: column; align-items: start; gap: 20px; }

/* Native horizontal scrolling keeps touch navigation lightweight. */
.project-slideshow { width: 100%; min-width: 0; }
.project-slideshow__track {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
}
.project-slideshow__track::-webkit-scrollbar { display: none; }
.project-slideshow__slide {
    flex: 0 0 100%;
    min-width: 0;
    margin: 0;
    scroll-snap-align: start;
}
.project-slideshow__slide > a {
    display: block;
    height: clamp(280px, 48svh, 660px);
    background: #15151b;
}
.project-slideshow__slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
.project-slideshow__slide figcaption {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 4px 16px;
    padding-top: 12px;
    font: 400 var(--type-label)/1.6 var(--font-mono);
    color: var(--type-muted-on-dark);
}
.project-slideshow__slide figcaption a { color: inherit; }
.project-slideshow__controls {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px 20px;
    padding-top: 16px;
}
.project-slideshow__controls[hidden] { display: none; }
.project-slideshow__status {
    margin: 0;
    font: 400 var(--type-label)/1.6 var(--font-mono);
    color: var(--type-muted-on-dark);
}
.project-slideshow__buttons { display: flex; gap: 8px; }
.project-slideshow__buttons button {
    min-width: 44px;
    min-height: 44px;
    padding: 10px;
    background: transparent;
    border: 1px solid #ffffff35;
    color: var(--landing-paper);
    font: 400 var(--type-caption)/1.5 var(--font-sans);
    cursor: pointer;
}
.project-slideshow__buttons button:hover { border-color: var(--landing-paper); }
.landing-page .project-slideshow :focus-visible {
    outline: 2px solid var(--type-signal);
    outline-offset: -3px;
}

@media (max-width: 900px) {
    .featured-project { padding-top: 100px; gap: 22px; }
    .featured-project__heading { flex-direction: column; gap: 20px; }
    .featured-project__meta { max-width: none; gap: 36px; }

    .landing-intro__row,
    .landing-next__row { grid-template-columns: 1fr; }
}

@media (max-width: 767px) {
    .landing-intro > .container { width: 100%; }
}

@media (max-width: 600px) {
    .landing-intro { padding-top: 88px; }
    .landing-intro .landing-kicker { margin-bottom: 24px; }
    .landing-intro__row { gap: 24px; }
    .landing-intro__footer { flex-wrap: wrap; padding-top: 12px; }
    .landing-intro__footer .landing-kicker { margin: 0; }
    .featured-project__topline { gap: 16px; }
    .featured-project__topline a,
    .featured-project__topline .landing-kicker { font-size: 9px; letter-spacing: .5px; }
    .featured-project__topline a span { margin-left: 4px; }
    .featured-project__footer { flex-direction: column; align-items: start; gap: 14px; }

    .featured-project__footer p { font-size: 13px; }
    .archive-heading { flex-direction: column; align-items: start; gap: 16px; }
    .archive-status { text-align: left; }
    .work-filters { gap: 0 18px; }
    .work-filters button { font-size: 11px; }
    .landing-intro__copy p { font-size: 16px; }
}

@media (prefers-reduced-motion: reduce) {
    .landing-page .portfolio-gallery .grid-item { transition-duration: 0s !important; }
    .landing-link span,
    .work-filters button { transition: none; }
    .landing-link:hover span,
    .landing-intro__explore:hover span { transform: none; }
}