/* EWC EXISTING HOMEPAGE — BRANDING-ONLY CSS UPDATE Purpose: retain the current homepage sections, copy, images, and layout; update colors and button styling to align with the EWC funnel. Add this to the cloned GHL page's Custom CSS area, not as replacement HTML. */ :root { --ewc-black: #050505; --ewc-emerald: #063D2E; --ewc-emerald-deep: #071C17; --ewc-gold: #D4AF55; --ewc-gold-light: #F4D982; --ewc-mint: #75E6B3; --ewc-ivory: #FFF8E8; --ewc-body: #E8E5DE; } /* Base canvas: color-only changes; do not replace existing background images. */ html, body, .hl_page-preview, .hl_page-creator--content { background-color: var(--ewc-black) !important; color: var(--ewc-body); } /* Preserve the page's existing font choices and sizing; update text colors only. */ .hl_page-preview h1, .hl_page-preview h2, .hl_page-preview h3, .hl_page-preview h4, .hl_page-preview h5, .hl_page-preview h6, .hl_page-creator--content h1, .hl_page-creator--content h2, .hl_page-creator--content h3, .hl_page-creator--content h4, .hl_page-creator--content h5, .hl_page-creator--content h6 { color: var(--ewc-gold) !important; } .hl_page-preview p, .hl_page-preview li, .hl_page-preview label, .hl_page-preview small, .hl_page-creator--content p, .hl_page-creator--content li, .hl_page-creator--content label, .hl_page-creator--content small { color: var(--ewc-body); } /* Navigation and ordinary links. */ .hl_page-preview a, .hl_page-creator--content a { color: var(--ewc-gold); } .hl_page-preview a:hover, .hl_page-creator--content a:hover { color: var(--ewc-mint); } /* Section backgrounds: keep background-image declarations intact so the existing skyline, car, gold-light effect, and team imagery remain visible. */ .hl_page-preview section, .hl_page-creator--content section, .hl_page-preview .c-section, .hl_page-creator--content .c-section { background-color: var(--ewc-black); } /* Use emerald as the secondary surface color where elements already have a background color. This targets common GHL containers/cards, not their geometry. */ .hl_page-preview .c-column, .hl_page-preview .c-row, .hl_page-preview .card, .hl_page-creator--content .c-column, .hl_page-creator--content .c-row, .hl_page-creator--content .card { border-color: rgba(212, 175, 85, 0.45); } /* Existing service cards and image/text panels: subtle gold/emerald outlines. */ .hl_page-preview .c-card, .hl_page-preview [class*="service"], .hl_page-creator--content .c-card, .hl_page-creator--content [class*="service"] { border-color: rgba(212, 175, 85, 0.45); } /* Buttons: preserve their current dimensions, placement, and links. */ .hl_page-preview a.button, .hl_page-preview button, .hl_page-preview .btn, .hl_page-preview [class*="button"], .hl_page-creator--content a.button, .hl_page-creator--content button, .hl_page-creator--content .btn, .hl_page-creator--content [class*="button"] { border-color: var(--ewc-gold) !important; } /* Gold-filled CTA buttons. */ .hl_page-preview .btn-primary, .hl_page-preview a.button-primary, .hl_page-preview button[type="submit"], .hl_page-creator--content .btn-primary, .hl_page-creator--content a.button-primary, .hl_page-creator--content button[type="submit"] { background-color: var(--ewc-gold) !important; color: var(--ewc-black) !important; } /* Existing outlined/dark buttons remain dark with gold text and border. */ .hl_page-preview .btn-secondary, .hl_page-preview a.button-secondary, .hl_page-creator--content .btn-secondary, .hl_page-creator--content a.button-secondary { background-color: var(--ewc-black) !important; color: var(--ewc-gold-light) !important; border-color: var(--ewc-gold) !important; } /* Form fields: retain functionality while aligning field surfaces to the palette. */ .hl_page-preview input, .hl_page-preview select, .hl_page-preview textarea, .hl_page-creator--content input, .hl_page-creator--content select, .hl_page-creator--content textarea { background-color: #101714; color: var(--ewc-ivory); border-color: rgba(212, 175, 85, 0.55); } .hl_page-preview input::placeholder, .hl_page-preview textarea::placeholder, .hl_page-creator--content input::placeholder, .hl_page-creator--content textarea::placeholder { color: #BEB8A9; } /* Footer: convert the existing deep-teal surface to the funnel's dark emerald. Existing footer columns, logo, and links remain in place. */ .hl_page-preview footer, .hl_page-creator--content footer, .hl_page-preview [class*="footer"], .hl_page-creator--content [class*="footer"] { background-color: var(--ewc-emerald-deep); } /* Mobile safety: do not impose new columns, spacing, or dimensions. */ @media (max-width: 767px) { .hl_page-preview, .hl_page-creator--content { overflow-wrap: anywhere; } }