/* LG CSS Library v0.5.6 */

/* Midrand Airconditioning &#8211; Site Styles */
/* Midrand Airconditioning Systems v1.1
   Uses Flatsome theme colours: Primary #000967, Secondary black, Alert #f20001. */
.mas-eyebrow{margin:0 0 10px;font-size:.78rem;line-height:1.3;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--fs-color-alert);}
.mas-eyebrow-light{color:#fff;}
.mas-section-lead{max-width:760px;margin-left:auto;margin-right:auto;color:#667085;}
.mas-hero,.mas-page-hero{position:relative;overflow:hidden;}
.mas-hero:before,.mas-page-hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,9,103,.88),rgba(0,9,103,.56) 48%,rgba(0,0,0,.08));pointer-events:none;}
.mas-hero .section-content,.mas-page-hero .section-content{position:relative;z-index:2;}
.mas-hero-row,.mas-page-hero .row{min-height:100%;align-items:center;}
.mas-hero-copy h2{font-size:clamp(2.6rem,5vw,4.8rem);line-height:1.02;color:#fff;margin:0 0 20px;}
.mas-page-hero-copy h2{font-size:clamp(2.25rem,4vw,3.7rem);line-height:1.06;color:#fff;margin:0 0 14px;}
.mas-hero-lead,.mas-page-hero-copy>p:last-child{max-width:720px;font-size:1.12rem;line-height:1.65;color:#fff;}
.mas-btn{margin-top:10px;margin-right:8px;}
.mas-btn-outline{border-color:#fff!important;color:#fff!important;}
.mas-highlight-card>.col-inner{background:#fff;border-radius:18px;padding:36px!important;border-top:4px solid var(--fs-color-alert);box-shadow:0 16px 45px rgba(0,9,103,.11);}
.mas-card-row>.col,.mas-value-row>.col,.mas-team-row>.col{display:flex;}
.mas-service-card>.col-inner,.mas-contact-card>.col-inner{width:100%;height:100%;background:#fff;border-radius:18px;padding:30px 26px;box-shadow:0 12px 36px rgba(0,9,103,.09);border:1px solid rgba(0,9,103,.06);transition:transform .25s ease,box-shadow .25s ease;}
.mas-service-card>.col-inner:hover,.mas-contact-card>.col-inner:hover{transform:translateY(-5px);box-shadow:0 18px 44px rgba(0,9,103,.14);}
.mas-service-card .icon-box-img,.mas-value-row .icon-box-img,.mas-contact-card .icon-box-img{margin-bottom:16px;}
.mas-service-card .icon-box-img img,.mas-value-row .icon-box-img img,.mas-contact-card .icon-box-img img,.mas-mini-grid .icon-box-img img,.mas-support-grid .icon-box-img img,.mas-branch-card .icon-box-img img{object-fit:contain!important;}
.mas-rounded-image img{width:100%;border-radius:18px;box-shadow:0 18px 44px rgba(0,0,0,.13);}
.mas-mini-grid{margin-top:26px;margin-bottom:18px;}
.mas-mini-grid .icon-box{text-align:center;}
.mas-mini-grid h3{font-size:.9rem;text-transform:uppercase;letter-spacing:.05em;}
.mas-why h2,.mas-why h3,.mas-why p,.mas-support-grid h2,.mas-support-grid h3,.mas-support-grid p{color:#fff;}
.mas-why .icon-box,.mas-support-grid .icon-box{padding:20px 14px;}
.mas-brand-list{font-weight:600;line-height:2;color:var(--fs-color-primary);}
.mas-branch-card>.col-inner{height:100%;background:#fff;border-radius:18px;padding:30px;box-shadow:0 12px 34px rgba(0,9,103,.08);}
.mas-branch-card-dark>.col-inner{background:rgba(255,255,255,.09);box-shadow:none;border:1px solid rgba(255,255,255,.16);}
.mas-branch-card-dark h3,.mas-branch-card-dark p{color:#fff;}
.mas-final-cta h2,.mas-final-cta p{color:#fff;margin-bottom:5px;}
.mas-final-cta .button{box-shadow:0 8px 20px rgba(0,0,0,.12);}
.mas-team-group{margin:38px 0 20px;padding:0 0 10px;border-bottom:2px solid var(--fs-color-alert);font-size:1.35rem;}
.mas-team-col>.col-inner{width:100%;}
.mas-team-member{width:100%;height:100%;background:#fff;border-radius:18px;padding:14px 14px 24px;box-shadow:0 10px 32px rgba(0,9,103,.09);text-align:center;overflow:hidden;}
.mas-team-member .box-image,.mas-team-member .box-image img{width:100%!important;max-width:none!important;}
.mas-team-member .box-image img{aspect-ratio:1/1;object-fit:cover;border-radius:13px;}
.mas-team-member .box-text{padding:18px 8px 0!important;}
.mas-team-member .box-text h4,.mas-team-member .box-text .uppercase{color:var(--fs-color-primary);font-weight:700;}
.mas-team-member .box-text p{margin-bottom:0;color:#667085;}
.mas-check-list{list-style:none;margin-left:0;}
.mas-check-list li{position:relative;padding:9px 0 9px 29px;border-bottom:1px solid #e9ecf3;}
.mas-check-list li:before{content:"✓";position:absolute;left:0;top:9px;color:var(--fs-color-alert);font-weight:800;}
.mas-service-detail .col-inner{padding-top:8px;padding-bottom:8px;}
.mas-form-placeholder>.col-inner{background:#fff;border-radius:18px;padding:38px;min-height:300px;box-shadow:0 12px 36px rgba(0,9,103,.08);border-top:4px solid var(--fs-color-alert);}
.mas-service-area h2,.mas-service-area h3,.mas-service-area p{color:#fff;}
.mas-contact-card .icon-box{height:100%;}
@media(max-width:849px){
 .mas-hero:before,.mas-page-hero:before{background:rgba(0,9,103,.72);}
 .mas-hero-copy h2{font-size:2.65rem;}
 .mas-highlight-card>.col-inner{padding:28px!important;margin-top:20px;}
 .mas-team-member{margin-bottom:18px;}
}
@media(max-width:549px){
 .mas-service-card>.col-inner,.mas-contact-card>.col-inner{padding:24px 20px;}
 .mas-hero-copy h2{font-size:2.25rem;}
 .mas-hero-lead{font-size:1rem;}
 .mas-final-cta .col{text-align:left!important;}
}
/* =========================================================
   MIDRAND AIRCONDITIONING SYSTEMS
   FINAL SITE STYLES v1.4
   ========================================================= */

/* Normal content photography: 15px */
.mas-rounded-image,
.mas-rounded-image .img,
.mas-rounded-image .img-inner,
.mas-rounded-image img,
.mas-intro .img,
.mas-intro .img-inner,
.mas-intro img,
.mas-story .img,
.mas-story .img-inner,
.mas-story img,
.mas-service-detail .img,
.mas-service-detail .img-inner,
.mas-service-detail img,
.mas-appliance-intro .img,
.mas-appliance-intro .img-inner,
.mas-appliance-intro img,
.mas-appliance-support .img,
.mas-appliance-support .img-inner,
.mas-appliance-support img {
  border-radius:15px !important;
}
.mas-rounded-image,
.mas-rounded-image .img-inner {
  overflow:hidden;
}
.mas-rounded-image img {
  width:100%;
  transition:transform .35s ease;
}
.mas-rounded-image:hover img {
  transform:scale(1.025);
}

/* Hero titles */
.mas-hero-copy h2,
.mas-page-hero-copy h2 {
  font-size:clamp(2.5rem,4vw,4rem) !important;
  line-height:1.05 !important;
  letter-spacing:-.03em;
  font-weight:700;
  color:#fff;
  margin-bottom:16px;
}

/* Universal visual card treatment for intended card classes */
.mas-service-card > .col-inner,
.mas-highlight-card > .col-inner,
.mas-branch-card > .col-inner,
.mas-contact-card > .col-inner,
.mas-form-placeholder > .col-inner {
  background:#fff;
  border:1px solid rgba(0,9,103,.08);
  border-radius:18px;
  box-shadow:0 12px 34px rgba(0,9,103,.09);
  overflow:hidden;
}

/* Service cards */
.mas-service-card > .col-inner {
  height:100%;
  padding:30px 26px;
  position:relative;
  transition:transform .22s ease,box-shadow .22s ease;
}
.mas-service-card > .col-inner:hover {
  transform:translateY(-5px);
  box-shadow:0 18px 44px rgba(0,9,103,.14);
}
.mas-service-card > .col-inner:after {
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:4px;
  background:linear-gradient(90deg,#000967,#f20001);
}
.mas-service-card h3 {
  color:#000967;
}

/* Value cards */
.mas-values .icon-box {
  height:100%;
  padding:26px 18px;
  background:#fff;
  border:1px solid rgba(0,9,103,.07);
  border-radius:18px;
  box-shadow:0 10px 30px rgba(0,9,103,.07);
  transition:transform .22s ease,box-shadow .22s ease;
}
.mas-values .icon-box:hover {
  transform:translateY(-4px);
  box-shadow:0 16px 38px rgba(0,9,103,.12);
}

/* Team cards */
.mas-team-col > .col-inner {
  height:100%;
}
.mas-team-member {
  width:100%;
  height:100%;
  padding:20px 16px 22px;
  background:#fff;
  border:1px solid rgba(0,9,103,.08);
  border-radius:18px;
  box-shadow:0 10px 30px rgba(0,9,103,.08);
  text-align:center;
  transition:transform .22s ease,box-shadow .22s ease;
}
.mas-team-member:hover {
  transform:translateY(-4px);
  box-shadow:0 18px 42px rgba(0,9,103,.14);
}

/* Team portraits: strong Flatsome selectors, 99px rounding */
.mas-team-member .box-image,
.mas-team-member .box-image .image-cover,
.mas-team-member .box-image .image-cover img,
.mas-team-member .box-image img,
.mas-team-member .box-image .img-inner,
.mas-team-member .box-image .img-inner img {
  border-radius:99px !important;
}
.mas-team-member .box-image {
  width:82% !important;
  max-width:230px !important;
  margin-left:auto !important;
  margin-right:auto !important;
  overflow:hidden !important;
  background:#f4f5f8;
}
.mas-team-member .box-image img {
  width:100% !important;
  aspect-ratio:1/1;
  object-fit:cover !important;
}
.mas-team-member .box-text {
  padding:18px 6px 0 !important;
}
.mas-team-member .box-text h4,
.mas-team-member .box-text .uppercase {
  color:#000967;
  font-weight:700;
}
.mas-team-member .box-text p {
  color:#667085;
  margin-bottom:0;
}

/* Team group headings */
.mas-team-group {
  position:relative;
  margin:44px 0 22px;
  padding:0 0 10px 17px;
  border-bottom:1px solid #e8ebf1;
}
.mas-team-group:before {
  content:"";
  position:absolute;
  left:0;
  top:2px;
  bottom:12px;
  width:5px;
  border-radius:99px;
  background:#f20001;
}

/* Branch and contact cards */
.mas-branch-card > .col-inner,
.mas-contact-card > .col-inner {
  height:100%;
  padding:32px;
}
.mas-branch-card:not(.mas-branch-card-dark) > .col-inner {
  border-top:4px solid #000967;
}
.mas-contact-card > .col-inner {
  border-top:4px solid #000967;
}
.mas-contact-card:nth-child(even) > .col-inner {
  border-top-color:#f20001;
}

/* Dark branch cards retain dark treatment */
.mas-branch-card-dark > .col-inner {
  background:rgba(255,255,255,.09);
  border:1px solid rgba(255,255,255,.16);
  box-shadow:none;
}
.mas-branch-card-dark h3,
.mas-branch-card-dark p {
  color:#fff;
}

/* Dark feature sections */
.mas-why,
.mas-support-grid,
.mas-service-area {
  position:relative;
  overflow:hidden;
}
.mas-why:before,
.mas-support-grid:before,
.mas-service-area:before {
  content:"";
  position:absolute;
  width:420px;
  height:420px;
  right:-180px;
  top:-250px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:50%;
  box-shadow:
    0 0 0 70px rgba(255,255,255,.025),
    0 0 0 140px rgba(255,255,255,.015);
  pointer-events:none;
}
.mas-why .section-content,
.mas-support-grid .section-content,
.mas-service-area .section-content {
  position:relative;
  z-index:2;
}

/* Brand panel */
.mas-brand-list {
  display:inline-block;
  max-width:980px;
  padding:16px 24px;
  background:#f7f8fb;
  border:1px solid #edf0f5;
  border-radius:15px;
  color:#000967;
  font-weight:600;
  line-height:2;
}

/* Buttons */
.mas-btn,
.mas-final-cta .button,
.mas-contact-card .button {
  border-radius:99px !important;
  font-weight:700;
  transition:transform .2s ease,box-shadow .2s ease;
}
.mas-btn:hover,
.mas-final-cta .button:hover,
.mas-contact-card .button:hover {
  transform:translateY(-2px);
  box-shadow:0 10px 24px rgba(0,0,0,.16);
}

/* Responsive */
@media(max-width:849px) {
  .mas-hero-copy h2,
  .mas-page-hero-copy h2 {
    font-size:2.35rem !important;
  }
  .mas-team-member .box-image {
    width:86% !important;
  }
}
@media(max-width:549px) {
  .mas-hero-copy h2,
  .mas-page-hero-copy h2 {
    font-size:2rem !important;
  }
  .mas-team-member .box-image {
    width:88% !important;
  }
  .mas-service-card > .col-inner,
  .mas-branch-card > .col-inner,
  .mas-contact-card > .col-inner {
    padding:24px 20px;
  }
}

/* ==========================================
   MIDRAND - TEAM PROFILE IMAGES
   Perfect circular portraits
   ========================================== */

.mas-team-member .box-image {
    width: 82% !important;
    max-width: 230px !important;
    aspect-ratio: 1 / 1;
    margin: 0 auto !important;
    border-radius: 50% !important;
    overflow: hidden !important;
}

.mas-team-member .box-image .box-image-inner {
    width: 100% !important;
    border-radius: 50% !important;
    overflow: hidden !important;
}

.mas-team-member .box-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: 50% !important;
}

/* menu Bounce */
/* ==========================================
   FLATSOME HEADER MENU
   Bounce + Animated Underline
   Little Goliath Web
   ========================================== */

/* Main menu links */
.header-nav.nav > li > a {
    position: relative;
    transition: transform 0.3s ease;
}

/* Animated underline */
.header-nav.nav > li > a::after {
    content: "";
    position: absolute;
    bottom: -1px; /* ADJUST THIS VALUE */
    left: 50%;
    width: 0;
    height: 3px;
    background-color: #e62621;
    border-radius: 10px;
    transform: translateX(-50%);
    transition: width 0.3s ease;
    pointer-events: none;
}

/* Underline on hover and active page */
.header-nav.nav > li:hover > a::after,
.header-nav.nav > li.active > a::after,
.header-nav.nav > li.current-menu-item > a::after,
.header-nav.nav > li.current-menu-ancestor > a::after {
    width: 100%;
}

/* Bounce animation on hover */
.header-nav.nav > li:hover > a {
    animation: lg-menu-bounce 0.45s ease;
}

/* Bounce keyframes */
@keyframes lg-menu-bounce {
    0% {
        transform: translateY(0);
    }

    35% {
        transform: translateY(-5px);
    }

    65% {
        transform: translateY(2px);
    }

    100% {
        transform: translateY(0);
    }
}

/* Accessibility: Reduced motion */
@media (prefers-reduced-motion: reduce) {

    .header-nav.nav > li > a {
        animation: none !important;
        transition: none !important;
    }

    .header-nav.nav > li > a::after {
        transition: none !important;
    }
}

/* Flatsome Header Menu - Subtle Subtitle Shadow */
.header-nav.nav > li > a {
    text-shadow:
        0 1px 2px rgba(0, 0, 0, 0.45),
        0 0 3px rgba(0, 0, 0, 0.15);
}
