/* ==========================================================
   JT MAISON — Hero Widget
   ========================================================== */

.jtm-hero {
    position: relative;
    width: 100%;
    /* Strict height to fill the screen minus header */
    height: calc(100vh - var(--jtm-header-h));
    overflow: hidden;
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    background: var(--jtm-white);
    padding: 60px 32px 80px 32px;
    box-sizing: border-box;
}

/* Background Video */
.jtm-hero__video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: 25% center;
    z-index: 1;
}

/* Content Container */
.jtm-hero__content {
    position: relative;
    z-index: 2;
    text-align: right;
    max-width: 800px;
}

/* Typography */
.jtm-hero__title {
    font-family: var(--jtm-font-ui);
    font-weight: 500;
    font-size: clamp(36px, 5vw, 64px);
    color: var(--jtm-dark);
    line-height: 1.1;
    margin: 0 0 32px 0;
}

.jtm-hero__subtitle {
    font-family: var(--jtm-font-ui);
    font-weight: 300;
    font-size: 11px;
    letter-spacing: 0.25em;
    color: var(--jtm-gray);
    text-transform: uppercase;
    margin: 0;
    line-height: 1.6;
}

/* Mobile Actions (Hidden on Desktop) */
.jtm-hero__mobile-actions {
    display: none;
}

/* Responsive Mobile */
@media (max-width: 768px) {
    .jtm-hero {
        padding: 24px 24px 40px 24px;
        align-items: flex-end;
        justify-content: center;
        text-align: center;
    }
    
    .jtm-hero__video {
        object-position: center top;
    }

    .jtm-hero__content {
        text-align: center;
        width: 100%;
    }

    .jtm-hero__title {
        font-size: clamp(28px, 8vw, 36px);
        margin-bottom: 12px;
    }

    .jtm-hero__subtitle {
        font-size: 10px;
        letter-spacing: 0.15em;
        margin-bottom: 32px;
        max-width: 320px;
        margin-left: auto;
        margin-right: auto;
    }

    .jtm-hero__mobile-actions {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 20px;
        width: 100%;
        max-width: 400px;
        margin: 0 auto;
    }

    .jtm-hero__btn-cta {
        display: block;
        width: 100%;
        padding: 16px;
        border: 1px solid var(--jtm-dark);
        color: var(--jtm-dark);
        text-decoration: none;
        text-transform: uppercase;
        font-family: 'DM Sans', sans-serif;
        font-weight: 500;
        font-size: 14px;
        letter-spacing: 0.1em;
        background: transparent;
        transition: background 0.2s, color 0.2s;
    }

    .jtm-hero__btn-cta:hover {
        background: var(--jtm-dark);
        color: var(--jtm-white);
    }

    .jtm-hero__link-work {
        font-family: var(--jtm-font-ui);
        font-size: 14px;
        color: var(--jtm-dark);
        text-decoration: none;
        letter-spacing: 0.1em;
        text-transform: uppercase;
    }
}