/*
 * 中古スマホ価格ドットコム
 * Static interaction policy v1
 *
 * Principles:
 * - no underline / dotted underline
 * - no hover movement
 * - no animated transitions
 * - no black click/focus state
 * - keyboard focus remains visible
 * - native Twenty Twenty-One mobile menu retained
 */

/* =========================================================
   Global link interaction policy
   ========================================================= */

.site a,
.site a:link,
.site a:visited,
.site a:hover,
.site a:active,
.site a:focus {
text-decoration: none !important;
text-decoration-line: none !important;
text-decoration-style: solid !important;
text-decoration-skip-ink: auto !important;
transition: none !important;
}

.site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) {
text-decoration: none !important;
background: transparent;
box-shadow: none;
}

.site a:focus:not(:focus-visible),
.site button:focus:not(:focus-visible) {
outline: none !important;
box-shadow: none !important;
}

/* Keyboard navigation only.
   Solid quiet ring instead of Twenty Twenty-One dotted focus. */

.site a:focus-visible,
.site button:focus-visible,
.site input:focus-visible,
.site select:focus-visible,
.site textarea:focus-visible {
outline: 2px solid #76a7e8 !important;
outline-offset: 3px;
text-decoration: none !important;
box-shadow: none !important;
}

/* =========================================================
   No decorative motion
   ========================================================= */

.site a,
.site button,
.site input[type="submit"],
.site input[type="button"],
.usp-home-search__button,
.usp-home-maker-card,
.usp-home-product-card,
.usp-phone-offer-button,
.usp-phone-offer-table tbody tr {
transition: none !important;
animation: none !important;
}

.usp-home-search__button,
.usp-home-search__button:hover,
.usp-home-search__button:active,
.usp-home-search__button:focus,
.usp-home-maker-card,
.usp-home-maker-card:hover,
.usp-home-maker-card:active,
.usp-home-product-card,
.usp-home-product-card:hover,
.usp-home-product-card:active,
.usp-phone-offer-button,
.usp-phone-offer-button:hover,
.usp-phone-offer-button:active,
.usp-phone-offer-button:focus {
transform: none !important;
}

/* Search button: one stable visual state. */

.usp-home .usp-home-search__button,
.usp-home .usp-home-search__button:link,
.usp-home .usp-home-search__button:visited,
.usp-home .usp-home-search__button:hover,
.usp-home .usp-home-search__button:active,
.usp-home .usp-home-search__button:focus {
background: #2368c9 !important;
color: #ffffff !important;
text-decoration: none !important;
transform: none !important;
}

/* Product offer CTA: one stable visual state. */

.usp-phone-offer-button,
.usp-phone-offer-button:link,
.usp-phone-offer-button:visited,
.usp-phone-offer-button:hover,
.usp-phone-offer-button:active,
.usp-phone-offer-button:focus {
background: #2368c9 !important;
color: #ffffff !important;
text-decoration: none !important;
transform: none !important;
}

/* Breadcrumbs remain quiet. */

.usp-phone-breadcrumb a,
.usp-phone-breadcrumb a:link,
.usp-phone-breadcrumb a:visited,
.usp-phone-breadcrumb a:hover,
.usp-phone-breadcrumb a:active,
.usp-phone-breadcrumb a:focus {
color: #52637a !important;
text-decoration: none !important;
}

/* Legal content links keep blue identity without decoration. */

body.page-id-571 .entry-content a,
body.page-id-571 .entry-content a:link,
body.page-id-571 .entry-content a:visited,
body.page-id-571 .entry-content a:hover,
body.page-id-571 .entry-content a:active,
body.page-id-571 .entry-content a:focus,
body.page-id-3 .entry-content a,
body.page-id-3 .entry-content a:link,
body.page-id-3 .entry-content a:visited,
body.page-id-3 .entry-content a:hover,
body.page-id-3 .entry-content a:active,
body.page-id-3 .entry-content a:focus {
color: #1d4ed8 !important;
text-decoration: none !important;
}

/* =========================================================
   Desktop header
   ========================================================= */

.site-header .site-title a,
.site-header .site-title a:link,
.site-header .site-title a:visited,
.site-header .site-title a:hover,
.site-header .site-title a:active,
.site-header .site-title a:focus {
background: transparent !important;
color: #17233b !important;
text-decoration: none !important;
transform: none !important;
}

