
:root{
 --accent:#FFC93C;
 --bg0:#0A0A0C;
 --bg1:#111217;
 --text:#ffffff;
 --muted:rgba(255,255,255,0.65);
}

body{
 margin:0;
 font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial;
 background:linear-gradient(180deg,var(--bg0),var(--bg1));
 color:var(--text);
}

.container{padding:20px;max-width:700px;margin:auto}

.logoWrap{
 text-align:center;
 margin-top:20px;
}

.logoWrap img{
 width:180px;
 border-radius:30px;
 box-shadow:0 20px 60px rgba(0,0,0,0.6);
}

h1{text-align:center;margin-top:10px}

.statement{
 text-align:center;
 margin:20px 0;
 font-size:16px;
 color:var(--muted);
}

.btn{
 display:flex;
 justify-content:space-between;
 align-items:center;
 padding:16px 18px;
 margin:12px 0;
 border-radius:18px;
 text-decoration:none;
 font-weight:700;
 font-size:16px;
}

.primary{
 background:linear-gradient(180deg,#FFD76A,var(--accent));
 color:#000;
 box-shadow:0 18px 45px rgba(255,201,60,0.25);
}

.secondary{
 background:rgba(255,255,255,0.06);
 border:1px solid rgba(255,255,255,0.12);
 color:#fff;
}

.iframeWrap{
 margin-top:20px;
 border-radius:20px;
 overflow:hidden;
 border:1px solid rgba(255,255,255,0.1);
 display:none;
}

iframe{
 width:100%;
 height:80vh;
 border:0;
}

.backBtn{
 margin-top:15px;
 background:rgba(255,255,255,0.08);
 border:none;
 color:#fff;
 padding:12px 16px;
 border-radius:14px;
 font-weight:700;
}

.small{
 margin-top:20px;
 font-size:14px;
 color:var(--muted);
 text-align:center;
}

/* Section titles */
.section-title{
 text-align:center;
 margin:40px 0 20px;
 font-size:22px;
 color:var(--accent);
}

/* Services grid */
.services-grid{
 display:grid;
 grid-template-columns:repeat(2,1fr);
 gap:14px;
 margin-bottom:10px;
}

.service-card{
 background:rgba(255,255,255,0.05);
 border:1px solid rgba(255,255,255,0.08);
 border-radius:18px;
 padding:20px 16px;
 text-align:center;
 transition:transform 0.2s, box-shadow 0.2s;
}

.service-card:hover{
 transform:translateY(-3px);
 box-shadow:0 10px 30px rgba(0,0,0,0.3);
}

.service-icon{
 font-size:32px;
 margin-bottom:8px;
}

.service-card h3{
 margin:0 0 6px;
 font-size:15px;
}

.service-card p{
 margin:0;
 font-size:13px;
 color:var(--muted);
 line-height:1.4;
}

/* Gallery grid */
.gallery-grid{
 display:grid;
 grid-template-columns:repeat(2,1fr);
 gap:12px;
 margin-bottom:10px;
}

.gallery-item{
 border-radius:16px;
 overflow:hidden;
 aspect-ratio:1/1;
 background:rgba(255,255,255,0.04);
}

.gallery-item.featured{
 grid-column:1/-1;
 aspect-ratio:16/9;
}

.gallery-item img{
 width:100%;
 height:100%;
 object-fit:cover;
 display:block;
}

/* Single-column on narrow screens */
@media(max-width:400px){
 .services-grid{grid-template-columns:1fr}
 .gallery-grid{grid-template-columns:1fr}
 .gallery-item.featured{aspect-ratio:4/3}
}

.social-links{
  display:flex;
  gap:12px;
  justify-content:center;
  margin:16px 0;
  flex-wrap:wrap;
}

.btn.social{
  background:#111;
  color:#fff;
  border-radius:12px;
  padding:10px 16px;
  font-weight:600;
  text-decoration:none;
}

.btn.facebook{ background:#1877F2; }
.btn.instagram{
  background:linear-gradient(45deg,#f58529,#dd2a7b,#8134af,#515bd4);
}
/* Reviews */
.reviews-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:16px;
  margin:16px 0 32px;
}

.review-card{
  background:rgba(255,255,255,0.06);
  border:1px solid rgba(255,255,255,0.12);
  border-radius:18px;
  padding:16px;
  box-shadow:0 10px 30px rgba(0,0,0,0.25);
}

.review-card p{
  margin:8px 0 0;
  font-size:15px;
  line-height:1.5;
  color:rgba(255,255,255,0.85);
}

.stars{
  color:#FFC93C;
  font-size:18px;
  letter-spacing:2px;
}

/* Sticky Mobile Contact Bar */
.sticky-contact{
  position:fixed;
  bottom:0;
  left:0;
  width:100%;
  display:flex;
  z-index:9999;
  box-shadow:0 -5px 20px rgba(0,0,0,0.3);
}

.sticky-btn{
  flex:1;
  text-align:center;
  padding:14px 8px;
  font-weight:600;
  text-decoration:none;
  color:#fff;
  font-size:14px;
}

.sticky-btn.call{
  background:#FFC93C;
  color:#000;
}

.sticky-btn.whatsapp{
  background:#25D366;
}

.sticky-btn.enquiry{
  background:#FFC93C;
  color:#000;
}

/* Only show on mobile */
@media(min-width:768px){
  .sticky-contact{
    display:none;
  }
}
body{
  padding-bottom:70px;
}

/* Review Buttons */
.review-buttons{
  display:flex;
  gap:12px;
  justify-content:center;
  flex-wrap:wrap;
  margin:16px 0 32px;
}

.review-btn{
  padding:14px 18px;
  border-radius:14px;
  font-weight:600;
  text-decoration:none;
  color:#fff;
  transition:0.2s ease;
  box-shadow:0 8px 20px rgba(0,0,0,0.25);
}

.review-btn:hover{
  transform:translateY(-2px);
}

.review-btn.google{
  background:#4285F4;
}

.review-btn.facebook{
  background:#1877F2;
}

/* Reviews carousel */
.review-carousel{
  margin:16px 0 28px;
  padding:16px;
  border-radius:18px;
  background:rgba(255,255,255,0.06);
  border:1px solid rgba(255,255,255,0.12);
  box-shadow:0 10px 30px rgba(0,0,0,0.25);
}
.review-stars{
  color:#FFC93C;
  letter-spacing:2px;
  font-size:18px;
}
.review-text{
  margin:10px 0 12px;
  color:rgba(255,255,255,0.88);
  line-height:1.55;
  font-size:15px;
}
.review-meta{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  color:rgba(255,255,255,0.6);
  font-size:12.5px;
}
.review-dots{ display:flex; gap:8px; }
.dot{
  width:10px; height:10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,0.25);
  background:rgba(255,255,255,0.10);
}
.dot.active{
  border-color: rgba(255,201,60,0.8);
  background: rgba(255,201,60,0.9);
}
.review-carousel.pop{ animation: pop .18s ease-out; }
@keyframes pop{
  from{ transform: translateY(4px); opacity:0.7; }
  to{ transform: translateY(0); opacity:1; }
}
/* Reviews carousel (smooth + desktop friendly) */
.review-carousel{
  position:relative;
  margin:16px 0 28px;
  padding:14px 44px; /* space for arrows */
  border-radius:18px;
  background:rgba(255,255,255,0.06);
  border:1px solid rgba(255,255,255,0.12);
  box-shadow:0 10px 30px rgba(0,0,0,0.25);
  overflow:hidden;
  touch-action: pan-y;
  user-select:none;
}

.review-content{
  transition: opacity 220ms ease, transform 220ms ease;
  opacity:1;
  transform: translateX(0);
}

.review-content.is-exiting-left{
  opacity:0;
  transform: translateX(-14px);
}

.review-content.is-exiting-right{
  opacity:0;
  transform: translateX(14px);
}

.review-stars{
  color:#FFC93C;
  letter-spacing:2px;
  font-size:18px;
}

.review-text{
  margin:10px 0 12px;
  color:rgba(255,255,255,0.88);
  line-height:1.55;
  font-size:15px;
}

.review-meta{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  color:rgba(255,255,255,0.6);
  font-size:12.5px;
}

.review-dots{ display:flex; gap:8px; }
.dot{
  width:10px; height:10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,0.25);
  background:rgba(255,255,255,0.10);
  cursor:pointer;
}
.dot.active{
  border-color: rgba(255,201,60,0.8);
  background: rgba(255,201,60,0.9);
}

/* Arrows */
.review-arrow{
  position:absolute;
  top:50%;
  transform: translateY(-50%);
  width:34px;
  height:34px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,0.14);
  background:rgba(0,0,0,0.25);
  color:#fff;
  font-size:26px;
  line-height:0;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition: transform 120ms ease, background 120ms ease;
}
.review-arrow:active{ transform: translateY(-50%) scale(0.98); }
.review-arrow:hover{ background:rgba(0,0,0,0.35); }

.review-arrow.left{ left:10px; }
.review-arrow.right{ right:10px; }

/* Hide arrows on small screens if you want (optional) */
@media (max-width: 420px){
  .review-carousel{ padding:14px 16px; }
  .review-arrow{ display:none; }
}