
:root{
  --ink:#eaeaea;
  --ink-dim:rgba(234,234,234,.82);
  --bg:#0b1520;
  --gold:#c6a16b;
  --muted:#b9c5d3;
  --panel:#0e1b28;
  --card:#101f2d;
  --card-border:#1f3348;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;scroll-behavior:smooth}
body{font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Noto Sans", sans-serif; background:var(--bg); color:#dde7f1}
a{color:inherit;text-decoration:none}
/* Top contact bar */
.header-top{position:fixed; z-index:60; left:0; right:0; top:0;
  height:40px; display:flex; align-items:center; gap:18px; padding:0 24px;
  background:linear-gradient(90deg, rgba(7,13,20,.9), rgba(10,17,26,.6));
  border-bottom:1px solid rgba(255,255,255,.08); color:#f1f5fb;
  font-weight:600; font-size:15px; letter-spacing:.15px}
.header-top .sp{opacity:.45;margin:0 12px}
/* Navbar */
.navbar{position:fixed; z-index:55; left:0; right:0; top:40px; height:56px;
  display:flex; align-items:center; justify-content:space-between; padding:0 26px;
  background:linear-gradient(90deg, rgba(7,11,17,.65), rgba(9,13,19,.35)); backdrop-filter:blur(6px);
  border-bottom:1px solid rgba(255,255,255,.07);}
.brand{display:flex; align-items:center; gap:12px; font-weight:800; color:#e8f1fb}
.brand .logo{display:none} /* remove icon next to text as requested */
.nav{display:flex; gap:26px; color:#dfe8f1; font-weight:600}
.nav a{opacity:.85}
.nav a:hover{opacity:1}
/* Hero */
.hero{position:relative; margin-top:96px; height:92vh; min-height:640px; overflow:hidden}
.slide{position:absolute; inset:0; background-position:center; background-size:cover; animation:fade 28s infinite; opacity:0}
.slide::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,.55))}
@keyframes fade{
  0%{opacity:1} 22%{opacity:1} 33%{opacity:0}
  33.01%{opacity:0} 55%{opacity:1} 66%{opacity:0}
  66.01%{opacity:0} 88%{opacity:1} 100%{opacity:1}
}
.slide:nth-child(1){background-image:url('assets/books.jpg'); animation-delay:0s}
.slide:nth-child(2){background-image:url('assets/temple.jpg'); animation-delay:7s}
.slide:nth-child(3){background-image:url('assets/roma1.jpg'); animation-delay:14s}
.slide:nth-child(4){background-image:url('assets/roma2.jpg'); animation-delay:21s}
.hero-inner{position:absolute; inset:0; display:grid; place-items:center}
.quote{max-width:1060px; text-align:center; line-height:1.2}
.quote .text{font-size:40px; font-weight:800; color:var(--ink-dim); text-shadow:0 8px 30px rgba(0,0,0,.65)}
.quote .author{margin-top:26px; font-size:18px; color:var(--gold); opacity:.95}
/* Sections scaffold */
.section{padding:84px 22px}
.container{max-width:1200px; margin:0 auto}
/* About */
.about{background:#0c1724}
.grid{display:grid; grid-template-columns:1.1fr .9fr; gap:40px; align-items:center}
h2{font-size:44px; margin:0 0 18px; color:#eef5ff}
.card{background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.06); border-radius:16px; padding:22px; box-shadow:0 16px 40px rgba(0,0,0,.25)}
.about p{color:#c7d6e6; line-height:1.7; font-size:16px}
.btn{display:inline-flex; align-items:center; gap:10px; padding:12px 18px; border-radius:12px; border:1px solid rgba(255,255,255,.18); background:rgba(255,255,255,.06); color:#fff; font-weight:700}
.btn:hover{background:rgba(255,255,255,.12)}
.about .photo{border-radius:18px; overflow:hidden; box-shadow:0 28px 60px rgba(0,0,0,.35)}
.about .photo img{width:100%; display:block; object-fit:cover}
/* Services */
.services{background:#0b1520}
.cards{display:grid; grid-template-columns:repeat(4,1fr); gap:20px}
.svc{background:var(--card); border:1px solid var(--card-border); border-radius:16px; padding:22px; box-shadow:0 18px 40px rgba(0,0,0,.22)}
.svc h3{margin:0 0 8px; color:#eaf3ff}
.svc p{margin:0; color:#c1cfdd; font-size:15px; line-height:1.6}
/* Contact */
.contact{background:#0c1724}
.contact .row{display:grid; grid-template-columns:1fr 1fr; gap:30px}
.map{min-height:340px; border-radius:16px; overflow:hidden; border:1px solid rgba(255,255,255,.08)}
/* Floating buttons bottom-left */
.fabs{position:fixed; left:18px; bottom:18px; display:flex; flex-direction:column; gap:12px; z-index:80}
.fab{width:46px; height:46px; display:grid; place-items:center; border-radius:999px; box-shadow:0 12px 26px rgba(0,0,0,.35); border:1px solid rgba(255,255,255,.12)}
.fab.phone{background:#0f2130}
.fab.wa{background:#25D366}
.fab svg{width:24px;height:24px; fill:#fff}
/* Footer */
.footer{padding:28px 22px; text-align:center; color:#bcd}
/* Responsive */
@media (max-width:1024px){
  .cards{grid-template-columns:repeat(2,1fr)}
  .grid{grid-template-columns:1fr; gap:26px}
  .quote .text{font-size:32px}
}
@media (max-width:640px){
  .nav{display:none}
  .quote .text{font-size:26px}
  .header-top{font-size:14px}
}
