/*
 * MCCAA brand layer for WordPress + Elementor.
 * Loaded site-wide AFTER the app CSS (uploads/mccaa-home/chunks/10j6npdwka187.css),
 * which provides the tokens used here: --color-maroon, --color-gold, --color-dark, --color-cream, ...
 * Everything here is scoped to WordPress/Elementor content so it never touches the
 * app header/footer markup (which is styled by the app CSS alone).
 *
 * Editor-pickable classes (Elementor > Advanced > CSS Classes):
 *   mccaa-bg-maroon, mccaa-bg-cream, mccaa-bg-pale-gold, mccaa-bg-gray, mccaa-bg-dark
 *   mccaa-box-maroon, mccaa-box-cream  (rounded coloured box inside a boxed section)
 *   mccaa-btn-gold, mccaa-btn-maroon, mccaa-btn-outline, mccaa-btn-arrow
 *   mccaa-label (small teal uppercase label), mccaa-on-dark (white text inside dark boxes)
 *   mccaa-card, mccaa-ks-card, mccaa-hub-card, mccaa-news-card
 */

/* ---------- WordPress essentials (previously from the Hello theme reset) ---------- */
.screen-reader-text{clip:rect(1px,1px,1px,1px);height:1px;overflow:hidden;position:absolute!important;width:1px;word-wrap:normal!important}
.screen-reader-text:focus{background-color:#eee;clip:auto!important;clip-path:none;color:#333;display:block;font-size:1rem;height:auto;left:5px;line-height:normal;padding:12px 20px;text-decoration:none;top:5px;width:auto;z-index:100000}
.alignright{float:right;margin-left:1rem}
.alignleft{float:left;margin-right:1rem}
.aligncenter{clear:both;display:block;margin-inline:auto}
.wp-caption{margin-block-end:1.25rem;max-width:100%}
.wp-caption img{display:block;margin-inline:auto}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--color-gold);outline-offset:2px}

/* ---------- Page layout (Hello theme container styles are switched off) ---------- */
.site-main{width:100%}
/* classic (non-Elementor) content is wrapped in .mccaa-classic by the mccaa-site MU plugin */
.mccaa-classic{max-width:1240px;margin:60px auto;padding:0 20px}