.site-header .primary-navigation > div > .menu-wrapper > li > a,
.site-header .primary-navigation > div > .menu-wrapper > li > a:link,
.site-header .primary-navigation > div > .menu-wrapper > li > a:visited,
.site-header .primary-navigation > div > .menu-wrapper > li > a:hover,
.site-header .primary-navigation > div > .menu-wrapper > li > a:active,
.site-header .primary-navigation > div > .menu-wrapper > li > a:focus,
.site-header .primary-navigation .current-menu-item > a:first-child,
.site-header .primary-navigation .current_page_item > a:first-child {
background: transparent !important;
color: #34445b !important;
text-decoration: none !important;
transform: none !important;
transition: none !important;
}

.site-header .primary-navigation .usp-menu-search > a,
.site-header .primary-navigation .usp-menu-search > a:link,
.site-header .primary-navigation .usp-menu-search > a:visited,
.site-header .primary-navigation .usp-menu-search > a:hover,
.site-header .primary-navigation .usp-menu-search > a:active,
.site-header .primary-navigation .usp-menu-search > a:focus {
background: #2368c9 !important;
color: #ffffff !important;
text-decoration: none !important;
transform: none !important;
transition: none !important;
}

/* =========================================================
   Footer
   ========================================================= */

.site-footer {
width: min(1180px, calc(100% - 40px));
max-width: none;
margin-right: auto;
margin-left: auto;
padding-top: 28px;
padding-bottom: 34px;
border-top: 1px solid #e5ebf3;
}

.site-footer .footer-navigation {
margin: 0;
}

.site-footer .footer-navigation-wrapper {
display: flex;
align-items: center;
justify-content: center;
flex-wrap: wrap;
gap: 10px 24px;
margin: 0;
padding: 0;
}

.site-footer .footer-navigation-wrapper li {
margin: 0;
padding: 0;
}

.site-footer .footer-navigation-wrapper li a,
.site-footer .footer-navigation-wrapper li a:link,
.site-footer .footer-navigation-wrapper li a:visited,
.site-footer .footer-navigation-wrapper li a:hover,
.site-footer .footer-navigation-wrapper li a:active,
.site-footer .footer-navigation-wrapper li a:focus,
.site-footer .footer-navigation-wrapper .current-menu-item > a,
.site-footer .footer-navigation-wrapper .current_page_item > a {
display: block;
padding: 7px 0;
background: transparent;
color: #4b5d74 !important;
font-size: 14px;
font-weight: 600;
line-height: 1.5;
text-decoration: none !important;
transform: none !important;
transition: none !important;
}

/* =========================================================
   Native mobile hamburger
   ========================================================= */

@media only screen and (max-width: 892px) {

.site-header .menu-button-container {
padding: 0;
}

.site-header .menu-button-container #primary-mobile-menu,
.site-header .menu-button-container #primary-mobile-menu:hover,
.site-header .menu-button-container #primary-mobile-menu:active,
.site-header .menu-button-container #primary-mobile-menu:focus {
display: inline-flex;
width: 44px;
height: 44px;
align-items: center;
justify-content: center;
margin: 0;
padding: 0;
border: 1px solid #dbe4ef;
border-radius: 12px;
background: #ffffff !important;
box-shadow: 0 4px 14px rgba(23, 35, 59, 0.07);
color: #17233b !important;
transform: none !important;
transition: none !important;
animation: none !important;
}

.site-header #primary-mobile-menu .dropdown-icon {
font-size: 0;
line-height: 1;
transition: none !important;
animation: none !important;
}

.site-header #primary-mobile-menu .svg-icon {
width: 23px;
height: 23px;
margin: 0;
transform: none !important;
transition: none !important;
animation: none !important;
}

.site-header .primary-navigation > .primary-menu-container {
transition: none !important;
animation: none !important;
}

.primary-navigation-open .site-header .primary-navigation {
background: #ffffff;
}

.site-header .primary-navigation > div > .menu-wrapper > li > a,
.site-header .primary-navigation > div > .menu-wrapper > li > a:link,
.site-header .primary-navigation > div > .menu-wrapper > li > a:visited,
.site-header .primary-navigation > div > .menu-wrapper > li > a:hover,
.site-header .primary-navigation > div > .menu-wrapper > li > a:active,
.site-header .primary-navigation > div > .menu-wrapper > li > a:focus {
background: transparent !important;
color: #263750 !important;
text-decoration: none !important;
transform: none !important;
transition: none !important;
}

