/* ================================================ ECHOTHERM THEME SYSTEM "Forest Green" theme — matches new logo palette. Applied when ================================================ */ /* ── Global fixes (applies to all themes) ────────── */ /* .nav a specificity (0,1,1) beats .btn (0,1,0) — force white on nav CTA */ .nav a.btn { color: #fff; } /* ── Logo size ──────────────────────────────────── */ .nav .brand img.logo { height: 152px !important; width: auto; } header.scrolled .nav .brand img.logo, .scrolled .nav .brand img.logo { height: 124px !important; } /* Keep the header logo crisp while the bar shrinks on scroll — snap the size (no transform layer, no animated scaling) so it never blurs during the transition. */ .nav .brand img.logo { transform: none !important; transition: none !important; will-change: auto !important; image-rendering: auto; } .nav .brand:hover img.logo { transform: none !important; } /* Footer logo: larger + transparent so the green mark reads on the white footer */ footer img, footer img.foot-logo { height: 116px !important; background: transparent !important; padding: 0 !important; border-radius: 0 !important; } html[data-theme="green"] { --navy: #1B5E3C; --navy-2: #27794E; --red: #CC0000; --red-dark: #A00000; --cream: #F5FAF7; --paper: #FFFFFF; --ink: #1A1A1A; --grey: #4A6358; --line: #D0E6DA; --gold: #27AE60; } /* Cards, panels, and functional areas stay white */ html[data-theme="green"] .compare, html[data-theme="green"] .photo-item, html[data-theme="green"] .spec, html[data-theme="green"] .contact-card, html[data-theme="green"] .value-card, html[data-theme="green"] .reinforce .item, html[data-theme="green"] .ind-card, html[data-theme="green"] .fw-step, html[data-theme="green"] .custom-caps { background: #ffffff; } html[data-theme="green"] .ind-card { border-color: #D0E6DA; } html[data-theme="green"] .spec { border-left-color: #27AE60; } /* History photo: use neutral dark overlay instead of green-tinted navy */ html[data-theme="green"] .process-strip figcaption { background: linear-gradient(transparent, rgba(0,0,0,.75)); } /* ── White footer (replaces the dark/green block) ── */ html[data-theme="green"] footer { background: #ffffff; color: var(--grey); border-top: 1px solid var(--line); } html[data-theme="green"] footer h4 { color: var(--navy); } html[data-theme="green"] footer a { color: var(--grey); } html[data-theme="green"] footer a:hover { color: var(--navy); } html[data-theme="green"] .foot-bottom { border-top: 1px solid var(--line); color: var(--grey); } html[data-theme="green"] .foot-bottom a { color: var(--grey); } html[data-theme="green"] .foot-bottom a:hover { color: var(--navy); } html[data-theme="green"] .foot-cred { color: var(--grey); } html[data-theme="green"] .foot-cred a { color: var(--navy); } html[data-theme="green"] .flag { color: var(--navy); } html[data-theme="green"] .flag .r { color: #CC0000; } html[data-theme="green"] .flag .b { color: #1f6feb; } /* ── Centered footer (all text + logo) ──────────── */ html[data-theme="green"] footer { text-align: center; } html[data-theme="green"] footer .foot-grid { justify-items: center; } html[data-theme="green"] footer .foot-grid > div { display: flex; flex-direction: column; align-items: center; } html[data-theme="green"] footer img { margin-left: auto !important; margin-right: auto !important; display: block; } html[data-theme="green"] footer .foot-grid p { margin-left: auto; margin-right: auto; } html[data-theme="green"] footer .foot-nap { text-align: center; } html[data-theme="green"] footer .foot-bottom { justify-content: center; text-align: center; } html[data-theme="green"] footer .foot-legal { justify-content: center; } /* ── Nav "Industries" toggle: match the green nav links ── */ .nav .drop-toggle { color: var(--navy); font-weight: 600; font-size: 14px; } /* ── Mobile menu: Industries collapsed by default, expands on tap ── */ @media (max-width: 760px) { .nav li.has-drop .dropdown { max-height: 0 !important; overflow: hidden !important; padding-top: 0 !important; padding-bottom: 0 !important; transition: max-height .28s ease !important; } .nav li.has-drop.open .dropdown { max-height: 560px !important; padding-top: 4px !important; padding-bottom: 10px !important; } .nav .drop-toggle .caret { display: inline-block !important; } .nav li.has-drop.open .drop-toggle .caret { transform: rotate(225deg); } }