/* 06-footer-layout.css — Footer, counters, insurance grid, layout utilities */

/* ==========================================================================
   FOOTER CONTENT BLOCK (#colophon) — global WPB rows, every page
   --------------------------------------------------------------------------
   Uncode renders the site footer as a Content Block (not per-page body rows).
   Two reusable row el_classes live here:

     .a-new-day  — “A New Day for Your Skin” CTA (vyce buttons)
     .aqua-row   — Proud Member / Aqua Dermatology band

   Do not scope to body.home or #row-unique-N — row order shifts per template.
   ========================================================================== */

#colophon .vc_row.a-new-day .heading-text :is(h1, h2, h3, h4, h5, h6).h2,
#colophon .vc_row.a-new-day .heading-text .h2 {
	color: var(--sd-light-blue) !important;
	text-align: center;
}

#colophon .vc_row.a-new-day .btn.btn-circle {
	height: 56px !important;
	min-height: 56px !important;
	padding: 0 24px !important;
	border-radius: 28px !important;
	font-size: 18px !important;
	line-height: 54px !important;
	font-weight: 600 !important;
}

/* Solid Light — Default */
#colophon .vc_row.a-new-day .btn.btn-color-vyce.btn-flat {
	background-color: var(--sd-yellow) !important;
	background-image: none !important;
	border-color: var(--sd-yellow) !important;
	color: var(--sd-blue-gray) !important;
}

/* Solid Light — Hover/Focus: yellow + 10% red overlay (Figma spec) */
#colophon .vc_row.a-new-day .btn.btn-color-vyce.btn-flat:hover,
#colophon .vc_row.a-new-day .btn.btn-color-vyce.btn-flat:focus {
	background-color: var(--sd-yellow) !important;
	background-image: linear-gradient(rgba(255, 0, 0, 0.10), rgba(255, 0, 0, 0.10)) !important;
	border-color: var(--sd-yellow) !important;
	color: var(--sd-blue-gray) !important;
}

/* Solid Light — Pressed: yellow + 20% red overlay */
#colophon .vc_row.a-new-day .btn.btn-color-vyce.btn-flat:active {
	background-color: var(--sd-yellow) !important;
	background-image: linear-gradient(rgba(255, 0, 0, 0.20), rgba(255, 0, 0, 0.20)) !important;
	border-color: var(--sd-yellow) !important;
	color: var(--sd-blue-gray) !important;
}

/* Outline Light — Default */
#colophon .vc_row.a-new-day .btn.btn-color-vyce.btn-outline {
	background-color: transparent !important;
	background-image: none !important;
	border: 1px solid var(--sd-yellow) !important;
	color: var(--sd-yellow) !important;
}

/* Outline Light — Hover/Focus: yellow border/text → white (#FCFAF7) per
   Figma "Style=Secondary, Color=Light, State=Hover, Type=Outline" */
#colophon .vc_row.a-new-day .btn.btn-color-vyce.btn-outline:hover,
#colophon .vc_row.a-new-day .btn.btn-color-vyce.btn-outline:focus {
	background-color: transparent !important;
	background-image: none !important;
	border-color: var(--sd-white) !important;
	color: var(--sd-white) !important;
}

/* Outline Light — Pressed: same as hover (white border/text) */
#colophon .vc_row.a-new-day .btn.btn-color-vyce.btn-outline:active {
	background-color: transparent !important;
	background-image: none !important;
	border-color: var(--sd-white) !important;
	color: var(--sd-white) !important;
}

.aqua img {
	filter: brightness(0) invert(1);
}

@media (max-width: 767px) {
	#colophon .vc_row.a-new-day .heading-text :is(h1, h2, h3, h4, h5, h6).h2,
	#colophon .vc_row.a-new-day .heading-text .h2 {
		font-size: 36px !important;
		line-height: 42px !important;
	}

	#colophon .vc_row.a-new-day .btn.btn-circle {
		height: 48px !important;
		min-height: 48px !important;
		padding: 0 18px !important;
		font-size: 16px !important;
		line-height: 46px !important;
	}
}

/* ==========================================================================
   FOOTER — MAIN (.footer-cont)
   ========================================================================== */

.footer-cont {
	padding-top: 80px!important;
	padding-bottom: 80px!important;
}

.footer-cont .foot-logo a span {
	width: 100%!important;
}

.footer-cont .foot-logo a span img {
	width: auto;
	max-width: 100%;
	max-height: 64px;
}

.footer-cont .menu {
	display: flex;
	flex-wrap: wrap;
	padding: 0;
	margin: 0 0 -24px 0;
}

.footer-cont .menu li {
	width: 100%;
	padding: 0;
	margin: 0 0 24px 0;
}

.footer-cont .menu li:before {
	display: none;
}

.footer-cont .menu li a {
	font-weight: 600;
	font-size: 18px;
	color: #ffffff;
	line-height: 26px;
	text-decoration: none;
	display: inline-block;
	min-height: 44px;
	padding: 9px 0;
}

.footer-cont .menu li a:hover,
.footer-cont .menu li a:focus,
.footer-cont .menu li a:active,
.footer-cont .menu li.current-menu-item > a, 
.footer-cont .menu li.current-menu-parent > a, 
.footer-cont .menu li.current-menu-ancestor > a {
	color: #ffffff;
	text-decoration: underline;	
}

.footer-cont p {
	font-size: 16px;
	color: #ffffff;
	line-height: 24px;
	margin-top: 24px;
}

.footer-cont > div > div > div:nth-child(1) {
	width: 43%!important;
}

.footer-cont > div > div > div:nth-child(2) {
	width: 57%!important;
}

