/* =========================================================
   EYESPY SECURITY SERVICES PVT LTD — site stylesheet
   Tokens
   ========================================================= */
:root{
  --maroon: #7A1420;
  --maroon-dark: #4E0D15;
  --orange: #E8821E;
  --navy: #102A4C;
  --charcoal: #232323;
  --cream: #FBF8EE;
  --paper: #FFFFFF;
  --ink: #211A16;
  --muted: #6B6259;
  --line: #E7DFD0;

  --font-display: "Oswald", "Arial Narrow", sans-serif;
  --font-body: "Source Sans 3", "Segoe UI", sans-serif;

  --radius: 10px;
  --shadow: 0 14px 34px rgba(20,10,5,.12);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-family: var(--font-body);
  color: var(--ink);
  background: var(--cream);
  line-height:1.6;
}
h1,h2,h3,h4,.display-font{
  font-family: var(--font-display);
  letter-spacing:.01em;
  color: var(--navy);
  font-weight:600;
}
a{color:var(--maroon); text-decoration:none;}
a:hover{color:var(--orange);}
img{max-width:100%; display:block;}
.section{padding:5rem 0;}
.section-sm{padding:3rem 0;}
.bg-paper{background:var(--paper);}
.bg-charcoal{background:var(--charcoal); color:#EDE7DD;}
.bg-charcoal h1,.bg-charcoal h2,.bg-charcoal h3{color:#fff;}
.bg-maroon{background: linear-gradient(135deg,var(--maroon),var(--maroon-dark)); color:#F6E9DD;}
.bg-maroon h1,.bg-maroon h2,.bg-maroon h3{color:#fff;}

.text-orange{color:var(--orange) !important;}
.text-maroon{color:var(--maroon) !important;}

.kicker{
  font-family: var(--font-display);
  font-size:.8rem;
  color:var(--maroon);
  border-left:3px solid var(--orange);
  padding-left:.6rem;
  margin-bottom:.6rem;
  display:inline-block;
}

.btn-brand{
  background:var(--maroon);
  color:#fff;
  border:1px solid var(--maroon);
  padding:.65rem 1.6rem;
  border-radius:3px;
  font-family:var(--font-display);
  letter-spacing:.03em;
  transition:.2s ease;
}
.btn-brand:hover{background:var(--maroon-dark); color:#fff; border-color:var(--maroon-dark);}
.btn-outline-brand{
  background:transparent;
  color:#fff;
  border:1px solid rgba(255,255,255,.7);
  padding:.65rem 1.6rem;
  border-radius:3px;
  font-family:var(--font-display);
  letter-spacing:.03em;
}
.btn-outline-brand:hover{background:#fff; color:var(--maroon);}

/* ============== Topbar ============== */
.topbar{
  background:var(--charcoal);
  color:#cfc7bb;
  font-size:.85rem;
  padding:.4rem 0;
}
.topbar a{color:#cfc7bb;}
.topbar a:hover{color:var(--orange);}
.topbar .sep{opacity:.4; margin:0 .6rem;}

/* ============== Navbar ============== */
.navbar-brand-wrap{display:flex; align-items:center; gap:.7rem;}
.navbar-brand-wrap img{height:82px; width:auto;}
.brand-text .name{
  font-family:var(--font-display);
  color:var(--maroon);
  font-size:1.16rem;
  line-height:1.05;
  font-weight:700;
  letter-spacing:.02em;
}
.brand-text .tag{
  font-size:.68rem;
  color:var(--muted);
  letter-spacing:.08em;
}
.site-nav{
  background:var(--paper);
  border-bottom:1px solid var(--line);
}
.site-nav .nav-link{
  font-family:var(--font-display);
  color:var(--ink);
  font-size:1.25rem;
  padding:.5rem 1rem !important;
  letter-spacing:.02em;
}
.site-nav .nav-link.active,
.site-nav .nav-link:hover{color:var(--maroon);}
.site-nav .btn-brand{margin-left:.5rem;}

/* ============== Hero / Carousel ============== */
.hero-carousel{position:relative;}
.hero-carousel .carousel-item{height:78vh; min-height:460px;}
.hero-carousel .carousel-item img{
  width:100%; height:100%; object-fit:cover; object-position:center 20%;
}
.hero-carousel::after{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(16,10,8,.55) 0%, rgba(16,10,8,.25) 45%, rgba(16,10,8,.75) 100%);
  pointer-events:none;
}
.hero-caption{
  position:absolute; z-index:3; left:0; right:0; bottom:12%;
  text-align:center; color:#fff; padding:0 1rem;
}
.hero-caption .kicker{color:var(--orange); border-color:var(--orange);}
.hero-caption h1{
  color:#fff; font-size:clamp(2rem,5vw,3.4rem); margin-bottom:.6rem;
  text-shadow:0 3px 18px rgba(0,0,0,.4);
}
.hero-caption p{max-width:640px; margin:0 auto 1.4rem; color:#EDE4D8; font-size:1.05rem;}
.hero-carousel .carousel-indicators [data-bs-target]{background:var(--orange);}

/* small page hero (interior pages) */
.page-hero{
  background:linear-gradient(135deg,var(--maroon),var(--maroon-dark));
  color:#fff; padding:3.4rem 0 3rem; position:relative; overflow:hidden;
}
.page-hero h1{color:#fff; margin-bottom:.3rem;}
.page-hero .crumb{color:#e9c9c0; font-size:.9rem;}
.page-hero .crumb a{color:#f3ddd6;}

/* ============== Cards ============== */
.stat-card{
  background:var(--paper); border:1px solid var(--line); border-radius:var(--radius);
  padding:1.6rem; height:100%;
}
.stat-card .num{font-family:var(--font-display); font-size:2.4rem; color:var(--maroon);}
.stat-card .label{color:var(--muted); font-size:.92rem;}

.feature-row{
  display:flex; gap:1rem; align-items:flex-start;
  background:var(--paper); border:1px solid var(--line);
  border-radius:var(--radius); padding:1.2rem 1.3rem; height:100%;
}
.feature-row .ico{
  flex:0 0 auto; width:46px; height:46px; border-radius:50%;
  background:var(--maroon); color:#fff; display:flex; align-items:center; justify-content:center;
  font-size:1.15rem;
}
.feature-row h3{font-size:1.05rem; margin-bottom:.25rem;}
.feature-row p{margin:0; color:var(--muted); font-size:.92rem;}

.service-card{
  border:1px solid var(--line); border-radius:var(--radius); overflow:hidden;
  background:var(--paper); height:100%; transition:.2s ease;
}
.service-card:hover{box-shadow:var(--shadow); transform:translateY(-3px);}
.service-card .head{
  background:var(--navy); color:#fff; padding:1.1rem 1.3rem;
  font-family:var(--font-display); letter-spacing:.02em;
}
.service-card ul{list-style:none; margin:0; padding:1.2rem 1.4rem;}
.service-card ul li{
  padding:.45rem 0; border-bottom:1px dashed var(--line);
  font-size:.95rem;
}
.service-card ul li:last-child{border-bottom:none;}
.service-card ul li::before{content:"▸"; color:var(--orange); font-weight:700}

.person-card{text-align:center;}
.person-card .photo{
  width:150px; height:150px; border-radius:50%; overflow:hidden; margin:0 auto 1rem;
  border:4px solid var(--paper); box-shadow:var(--shadow);
}
.person-card .photo img{width:100%; height:100%; object-fit:cover;}
.person-card .role{color:var(--maroon); font-size:.82rem; letter-spacing:.06em; text-transform:uppercase;}
.person-card h3{font-size:1.05rem; margin:.15rem 0 0;}

.quote-block{
  border-left:4px solid var(--orange); padding:.4rem 0 .4rem 1.3rem;
  font-size:1.1rem; color:var(--navy); font-style:italic;
}

/* ============== Gallery ============== */
.gal-item{
  position:relative; overflow:hidden; border-radius:var(--radius);
  margin-bottom:1.5rem; cursor:pointer; border:1px solid var(--line);
}
.gal-item img{width:100%; height:230px; object-fit:cover; transition:.35s ease;}
.gal-item:hover img{transform:scale(1.07);}
.gal-item .cap{
  position:absolute; left:0; right:0; bottom:0; padding:.6rem .9rem;
  background:linear-gradient(0deg, rgba(16,10,8,.85), rgba(16,10,8,0));
  color:#fff; font-size:.85rem; opacity:0; transition:.25s ease;
}
.gal-item:hover .cap{opacity:1;}
.gal-filters .btn{
  font-family:var(--font-display); font-size:.85rem; letter-spacing:.02em;
  border-radius:20px; border:1px solid var(--line); color:var(--ink); margin:.2rem;
}
.gal-filters .btn.active,.gal-filters .btn:hover{background:var(--maroon); color:#fff; border-color:var(--maroon);}

/* ============== Contact ============== */
.contact-card{
  background:var(--paper); border:1px solid var(--line); border-radius:var(--radius);
  padding:1.4rem 1.5rem;
}
.contact-card .ico{color:var(--maroon); font-size:1.3rem; margin-bottom:.4rem;}
.form-control, .form-select{
  border-radius:4px; border:1px solid var(--line); padding:.65rem .8rem;
}
.form-control:focus, .form-select:focus{
  border-color:var(--maroon); box-shadow:0 0 0 .2rem rgba(122,20,32,.12);
}
.map-frame{border-radius:var(--radius); overflow:hidden; border:1px solid var(--line); height:100%; min-height:280px;}

/* ============== CTA strip ============== */
.cta-strip{
  background:var(--charcoal); color:#fff; padding:2.6rem 0;
}
.cta-strip h2{color:#fff; margin-bottom:.2rem;}
.cta-strip p{color:#cfc7bb; margin-bottom:0;}

/* ============== Footer ============== */
.site-footer{background:var(--navy); color:#cbd6e6;}
.site-footer h4{color:#fff; font-size:1rem; margin-bottom:1rem;}
.site-footer a{color:#cbd6e6;}
.site-footer a:hover{color:var(--orange);}
.site-footer ul{list-style:none; padding:0; margin:0;}
.site-footer ul li{margin-bottom:.55rem; font-size:.92rem;}
.footer-brand{display:flex; align-items:center; gap:.6rem; margin-bottom:1rem;}
.footer-brand img{height:44px;}
.footer-brand span{font-family:var(--font-display); color:#fff; font-size:1.05rem;}
.social-row a{
  display:inline-flex; align-items:center; justify-content:center;
  width:36px; height:36px; border-radius:50%; border:1px solid rgba(255,255,255,.25);
  margin-right:.5rem;
}
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.12); padding:1rem 0; font-size:.85rem; color:#9fb0c8;
}

/* back to top */
#backToTop{
  position:fixed; right:22px; bottom:22px; z-index:1050;
  width:44px; height:44px; border-radius:50%; background:var(--maroon); color:#fff;
  display:none; align-items:center; justify-content:center; border:none; box-shadow:var(--shadow);
}

/* ============== Responsive ============== */
@media (max-width: 991.98px){
  .hero-carousel .carousel-item{height:64vh;}
  .site-nav .btn-brand{margin:.6rem 0 0;}
}
@media (max-width: 575.98px){
  .hero-carousel .carousel-item{height:56vh; min-height:380px;}
  .person-card .photo{width:120px; height:120px;}
}

/* reduced motion */
@media (prefers-reduced-motion: reduce){
  *{scroll-behavior:auto !important; transition:none !important; animation:none !important;}
}