/* ============================================================
   Sagar Refractory — Custom Styles
   Theme: Industrial dark base + molten gold accent
   ============================================================ */

:root {
  --sr-dark:        #0e1116;
  --sr-dark-2:      #161b22;
  --sr-dark-3:      #1f262e;
  --sr-gold:        #e9b430;
  --sr-gold-2:      #f6d365;
  --sr-gold-deep:   #c9920f;
  --sr-steel:       #8a949e;
  --sr-light:       #f5f6f8;
  --sr-body:        #5a6470;
  --sr-heading:     #1a1f27;
  --sr-gold-grad:   linear-gradient(135deg, #f6d365 0%, #e9b430 45%, #c9920f 100%);
}

* { scroll-behavior: smooth; }

html, body {
  max-width: 100%;
  overflow-x: hidden;
}

body {
  font-family: 'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;
  color: var(--sr-body);
  font-size: 1rem;
  line-height: 1.75;
}

/* Media never overflows its container */
img, picture, iframe, video { max-width: 100%; }

h1, h2, h3, h4, h5, h6 {
  font-family: 'Poppins', 'Segoe UI', sans-serif;
  font-weight: 700;
  color: var(--sr-heading);
  letter-spacing: -0.01em;
}

a { text-decoration: none; transition: all .25s ease; }

.text-gold { color: var(--sr-gold-deep) !important; }
.bg-dark-sr { background-color: var(--sr-dark) !important; }
.bg-dark-2 { background-color: var(--sr-dark-2) !important; }
.bg-soft { background-color: #f7f8fa !important; }

.gold-grad-text {
  background: var(--sr-gold-grad);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* ---------- Section helpers ---------- */
.section { padding: 96px 0; }
.section-sm { padding: 64px 0; }

.section-label {
  display: inline-block;
  font-family: 'Poppins', sans-serif;
  font-size: .78rem;
  font-weight: 600;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--sr-gold-deep);
  margin-bottom: .9rem;
}
.section-label::before {
  content: "";
  display: inline-block;
  width: 28px;
  height: 2px;
  background: var(--sr-gold);
  vertical-align: middle;
  margin-right: 12px;
}

.section-title {
  font-size: clamp(1.7rem, 3.4vw, 2.6rem);
  margin-bottom: 1rem;
}

/* ---------- Buttons ---------- */
.btn { font-family: 'Poppins', sans-serif; font-weight: 600; border-radius: 4px; padding: .72rem 1.7rem; letter-spacing: .01em; }
.btn-gold {
  background: var(--sr-gold-grad);
  border: none;
  color: #1a1206;
  box-shadow: 0 8px 22px -8px rgba(233,180,48,.7);
}
.btn-gold:hover { color: #1a1206; transform: translateY(-2px); box-shadow: 0 12px 28px -8px rgba(233,180,48,.85); }
.btn-outline-gold { border: 2px solid var(--sr-gold); color: var(--sr-gold-deep); background: transparent; }
.btn-outline-gold:hover { background: var(--sr-gold); color: #1a1206; }
.btn-outline-light { border: 2px solid rgba(255,255,255,.5); color: #fff; }
.btn-outline-light:hover { background: #fff; color: var(--sr-dark); border-color: #fff; }

/* ---------- Navbar ---------- */
.navbar {
  background: rgba(14,17,22,.92);
  backdrop-filter: blur(10px);
  padding: .65rem 0;
  transition: all .3s ease;
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.navbar.scrolled { box-shadow: 0 10px 30px -12px rgba(0,0,0,.5); padding: .45rem 0; }
.navbar-brand img { height: 52px; transition: height .3s ease; }
.navbar.scrolled .navbar-brand img { height: 44px; }
.navbar-brand .brand-text { font-family: 'Poppins', sans-serif; font-weight: 700; color: #fff; font-size: 1.15rem; line-height: 1.1; }
.navbar-brand .brand-text small { display: block; margin-top: .22rem; font-size: .62rem; font-weight: 500; letter-spacing: .28em; color: var(--sr-gold); text-transform: uppercase; }
.navbar .nav-link {
  color: rgba(255,255,255,.82) !important;
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
  font-size: .94rem;
  padding: .5rem 1rem !important;
  position: relative;
}
.navbar .nav-link::after {
  content: ""; position: absolute; left: 1rem; right: 1rem; bottom: .3rem;
  height: 2px; background: var(--sr-gold); transform: scaleX(0); transform-origin: left; transition: transform .3s ease;
}
.navbar .nav-link:hover::after, .navbar .nav-link.active::after { transform: scaleX(1); }
.navbar .nav-link.active, .navbar .nav-link:hover { color: #fff !important; }
.navbar-toggler { border-color: rgba(233,180,48,.55); padding:.35rem .55rem; }
.navbar-toggler:focus { box-shadow: 0 0 0 .2rem rgba(233,180,48,.25); }
/* Gold hamburger bars (override Bootstrap's default dark SVG) */
.navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23e9b430' stroke-width='2.5' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

/* ---------- Hero ---------- */
.hero {
  position: relative;
  min-height: 92vh;
  display: flex;
  align-items: center;
  color: #fff;
  background:
    linear-gradient(115deg, rgba(14,17,22,.94) 0%, rgba(14,17,22,.78) 55%, rgba(14,17,22,.45) 100%),
    radial-gradient(circle at 80% 20%, rgba(233,180,48,.16), transparent 45%),
    url("../img/steel-plant.webp") center/cover no-repeat;
}
.hero::after {
  content:""; position:absolute; inset:0;
  background: linear-gradient(0deg, var(--sr-dark) 0%, transparent 22%);
  pointer-events:none;
}
.hero .container { position: relative; z-index: 2; }
.hero h1 { color: #fff; font-size: clamp(2.1rem, 5vw, 3.8rem); line-height: 1.1; margin-bottom: 1.3rem; }
.hero .lead { color: rgba(255,255,255,.85); font-size: 1.15rem; max-width: 600px; }
.hero-badge {
  display:inline-flex; align-items:center; gap:.5rem;
  background: rgba(233,180,48,.12); border:1px solid rgba(233,180,48,.35);
  color: var(--sr-gold-2); border-radius:50px; padding:.4rem 1.1rem;
  font-size:.82rem; font-weight:600; letter-spacing:.04em; margin-bottom:1.5rem;
}
.hero-features { list-style:none; padding:0; margin:1.6rem 0 0; display:flex; flex-wrap:wrap; gap:.6rem 1.6rem; }
.hero-features li { color:rgba(255,255,255,.9); font-weight:500; font-size:.95rem; }
.hero-features li i { color: var(--sr-gold); margin-right:.5rem; }

/* page banner (interior pages) */
.page-banner {
  position: relative;
  padding: 150px 0 70px;
  color:#fff; text-align:center;
  background:
    linear-gradient(115deg, rgba(14,17,22,.92), rgba(14,17,22,.78)),
    radial-gradient(circle at 70% 30%, rgba(233,180,48,.18), transparent 50%),
    url("../img/Tundish-Furnace.webp") center/cover no-repeat;
}
.page-banner h1 { color:#fff; font-size: clamp(2rem,4.5vw,3rem); }
.page-banner .breadcrumb { justify-content:center; margin:0; }
.page-banner .breadcrumb a { color: var(--sr-gold-2); }
.page-banner .breadcrumb-item.active { color: rgba(255,255,255,.7); }
.page-banner .breadcrumb-item + .breadcrumb-item::before { color: rgba(255,255,255,.4); }

/* ---------- Stat strip ---------- */
.stat-strip { background: var(--sr-gold-grad); }
.stat-item { text-align:center; padding:2rem 1rem; color:#1a1206; }
.stat-item .num { font-family:'Poppins',sans-serif; font-weight:800; font-size:2.6rem; line-height:1; }
.stat-item .label { font-weight:600; font-size:.92rem; text-transform:uppercase; letter-spacing:.08em; opacity:.85; }

/* ---------- Feature cards ---------- */
.feature-card {
  background:#fff; border:1px solid #edf0f3; border-radius:10px;
  padding:2.2rem 1.8rem; height:100%; transition:all .3s ease;
}
.feature-card:hover { transform:translateY(-6px); box-shadow:0 24px 48px -22px rgba(20,25,30,.25); border-color:transparent; }
.feature-icon {
  width:60px; height:60px; border-radius:12px; display:flex; align-items:center; justify-content:center;
  background: rgba(233,180,48,.14); color: var(--sr-gold-deep); font-size:1.5rem; margin-bottom:1.2rem;
}
.feature-card h5 { margin-bottom:.6rem; font-size:1.15rem; }
.feature-card p { font-size:.94rem; margin:0; }

/* ---------- Product cards ---------- */
.product-card {
  background:#fff; border-radius:12px; overflow:hidden;
  box-shadow:0 14px 40px -26px rgba(20,25,30,.4); height:100%;
  transition:all .35s ease; border:1px solid #eef1f4;
}
.product-card:hover { transform:translateY(-8px); box-shadow:0 30px 60px -28px rgba(20,25,30,.45); }
.product-media { position:relative; height:260px; overflow:hidden; }
.product-media picture { display:block; width:100%; height:100%; }
.product-media img { width:100%; height:100%; object-fit:cover; transition:transform .6s ease; }
.product-card:hover .product-media img { transform:scale(1.08); }
.product-media .tag {
  position:absolute; top:14px; left:14px; background:var(--sr-gold-grad);
  color:#1a1206; font-family:'Poppins',sans-serif; font-weight:600; font-size:.72rem;
  letter-spacing:.06em; padding:.3rem .8rem; border-radius:50px; text-transform:uppercase;
}
.product-body { padding:1.8rem; }
.product-body h4 { font-size:1.3rem; margin-bottom:.7rem; }
.spec-list { list-style:none; padding:0; margin:1.1rem 0 0; }
.spec-list li { padding:.35rem 0; font-size:.9rem; border-bottom:1px dashed #e7eaee; display:flex; justify-content:space-between; }
.spec-list li:last-child { border-bottom:none; }
.spec-list li span:first-child { color:var(--sr-steel); }
.spec-list li span:last-child { font-weight:600; color:var(--sr-heading); }

/* ---------- About image ---------- */
.about-img-wrap { position:relative; }
.about-img-wrap picture { display:block; }
.about-img-wrap img { border-radius:12px; width:100%; height:auto; display:block; box-shadow:0 30px 60px -30px rgba(20,25,30,.5); }
.about-exp-badge {
  position:absolute; bottom:-24px; right:-10px;
  background:var(--sr-gold-grad); color:#1a1206; border-radius:12px;
  padding:1.2rem 1.5rem; text-align:center; box-shadow:0 18px 40px -16px rgba(233,180,48,.7);
}
.about-exp-badge .n { font-family:'Poppins',sans-serif; font-weight:800; font-size:2.1rem; line-height:1; }
.about-exp-badge .t { font-size:.78rem; font-weight:600; text-transform:uppercase; letter-spacing:.06em; }

.check-list { list-style:none; padding:0; margin:1.4rem 0 0; }
.check-list li { padding:.4rem 0; font-weight:500; color:var(--sr-heading); }
.check-list li i { color:var(--sr-gold-deep); margin-right:.65rem; }

/* ---------- Industries / use cases ---------- */
.industry-card {
  position:relative; border-radius:10px; overflow:hidden; height:220px; display:flex; align-items:flex-end;
}
.industry-card img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.industry-card::after { content:""; position:absolute; inset:0; background:linear-gradient(0deg, rgba(14,17,22,.88), transparent 70%); }
.industry-card:hover img { transform:scale(1.08); }
.industry-card .cap { position:relative; z-index:2; color:#fff; padding:1.3rem; font-family:'Poppins',sans-serif; font-weight:600; }

/* ---------- Process steps ---------- */
.process-step { text-align:center; padding:1rem; }
.process-num {
  width:64px; height:64px; margin:0 auto 1.1rem; border-radius:50%;
  background:var(--sr-dark); color:var(--sr-gold-2); display:flex; align-items:center; justify-content:center;
  font-family:'Poppins',sans-serif; font-weight:700; font-size:1.3rem; border:2px solid var(--sr-gold);
}
.process-step h6 { font-size:1.05rem; margin-bottom:.4rem; }
.process-step p { font-size:.88rem; }

/* ---------- Sustainability ---------- */
.sus-card { background:#fff; border-radius:10px; padding:2rem; height:100%; border:1px solid #eef1f4; transition:all .3s; }
.sus-card:hover { box-shadow:0 24px 48px -24px rgba(20,25,30,.22); transform:translateY(-5px); }
.sus-icon { font-size:2rem; color:var(--sr-gold-deep); margin-bottom:1rem; }
.sus-metric { background:var(--sr-dark-2); border-radius:10px; padding:2rem; text-align:center; color:#fff; height:100%; }
.sus-metric .n { font-family:'Poppins',sans-serif; font-weight:800; font-size:2.4rem; color:var(--sr-gold-2); line-height:1; }
.sus-metric .l { font-size:.9rem; color:rgba(255,255,255,.7); margin-top:.5rem; }

/* ---------- CTA band ---------- */
.cta-band {
  position:relative; color:#fff; text-align:center; padding:80px 0;
  background:
    linear-gradient(115deg, rgba(14,17,22,.93), rgba(31,38,46,.86)),
    url("../img/furnace-factory.webp") center/cover fixed no-repeat;
}
/* background-attachment:fixed jitters / overflows on touch devices */
@media (hover: none), (max-width: 991px) {
  .cta-band { background-attachment: scroll; }
}
.cta-band h2 { color:#fff; font-size:clamp(1.6rem,3.5vw,2.4rem); }
.cta-band p { color:rgba(255,255,255,.82); max-width:640px; margin:0 auto 1.8rem; }

/* ---------- Contact ---------- */
.contact-card { background:#fff; border:1px solid #eef1f4; border-radius:10px; padding:1.8rem; height:100%; transition:.3s; }
.contact-card:hover { box-shadow:0 22px 48px -26px rgba(20,25,30,.25); }
.contact-card .ic { width:54px; height:54px; border-radius:10px; background:rgba(233,180,48,.14); color:var(--sr-gold-deep); display:flex; align-items:center; justify-content:center; font-size:1.3rem; margin-bottom:1rem; }
.contact-card h6 { margin-bottom:.3rem; }
.form-control, .form-select { border-radius:6px; border:1px solid #dde2e8; padding:.8rem 1rem; font-size:.95rem; }
.form-control:focus, .form-select:focus { border-color:var(--sr-gold); box-shadow:0 0 0 .2rem rgba(233,180,48,.18); }
.form-label { font-weight:600; color:var(--sr-heading); font-size:.9rem; }

/* ---------- Footer ---------- */
.footer { background:var(--sr-dark); color:rgba(255,255,255,.62); padding-top:72px; }
.footer h6 { color:#fff; font-size:1rem; margin-bottom:1.2rem; letter-spacing:.02em; }
.footer a { color:rgba(255,255,255,.62); }
.footer a:hover { color:var(--sr-gold-2); }
.footer .footer-brand { display:inline-flex; align-items:center; gap:.65rem; margin-bottom:1.1rem; text-decoration:none; }
.footer .footer-brand img { height:52px; margin-bottom:0; }
.footer .footer-brand .brand-text { font-family:'Poppins',sans-serif; font-weight:700; color:#fff; font-size:1.2rem; line-height:1.1; }
.footer .footer-brand .brand-text small { display:block; margin-top:.22rem; font-size:.64rem; font-weight:500; letter-spacing:.28em; color:var(--sr-gold); text-transform:uppercase; }
.footer .footer-brand:hover .brand-text { color:#fff; }
.footer ul { list-style:none; padding:0; margin:0; }
.footer ul li { margin-bottom:.6rem; font-size:.93rem; }
.footer .social a {
  width:38px; height:38px; border-radius:8px; display:inline-flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,.07); color:#fff; margin-right:.5rem;
}
.footer .social a:hover { background:var(--sr-gold); color:#1a1206; }
.footer-contact li { display:flex; gap:.7rem; }
.footer-contact li i { color:var(--sr-gold); margin-top:.35rem; }
.footer-bottom { border-top:1px solid rgba(255,255,255,.08); margin-top:56px; padding:22px 0; font-size:.85rem; }

/* ---------- WhatsApp float ---------- */
.wa-float {
  position:fixed; bottom:24px; right:24px; z-index:999;
  width:56px; height:56px; border-radius:50%; background:#25d366; color:#fff;
  display:flex; align-items:center; justify-content:center; font-size:1.7rem;
  box-shadow:0 10px 26px -8px rgba(37,211,102,.7); animation:wapulse 2.2s infinite;
}
.wa-float:hover { color:#fff; transform:scale(1.07); }
@keyframes wapulse { 0%{box-shadow:0 0 0 0 rgba(37,211,102,.5);} 70%{box-shadow:0 0 0 14px rgba(37,211,102,0);} 100%{box-shadow:0 0 0 0 rgba(37,211,102,0);} }

/* ---------- Misc ---------- */
.divider-gold { width:60px; height:3px; background:var(--sr-gold-grad); border:none; opacity:1; border-radius:3px; }
.lead-muted { color:var(--sr-steel); }
[data-aos] { will-change: transform, opacity; }

/* ---------- Responsive ---------- */
@media (max-width: 1199px){
  .navbar-brand .brand-text { font-size: 1.05rem; }
}

@media (max-width: 991px){
  .navbar { background: rgba(14,17,22,.97); }
  .navbar-collapse {
    margin-top:.5rem; padding:.5rem .25rem 1rem;
    border-top:1px solid rgba(255,255,255,.08);
  }
  .navbar .nav-link::after { display:none; }
  .navbar .nav-item .btn-gold { margin-top:.6rem; display:inline-block; }
  .section { padding:64px 0; }
  .hero { min-height:auto; padding:120px 0 70px; }
  .about-exp-badge { right:14px; bottom:-18px; padding:1rem 1.2rem; }
  .about-exp-badge .n { font-size:1.7rem; }
}

@media (max-width: 767px){
  .section, .cta-band { padding:52px 0; }
  .page-banner { padding:120px 0 48px; }
  .hero h1 { font-size: clamp(1.8rem, 8vw, 2.6rem); }
  .hero .lead { font-size:1.02rem; }
  .hero-features { gap:.4rem 1.1rem; }
  .stat-item { padding:1.4rem .5rem; }
  .stat-item .num { font-size:2rem; }
  .stat-item .label { font-size:.78rem; }
  .feature-card, .sus-card, .contact-card { padding:1.6rem 1.3rem; }
  .product-body { padding:1.4rem; }
  .footer { padding-top:52px; }
  .footer-bottom { margin-top:36px; text-align:center; }
  .footer-bottom > span { display:block; margin:.2rem 0; }
}

@media (max-width: 575px){
  .navbar-brand img { height:42px; }
  .navbar-brand .brand-text { font-size:.98rem; }
  .navbar-brand .brand-text small { font-size:.56rem; letter-spacing:.2em; }
  .hero-badge { font-size:.74rem; }
  .hero .btn, .cta-band .btn { width:100%; }
  .cta-band .btn + .btn { margin-top:.6rem; margin-left:0 !important; }
  .about-exp-badge { right:50%; transform:translateX(50%); bottom:-22px; }
  .wa-float { width:50px; height:50px; font-size:1.5rem; bottom:18px; right:18px; }
}
