/* ==========================================
   BODY
========================================== */

body{

    font-family:var(--font-main);

    font-size:var(--font-size-base);

    line-height:var(--line-height);

    color:var(--color-text);

    font-weight:400;

}

/* ==========================================
   HEADINGS
========================================== */

h1,
h2,
h3,
h4,
h5,
h6{

    font-family:var(--font-heading);

    color:var(--color-text);

    line-height:var(--line-height-heading);

    font-weight:700;

    letter-spacing:-0.02em;

}

h1{

    font-size:clamp(
        2.4rem,
        5vw,
        3.25rem
    );

    margin-bottom:28px;

}

h2{

    font-size:clamp(
        2rem,
        4vw,
        3rem
    );

    margin-bottom:24px;

}

h3{

    font-size:1.45rem;

    margin-bottom:16px;

}

h4{

    font-size:1.2rem;

    margin-bottom:14px;

}

/* ==========================================
   PARAGRAPHS
========================================== */

p{

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

    margin-bottom:18px;

    max-width:70ch;

}

p:last-child{

    margin-bottom:0;

}

/* ==========================================
   LINKS
========================================== */

a{

    transition:

        color

        var(--transition);

}

a:hover{

    color:var(--color-primary);

}

a.button{
	color:var(--color-white);
}

a.more{
		color:var(--color-primary);
}

/* ==========================================
   LISTS
========================================== */

ul li{

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

}

/* ==========================================
   SECTION HEADER
========================================== */

.section-header span{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:

        8px

        18px;

    border-radius:

        var(--radius-round);

    background:

        var(--color-primary-light);

    color:

        var(--color-primary);

    font-size:

        .9rem;

    font-weight:600;

    letter-spacing:.04em;

    text-transform:uppercase;

}

.section-header h2{

    margin-top:22px;

}

.section-header p{

    margin-inline:auto;

    font-size:1.1rem;

}

/* ==========================================
   HERO
========================================== */

.hero__label{

    display:inline-flex;

    align-items:center;

    gap:10px;

    padding:

        10px

        18px;

    border-radius:

        var(--radius-round);

    background:

        rgba(37,99,235,.10);

    color:

        var(--color-primary);

    font-size:.95rem;

    font-weight:600;

    margin-bottom:28px;

}

.hero__description{

    font-size:1.18rem;

    line-height:1.9;

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

}

.hero-feature{

    font-size:1rem;

    font-weight:500;

}

/* ==========================================
   LOGO
========================================== */

.logo__title{

    font-size:1.2rem;

    font-weight:700;

    letter-spacing:-0.02em;

}

.logo__subtitle{

    font-size:.82rem;

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

}

/* ==========================================
   STATISTICS
========================================== */

.stat-card__number{

    display:block;

    font-size:3rem;

    font-weight:800;

    color:var(--color-primary);

    margin-bottom:12px;

}

.stat-card p{

    text-align:center;

    font-size:1rem;

}

/* ==========================================
   FORMAT CARDS
========================================== */

.format-card__price{

    font-size:2.5rem;

    font-weight:800;

    color:var(--color-primary);

}

.format-card__header span{

    display:block;

    margin-top:8px;

    font-weight: 800;
	
	color:var(--color-text-muted);

}

.format-card li{

    line-height:1.8;

}

/* ==========================================
   ADVANTAGES
========================================== */

.advantage h3{

    margin-top:20px;

}

.advantage p{

    font-size:.98rem;

}

/* ==========================================
   TIMELINE
========================================== */

.timeline__number{

    font-size:1.4rem;

    font-weight:700;

    color:white;

}

.timeline__content h3{

    margin-bottom:10px;

}

/* ==========================================
   RESULTS
========================================== */

.result-card__number{

    display:block;

    font-size:3rem;

    font-weight:800;

    color:var(--color-primary);

    margin-bottom:10px;

}

.results__note strong{

    display:block;

    margin-bottom:14px;

    color:var(--color-primary);

}

/* ==========================================
   REVIEWS
========================================== */

.review-card__author{

    margin-top:18px;

    font-weight:600;

    color:var(--color-text);

}

/* ==========================================
   PRICE
========================================== */

.price-card__value{

    font-size:3rem;

    font-weight:800;

    color:var(--color-primary);

}

.price-card__header span{
	font-weight:800;
    color:var(--color-text-muted);

}

/* ==========================================
   FAQ
========================================== */

summary{

    font-size:1.05rem;

    font-weight:600;

    color:var(--color-text);

}

details p{

    margin-top:18px;

}

/* ==========================================
   CONTACTS
========================================== */

.contacts__list{

    line-height:2;

}

.contacts__list li{

    color:var(--color-text);

}

/* ==========================================
   FOOTER
========================================== */

.footer{

    font-size:.95rem;

}

.footer h3{

    color:white;

}

.footer p{

    color:

        rgba(255,255,255,.75);

}

.footer a{

    color:

        rgba(255,255,255,.85);

}

.footer a:hover{

    color:white;

}