.site-header .primary-navigation .usp-menu-search > a,
.site-header .primary-navigation .usp-menu-search > a:link,
.site-header .primary-navigation .usp-menu-search > a:visited,
.site-header .primary-navigation .usp-menu-search > a:hover,
.site-header .primary-navigation .usp-menu-search > a:active,
.site-header .primary-navigation .usp-menu-search > a:focus {
background: #2368c9 !important;
color: #ffffff !important;
}

.site-footer {
width: calc(100% - 28px);
padding-top: 24px;
padding-bottom: 28px;
}

.site-footer .footer-navigation-wrapper {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 8px 10px;
}

.site-footer .footer-navigation-wrapper li a,
.site-footer .footer-navigation-wrapper li a:link,
.site-footer .footer-navigation-wrapper li a:visited,
.site-footer .footer-navigation-wrapper li a:hover,
.site-footer .footer-navigation-wrapper li a:active,
.site-footer .footer-navigation-wrapper li a:focus {
display: flex;
min-height: 44px;
align-items: center;
justify-content: center;
padding: 9px 10px;
border: 1px solid #e6ebf2;
border-radius: 10px;
background: #f8fafc;
color: #43546a !important;
font-size: 13px;
font-weight: 650;
text-align: center;
}
}

@media only screen and (max-width: 420px) {

.site-footer .footer-navigation-wrapper {
grid-template-columns: 1fr;
}
}

/* =========================================================
   Navigation final polish R2-R2
   ========================================================= */


/* =========================================================
   FOOTER
   No underline / dotted line / click decoration.
   ========================================================= */

.site .site-footer .footer-navigation-wrapper li a,
.site .site-footer .footer-navigation-wrapper li a:link,
.site .site-footer .footer-navigation-wrapper li a:visited,
.site .site-footer .footer-navigation-wrapper li a:hover,
.site .site-footer .footer-navigation-wrapper li a:active,
.site .site-footer .footer-navigation-wrapper li a:focus,
.site .site-footer .footer-navigation-wrapper li a:focus-visible,
.site .site-footer .footer-navigation-wrapper .current-menu-item > a,
.site .site-footer .footer-navigation-wrapper .current_page_item > a {
    text-decoration: none !important;
    text-decoration-line: none !important;
    text-decoration-style: solid !important;
    text-decoration-color: transparent !important;
    text-decoration-thickness: 0 !important;
    text-underline-offset: 0 !important;

    border-bottom: 0 !important;

    outline: 0 !important;
    outline-offset: 0 !important;

    box-shadow: none !important;
    background-image: none !important;

    transform: none !important;
    transition: none !important;
    animation: none !important;

    -webkit-tap-highlight-color: transparent !important;
}


/* =========================================================
   MOBILE HEADER
   ========================================================= */

