/* ==========================================================================
   03-typography.css — Steele Dermatology typography rules
   Enqueued via functions.php (after 02-base-uncode.css).
   ========================================================================== */

/* Heading weight — Figma design uses Lora Regular (400) for all headlines */
h3, .h3 {
	font-weight: 400 !important;
}

.text-lead, 
.text-lead:not(ul):not(ol) > * {
	line-height: 1.50;
}

.uncode_text_column,
.uncode_text_column p,
.text-lead,
.text-lead:not(ul):not(ol) > *,
.post-content p {
	color: var(--aqua-text-primary);
}

/* Dark sections — inverse text (overrides baseline above) */
.style-dark .uncode_text_column,
.style-dark .uncode_text_column :is(p, h1, h2, h3, h4, h5, h6, li, span, strong, a:not(.btn)),
.style-light .style-dark .uncode_text_column,
.style-light .style-dark .uncode_text_column :is(p, h1, h2, h3, h4, h5, h6, li, span, strong, a:not(.btn)),
.style-dark .text-lead,
.style-dark .text-lead:not(ul):not(ol) > *,
.style-light .style-dark .text-lead,
.style-light .style-dark .text-lead:not(ul):not(ol) > * {
	color: var(--aqua-text-inverse);
}

.vc_custom_heading_wrap.has-eyebrow {
	margin-top: 8px !important;
}

/* =======================================
   Figma Typography Overrides
   ======================================= */

h3.font-201532.h3,
.font-201532.h3 {
	font-size: 32px !important;
	line-height: 40px !important;
	font-weight: 400 !important;
	color: var(--aqua-text-primary) !important;
	letter-spacing: 0 !important;
}

@media (max-width: 959px) {
	h3.font-201532.h3,
	.font-201532.h3 {
		font-size: 24px !important;
		line-height: 32px !important;
	}
}

/* ===================================
   UNCODE TYPOGRAPHY OVERRIDES (Figma Scale)
   =================================== */

/* Display 01 */
h1.h1, h2.h1, h3.h1, h4.h1, h5.h1, h6.h1, .h1 {
    font-family: 'Poppins', sans-serif !important;
    font-size: 80px !important;
    font-weight: 400 !important;
    line-height: 88px !important;
    letter-spacing: -2px !important;
}

/* Display 02 */
h1.h2, h2.h2, h3.h2, h4.h2, h5.h2, h6.h2, .h2 {
    font-family: 'Poppins', sans-serif !important;
    font-size: 74px !important;
    font-weight: 300 !important;
    line-height: 78px !important;
    letter-spacing: -1.75px !important;
}

/* Headline 01 */
h1.h3, h2.h3, h3.h3, h4.h3, h5.h3, h6.h3, .h3 {
    font-family: 'Poppins', sans-serif !important;
    font-size: 40px !important;
    font-weight: 400 !important;
    line-height: 48px !important;
    letter-spacing: 0px !important;
}

/* Headline 02 */
h1.h4, h2.h4, h3.h4, h4.h4, h5.h4, h6.h4, .h4 {
    font-family: 'Poppins', sans-serif !important;
    font-size: 32px !important;
    font-weight: 400 !important;
    line-height: 40px !important;
    letter-spacing: 0px !important;
}

/* Headline 03 */
h1.h5, h2.h5, h3.h5, h4.h5, h5.h5, h6.h5, .h5 {
    font-family: 'Poppins', sans-serif !important;
    font-size: 24px !important;
    font-weight: 400 !important;
    line-height: 32px !important;
    letter-spacing: 0px !important;
}

/* Headline 04 */
h1.h6, h2.h6, h3.h6, h4.h6, h5.h6, h6.h6, .h6 {
    font-family: 'Poppins', sans-serif !important;
    font-size: 20px !important;
    font-weight: 400 !important;
    line-height: 28px !important;
    letter-spacing: 0px !important;
}

/* ===================================
   RESPONSIVE TYPOGRAPHY OVERRIDES
   =================================== */

