/*
Theme Name: ConstiColite Child
Template: consticolite
*/

/* Existing custom CSS */
#main-menu li a{
    display: flex;
    gap: 23px;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .06em;
    flex: 1;
    justify-content: center;
    color: #0b3f6d;
}
.nowrap h2{
    white-space: nowrap !important;
}
.no-word-break {
    word-break: normal;
    overflow-wrap: normal;
    hyphens: none;
}

.keep-together {
    white-space: nowrap;
}

.trust .elementor-container{
    background: #0b3f6d;
    color: #fff;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    padding: 24px 6%;
    gap: 18px;
}

.trust .elementor-container .elementor-column.elementor-col-25{
    width:auto;
}

.trust .elementor-container .elementor-element-populated{
    padding:0 !important;
}

.trust .elementor-container .elementor-widget-text-editor{
    margin: 0;
    margin-top: 6px;
}

.trust .elementor-container .elementor-widget-text-editor p,
#advantage .elementor-widget-text-editor p {
    margin: 0;
}

.trust .elementor-container .elementor-column{
    text-align: center;
    border-right: 1px solid rgba(255, 255, 255, .18);
}

.trust .elementor-container .elementor-column:last-child{
    border:0;
}

#support, #distribution, #build{
    background-image:none !important;
}

.mapline {
    height: 6px;
    background: #d5e3eb;
    margin: 45px auto 22px;
    max-width: 680px;
    position: relative;
}

.dot {
    position: absolute;
    width: 18px;
    height: 18px;
    background: #00b8dc;
    border: 4px solid #fff;
    border-radius: 50%;
    top: -6px;
    left: 24%;
    box-shadow: 0 0 0 3px #00b8dc;
}

.top_panel_banner{
    display:none !important;
}