/* ---------- Automatic page banner (title + breadcrumb) ---------- */
.mccaa-page-banner{position:relative;overflow:hidden;background-color:var(--color-maroon);background-position:bottom right;background-repeat:no-repeat;background-size:348px auto;color:#fff;font-family:var(--font-sans)}
.mccaa-page-banner__decor{position:absolute;left:0;top:0;width:358px;max-width:70%;height:auto;pointer-events:none}
.mccaa-page-banner__inner{position:relative;max-width:1240px;min-height:314px;margin:0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;padding:30px 20px 60px;text-align:center}
.mccaa-page-banner__title{margin:0;font-size:34px;font-weight:700;line-height:1.1;color:#fff}
@media(min-width:768px){.mccaa-page-banner__title{font-size:50px}}
@media(min-width:1024px){.mccaa-page-banner__title{font-size:60px}}
.mccaa-breadcrumbs{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px;font-size:16px;line-height:1.5;color:var(--color-on-maroon)}
.mccaa-breadcrumbs a{color:#fff;text-decoration:none;transition:color .15s}
.mccaa-breadcrumbs a:hover{color:var(--color-gold)}
.mccaa-breadcrumbs svg{width:8px;height:12px;color:var(--color-gold)}
.mccaa-breadcrumbs [aria-current]{color:var(--color-gold)}
/* archive / search / 404 titles use the same banner look */
body:not(.page):not(.single) .page-header{background:var(--color-maroon);padding:60px 20px;text-align:center}
body:not(.page):not(.single) .page-header .entry-title{margin:0;color:#fff;font-size:clamp(34px,5vw,60px);font-weight:700;line-height:1.1}

/* ---------- Content typography (Text Editor widget + classic content) ---------- */
.mccaa-prose{font-size:16px;line-height:1.6;color:var(--color-body-text)}
:is(.elementor-widget-text-editor,.mccaa-prose) :is(h1,h2,h3,h4,h5,h6){color:var(--color-dark);font-weight:500;line-height:1.2;margin:0 0 20px}
:is(.elementor-widget-text-editor,.mccaa-prose) h1{font-size:40px}
:is(.elementor-widget-text-editor,.mccaa-prose) h2{font-size:28px}
:is(.elementor-widget-text-editor,.mccaa-prose) h3{font-size:22px}
:is(.elementor-widget-text-editor,.mccaa-prose) h4{font-size:20px}
:is(.elementor-widget-text-editor,.mccaa-prose) :is(h5,h6){font-size:18px}
@media(min-width:768px){:is(.elementor-widget-text-editor,.mccaa-prose) h2{font-size:32px}}
:is(.elementor-widget-text-editor,.mccaa-prose) * + :is(h1,h2,h3,h4,h5,h6){margin-top:30px}
:is(.elementor-widget-text-editor,.mccaa-prose) p{margin:0 0 .9rem}
:is(.elementor-widget-text-editor,.mccaa-prose) :is(ul,ol){margin:0 0 1rem;padding-left:1.5em}
:is(.elementor-widget-text-editor,.mccaa-prose) ul{list-style:disc}
:is(.elementor-widget-text-editor,.mccaa-prose) ol{list-style:decimal}
:is(.elementor-widget-text-editor,.mccaa-prose) li{margin-bottom:.4rem}
:is(.elementor-widget-text-editor,.mccaa-prose) li::marker{color:var(--color-gold)}
:is(.elementor-widget-text-editor,.mccaa-prose) a{color:var(--color-maroon);text-decoration:underline;text-underline-offset:2px;transition:color .15s}
:is(.elementor-widget-text-editor,.mccaa-prose) a:hover{color:var(--color-gold)}
:is(.elementor-widget-text-editor,.mccaa-prose) :is(b,strong){font-weight:600;color:var(--color-dark)}
:is(.elementor-widget-text-editor,.mccaa-prose) blockquote{margin:0 0 1rem;padding:15px 25px;border-left:4px solid var(--color-gold);background:var(--color-cream)}
:is(.elementor-widget-text-editor,.mccaa-prose) img{max-width:100%;height:auto}
:is(.elementor-widget-text-editor,.mccaa-prose) table{width:100%;border-collapse:collapse;margin:0 0 1rem;font-size:.95em}
:is(.elementor-widget-text-editor,.mccaa-prose) :is(td,th){border:1px solid var(--color-cream-border);padding:12px 15px;vertical-align:top;text-align:left}
:is(.elementor-widget-text-editor,.mccaa-prose) th{background:var(--color-cream);color:var(--color-dark);font-weight:600}
:is(.elementor-widget-text-editor,.mccaa-prose) > :last-child{margin-bottom:0}
.mccaa-on-dark,.mccaa-on-dark :is(h1,h2,h3,h4,h5,h6,p,li,strong,a,.elementor-heading-title),.mccaa-box-maroon .elementor-widget-text-editor :is(h1,h2,h3,h4,h5,h6,strong,a){color:#fff}

/* ---------- Elementor Heading widget default sizes (theme reset removed) ---------- */
.elementor-widget-heading h1.elementor-heading-title{font-size:clamp(34px,5vw,60px)}
.elementor-widget-heading h2.elementor-heading-title{font-size:clamp(32px,3.5vw,40px)}
.elementor-widget-heading h3.elementor-heading-title{font-size:24px}
.elementor-widget-heading h4.elementor-heading-title{font-size:20px}
.elementor-widget-heading h5.elementor-heading-title{font-size:18px}
.elementor-widget-heading h6.elementor-heading-title{font-size:16px}
.elementor-widget-heading p.elementor-heading-title{font-size:16px}

/* ---------- Buttons (Elementor Button widget) ---------- */
.elementor-widget-button .elementor-button{border-radius:var(--radius-pill);padding:15px 30px;font-family:var(--font-sans);font-size:16px;font-weight:400;line-height:1;transition:background-color .3s,color .3s,border-color .3s}
.elementor-widget-button .elementor-button:hover,.elementor-widget-button .elementor-button:focus{background-color:var(--color-gold-dark);color:#fff}
.elementor-element.mccaa-btn-gold .elementor-button{background-color:var(--color-gold);color:#fff}
.elementor-element.mccaa-btn-gold .elementor-button:hover{background-color:var(--color-gold-dark)}
.elementor-element.mccaa-btn-maroon .elementor-button{background-color:var(--color-maroon);color:#fff;font-size:14px}
.elementor-element.mccaa-btn-maroon .elementor-button:hover{background-color:var(--color-gold)}
.elementor-element.mccaa-btn-outline .elementor-button{background-color:transparent;color:var(--color-gold);border:1px solid var(--color-gold);border-radius:20px;padding:10px 20px;font-size:14px}
.elementor-element.mccaa-btn-outline .elementor-button:hover{background-color:var(--color-gold);color:#fff}
/* gold pill with a white round arrow (app "See All" / "File a Consumer Complaint" buttons) */
.elementor-element.mccaa-btn-arrow .elementor-button{background-color:var(--color-gold);color:#fff;font-size:20px;padding:5px 7px 5px 30px}
.elementor-element.mccaa-btn-arrow .elementor-button:hover{background-color:var(--color-gold-dark)}
.elementor-element.mccaa-btn-arrow .elementor-button-content-wrapper{display:flex;align-items:center;gap:27px}
.elementor-element.mccaa-btn-arrow .elementor-button-icon{display:flex;align-items:center;justify-content:center;width:33.5px;height:33.5px;border-radius:50%;background:#fff;color:#000;fill:#000;font-size:14px;margin:0}
.elementor-element.mccaa-btn-arrow .elementor-button-icon svg{width:14px;height:14px;fill:#000}

/* ---------- Section / box backgrounds ---------- */
.mccaa-bg-maroon{background-color:var(--color-maroon)}
.mccaa-bg-cream{background-color:var(--color-cream)}
.mccaa-bg-pale-gold{background-color:var(--color-pale-gold-bg)}
.mccaa-bg-gray{background-color:var(--color-lighter-gray)}
.mccaa-bg-dark{background-color:var(--color-dark)}
.elementor-section.mccaa-box-maroon > .elementor-container,.elementor-section.mccaa-box-cream > .elementor-container{border-radius:var(--radius-banner);overflow:hidden;position:relative}
.elementor-section.mccaa-box-maroon > .elementor-container{background-color:var(--color-maroon)}
.elementor-section.mccaa-box-cream > .elementor-container{background-color:var(--color-cream)}
.mccaa-box-maroon :is(.elementor-heading-title,.elementor-widget-text-editor,.elementor-widget-text-editor p){color:#fff}
.mccaa-box-maroon .elementor-widget-text-editor{color:var(--color-on-maroon)}
.mccaa-label .elementor-heading-title{color:var(--color-teal);font-size:16px;font-weight:500;text-transform:uppercase;line-height:1}

/* ---------- Cards ---------- */
.mccaa-card > .elementor-widget-wrap{background:#fff;border:1px solid var(--color-cream-border);border-radius:var(--radius-card);padding:30px}
/* Key Services card: bordered card, gold icon, maroon "More Info" pill that overlaps the bottom edge */
.mccaa-ks-card > .elementor-widget-wrap{border:1px solid #000;border-radius:var(--radius-card);background:#fff;min-height:278px;padding:15px 15px 35px;align-content:center;justify-content:center;transition:background-color .3s,border-color .3s;margin-bottom:28px}
.mccaa-ks-card:hover > .elementor-widget-wrap{background:var(--color-pale-gold);border-color:var(--color-pale-gold)}
.mccaa-ks-card .elementor-widget-image img{height:70px;width:auto}
.mccaa-ks-card .elementor-heading-title{font-size:20px;font-weight:600;line-height:1;color:var(--color-dark)}
.mccaa-ks-card .elementor-widget-button{position:absolute;left:0;right:0;bottom:-28px;text-align:center;margin:0!important}
.elementor-element.mccaa-ks-card .elementor-button{background:var(--color-maroon);color:#fff;padding:20px 30px}
.elementor-element.mccaa-ks-card:hover .elementor-button{background:var(--color-gold)}
.mccaa-ks-card > .elementor-widget-wrap{position:relative}
/* Hub cards in the hero */
.mccaa-hub-card > .elementor-widget-wrap{background:rgba(255,255,255,.9);border-radius:var(--radius-card);padding:15px 20px 30px;transition:background-color .5s}
.mccaa-hub-card:hover > .elementor-widget-wrap{background:#fff}
.mccaa-hub-card .elementor-icon-list-items{display:grid;grid-template-columns:1fr;gap:10px}
@media(min-width:640px){.mccaa-hub-card .elementor-icon-list-items{grid-template-columns:1fr 1fr}}
.mccaa-hub-card .elementor-icon-list-item{margin:0!important;padding:0!important}
.mccaa-hub-card .elementor-icon-list-item > a{display:flex;align-items:center;gap:20px;min-height:58px;padding:10px 15px;border:1px solid #fff;border-radius:5px;background:#fff;color:var(--color-body-text);font-size:14px;font-weight:500;transition:all .5s}
.mccaa-hub-card:hover .elementor-icon-list-item > a{background:var(--color-cream);border-color:var(--color-cream-border)}
.mccaa-hub-card .elementor-icon-list-item > a:hover{background:var(--color-gold);border-color:var(--color-gold);color:#fff}
.mccaa-hub-card .elementor-icon-list-icon svg{fill:var(--color-gold);width:22px;height:22px}
.mccaa-hub-card .elementor-icon-list-item > a:hover svg{fill:#fff}
/* News cards */
.mccaa-news-card .elementor-widget-image img{border-radius:var(--radius-card);width:100%;aspect-ratio:3/2;object-fit:cover}
.mccaa-news-card .mccaa-tag .elementor-heading-title{display:inline-block;background:var(--color-light-gray);border-radius:3px;padding:8px 10px;font-size:14px;font-weight:400;color:var(--color-dark)}
.mccaa-news-card h3.elementor-heading-title{font-size:20px;font-weight:500;line-height:2;border-bottom:1px solid rgba(51,54,60,.1);padding-bottom:15px}
.mccaa-news-card h3.elementor-heading-title a{color:var(--color-dark)}
.mccaa-news-card h3.elementor-heading-title a:hover{color:var(--color-maroon)}
.mccaa-news-card .elementor-widget-text-editor{font-size:14px;line-height:1.9;color:var(--color-input-text)}

/* ---------- Contact Form 7 in the brand look ---------- */
.wpcf7 label{display:block;font-size:14px;font-weight:500;color:var(--color-dark);margin-bottom:15px}
.wpcf7 :is(input[type=text],input[type=email],input[type=tel],input[type=url],textarea,select){display:block;width:100%;margin-top:6px;padding:12px 20px;border:0;border-radius:var(--radius-input);background:var(--color-light-gray);color:var(--color-input-text);font:inherit;font-size:16px}
.wpcf7 :is(input,textarea,select):focus{outline:none;box-shadow:0 0 0 2px var(--color-gold)}
.wpcf7 textarea{min-height:160px}
.wpcf7 input[type=submit]{background:var(--color-gold);color:#fff;border:0;border-radius:var(--radius-pill);padding:15px 40px;font:inherit;font-size:16px;cursor:pointer;transition:background-color .3s}
.wpcf7 input[type=submit]:hover{background:var(--color-gold-dark)}