@media (max-width: 959px) {
    h1.h1, h2.h1, h3.h1, h4.h1, h5.h1, h6.h1, .h1 {
        font-size: 44px !important;
        line-height: 52px !important;
        letter-spacing: -1px !important;
    }
    h1.h2, h2.h2, h3.h2, h4.h2, h5.h2, h6.h2, .h2 {
        font-size: 36px !important;
        line-height: 44px !important;
        letter-spacing: -0.5px !important;
    }
    h1.h3, h2.h3, h3.h3, h4.h3, h5.h3, h6.h3, .h3 {
        font-size: 28px !important;
        line-height: 36px !important;
    }
}

@media (max-width: 767px) {
    h1.h1, h2.h1, h3.h1, h4.h1, h5.h1, h6.h1, .h1 {
        font-size: 36px !important;
        line-height: 42px !important;
        letter-spacing: -0.5px !important;
    }
    h1.h2, h2.h2, h3.h2, h4.h2, h5.h2, h6.h2, .h2 {
        font-size: 32px !important;
        line-height: 38px !important;
        letter-spacing: -0.5px !important;
    }
    h1.h3, h2.h3, h3.h3, h4.h3, h5.h3, h6.h3, .h3 {
        font-size: 24px !important;
        line-height: 32px !important;
    }
    h1.h4, h2.h4, h3.h4, h4.h4, h5.h4, h6.h4, .h4 {
        font-size: 22px !important;
        line-height: 30px !important;
    }
    h1.h5, h2.h5, h3.h5, h4.h5, h5.h5, h6.h5, .h5 {
        font-size: 18px !important;
        line-height: 26px !important;
    }
}

/* ===================================
   SINGLE-PROVIDER TYPOGRAPHY
   =================================== */

body.single-provider h1.h2 {
    margin: 0 0 16px !important;
    font-family: "Poppins", sans-serif !important;
    font-size: clamp(48px, 5.75vw, 72px) !important;
    line-height: clamp(56px, 6vw, 80px) !important;
    font-weight: 400 !important;
    letter-spacing: -1px !important;
    color: var(--aqua-text-accent) !important;
}

body.single-provider .provider-cert h2 {
    margin: 0 0 24px !important;
    font-family: "Poppins", sans-serif !important;
    font-size: 24px !important;
    line-height: 32px !important;
    font-weight: 400 !important;
    color: var(--aqua-text-inverse) !important;
}

body.single-provider .provider-specialties strong {
    margin-bottom: 12px;
    font-family: "Open Sans", sans-serif;
    font-size: 14px;
    line-height: 24px;
    font-weight: 500;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.86);
}

body.single-provider .provider-body h3,
body.single-provider .nextpatient-sidebar.provider h3 {
    margin: 0 0 24px !important;
    font-family: "Poppins", sans-serif !important;
    font-size: 32px !important;
    line-height: 40px !important;
    font-weight: 400 !important;
    color: var(--aqua-text-primary) !important;
}

body.single-provider .provider-body p,
body.single-provider .provider-body li,
body.single-provider .provider-body .wpb_wrapper {
    font-family: "Open Sans", sans-serif;
    color: var(--aqua-text-primary);
}

/* Provider single page — name sizing (hero row override) */
body.single-provider #row-unique-1 h1.h2 {
    margin: 0 0 16px !important;
    font-family: "Poppins", sans-serif !important;
    font-size: clamp(48px, 5.75vw, 67px) !important;
    line-height: clamp(56px, 6vw, 77px) !important;
    font-weight: 400 !important;
    letter-spacing: -1px !important;
    color: var(--aqua-text-accent) !important;
}
.aqua-provider-subhead {
    margin-top: 8px !important;
}

@media (max-width: 959px) {
    .single-provider h1.h2 {
        font-size: 32px !important;
        line-height: 40px !important;
    }
}
@media (max-width: 599px) {
    .single-provider h1.h2 {
        font-size: 28px !important;
        line-height: 36px !important;
    }
}