/*** footer ***/
#toTop{
    color:#00B8DC !important;
}
.site-footer {
    background: #07233b;
    color: #a8bdca !important;
    padding: 15px 6%;
    display: flex;
    justify-content: space-between;
    gap: 30px;
    font-size: 12px;
}
.site-footer .container{
    margin-left: 0 !important;
    padding-left: 0 !important;
    margin-right: 0 !important;
    padding-right: 0 !important;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.footer-menu li{
    display: inline-block;
    list-style: none;
    margin-right: 10px;
    font-size: 13px;
}
.footer-menu li a, .footer-menu li a:hover, .footer-menu li a:focus{
    color: #a8bdca !important;
}
body:not(.page-template-fullwidth-content) .site-content{
    margin-bottom: 0;
}
.site-footer{
    background-color: #07233b;
    color: #fff;
}
.site-footer strong {
    color: white;
    font-size: 19px;
}
/* =========================================================
   Header Search
   ========================================================= */

.site-header__wrap .space-between-content {
    display: flex;
    align-items: center;
}

.site-header__wrap .site-branding {
    flex: 0 0 auto;
}

.site-header__wrap .main-navigation {
    flex: 1 1 auto;
}

.header-search {
    flex: 0 0 auto;
    margin-left: 20px;
}

.header-search .search-form {
    display: flex;
    align-items: center;
    margin: 0;
}

.header-search .search-form label {
    margin: 0;
}

.header-search .search-form__field {
    width: 180px;
    height: 38px;
    padding: 0 12px;
    box-sizing: border-box;
    border: 1px solid #d5d5d5;
    border-radius: 3px 0 0 3px;
    background: #fff;
}

.header-search .search-form__submit {
    width: 42px;
    height: 38px;
    padding: 0;
    margin: 0;
    border-radius: 0 3px 3px 0;
    display: flex;
    align-items: center;
    justify-content: center;
}


/* =========================================================
   Medium screens
   ========================================================= */

@media (max-width: 1100px) {

    .header-search {
        margin-left: 10px;
    }

    .header-search .search-form__field {
        width: 140px;
    }

    .main-navigation li a {
        padding-left: 8px;
        padding-right: 8px;
    }
}

@media (min-width: 1200px) {
    .container {
        max-width: 100%;
        padding-left: 7%;
        padding-right: 7%;
    }
}
/* =========================================================
   Mobile
   ========================================================= */

@media (max-width: 767px) {

    .site-header__wrap .space-between-content {
        flex-wrap: wrap;
    }

    .header-search {
        width: 100%;
        margin: 15px 0 0;
        order: 3;
    }

    .header-search .search-form {
        width: 100%;
    }

    .header-search .search-form__field {
        width: auto;
        flex: 1 1 auto;
    }

    .header-search .search-form__submit {
        flex: 0 0 42px;
    }
}

/* True 3-column header */
.site-header__wrap > .space-between-content {
    display: grid !important;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 30px;
}

/* Logo stays on left */
.site-header__wrap .site-branding {
    justify-self: start;
}

/* Navigation is genuinely centered */
.site-header__wrap .main-navigation {
    flex: none !important;
    justify-self: center;
}

/* Search stays on right */
.site-header__wrap .header-search {
    justify-self: end;
    width: 240px;
}
.site-header .site-header__wrap{
    color: #0b3f6d !important;
}
/* Search form */
.site-header__wrap .header-search .search-form {
    display: flex;
    align-items: center;
    margin: 0;
}

.site-header__wrap .header-search .search-form__field {
    width: 200px;
    height: 40px;
    box-sizing: border-box;
}

.site-header__wrap .header-search .search-form__submit {
    height: 40px;
    flex: 0 0 auto;
}

@media (max-width: 768px) {
    .site-header__wrap > .space-between-content {
        display: flex !important;
        flex-wrap: wrap;
        gap: 15px;
    }

    .site-header__wrap .main-navigation {
        flex: 1 1 auto !important;
    }

    .site-header__wrap .header-search {
        width: 100%;
        order: 3;
    }

    .site-header__wrap .header-search .search-form__field {
        width: 100%;
    }

}

/* ============================================================
   4R Waterworks — Search Results Page Styles
   ------------------------------------------------------------
   HOW TO INSTALL (pick ONE):
   A) Append this whole file to the child theme's style.css
      (wp-content/themes/consticolite-child/style.css), or
   B) Enqueue it in the child theme's functions.php:
      add_action( 'wp_enqueue_scripts', function () {
          wp_enqueue_style( 'fourr-search', get_stylesheet_directory_uri() . '/search-results-styles.css', array(), '1.0.0' );
      }, 30 );

   Scoped to body.search so it never touches other pages.
   ============================================================ */

body.search .search-hero{
    background:linear-gradient(180deg,#f4f8fb 0%,#fff 100%);
    padding:56px 0 44px;
    border-bottom:1px solid #dbe5ee;
}
body.search .search-hero__inner{
    display:grid;grid-template-columns:1.2fr .8fr;gap:48px;align-items:end;
}
body.search .search-eyebrow{
    display:inline-block;font-size:12px;font-weight:800;letter-spacing:.22em;color:#00b8dc;
    text-transform:uppercase;margin-bottom:14px;position:relative;padding-left:26px;
}
body.search .search-eyebrow::before{
    content:"";position:absolute;left:0;top:50%;width:18px;height:2px;background:#00b8dc;transform:translateY(-50%);
}
body.search .search-hero h1,
body.search .search-page-title{
    font-size:clamp(28px,4.2vw,44px);font-weight:800;color:#0b3f6d;line-height:1.15;
    letter-spacing:-.01em;margin:0 0 14px;text-wrap:balance;
}
body.search .search-hero h1 span{color:#00b8dc}
body.search .result-count{font-size:13px;font-weight:600;color:#64748b;letter-spacing:.02em;margin:0}
body.search .result-count b{color:#0b3f6d;font-weight:800}

/* refined search box */
body.search .hero-search{max-width:560px}
body.search .hero-search .search-form{
    display:flex;box-shadow:0 10px 30px rgba(11,63,109,.08);border-radius:6px;overflow:hidden;background:#fff;margin:0;
}
body.search .hero-search .search-form__field{
    flex:1;height:56px;padding:0 20px;border:2px solid #dbe5ee;border-right:0;border-radius:6px 0 0 6px;
    font-family:Montserrat,"Segoe UI",Arial,sans-serif;font-size:15px;font-weight:500;color:#3b3d42;
    outline:none;width:auto;transition:border-color .2s;
}
body.search .hero-search .search-form__field:focus{border-color:#00b8dc}
body.search .hero-search .search-form__submit{
    flex:0 0 132px;height:56px;border:0;border-radius:0 6px 6px 0;background:#0b3f6d;color:#fff;
    font-family:inherit;font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
    cursor:pointer;padding:0;margin:0;transition:background .2s;
}
body.search .hero-search .search-form__submit:hover{background:#00b8dc}
body.search .hero-search .popular{
    margin-top:14px;font-size:12px;color:#64748b;display:flex;flex-wrap:wrap;gap:8px;align-items:center;
}
body.search .hero-search .popular span{font-weight:700;letter-spacing:.04em}
body.search .hero-search .popular a{
    padding:4px 12px;border:1px solid #dbe5ee;border-radius:99px;color:#0b3f6d;font-weight:600;
    transition:border-color .2s,color .2s,background .2s;
}
body.search .hero-search .popular a:hover{border-color:#00b8dc;color:#00b8dc;background:#e7f7fb}

/* results list */
body.search .search-results{padding:44px 0 60px}
body.search .results-head{display:flex;align-items:baseline;justify-content:space-between;gap:20px;margin-bottom:22px}
body.search .results-head .hint{font-size:12px;font-weight:600;color:#64748b;letter-spacing:.05em;margin:0}
body.search .results-head .hint b{color:#0b3f6d}

body.search .result-card{
    background:#fff;border:1px solid #dbe5ee;border-radius:6px;padding:26px 30px;margin-bottom:16px;
    transition:border-color .2s,box-shadow .2s,transform .2s;
}
body.search .result-card:hover{border-color:#00b8dc;box-shadow:0 10px 30px rgba(11,63,109,.08);transform:translateY(-2px)}
body.search .result-badge{
    display:inline-block;font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
    color:#0b3f6d;background:#e7f7fb;border:1px solid #bdeaf3;border-radius:99px;padding:3px 12px;margin-bottom:12px;
}
body.search .result-badge.legal{background:#eef2f6;border-color:#d7e0e9;color:#4a5a6a}
body.search .result-card h3,
body.search .result-title{
    font-size:21px;font-weight:700;color:#0b3f6d;line-height:1.3;margin:0 0 8px;letter-spacing:-.01em;
}
body.search .result-card h3 a,
body.search .result-title a{color:#0b3f6d;transition:color .2s}
body.search .result-card h3 a:hover,
body.search .result-title a:hover{color:#00b8dc;text-decoration:underline;text-underline-offset:4px;text-decoration-color:#bdeaf3}
body.search .result-excerpt{
    font-size:14.5px;color:#3b3d42;margin:0 0 16px;max-width:820px;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
body.search .result-meta{
    display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
    padding-top:14px;border-top:1px dashed #dbe5ee;
}
body.search .result-path{font-size:12px;color:#64748b;font-weight:500;letter-spacing:.02em;word-break:break-all}
body.search .result-path .crumb{color:#b3c2cf}
body.search .result-link{
    font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#0b3f6d;white-space:nowrap;
    display:inline-flex;align-items:center;gap:6px;transition:color .2s;
}
body.search .result-link:hover{color:#00b8dc}
body.search .result-link .arr{font-size:14px;transition:transform .2s}
body.search .result-card:hover .result-link .arr{transform:translateX(4px)}

/* pagination (WordPress core markup) */
body.search .navigation.pagination{display:flex;justify-content:center;align-items:center;gap:10px;margin-top:36px;text-align:center}
body.search .navigation.pagination .nav-links{display:flex;gap:10px;justify-content:center;align-items:center;border:0}
body.search .page-numbers{
    min-width:42px;height:42px;padding:0 14px;display:inline-flex;align-items:center;justify-content:center;
    border:1px solid #dbe5ee;border-radius:6px;font-size:13px;font-weight:700;color:#0b3f6d;line-height:1;
    transition:all .2s;
}
body.search .page-numbers.current{background:#0b3f6d;border-color:#0b3f6d;color:#fff}
body.search .page-numbers:not(.current):not(.dots):hover{border-color:#00b8dc;color:#00b8dc}
body.search .page-numbers .screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* empty state */
body.search .empty-state{text-align:center;padding:60px 20px 30px;border:1px solid #dbe5ee;border-radius:10px;background:#f4f8fb}
body.search .empty-icon{
    width:64px;height:64px;margin:0 auto 20px;border-radius:50%;background:#e7f7fb;
    display:flex;align-items:center;justify-content:center;
}
body.search .empty-icon svg{width:28px;height:28px;fill:#00b8dc}
body.search .empty-title{font-size:24px;font-weight:800;color:#0b3f6d;margin:0 0 10px}
body.search .empty-text{max-width:520px;margin:0 auto 26px;font-size:14.5px;color:#64748b}
body.search .suggestions{display:flex;justify-content:center;flex-wrap:wrap;gap:10px}
body.search .suggestions a{
    padding:8px 18px;border:1px solid #dbe5ee;border-radius:99px;font-size:13px;font-weight:700;color:#0b3f6d;
    background:#fff;transition:all .2s;
}
body.search .suggestions a:hover{border-color:#00b8dc;color:#00b8dc}

/* ============ Responsive ============ */
@media (max-width:820px){
    body.search .search-hero{padding:40px 0 34px}
    body.search .search-hero__inner{grid-template-columns:1fr;gap:28px}
    body.search .hero-search{max-width:100%}
    body.search .result-card{padding:22px}
    body.search .result-card h3,
    body.search .result-title{font-size:18px}
    body.search .hero-search .search-form__submit{flex-basis:104px}
}
@media (max-width:520px){
    body.search .hero-search .search-form{flex-direction:column;box-shadow:none}
    body.search .hero-search .search-form__field{border:2px solid #dbe5ee;border-radius:6px}
    body.search .hero-search .search-form__submit{width:100%;border-radius:6px;margin-top:8px}
}