/* LOADMATE H1 extraction v2 — from inline <style> in page-resources.php */

/* ============================ TOKENS (self-sufficient) ===================== */
body.lm-template-resources-hub {
    --eot-blue:      #000000;
    --eot-blue-dark: #000000;
    --eot-navy:      #000000;
    --eot-yellow:    #ffb600;
    --eot-ybtn:      #ffb600;
    --eot-ybtn2:     #ffb600;
    --eot-ink:       #000000;
    --eot-slate:     #000000;
    --eot-line:      #f1f1f1;
    --eot-pale:      #f1f1f1;
    --eot-pale2:     #f1f1f1;
    --eot-white:     #ffffff;
    --eot-font:      'Poppins', system-ui, -apple-system, 'Segoe UI', sans-serif;
}

/* ============================ FULL-WIDTH BREAKOUT ========================== */
body.lm-template-resources-hub .ast-container,
body.lm-template-resources-hub .site-content > .ast-container,
body.lm-template-resources-hub #content > .ast-container,
body.lm-template-resources-hub #primary,
body.lm-template-resources-hub .ast-row,
body.lm-template-resources-hub .entry-content,
body.lm-template-resources-hub .site-content,
body.lm-template-resources-hub #content {
    display: block !important; width: 100% !important; max-width: 100% !important;
    margin-left: 0 !important; margin-right: 0 !important;
    padding-left: 0 !important; padding-right: 0 !important;
}
body.lm-template-resources-hub #secondary,
body.lm-template-resources-hub .ast-sidebar { display: none !important; }
body.lm-template-resources-hub .entry-header,
body.lm-template-resources-hub .ast-single-post .entry-title,
body.lm-template-resources-hub .page-title { display: none !important; }
/* Theme footer (#colophon) intentionally NOT suppressed — Astra footer shows. */

