/* ── HERO ── */
.hero{position:relative;overflow:hidden;height:calc(100vh - var(--nav-h) - 30px);min-height:560px;max-height:820px;background:var(--dark)}
.slide{position:absolute;inset:0;opacity:0;transition:opacity 1.1s ease}
.slide.on{opacity:1}
.sl-bg{position:absolute;inset:0;background-size:cover;background-position:center;filter:brightness(1.08)}
.s1 .sl-bg{background-image: url('../images/banner/banner1.png');}
.s2 .sl-bg{background-image:url('../images/banner/banner2.png');}
.s3 .sl-bg{background-image:url('../images/banner/banner3.png');}

.slide::after{
    display:none;
}
.hero-inner{position:relative;z-index:2;padding:0 5%;height:100%;display:flex;flex-direction:column;justify-content:center;max-width:760px}
.hero-eyebrow{display:inline-flex;align-items:center;gap:.6rem;border:1px solid rgba(200,150,12,.42);background:rgba(200,150,12,.1);border-radius:30px;padding:.33rem 1rem;font-size:.71rem;font-weight:700;color:#f6c94e;letter-spacing:.12em;text-transform:uppercase;margin-bottom:1.3rem;width:fit-content}
.hero h1{font-family:var(--hd);font-size:clamp(2.4rem,6vw,4.6rem);font-weight:900;color:#fff;line-height:1.05;text-transform:uppercase;letter-spacing:.01em;margin-bottom:1.1rem}
.hero h1 span{color:var(--gold);display:block}
.hero-sub{font-size:.96rem;color:rgba(255,255,255,.68);max-width:500px;line-height:1.78;margin-bottom:2rem}
.hero-btns{display:flex;gap:.9rem;flex-wrap:wrap}
.hero-dots{position:absolute;bottom:2.5rem;left:5%;z-index:3;display:flex;gap:.55rem}
.dot{width:32px;height:3px;border-radius:2px;background:rgba(255,255,255,.28);border:none;cursor:pointer;transition:.3s}
.dot.on{background:var(--gold);width:52px}
.hero-stats{position:absolute;bottom:0;left:0;right:0;z-index:3;background:rgba(0,0,0,.88);backdrop-filter:blur(10px);display:grid;grid-template-columns:repeat(4,1fr);border-top:2px solid rgba(200,150,12,.22)}
.hs{padding:1.25rem 2rem;text-align:center;border-right:1px solid rgba(255,255,255,.06)}
.hs:last-child{border:none}
.hs-n{font-family:var(--hd);font-size:2rem;font-weight:900;color:var(--gold);line-height:1}
.hs-l{font-size:.61rem;color:rgba(255,255,255,.42);text-transform:uppercase;letter-spacing:.12em;margin-top:.2rem}

/* ── ABOUT ── */
.h-about{padding:6rem 5%;background:#fff}
.ab-grid{display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:center}
.ab-imgs{position:relative;height:470px}
.ab-main{position:absolute;top:0;left:0;width:78%;height:85%;object-fit:cover;border-radius:5px}
.ab-sec{position:absolute;bottom:0;right:0;width:50%;height:54%;object-fit:cover;border-radius:5px;border:6px solid #fff;box-shadow:0 8px 28px rgba(0,0,0,.14);  text-align: justify !important;}
.ab-badge{position:absolute;top:2rem;left:-1.3rem;background:var(--gold);color:var(--dark);padding:1.2rem 1.5rem;border-radius:5px;text-align:center;box-shadow:0 8px 22px rgba(200,150,12,.38)}
.ab-badge strong{display:block;font-family:var(--hd);font-size:2.2rem;font-weight:900;line-height:1}
.ab-badge small{font-size:.58rem;text-transform:uppercase;letter-spacing:.07em;opacity:.88;font-weight:600}
.ab-text p{font-size:.88rem;color:var(--gray);line-height:1.87;margin-bottom:.9rem;  text-align: justify !important;}
.ab-list{margin:1.4rem 0}
.ab-list li{display:flex;gap:.7rem;align-items:flex-start;font-size:.86rem;color:var(--dark);margin-bottom:.68rem; text-align:justify !important;}
.ab-list li::before{content:'✔';color:var(--gold);font-weight:700;flex-shrink:0;margin-top:.06rem}


/* ── GALLERY PREVIEW ── */
.h-gallery{padding:6rem 5%;background:var(--lt)}
.gal-mosaic{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:210px 210px;gap:8px;margin-top:3rem}
.gm-item{overflow:hidden;border-radius:4px;position:relative;cursor:zoom-in}
.gm-item:nth-child(1){grid-column:span 2;grid-row:span 2}
.gm-item img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.gm-item:hover img{transform:scale(1.06)}
.gm-ov{position:absolute;inset:0;background:rgba(0,0,0,.55);opacity:0;transition:opacity .3s;display:flex;align-items:center;justify-content:center;font-size:2rem;color:#fff}
.gm-item:hover .gm-ov{opacity:1}

@media(max-width:1100px){
  .hero{height:auto;min-height:auto;max-height:none;overflow:visible}
  .hero-inner{height:auto}
  .hero-inner,.h-about,.h-svcs,.h-projs,.h-stats,.h-why,.h-testi,.h-gallery{padding:3.5rem 1.5rem}
  .hero-stats,.hero-dots{display:none}
  .ab-grid{grid-template-columns:1fr;gap:2.5rem}
  .ab-imgs{height:280px}.ab-sec,.ab-badge{display:none}
  .svc-grid,.why-grid{grid-template-columns:1fr}
  .ptpanel.on,.tc-grid{grid-template-columns:1fr}
  .st-grid{grid-template-columns:1fr 1fr;gap:2.5rem}
  .gal-mosaic{grid-template-columns:1fr 1fr;grid-template-rows:auto}
  .gm-item:nth-child(1){grid-column:span 2;grid-row:auto}
}
@media(max-width:640px){
  .st-grid{grid-template-columns:1fr}
  .gal-mosaic{grid-template-columns:1fr}
  .gm-item:nth-child(1){grid-column:span 1}
}

/* Responsive Images */
img {
    max-width: 100%;
    height: auto;
}

/* Mobile Layout */
@media (max-width: 768px) {

    .container {
        width: 95%;
        margin: auto;
    }

    .row,
    .hero-content,
    .about-grid {
        display: flex;
        flex-direction: column;
    }

    .col,
    .hero-left,
    .hero-right {
        width: 100%;
    }
}