.elementor-50380 .elementor-element.elementor-element-c2b0b1b{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;}.elementor-50380 .elementor-element.elementor-element-c364adb{width:100%;max-width:100%;}.elementor-50380 .elementor-element.elementor-element-d4b6e94{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;}.elementor-50380 .elementor-element.elementor-element-5073381{width:100%;max-width:100%;}:root{--page-title-display:none;}/* Start custom CSS for html, class: .elementor-element-c364adb *//* Endorsements Hero Section */
.endorsements-hero {
    position: relative;
    /* PASTE YOUR BACKGROUND IMAGE URL BELOW */
    background-image: url('YOUR_BACKGROUND_IMAGE.jpg');
    background-size: cover;
    background-position: center;
    padding: 140px 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    border-bottom: 5px solid var(--red, #E02020);
}

.endorsements-hero .header-overlay {
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    /* Deep navy gradient for readability */
    background: linear-gradient(to bottom, rgba(0, 33, 71, 0.85), rgba(0, 33, 71, 0.95));
    z-index: 1;
}

.hero-content-centered {
    position: relative;
    z-index: 2;
    max-width: 850px;
    margin: 0 auto;
}

.eyebrow-gold {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    font-size: 16px;
    color: #C09A5B; /* Campaign Gold */
    text-transform: uppercase;
    letter-spacing: 3px;
    display: block;
    margin-bottom: 15px;
}

.endorsements-hero .page-title {
    font-family: 'Montserrat', sans-serif;
    font-weight: 900;
    font-size: 56px;
    color: var(--white, #ffffff);
    margin: 0 0 20px 0;
    letter-spacing: 1px;
}

.endorsements-hero .hero-subtitle {
    font-size: 22px;
    font-weight: 500;
    color: #D1D9E6; /* Soft blue/gray */
    line-height: 1.5;
    margin: 0;
}

/* Mobile Responsiveness */
@media (max-width: 768px) {
    .endorsements-hero { padding: 100px 20px; }
    .endorsements-hero .page-title { font-size: 40px; }
    .endorsements-hero .hero-subtitle { font-size: 18px; }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-5073381 *//* Endorsements Tier Sections */
.endorsement-tier-section {
    padding: 80px 20px;
}
.bg-gray { background-color: #F8F5F0; border-top: 1px solid #EAEAEA; border-bottom: 1px solid #EAEAEA;}
.bg-white { background-color: var(--white, #ffffff); }

.tier-headline {
    font-family: 'Montserrat', sans-serif;
    font-weight: 900;
    font-size: 36px;
    color: var(--navy, #002147);
    text-align: center;
    margin: 0 0 15px 0;
    text-transform: uppercase;
}

/* Centered Dividers */
.red-divider-center, .navy-divider-center, .gold-divider-center {
    width: 60px;
    height: 4px;
    margin: 0 auto 40px auto;
}
.red-divider-center { background-color: var(--red, #E02020); }
.navy-divider-center { background-color: var(--navy, #002147); }
.gold-divider-center { background-color: #C09A5B; }

/* Organizations Grid */
.org-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    max-width: 1000px;
    margin: 0 auto;
}

.org-card {
    background: var(--white, #ffffff);
    padding: 30px;
    border-radius: 8px;
    text-align: center;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
}

/* Endorsement Quote Placeholder Styles */
.endorsement-quote {
    font-family: 'Georgia', serif; /* Serif font makes it feel like a formal quote */
    font-size: 15px !important;
    font-style: italic;
    color: #555555 !important;
    line-height: 1.6;
    margin-top: 15px !important;
    padding-top: 15px;
    border-top: 1px solid #EAEAEA;
    position: relative;
}

/* Optional: Adds a tiny stylized quote mark accent */
.endorsement-quote::before {
    content: '“';
    font-family: 'Georgia', serif;
    font-size: 30px;
    color: #C09A5B; /* Campaign Gold */
    position: absolute;
    top: 5px;
    left: 50%;
    transform: translateX(-50%);
    opacity: 0.3;
}

.logo-placeholder {
    width: 100%;
    height: 120px;
    background-color: #EAEAEA;
    border: 2px dashed #cccccc;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
    color: #888888;
    font-weight: 600;
}

/* This controls the actual logo images once you insert them */
/* Updated Logo Sizing - Forces more breathing room */
.logo-placeholder img {
    max-width: 75%;  /* Prevents wide logos from stretching edge-to-edge */
    max-height: 75px; /* Prevents tall/square logos from hitting the top/bottom */
    width: auto;
    height: auto;
    object-fit: contain;
}

/* Optional: Once you have real logos in there, you might want to remove the gray background and dashed border from the placeholders. You can update your existing rule to look like this: */
.logo-placeholder {
    width: 100%;
    height: 120px;
    background-color: transparent; /* Changed from gray to transparent */
    border: none; /* Removes the dashed placeholder line */
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
}

/* When you add real images, use this rule: .logo-placeholder img { max-width: 100%; max-height: 100px; } */

.org-card h3 {
    font-family: 'Montserrat', sans-serif;
    font-size: 18px;
    font-weight: 800;
    color: var(--navy, #002147);
    margin: 0;
}

/* Elected Officials Grid */
.officials-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    max-width: 1100px;
    margin: 0 auto;
}

.official-card {
    text-align: center;
    padding: 20px;
}

/* Update your existing placeholder rule to include overflow: hidden */
.headshot-placeholder {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background-color: #EAEAEA;
    border: 3px solid var(--navy, #002147);
    margin: 0 auto 15px auto;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #888888;
    font-weight: 600;
    overflow: hidden; /* ADD THIS LINE: It clips the square edges off the photo to make it a circle */
}

/* ADD THIS NEW RULE right beneath it */
.headshot-placeholder img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* THIS IS THE MAGIC: It zooms and crops the photo perfectly to fit the circle without stretching! */
    object-position: center top; /* Keeps the focus on their face, not their torso */
}

.official-card h3 {
    font-family: 'Montserrat', sans-serif;
    font-size: 18px;
    font-weight: 800;
    color: var(--red, #E02020);
    margin: 0 0 5px 0;
}

.official-card p {
    font-size: 14px;
    color: #444444;
    margin: 0;
    font-weight: 600;
}

/* Community List Grid */
.community-list-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 40px;
    max-width: 900px;
    margin: 0 auto 30px auto;
}

.endorsement-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.endorsement-list li {
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 1px solid #EAEAEA;
}

.endorsement-list li:last-child {
    border-bottom: none;
}

.endorsement-list strong {
    font-size: 18px;
    color: var(--navy, #002147);
}

.endorsement-list span {
    font-size: 14px;
    color: #666666;
    font-style: italic;
}

.disclaimer-text {
    text-align: center;
    font-size: 12px;
    color: #888888;
    margin-top: 40px;
}

/* Endorsement CTA Section */
.endorsement-cta-section {
    background-color: var(--navy, #002147);
    padding: 80px 20px;
    text-align: center;
    color: var(--white, #ffffff);
}

.cta-container {
    max-width: 700px;
    margin: 0 auto;
}

.cta-container h2 {
    font-family: 'Montserrat', sans-serif;
    font-weight: 900;
    font-size: 38px;
    margin: 0 0 20px 0;
}

.cta-container p {
    font-size: 18px;
    line-height: 1.6;
    margin-bottom: 30px;
    color: #D1D9E6;
}

.btn-solid-gold {
    display: inline-block;
    background-color: #C09A5B;
    color: var(--white, #ffffff);
    padding: 15px 35px;
    font-family: 'Montserrat', sans-serif;
    font-weight: 800;
    text-transform: uppercase;
    text-decoration: none;
    border-radius: 4px;
    letter-spacing: 1px;
    transition: background-color 0.3s ease;
}

.btn-solid-gold:hover {
    background-color: #a8854c;
    color: var(--white, #ffffff);
}

/* Mobile Responsiveness */
@media (max-width: 768px) {
    .tier-headline { font-size: 28px; }
    .org-grid, .officials-grid { grid-template-columns: 1fr; gap: 20px; }
    .community-list-grid { grid-template-columns: 1fr; gap: 0; }
    .cta-container h2 { font-size: 30px; }
}/* End custom CSS */