.search-pet-body{
    background:#f5f8fb;
}

.search-pet-page{
    min-height:70vh;
}

.search-pet-container{
    width:min(900px,calc(100% - 32px));
    margin:0 auto;
}

.search-pet-hero{
    padding:70px 20px;
    background:
        radial-gradient(
            circle at 18% 20%,
            rgba(21,150,83,.17),
            transparent 34%
        ),
        linear-gradient(135deg,#061b3a,#0c3159);
    color:#fff;
    text-align:center;
}

.search-pet-eyebrow{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:7px 12px;
    border:1px solid rgba(255,255,255,.22);
    border-radius:999px;
    background:rgba(255,255,255,.08);
    font-size:11px;
    font-weight:900;
    text-transform:uppercase;
}

.search-pet-hero h1{
    margin:17px 0 9px;
    font-size:46px;
    line-height:1.1;
}

.search-pet-hero > div > p{
    margin:0;
    color:#d4e1ed;
    font-size:17px;
}

.search-pet-form{
    display:flex;
    gap:9px;
    width:min(760px,100%);
    margin:28px auto 0;
}

.search-pet-form > div{
    flex:1;
    display:flex;
    align-items:center;
    padding:0 15px;
    border-radius:13px;
    background:#fff;
}

.search-pet-form > div i{
    color:#71859a;
}

.search-pet-form input{
    flex:1;
    min-width:0;
    padding:15px 11px;
    border:0;
    outline:0;
    color:#102b50;
    font:inherit;
}

.search-pet-form button{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    padding:0 22px;
    border:0;
    border-radius:13px;
    background:#159653;
    color:#fff;
    font:inherit;
    font-weight:900;
    cursor:pointer;
}

.search-pet-privacy-note{
    margin-top:13px !important;
    color:#aebfd0 !important;
    font-size:11px !important;
}

.search-pet-results{
    padding:42px 0 80px;
}

.search-pet-introduction,
.search-pet-empty,
.search-pet-private-result{
    padding:48px 30px;
    border:1px solid #dce5ed;
    border-radius:20px;
    background:#fff;
    box-shadow:0 16px 45px rgba(6,27,58,.08);
    text-align:center;
}

.search-pet-introduction > i,
.search-pet-empty > i,
.search-pet-status-icon{
    color:#159653;
    font-size:48px;
}

.search-pet-empty > i{
    color:#8298ac;
}

.search-pet-introduction h2,
.search-pet-empty h2,
.search-pet-private-result h2{
    margin:16px 0 7px;
    color:#071d3c;
}

.search-pet-introduction p,
.search-pet-empty p,
.search-pet-private-result p{
    color:#647b91;
    line-height:1.65;
}

.search-pet-empty a{
    display:inline-flex;
    margin-top:13px;
    padding:11px 16px;
    border-radius:9px;
    background:#159653;
    color:#fff;
    font-weight:900;
    text-decoration:none;
}

.search-pet-verified-badge{
    display:inline-flex;
    align-items:center;
    gap:6px;
    padding:6px 9px;
    border-radius:999px;
    background:#eaf8f0;
    color:#17613d;
    font-size:10px;
    font-weight:900;
}

.search-pet-private-result dl{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
    margin-top:24px;
    text-align:left;
}

.search-pet-private-result dl div,
.search-pet-details > div{
    padding:14px;
    border-radius:11px;
    background:#f5f8fb;
}

.search-pet-private-result dt,
.search-pet-details span,
.search-pet-description span{
    display:block;
    color:#71859a;
    font-size:10px;
    font-weight:900;
    text-transform:uppercase;
}

.search-pet-private-result dd{
    margin:6px 0 0;
    color:#12365d;
    font-weight:900;
}

.search-pet-result-card{
    display:grid;
    grid-template-columns:330px minmax(0,1fr);
    overflow:hidden;
    border:1px solid #dce5ed;
    border-radius:21px;
    background:#fff;
    box-shadow:0 18px 48px rgba(6,27,58,.10);
}

.search-pet-result-photo{
    position:relative;
    min-height:390px;
    background:#e7edf3;
}

.search-pet-result-photo img,
.search-pet-photo-placeholder{
    width:100%;
    height:100%;
    min-height:390px;
    display:flex;
    align-items:center;
    justify-content:center;
    object-fit:cover;
}

.search-pet-photo-placeholder{
    color:#8fa3b7;
    font-size:58px;
}

.search-pet-result-photo
.search-pet-verified-badge{
    position:absolute;
    left:15px;
    bottom:15px;
}

.search-pet-result-content{
    padding:32px;
}

.search-pet-register-id{
    color:#159653;
    font-size:11px;
    font-weight:900;
}

.search-pet-result-content h2{
    margin:6px 0 4px;
    color:#071d3c;
    font-size:34px;
}

.search-pet-summary{
    margin:0;
    color:#647b91;
}

.search-pet-details{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:11px;
    margin-top:24px;
}

.search-pet-details strong{
    display:block;
    margin-top:5px;
    color:#12365d;
}

.search-pet-details strong.is-missing{
    color:#dc2626;
}

.search-pet-details strong.is-safe{
    color:#159653;
}

.search-pet-description{
    margin-top:17px;
    padding:15px;
    border-left:4px solid #159653;
    border-radius:10px;
    background:#f2faf5;
}

.search-pet-description p{
    margin:6px 0 0;
    color:#506a83;
    line-height:1.6;
}

.search-pet-alert-button{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    margin-top:20px;
    padding:12px 16px;
    border-radius:10px;
    background:#dc2626;
    color:#fff;
    font-weight:900;
    text-decoration:none;
}

.search-pet-private-result
.search-pet-alert-button{
    margin-left:auto;
    margin-right:auto;
}

@media(max-width:720px){
    .search-pet-hero{
        padding:52px 16px;
    }

    .search-pet-hero h1{
        font-size:37px;
    }

    .search-pet-result-card{
        grid-template-columns:1fr;
    }

    .search-pet-result-photo,
    .search-pet-result-photo img,
    .search-pet-photo-placeholder{
        min-height:300px;
    }
}

@media(max-width:560px){
    .search-pet-form{
        flex-direction:column;
    }

    .search-pet-form button{
        min-height:50px;
    }

    .search-pet-private-result dl,
    .search-pet-details{
        grid-template-columns:1fr;
    }

    .search-pet-result-content{
        padding:23px 18px;
    }

    .search-pet-result-content h2{
        font-size:29px;
    }
}