@media only screen and (max-width: 892px) {

    /* -----------------------------------------------------
       Closed hamburger
       44px touch area, but visually icon only.
       ----------------------------------------------------- */

    .site-header .menu-button-container {
        width: 44px !important;
        height: 44px !important;

        margin: 0 0 0 auto !important;
        padding: 0 !important;

        position: relative !important;

        top: auto !important;
        right: auto !important;
        bottom: auto !important;
        left: auto !important;

        border: 0 !important;
        background: transparent !important;
        outline: 0 !important;
        box-shadow: none !important;
    }

    .site-header .menu-button-container #primary-mobile-menu,
    .site-header .menu-button-container #primary-mobile-menu:hover,
    .site-header .menu-button-container #primary-mobile-menu:active,
    .site-header .menu-button-container #primary-mobile-menu:focus,
    .site-header .menu-button-container #primary-mobile-menu:focus-visible {
        display: flex !important;

        width: 44px !important;
        height: 44px !important;
        min-width: 44px !important;
        min-height: 44px !important;

        align-items: center !important;
        justify-content: center !important;

        margin: 0 !important;
        padding: 10px !important;

        border: 0 !important;
        border-radius: 0 !important;

        outline: 0 !important;
        outline-offset: 0 !important;

        background: transparent !important;
        box-shadow: none !important;

        color: #17233b !important;

        text-decoration: none !important;

        transform: none !important;
        transition: none !important;
        animation: none !important;

        -webkit-tap-highlight-color: transparent !important;
    }


    /* -----------------------------------------------------
       Hide native labels.
       Only hamburger / X SVG remains.
       ----------------------------------------------------- */

    .site-header #primary-mobile-menu .dropdown-icon,
    .site-header #primary-mobile-menu .dropdown-icon.open,
    .site-header #primary-mobile-menu .dropdown-icon.close {
        font-size: 0 !important;
        line-height: 0 !important;
    }

    .site-header #primary-mobile-menu .dropdown-icon .svg-icon {
        display: block !important;

        width: 24px !important;
        height: 24px !important;

        margin: 0 !important;
        padding: 0 !important;

        border: 0 !important;
        outline: 0 !important;
        box-shadow: none !important;

        transform: none !important;
        transition: none !important;
        animation: none !important;
    }


    /* -----------------------------------------------------
       OPEN STATE
       X is permanently fixed to the RIGHT.
       ----------------------------------------------------- */

    body.primary-navigation-open
    .site-header
    .menu-button-container {
        position: fixed !important;

        top: 12px !important;
        right: 14px !important;
        bottom: auto !important;
        left: auto !important;

        width: 44px !important;
        height: 44px !important;

        margin: 0 !important;
        padding: 0 !important;

        border: 0 !important;
        background: transparent !important;
        outline: 0 !important;
        box-shadow: none !important;

        transform: none !important;

        z-index: 100001 !important;
    }

    body.primary-navigation-open
    .site-header
    .menu-button-container
    #primary-mobile-menu,
    body.primary-navigation-open
    .site-header
    .menu-button-container
    #primary-mobile-menu:hover,
    body.primary-navigation-open
    .site-header
    .menu-button-container
    #primary-mobile-menu:active,
    body.primary-navigation-open
    .site-header
    .menu-button-container
    #primary-mobile-menu:focus,
    body.primary-navigation-open
    .site-header
    .menu-button-container
    #primary-mobile-menu:focus-visible {
        border: 0 !important;
        border-radius: 0 !important;

        outline: 0 !important;
        outline-offset: 0 !important;

        background: transparent !important;
        box-shadow: none !important;

        color: #17233b !important;

        transform: none !important;
        transition: none !important;
        animation: none !important;
    }


    /* Logged-in WordPress admin bar:
       46px admin bar + 12px gap. */

    body.admin-bar.primary-navigation-open
    .site-header
    .menu-button-container {
        top: 58px !important;
    }


    /* -----------------------------------------------------
       Normal mobile menu links
       ----------------------------------------------------- */

    .site-header .primary-navigation
    > div
    > .menu-wrapper
    > li
    > a,
    .site-header .primary-navigation
    > div
    > .menu-wrapper
    > li
    > a:link,
    .site-header .primary-navigation
    > div
    > .menu-wrapper
    > li
    > a:visited,
    .site-header .primary-navigation
    > div
    > .menu-wrapper
    > li
    > a:hover,
    .site-header .primary-navigation
    > div
    > .menu-wrapper
    > li
    > a:active,
    .site-header .primary-navigation
    > div
    > .menu-wrapper
    > li
    > a:focus,
    .site-header .primary-navigation
    > div
    > .menu-wrapper
    > li
    > a:focus-visible {
        text-decoration: none !important;

        border-bottom: 0 !important;

        outline: 0 !important;
        outline-offset: 0 !important;

        box-shadow: none !important;

        transform: none !important;
        transition: none !important;
        animation: none !important;

        -webkit-tap-highlight-color: transparent !important;
    }


    /* -----------------------------------------------------
       Mobile "スマホを検索"
       Match desktop CTA.
       ----------------------------------------------------- */

    .site-header .primary-navigation
    > div
    > .menu-wrapper
    > li.usp-menu-search
    > a,
    .site-header .primary-navigation
    > div
    > .menu-wrapper
    > li.usp-menu-search
    > a:link,
    .site-header .primary-navigation
    > div
    > .menu-wrapper
    > li.usp-menu-search
    > a:visited,
    .site-header .primary-navigation
    > div
    > .menu-wrapper
    > li.usp-menu-search
    > a:hover,
    .site-header .primary-navigation
    > div
    > .menu-wrapper
    > li.usp-menu-search
    > a:active,
    .site-header .primary-navigation
    > div
    > .menu-wrapper
    > li.usp-menu-search
    > a:focus,
    .site-header .primary-navigation
    > div
    > .menu-wrapper
    > li.usp-menu-search
    > a:focus-visible,
    .site-header .primary-navigation
    > div
    > .menu-wrapper
    > li.usp-menu-search.current-menu-item
    > a,
    .site-header .primary-navigation
    > div
    > .menu-wrapper
    > li.usp-menu-search.current_page_item
    > a {
        display: flex !important;

        align-items: center !important;
        justify-content: center !important;

        min-height: 52px !important;

        margin: 12px 18px 0 !important;
        padding: 14px 18px !important;

        border: 0 !important;
        border-radius: 10px !important;

        outline: 0 !important;
        outline-offset: 0 !important;

        background: #2368c9 !important;
        box-shadow: none !important;

        color: #ffffff !important;

        font-weight: 700 !important;
        text-align: center !important;
        text-decoration: none !important;

        transform: none !important;
        transition: none !important;
        animation: none !important;

        -webkit-tap-highlight-color: transparent !important;
    }
}

