/* =========================================================
   SPACE DECOR — Builders & Interiors
   Home page styles (1.1 Header, 1.2 Hero, 1.3 Stats, 1.6 Footer)
   Brand palette:  navy #14245C   |   orange #F47B20
   Fonts: Poppins (UI/headlines), Playfair Display (elegant accents)
   ========================================================= */

:root{
  --navy:#14245C;
  --navy-deep:#0E1A44;
  --orange:#F47B20;
  --orange-dark:#e06a12;
  --ink:#18191B;
  --muted:#7a7f86;
  --grey-outer:#8f9296;   /* outer layer / backdrop */
  --sheet:#ffffff;
  --line:#ececec;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:"Poppins",system-ui,Arial,sans-serif;
  color:var(--ink);
  background:var(--grey-outer);      /* GREY OUTER LAYER */
  padding:26px 18px;
}

/* accessibility: skip link */
.skip-link{
  position:absolute;left:-999px;top:0;z-index:1000;
  background:var(--navy);color:#fff;padding:10px 16px;border-radius:0 0 8px 0;
}
.skip-link:focus{left:0;}

a{text-decoration:none;}

/* white content sheet sitting on the grey backdrop */
.site-shell{
  max-width:1240px;
  margin:0 auto;
  background:var(--sheet);
  border-radius:0;
  overflow:hidden;
  box-shadow:0 24px 60px rgba(0,0,0,.20);
}