/* ================================ BASE ==================================== */
.lm-eot { font-family: var(--eot-font); color: #000000; background: #ffffff; -webkit-font-smoothing: antialiased; }
.lm-eot *, .lm-eot *::before, .lm-eot *::after { box-sizing: border-box; }
.lm-eot__wrap { width: 100%; max-width: 1500px; margin: 0 auto; padding: 0 clamp(20px, 4vw, 50px); }
.lm-eot__eyebrow { display: inline-block; font-size: 0.78rem; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; color: #000000; margin: 0 0 1rem; }
.lm-eot__h2 { font-size: clamp(1.65rem, 3.4vw, 2.5rem); font-weight: 800; line-height: 1.14; letter-spacing: -0.02em; margin: 0 0 1rem; color: #000000; }
.lm-eot__lede { font-size: clamp(1rem, 1.4vw, 1.13rem); line-height: 1.65; color: #000000; margin: 0; }
.lm-eot__section-head { max-width: 880px; margin: 0 0 2.8rem; }

/* buttons */
.lm-eot__btn { display: inline-flex; align-items: center; gap: 0.55rem; font-family: var(--eot-font); font-weight: 600; font-size: 0.875rem; letter-spacing: 0.03em; text-transform: uppercase; text-decoration: none; padding: 0.92rem 1.6rem; border-radius: 4px; border: 2px solid transparent; cursor: pointer; transition: background 200ms ease, color 200ms ease, transform 200ms ease, border-color 200ms ease; line-height: 1; }
.lm-eot__btn svg { width: 16px; height: 16px; flex-shrink: 0; }
.lm-eot__btn--blue   { background: #f1f1f1; color: #000000; }
.lm-eot__btn--blue:hover { background: #f1f1f1; color: #000000; transform: translateY(-2px); }
.lm-eot__btn--yellow { background: #ffb600; color: #ffffff; }
.lm-eot__btn--yellow:hover { background: #ffb600; color: #ffffff; transform: translateY(-2px); }
.lm-eot__btn--outline { background: transparent; color: #000000; border-color: rgba(0,0,0,.12); }
.lm-eot__btn--outline:hover { background: #f1f1f1; color: #000000; border-color: rgba(0,0,0,.12); transform: translateY(-2px); }

/* ============================ SECTION RHYTHM ============================== */
.lm-eot-sec { padding: clamp(3.25rem, 6.5vw, 5.5rem) 0; }
.lm-eot-sec--pale { background: #f1f1f1; }
.lm-eot-sec--pale2 { background: #f1f1f1; }

/* ================================ HERO ==================================== */
.lm-eot-hero { background: linear-gradient(180deg, #ffffff 0%, #f1f1f1 100%); border-bottom: 1px solid #f1f1f1; }
.lm-eot-hero__inner { padding-top: clamp(1.75rem, 3.2vw, 2.6rem); padding-bottom: clamp(2.5rem, 5vw, 3.5rem); }
.lm-eot-hero__crumb { font-size: 0.8rem; color: #000000; margin: 0 0 1rem; }
.lm-eot-hero__crumb a { color: #000000; text-decoration: none; }
.lm-eot-hero__crumb a:hover { color: #000000; }
.lm-eot-hero__head { max-width: none; margin: 0 0 2.1rem; }
.lm-eot-hero__title { font-size: clamp(1.65rem, 3.5vw, 2.7rem); font-weight: 800; line-height: 1.1; letter-spacing: -0.025em; color: #000000; margin: 0 0 1.1rem; }
.lm-eot-hero__title .accent { color: #000000; }
.lm-eot-hero__lede { font-size: clamp(1rem, 1.4vw, 1.15rem); line-height: 1.6; color: #000000; max-width: 1120px; margin: 0; }

/* hero stat strip */
.lm-eot-hero__strip { display: grid; grid-template-columns: repeat(2, 1fr); margin-top: 2.2rem; border-top: 1px solid #f1f1f1; }
@media (min-width: 720px) { .lm-eot-hero__strip { grid-template-columns: repeat(4, 1fr); } }
.lm-eot-hero__stat { display: flex; flex-direction: column; gap: 0.25rem; padding: 1.35rem 1.5rem 0.2rem; border-left: 1px solid #f1f1f1; }
.lm-eot-hero__stat:nth-child(odd) { border-left: 0; padding-left: 0; }
@media (min-width: 720px) {
    .lm-eot-hero__stat:nth-child(odd) { border-left: 1px solid #f1f1f1; padding-left: 1.5rem; }
    .lm-eot-hero__stat:first-child { border-left: 0; padding-left: 0; }
}
.lm-eot-hero__stat b { font-size: clamp(1.25rem, 1.8vw, 1.55rem); font-weight: 800; color: #000000; line-height: 1.1; }
.lm-eot-hero__stat span { font-size: 0.84rem; color: #000000; line-height: 1.35; }

/* ============================ WHY / TRUST =============================== */
.lm-eot-why__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.5rem 1.25rem; margin-top: 2.4rem; }
@media (min-width: 760px) { .lm-eot-why__grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1040px) { .lm-eot-why__grid { grid-template-columns: repeat(6, 1fr); } }
.lm-eot-why__item b { display: block; font-size: clamp(1.4rem, 2.4vw, 1.85rem); font-weight: 800; color: #000000; line-height: 1; margin-bottom: 0.4rem; }
.lm-eot-why__item span { font-size: 0.82rem; line-height: 1.4; color: #000000; }
.lm-eot-why__tag { margin-top: 2.6rem; padding-top: 1.9rem; border-top: 1px solid #f1f1f1; font-size: 0.82rem; letter-spacing: 0.18em; text-transform: uppercase; color: #000000; font-weight: 700; }

/* ============================ FINAL CTA ================================= */
.lm-eot-final { background: #f1f1f1; border-top: 1px solid #f1f1f1; }
.lm-eot-final__inner { padding: clamp(3rem, 6vw, 4.5rem) 0; text-align: center; }
.lm-eot-final__h { font-size: clamp(1.5rem, 3vw, 2.2rem); font-weight: 800; letter-spacing: -0.02em; color: #000000; margin: 0 auto 1rem; max-width: 24ch; }
.lm-eot-final__p { font-size: 1.02rem; line-height: 1.6; color: #000000; max-width: 58ch; margin: 0 auto 2rem; }
.lm-eot-final__cta { display: flex; flex-wrap: wrap; gap: 0.8rem; justify-content: center; }
.lm-eot-final__contact { display: flex; flex-wrap: wrap; gap: 0.5rem 2rem; justify-content: center; margin-top: 2.2rem; padding-top: 1.7rem; border-top: 1px solid #f1f1f1; }
.lm-eot-final__contact a { color: #000000; text-decoration: none; font-weight: 600; font-size: 0.95rem; }
.lm-eot-final__contact a:hover { color: #000000; }

/* ============================ REVEAL ANIMATIONS ========================= */
.lm-eot .lm-reveal { opacity: 0; transform: translateY(26px); transition: opacity 720ms cubic-bezier(0.22,1,0.36,1), transform 720ms cubic-bezier(0.22,1,0.36,1); will-change: opacity, transform; }
.lm-eot .lm-reveal.is-visible { opacity: 1; transform: translateY(0); will-change: auto; }
.lm-eot .lm-stagger > .lm-reveal:nth-child(1) { transition-delay: 0ms; }
.lm-eot .lm-stagger > .lm-reveal:nth-child(2) { transition-delay: 90ms; }
.lm-eot .lm-stagger > .lm-reveal:nth-child(3) { transition-delay: 180ms; }
.lm-eot .lm-stagger > .lm-reveal:nth-child(4) { transition-delay: 270ms; }
.lm-eot .lm-stagger > .lm-reveal:nth-child(5) { transition-delay: 360ms; }
.lm-eot .lm-stagger > .lm-reveal:nth-child(6) { transition-delay: 450ms; }
@media (prefers-reduced-motion: reduce) {
    .lm-eot .lm-reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
    .lm-eot__btn:hover { transform: none !important; }
}