/* =========================================================
   FLINSTONES 2.0
   PODSTRONA: KOSZTY DOSTAWY
   Mobile first
   ========================================================= */


.delivery-page {
    padding-bottom: 36px;
}


/* ---------------------------------------------------------
   NAGŁÓWEK
   --------------------------------------------------------- */

.delivery-intro {
    padding:
        36px
        20px
        28px;

    text-align: center;
}


.delivery-intro h1 {
    margin: 0;

    color: var(--color-gold);

    font-family:
        "Comic Sans MS",
        "Trebuchet MS",
        sans-serif;

    font-size:
        clamp(2.4rem, 11vw, 4.2rem);

    line-height: 1.05;

    text-shadow:
        0 3px 0 #5f2717,
        0 6px 14px rgba(0, 0, 0, 0.35);
}


.delivery-intro__text {
    max-width: 580px;

    margin:
        18px auto
        0;

    color: var(--color-text-muted);

    font-size: 1rem;
    line-height: 1.55;
}


/* ---------------------------------------------------------
   ZAWADZKIE - WYRÓŻNIENIE
   --------------------------------------------------------- */

.delivery-highlight {
    margin:
        0
        16px
        38px;

    padding:
        24px
        22px;

    text-align: center;

    background:
        linear-gradient(
            145deg,
            #74431f,
            #4b2917
        );

    border:
        2px solid rgba(255, 213, 74, 0.42);

    border-radius:
        26px 18px
        28px 17px;

    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 10px 22px rgba(0, 0, 0, 0.27);
}


.delivery-highlight > div {
    display: flex;

    align-items: center;
    justify-content: center;

    gap: 22px;
}


.delivery-highlight__label {
    color: var(--color-text);

    font-family:
        "Comic Sans MS",
        "Trebuchet MS",
        sans-serif;

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


.delivery-highlight__price {
    color: var(--color-gold);

    font-size: 1.7rem;
}


.delivery-highlight p {
    margin:
        16px
        0
        0;

    color: var(--color-text-muted);

    font-size: 0.95rem;
    line-height: 1.45;    
}


.delivery-highlight p strong {
    color: var(--color-gold);
}

/* ---------------------------------------------------------
   SEKCJE
   --------------------------------------------------------- */

.delivery-section {
    padding:
        0
        16px
        38px;
}


.delivery-section__header {
    margin-bottom: 18px;

    text-align: center;
}


.delivery-section__header h2 {
    margin:
        5px
        0
        0;

    color: var(--color-gold);

    font-family:
        "Comic Sans MS",
        "Trebuchet MS",
        sans-serif;

    font-size: 1.8rem;
}

.delivery-section__header h2 {
    margin:
        5px
        0
        0;

    color: var(--color-gold);

    font-family:
        "Comic Sans MS",
        "Trebuchet MS",
        sans-serif;

    font-size: 1.8rem;
}

/* ---------------------------------------------------------
   KAMIENNA TABELA
   --------------------------------------------------------- */

.delivery-card {
    overflow: hidden;

    background:
        linear-gradient(
            145deg,
            #b38b58,
            #91663e 58%,
            #744c2d
        );

    border:
        2px solid rgba(65, 34, 18, 0.82);

    border-radius:
        28px 18px
        30px 16px;

    box-shadow:
        inset 0 2px 0 rgba(255, 255, 255, 0.16),
        inset 0 -6px 11px rgba(55, 28, 14, 0.2),
        0 9px 20px rgba(0, 0, 0, 0.28);
}


.delivery-row {
    display: flex;

    align-items: center;
    justify-content: space-between;

    gap: 20px;

    min-height: 66px;

    padding:
        13px
        20px;

    border-bottom:
        1px solid rgba(69, 35, 17, 0.2);
}


.delivery-row:last-child {
    border-bottom: 0;
}


.delivery-row span {
    color: #3c1e10;

    font-size: 1.05rem;
    font-weight: 700;
}


.delivery-row strong {
    flex: 0 0 auto;

    min-width: 74px;

    padding:
        8px
        10px;

    text-align: center;

    color: var(--color-gold);

    background:
        rgba(47, 24, 12, 0.78);

    border-radius:
        11px 8px
        12px 8px;

    font-size: 1.05rem;
}


/* ---------------------------------------------------------
   INFORMACJA O MINIMUM
   --------------------------------------------------------- */

.delivery-note {
    margin:
        16px
        4px
        0;

    padding:
        15px
        16px;

    text-align: center;

    color: var(--color-text-muted);

    background:
        rgba(61, 33, 19, 0.7);

    border:
        1px solid rgba(255, 213, 74, 0.2);

    border-radius:
        14px;
}


.delivery-note strong {
    color: var(--color-gold);
}

/* =========================================================
   TABLET
   ========================================================= */

@media (min-width: 600px) {

    .delivery-intro {
        padding:
            46px
            36px
            32px;
    }


    .delivery-highlight,
    .delivery-section {
        max-width: 720px;

        margin-left: auto;
        margin-right: auto;
    }      

}


/* =========================================================
   DESKTOP
   ========================================================= */

@media (min-width: 900px) {

    .delivery-page {
        padding-bottom: 55px;
    }


    .delivery-intro {
        padding:
            52px
            40px
            36px;
    }


    .delivery-highlight {
        max-width: 720px;

        margin-bottom: 46px;
    }


    .delivery-section {
        max-width: 820px;

        padding-bottom: 46px;
    }


    .delivery-row {
        min-height: 62px;

        padding:
            12px
            28px;
    }        

}