/* ==========================================================
   PET WELLNESS 360
   Typography System
   ========================================================== */

body{

    font-family:var(--pw-font-body);

    font-size:16px;

    font-weight:400;

    line-height:1.7;

    color:var(--pw-text);

    background:var(--pw-background);

}


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

    margin:0;

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

    font-weight:700;

    line-height:1.2;

    color:var(--pw-black);

}


h1{

    font-size:clamp(2.8rem,5vw,4.8rem);

}


h2{

    font-size:clamp(2.2rem,4vw,3.4rem);

}


h3{

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

}


h4{

    font-size:1.4rem;

}


h5{

    font-size:1.2rem;

}


h6{

    font-size:1rem;

}


p{

    margin-bottom:1rem;

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

}


a{

    transition:var(--pw-transition);

}


/* ==========================================================
   Legacy Hero Typography
   ========================================================== */

.hero__badge{

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

    font-size:.85rem;

    font-weight:600;

    letter-spacing:2px;

    text-transform:uppercase;

}


.hero__title{

    margin:1rem 0 2rem;

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

    font-weight:800;

}


.hero__description{

    font-size:1.1rem;

    max-width:650px;

}


/* ==========================================================
   Section Title
   ========================================================== */

.section-title{

    margin-bottom:4rem;

}


.section-title__subtitle{

    display:inline-block;

    margin-bottom:1rem;

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

    font-size:.9rem;

    font-weight:600;

    letter-spacing:2px;

    text-transform:uppercase;

    color:var(--pw-green);

}


.section-title__title{

    margin-bottom:1.5rem;

}


.section-title__description{

    max-width:760px;

    margin:auto;

    font-size:1.05rem;

}


/* ==========================================================
   Cards
   ========================================================== */

.pw-card__title,
.feature-card__title{

    margin-bottom:1rem;

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

    font-size:1.45rem;

}


.pw-card__text,
.feature-card__description{

    font-size:1rem;

}


/* ==========================================================
   Utilities
   ========================================================== */

.text-primary{

    color:var(--pw-blue);

}


.text-secondary{

    color:var(--pw-green);

}


.text-white{

    color:var(--pw-white);

}


.text-muted{

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

}


.fw-light{

    font-weight:300;

}


.fw-normal{

    font-weight:400;

}


.fw-medium{

    font-weight:500;

}


.fw-semibold{

    font-weight:600;

}


.fw-bold{

    font-weight:700;

}


.fw-extra{

    font-weight:800;

}


.text-uppercase{

    text-transform:uppercase;

}


.text-center{

    text-align:center;

}

/* ==========================================================
   CURRENT HOME SECTION TYPOGRAPHY
   ========================================================== */

.section{
    padding:var(--section-space) 0;
}

.section__subtitle{
    display:inline-block;
    margin-bottom:1rem;
    font-family:var(--pw-font-heading);
    font-size:.82rem;
    font-weight:700;
    letter-spacing:.12em;
    text-transform:uppercase;
    color:var(--pw-green);
}

.section__title{
    margin-bottom:1.5rem;
    font-family:var(--pw-font-heading);
    font-size:clamp(2rem,4vw,3rem);
    font-weight:700;
    line-height:1.2;
    color:var(--pw-navy);
}

.section__text{
    max-width:850px;
    margin-inline:auto;
    font-size:1rem;
}

@media (max-width:767px){

    .section{
        padding:var(--section-space-mobile) 0;
    }

}