/* =========================================================
   Navigation visual refinement R3

   1. Restore original footer flow layout.
   2. Remove only decorative footer styling.
   3. Use identical hamburger / close-button positioning.
   ========================================================= */


/* =========================================================
   FOOTER
   Original natural wrapping layout.
   No cards, no borders, no underline.
   ========================================================= */

.site .site-footer .footer-navigation {
    margin: 0 !important;
}

.site .site-footer .footer-navigation-wrapper {
    display: flex !important;

    align-items: center !important;
    justify-content: center !important;
    flex-wrap: wrap !important;

    grid-template-columns: none !important;

    gap: 10px 24px !important;

    margin: 0 !important;
    padding: 0 !important;
}

.site .site-footer .footer-navigation-wrapper li {
    width: auto !important;
    min-width: 0 !important;
    flex: 0 0 auto !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    background: transparent !important;
}

.site .site-footer .footer-navigation-wrapper li a,
.site .site-footer .footer-navigation-wrapper li a:link,
.site .site-footer .footer-navigation-wrapper li a:visited,
.site .site-footer .footer-navigation-wrapper li a:hover,
.site .site-footer .footer-navigation-wrapper li a:active,
.site .site-footer .footer-navigation-wrapper li a:focus,
.site .site-footer .footer-navigation-wrapper li a:focus-visible,
.site .site-footer .footer-navigation-wrapper .current-menu-item > a,
.site .site-footer .footer-navigation-wrapper .current_page_item > a {
    display: inline-block !important;

    min-height: 0 !important;

    margin: 0 !important;
    padding: 6px 0 !important;

    border: 0 !important;
    border-radius: 0 !important;

    background: transparent !important;
    background-image: none !important;

    box-shadow: none !important;

    color: #4b5d74 !important;

    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.5 !important;

    text-decoration: none !important;
    text-decoration-line: none !important;
    text-decoration-thickness: 0 !important;

    outline: 0 !important;
    outline-offset: 0 !important;

    transform: none !important;
    transition: none !important;
    animation: none !important;

    -webkit-tap-highlight-color: transparent !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media only screen and (max-width: 892px) {

    /* -----------------------------------------------------
       Footer:
       keep exactly the same natural flow philosophy.
       No grid / no cards.
       ----------------------------------------------------- */

    .site .site-footer .footer-navigation-wrapper {
        display: flex !important;

        align-items: center !important;
        justify-content: center !important;
        flex-wrap: wrap !important;

        grid-template-columns: none !important;

        gap: 10px 22px !important;
    }

    .site .site-footer .footer-navigation-wrapper li {
        width: auto !important;
        flex: 0 0 auto !important;

        border: 0 !important;
        background: transparent !important;
    }

    .site .site-footer .footer-navigation-wrapper li a,
    .site .site-footer .footer-navigation-wrapper li a:link,
    .site .site-footer .footer-navigation-wrapper li a:visited,
    .site .site-footer .footer-navigation-wrapper li a:hover,
    .site .site-footer .footer-navigation-wrapper li a:active,
    .site .site-footer .footer-navigation-wrapper li a:focus,
    .site .site-footer .footer-navigation-wrapper li a:focus-visible {
        display: inline-block !important;

        min-height: 0 !important;

        padding: 7px 0 !important;

        border: 0 !important;
        border-radius: 0 !important;

        background: transparent !important;

        box-shadow: none !important;

        color: #43546a !important;

        font-size: 14px !important;
        font-weight: 600 !important;

        text-decoration: none !important;

        outline: 0 !important;

        transform: none !important;
        transition: none !important;
    }


    /* -----------------------------------------------------
       Hamburger / close button

       CLOSED and OPEN states now use the SAME positioning
       model. No fixed-position jump.
       ----------------------------------------------------- */

    .site-header .menu-button-container,
    body.primary-navigation-open
    .site-header
    .menu-button-container,
    body.admin-bar.primary-navigation-open
    .site-header
    .menu-button-container {
        position: relative !important;

        top: auto !important;
        right: auto !important;
        bottom: auto !important;
        left: auto !important;

        width: 44px !important;
        height: 44px !important;
        min-width: 44px !important;

        margin: 0 0 0 auto !important;
        padding: 0 !important;

        border: 0 !important;
        background: transparent !important;

        outline: 0 !important;
        box-shadow: none !important;

        transform: none !important;
        transition: none !important;
        animation: none !important;

        z-index: 100001 !important;
    }

    .site-header .menu-button-container #primary-mobile-menu,
    .site-header .menu-button-container #primary-mobile-menu:hover,
    .site-header .menu-button-container #primary-mobile-menu:active,
    .site-header .menu-button-container #primary-mobile-menu:focus,
    .site-header .menu-button-container #primary-mobile-menu:focus-visible,
    body.primary-navigation-open
    .site-header
    .menu-button-container
    #primary-mobile-menu,
    body.primary-navigation-open
    .site-header
    .menu-button-container
    #primary-mobile-menu:hover,
    body.primary-navigation-open
    .site-header
    .menu-button-container
    #primary-mobile-menu:active,
    body.primary-navigation-open
    .site-header
    .menu-button-container
    #primary-mobile-menu:focus,
    body.primary-navigation-open
    .site-header
    .menu-button-container
    #primary-mobile-menu:focus-visible {
        position: static !important;

        display: flex !important;

        width: 44px !important;
        height: 44px !important;
        min-width: 44px !important;
        min-height: 44px !important;

        align-items: center !important;
        justify-content: center !important;

        margin: 0 !important;
        padding: 10px !important;

        border: 0 !important;
        border-radius: 0 !important;

        background: transparent !important;
        box-shadow: none !important;

        color: #17233b !important;

        outline: 0 !important;
        outline-offset: 0 !important;

        text-decoration: none !important;

        transform: none !important;
        transition: none !important;
        animation: none !important;

        -webkit-tap-highlight-color: transparent !important;
    }

    .site-header #primary-mobile-menu .dropdown-icon .svg-icon {
        width: 24px !important;
        height: 24px !important;

        margin: 0 !important;

        transform: none !important;
        transition: none !important;
        animation: none !important;
    }


    /* -----------------------------------------------------
       Keep mobile search CTA blue.
       ----------------------------------------------------- */

    .site-header .primary-navigation
    > div
    > .menu-wrapper
    > li.usp-menu-search
    > a,
    .site-header .primary-navigation
    > div
    > .menu-wrapper
    > li.usp-menu-search
    > a:link,
    .site-header .primary-navigation
    > div
    > .menu-wrapper
    > li.usp-menu-search
    > a:visited,
    .site-header .primary-navigation
    > div
    > .menu-wrapper
    > li.usp-menu-search
    > a:hover,
    .site-header .primary-navigation
    > div
    > .menu-wrapper
    > li.usp-menu-search
    > a:active,
    .site-header .primary-navigation
    > div
    > .menu-wrapper
    > li.usp-menu-search
    > a:focus,
    .site-header .primary-navigation
    > div
    > .menu-wrapper
    > li.usp-menu-search
    > a:focus-visible {
        background: #2368c9 !important;
        color: #ffffff !important;

        border: 0 !important;
        border-radius: 10px !important;

        text-decoration: none !important;

        box-shadow: none !important;

        transform: none !important;
        transition: none !important;
        animation: none !important;
    }
}

