:root {
        --leo-paper: oklch(98% 0.005 280);
        --leo-paper-2: oklch(95% 0.01 280);
        --leo-paper-3: oklch(92% 0.015 280);
        --leo-ink: oklch(20% 0.04 280);
        --leo-soft: oklch(50% 0.03 280);
        --leo-accent: oklch(55% 0.18 280);
        --leo-accent-pop: oklch(70% 0.15 200);
        --leo-rule: oklch(90% 0.01 280);
        --leo-s-1: 4px; --leo-s-2: 8px; --leo-s-3: 12px; --leo-s-4: 16px;
        --leo-s-5: 24px; --leo-s-6: 32px; --leo-s-7: 48px; --leo-s-8: 64px;
        --leo-s-9: 96px; --leo-s-10: 128px;
        --leo-dur: 200ms;
        --leo-ease: cubic-bezier(.2,.7,.2,1);
        --leo-font-display: "Plus Jakarta Sans", "Inter Tight", -apple-system, sans-serif;
        --leo-font-body: "Sarabun", "Plus Jakarta Sans", sans-serif;
    }
    body { font-family: var(--leo-font-body); color: var(--leo-ink); background: var(--leo-paper); }
    h1, h2, h3, h4 { font-family: var(--leo-font-display); color: var(--leo-ink); letter-spacing: -0.015em; }
    h1 { font-weight: 700; font-size: clamp(32px, 5vw, 52px); line-height: 1.1; margin: 0 0 var(--leo-s-5); }
    h2 { font-weight: 700; font-size: clamp(24px, 3.5vw, 36px); line-height: 1.2; margin-top: var(--leo-s-7); margin-bottom: var(--leo-s-4); }
    h3 { font-weight: 600; font-size: clamp(18px, 2vw, 22px); line-height: 1.3; margin-top: var(--leo-s-5); margin-bottom: var(--leo-s-3); }
    p, li { font-size: 17px; line-height: 1.75; color: var(--leo-ink); }
    a { color: var(--leo-accent); text-decoration: none; border-bottom: 1px solid transparent; transition: border-color var(--leo-dur) var(--leo-ease); }
    a:hover { border-bottom-color: var(--leo-accent); }
    a:focus-visible { outline: 2px solid var(--leo-accent); outline-offset: 3px; border-radius: 2px; }
    strong { color: var(--leo-ink); font-weight: 700; }
    /* Buttons */
    .wp-block-button__link {
        background: var(--leo-accent) !important;
        color: #fff !important;
        padding: 12px 28px !important;
        border-radius: 8px !important;
        font-weight: 600;
        font-family: var(--leo-font-display);
        font-size: 16px;
        border-bottom: none !important;
        transition: transform var(--leo-dur) var(--leo-ease), background-color var(--leo-dur) var(--leo-ease);
    }
    .wp-block-button__link:hover { background: oklch(48% 0.18 280) !important; transform: translateY(-1px); }
    .wp-block-button.is-style-outline .wp-block-button__link {
        background: transparent !important;
        color: var(--leo-accent) !important;
        border: 1.5px solid var(--leo-accent) !important;
    }
    .wp-block-button.is-style-outline .wp-block-button__link:hover {
        background: var(--leo-accent) !important;
        color: #fff !important;
    }
    /* Tables */
    .wp-block-table table { border-collapse: collapse; width: 100%; margin: var(--leo-s-5) 0; }
    .wp-block-table th { background: var(--leo-paper-2); color: var(--leo-ink); font-weight: 700; text-align: left; padding: 12px 16px; border-bottom: 2px solid var(--leo-accent); font-family: var(--leo-font-display); }
    .wp-block-table td { padding: 12px 16px; border-bottom: 1px solid var(--leo-rule); }
    .wp-block-table tbody tr:hover td { background: var(--leo-paper-2); }
    /* Lists — scoped to article body copy only, never template chrome (header/footer nav) */
    .entry-content ul li { position: relative; padding-left: 28px; margin-bottom: 10px; list-style: none; }
    .entry-content ul li::before { content: "→"; position: absolute; left: 0; top: 0; color: var(--leo-accent); font-weight: 700; }
    ol { padding-left: 24px; }
    ol li { margin-bottom: 10px; }
    /* H2/H3 hierarchy markers */
    h2 { padding-top: var(--leo-s-5); border-top: 1px solid var(--leo-rule); }
    h3 { padding-left: 16px; position: relative; }
    h3::before { content: ""; position: absolute; left: 0; top: 0.45em; width: 8px; height: 8px; background: var(--leo-accent-pop); border-radius: 50%; }
    /* FAQ section special */
    h2#faq { background: linear-gradient(90deg, var(--leo-paper-2), transparent 70%); padding: var(--leo-s-4) var(--leo-s-5); border-left: 4px solid var(--leo-accent-pop); border-top: none; margin-left: calc(-1 * var(--leo-s-5)); }
    /* Primary navigation — force brand accent + visible active state (was falling back to theme default black) */
    .wp-block-navigation .wp-block-navigation-item__content { color: var(--leo-accent) !important; }
    .wp-block-navigation a[aria-current="page"] { font-weight: 700; border-bottom: 2px solid var(--leo-accent); }
    /* Nav hamburger toggle — grow tap target to ~44px without enlarging the icon */
    .wp-block-navigation__responsive-container-open,
    .wp-block-navigation__responsive-container-close { padding: 10px !important; }
    /* Persistent link affordance at rest, not just on hover (WCAG 1.4.1 use-of-color) */
    a { border-bottom-color: color-mix(in oklch, var(--leo-accent) 45%, transparent); }
    .leo-footer__list a { border-bottom-color: color-mix(in oklch, var(--leo-ink) 35%, transparent) !important; }
    /* Featured image: never force a landscape crop box onto portrait source photos */
    .wp-block-post-featured-image { aspect-ratio: auto !important; }
    .wp-block-post-featured-image img { height: auto !important; object-fit: contain !important; }
    /* Post date used a flat theme-preset gray instead of the Aurora token system */
    .wp-block-post-date { color: var(--leo-soft) !important; }
    /* Colored CTA panels (.lh-cta) share the same accent as the sitewide focus outline,
       making keyboard focus invisible on them — force a light outline inside those panels. */
    .lh-cta a:focus-visible, .lh-cta button:focus-visible { outline-color: #fff !important; }
    /* Footer contact links sat at ~4.4:1 against the footer's tinted background, just under
       AA — darken slightly for this specific pairing without touching the accent everywhere else. */
    .leo-footer__contact-row a { color: oklch(48% 0.18 280) !important; }
    /* Eyebrow badge text/background sat at ~4.5:1 with no safety margin — lighten the
       background a touch so it clears AA with real headroom. */
    .lh-eyebrow { background: oklch(97% 0.03 280) !important; }
    @media (max-width: 768px) {
        h1 { font-size: 28px; } h2 { font-size: 22px; } h3 { font-size: 18px; }
        p, li { font-size: 16px; }
    }
    @media (prefers-reduced-motion: reduce) {
        a, .wp-block-button__link { transition: none !important; }
        .wp-block-button__link:hover { transform: none !important; }
        .lh-card, .lh-card:hover, .lh-cta-btn { transition: none !important; transform: none !important; }
    }

/* Widen the article/page content column from the theme default (645px) — was reading
   cramped/narrow. Scoped to exclude the homepage, which has its own Coral full-width
   design (nav/marquee/statement sections rely on the post-content column NOT being
   artificially capped, or their edge-to-edge backgrounds would get clipped to 860px). */
body:not(.home) .wp-block-post-content.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
    max-width: 860px !important;
}