.home-page { background: #070707; }
.home-page .site-header { color: #f3f1eb; }
.home-page .site-header.is-scrolled { background: rgba(8, 8, 8, .84); --line: #2d2d2d; --text: #eeeae3; --text-strong: #fff; --muted: #96938b; }

.motion-stage {
    position: fixed;
    z-index: 0;
    inset: 0;
    overflow: hidden;
    background: radial-gradient(circle at 58% 45%, #242627 0, #0c0d0e 34%, #050505 72%);
}
.motion-stage__video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    opacity: 0;
    filter: saturate(.6) contrast(1.12) brightness(.68) blur(.4px);
    transform: scale(1.04);
    transition: opacity .8s ease;
}
.motion-stage.is-ready .motion-stage__video { opacity: .72; }
.motion-stage__shade {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, rgba(5, 5, 5, .89) 0%, rgba(5, 5, 5, .48) 40%, rgba(5, 5, 5, .12) 76%, rgba(5, 5, 5, .62) 100%),
        linear-gradient(0deg, rgba(5, 5, 5, .85), transparent 28%, transparent 75%, rgba(5, 5, 5, .45));
}
.motion-stage__grain {
    position: absolute;
    inset: 0;
    opacity: .11;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.34'/%3E%3C/svg%3E");
    mix-blend-mode: soft-light;
}

.home-experience { position: relative; z-index: 2; color: #eeeae3; }
.home-scene {
    min-height: 100vh;
    width: min(100%, var(--content-width));
    margin-inline: auto;
    padding: calc(var(--header-height) + 42px) var(--page-gutter) 72px;
    display: grid;
    align-items: center;
}
.home-scene h1, .home-scene h2, .home-scene strong, .home-scene blockquote { color: #fff; }
.home-scene .section-index { color: var(--accent); }

.home-scene--hero { min-height: 100vh; grid-template-columns: minmax(0, 1fr) minmax(200px, .7fr); }
.home-scene__content { max-width: 820px; }
.home-scene__content h1 { max-width: 820px; margin-top: 24px; font-size: clamp(3rem, 4.2vw, 4.8rem); line-height: .94; }
.home-scene__content h1 em { color: rgba(255, 255, 255, .56); font-style: normal; -webkit-text-stroke: 0; }
.home-scene__content p { max-width: 540px; margin-top: 38px; color: #aaa69e; font-size: clamp(1rem, 1.25vw, 1.22rem); }
.scroll-cue { align-self: end; justify-self: end; display: flex; align-items: center; gap: 16px; color: #a29e96; font-size: .62rem; letter-spacing: .25em; writing-mode: vertical-rl; }
.scroll-cue i { width: 1px; height: 70px; background: linear-gradient(var(--accent) 50%, rgba(255,255,255,.18) 50%); background-size: 100% 200%; animation: scroll-cue 1.7s ease infinite; }
@keyframes scroll-cue { from { background-position: 0 100%; } to { background-position: 0 -100%; } }

.home-scene--gallery { grid-template-columns: minmax(260px, .55fr) minmax(0, 1.45fr); gap: clamp(40px, 7vw, 120px); }
.home-scene__head h2 { max-width: 430px; margin-top: 18px; font-size: clamp(2.35rem, 3.1vw, 3.5rem); line-height: .98; }
.home-projects { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid rgba(255,255,255,.22); border-left: 1px solid rgba(255,255,255,.22); }
.home-project {
    position: relative;
    min-height: 0;
    overflow: hidden;
    display: grid;
    grid-template-rows: auto minmax(108px, auto);
    border-right: 1px solid rgba(255,255,255,.22);
    border-bottom: 1px solid rgba(255,255,255,.22);
    background: rgba(8,8,8,.72);
    isolation: isolate;
}
.home-project::after { display: none; }
.home-project img { position: relative; z-index: 0; width: 100%; height: clamp(180px, 20vw, 300px); object-fit: contain; background: #101010; filter: grayscale(.2) brightness(.78); transition: transform .7s var(--ease-out), filter .4s ease; }
.home-project:hover img { transform: scale(1.045); filter: grayscale(0) brightness(.9); }
.home-project__number { position: absolute; z-index: 2; top: 16px; left: 16px; padding: 3px 5px; background: rgba(5,5,5,.82); color: var(--accent); font-size: .67rem; font-weight: 900; letter-spacing: .12em; }
.home-project__meta { position: relative; grid-row: 2; min-width: 0; padding: 18px 20px; display: grid; align-content: end; border-top: 1px solid rgba(255,255,255,.18); }
.home-project__meta small { color: #a7a39c; font-size: .6rem; letter-spacing: .15em; text-transform: uppercase; }
.home-project__meta strong {
    margin-top: 4px;
    display: -webkit-box;
    overflow: hidden;
    font-family: var(--font-display);
    font-size: clamp(1.1rem, 1.35vw, 1.5rem);
    line-height: 1;
    text-transform: uppercase;
    overflow-wrap: anywhere;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}
.home-project--empty { background: linear-gradient(135deg, rgba(255,255,255,.06), rgba(255,255,255,.01)); }
.home-project--empty::before { content: ""; position: absolute; inset: 0; background: repeating-linear-gradient(135deg, transparent 0 14px, rgba(255,255,255,.035) 14px 15px); }

.home-scene--products { grid-template-columns: minmax(280px, .75fr) minmax(0, 1.25fr); gap: clamp(40px, 8vw, 150px); }
.home-product-lines { border-top: 1px solid rgba(255,255,255,.25); }
.home-product-lines > div { min-height: clamp(96px, 9vw, 138px); display: grid; grid-template-columns: 60px 1fr auto; align-items: center; gap: 20px; border-bottom: 1px solid rgba(255,255,255,.25); }
.home-product-lines span { color: var(--accent); font-size: .67rem; font-weight: 900; }
.home-product-lines strong { font-family: var(--font-display); font-size: clamp(1.9rem, 2.8vw, 3.2rem); letter-spacing: -.035em; line-height: .95; text-transform: uppercase; }
.home-product-lines small { color: #8f8b84; font-size: .62rem; letter-spacing: .15em; text-align: right; }

.home-scene--final { min-height: 100vh; place-items: center; }
.home-final { max-width: 900px; text-align: center; display: grid; justify-items: center; }
.home-final blockquote { margin: 30px 0 24px; font-family: var(--font-display); font-size: clamp(2.2rem, 3vw, 3.4rem); font-weight: 850; line-height: 1.04; letter-spacing: -.035em; text-transform: uppercase; }
.home-final p { max-width: 650px; color: #aaa69e; }
.home-final .button { margin-top: 38px; }

html[data-theme="light"] .home-page { background: #efede6; }
html[data-theme="light"] .home-page .site-header.is-scrolled { background: rgba(239, 237, 230, .88); --line: #c6c1b7; --text: #20201f; --text-strong: #090909; --muted: #6f6c65; }
html[data-theme="light"] .motion-stage { background: radial-gradient(circle at 58% 45%, #ffffff 0, #d9d6ce 38%, #c8c3b8 100%); }
html[data-theme="light"] .motion-stage__video { filter: saturate(.35) contrast(1.04) brightness(.94) blur(.4px); opacity: 0; }
html[data-theme="light"] .motion-stage.is-ready .motion-stage__video { opacity: .52; }
html[data-theme="light"] .motion-stage__shade { background: linear-gradient(90deg, rgba(239,237,230,.94) 0%, rgba(239,237,230,.5) 42%, rgba(239,237,230,.1) 75%, rgba(239,237,230,.62) 100%), linear-gradient(0deg, rgba(239,237,230,.88), transparent 28%, transparent 75%, rgba(239,237,230,.5)); }
html[data-theme="light"] .home-experience { color: #20201f; }
html[data-theme="light"] .home-scene h1,
html[data-theme="light"] .home-scene h2,
html[data-theme="light"] .home-scene--products strong,
html[data-theme="light"] .home-final blockquote { color: #090909; }
html[data-theme="light"] .home-scene__content h1 em { color: rgba(9, 9, 9, .52); }
html[data-theme="light"] .home-scene__content p,
html[data-theme="light"] .home-final p { color: #65615a; }
html[data-theme="light"] .home-product-lines { border-color: rgba(9,9,9,.25); }
html[data-theme="light"] .home-product-lines > div { border-color: rgba(9,9,9,.25); }
html[data-theme="light"] .home-product-lines small { color: #6f6b64; }

@media (max-width: 1180px) {
    .motion-stage__shade { background: linear-gradient(0deg, rgba(5,5,5,.92), rgba(5,5,5,.22) 67%, rgba(5,5,5,.55)); }
    .motion-stage__video { transform: scale(1.18); filter: saturate(.55) contrast(1.08) brightness(.58); }
    .home-scene--hero, .home-scene--gallery, .home-scene--products { grid-template-columns: 1fr; }
    .home-scene--hero { align-content: center; }
    .scroll-cue { display: none; }
    .home-scene--gallery, .home-scene--products { align-content: center; }
    .home-scene__head h2 { font-size: clamp(2.3rem, 6vw, 3.3rem); }
}

@media (max-width: 640px) {
    .home-scene {
        min-height: 0;
        padding-top: 68px;
        padding-bottom: 68px;
        overflow: hidden;
    }
    .home-scene--hero {
        min-height: 78svh;
        padding-top: calc(var(--header-height) + 38px);
        padding-bottom: 56px;
    }
    .home-scene__content { width: 100%; min-width: 0; }
    .home-scene__content h1 {
        max-width: 100%;
        margin-top: 20px;
        font-size: clamp(2.2rem, 9.2vw, 2.85rem);
        line-height: .96;
        letter-spacing: -.055em;
        overflow-wrap: normal;
    }
    .home-scene__content p { margin-top: 28px; font-size: .98rem; line-height: 1.6; }
    .home-scene__head h2 {
        max-width: 100%;
        margin-top: 16px;
        font-size: clamp(2rem, 8.4vw, 2.55rem);
        line-height: 1;
    }
    .home-scene--gallery { gap: 32px; }
    .home-projects { grid-template-columns: 1fr; }
    .home-project {
        min-height: 0;
        height: 150px;
        display: grid;
        grid-template-columns: minmax(118px, 40%) minmax(0, 1fr);
        background: rgba(8,8,8,.76);
    }
    .home-project::after { display: none; }
    .home-project img {
        position: relative;
        z-index: 0;
        grid-column: 1;
        grid-row: 1;
        width: 100%;
        height: 100%;
        object-fit: contain;
        background: #101010;
        filter: none;
    }
    .home-project__number { z-index: 2; top: 12px; left: 12px; padding: 3px 5px; background: rgba(5,5,5,.82); }
    .home-project__meta {
        position: relative;
        left: auto;
        right: auto;
        bottom: auto;
        z-index: 1;
        grid-column: 2;
        grid-row: 1;
        min-width: 0;
        align-content: end;
        padding: 18px;
        border-top: 0;
        border-left: 1px solid rgba(255,255,255,.18);
    }
    .home-project__meta strong { font-size: clamp(1.05rem, 5vw, 1.35rem); line-height: 1.05; -webkit-line-clamp: 4; }
    .home-project:nth-child(n+3) { display: none; }
    .home-project--empty { grid-template-columns: 1fr; }
    .home-project--empty .home-project__meta { grid-column: 1; border-left: 0; }
    .home-scene--products { gap: 32px; }
    .home-product-lines > div { min-height: 96px; gap: 14px; }
    .home-product-lines > div { grid-template-columns: 32px 1fr; }
    .home-product-lines small { display: none; }
    .home-product-lines strong { font-size: clamp(1.75rem, 8.2vw, 2.5rem); line-height: .95; overflow-wrap: anywhere; }
    .home-scene--final { min-height: 0; padding-block: 82px; }
    .home-final { width: 100%; }
    .home-final blockquote { margin-block: 26px 20px; font-size: clamp(1.8rem, 7.2vw, 2.3rem); line-height: 1.04; }
    .home-final p { font-size: .98rem; line-height: 1.6; }
    .home-final .button { margin-top: 30px; }
}

@media (max-width: 380px) {
    .home-scene__content h1 { font-size: clamp(2rem, 9vw, 2.35rem); }
    .home-project { grid-template-columns: 38% minmax(0, 1fr); height: 138px; }
    .home-project__meta { padding: 14px; }
}

@media (prefers-reduced-motion: reduce) {
    .motion-stage__video { display: none; }
    .home-scene { min-height: 100vh; }
}

@media (prefers-reduced-motion: reduce) and (max-width: 640px) {
    .home-scene { min-height: 0; }
    .home-scene--hero { min-height: 78svh; }
}
