/* =====================================================================
   CHANGE, Inc. — base styles
   Recreates the existing site's Elementor look without Elementor.
   Sections: 1 tokens · 2 fonts · 3 reset/typography · 4 layout kit · 5 buttons
             6 header & nav · 7 inner-page banner · 8 widgets · 9 grant strip & footer · 10 utilities
   Breakpoints match the old site:  tablet ≤1024px,  mobile ≤767px.
   ===================================================================== */

/* 1 · tokens ------------------------------------------------------- */
:root {
	--c-primary: #06685f;   /* teal: headings */
	--c-accent: #e17141;    /* orange */
	--c-dark: #01221f;      /* deep green: header, buttons */
	--c-footer: #001312;
	--c-panel: #022e2c;     /* footer logo panel */
	--c-text: #000;
	--c-white: #fff;
	--f-head: "Playfair Display", serif;
	--f-body: "Inter", sans-serif;
	--f-open: "Open Sans", sans-serif;
	--shadow-card: 0 3px 15px rgba(0, 0, 0, 0.1);
	--w-container: 1170px;
	--hdr-h: 80px;
}

/* 2 · fonts (variable files: one file per style covers all weights) --- */
@font-face { font-family: "Playfair Display"; font-style: normal; font-weight: 400 900; font-display: swap; src: url("../fonts/playfair.woff2") format("woff2"); }
@font-face { font-family: "Playfair Display"; font-style: italic; font-weight: 400 900; font-display: swap; src: url("../fonts/playfair-italic.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 100 900; font-display: swap; src: url("../fonts/inter.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: italic; font-weight: 100 900; font-display: swap; src: url("../fonts/inter-italic.woff2") format("woff2"); }
@font-face { font-family: "Open Sans"; font-style: italic; font-weight: 300 400; font-display: swap; src: url("../fonts/opensans-italic.woff2") format("woff2"); }
@font-face { font-family: "Open Sans"; font-style: normal; font-weight: 300 800; font-display: swap; src: url("../fonts/opensans.woff2") format("woff2"); }

/* 3 · reset & typography ------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html { line-height: 1.15; -webkit-text-size-adjust: 100%; }
body {
	margin: 0; background: #fff; color: var(--c-text);
	font-family: var(--f-body); font-weight: 300; font-size: 16px; line-height: 1.5em;
	-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}
h1, h2, h3, h4, h5, h6 { margin: 0.5rem 0 1rem; }
p { margin: 0 0 0.9rem; }
img { border-style: none; height: auto; max-width: 100%; vertical-align: middle; }
a { background: transparent; color: var(--c-text); font-weight: 800; text-decoration: none; }
a:hover { color: var(--c-primary); }
ul, ol { margin: 0 0 1rem; padding: 0; }
button, input, select, textarea { font: inherit; margin: 0; }
b, strong { font-weight: 600; }
.screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip-link { position: absolute; left: -9999px; top: 0; z-index: 99999; background: #fff; color: #000; padding: 10px 16px; }
.skip-link:focus { left: 10px; top: 10px; }

h1 { color: var(--c-primary); font: 600 54px/1.2em var(--f-head); }
h2 { color: var(--c-primary); font: 600 32px/1.3em var(--f-head); }
h3 { color: var(--c-primary); font: 600 24px/1.2em var(--f-head); }
h4 { color: var(--c-primary); font: 600 18px/1.3em var(--f-head); }
h5 { color: var(--c-accent); font: 500 18px/1em var(--f-body); }
h6 { color: var(--c-primary); font: 600 16px/1.2em var(--f-head); }

@media (max-width: 1024px) {
	h1 { font-size: 54px; }
}
@media (max-width: 767px) {
	body { font-size: 14px; line-height: 1.5em; }
	h1 { font-size: 32px; line-height: 1.2em; }
	h2 { font-size: 24px; line-height: 1.3em; }
	h3 { font-size: 18px; line-height: 1.2em; }
	h4 { font-size: 16px; line-height: 1.3em; }
	h5 { font-size: 16px; line-height: 1em; }
}

/* 4 · layout kit (same spacing model as the old site) ---------------
   .sec > .cont > .col > .ww > widgets
   section → container (max 1170) → column (flex) → widget wrap (10px padding, 20px gap)  */
.sec { position: relative; }
.sec > .cont { display: flex; position: relative; max-width: var(--w-container); margin-inline: auto; }
.sec > .cont.cont--1140 { max-width: 1140px; }
.sec > .cont.cont--nogap { max-width: var(--w-container); }
.col { display: flex; position: relative; min-height: 1px; flex: 0 0 auto; }
.col > .ww { display: flex; flex-wrap: wrap; align-content: flex-start; width: 100%; position: relative; padding: 10px; }
.col > .ww > * { width: 100%; }
.col > .ww > :not(:last-child), .widget:not(:last-child) { margin-bottom: 20px; }
.w-100 { width: 100%; } .w-50 { width: 50%; } .w-33 { width: 33.333%; } .w-25 { width: 25%; } .w-66 { width: 66.666%; }
.valign-mid > .cont { align-items: center; }
.col--center > .ww { align-content: center; align-items: center; }
.txt-c { text-align: center; } .txt-l { text-align: left; } .txt-r { text-align: right; }

/* generic widgets -------------------------------------------------- */
.w-title { margin: 0; padding: 0; line-height: 1; }                 /* heading widget */
.w-text { font-weight: 300; line-height: 1.5em; }

@media (max-width: 767px) {
	.sec > .cont { flex-wrap: wrap; }
	.col { width: 100%; }
}
@media (min-width: 768px) and (max-width: 1024px) {
	.sec > .cont { flex-wrap: wrap; }
}

/* 5 · buttons ------------------------------------------------------- */
.btn {
	display: inline-block; padding: 20px 40px; border: 0; border-radius: 5px; cursor: pointer;
	background: var(--c-accent); color: #fff; fill: #fff;
	font: 600 14px/1em var(--f-body); letter-spacing: 1.3px; text-transform: uppercase; text-align: center;
	transition: all 0.3s;
}
.btn:hover, .btn:focus { background: var(--c-accent); color: #fff; }
.btn--white { background: #fff; color: var(--c-dark); }
.btn--white:hover { background: #fff; color: var(--c-dark); }
.btn--dark { background: var(--c-dark); color: #fff; }
.btn--dark:hover { background: var(--c-dark); color: #fff; }
.btn--sm { padding: 15px 30px; font-size: 12px; line-height: 12px; }
.btn--block { display: block; width: 100%; }
.btn__in { display: flex; justify-content: center; align-items: center; gap: 5px; }
.btn .ci-icon { width: 1em; height: 1em; fill: currentColor; }

/* 6 · header & nav --------------------------------------------------- */
.site-header {
	position: relative; z-index: 100; background: var(--c-dark);
	border: 0 solid var(--c-dark); border-width: 0 80px;
	margin-bottom: calc(var(--hdr-h) * -1);
	height: var(--hdr-h);
}
.site-header .hdr { display: flex; align-items: center; height: var(--hdr-h); position: relative; }
.hdr__logo { width: 8%; padding-left: 10px; background: var(--c-dark); display: flex; align-items: center; height: 100%; }
.hdr__logo a { display: block; width: 100%; font-weight: 800; }
.hdr__logo img { width: 66%; height: auto; display: inline-block; }
.hdr__nav { width: 73.117%; padding-right: 10px; display: flex; align-items: center; height: 100%; }
.hdr__nav-in { height: 100%; width: 111.254%; max-width: 111.254%; flex: 0 0 auto; position: relative; }
.hdr__cta { width: 18.523%; padding-left: 10px; display: flex; align-items: center; justify-content: flex-end; height: 100%; }
.hdr__cta .btn { padding: 15px 30px; font-size: 12px; line-height: 12px; }

.ci-nav { height: var(--hdr-h); }
.ci-nav .ci-nav-panel { height: 100%; }
.ci-nav .menu { display: flex; justify-content: center; list-style: none; margin: 0; padding: 0; height: 100%; }
.ci-nav .menu li { display: flex; position: relative; list-style: none; margin: 0; }
.ci-nav .menu > li > a {
	display: flex; align-items: center; padding: 0 18px;
	font: 600 12px/12px var(--f-body); letter-spacing: 1.3px; text-transform: uppercase; color: #fff;
	transition: color 0.3s;
}
.ci-nav .menu > li:hover > a, .ci-nav .menu > li.current-menu-item > a { color: var(--c-accent); }
.menu-chevron { display: inline-flex; margin-left: 10px; }
.menu-chevron .ci-icon { width: 13px; height: 12px; fill: currentColor; }
.ci-nav .sub-menu {
	position: absolute; top: 100%; left: 0; min-width: 220px; margin: 0; padding: 10px; list-style: none;
	background: var(--c-dark); box-shadow: var(--shadow-card);
	opacity: 0; visibility: hidden; transform: translateY(8px); transition: all 0.4s; z-index: 5;
}
.ci-nav li:hover > .sub-menu, .ci-nav li:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: none; }
.ci-nav .sub-menu li { display: flex; }
.ci-nav .sub-menu a { display: block; width: 100%; padding: 15px; font: 600 12px/12px var(--f-body); letter-spacing: 1.3px; text-transform: uppercase; color: #fff; transition: color 0.3s; }
.ci-nav .sub-menu li:hover > a, .ci-nav .sub-menu .current-menu-item > a { color: var(--c-accent); }

/* hamburger + off-canvas panel (tablet & below) */
.ci-burger { display: none; background: transparent; border: 0; padding: 18px 32px; width: 64px; height: 56px; line-height: 14px; color: var(--c-accent); cursor: pointer; font-weight: 600; }
.ci-burger .ci-icon { width: 20px; height: 20px; fill: var(--c-accent); }
.ci-nav-panel-head { display: none; }
.ci-nav-overlay { display: none; }

@media (max-width: 1024px) {
	.site-header { border-width: 0 20px; margin-bottom: -110px; padding: 10px 0 20px; z-index: 100; height: auto; }
	.site-header .hdr { height: auto; flex-wrap: wrap; }
	.hdr__logo { padding-left: 0; width: 30%; height: auto; }
	.hdr__nav { width: 70%; padding: 0; justify-content: flex-end; height: auto; }
	.hdr__nav-in { width: auto; max-width: none; }
	.hdr__cta { width: 30%; padding-left: 10px; height: auto; }
	.ci-nav { height: auto; }
	.ci-burger { display: block; float: right; }
	.ci-nav .ci-nav-panel {
		position: fixed; top: 0; left: -110%; width: 100%; max-width: 360px; height: 100%; overflow-y: auto;
		background: #f7f7f7; z-index: 1000; transition: left 0.4s; display: block; padding: 0;
	}
	.admin-bar .ci-nav .ci-nav-panel { top: 32px; }
	.ci-nav .ci-nav-panel.is-open { left: 0; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3); }
	.ci-nav-panel-head { display: block; padding: 10px 0; position: relative; z-index: 5; width: 100%; overflow: hidden; }
	.ci-nav-panel-head img { max-width: 240px; margin: 5px; padding: 5px; float: left; background: var(--c-dark); }
	.ci-nav-close { float: right; background: var(--c-accent); color: #fff; border: 0; padding: 10px; margin: 12px; width: 45px; cursor: pointer; }
	.ci-nav-close .ci-icon { width: 18px; height: 18px; fill: #fff; }
	.ci-nav .menu { display: block; height: auto; padding: 20px; }
	.ci-nav .menu li { display: block; width: 100%; position: relative; }
	.ci-nav .menu > li > a { display: block; padding: 15px 20px 15px 10px; color: #141414; }
	.ci-nav .menu > li:hover > a, .ci-nav .menu > li.current-menu-item > a { color: var(--c-accent); }
	.ci-nav .menu > li > a .menu-chevron { float: right; margin-left: auto; color: var(--c-accent); border: 1px solid #e1e1e1; border-radius: 3px; padding: 4px 15px; }
	.ci-nav .sub-menu { position: static; display: none; opacity: 1; visibility: visible; transform: none; box-shadow: none; background: none; padding: 0 10px 0 5px; }
	.ci-nav .sub-menu.dropdown-open { display: block; }
	.ci-nav li:hover > .sub-menu:not(.dropdown-open), .ci-nav li:focus-within > .sub-menu:not(.dropdown-open) { display: none; }
	.ci-nav .sub-menu a { color: #141414; }
	.ci-nav .sub-menu li:hover > a { color: var(--c-accent); }
	.ci-nav-overlay.is-open { display: block; position: fixed; inset: 0; background: rgba(0, 0, 0, 0.4); z-index: 999; }
}
@media (min-width: 768px) and (max-width: 1024px) {
	.hdr__logo { width: 30%; }
	.hdr__nav { width: 70%; }
	.hdr__cta { width: 30%; }
}
@media (max-width: 767px) {
	.site-header { margin-bottom: -100px; padding: 0 0 10px; }
	.hdr__logo { width: 50%; }
	.hdr__logo img { width: 34%; }
	.hdr__nav { width: 50%; }
	.hdr__cta { width: 100%; padding: 0; justify-content: flex-start; }
	.hdr__cta { padding-left: 10px; }
	.hdr__cta .btn { display: block; width: 100%; margin: 15px 0 10px; padding: 15px 30px; }
}

/* 7 · inner-page banner --------------------------------------------- */
.banner {
	position: relative; padding: 140px 0; background-color: var(--c-dark);
	background-size: cover; background-position: 0 18%;
	border: 80px solid var(--c-dark);
}
.banner__overlay { position: absolute; inset: 0; background: #000; opacity: 0.55; }
.banner > .cont { position: relative; max-width: 1140px; margin-inline: auto; display: flex; }
.banner .col { width: 100%; }
.banner .col > .ww { align-items: center; }
.banner__title { font: 600 55px/1.3em var(--f-head); color: #fff; margin: 0; padding: 0; text-align: center; }
.crumbs { text-align: center; }
.crumbs ul { display: flex; justify-content: center; list-style: none; margin: 0 -2.5px; padding: 0; }
.crumbs li { display: flex; align-items: center; justify-content: center; margin: 0 2.5px; color: #fff; }
.crumbs li a { color: #fff; font-weight: 300; }
.crumbs .ci-fa { width: 23px; height: 14px; padding-right: 5px; fill: var(--c-accent); }
.crumbs li > span, .crumbs li > a { padding-left: 5px; }
.crumbs li:first-child > a { padding-left: 0; }
.banner .btn { width: 100%; }

@media (max-width: 1024px) {
	.banner { padding: 100px 0; border-width: 90px 20px 20px; }
}
@media (max-width: 767px) {
	.banner { padding: 60px 0; border-width: 90px 20px 20px; background-position: 50% 50%; }
	.banner__title { font-size: 40px; }
}

/* 8 · shared widgets ------------------------------------------------- */
.ci-icon { display: inline-block; width: 1em; height: 1em; fill: currentColor; vertical-align: middle; }
.ci-fa { display: inline-block; width: 1em; height: 1em; fill: currentColor; vertical-align: middle; }

/* icon-box card (home services, health tiles, values…) */
.icon-box { display: flex; position: relative; align-items: flex-start; padding: 40px 40px 30px; background-color: #fff; box-shadow: var(--shadow-card); text-align: left; }
.icon-box__icon { position: relative; margin-right: 15px; line-height: 0; z-index: 2; }
.icon-box__badge { display: inline-block; padding: 15px; margin-right: 10px; background: var(--c-dark); color: var(--c-accent); border-radius: 50px; font-size: 30px; line-height: 30px; }
.icon-box__badge .ci-icon { width: 30px; height: 30px; fill: var(--c-accent); display: block; }
.icon-box__body { position: relative; z-index: 2; }
.icon-box__title { margin: 0 0 10px; font: 600 20px/1.2em var(--f-head); color: var(--c-primary); }
.icon-box__text { margin: 0 0 14.4px; }
.icon-box__btn { display: inline-block; white-space: nowrap; position: relative; padding: 15px 30px; background: var(--c-dark); color: #fff; font: 800 15px/15px var(--f-body); border-radius: 5px; text-align: center; transition: all 0.3s; }
.icon-box__btn:hover { background: var(--c-accent); color: #fff; }
a.icon-box-link { display: block; color: inherit; font-weight: inherit; }

/* contact-style info block used on Home / Contact (Offices, Medical Care) */
.info-h { font: 600 18px/1.3em var(--f-head); color: var(--c-primary); margin: 0 0 20px; }

/* 9 · grant strip & footer ------------------------------------------- */
.grant { position: relative; padding: 50px 0; background-size: cover; background-position: center; }
.grant__veil { position: absolute; inset: 0; background: #fff; opacity: 0.94; }
.grant > .cont { position: relative; max-width: 1140px; margin-inline: auto; display: flex; }
.grant__side { width: 190px; flex: 0 0 auto; }
.grant__text { width: 760px; padding: 10px; font: 300 17px/1.5 var(--f-open); text-align: center; color: #000; align-self: center; }
.grant__text i { font-style: italic; }
.grant__text p { margin: 0 0 14.4px; }

.site-footer { position: relative; background: var(--c-footer); margin-top: 50px; padding: 0 0 20px; color: #fff; }
.site-footer::before { content: ""; position: absolute; inset: 0; background-image: url("../img/bg/pattern.png"); opacity: 0.02; pointer-events: none; }
.site-footer > .cont { position: relative; max-width: 1170px; margin-inline: auto; }
.ftr { display: flex; padding: 0 10px; }
.ftr__brand { width: 26.812%; position: relative; }
.ftr__brand-in { margin-top: -50px; padding: 50px 40px; background: var(--c-panel); display: flex; flex-direction: column; align-items: flex-start; }
.ftr__brand img { width: 75%; margin-bottom: 20px; }
.ftr__brand p { padding-right: 20px; margin-bottom: 20px; color: #fff; font-size: 16px; line-height: 1.5em; }
.ftr__list { list-style: none; margin: 0; padding: 0; }
.ftr__list li { display: flex; align-items: center; }
.ftr__list li a, .ftr__list li span { display: flex; align-items: center; color: #fff; font-weight: 300; }
.ftr__list .ci-fa { fill: var(--c-accent); }
.ftr__brand .ftr__list li { padding-bottom: 5px; }
.ftr__brand .ftr__list li:not(:first-child) { margin-top: 5px; }
.ftr__brand .ftr__list li:last-child { padding-bottom: 0; }
.ftr__brand .ftr__list .ci-fa { width: 16px; height: 16px; margin-right: 9px; flex: none; }
.ftr__brand .ftr__list li > span:last-child, .ftr__brand .ftr__list a { padding-left: 5px; }
.ftr__col { padding-top: 80px; }
.ftr__col--pages { width: 25.819%; padding-left: 80px; }
.ftr__col--quick { width: 17.28%; }
.ftr__col--links { width: 30.089%; margin-left: 30px; width: calc(30.089% - 30px); }
.ftr__h { margin: 0 0 20px; font: 600 18px/1.3em var(--f-head); color: #fff; }
.ftr__col .ftr__list li { padding-bottom: 7.5px; margin-top: 7.5px; }
.ftr__col .ftr__list li:first-child { margin-top: 0; }
.ftr__col .ftr__list li:last-child { padding-bottom: 0; }
.ftr__col .ftr__list a { font-weight: 300; }
.ftr__col .ftr__list a:hover { color: var(--c-accent); }
.ftr__col .ftr__list .ci-fa { width: 14px; height: 14px; margin-right: 5px; fill: var(--c-accent); flex: none; }
.ftr__col .ftr__list a span { padding-left: 5px; }
.ftr__col--links .btn { display: block; padding: 20px 40px; background: #fff; color: #000; margin-bottom: 20px; }
.ftr__news { margin: 10px 0 20px; padding-right: 20px; color: #fff; }
.ftr__social { display: inline-flex; width: 38px; height: 38px; align-items: center; justify-content: center; border-radius: 50%; background: var(--c-accent); }
.ftr__social .ci-icon { width: 16px; height: 16px; fill: #fff; }
.ftr__social:hover { background: #fff; }
.ftr__social:hover .ci-icon { fill: var(--c-accent); }
.ftr__rule { margin: 60px 0 0; border: 0; padding: 2px 0; text-align: center; }
.ftr__rule::before { content: ""; display: block; width: 98%; margin: 0 auto; border-top: 1px solid rgba(160, 170, 186, 0.17); }
.ftr__bar { display: flex; padding: 0 10px; margin-top: 20px; color: #fff; font-size: 14px; line-height: 21px; }
.ftr__bar > div { width: 50%; padding: 10px 0; }
.ftr__bar > div:last-child { text-align: end; }
.ftr__bar p { margin: 0 0 14.4px; }
.site-footer .ftr__bar a, .site-footer .ftr__bar a:hover { color: #fff !important; font-weight: 800; text-decoration: underline; }
.ftr__mcg { text-align: center; padding: 0 10px; margin-top: 5px; }
.ftr__mcg img { width: 32px; height: auto; opacity: 0.9; }

@media (max-width: 1024px) {
	.grant { padding: 60px 30px; }
	.grant__side { display: none; }
	.grant__text { width: 100%; }
	.site-footer { padding: 40px 10px 20px; }
	.ftr { flex-wrap: wrap; }
	.ftr__brand { width: 50%; }
	.ftr__brand-in { margin-top: -80px; }
	.ftr__col--pages { padding: 40px 0 0 120px; width: 50%; }
	.ftr__col--quick { margin: 20px 0 0; padding: 60px 0 0; width: 50%; }
	.ftr__col--links { margin: 20px 0 0; padding: 60px 0 0; width: 50%; }
}
@media (max-width: 767px) {
	.grant { padding: 40px 10px; }
	.site-footer { margin-top: 40px; padding: 0 10px 20px; }
	.ftr__brand-in { margin-top: -40px; }
	.ftr__brand p { padding: 0; }
	.ftr__brand { width: 100%; }
	.ftr__col--pages, .ftr__col--quick, .ftr__col--links { width: 100%; padding: 0; margin: 20px 0 0; }
	.ftr__col--pages { margin-top: 30px; }
	.ftr__rule { margin-top: 40px; }
	.ftr__bar { flex-wrap: wrap; text-align: center; }
	.ftr__bar > div { width: 100%; text-align: center !important; }
	.ftr__mcg img { width: 9%; }
}

/* 10 · utilities & forms base --------------------------------------- */
.alignwide { max-width: 1170px; margin-inline: auto; }
.entry-content > * { max-width: 1170px; margin-inline: auto; }
.page-default { padding: 100px 20px; max-width: 1170px; margin: 0 auto; }
.field, .ci-form input[type="text"], .ci-form input[type="email"], .ci-form input[type="tel"], .ci-form select, .ci-form textarea {
	width: 100%; border: 1px solid #e1e1e1; border-radius: 5px; padding: 10px; background: #fff; color: #333; font: 400 14px/1.4em var(--f-body);
}
.ci-form label { display: block; color: var(--c-primary); font: 600 16px/2.6em var(--f-head); }
.ci-hp { position: absolute; left: -9999px; }