/* =========================================================
   Hamburger optical vertical alignment R4
   Keep hamburger and close icon perfectly synchronized.
   ========================================================= */

@media only screen and (max-width: 892px) {

    .site-header .menu-button-container,
    body.primary-navigation-open
    .site-header
    .menu-button-container,
    body.admin-bar.primary-navigation-open
    .site-header
    .menu-button-container {
        top: 3px !important;
    }
}

/* =========================================================
   Hamburger pixel alignment R5

   Screenshot measurement:
   title visual center ≈ 65px
   hamburger visual center ≈ 49px
   required correction = +16px

   Existing R4 top = 3px
   Final optical top = 19px
   ========================================================= */

@media only screen and (max-width: 892px) {

    .site-header .menu-button-container,
    body.primary-navigation-open
    .site-header
    .menu-button-container,
    body.admin-bar.primary-navigation-open
    .site-header
    .menu-button-container {
        top: 19px !important;
    }
}

/* =========================================================
   Hamburger exact optical center R6

   Screenshot delta:
   16 device pixels at DPR 2 = 8 CSS pixels.

   Container returns to stable R4 geometry.
   Actual toggle button receives the optical correction.
   ========================================================= */

@media only screen and (max-width: 892px) {

    /*
     * Restore the shared container geometry.
     * Do not use the R5 19px container displacement.
     */
    .site-header .menu-button-container,
    body.primary-navigation-open
    .site-header
    .menu-button-container,
    body.admin-bar.primary-navigation-open
    .site-header
    .menu-button-container {
        top: 3px !important;
        transform: none !important;
    }

    /*
     * Move the actual toggle control itself.
     * The SAME button contains both ☰ and ×,
     * therefore both states remain pixel-identical.
     */
    .site-header .menu-button-container #primary-mobile-menu,
    .site-header .menu-button-container #primary-mobile-menu:hover,
    .site-header .menu-button-container #primary-mobile-menu:active,
    .site-header .menu-button-container #primary-mobile-menu:focus,
    .site-header .menu-button-container #primary-mobile-menu:focus-visible,
    body.primary-navigation-open
    .site-header
    .menu-button-container
    #primary-mobile-menu,
    body.primary-navigation-open
    .site-header
    .menu-button-container
    #primary-mobile-menu:hover,
    body.primary-navigation-open
    .site-header
    .menu-button-container
    #primary-mobile-menu:active,
    body.primary-navigation-open
    .site-header
    .menu-button-container
    #primary-mobile-menu:focus,
    body.primary-navigation-open
    .site-header
    .menu-button-container
    #primary-mobile-menu:focus-visible {
        transform: translateY(8px) !important;
        transition: none !important;
        animation: none !important;
    }
}