/* ---------------- 1.1 HEADER ---------------- */
.site-header{padding:14px 34px 0;}
.brand-logo{height:38px;width:auto;}
.navbar-nav .nav-link{
  color:#5c6169;
  font-size:15px;
  font-weight:500;
  padding:8px 16px;
}
.navbar-nav .nav-link:hover{color:var(--navy);}
.navbar-nav .nav-link.active{color:var(--navy);font-weight:600;}
.btn-call{
  background:var(--navy);
  color:#fff;
  border-radius:40px;
  padding:10px 22px;
  font-size:14px;
  font-weight:500;
  white-space:nowrap;
}
.btn-call:hover{background:var(--navy-deep);color:#fff;}

/* ---------------- 1.2 HERO ---------------- */
.hero{
  position:relative;
  padding:26px 34px 34px;
  min-height:520px;
}
.hero-content{
  position:relative;
  z-index:2;
  max-width:55%;
  padding-top:26px;
}
.eyebrow{
  font-family:"Playfair Display",serif;
  font-style:italic;
  color:var(--orange);
  font-size:17px;
  margin:0 0 14px;
  letter-spacing:.3px;
}
.hero-title{
  font-family:"Poppins",sans-serif;
  font-weight:800;
  text-transform:uppercase;
  font-size:clamp(28px,4.3vw,52px);
  line-height:1.55;
  letter-spacing:-1px;
  color:var(--ink);
  margin:0 0 30px;
}
.hero-title .hl{
  background:var(--navy);
  color:#fff;
  padding:2px 4px 2px 12px;
  display:inline;
  border-radius:4px 0 0 4px;
}
.hero-sub{
  color:var(--muted);
  font-size:15px;
  line-height:1.7;
  font-weight:300;
  max-width:360px;
  margin:0 0 26px;
}
.hero-cta{display:flex;align-items:center;gap:16px;}
.btn-primary-orange{
  background:var(--orange);
  color:#fff;
  border:none;
  border-radius:40px;
  padding:13px 30px;
  font-weight:600;
  font-size:15px;
  transition:background .2s ease;
}
.btn-primary-orange:hover{background:var(--orange-dark);color:#fff;}
.plus-badge{
  width:44px;height:44px;border-radius:50%;
  border:1.5px solid #d8dade;
  display:inline-flex;align-items:center;justify-content:center;
  color:var(--orange);font-size:22px;font-weight:600;
}

/* hero image on the right, dropping to the bottom */
.hero-media{
  position:absolute;
  top:26px;right:34px;bottom:34px;
  width:44%;
  z-index:1;
}
.hero-img{
  width:100%;height:100%;
  object-fit:cover;
  border-radius:0;
  display:block;
}

/* ---------------- 1.3 STATS ---------------- */
.hero-stats{
  position:absolute;
  left:34px;bottom:34px;
  z-index:3;
  display:flex;
  gap:46px;
  max-width:55%;
  padding:0;
}
.stat{display:flex;flex-direction:column;}
.stat-num{
  font-weight:700;font-size:30px;color:var(--ink);line-height:1;
}
.stat-num .plus{color:var(--orange);}
.stat-label{color:var(--muted);font-size:13px;margin-top:6px;}

/* ---------------- 1.4 PROJECT SLIDER ---------------- */
.projects-slider{padding:24px 34px 24px;}
.ps-head{
  display:flex;align-items:center;justify-content:space-between;
  margin-bottom:22px;flex-wrap:wrap;gap:12px;
}
.section-title{
  font-family:"Playfair Display",serif;
  font-weight:700;font-size:clamp(24px,3vw,34px);
  color:var(--navy);margin:0;
}
.btn-view{
  background:var(--orange);color:#fff;
  border-radius:40px;padding:11px 26px;
  font-weight:600;font-size:14px;white-space:nowrap;
}
.btn-view:hover{background:var(--orange-dark);color:#fff;}

#projectCarousel{position:relative;}
.ps-img{
  height:460px;width:100%;
  object-fit:cover;display:block;
}
.ps-placeholder{
  height:460px;width:100%;
  display:flex;align-items:center;justify-content:center;
  background:repeating-linear-gradient(45deg,#eef0f2,#eef0f2 14px,#e4e7ea 14px,#e4e7ea 28px);
  color:#8a9099;font-size:16px;font-weight:500;letter-spacing:.3px;
}
/* indicators as dots */
.carousel-indicators{margin-bottom:14px;}
.carousel-indicators [data-bs-target]{
  width:11px;height:11px;border-radius:50%;
  border:0;background-color:rgba(255,255,255,.6);
  margin:0 5px;opacity:1;
}
.carousel-indicators .active{background-color:var(--orange);}
.carousel-control-prev,.carousel-control-next{width:6%;opacity:.85;}
.carousel-control-prev-icon,.carousel-control-next-icon{
  background-color:rgba(20,36,92,.55);border-radius:50%;
  padding:16px;background-size:44% 44%;
}

/* ---------------- 1.5 SERVICES ---------------- */
.services{padding:56px 34px 44px;}
.services-head{text-align:center;max-width:660px;margin:0 auto 34px;}
.services-head .section-title{margin:0 auto;}
.services-intro{color:var(--muted);font-size:15px;font-weight:300;line-height:1.7;margin:12px 0 0;}
.service-card{
  background:#fff;border:1px solid #e7e7e7;
  height:100%;overflow:hidden;
  padding-bottom:22px;
  transition:box-shadow .22s ease, transform .22s ease, border-color .22s ease;
}
.service-card:hover{
  box-shadow:0 16px 34px rgba(20,36,92,.12);
  transform:translateY(-5px);
  border-color:#d9dbe2;
}
.service-sketch{background:#f4f1ea;border-bottom:1px solid #e7e7e7;}
.service-sketch img{display:block;width:100%;height:auto;}
.service-name{
  font-family:"Poppins",sans-serif;font-weight:600;font-size:19px;
  color:var(--navy);margin:18px 22px 8px;
}
.service-name::after{
  content:"";display:block;width:34px;height:3px;
  background:var(--orange);margin-top:10px;border-radius:2px;
}
.service-desc{color:var(--muted);font-size:14px;line-height:1.65;font-weight:300;margin:0 22px;}

/* ---------------- PROJECTS PAGE ---------------- */
.page-hero{position:relative;height:360px;overflow:hidden;}
.page-hero > img{width:100%;height:100%;object-fit:cover;display:block;}
.page-hero-overlay{
  position:absolute;inset:0;
  background:linear-gradient(rgba(14,26,68,.55),rgba(14,26,68,.68));
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;color:#fff;padding:0 20px;
}
.breadcrumb-line{
  font-size:12px;letter-spacing:2px;text-transform:uppercase;
  color:var(--orange);margin-bottom:14px;font-weight:600;
}
.page-hero-overlay h1{
  font-family:"Playfair Display",serif;font-weight:700;
  font-size:clamp(30px,5vw,52px);margin:0;
}
.page-hero-overlay p{margin:12px 0 0;font-weight:300;color:#e2e6f0;max-width:560px;}

.projects-wrap{padding:52px 34px 48px;}
.projects-wrap .section-title{text-align:center;margin:0 auto 8px;}
.projects-sub{text-align:center;color:var(--muted);font-weight:300;margin:0 auto 36px;max-width:600px;}

.project-card{display:block;text-decoration:none;color:inherit;}
.project-media{position:relative;overflow:hidden;aspect-ratio:4/3;background:#eef0f2;}
.project-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .55s ease;}
.project-card:hover .project-media img{transform:scale(1.07);}
.project-cat{
  position:absolute;top:12px;left:12px;z-index:3;
  background:var(--orange);color:#fff;font-size:11px;font-weight:600;
  padding:4px 11px;letter-spacing:.4px;
}
.project-ovl{
  position:absolute;inset:0;z-index:2;
  background:linear-gradient(rgba(14,26,68,0) 45%,rgba(14,26,68,.85));
  opacity:0;transition:opacity .3s ease;
  display:flex;align-items:flex-end;padding:18px;
}
.project-card:hover .project-ovl{opacity:1;}
.project-view{color:#fff;font-weight:600;font-size:14px;}
.project-ph{
  position:absolute;inset:0;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;
  background:repeating-linear-gradient(45deg,#eef0f2,#eef0f2 14px,#e4e7ea 14px,#e4e7ea 28px);
  color:#9198a1;font-size:13px;
}
.project-ph .ph-ico{font-size:26px;opacity:.55;}
.project-cap{padding:14px 2px 0;}
.project-name{font-family:"Poppins",sans-serif;font-weight:600;font-size:17px;color:var(--navy);margin:0;}
.project-loc{color:var(--muted);font-size:13px;margin:4px 0 0;}
.project-loc::before{content:"\1F4CD\FE0E";margin-right:5px;opacity:.7;}

@media (max-width:991.98px){
  .page-hero{height:280px;}
  .projects-wrap{padding:36px 22px 34px;}
}

/* ---------------- INDIVIDUAL PROJECT PAGE ---------------- */
.proj-detail{padding:50px 34px 26px;}
.proj-detail .section-title{margin-bottom:16px;}
.pd-desc{color:#4a4f57;font-size:15.5px;line-height:1.85;font-weight:300;margin:0;}
.pd-meta{list-style:none;padding:0;margin:0;border-top:1px solid #ececec;}
.pd-meta li{display:flex;gap:16px;padding:15px 0;border-bottom:1px solid #ececec;}
.pd-meta .k{flex:0 0 130px;color:var(--navy);font-weight:600;font-size:14px;}
.pd-meta .v{color:var(--muted);font-size:14px;line-height:1.55;}

.proj-gallery{padding:26px 34px 20px;}
.gallery-title{margin-bottom:6px;}
.gallery-grid{column-count:4;column-gap:14px;margin-top:22px;}
.g-item{
  break-inside:avoid;margin:0 0 14px;padding:0;border:0;background:none;
  display:block;width:100%;cursor:pointer;overflow:hidden;line-height:0;
}
.g-item img{width:100%;display:block;transition:transform .45s ease;}
.g-item:hover img{transform:scale(1.06);}

/* lightbox */
.lightbox-dialog{max-width:1120px;}
.lightbox-content{background:transparent;border:0;box-shadow:none;}
.lightbox-content .carousel-item img{
  width:100%;max-height:84vh;object-fit:contain;background:#0b1023;display:block;
}
.btn-close-lb{
  position:absolute;top:-44px;right:0;z-index:20;
  background:none;border:0;color:#fff;font-size:34px;line-height:1;cursor:pointer;
}
#galleryModal .modal-dialog{margin-top:60px;}

.proj-video{padding:26px 34px 56px;}
.video-frame{
  position:relative;aspect-ratio:16/9;margin-top:22px;overflow:hidden;
  background:linear-gradient(135deg,#14245C,#0E1A44);
  display:flex;align-items:center;justify-content:center;
}
.video-frame .play{
  width:78px;height:78px;border-radius:50%;
  background:rgba(255,255,255,.14);border:2px solid #fff;
  display:flex;align-items:center;justify-content:center;
}
.video-frame .play::after{
  content:"";margin-left:6px;
  border-left:22px solid #fff;border-top:14px solid transparent;border-bottom:14px solid transparent;
}
.video-note{position:absolute;bottom:20px;color:#cdd3e2;font-size:13px;font-weight:300;}

@media (max-width:991.98px){
  .proj-detail{padding:34px 22px 18px;}
  .proj-gallery{padding:18px 22px 14px;}
  .proj-video{padding:18px 22px 40px;}
  .gallery-grid{column-count:2;}
}
@media (max-width:575.98px){
  .gallery-grid{column-count:2;column-gap:10px;}
}

/* ---------------- CONTACT PAGE ---------------- */
.contact-hero{
  position:relative;overflow:hidden;
  background:linear-gradient(135deg,#14245C 0%,#0E1A44 100%);
  color:#fff;padding:64px 34px;min-height:260px;
  display:flex;align-items:center;
}
.contact-hero-motif{
  position:absolute;right:-30px;bottom:-40px;
  width:340px;height:auto;opacity:.16;
}
.contact-hero-inner{position:relative;z-index:2;max-width:620px;}
.contact-hero .breadcrumb-line{color:var(--orange);}
.contact-hero h1{
  font-family:"Playfair Display",serif;font-weight:700;
  font-size:clamp(30px,5vw,50px);margin:6px 0 12px;
}
.contact-hero p{color:#dfe3ee;font-weight:300;line-height:1.7;margin:0;max-width:520px;}

.contact-wrap{padding:46px 34px 52px;}

.contact-card{
  position:relative;overflow:hidden;height:100%;
  background:linear-gradient(160deg,#14245C 0%,#0E1A44 100%);
  color:#fff;padding:38px 34px;
}
.card-motif{
  position:absolute;right:-40px;top:-30px;width:230px;opacity:.12;
}
.cc-title{font-family:"Playfair Display",serif;font-weight:700;font-size:28px;margin:0 0 4px;position:relative;z-index:2;}
.cc-sub{color:#c3cad9;font-weight:300;margin:0 0 26px;position:relative;z-index:2;}
.cc-list{list-style:none;padding:0;margin:0 0 26px;position:relative;z-index:2;}
.cc-list li{display:flex;gap:14px;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.12);}
.cc-list li:last-child{border-bottom:0;}
.cc-ico{
  flex:0 0 42px;height:42px;border-radius:50%;
  background:var(--orange);color:#fff;font-size:19px;
  display:flex;align-items:center;justify-content:center;
}
.cc-list b{display:block;font-size:13px;font-weight:600;color:#fff;margin-bottom:3px;letter-spacing:.3px;}
.cc-list span span,.cc-list li > span:last-child{font-size:14px;color:#c8cede;line-height:1.6;font-weight:300;}
.cc-list a{color:#c8cede;}
.cc-list a:hover{color:var(--orange);}
.cc-social{display:flex;gap:10px;position:relative;z-index:2;}
.cc-social a{
  width:38px;height:38px;border-radius:50%;
  background:rgba(255,255,255,.10);color:#fff;font-size:12px;font-weight:600;
  display:inline-flex;align-items:center;justify-content:center;
}
.cc-social a:hover{background:var(--orange);}

.map-frame{height:100%;min-height:420px;overflow:hidden;border:1px solid #e7e7e7;position:relative;}
.map-embed{position:absolute;inset:0;width:100%;height:100%;border:0;display:block;z-index:2;}
.map-placeholder{position:absolute;inset:0;z-index:1;}
.cc-gstin{display:inline-block;margin-top:6px;font-size:12.5px;color:#9aa2b8;letter-spacing:.3px;}
.map-placeholder svg{width:100%;height:100%;display:block;}
.map-pin{position:absolute;top:44%;left:58%;transform:translate(-50%,-50%);text-align:center;}
.pin-dot{
  display:block;width:22px;height:22px;border-radius:50% 50% 50% 0;
  background:var(--orange);transform:rotate(-45deg);margin:0 auto 8px;
  box-shadow:0 6px 14px rgba(244,123,32,.5);
}
.pin-label{
  background:var(--navy);color:#fff;font-size:12px;font-weight:600;
  padding:4px 10px;border-radius:4px;white-space:nowrap;
}

@media (max-width:991.98px){
  .contact-hero{padding:46px 22px;min-height:auto;}
  .contact-wrap{padding:32px 22px 40px;}
  .map-frame{min-height:320px;}
}

/* ---------------- SERVICES PAGE ---------------- */
.svc-intro{max-width:780px;margin:0 auto;text-align:center;padding:54px 34px 6px;}
.svc-intro .section-title{margin:0 auto 14px;}
.svc-intro p{color:var(--muted);font-weight:300;line-height:1.85;font-size:15.5px;margin:0;}

.svc-detail{padding:26px 34px 8px;}
.svc-row{
  display:grid;grid-template-columns:0.95fr 1.05fr;gap:44px;align-items:center;
  padding:36px 0;border-bottom:1px solid #eee;
}
.svc-row:last-child{border-bottom:0;}
.svc-media{
  background:#f4f1ea;border:1px solid #ece7dc;
  padding:22px;display:flex;align-items:center;justify-content:center;
}
.svc-media img{width:100%;max-width:440px;height:auto;display:block;}
.svc-row.reverse .svc-media{order:2;}
.svc-num{
  font-family:"Playfair Display",serif;font-weight:700;
  font-size:46px;color:#e7e2d6;line-height:1;display:block;
}
.svc-body h3{font-family:"Poppins",sans-serif;font-weight:600;font-size:25px;color:var(--navy);margin:4px 0 12px;}
.svc-body > p{color:var(--muted);font-weight:300;line-height:1.75;margin:0 0 18px;max-width:460px;}
.svc-points{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:9px 20px;}
.svc-points li{position:relative;padding-left:22px;font-size:14px;color:#4a4f57;}
.svc-points li::before{
  content:"";position:absolute;left:0;top:6px;width:9px;height:9px;
  background:var(--orange);border-radius:2px;transform:rotate(45deg);
}

.process{background:#f7f6f3;padding:56px 34px;margin-top:14px;}
.process .section-title{text-align:center;margin:0 auto 8px;}
.process-sub{text-align:center;color:var(--muted);font-weight:300;margin:0 auto 36px;}
.process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;}
.step{background:#fff;border:1px solid #ececec;padding:28px 24px;}
.step-num{
  width:46px;height:46px;border-radius:50%;background:var(--navy);color:#fff;
  font-weight:700;font-size:18px;display:flex;align-items:center;justify-content:center;margin-bottom:16px;
}
.step h4{font-size:17px;color:var(--navy);font-weight:600;margin:0 0 8px;}
.step p{font-size:13.5px;color:var(--muted);font-weight:300;line-height:1.65;margin:0;}

.cta-band{position:relative;overflow:hidden;color:#fff;text-align:center;
  background:linear-gradient(135deg,#14245C,#0E1A44);padding:60px 34px;}
.cta-motif{position:absolute;right:-30px;bottom:-40px;width:300px;opacity:.14;}
.cta-inner{position:relative;z-index:2;max-width:640px;margin:0 auto;}
.cta-band h2{font-family:"Playfair Display",serif;font-weight:700;font-size:clamp(26px,4vw,40px);margin:0 0 12px;}
.cta-band p{color:#dfe3ee;font-weight:300;line-height:1.7;margin:0 0 26px;}

@media (max-width:991.98px){
  .svc-intro{padding:36px 22px 4px;}
  .svc-detail{padding:14px 22px 4px;}
  .svc-row{grid-template-columns:1fr;gap:20px;padding:28px 0;}
  .svc-row.reverse .svc-media{order:0;}
  .process{padding:40px 22px;}
  .process-grid{grid-template-columns:repeat(2,1fr);}
  .cta-band{padding:44px 22px;}
}
@media (max-width:575.98px){
  .process-grid{grid-template-columns:1fr;}
  .svc-points{grid-template-columns:1fr;}
}

/* ---------------- 1.6 FOOTER ---------------- */
.site-footer{
  background:var(--navy);
  color:#cfd4e0;
  padding:52px 34px 26px;
}
.footer-logo{height:52px;width:auto;margin-bottom:18px;}
.footer-about{font-size:14px;line-height:1.7;color:#b9c0d2;max-width:300px;font-weight:300;}
.footer-head{
  font-size:15px;font-weight:600;color:#fff;
  margin-bottom:16px;font-family:"Poppins",sans-serif;
}
.footer-list,.footer-contact{list-style:none;padding:0;margin:0;}
.footer-list li,.footer-contact li{margin-bottom:10px;font-size:14px;}
.footer-list a,.footer-contact a{color:#c3cad9;}
.footer-list a:hover,.footer-contact a:hover{color:var(--orange);}
.footer-contact li span{color:var(--orange);margin-right:4px;}
.footer-social{display:flex;gap:10px;margin-top:16px;}
.footer-social a{
  width:36px;height:36px;border-radius:50%;
  background:rgba(255,255,255,.10);
  display:inline-flex;align-items:center;justify-content:center;
  color:#fff;font-size:12px;font-weight:600;
}
.footer-social a:hover{background:var(--orange);}
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.14);
  margin-top:36px;padding-top:20px;text-align:center;
}
.footer-bottom p{margin:0;font-size:13px;color:#9aa2b8;}

/* ---------------- RESPONSIVE ---------------- */
@media (max-width:991.98px){
  .site-header{padding:14px 22px 0;}
  .btn-call{margin-top:10px;display:inline-block;}
  .hero{padding:20px 22px 0;min-height:auto;}
  .hero-content{max-width:100%;}
  .hero-media{
    position:static;width:100%;margin-top:26px;height:300px;
  }
  .hero-title .hl{margin-top:6px;}
  .hero-stats{position:static;max-width:100%;gap:26px;padding:22px 0 4px;margin:0;flex-wrap:wrap;}
  .projects-slider{padding:28px 22px 20px;}
  .services{padding:40px 22px 30px;}
  .ps-img,.ps-placeholder{height:320px;}
  .site-footer{padding:44px 22px 24px;}
}
@media (max-width:575.98px){
  body{padding:12px 8px;}
  .site-shell{border-radius:0;}
  .hero-stats{gap:18px;}
  .stat-num{font-size:24px;}
  .hero-media{height:220px;}
  .ps-img,.ps-placeholder{height:220px;}
  .ps-placeholder span{font-size:13px;text-align:center;padding:0 12px;}
}