.footer-cont > div > div > div:nth-child(2) .row-child > div > div {
	width: 23.50%!important;
}

.footer-cont > div > div > div:nth-child(2) .row-child > div > div:last-child {
	width: 29.50%!important;
}

.footer-cont > div > div > div:nth-child(2) .row-child > div > div:last-child .menu li a {
	font-weight: 400;
}

.footer-cont > div > div > div:nth-child(2) .row-child > div > div:last-child .uncode_text_column {
	margin-top: 0px!important;
	padding-top: 24px;
}

/* ==========================================================================
   FOOTER — BOTTOM BAR (.footer-btm)
   ========================================================================== */

.footer-btm > div > div > div .uncont {
	display: flex;
	flex-wrap: wrap; 
	align-items: center;
	justify-content: center;
	margin: 0 -20px -40px -20px!important;
}

.footer-btm > div > div > div .uncont > div {
	padding: 0 20px 40px 20px!important;
	margin: 0!important;
}

.footer-btm > div > div > div .uncode-single-media {
	width: 100%;
	max-width: 223px; 	 
}

.footer-btm > div > div > div .uncode-single-media span {
	width: 100%!important;
}

.footer-btm > div > div > div .uncode-single-media img { 
	width: 100%; 
	max-width: 183px;
}

.footer-btm > div > div > div .uncode_text_column {
	width: 100%;
	max-width: 415px; 
	font-weight: 600;
	font-size: 16px;
	line-height: 24px; 
}

/* ==========================================================================
   FOOTER — RESPONSIVE
   ========================================================================== */

@media (max-width: 1199px) {
.footer-cont {
	padding-top: 54px!important;
	padding-bottom: 54px!important;
}
}

@media (max-width: 1099px) {
.footer-cont > div > div {
	display: flex!important;
	flex-wrap: wrap!important;
}

.footer-cont > div > div > div:nth-child(1) {
	width: 100%!important;
	padding-top: 0!important;
	padding-bottom: 0!important;
	margin-bottom: 60px!important;
}

.footer-cont > div > div > div:nth-child(2) {
	width: 100%!important;
	padding-top: 0!important;
	padding-bottom: 0!important;
}
}

@media (max-width: 959px) {
.footer-cont > div > div > div:nth-child(2) .row-child > div {
	display: flex!important;
	flex-wrap: wrap!important;
	margin-bottom: -50px!important;
}

.footer-cont > div > div > div:nth-child(2) .row-child > div > div {
	padding-top: 0!important;
	padding-bottom: 0!important;
	margin-bottom: 50px!important;
}
}

@media (max-width: 767px) {
.footer-cont {
	padding-top: 24px!important;
	padding-bottom: 24px!important;
}

.footer-cont .foot-logo a span img {
	max-height: 48px;
}

.footer-cont .menu {
	margin: 0 0 -18px 0;
}

.footer-cont .menu li {
	margin: 0 0 18px 0;
}

.footer-cont .menu li a {
	font-size: 16px;
	line-height: 24px;
}

.footer-cont p {
	font-size: 16px;
	line-height: 24px;
	margin-top: 18px;
}

.footer-cont > div > div > div:nth-child(1) {
	margin-bottom: 50px!important;
}

.footer-cont > div > div > div:nth-child(2) .row-child > div {
	margin-bottom: -40px!important;
}

.footer-cont > div > div > div:nth-child(2) .row-child > div > div {
	width: 50%!important;
	margin-bottom: 40px!important;
}

.footer-cont > div > div > div:nth-child(2) .row-child > div > div:last-child {
	width: 50%!important;
}

.footer-cont > div > div > div:nth-child(2) .row-child > div > div:last-child .uncode_text_column {
	padding-top: 18px;
}

.footer-btm > div > div > div .uncont {
	margin: 0 -15px -30px -15px!important;
}

.footer-btm > div > div > div .uncont > div {
	padding: 0 15px 30px 15px!important;
}

.footer-btm > div > div > div .uncode-single-media span {
	text-align: center;
}

.footer-btm > div > div > div .uncode-single-media img { 
	max-width: 150px;
	display: inline-block;
}

.footer-btm > div > div > div .uncode_text_column {
	font-size: 14px;
	line-height: 22px;
	text-align: center; 
}
}

/* ==========================================================================
   COUNTERS & LAYOUT
   ========================================================================== */

@media only screen and (max-width:959px) {
    .counters__row .row-inner {
        display: flex;
    }
    .counters__block {
        width: 50%;
    }    
}

@media only screen and (max-width:640px) {
    .counters__row .row-inner {
        display: flex;
        flex-direction: column;
    }
    
    .counters__block {
        width: 100%;
    }
    
    .counters__block .uncell {
        padding: 24px !important;
    }
    
    .counters__block--third .uncell {
        border-bottom: 1px solid #dddddd ;
    }
}

/* ==========================================================================
   INSURANCE & FINANCIAL
   ========================================================================== */

.insurance-financial-post-grid .t-inside {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.insurance-financial-post-grid .t-inside .half-block-padding {
    padding: 30px 16px;
}

/* — Patient Resources card grid — */
.resource-grid .tmb {
    border-radius: 24px !important;
}

.resource-grid .t-inside {
    background: transparent !important;
    border: 1px solid var(--sd-border-dark) !important;
    border-radius: 24px !important;
}

.resource-grid .tmb-content-center .t-entry-text-tc {
    text-align: left;
}

.resource-grid .t-entry-title.h4 {
    font-size: 24px !important;
    line-height: 32px;
}

/* ==========================================================================
   UTILITY CLASSES
   ========================================================================== */

.training-title {
    display: block;
}