/* FROM THE TABLE HUB */

.from-table-page{
    background:
        radial-gradient(
            circle at 78% 12%,
            rgba(169,67,34,.14),
            transparent 32%
        ),
        #100b08;
}

.from-table-hero{
    min-height:480px;
    padding:
        180px
        clamp(24px,7vw,110px)
        90px;

    display:flex;
    align-items:flex-end;

    border-bottom:
        1px solid rgba(217,155,57,.24);

    background:
        linear-gradient(
            135deg,
            rgba(45,23,14,.96),
            rgba(16,11,8,.98)
        );
}

.from-table-hero-inner{
    width:min(900px,100%);
}

.from-table-kicker{
    margin:0 0 16px;

    color:var(--gold);

    font-family:Arial,sans-serif;
    font-size:.72rem;
    font-weight:800;
    letter-spacing:.20em;
    text-transform:uppercase;
}

.from-table-title{
    margin:0 0 24px;

    font-size:clamp(3.6rem,8vw,7rem);
    line-height:.9;
    letter-spacing:-.045em;
}

.from-table-title span{
    display:block;
    color:var(--gold);
}

.from-table-lead{
    max-width:760px;
    margin:0;

    color:var(--paper);
    font-size:1.15rem;
    line-height:1.8;
}

.from-table-section{
    padding:
        90px
        clamp(24px,7vw,110px)
        110px;
}

.from-table-heading{
    max-width:760px;
    margin:0 auto 46px;
    text-align:center;
}

.from-table-heading h2{
    margin-bottom:16px;
}

.from-table-heading p{
    margin:0;
    color:var(--paper);
    line-height:1.7;
}

.from-table-grid{
    width:min(1200px,100%);
    margin:0 auto;

    display:grid;
    grid-template-columns:
        repeat(3,minmax(0,1fr));
    gap:24px;
}

.from-table-card{
    position:relative;

    min-height:360px;
    padding:34px;

    display:flex;
    flex-direction:column;

    border:
        1px solid rgba(217,155,57,.30);

    background:
        linear-gradient(
            145deg,
            #2d170e,
            #170d09
        );

    box-shadow:
        0 18px 42px rgba(0,0,0,.24);

    transition:
        transform .2s ease,
        border-color .2s ease,
        box-shadow .2s ease;
}

.from-table-card:hover,
.from-table-card:focus-visible{
    transform:translateY(-5px);
    border-color:rgba(217,155,57,.68);
    box-shadow:
        0 26px 60px rgba(0,0,0,.36);
}

.from-table-card:focus-visible{
    outline:2px solid var(--gold);
    outline-offset:4px;
}

.from-table-number{
    position:absolute;
    top:22px;
    right:26px;

    color:rgba(217,155,57,.23);

    font-size:3rem;
    font-weight:800;
}

.from-table-type{
    margin:0 0 48px;

    color:var(--gold);

    font-family:Arial,sans-serif;
    font-size:.66rem;
    font-weight:800;
    letter-spacing:.16em;
    text-transform:uppercase;
}

.from-table-card h3{
    margin:0 0 18px;

    font-size:2.1rem;
    line-height:1.08;
}

.from-table-copy{
    margin:0 0 28px;

    color:var(--paper);
    line-height:1.7;
}

.from-table-action{
    margin-top:auto;

    color:var(--gold);

    font-family:Arial,sans-serif;
    font-size:.69rem;
    font-weight:800;
    letter-spacing:.12em;
    text-transform:uppercase;
}

.from-table-note{
    max-width:760px;
    margin:48px auto 0;

    color:rgba(217,194,155,.78);

    font-style:italic;
    line-height:1.7;
    text-align:center;
}

@media(max-width:900px){
    .from-table-grid{
        grid-template-columns:1fr;
        width:min(680px,100%);
    }

    .from-table-card{
        min-height:300px;
    }
}

@media(max-width:600px){
    .from-table-hero{
        min-height:420px;
        padding:
            145px
            24px
            65px;
    }

    .from-table-section{
        padding:
            65px
            20px
            80px;
    }

    .from-table-card{
        min-height:0;
        padding:30px 25px;
    }
}