/* Marco Electricals — additions (Oct 2026): NHAI highlight, clients, events, real project gallery */
:root{--mc-orange:#e11b22;--mc-red:#e11b22;--mc-red-dark:#a50f15;--mc-navy:#1d2333;--mc-ink:#2b2f3a;--mc-muted:#6b7280;--mc-line:#e7e9ee}

/* NH-44 highlight band: highway photo under a red overlay */
.mc-nhai{position:relative;background:#a50f15 url("../images/projects/nh44-toll-plaza.jpg") 70% 55%/cover no-repeat;color:#fff;overflow:hidden}
.mc-nhai:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(200,18,26,.95) 0%,rgba(200,18,26,.88) 38%,rgba(200,18,26,.35) 62%,rgba(200,18,26,0) 82%)}
.mc-nhai__road{position:absolute;left:0;right:0;bottom:0;height:8px;background:repeating-linear-gradient(90deg,#ffcc00 0 46px,transparent 46px 80px);opacity:.85}
.mc-nhai .container{position:relative;padding-top:56px;padding-bottom:64px}
.mc-nhai__grid{display:grid;grid-template-columns:1.25fr 1fr;gap:44px;align-items:center}
.mc-nhai__badge{display:inline-flex;align-items:center;gap:8px;background:#fff;color:var(--mc-red);font:600 13px/1 Poppins,sans-serif;letter-spacing:.08em;text-transform:uppercase;padding:9px 14px;border-radius:3px}
.mc-nhai h2{font:600 clamp(28px,3.4vw,44px)/1.15 Poppins,sans-serif;color:#fff;margin:18px 0 14px}
.mc-nhai h2 span{color:#fff;text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:6px}
.mc-nhai p{color:#fff;font-size:17px;line-height:1.65;margin:0 0 22px;max-width:620px}
.mc-nhai__list{list-style:none;padding:0;margin:0 0 26px;display:grid;gap:12px}
.mc-nhai__list li{position:relative;padding-left:30px;color:#fff;font-size:16px;line-height:1.5}
.mc-nhai__list li:before{content:"";position:absolute;left:0;top:4px;width:18px;height:18px;border-radius:50%;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23e11b22'%3E%3Cpath d='M13 2 4 14h7l-1 8 9-12h-7z'/%3E%3C/svg%3E") center/11px no-repeat}
.mc-nhai__list b{color:#fff}
.mc-nhai__card{background:#fff;color:var(--mc-ink);border-radius:6px;padding:30px 28px;box-shadow:0 20px 50px rgba(0,0,0,.35);border-top:5px solid var(--mc-orange)}
.mc-nhai__card h3{font:600 20px/1.3 Poppins,sans-serif;margin:0 0 18px;color:var(--mc-ink)}
.mc-stat{display:flex;gap:16px;align-items:flex-start;padding:14px 0;border-bottom:1px dashed var(--mc-line)}
.mc-stat:last-child{border-bottom:0;padding-bottom:0}
.mc-stat__num{flex:0 0 74px;font:600 26px/1 Poppins,sans-serif;color:var(--mc-orange)}
.mc-stat__txt{font-size:15px;line-height:1.45;color:var(--mc-muted)}
.mc-stat__txt b{display:block;color:var(--mc-ink);font-size:16px}
@media (max-width:991px){.mc-nhai__grid{grid-template-columns:1fr;gap:30px}}

/* Clients */
.mc-clients{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.mc-client{background:#fff;border:1px solid var(--mc-line);border-radius:6px;overflow:hidden;display:flex;flex-direction:column;transition:transform .25s,box-shadow .25s}
.mc-client:hover{transform:translateY(-4px);box-shadow:0 16px 36px rgba(29,35,51,.14)}
.mc-client__img{position:relative;aspect-ratio:4/3;overflow:hidden;background:#eef0f4}
.mc-client__img img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.mc-client:hover .mc-client__img img{transform:scale(1.05)}
.mc-client__tag{position:absolute;left:14px;top:14px;background:var(--mc-orange);color:#fff;font:600 12px/1 Poppins,sans-serif;letter-spacing:.06em;text-transform:uppercase;padding:7px 10px;border-radius:3px}
.mc-client__body{padding:22px 22px 24px}
.mc-client__body h3{font:600 19px/1.3 Poppins,sans-serif;margin:0 0 8px;color:var(--mc-ink)}
.mc-client__body p{margin:0;color:var(--mc-muted);font-size:15px;line-height:1.6}
@media (max-width:991px){.mc-clients{grid-template-columns:1fr 1fr}}
@media (max-width:575px){.mc-clients{grid-template-columns:1fr}}

/* Project gallery (real photos) */
.mc-gallery{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-flow:dense;gap:14px}
.mc-gallery a{position:relative;display:block;aspect-ratio:1/1;overflow:hidden;border-radius:4px;background:#eef0f4}
.mc-gallery a.mc-wide{grid-column:span 2;aspect-ratio:2/1}
.mc-gallery img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.mc-gallery a:hover img{transform:scale(1.06)}
.mc-gallery figcaption{position:absolute;left:0;right:0;bottom:0;padding:26px 14px 12px;background:linear-gradient(transparent,rgba(0,0,0,.72));color:#fff;font:600 14px/1.3 Poppins,sans-serif}
@media (max-width:767px){.mc-gallery{grid-template-columns:1fr 1fr}.mc-gallery a.mc-wide{grid-column:span 2}}

/* Past event */
.mc-event{display:grid;grid-template-columns:minmax(260px,420px) 1fr;gap:48px;align-items:center;background:#f6f7f9;border-radius:8px;padding:38px}
.mc-event__poster{display:block;border-radius:6px;overflow:hidden;box-shadow:0 18px 40px rgba(29,35,51,.18)}
.mc-event__poster img{width:100%;display:block}
.mc-event__label{display:inline-block;background:var(--mc-ink);color:#fff;font:600 12px/1 Poppins,sans-serif;letter-spacing:.08em;text-transform:uppercase;padding:8px 12px;border-radius:3px}
.mc-event h3{font:600 clamp(24px,2.6vw,34px)/1.2 Poppins,sans-serif;color:var(--mc-ink);margin:16px 0 12px}
.mc-event h3 span{color:var(--mc-orange)}
.mc-event p{color:var(--mc-muted);font-size:16px;line-height:1.7;margin:0 0 20px}
.mc-event__meta{list-style:none;padding:0;margin:0 0 22px;display:grid;grid-template-columns:1fr 1fr;gap:14px}
.mc-event__meta li{background:#fff;border:1px solid var(--mc-line);border-radius:5px;padding:12px 14px;font-size:15px;color:var(--mc-ink);line-height:1.4}
.mc-event__meta small{display:block;color:var(--mc-muted);font-size:12px;text-transform:uppercase;letter-spacing:.06em;margin-bottom:3px}
.mc-event__chips{display:flex;flex-wrap:wrap;gap:8px}
.mc-event__chips span{border:1px solid var(--mc-orange);color:var(--mc-orange);border-radius:30px;padding:6px 12px;font-size:13px}
@media (max-width:991px){.mc-event{grid-template-columns:1fr;padding:24px}.mc-event__poster{max-width:420px;margin:0 auto}}
@media (max-width:480px){.mc-event__meta{grid-template-columns:1fr}}

/* Services overview thumbs */
.mc-svc-img{width:100%;aspect-ratio:4/3;object-fit:cover}

/* Client quotes (testimonials page) */
.mc-quotes{display:grid;grid-template-columns:1fr 1fr;gap:30px}
.mc-quote{position:relative;background:#fff;border:1px solid var(--mc-line);border-top:5px solid var(--mc-orange);border-radius:6px;padding:34px 30px 28px;box-shadow:0 12px 30px rgba(29,35,51,.08)}
.mc-quote__mark{position:absolute;right:24px;top:6px;font:600 90px/1 Poppins,sans-serif;color:rgba(244,118,41,.18)}
.mc-quote h3{font:600 21px/1.35 Poppins,sans-serif;color:var(--mc-ink);margin:0 0 14px}
.mc-quote p{color:var(--mc-muted);font-size:16px;line-height:1.7;margin:0 0 22px}
.mc-quote__by{display:flex;gap:16px;align-items:center;border-top:1px dashed var(--mc-line);padding-top:18px}
.mc-quote__letter{flex:0 0 64px;display:block;border:1px solid var(--mc-line);border-radius:3px;overflow:hidden;transition:transform .2s}
.mc-quote__letter:hover{transform:scale(1.05)}
.mc-quote__letter img{width:64px;height:84px;object-fit:cover;object-position:top}
.mc-quote__by b{display:block;color:var(--mc-ink);font-size:16px}
.mc-quote__by span{display:block;color:var(--mc-muted);font-size:14px}
.mc-quote__by small{display:block;color:var(--mc-orange);font-size:13px;margin-top:2px}
@media (max-width:767px){.mc-quotes{grid-template-columns:1fr}}

/* Service pages: keep portrait site photos from dominating */
.services-item__img img{width:100%;max-height:440px;object-fit:cover}
.tt-col-img img{width:100%;aspect-ratio:4/3;object-fit:cover}
.submenu-aside li.active > a{color:var(--mc-orange);font-weight:700}
.mc-clients--4{grid-template-columns:repeat(4,1fr)}
.mc-client__body .tt-link{display:inline-block;margin-top:12px}
@media (max-width:1199px){.mc-clients--4{grid-template-columns:repeat(2,1fr)}}
@media (max-width:575px){.mc-clients--4{grid-template-columns:1fr}}

.mc-nhai .tt-btn.btn__color01{background:#fff;color:var(--mc-red)}
.mc-nhai .tt-btn.btn__color01 .icon-telephone{color:var(--mc-red)}
.mc-nhai .tt-btn.btn__color01:hover{background:var(--mc-red-dark);color:#fff}
.mc-nhai__credit{position:absolute;right:12px;bottom:14px;z-index:1;font-size:11px;color:rgba(255,255,255,.75)}
.mc-nhai__credit a{color:inherit;text-decoration:underline}

/* Brand theme: logo red + white, no black/navy panels */
.holder-top-desktop,.holder-top-mobile{background-color:var(--mc-red)}
.holder-top-desktop,.holder-top-desktop a,.holder-top-desktop address,.holder-top-desktop [class^="icon-"],.holder-top-desktop [class*=" icon-"],
.holder-top-mobile,.holder-top-mobile a,.holder-top-mobile [class^="icon-"],.holder-top-mobile [class*=" icon-"]{color:#fff!important}
.order-form .order-form__title{background-color:var(--mc-red-dark)}
.order-form .order-form__content{background-color:var(--mc-red)}
.order-form .tt-btn.btn__color01{background-color:#fff;color:var(--mc-red)}
.order-form .tt-btn.btn__color01 [class^="icon-"]{color:var(--mc-red)}
.section__wrapper{background-color:var(--mc-red)}
.section__wrapper .tt-value,.section__wrapper .tt-title__01,.section__wrapper .tt-title__02{color:#fff!important}
.tt-btn.btn__color02{background-color:var(--mc-red-dark)}
.tt-box03 .tt-box03__content:before{background-color:var(--mc-red)}
.slick-type01 .slick-dots li.slick-active>*,.slick-type01 .slick-dots li:hover>*,.slick-type02 .slick-dots li.slick-active>*,.slick-type02 .slick-dots li:hover>*{background-color:var(--mc-red)}
.panel-menu{background:var(--mc-red-dark)}
#tt-footer{background-color:var(--mc-red-dark);color:#fff}
#tt-footer a,#tt-footer .f-info-text,#tt-footer .f-info-icon li,#tt-footer [class^="icon-"],#tt-footer .f-copyright{color:#fff!important}
#tt-footer .f-form{background-color:var(--mc-red)}
#tt-footer .f-form .tt-btn.btn__color02{background-color:#fff;color:var(--mc-red)}
#tt-footer .f-form .tt-btn.btn__color02 [class^="icon-"]{color:var(--mc-red)!important}

.mc-nhai__photo{margin:0;background:#fff;padding:10px;border-radius:8px;box-shadow:0 24px 50px rgba(80,0,0,.35);transform:rotate(1.2deg)}
.mc-nhai__photo img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:4px}
.mc-nhai__photo figcaption{color:#6b7280;font-size:12px;line-height:1.4;padding:9px 4px 2px}
.mc-nhai__photo figcaption a{color:inherit;text-decoration:underline}
.mc-nhai__stats{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:40px}
.mc-nhai__stats .mc-stat{background:#fff;border-radius:6px;padding:18px 20px;border:0;box-shadow:0 10px 24px rgba(80,0,0,.18)}
.mc-nhai__stats .mc-stat:last-child{padding-bottom:18px}
@media (max-width:991px){.mc-nhai__stats{grid-template-columns:1fr}.mc-nhai__photo{transform:none}}
.mc-event__label{background:var(--mc-red)}
#tt-footer .f-nav li:before{color:#fff}
#tt-footer .f-logo .mc-flogo{display:inline-block;background:#fff;border-radius:6px;padding:8px 14px}
#tt-footer .f-logo .mc-flogo img{display:block;height:56px;width:auto;max-width:none}
#tt-footer .f-logo .tt-text{display:none}

/* full-background version: text column only on the left, photo shows on the right */
.mc-nhai .container{padding-top:80px;padding-bottom:80px}
.mc-nhai__grid{grid-template-columns:minmax(0,640px)}
.mc-nhai h2,.mc-nhai p,.mc-nhai__list li{text-shadow:0 1px 2px rgba(80,0,0,.35)}
.mc-nhai__stats{margin-top:56px}
.mc-nhai__credit{position:absolute;right:14px;bottom:16px;z-index:1;font-size:11px;color:#fff;background:rgba(165,15,21,.75);padding:4px 8px;border-radius:3px}
.mc-nhai__credit a{color:#fff;text-decoration:underline}
@media (max-width:991px){
  .mc-nhai{background-position:65% 30%}
  .mc-nhai:before{background:linear-gradient(180deg,rgba(200,18,26,.55) 0%,rgba(200,18,26,.9) 35%,rgba(200,18,26,.95) 100%)}
  .mc-nhai .container{padding-top:60px;padding-bottom:70px}
}
@media (max-width:767px){
  .mc-nhai{background-color:#c8121a;background-size:100% auto;background-position:top center}
  .mc-nhai:before{background:linear-gradient(180deg,rgba(200,18,26,0) 0,rgba(200,18,26,0) 46vw,#c8121a 58vw,#c8121a 100%)}
  .mc-nhai .container{padding-top:calc(56vw - 20px)}
  .mc-nhai__credit{top:10px;bottom:auto}
}
@media (max-width:767px){.mc-nhai__credit{left:auto;right:8px;top:8px;max-width:70%;font-size:9.5px;line-height:1.35;padding:3px 6px;background:rgba(165,15,21,.6)}}

/* NH-44 banner v3: whole photo evenly dimmed, no red fade */
.mc-nhai{background:#222 url("../images/projects/nh44-toll-plaza.jpg") center 60%/cover no-repeat}
.mc-nhai:before{background:rgba(0,0,0,.55)}
.mc-nhai h2,.mc-nhai p,.mc-nhai__list li{text-shadow:0 1px 3px rgba(0,0,0,.6)}
.mc-nhai__credit{background:rgba(0,0,0,.45)}
@media (max-width:767px){
  .mc-nhai{background-size:cover;background-position:60% center}
  .mc-nhai:before{background:rgba(0,0,0,.6)}
  .mc-nhai .container{padding-top:60px}
}
