* {
    box-sizing:border-box;
}


body {

    margin:0;
    font-family:Arial, Helvetica, sans-serif;
    background:#f5f7fa;

}



.page {

    min-height:100vh;

}



/* TOP 25% */

.search-panel {

    height:25vh;
    min-height:250px;

    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;

    background:white;

    border-bottom:1px solid #ddd;

}



h1 {

    margin:0;

    font-size:42px;

    color:#1c4f80;

}



.tagline {

    font-size:18px;

    color:#555;

    margin:10px 0 25px;

}



.search-box {

    display:flex;

    align-items:end;

    gap:20px;

}



.field {

    display:flex;

    flex-direction:column;

}



label {

    font-weight:bold;

    margin-bottom:6px;

}



select {

    width:220px;

    padding:12px;

    border-radius:6px;

    border:1px solid #aaa;

    font-size:16px;

}



.search-button {

    padding:13px 30px;

    background:#1c73b7;

    color:white;

    border:none;

    border-radius:6px;

    font-size:16px;

    cursor:pointer;

}



.search-button:hover {

    background:#15598d;

}



/* BOTTOM 75% */


.results-panel {

    height:75vh;

    padding:35px 8%;

}



.results-panel h2 {

    text-align:center;

    color:#333;

}



.empty-results {

    margin-top:40px;

    background:white;

    padding:40px;

    text-align:center;

    border-radius:8px;

    box-shadow:0 2px 8px rgba(0,0,0,.1);

}