/* ============================================================
   LAKE POINT INTERNATIONAL — OBJECTS PAGE
   Save as css/objects.css. Styles scoped to .objects-page.
   ============================================================ */

/* 1. DESIGN TOKENS */
.objects-page {
    --obj-ink: #202328;
    --obj-gold: #b18b59;
    --obj-muted: #707173;
    --obj-paper: #faf9f6;
    --obj-rule: #d6c4aa;
    color: var(--obj-ink);
    background: #fff;
    font-family: Roboto, Arial, sans-serif;
    overflow: clip;
}

    .objects-page *, .objects-page *::before, .objects-page *::after {
        box-sizing: border-box;
    }

    .objects-page .objects-container {
        width: min(1280px, calc(100% - 96px));
        margin-inline: auto;
    }

    .objects-page img {
        display: block;
        max-width: 100%;
    }

    .objects-page h1, .objects-page h2, .objects-page h3, .objects-page p {
        margin-top: 0;
    }

    .objects-page h1, .objects-page h2, .objects-page h3 {
        font-family: 'Cormorant Garamond', Georgia, serif;
    }

    .objects-page .objects-eyebrow {
        color: var(--obj-gold);
        text-transform: uppercase;
        font: 500 15.6px/1.5 Roboto, Arial, sans-serif;
        /*font: 500 12px/1.5 Roboto, Arial, sans-serif;*/
        letter-spacing: .16em;
        margin: 0 0 18px;
    }

    .objects-page .objects-rule {
        width: 54px;
        height: 1px;
        background: var(--obj-rule);
        margin: 20px 0;
    }

    /* 2. HERO */
    .objects-page .objects-hero {
        position: relative;
        min-height: 620px;
        display: flex;
        align-items: center;
        isolation: isolate;
        color: #fff;
        background: #14212c;
    }

    .objects-page .objects-hero-image {
        position: absolute;
        inset: 0;
        z-index: -2;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
    }

    .objects-page .objects-hero-shade {
        position: absolute;
        inset: 0;
        z-index: -1;
        background: linear-gradient(90deg, rgba(4,12,20,.91) 0%, rgba(4,12,20,.74) 28%, rgba(4,12,20,.22) 65%, transparent 100%);
    }

    .objects-page .objects-hero-inner {
        padding-block: 110px 90px;
    }

    .objects-page .objects-hero-eyebrow {
        color: #d9bd8c;
    }

    .objects-page .objects-hero h1 {
        font-size: clamp(64px, 7.4vw, 118px);
        font-weight: 500;
        line-height: .84;
        letter-spacing: -.035em;
        margin: 0 0 30px;
        max-width: 780px;
    }

        .objects-page .objects-hero h1 em {
            font-weight: 400;
            font-style: normal;
        }

    .objects-page .objects-hero-lead {
        font: 400 17px/1.55 Roboto, Arial, sans-serif;
        margin: 0;
    }

    .objects-page .objects-hero-note {
        font: 400 15px/1.75 Roboto, Arial, sans-serif;
        margin: 0;
        max-width: 350px;
    }

    /* 3. FEATURED MUG */
    .objects-page .objects-featured {
        background: var(--obj-paper);
    }

    .objects-page .objects-featured-grid {
        display: grid;
        grid-template-columns: 43% 57%;
        min-height: 410px;
        align-items: center;
    }

    .objects-page .objects-featured-copy {
        padding: 64px 22px 64px 0;
        position: relative;
        z-index: 1;
    }

    .objects-page .objects-featured h2 {
        font-size: clamp(40px, 4vw, 64px);
        font-weight: 500;
        line-height: .95;
        margin: 0;
    }

    .objects-page .objects-featured-copy > p:not(.objects-eyebrow) {
        font-size: 14px;
        line-height: 1.8;
        color: var(--obj-muted);
    }

    .objects-page .objects-featured .objects-available {
        margin: 24px 0 6px;
    }

    .objects-page .objects-featured h3 {
        font-size: 30px;
        font-weight: 500;
        margin: 0;
    }

    .objects-page .objects-featured-visual {
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
    }

        .objects-page .objects-featured-visual img {
            width: 100%;
            max-height: 410px;
            object-fit: contain;
        }

    /* 4. COLLECTION */
    .objects-page .objects-collection {
        padding: 78px 0 50px;
    }

    .objects-page .objects-collection-intro {
        margin-bottom: 40px;
    }

    .objects-page .objects-collection h2 {
        font-size: clamp(44px, 4.5vw, 68px);
        font-weight: 500;
        line-height: .92;
        margin: 0;
    }

    .objects-page .objects-collection-intro > p:not(.objects-eyebrow) {
        color: var(--obj-muted);
        font-size: 14px;
        line-height: 1.8;
        margin: 0;
    }

    .objects-page .objects-products {
        display: grid;
        grid-template-columns: repeat(4, minmax(0,1fr));
        gap: 22px;
    }

    .objects-page .objects-product {
        text-align: center;
        min-width: 0;
    }

    .objects-page .objects-product-image {
        height: 235px;
        display: flex;
        align-items: end;
        justify-content: center;
    }

        .objects-page .objects-product-image img {
            width: 100%;
            height: 100%;
            object-fit: contain;
        }

    .objects-page .objects-product h3 {
        margin: 15px 0 0;
        font: 500 12px/1.45 Roboto, Arial, sans-serif;
        letter-spacing: .07em;
        text-transform: uppercase;
    }

    /* 5. APPAREL */
    .objects-page .objects-apparel {
        padding: 44px 0 72px;
    }

    .objects-page .objects-apparel-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0,1fr));
        gap: 0;
    }

    .objects-page .objects-apparel-item {
        text-align: center;
        padding: 0 28px;
    }

        .objects-page .objects-apparel-item + .objects-apparel-item {
            border-left: 1px solid #e3dfd9;
        }

    .objects-page .objects-apparel-image {
        height: 310px;
        display: flex;
        align-items: end;
        justify-content: center;
    }

        .objects-page .objects-apparel-image img {
            max-height: 100%;
            width: 100%;
            object-fit: contain;
        }

    .objects-page .objects-apparel h3 {
        font: 500 15px/1.35 Roboto, Arial, sans-serif;
        text-transform: uppercase;
        letter-spacing: .08em;
        margin: 18px 0 5px;
    }

    .objects-page .objects-apparel-item p {
        color: var(--obj-muted);
        font-size: 13px;
        margin: 0;
    }

    /* 6. PHILOSOPHY */
    .objects-page .objects-philosophy {
        background: var(--obj-paper);
    }

    .objects-page .objects-philosophy-grid {
        display: grid;
        grid-template-columns: 45% 55%;
        align-items: center;
        min-height: 420px;
    }

    .objects-page .objects-philosophy-copy {
        padding: 60px 45px 60px 0;
    }

    .objects-page .objects-philosophy h2 {
        font-size: clamp(42px, 4vw, 62px);
        font-weight: 500;
        line-height: 1;
        margin: 0;
    }

    .objects-page .objects-philosophy-copy > p:not(.objects-eyebrow) {
        max-width: 430px;
        font-size: 15px;
        line-height: 1.85;
        color: var(--obj-muted);
        margin: 0;
    }

    .objects-page .objects-philosophy-visual {
        height: 420px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

        .objects-page .objects-philosophy-visual img {
            width: 100%;
            height: 100%;
            object-fit: contain;
        }

    /* 7. ACCESS BAND */
    .objects-page .objects-access {
        display: grid;
        grid-template-columns: 45% 55%;
        min-height: 180px;
        background: #f0ebe2;
    }

    .objects-page .objects-access-copy {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        padding: 28px 42px 28px max(24px, calc((100vw - 1280px)/2));
    }

    .objects-page .objects-access-copy-inner {
        display: flex;
        align-items: center;
        gap: 24px;
        max-width: 540px;
        width: 100%;
    }

    .objects-page .objects-access-icon {
        width: 62px;
        height: 62px;
        border: 1px solid #cbb58f;
        border-radius: 50%;
        flex: 0 0 62px;
        display: grid;
        place-items: center;
        color: var(--obj-gold);
        font-size: 24px;
    }

    .objects-page .objects-access .objects-eyebrow {
        margin-bottom: 7px;
    }

    .objects-page .objects-access-copy-inner p:last-child {
        margin: 0;
        font-size: 14px;
        line-height: 1.7;
        color: var(--obj-muted);
    }

    .objects-page .objects-access-visual {
        min-height: 180px;
    }

        .objects-page .objects-access-visual img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

/* 8. TABLET */
@media (max-width: 900px) {
    .objects-page .objects-container {
        width: calc(100% - 48px);
    }

    .objects-page .objects-hero {
        min-height: 540px;
    }

    .objects-page .objects-featured-grid {
        grid-template-columns: 45% 55%;
    }

    .objects-page .objects-product-image {
        height: 190px;
    }

    .objects-page .objects-apparel-image {
        height: 250px;
    }
}

/* 9. MOBILE */
@media (max-width: 600px) {
    .objects-page .objects-container {
        width: calc(100% - 36px);
    }

    .objects-page .objects-hero {
        min-height: 470px;
    }

    .objects-page .objects-hero-inner {
        padding-block: 80px 60px;
    }

    .objects-page .objects-hero h1 {
        font-size: clamp(54px, 12vw, 74px);
    }

    .objects-page .objects-hero-lead {
        font-size: 14px;
    }

    .objects-page .objects-hero-note {
        font-size: 13px;
    }

    .objects-page .objects-featured-grid {
        grid-template-columns: 45% 55%;
        min-height: 290px;
    }

    .objects-page .objects-featured-copy {
        padding: 36px 0;
    }

    .objects-page .objects-featured h2 {
        font-size: clamp(28px, 7vw, 40px);
    }

    .objects-page .objects-featured-copy > p:not(.objects-eyebrow) {
        font-size: 11px;
    }

    .objects-page .objects-featured h3 {
        font-size: 22px;
    }

    .objects-page .objects-featured-visual img {
        max-height: 290px;
    }

    .objects-page .objects-collection {
        padding: 52px 0 20px;
    }

    .objects-page .objects-collection-intro {
        margin-bottom: 25px;
    }

    .objects-page .objects-products {
        grid-template-columns: repeat(2, minmax(0,1fr));
        gap: 22px 12px;
    }

    .objects-page .objects-product-image {
        height: 175px;
    }

    .objects-page .objects-product h3 {
        font-size: 11px;
    }

    .objects-page .objects-apparel {
        padding: 32px 0 50px;
    }

    .objects-page .objects-apparel-item {
        padding: 0 9px;
    }

    .objects-page .objects-apparel-image {
        height: 170px;
    }

    .objects-page .objects-apparel h3 {
        font-size: 11px;
    }

    .objects-page .objects-apparel-item p {
        font-size: 11px;
    }

    .objects-page .objects-philosophy-grid {
        grid-template-columns: 1fr;
    }

    .objects-page .objects-philosophy-copy {
        padding: 44px 0 15px;
    }

    .objects-page .objects-philosophy-visual {
        height: 260px;
    }

    .objects-page .objects-access {
        grid-template-columns: 1fr;
    }

    .objects-page .objects-access-copy {
        justify-content: flex-start;
        padding: 25px 18px;
    }

    .objects-page .objects-access-visual {
        height: 145px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .objects-page *, .objects-page *::before, .objects-page *::after {
        scroll-behavior: auto !important;
    }
}