/**
 * EMA Breadcrumb — front-end styles.
 * v1.2.0 — re-styled to match the legal.html breadcrumb pattern:
 *   - Cream background, soot bottom border
 *   - Links underline-on-hover (animated border-bottom)
 *   - Gold separator
 *   - Red current page with persistent red underline
 *
 * Inner max-width is set inline by Elementor via the "Inner max-width"
 * control so the same widget can match either 880px (legal) or 1280px
 * (full-bleed) pages, plus everything in between.
 */
.ema-crumb{
    background: #F5EFD9;
    border-bottom: 2px solid #12110F;
    padding: 14px 32px;
}
.ema-crumb-inner{
    /* Overridden by the Elementor max-width control. Default mirrors legal.html. */
    max-width: 880px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    gap: 14px;
    font-family: 'Oswald', 'Arial Narrow', sans-serif;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .2em;
    text-transform: uppercase;
    color: rgba(18,17,15,.6);
}
.ema-crumb a{
    color: inherit;
    text-decoration: none;
    border-bottom: 1.5px solid transparent;
    transition: border-color .2s, color .2s;
}
.ema-crumb a:hover{
    border-color: #A01428;
    color: #A01428;
}
.ema-crumb .sep{
    color: #A08C50;
    font-weight: 700;
}
.ema-crumb .here{
    color: #A01428;
    border-bottom: 1.5px solid #A01428;
}

@media (max-width: 780px){
    .ema-crumb{ padding: 10px 16px; }
    .ema-crumb-inner{
        flex-wrap: wrap;
        gap: 8px;
        font-size: 10px;
        letter-spacing: .16em;
    }
}