:root {
    --white: #fff;
    --black: #5f4f45;
    --brand: #bc5b1c;
    --brand-beige: #e6e3dc;
    --brand-white: #f6f6f4;
    --brand-hover: #964815;
    --brand-beige-hover: #bbb8b2;
    --brand-white-hover: #cfcfcf;

    --screen-size: 1512;
    --size: 100vw / var(--screen-size);

    --gap: calc(40 * var(--size));
    --grid-gap: calc(16 * var(--size));

    --font-family: "Sailec";
    --font-title-family: "HW Cigars";

    /* 18 / 25 */
    --font-size-body: 1rem;
    --line-height-body: 1.33rem;

    /* 28/28 */
    --font-size-1: 1.55rem;
    --line-height-1: 1.85rem;

    /* 56/56 */
    --font-size-2: 3.11rem;
    --line-height-2: 3.11rem;

    /* 80 / 80 */
    --font-size-3: 4.44rem;
    --line-height-3: 4.44rem;

    /* 44/44 */
    --font-size-4: 2.44rem;
    --line-height-4: 2.88rem;
}

/* RESPONSIVE */
@media only screen and (max-width: 768px) {
    :root {
        --screen-size: 375;

        --gap: calc(16 * var(--size));

        --font-size-1: 1.5rem;
        --line-height-1: 1.64rem;

        --font-size-2: 1.85rem;
        --line-height-2: 2.14rem;

        --font-size-3: 2.71rem;
        --line-height-3: 2.71rem;

        --font-size-4: 1.5rem;
        --line-height-4: 1.85rem;
    }
}