/* ECO Cubes — "Catalogue Brand" style. Loaded after style-catalogue.css
   (ECO_STYLE_PARENT). Colours taken from the client's logo: slate navy
   #2c475a as the ink (text, rules, dark surfaces) and leaf green #6c9b2a as
   the accent.
   The leaf green is only 3.3:1 on white and 2.95:1 on navy, so it is used for
   large type, rules and marks only. Small green text uses --leaf-dark
   (5.1:1 on white); green on navy uses --leaf-light (5.7:1). Buttons are navy. */

:root {
    --ink: #2c475a;
    --ink-2: #44525c;
    --ink-3: #6e7880;
    --red: #6c9b2a;
    --leaf-dark: #4d7a1a;
    --leaf-light: #a6d46a;
    --navy-deep: #1d3140;
    --forest-deep: #2c475a;
    --forest-tint: #e9f2dc;
}

/* Logo image (white background → multiply so it sits on the header tint) */
.site-logo { display: inline-flex; align-items: center; }
.site-logo .logo-img { display: block; height: 58px; width: auto; mix-blend-mode: multiply; }
@media (max-width: 720px) { .site-logo .logo-img { height: 44px; } }

/* Small green text → the darker leaf */
a:hover, .text-link:hover, .site-nav a.active, .cabin-card:hover .price,
.compare td:last-child strong, .section-head::before { color: var(--leaf-dark); }

/* Buttons: navy, hover to dark leaf (white text stays ≥ 4.5:1) */
.btn-primary, .hero .btn-light { background: var(--ink); color: #fff; }
.btn-primary:hover, .hero .btn-light:hover,
.btn-light:hover, .btn-ghost:hover { background: var(--leaf-dark); color: #fff; }

/* Green on navy surfaces → light leaf */
.section-dark h2 em, .section-dark .features .k, .chip.active small,
.site-footer h4 { color: var(--leaf-light); }
.section-dark { color: #c5d0d8; }
.topbar { color: #c5d0d8; }

/* CTA band: navy with a leaf rule, instead of a full green fill (white or navy
   text on the leaf green both fall under 3.5:1) */
.cta-band { background: var(--ink); border-top: 6px solid var(--red); }
.cta-band .eyebrow::before { background: var(--red); }
.cta-band h2 em { color: var(--leaf-light); }
.cta-band .btn-light { background: #fff; color: var(--ink); }
.cta-band .btn-light:hover { background: var(--red); color: var(--navy-deep); }

/* Footer one step deeper than the CTA band so the two don't merge */
.site-footer { background: var(--navy-deep); }
.logo-light { --logo-ink: #fff; --logo-acc: var(--leaf-light); }
.logo-light .logo-word { color: var(--leaf-light); }
.logo-light .logo-word em { color: #fff; }

@media (max-width: 720px) {
    .mobile-bar a.go { background: var(--leaf-dark); border-color: var(--leaf-dark); }
}

/* Certificates row */
.certs { border-top: 2px solid #fff; }
.cert-code { color: var(--leaf-light); }
.cert p { color: #c5d0d8; }