/* =========================================================
   Home card focus / active cleanup v1

   Goal:
   - maker cards never turn black
   - product-card links never turn black
   - no dotted underline / dotted image outline
   - no active movement
   - keyboard focus uses a quiet solid blue ring only
   ========================================================= */


/* =========================================================
   MAKER CARDS
   ========================================================= */

.site .usp-home-maker-card,
.site .usp-home-maker-card:link,
.site .usp-home-maker-card:visited,
.site .usp-home-maker-card:hover,
.site .usp-home-maker-card:active,
.site .usp-home-maker-card:focus {
background: #ffffff !important;
background-color: #ffffff !important;
background-image: none !important;

color: #17233b !important;

text-decoration: none !important;
text-decoration-line: none !important;
text-decoration-style: solid !important;

outline: 0 !important;
outline-offset: 0 !important;

transform: none !important;
transition: none !important;
animation: none !important;

-webkit-tap-highlight-color: transparent !important;
}

/* Preserve component colors even if the parent theme tries
   to invert focused link text. */

.site .usp-home-maker-card .usp-home-maker-card__name {
color: #17233b !important;
}

.site .usp-home-maker-card .usp-home-maker-card__desc {
color: #64748b !important;
}

.site .usp-home-maker-card .usp-home-maker-card__arrow {
color: #2368c9 !important;
}

/* Mouse/touch focus: completely silent. */

.site .usp-home-maker-card:focus:not(:focus-visible) {
background: #ffffff !important;
outline: 0 !important;
box-shadow: none !important;
}

/* Keyboard only:
   quiet solid focus ring, never dotted / black. */

.site .usp-home-maker-card:focus-visible {
background: #ffffff !important;

outline: 2px solid #b8d3f4 !important;
outline-offset: 2px !important;

text-decoration: none !important;
}


/* =========================================================
   PRODUCT CARDS
   ========================================================= */

.site .usp-home-product-card,
.site .usp-home-product-card:hover,
.site .usp-home-product-card:active,
.site .usp-home-product-card:focus-within {
background: #ffffff !important;
background-color: #ffffff !important;

transform: none !important;
transition: none !important;
animation: none !important;
}

.site .usp-home-product-card__link,
.site .usp-home-product-card__link:link,
.site .usp-home-product-card__link:visited,
.site .usp-home-product-card__link:hover,
.site .usp-home-product-card__link:active,
.site .usp-home-product-card__link:focus {
background: transparent !important;
background-color: transparent !important;
background-image: none !important;

color: inherit !important;

text-decoration: none !important;
text-decoration-line: none !important;
text-decoration-style: solid !important;

outline: 0 !important;
outline-offset: 0 !important;

box-shadow: none !important;

transform: none !important;
transition: none !important;
animation: none !important;

-webkit-tap-highlight-color: transparent !important;
}

