/* ---------- Basic Reset & Fonts ---------- */
:root{
  --accent: #d97706;        /* saffron gold */
  --accent-dark: #7c2d12;   /* deep maroon */
  --muted: #6b7280;
  --bg: #fafafa;
  --card: #ffffff;
}
*{box-sizing:border-box;}
body{font-family: 'Poppins', Arial, sans-serif; color:#222; background:var(--bg); margin:0; padding-top:80px;}

/* ---------- NAV ---------- */
.navbar { background: linear-gradient(180deg, rgba(0,0,0,0.55), rgba(0,0,0,0.25)); transition: background .25s;}
.navbar.scrolled { background: rgba(0,0,0,0.85) !important; }
.navbar .brand-icon{ font-size:28px; color:var(--accent); }
.brand-text .brand-name{ font-weight:600; color:#fff; font-size:1rem; }
.nav-cta { background: var(--accent); border:none; color:#fff; }
.nav-cta:hover { background: var(--accent-dark); }

/* ---------- HERO ---------- */
.hero { 
  min-height: 85vh; 
  background-image: url('img/hero.jpg'); 
  background-size:cover; background-position:center; position:relative; 
  display:flex; align-items:center;
}
.hero-overlay {
  position: absolute;
  top:0; left:0;
  width:100%; height:100%;
  background: linear-gradient(rgba(0,0,0,0.55), rgba(0,0,0,0.35)) !important; /* dark gradient overlay */
  z-index:1;
}
.hero-content { position: relative; z-index:2; }

/* stats */
.hero-stats .stat{ text-align:center; margin-top:18px; }
.hero-stats .stat h4{ color:var(--accent); margin:0; font-size:1.4rem; }
.hero-stats .stat small{ color:#fff; }

/* ---------- SECTIONS ---------- */
.section-badge{ color:var(--accent); font-weight:600; letter-spacing:0.4px; display:block; margin-bottom:8px; }
.section-title {
  font-size: 2.4rem;  /* bigger heading */
  font-weight: 700;
  margin-bottom: 16px;
}
.section-subtitle {
  font-size: 1.15rem;
  line-height: 1.6;
}


/* profile card */
.profile-card{ background:var(--card); padding:12px; border-radius:10px; box-shadow:0 8px 22px rgba(0,0,0,.06);}
.profile-card img{ border-radius:8px; }

/* feature cards */
.feature-card{ background:var(--card); padding:22px; border-radius:12px; text-align:left; transition:transform .22s, box-shadow .22s; }
.feature-card:hover{ transform:translateY(-6px); box-shadow:0 15px 40px rgba(13, 38, 59, .12); }
.feature-card .icon-wrap{ color:#fff; margin-bottom:10px; width:54px; height:54px; display:flex; align-items:center; justify-content:center; background:var(--accent); border-radius:10px; }

/* testimonial card */
.testimonial-card{ background:var(--card); padding:24px; border-radius:12px; text-align:left; box-shadow:0 10px 25px rgba(0,0,0,.08);}
.testimonial-card .rating i{ color:#fbbf24; }

/* gallery */
.gallery-grid img{ width:100%; height:230px; object-fit:cover; transition:transform .25s; border-radius:8px;}
.gallery-grid img:hover{ transform:scale(1.03); }
/* ---------- Horizontal Scroll Gallery ---------- */
.gallery-scroll-wrapper .gallery-thumb img {
  height: 200px;        /* fixed height */
  width: auto;           /* maintain aspect ratio */
  object-fit: cover;     /* crop if needed */
  border-radius: 8px;
  transition: transform 0.3s;
}

.gallery-scroll-wrapper .gallery-thumb img:hover {
  transform: scale(1.05); /* subtle zoom on hover */
}

.gallery-scroll-wrapper {
  padding-bottom: 15px;
  overflow-x: auto;
  white-space: nowrap;
}


/* contact form */
.contact-form{ background: linear-gradient(180deg, rgba(255,255,255,.97), rgba(255,255,255,.99)); border-radius:12px; }
.btn-accent{ background:var(--accent); color:#fff; border:none; }
.btn-accent:hover{ background:var(--accent-dark); }

/* footer */
.footer{ background:linear-gradient(180deg,#111827,#1f2937); color:#fff; margin-top:40px; }
.footer a{ color:var(--accent); text-decoration:none; }
.footer .footer-actions a{ font-size:18px; margin:0 8px; }

/* back to top */
.back-to-top{ position:fixed; right:18px; bottom:18px; background:var(--accent); color:#fff; border:none; padding:10px 12px; border-radius:8px; display:none; z-index:999; }
.back-to-top:hover{ background:var(--accent-dark); }

/* responsive tweaks */
@media (max-width: 767px){
  .hero { min-height:60vh; padding:80px 0; }
  .hero-content h1{ font-size:1.6rem; }
  .gallery-grid img{ height:180px; }
  
  #about .section-title,
#contact .section-title {
  font-size: 2.4rem;
  font-weight: 700;
}
#about h2,
#contact h2 {
  font-size: 2.6rem !important;
  font-weight: 700 !important;
  color: var(--accent-dark) !important;
}

#about p,
#contact p {
  font-size: 1.2rem !important;
  line-height: 1.7 !important;
}
/* ---------- About & Contact Section Fonts ---------- */
#about .section-title,
#contact .section-title {
  font-size: 3rem;       /* big, bold headings */
  font-weight: 700;
  color: var(--accent-dark);
}

#about .section-subtitle,
#contact .section-subtitle {
  font-size: 1.25rem;    /* subtitle */
  line-height: 1.7;
  color: var(--muted);
}

#about p,
#contact p {
  font-size: 1.2rem;     /* paragraph text */
  line-height: 1.7;
}

/* ---------- Horizontal Scroll Gallery ---------- */
.gallery-scroll-wrapper {
  overflow-x: auto;
  white-space: nowrap;
  padding-bottom: 15px;
  scroll-behavior: smooth;
}

.gallery-scroll-wrapper .gallery-thumb {
  display: inline-block;
  margin-right: 10px;
}

.gallery-scroll-wrapper .gallery-thumb img {
  height: 220px;         /* uniform height */
  width: auto;           /* keep aspect ratio */
  object-fit: cover;     /* crop if necessary */
  border-radius: 8px;
  transition: transform 0.3s;
}

.gallery-scroll-wrapper .gallery-thumb img:hover {
  transform: scale(1.05); /* subtle zoom */
}

/* responsive tweaks for smaller screens */
@media (max-width: 767px){
  #about .section-title,
  #contact .section-title {
    font-size: 2.2rem;
  }
  #about .section-subtitle,
  #contact .section-subtitle {
    font-size: 1.1rem;
  }
  #about p,
  #contact p {
    font-size: 1rem;
  }
  .gallery-scroll-wrapper .gallery-thumb img {
    height: 150px;
  }
}