/* Phone-friendly overrides — loaded after responsive.css so these win.
   Remove the <link> in header.php to roll back. */

/* The logo is a stacked, near-square mark sized as a % of the navbar, which
   made the header ~120px tall. Size it by height instead (all pages). */
header .headermn .navbar .navbar-brand,
.sticky .headermn .navbar .navbar-brand {width: auto;}
header .headermn .navbar .navbar-brand img {width: auto; height: 60px;}

/* third side tab (Site Visit) below WhatsApp + Call on desktop */
.quickcontact-1 li .call-1.call-3 {top: 63%; background-color: #c9a24b;}

@media (max-width:767px) {
    header .headermn .navbar .navbar-brand,
    .sticky .headermn .navbar .navbar-brand {width: auto;}
    header .headermn .navbar .navbar-brand img {height: 50px;}
}

@media (max-width:767px) {

    /* room for the bottom action bar so it never hides the footer */
    body {padding-bottom: 56px;}

    /* the side WhatsApp / Call tabs covered text in every section on phones;
       turn them into a fixed bottom bar instead */
    .quickcontact-1 ul {position: fixed; left: 0; right: 0; bottom: 0; z-index: 1040; display: flex; margin: 0; padding: 0; background: #fff; box-shadow: 0 -6px 22px rgba(6, 28, 55, .15);}
    .quickcontact-1 li {flex: 1 1 0; min-width: 0; margin: 0;}
    .quickcontact-1 li .call-1,
    .quickcontact-1 li .call-1.call-2 {position: static; width: 100%; height: 56px; display: flex; align-items: center; justify-content: center; gap: 9px; padding: 0; border-radius: 0; background: #25d366; color: #fff; font-weight: 700; font-size: 15px; text-decoration: none;}
    .quickcontact-1 li .call-1.call-2 {background: #0a4273;}
    .quickcontact-1 li .call-1 i {width: auto; height: auto; line-height: 1; background: transparent; color: #fff; font-size: 20px;}
    .quickcontact-1 li .call-1::after {content: "WhatsApp";}
    .quickcontact-1 li .call-1.call-2::after {content: "Call";}
    .quickcontact-1 li .call-1.call-3 {background: #c9a24b; color: #3d2c07;}
    .quickcontact-1 li .call-1.call-3 i {color: #3d2c07;}
    .quickcontact-1 li .call-1.call-3::after {content: "Site Visit";}

    /* justified text leaves big gaps between words on a narrow screen */
    #about .content .text {text-align: left; font-size: 15px; line-height: 1.75;}

    #counter h2 {font-size: 21px; line-height: 1.35;}

    /* footer: centred brand block, 2-column quick links, aligned contact rows */
    footer .footertop {padding: 40px 0 8px;}
    footer .row {row-gap: 28px;}
    footer .footertop .about {text-align: center;}
    footer .footertop .about img {width: 110px;}
    footer .footertop .schedule-btn a {margin: 16px 0 0; padding: 11px 26px; font-size: 15px;}
    footer .footertop .about p {width: 100%; max-width: 34ch; margin: 14px auto 0; font-size: 14px; line-height: 1.6; color: #4a5b73;}
    footer .footertop h3 {font-size: 18px; font-weight: 700; color: #0a4273; margin-bottom: 12px; padding-bottom: 8px; border-bottom: 2px solid #e3eaf3;}
    footer .footertop ul {padding: 0; margin: 0;}
    footer .footertop .col-md-3 ul {display: grid; grid-template-columns: 1fr 1fr; gap: 6px 16px;}
    footer .footertop .col-md-3 ul li {margin: 0;}
    footer .footertop ul li a {font-size: 14.5px; padding: 4px 0;}
    footer .footertop .addres li {display: flex; gap: 12px; align-items: flex-start; margin: 0 0 14px; font-size: 14px; line-height: 1.55;}
    footer .footertop .addres li i {font-size: 16px; width: 18px; flex: 0 0 18px; text-align: center; margin-top: 3px;}
    footer .footerboo {padding: 4px 0 20px;}
    footer .footerboo ul {display: flex; flex-direction: column; align-items: center; gap: 14px; border-top: 1px solid #d5e0ee; padding-top: 18px;}
    footer .footerboo ul li:first-child {display: flex; gap: 10px; justify-content: center; margin: 0;}
    footer .footerboo .soical li:first-child a {width: 38px; height: 38px; line-height: 38px;}
}