/**
 * Anan Search Notify
 *
 * The empty-results panel on the advanced search page. Follows the Anan Phuket
 * Taupe direction: one card elevation, one 10px radius, Fraunces for the line of
 * display copy and Montserrat for everything else. The button itself is the
 * theme's own .wpresidence_button, so it stays identical to every other button
 * on the page.
 *
 * The paragraph rules are written as `.anan-sn p.<class>` on purpose. The theme
 * sets its own font stack through `p:not(.elementor-widget-container p)`, whose
 * :not() argument gives it more specificity than a lone class would carry, so a
 * flat `.anan-sn__title` silently loses its serif and drops back to 14px body.
 */

.anan-sn {
    background: #FFFFFF;
    border-radius: 10px;
    padding: 25px;
    box-shadow: rgba(37, 42, 44, 0.08) 0 10px 27px;
    margin: 16px 0 25px;
    max-width: 640px;
}

.anan-sn p.anan-sn__title {
    font-family: Fraunces, Georgia, serif;
    font-weight: 500;
    font-size: 22px;
    line-height: 1.1;
    color: #252A2C;
    margin: 0 0 10px;
}

.anan-sn p.anan-sn__text {
    font-family: Montserrat, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 1.65;
    color: #5C727D;
    margin: 0 0 16px;
}

/* Sits inline rather than stretching, and never inherits a block button width. */
.anan-sn button.anan-sn__button.wpresidence_button {
    display: inline-block;
    width: auto;
    margin: 0;
}

/* Motion is low in this direction: a plain fade, nothing else. */
@media (prefers-reduced-motion: no-preference) {
    .anan-sn {
        animation: anan-sn-fade 0.2s ease-out both;
    }
}

@keyframes anan-sn-fade {
    from { opacity: 0; }
    to   { opacity: 1; }
}

@media (max-width: 767px) {
    .anan-sn {
        padding: 16px;
    }

    .anan-sn p.anan-sn__title {
        font-size: 20px;
    }

    .anan-sn button.anan-sn__button.wpresidence_button {
        display: block;
        width: 100%;
    }
}