/* Twenty Twenty-One applies a dotted outline to images
   inside focused anchors. Kill that rule explicitly. */

.site .usp-home-product-card__link:focus img,
.site .usp-home-product-card__link:active img,
.site .usp-home-product-card__link:focus-visible img {
outline: 0 !important;
outline-offset: 0 !important;

border: 0 !important;
box-shadow: none !important;
}

/* Mouse/touch focus: no visible selection artifact. */

.site .usp-home-product-card__link:focus:not(:focus-visible) {
background: transparent !important;

outline: 0 !important;
box-shadow: none !important;
}

/* Keyboard only:
   solid pale-blue ring instead of parent dotted focus. */

.site .usp-home-product-card__link:focus-visible {
background: transparent !important;

outline: 2px solid #b8d3f4 !important;
outline-offset: -2px !important;

text-decoration: none !important;
}


/* =========================================================
   Force Twenty Twenty-One contrast focus branches off
   for these two card families.
   ========================================================= */

.has-background-white
.site
.usp-home-maker-card:focus,
.is-dark-theme
.site
.usp-home-maker-card:focus {
background: #ffffff !important;
background-color: #ffffff !important;

color: #17233b !important;

text-decoration: none !important;
}

.has-background-white
.site
.usp-home-product-card__link:focus,
.is-dark-theme
.site
.usp-home-product-card__link:focus {
background: transparent !important;
background-color: transparent !important;

color: inherit !important;

text-decoration: none !important;
}

/* =========================================================
   Desktop primary search CTA v1

   >= 893px only.
   Same design identity as mobile:
   blue background / white text / no decorative motion.
   ========================================================= */

@media only screen and (min-width: 893px) {

    .site-header
    .primary-navigation
    > div
    > .menu-wrapper
    > li.usp-menu-search
    > a,

    .site-header
    .primary-navigation
    > div
    > .menu-wrapper
    > li.usp-menu-search
    > a:link,

    .site-header
    .primary-navigation
    > div
    > .menu-wrapper
    > li.usp-menu-search
    > a:visited,

    .site-header
    .primary-navigation
    > div
    > .menu-wrapper
    > li.usp-menu-search
    > a:hover,

    .site-header
    .primary-navigation
    > div
    > .menu-wrapper
    > li.usp-menu-search
    > a:active,

    .site-header
    .primary-navigation
    > div
    > .menu-wrapper
    > li.usp-menu-search
    > a:focus,

    .site-header
    .primary-navigation
    > div
    > .menu-wrapper
    > li.usp-menu-search
    > a:focus-visible,

    .site-header
    .primary-navigation
    > div
    > .menu-wrapper
    > li.usp-menu-search.current-menu-item
    > a,

    .site-header
    .primary-navigation
    > div
    > .menu-wrapper
    > li.usp-menu-search.current_page_item
    > a {

        display: inline-flex !important;

        min-height: 42px !important;

        align-items: center !important;
        justify-content: center !important;

        margin: 0 !important;
        padding: 10px 17px !important;

        border: 0 !important;
        border-radius: 10px !important;

        background: #2368c9 !important;
        background-color: #2368c9 !important;
        background-image: none !important;

        color: #ffffff !important;

        font-weight: 700 !important;
        line-height: 1.2 !important;
        white-space: nowrap !important;

        text-decoration: none !important;
        text-decoration-line: none !important;

        outline: 0 !important;
        outline-offset: 0 !important;

        box-shadow: none !important;

        transform: none !important;
        transition: none !important;
        animation: none !important;

        -webkit-tap-highlight-color: transparent !important;
    }

    /* Mouse / touch focus remains completely silent. */

    .site-header
    .primary-navigation
    > div
    > .menu-wrapper
    > li.usp-menu-search
    > a:focus:not(:focus-visible) {
        outline: 0 !important;
        box-shadow: none !important;
    }

    /* Keyboard navigation only:
       quiet solid ring, never dotted or black. */

    .site-header
    .primary-navigation
    > div
    > .menu-wrapper
    > li.usp-menu-search
    > a:focus-visible {
        outline: 2px solid #b8d3f4 !important;
        outline-offset: 2px !important;
    }
}