/* =========================================================
   SHAKTI CAST — Design tokens
   ========================================================= */
:root{
  --red:#C41230;
  --red-dark:#920D24;
  --black:#0B0B0C;
  --charcoal:#17181B;
  --charcoal-2:#1F2024;
  --steel:#4B5563;
  --steel-light:#8B94A0;
  --bg:#F3F2EF;
  --bg-alt:#EAE8E3;
  --white:#FFFFFF;

  --font-display:'Oswald', sans-serif;
  --font-body:'Inter', sans-serif;
  --font-mono:'JetBrains Mono', monospace;

  --container:1240px;
  --radius:2px;
  --ease:cubic-bezier(.22,.68,0,1);
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:var(--font-body);
  color:var(--black);
  background:var(--bg);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img,svg{display:block;max-width:100%;}
a{color:inherit;text-decoration:none;}
h1,h2,h3,h4,h5{font-family:var(--font-display);margin:0;line-height:1.05;text-transform:uppercase;letter-spacing:.01em;}
p{margin:0;line-height:1.7;color:var(--steel);}
button{font-family:inherit;cursor:pointer;background:none;border:none;}
.container{max-width:var(--container);margin:0 auto;padding:0 32px;}

:focus-visible{outline:2px solid var(--red);outline-offset:3px;}

@media (prefers-reduced-motion: reduce){
  *{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important;}
}

/* =========================================================
   Preloader
   ========================================================= */
.preloader{
  position:fixed;inset:0;background:var(--black);z-index:9999;
  display:flex;align-items:center;justify-content:center;
  transition:opacity .6s var(--ease), visibility .6s var(--ease);
}
.preloader.is-hidden{opacity:0;visibility:hidden;}
.preloader__mark{
  width:44px;height:44px;
  clip-path:polygon(50% 0%, 100% 100%, 0% 100%);
  background:var(--red);
  animation:pulse 1.1s ease-in-out infinite;
}
@keyframes pulse{0%,100%{transform:scale(1);opacity:1;}50%{transform:scale(.72);opacity:.55;}}

/* =========================================================
   Eyebrow / tags / buttons — shared
   ========================================================= */
.eyebrow{
  display:inline-block;font-family:var(--font-mono);font-size:11px;
  letter-spacing:.14em;text-transform:uppercase;color:var(--red);
  margin-bottom:14px;font-weight:600;
}
.eyebrow--light{color:#FF6B7D;}

.tag-badge{
  display:inline-flex;align-items:center;gap:8px;
  padding:8px 16px;border:1px solid rgba(255,255,255,.25);
  border-radius:999px;color:#fff;font-size:12px;letter-spacing:.08em;
  text-transform:uppercase;font-weight:600;margin-bottom:26px;
  background:rgba(196,18,48,.12);
}
.tag-badge__dot{width:6px;height:6px;border-radius:50%;background:var(--red);box-shadow:0 0 0 4px rgba(196,18,48,.25);}

.btn{
  display:inline-flex;align-items:center;gap:10px;
  padding:15px 28px;font-family:var(--font-display);font-size:13px;
  letter-spacing:.08em;text-transform:uppercase;font-weight:600;
  border-radius:var(--radius);transition:transform .35s var(--ease), background .3s, box-shadow .3s, color .3s;
  white-space:nowrap;
}
.btn span{transition:transform .3s var(--ease);}
.btn:hover span{transform:translateX(4px);}
.btn--primary{background:var(--red);color:#fff;box-shadow:0 10px 24px -10px rgba(196,18,48,.6);}
.btn--primary:hover{background:var(--red-dark);transform:translateY(-2px);}
.btn--outline{border:1.5px solid var(--black);color:var(--black);}
.btn--outline:hover{background:var(--black);color:#fff;}
.btn--ghost{border:1.5px solid rgba(255,255,255,.35);color:#fff;}
.btn--ghost:hover{border-color:#fff;background:rgba(255,255,255,.08);}
.btn--sm{padding:11px 18px;font-size:11.5px;}

.link-arrow{
  display:inline-flex;align-items:center;gap:6px;
  font-family:var(--font-mono);font-size:12px;letter-spacing:.05em;
  text-transform:uppercase;font-weight:600;color:var(--black);
  border-bottom:1px solid transparent;padding-bottom:2px;
  transition:border-color .3s, color .3s;
}
.link-arrow span{transition:transform .3s var(--ease);}
.link-arrow:hover{color:var(--red);border-color:var(--red);}
.link-arrow:hover span{transform:translateX(4px);}
.link-arrow--sm{font-size:11px;}

/* =========================================================
   Top utility bar
   ========================================================= */
.topbar{background:var(--black);padding:9px 0;}
.topbar__inner{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;}
.topbar__contact{display:flex;align-items:center;gap:26px;flex-wrap:wrap;}
.topbar__contact a{display:flex;align-items:center;gap:7px;font-size:12.5px;color:rgba(255,255,255,.75);transition:color .3s;}
.topbar__contact a svg{width:14px;height:14px;color:var(--red);flex-shrink:0;}
.topbar__contact a:hover{color:#fff;}
.topbar__badge{display:flex;align-items:center;gap:8px;font-family:var(--font-display);font-size:11.5px;letter-spacing:.05em;text-transform:uppercase;color:#fff;font-weight:600;white-space:nowrap;}
.topbar__badge svg{width:14px;height:14px;color:var(--red);flex-shrink:0;}

/* =========================================================
   Header
   ========================================================= */
.site-header{
  position:sticky;top:0;left:0;right:0;z-index:1000;
  background:#fff;padding:16px 0;
  border-bottom:3px solid var(--red);
  box-shadow:0 4px 24px -10px rgba(0,0,0,.1);
  transition:padding .3s var(--ease), box-shadow .3s var(--ease);
}
.site-header.is-scrolled{
  padding:10px 0;box-shadow:0 12px 30px -12px rgba(0,0,0,.18);
}
.header__inner{display:flex;align-items:center;justify-content:space-between;gap:24px;}

.brand{display:flex;align-items:center;gap:10px;}
.brand__mark{width:200px;height:auto;flex-shrink:0;object-fit:contain;}
.brand__text{font-family:var(--font-display);font-size:15px;letter-spacing:.03em;color:var(--black);text-transform:uppercase;line-height:1.1;display:flex;flex-direction:column;}
.brand__text strong{color:var(--red);}
.brand__text small{font-family:var(--font-mono);font-size:8px;letter-spacing:.16em;color:var(--steel-light);text-transform:uppercase;font-weight:500;margin-top:2px;}

.main-nav{display:flex;align-items:center;gap:30px;}
.main-nav a, .nav-item__trigger{
  font-family:var(--font-display);font-size:12.5px;letter-spacing:.06em;
  text-transform:uppercase;color:var(--black);font-weight:500;opacity:.72;
  display:flex;align-items:center;gap:5px;position:relative;padding:4px 0;
  transition:color .3s, opacity .3s;
}
.main-nav a svg, .nav-item__trigger svg{opacity:.6;transition:transform .3s var(--ease);}
.main-nav a::after, .nav-item__trigger::after{
  content:"";position:absolute;left:0;bottom:-2px;width:0;height:1.5px;background:var(--red);
  transition:width .3s var(--ease);
}
.main-nav a:hover, .main-nav a.active, .nav-item__trigger:hover{color:var(--red);opacity:1;}
.main-nav a:hover::after, .main-nav a.active::after{width:100%;}
.nav-item--mega{position:relative;}
.nav-item__trigger[aria-expanded="true"]{color:var(--red);opacity:1;}
.nav-item__trigger[aria-expanded="true"] svg{transform:rotate(180deg);}
.nav-item__trigger[aria-expanded="true"]::after{width:100%;}

.header__cta{flex-shrink:0;}
.header__cta svg{opacity:.9;}

.nav-toggle{display:none;flex-direction:column;gap:5px;width:26px;padding:6px 0;}
.nav-toggle span{display:block;width:100%;height:2px;background:var(--black);transition:transform .3s var(--ease), opacity .3s;}
.nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0;}
.nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

/* =========================================================
   Mega menu (Product)
   ========================================================= */
.mega-menu{
  position:absolute;top:calc(100% + 18px);left:-60px;width:640px;
  background:#fff;border-top:3px solid var(--red);
  box-shadow:0 34px 60px -18px rgba(0,0,0,.28);
  opacity:0;visibility:hidden;transform:translateY(-10px);z-index:999;
  transition:opacity .28s var(--ease), transform .28s var(--ease), visibility .28s;
}
.mega-menu.is-open{opacity:1;visibility:visible;transform:translateY(0);}
.mega-menu__inner{display:grid;grid-template-columns:260px 1fr;}

.mega-menu__categories{background:var(--bg-alt);padding:22px 0;}
.mega-menu__eyebrow{display:block;padding:0 24px;font-family:var(--font-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--red);font-weight:700;margin-bottom:4px;}
.mega-menu__label{display:block;padding:0 24px;font-family:var(--font-display);font-size:11.5px;letter-spacing:.04em;text-transform:uppercase;color:var(--black);margin-bottom:14px;font-weight:600;opacity:.7;}
.mega-cat{
  display:flex;align-items:center;justify-content:space-between;width:100%;
  padding:13px 24px;font-family:var(--font-display);font-size:13px;letter-spacing:.02em;
  text-transform:uppercase;color:var(--black);text-align:left;transition:background .25s,color .25s;
}
.mega-cat svg{opacity:.35;flex-shrink:0;transition:transform .25s, opacity .25s;color:var(--black);}
.mega-cat:hover{background:rgba(0,0,0,.045);}
.mega-cat.active{background:#fff;color:var(--red);font-weight:600;}
.mega-cat.active svg{opacity:1;color:var(--red);transform:translateX(2px);}

.mega-menu__detail{padding:26px 28px;min-height:230px;}
.mega-menu__panel{display:none;}
.mega-menu__panel.is-active{display:block;}
.mega-menu__detail-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;}
.mega-menu__detail-head h4{font-size:15px;}
.mega-menu__viewall{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--red);font-weight:700;display:flex;align-items:center;gap:5px;}
.mega-menu__item{
  display:flex;align-items:center;justify-content:space-between;
  padding:11px 0;font-family:var(--font-display);font-size:13px;letter-spacing:.02em;
  text-transform:uppercase;color:var(--black);border-bottom:1px solid rgba(0,0,0,.07);
  transition:color .25s, padding-left .25s;
}
.mega-menu__item span{opacity:.35;transition:transform .25s,opacity .25s;}
.mega-menu__item:hover{color:var(--red);padding-left:6px;}
.mega-menu__item:hover span{opacity:1;transform:translateX(3px);}

.mega-menu__footer{
  display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
  margin-top:18px;padding-top:16px;border-top:1px dashed rgba(0,0,0,.14);
}
.mega-menu__footer span{font-size:12px;color:var(--steel);}

.mega-menu-backdrop{
  position:fixed;inset:0;background:rgba(11,11,12,.4);z-index:960;
  opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s;
}
.mega-menu-backdrop.is-open{opacity:1;visibility:visible;}

/* =========================================================
   Hero
   ========================================================= */
.hero{
  position:relative;min-height:92vh;display:flex;flex-direction:column;justify-content:center;
  background:var(--black);overflow:hidden;padding-top:70px;
}
.hero__slider{position:absolute;inset:0;width:100%;height:100%;z-index:0;overflow:hidden;}
.hero__slide{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:0;transform:scale(1.08);
  transition:opacity 1.6s var(--ease), transform 7s linear;
}
.hero__slide.is-active{opacity:1;transform:scale(1);z-index:1;}
.hero__overlay{
  position:absolute;
  inset:0;
  z-index:1;
  background:
    radial-gradient(
      ellipse 30% 70% at 85% 25%,
      rgba(196,18,48,.12),
      transparent 65%
    ),
    radial-gradient(
      ellipse 30% 60% at 10% 85%,
      rgba(196,18,48,.08),
      transparent 65%
    ),
    linear-gradient(
      90deg,
      rgba(11,11,12,.55) 0%,
      rgba(11,11,12,.38) 40%,
      rgba(11,11,12,.20) 70%,
      rgba(11,11,12,.15) 100%
    );
}
.hero__dots{
  position:absolute;right:32px;bottom:120px;z-index:3;
  display:flex;flex-direction:column;gap:10px;
}
.hero__dot{
  width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.3);
  transition:background .3s, transform .3s, width .3s, height .3s;
}
.hero__dot:hover{background:rgba(255,255,255,.6);}
.hero__dot.is-active{background:var(--red);width:10px;height:24px;border-radius:6px;}
.hero__grid{
  position:absolute;inset:0;opacity:.35;z-index:1;
  background-image:
    linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px);
  background-size:56px 56px;
  mask-image:radial-gradient(ellipse 80% 70% at 60% 40%, black, transparent 75%);
}
.hero__inner{
  position:relative;
  z-index:2;
  width:100%;
  max-width:820px;
  padding-bottom:70px;
  margin-left:100px;
  margin-right:auto;
  text-align:left;
}
.hero__title{
  font-size:clamp(40px, 7vw, 84px);color:#fff;font-weight:700;
  letter-spacing:0;
}
.hero__title span{color:var(--red);}
.hero__sub{
  margin-top:26px;max-width:560px;font-size:16px;color:rgba(255,255,255,.62);
}
.hero__actions{margin-top:38px;}

.hero__strip{
  position:relative;z-index:2;border-top:1px solid rgba(255,255,255,.1);
  padding:22px 0;background:rgba(255,255,255,.02);
}
.hero__strip-inner{display:flex;flex-wrap:wrap;gap:36px;}
.hero__strip-inner span{
  display:flex;align-items:center;gap:9px;font-family:var(--font-display);
  font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.72);
}
.dot{width:6px;height:6px;background:var(--red);border-radius:50%;flex-shrink:0;}

/* =========================================================
   About
   ========================================================= */
.about{padding:120px 0;background:var(--bg);}
.about__inner{display:grid;grid-template-columns:.85fr 1.15fr;gap:70px;align-items:center;}
.about__frame{position:relative;}
.about__illustration{border-radius:var(--radius);width:100%;height:560px;object-fit:cover;box-shadow:0 30px 60px -30px rgba(0,0,0,.4);background:var(--charcoal);}
.about__badge{
  position:absolute;left:-28px;bottom:-28px;background:#fff;padding:22px 26px;
  box-shadow:0 20px 40px -18px rgba(0,0,0,.25);border-radius:var(--radius);
  border-left:4px solid var(--red);max-width:210px;
}
.about__badge strong{font-family:var(--font-display);font-size:38px;color:var(--black);display:block;line-height:1;}
.about__badge strong span{color:var(--red);}
.about__badge p{font-size:12px;margin-top:8px;color:var(--steel);}

.about__content h2{font-size:clamp(28px,3.4vw,42px);margin-bottom:22px;}
.about__content p{margin-bottom:16px;max-width:560px;}
.about__actions{display:flex;align-items:center;gap:32px;margin-top:30px;flex-wrap:wrap;}

/* =========================================================
   Stats
   ========================================================= */
.stats{position:relative;background:var(--black);padding:100px 0;overflow:hidden;}
.stats__glow{
  position:absolute;top:-30%;right:-10%;width:60%;height:160%;
  background:radial-gradient(ellipse, rgba(196,18,48,.25), transparent 65%);
}
.stats__head{position:relative;z-index:2;text-align:center;max-width:600px;margin:0 auto 60px;}
.stats__head h3{color:#fff;font-size:clamp(24px,3vw,34px);margin-top:6px;}
.stats__grid{
  position:relative;z-index:2;display:grid;grid-template-columns:repeat(5,1fr);
  gap:1px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.08);
}
.stat{background:var(--black);padding:34px 24px;text-align:center;transition:background .4s;}
.stat:hover{background:var(--charcoal);}
.stat strong{display:block;font-family:var(--font-display);color:var(--red);font-size:clamp(30px,3.4vw,44px);line-height:1;}
.stat__suffix{font-size:.55em;}
.stat p{color:#fff;font-family:var(--font-display);font-size:12.5px;letter-spacing:.05em;text-transform:uppercase;margin-top:12px;}
.stat small{display:block;color:rgba(255,255,255,.4);font-size:11.5px;margin-top:8px;line-height:1.5;}

/* =========================================================
   Products
   ========================================================= */
.products{padding:120px 0;}
.products__head{
  display:flex;justify-content:space-between;align-items:flex-end;gap:40px;
  margin-bottom:44px;flex-wrap:wrap;
}
.products__head h2{font-size:clamp(28px,3.4vw,40px);max-width:420px;}
.products__lede{max-width:360px;font-size:14.5px;}

.tabs{display:flex;gap:0;margin-bottom:40px;border:1px solid var(--black);width:fit-content;border-radius:var(--radius);overflow:hidden;}
.tab{
  padding:12px 26px;font-family:var(--font-display);font-size:12.5px;letter-spacing:.06em;
  text-transform:uppercase;color:var(--black);transition:background .3s, color .3s;
}
.tab.active{background:var(--black);color:#fff;}
.tab:not(.active):hover{background:var(--bg-alt);}

.product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;}
.product-card{
  background:#fff;border:1px solid rgba(0,0,0,.06);border-radius:var(--radius);
  padding:26px;transition:transform .4s var(--ease), box-shadow .4s var(--ease), border-color .4s;
  opacity:0;transform:translateY(24px);
}
.product-card.is-visible{opacity:1;transform:translateY(0);}
.product-card:hover{transform:translateY(-6px);box-shadow:0 24px 48px -24px rgba(0,0,0,.22);border-color:transparent;}
.product-card__visual{
  position:relative;aspect-ratio:4/3;border-radius:var(--radius);margin-bottom:20px;
  overflow:hidden;background:linear-gradient(150deg,#EDEBE6,#DEDBD3);
}
.product-card__visual img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s var(--ease);}
.product-card:hover .product-card__visual img{transform:scale(1.06);}
.product-card__num{
  position:absolute;top:10px;left:12px;font-family:var(--font-mono);font-size:11px;
  color:#fff;font-weight:600;background:rgba(11,11,12,.55);padding:3px 8px;border-radius:999px;
  backdrop-filter:blur(2px);z-index:2;
}
.product-card h3{font-size:17px;margin-bottom:10px;}

.product-card p{font-size:13.5px;margin-bottom:16px;min-height:44px;}

/* =========================================================
   About page — breadcrumb bar
   ========================================================= */
.page-breadcrumb{background:var(--black);border-bottom:2px solid var(--red);padding:14px 0;}
.page-breadcrumb__inner{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;}
.page-breadcrumb__back{
  display:flex;align-items:center;gap:8px;font-family:var(--font-display);
  font-size:12.5px;letter-spacing:.05em;text-transform:uppercase;color:#fff;
  opacity:.85;transition:opacity .3s, transform .3s var(--ease);
}
.page-breadcrumb__back svg{transition:transform .3s var(--ease);}
.page-breadcrumb__back:hover{opacity:1;}
.page-breadcrumb__back:hover svg{transform:translateX(-3px);}
.page-breadcrumb__trail{
  font-family:var(--font-mono);font-size:11.5px;letter-spacing:.04em;
  text-transform:uppercase;color:rgba(255,255,255,.45);
}
.page-breadcrumb__sep{margin:0 8px;}
.page-breadcrumb__current{color:var(--red);font-weight:600;}

/* =========================================================
   About page — content
   ========================================================= */
.about-page{padding:90px 0 110px;}
.about-page__grid{display:grid;grid-template-columns:1.55fr 1fr;gap:64px;align-items:start;}

.about-page__body h1{font-size:clamp(28px,3.2vw,38px);margin:8px 0 26px;max-width:600px;}
.about-page__body p{margin-bottom:18px;max-width:600px;font-size:15px;}
.about-page__body p strong{color:var(--black);}

.locations-card{
  background:var(--black);color:#fff;border-radius:var(--radius);
  padding:30px 30px 8px;margin-bottom:28px;
}
.locations-card h3{color:#fff;font-size:16px;margin-bottom:20px;}
.location-item{
  display:flex;gap:14px;padding-bottom:22px;margin-bottom:22px;
  border-bottom:1px solid rgba(255,255,255,.1);
}
.location-item:last-child{border-bottom:none;margin-bottom:0;padding-bottom:22px;}
.location-item__pin{flex-shrink:0;color:var(--red);margin-top:3px;}
.location-item h4{font-size:14px;color:#fff;margin-bottom:3px;}
.location-item__place{display:block;font-size:11.5px;color:rgba(255,255,255,.4);margin-bottom:8px;letter-spacing:.02em;}
.location-item p{font-size:13px;color:rgba(255,255,255,.6);line-height:1.6;margin:0;}

.about-image-card{
  margin:0;border-radius:var(--radius);overflow:hidden;
  border:1px solid rgba(0,0,0,.08);box-shadow:0 20px 40px -24px rgba(0,0,0,.25);
}
.about-image-card img{width:100%;aspect-ratio:4/3;object-fit:cover;background:var(--charcoal);}
.about-image-card figcaption{
  padding:16px 20px;font-family:var(--font-display);font-size:12.5px;
  letter-spacing:.04em;text-transform:uppercase;color:var(--black);
  background:#fff;line-height:1.5;
}

/* =========================================================
   About page — core strengths
   ========================================================= */
.strengths{padding:100px 0;background:var(--bg-alt);}
.strengths__head{text-align:center;max-width:560px;margin:0 auto 50px;}
.strengths__head h2{font-size:clamp(26px,3.2vw,36px);margin-top:6px;}
.strengths__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-bottom:44px;}
.strength-card{
  background:#fff;padding:32px 28px;border-radius:var(--radius);
  border:1px solid rgba(0,0,0,.05);transition:box-shadow .35s, transform .35s;
}
.strength-card:hover{transform:translateY(-4px);box-shadow:0 20px 40px -22px rgba(0,0,0,.2);}
.strength-card__icon{
  width:44px;height:44px;color:var(--red);margin-bottom:18px;
  display:flex;align-items:center;justify-content:center;
  background:rgba(196,18,48,.08);border-radius:var(--radius);
}
.strength-card__icon svg{width:22px;height:22px;}
.strength-card h4{font-size:15px;margin-bottom:10px;}
.strength-card p{font-size:13px;}
.strengths__cta{text-align:center;}

/* =========================================================
   Mining Equipment page — hero
   ========================================================= */
.mining-hero{
  position:relative;min-height:560px;display:flex;align-items:center;
  background:var(--black);overflow:hidden;padding:90px 0 80px;
}
.mining-hero__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;}
.mining-hero__overlay{
  position:absolute;inset:0;z-index:1;
  background:linear-gradient(90deg, rgba(11,11,12,.93) 0%, rgba(11,11,12,.8) 42%, rgba(11,11,12,.4) 72%, rgba(11,11,12,.18) 100%);
}
.mining-hero__inner{position:relative;z-index:2;max-width:640px;}
.mining-hero__inner h1{
  font-size:clamp(32px,4.6vw,54px);color:#fff;margin:18px 0 20px;
}
.mining-hero__inner h1 span{color:var(--red);display:block;}
.mining-hero__inner p{color:rgba(255,255,255,.65);font-size:15px;max-width:520px;margin-bottom:34px;}
.mining-hero__actions{display:flex;gap:16px;flex-wrap:wrap;}
.btn--dark{background:var(--charcoal-2);color:#fff;}
.btn--dark:hover{background:#000;transform:translateY(-2px);}

/* =========================================================
   Mining Equipment page — intro split
   ========================================================= */
.mining-intro{padding:110px 0;}
.mining-intro__grid{display:grid;grid-template-columns:1fr .95fr;gap:60px;align-items:center;}
.mining-intro__body h2{font-size:clamp(28px,3.2vw,38px);margin:8px 0 22px;max-width:520px;}
.mining-intro__body p{max-width:520px;margin-bottom:28px;}
.mining-intro__image img{
  width:100%;height:460px;object-fit:cover;border-radius:var(--radius);
  box-shadow:0 30px 60px -30px rgba(0,0,0,.25);background:var(--bg-alt);
}

/* =========================================================
   Mining Equipment page — 4-point strip
   ========================================================= */
.mining-points{padding:60px 0;background:var(--bg-alt);}
.mining-points__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;}
.point-card{
  background:#fff;border-top:3px solid var(--red);padding:28px 24px;
  border-radius:var(--radius);box-shadow:0 14px 30px -22px rgba(0,0,0,.15);
}
.point-card__icon{
  width:46px;height:46px;background:rgba(196,18,48,.08);color:var(--red);
  border-radius:var(--radius);display:flex;align-items:center;justify-content:center;margin-bottom:16px;
}
.point-card__icon svg{width:22px;height:22px;}
.point-card h4{font-size:14px;margin-bottom:10px;}
.point-card p{font-size:12.5px;}

/* =========================================================
   Mining Equipment page — equipment list + sticky visual
   ========================================================= */
.equipment-section{padding:100px 0 110px;}
.equipment-section h2{font-size:clamp(26px,3vw,36px);margin-bottom:40px;}
.equipment-grid{display:grid;grid-template-columns:420px 1fr;gap:40px;align-items:start;}

.equipment-visual{position:sticky;top:110px;border-radius:var(--radius);overflow:hidden;box-shadow:0 24px 50px -28px rgba(0,0,0,.3);}
.equipment-visual img{width:100%;height:660px;object-fit:cover;display:block;background:var(--charcoal);}
.equipment-visual__overlay{
  position:absolute;left:0;right:0;bottom:0;padding:26px;color:#fff;
  background:linear-gradient(180deg,transparent,rgba(0,0,0,.9) 65%);
}
.equipment-visual__badge{
  display:inline-block;padding:5px 12px;background:var(--red);color:#fff;
  font-family:var(--font-mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;
  font-weight:700;border-radius:2px;margin-bottom:12px;
}
.equipment-visual__overlay h4{font-size:16px;color:#fff;margin-bottom:8px;}
.equipment-visual__overlay p{font-size:12.5px;color:rgba(255,255,255,.6);}

.equipment-list{display:flex;flex-direction:column;gap:14px;}
.equipment-item{
  display:flex;gap:16px;padding:20px 22px;border:1px solid rgba(0,0,0,.08);
  border-radius:var(--radius);background:#fff;transition:border-color .3s, background .3s, box-shadow .3s;
}
.equipment-item:hover{box-shadow:0 16px 32px -22px rgba(0,0,0,.18);}
.equipment-item--highlight{border-color:var(--red);background:rgba(196,18,48,.03);}
.equipment-item--highlight h4{color:var(--red);}
.equipment-item__num{
  flex-shrink:0;width:34px;height:28px;background:var(--red);color:#fff;
  font-family:var(--font-mono);font-size:12px;font-weight:700;
  display:flex;align-items:center;justify-content:center;border-radius:2px;
}
.equipment-item h4{font-size:14.5px;margin-bottom:8px;}
.equipment-item p{font-size:13px;}

/* =========================================================
   Mining Equipment page — spares & components
   ========================================================= */
.spares-section{padding:100px 0;background:var(--bg-alt);}
.spares-section h2{font-size:clamp(26px,3vw,36px);margin-bottom:40px;}
.spares-grid{display:grid;grid-template-columns:1fr 460px;gap:40px;align-items:start;}

.spares-list{display:flex;flex-direction:column;gap:14px;}
.spares-item{
  display:flex;gap:16px;padding:18px 22px;border:1px solid rgba(0,0,0,.08);
  border-radius:var(--radius);background:#fff;
}
.spares-item__num{
  flex-shrink:0;width:34px;height:28px;background:var(--black);color:#fff;
  font-family:var(--font-mono);font-size:12px;font-weight:700;
  display:flex;align-items:center;justify-content:center;border-radius:2px;
}
.spares-item h4{font-size:14px;margin-bottom:6px;}
.spares-item p{font-size:12.5px;}

.spares-photos{display:grid;gap:16px;}
.spares-photo{
  aspect-ratio:1;border:1.5px solid var(--red);border-radius:0 26px 0 26px;
  overflow:hidden;padding:14px;display:flex;align-items:center;justify-content:center;
  background:#fff;transition:transform .35s var(--ease);
}
.spares-photo:hover{transform:translateY(-4px);}
.spares-photo img{max-width:100%;max-height:100%;object-fit:contain;}

/* =========================================================
   Mining Equipment page — plant & machinery checklist
   ========================================================= */
.machinery-section{padding:100px 0;}
.machinery-section h2{font-size:clamp(26px,3vw,36px);margin:8px 0 16px;}
.machinery-section__lede{max-width:640px;font-size:14.5px;}
.machinery-list{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:36px;}
.machinery-item{
  display:flex;align-items:flex-start;gap:10px;padding:16px 18px;
  border:1px solid rgba(0,0,0,.08);border-radius:var(--radius);background:#fff;
}
.machinery-item svg{color:var(--red);flex-shrink:0;margin-top:2px; width:17px;}
.machinery-item span{
  font-family:var(--font-display);font-size:12.5px;letter-spacing:.02em;
  text-transform:uppercase;font-weight:600;color:var(--black);line-height:1.5;
}

/* =========================================================
   Mining Equipment page — infrastructure
   ========================================================= */
.infrastructure-section{padding:100px 0;background:var(--bg-alt);}
.infrastructure-section h2{font-size:clamp(26px,3vw,36px);margin:8px 0 16px;}
.infrastructure-section__lede{max-width:680px;font-size:14.5px;}
.infra-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:40px;}
.infra-card{background:#fff;border-left:4px solid var(--red);padding:26px 24px;border-radius:var(--radius);}
.infra-card__head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px;flex-wrap:wrap;}
.infra-card__head h4{font-size:14.5px;}
.infra-card__tag{
  font-family:var(--font-mono);font-size:10.5px;font-weight:700;color:var(--red);
  background:rgba(196,18,48,.08);padding:3px 9px;border-radius:999px;white-space:nowrap;
}
.infra-card p{font-size:12.5px;}

.workshop-stats{
  background:#12141a;border-top:3px solid var(--red);border-radius:var(--radius);
  padding:34px 40px;margin-top:44px;
}
.workshop-stats h4{color:var(--red);font-size:14px;letter-spacing:.04em;margin-bottom:26px;}
.workshop-stats__grid{display:grid;grid-template-columns:repeat(6,1fr);gap:20px;}
.workshop-stats__item{text-align:center;}
.workshop-stats__item span{
  display:block;font-family:var(--font-mono);font-size:10px;letter-spacing:.05em;
  text-transform:uppercase;color:rgba(255,255,255,.45);margin-bottom:8px;
}
.workshop-stats__item strong{font-family:var(--font-display);font-size:18px;color:#fff;letter-spacing:.01em;}

/* =========================================================
   Certifications
   ========================================================= */
.certs{padding:110px 0;background:var(--bg-alt);}
.certs__head{max-width:620px;margin-bottom:56px;}
.certs__head h2{font-size:clamp(26px,3.2vw,38px);margin-bottom:14px;}
.certs__head p{font-size:14.5px;}
.certs__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;}
.cert-card{
  background:#fff;padding:32px 26px;text-align:center;border-radius:var(--radius);
  border:1px solid rgba(0,0,0,.05);transition:box-shadow .35s, transform .35s;
}
.cert-card:hover{transform:translateY(-4px);box-shadow:0 20px 40px -22px rgba(0,0,0,.2);}
.cert-card__icon{width:60px;height:60px;margin:0 auto 18px;}
.cert-card__icon img{width:100%;height:100%;object-fit:contain;}
.cert-card h4{font-size:15px;margin-bottom:8px;}
.cert-card p{font-size:12.5px;margin-bottom:14px;}

/* =========================================================
   Clients marquee
   ========================================================= */
.clients{padding:70px 0;background:#fff;overflow:hidden;}
.clients .eyebrow{margin-bottom:26px;}
.clients__marquee{width:100%;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);}
.clients__track{
  display:flex;gap:80px;width:max-content;
  animation:marquee 22s linear infinite;
      height: 85px;
    padding-top: 26px;
}
.clients__track span{
  display:flex;align-items:center;height:40px;flex-shrink:0;
}
.clients__track span img{
  height:100%;width:auto;object-fit:contain;

}

@keyframes marquee{from{transform:translateX(0);}to{transform:translateX(-50%);}}

/* =========================================================
   CTA
   ========================================================= */
.cta{
  position:relative;background:var(--black);padding:120px 0;text-align:center;overflow:hidden;
}
.cta::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(ellipse 60% 60% at 50% 0%, rgba(196,18,48,.28), transparent 65%);
}
.cta__inner{position:relative;z-index:2;max-width:760px;margin:0 auto;}
.cta h2{font-size:clamp(32px,5.2vw,60px);color:#fff;margin-bottom:20px;}
.cta h2 span{color:var(--red);}
.cta > .cta__inner > p{max-width:520px;margin:0 auto 40px;color:rgba(255,255,255,.55);}
.cta__actions{display:flex;justify-content:center;gap:18px;flex-wrap:wrap;margin-bottom:56px;}
.cta__meta{
  display:flex;justify-content:center;gap:60px;flex-wrap:wrap;
  border-top:1px solid rgba(255,255,255,.12);padding-top:36px;
}
.cta__meta small{display:block;font-family:var(--font-mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.4);margin-bottom:8px;}
.cta__meta strong{color:#fff;font-family:var(--font-display);font-size:15px;letter-spacing:.02em;}

/* =========================================================
   Footer
   ========================================================= */
.site-footer{background:var(--charcoal);padding:90px 0 0;}
.footer__grid{display:grid;grid-template-columns:1.4fr .9fr 1fr .9fr;gap:50px;padding-bottom:60px;border-bottom:1px solid rgba(255,255,255,.08);}
.footer__brand .brand{margin-bottom:20px;}
.footer__brand p{color:rgba(255,255,255,.45);font-size:13.5px;max-width:280px;}
.footer__col h5{color:#fff;font-size:13px;letter-spacing:.06em;margin-bottom:20px;}
.footer__col a{display:block;color:rgba(255,255,255,.55);font-size:13.5px;margin-bottom:12px;transition:color .3s;}
.footer__col a:hover{color:var(--red);}
.footer__col p{color:rgba(255,255,255,.45);font-size:13.5px;margin-bottom:10px;}
.footer__col--cta{display:flex;flex-direction:column;align-items:flex-start;}

.footer__bottom{
  display:flex;justify-content:space-between;padding:26px 0;
  font-family:var(--font-mono);font-size:11.5px;color:rgba(255,255,255,.35);
  letter-spacing:.03em;flex-wrap:wrap;gap:10px;
}

/* =========================================================
   Scroll-to-top
   ========================================================= */
.scroll-top{
  position:fixed;right:26px;bottom:26px;width:46px;height:46px;
  background:var(--red);color:#fff;border-radius:50%;display:flex;
  align-items:center;justify-content:center;font-size:18px;z-index:900;
  opacity:0;visibility:hidden;transform:translateY(12px);
  transition:opacity .35s var(--ease), transform .35s var(--ease), visibility .35s;
  box-shadow:0 14px 28px -12px rgba(196,18,48,.6);
}
.scroll-top.is-visible{opacity:1;visibility:visible;transform:translateY(0);}

/* =========================================================
   Scroll reveal (generic)
   ========================================================= */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s var(--ease), transform .8s var(--ease);}
.reveal.is-visible{opacity:1;transform:translateY(0);}

/* =========================================================
   Responsive
   ========================================================= */
@media (max-width:1080px){
  .about__inner{grid-template-columns:1fr;gap:50px;}
  .about-page__grid{grid-template-columns:1fr;gap:44px;}
  .about-page__aside{max-width:520px;}
  .strengths__grid{grid-template-columns:1fr;max-width:480px;margin-left:auto;margin-right:auto;}
  .stats__grid{grid-template-columns:repeat(3,1fr);}
  .stat:nth-child(4),.stat:nth-child(5){grid-column:span 1;}
  .certs__grid{grid-template-columns:repeat(2,1fr);}
  .footer__grid{grid-template-columns:1fr 1fr;}

  .mining-intro__grid{grid-template-columns:1fr;gap:40px;}
  .mining-intro__image{order:-1;}
  .mining-intro__image img{height:340px;}
  .mining-points__grid{grid-template-columns:repeat(2,1fr);}
  .equipment-grid{grid-template-columns:1fr;}
  .equipment-visual{position:static;}
  .equipment-visual img{height:360px;}
  .spares-grid{grid-template-columns:1fr;}
  .spares-photos{max-width:460px;}
  .machinery-list{grid-template-columns:repeat(2,1fr);}
  .infra-grid{grid-template-columns:repeat(2,1fr);}
  .workshop-stats__grid{grid-template-columns:repeat(3,1fr);row-gap:24px;}
}
@media (max-width:860px){
  .hero__inner{margin-left:0;}
  .topbar__contact a span, .topbar__contact{flex-wrap:wrap;}
  .topbar__inner{gap:10px;}
  .topbar__contact{gap:16px;}
  .topbar__contact a{font-size:11.5px;}
  .topbar__badge{font-size:10.5px;}

  .main-nav{
    position:fixed;top:0;right:0;height:100vh;width:min(320px,80vw);
    background:var(--black);flex-direction:column;align-items:flex-start;
    padding:110px 32px 40px;gap:6px;transform:translateX(100%);
    overflow-y:auto;
    transition:transform .45s var(--ease);z-index:998;
  }
  .main-nav.is-open{transform:translateX(0);box-shadow:-20px 0 60px rgba(0,0,0,.4);}
  .main-nav > a{padding:12px 0;width:100%;}
  .main-nav a, .nav-item__trigger{color:#fff;opacity:.82;}
  .main-nav a:hover, .main-nav a.active, .nav-item__trigger:hover, .nav-item__trigger[aria-expanded="true"]{color:var(--red);opacity:1;}
  .nav-item--mega{width:100%;}
  .nav-item__trigger{width:100%;justify-content:space-between;padding:12px 0;}
  .nav-toggle{display:flex;}
  .header__cta{display:none;}

  .mega-menu{
    position:static;width:100%;box-shadow:none;border-top:1px solid rgba(255,255,255,.14);
    transform:none;opacity:1;visibility:visible;max-height:0;overflow:hidden;
    transition:max-height .35s var(--ease);background:transparent;
  }
  .mega-menu.is-open{max-height:900px;}
  .mega-menu__inner{grid-template-columns:1fr;}
  .mega-menu__categories{background:transparent;padding:10px 0;}
  .mega-menu__eyebrow, .mega-menu__label{padding:0;color:rgba(255,255,255,.5);}
  .mega-cat{padding:10px 0;color:#fff;}
  .mega-cat.active{background:transparent;}
  .mega-menu__detail{padding:6px 0 18px;min-height:0;}
  .mega-menu__detail-head h4{color:#fff;}
  .mega-menu__item{color:rgba(255,255,255,.82);border-bottom-color:rgba(255,255,255,.1);}
  .mega-menu__footer span{color:rgba(255,255,255,.5);}

  .product-grid{grid-template-columns:repeat(2,1fr);}
  .stats__grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:640px){
  .container{padding:0 20px;}
  .about__badge{position:static;margin-top:20px;}
  .product-grid{grid-template-columns:1fr;}
  .certs__grid{grid-template-columns:1fr;}
  .stats__grid{grid-template-columns:1fr 1fr;}
  .footer__grid{grid-template-columns:1fr;}
  .cta__meta{gap:26px;text-align:left;}
  .products__head{flex-direction:column;align-items:flex-start;}
  .hero__dots{right:20px;bottom:20px;flex-direction:row;}
  .hero__dot.is-active{width:24px;height:8px;}
  .brand__mark{width:140px;}
  .page-breadcrumb__inner{flex-direction:column;align-items:flex-start;gap:8px;}

  .mining-hero{min-height:auto;padding:70px 0 56px;}
  .mining-hero__overlay{background:rgba(11,11,12,.88);}
  .mining-hero__actions{flex-direction:column;align-items:stretch;}
  .mining-points__grid{grid-template-columns:1fr;}
  .machinery-list{grid-template-columns:1fr;}
  .infra-grid{grid-template-columns:1fr;}
  .spares-photos{grid-template-columns:repeat(2,1fr);max-width:340px;}
  .workshop-stats{padding:26px 22px;}
  .workshop-stats__grid{grid-template-columns:repeat(2,1fr);}
  .equipment-item, .spares-item{flex-direction:column;gap:10px;}
}

/* =========================================================
   Contact page — hero intro
   ========================================================= */
.contact-hero{padding:90px 0 60px;background:var(--bg);}
.contact-hero__inner{max-width:640px;}
.contact-hero__inner h1{font-size:clamp(30px,4vw,48px);margin:8px 0 18px;}
.contact-hero__inner h1 span{color:var(--red);}
.contact-hero__inner p{font-size:15px;max-width:540px;}

/* =========================================================
   Contact page — quick contact strip
   ========================================================= */
.contact-quick{padding:0 0 40px;background:var(--bg);}
.contact-quick__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.quick-card{
  display:block;background:#fff;border:1px solid rgba(0,0,0,.06);border-radius:var(--radius);
  padding:24px 22px;transition:transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s;
}
.quick-card:not(.quick-card--static):hover{transform:translateY(-4px);box-shadow:0 20px 40px -24px rgba(0,0,0,.2);border-color:transparent;}
.quick-card--static{cursor:default;}
.quick-card__icon{
  width:42px;height:42px;background:rgba(196,18,48,.08);color:var(--red);
  border-radius:var(--radius);display:flex;align-items:center;justify-content:center;margin-bottom:16px;
}
.quick-card__icon svg{width:20px;height:20px;}
.quick-card h4{font-size:13.5px;margin-bottom:6px;}
.quick-card p{font-size:13px;color:var(--steel);margin:0;}

/* =========================================================
   Contact page — form + info section
   ========================================================= */
.contact-section{padding:20px 0 110px;background:var(--bg);}
.contact-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:44px;align-items:start;}

.contact-form-card{
  background:#fff;border:1px solid rgba(0,0,0,.06);border-radius:var(--radius);
  padding:44px 42px;box-shadow:0 24px 50px -30px rgba(0,0,0,.18);
}
.contact-form-card h2{font-size:clamp(24px,2.6vw,32px);margin-bottom:14px;}
.contact-form-card__lede{font-size:14px;margin-bottom:30px;max-width:480px;}

.form-row{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.form-field{margin-bottom:20px;}
.form-field label{
  display:block;font-family:var(--font-display);font-size:12px;letter-spacing:.04em;
  text-transform:uppercase;color:var(--black);margin-bottom:9px;font-weight:600;
}
.form-field label span{color:var(--red);}
.form-field input,
.form-field select,
.form-field textarea{
  width:100%;padding:13px 16px;font-family:var(--font-body);font-size:14px;color:var(--black);
  background:var(--bg);border:1.5px solid rgba(0,0,0,.1);border-radius:var(--radius);
  transition:border-color .3s, background .3s;
}
.form-field input::placeholder,
.form-field textarea::placeholder{color:var(--steel-light);}
.form-field input:focus,
.form-field select:focus,
.form-field textarea:focus{outline:none;border-color:var(--red);background:#fff;}
.form-field textarea{resize:vertical;min-height:120px;}
.form-field select{appearance:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%234B5563' stroke-width='2'><path d='m6 9 6 6 6-6'/></svg>");background-repeat:no-repeat;background-position:right 14px center;padding-right:40px;}

.form-field__error{display:none;margin-top:7px;font-size:12px;color:var(--red);}
.form-field.is-invalid input,
.form-field.is-invalid select,
.form-field.is-invalid textarea{border-color:var(--red);}
.form-field.is-invalid .form-field__error{display:block;}

.contact-form-card .btn{margin-top:6px;}
.form-success{
  display:flex;align-items:center;gap:10px;margin-top:18px;padding:14px 18px;
  background:rgba(196,18,48,.06);border-left:3px solid var(--red);color:var(--black);
  font-size:13.5px;border-radius:var(--radius);
}
.form-success svg{color:var(--red);flex-shrink:0;}

.contact-info{display:flex;flex-direction:column;gap:24px;}
.contact-social{background:#fff;border:1px solid rgba(0,0,0,.06);border-radius:var(--radius);padding:26px 28px;}
.contact-social h5{font-size:13px;letter-spacing:.05em;text-transform:uppercase;margin-bottom:16px;color:var(--black);font-family:var(--font-display);}
.contact-social__links{display:flex;gap:12px;}
.contact-social__links a{
  width:38px;height:38px;border-radius:50%;background:var(--bg-alt);color:var(--black);
  display:flex;align-items:center;justify-content:center;transition:background .3s,color .3s;
}
.contact-social__links a:hover{background:var(--red);color:#fff;}

/* =========================================================
   Contact page — map
   ========================================================= */
.contact-map{width:100%;height:440px;background:var(--bg-alt);}
.contact-map iframe{filter:grayscale(.15);}

/* =========================================================
   Contact page — responsive
   ========================================================= */
@media (max-width:1080px){
  .contact-quick__grid{grid-template-columns:repeat(2,1fr);}
  .contact-grid{grid-template-columns:1fr;}
  .contact-form-card{padding:34px 26px;}
}
@media (max-width:640px){
  .contact-quick__grid{grid-template-columns:1fr;}
  .form-row{grid-template-columns:1fr;}
  .contact-map{height:320px;}
}

/* =========================================================
   Certifications page — gallery grid
   ========================================================= */
.cert-gallery{padding:90px 0 120px;background:var(--bg);}
.cert-gallery__head{max-width:640px;margin-bottom:50px;}
.cert-gallery__head h1{font-size:clamp(28px,3.6vw,44px);margin:8px 0 16px;}
.cert-gallery__head p{font-size:14.5px;max-width:560px;}

.cert-gallery__grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:28px;
}
.cert-tile{
  display:flex;flex-direction:column;text-align:left;background:#fff;
  border:1px solid rgba(0,0,0,.06);border-radius:var(--radius);overflow:hidden;
  transition:transform .4s var(--ease), box-shadow .4s var(--ease), border-color .4s;
  width:100%;padding:0;
}
.cert-tile:hover{transform:translateY(-6px);box-shadow:0 24px 48px -24px rgba(0,0,0,.22);border-color:transparent;}
.cert-tile:focus-visible{outline:2px solid var(--red);outline-offset:3px;}

.cert-tile__thumb{
  display:block;aspect-ratio:4/3;overflow:hidden;position:relative;
  background:linear-gradient(150deg,#EDEBE6,#DEDBD3);
}
.cert-tile__thumb::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 55%,rgba(11,11,12,.55) 100%);
  opacity:0;transition:opacity .35s var(--ease);
}
.cert-tile:hover .cert-tile__thumb::after{opacity:1;}
.cert-tile__thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s var(--ease);}
.cert-tile:hover .cert-tile__thumb img{transform:scale(1.06);}

.cert-tile__body{display:block;padding:22px 24px 26px;}
.cert-tile__title{
  display:block;font-family:var(--font-display);font-size:16px;letter-spacing:.01em;
  text-transform:uppercase;color:var(--black);margin-bottom:8px;
}
.cert-tile__desc{display:block;font-size:13px;color:var(--steel);line-height:1.6;margin-bottom:16px;}
.cert-tile__view{
  display:inline-flex;align-items:center;gap:7px;font-family:var(--font-mono);font-size:11.5px;
  letter-spacing:.05em;text-transform:uppercase;font-weight:700;color:var(--red);
}
.cert-tile__view svg{transition:transform .3s var(--ease);}
.cert-tile:hover .cert-tile__view svg{transform:translate(2px,-2px);}

/* =========================================================
   Certificate popup modal
   ========================================================= */
.cert-modal{
  position:fixed;inset:0;z-index:2000;display:flex;align-items:center;justify-content:center;
  padding:40px 20px;opacity:0;visibility:hidden;transition:opacity .35s var(--ease), visibility .35s;
}
.cert-modal.is-open{opacity:1;visibility:visible;}
.cert-modal__overlay{position:absolute;inset:0;background:rgba(11,11,12,.86);backdrop-filter:blur(2px);}

.cert-modal__dialog{
  position:relative;z-index:2;width:100%;max-width:840px;max-height:88vh;
  background:#fff;border-radius:var(--radius);overflow:hidden;
  display:flex;flex-direction:column;
  transform:scale(.94) translateY(14px);opacity:0;
  transition:transform .4s var(--ease), opacity .4s var(--ease);
  box-shadow:0 40px 90px -20px rgba(0,0,0,.5);
}
.cert-modal.is-open .cert-modal__dialog{transform:scale(1) translateY(0);opacity:1;}

.cert-modal__close{
  position:absolute;top:16px;right:16px;z-index:4;width:38px;height:38px;border-radius:50%;
  background:rgba(11,11,12,.55);color:#fff;display:flex;align-items:center;justify-content:center;
  transition:background .3s, transform .3s;
}
.cert-modal__close:hover{background:var(--red);transform:rotate(90deg);}

.cert-modal__nav{
  position:absolute;top:50%;transform:translateY(-50%);z-index:4;width:42px;height:42px;border-radius:50%;
  background:rgba(11,11,12,.5);color:#fff;display:flex;align-items:center;justify-content:center;
  transition:background .3s, opacity .3s;
}
.cert-modal__nav:hover{background:var(--red);}
.cert-modal__nav--prev{left:16px;}
.cert-modal__nav--next{right:16px;}
.cert-modal__nav[hidden]{display:none;}

.cert-modal__image-wrap{
  flex:1 1 auto;min-height:0;background:var(--bg-alt);
  display:flex;align-items:center;justify-content:center;padding:20px;
}
.cert-modal__image-wrap img{
  max-width:100%;max-height:60vh;object-fit:contain;box-shadow:0 20px 40px -20px rgba(0,0,0,.3);background:#fff;
}

.cert-modal__info{padding:22px 30px 26px;border-top:1px solid rgba(0,0,0,.06);flex-shrink:0;}
.cert-modal__info h3{font-size:17px;margin-bottom:8px;}
.cert-modal__info p{font-size:13.5px;margin-bottom:14px;}

body.cert-modal-open{overflow:hidden;}

/* =========================================================
   Certifications page — responsive
   ========================================================= */
@media (max-width:1080px){
  .cert-gallery__grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:640px){
  .cert-gallery{padding:70px 0 90px;}
  .cert-gallery__grid{grid-template-columns:1fr;}
  .cert-modal{padding:20px 14px;}
  .cert-modal__image-wrap img{max-height:44vh;}
  .cert-modal__nav{width:36px;height:36px;}
  .cert-modal__nav--prev{left:8px;}
  .cert-modal__nav--next{right:8px;}
  .cert-modal__info{padding:18px 20px 22px;}
}


.cstmpadding{padding-top:0 !important;}


/* =========================================================
   ADDITIONAL MOBILE & TABLET OPTIMIZATIONS
   ========================================================= */

/* 1. Prevent iOS Safari Auto-Zoom on inputs */
@media screen and (max-width: 768px) {
    .form-field input, 
    .form-field select, 
    .form-field textarea,
    .login-control {
        font-size: 16px !important; /* Must be 16px to prevent zoom on iPhones */
    }
}

/* 2. Tablet Optimizations (861px to 1080px) */
@media (max-width: 1080px) {
    .hero__inner {
        margin-left: 0px; /* Reduce from 100px so it fits nicely on iPads */
    }
    .mega-menu {
        width: 500px; /* Prevent horizontal overflow on tablets */
        left: -20px;
    }
    .cert-gallery__grid {
        gap: 16px; /* Tighter gap so certificates don't squeeze */
    }
}

/* 3. Mobile Menu & Header adjustments (< 860px) */
@media (max-width: 860px) {
    .brand__mark {
        max-width: 160px; /* Ensure logo doesn't overlap the hamburger menu */
    }
    .page-breadcrumb__trail {
        line-height: 1.6; /* Better text wrapping for long product names */
    }
    .topbar__inner {
        justify-content: center; /* Center topbar items on mobile */
        text-align: center;
    }
    .topbar__contact {
        justify-content: center;
    }
}

/* 4. Small Mobile Optimizations (< 640px) */
@media (max-width: 640px) {
    .brand__mark {
        max-width: 140px;
    }
    .hero__title {
        font-size: clamp(32px, 10vw, 42px); /* Smoother scaling for very small screens */
    }
    .stat strong {
        font-size: 26px; /* Fits the 2-column stat grid better */
    }
    .footer__bottom {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
    
    /* Make call-to-action buttons full-width for easier thumb-tapping */
    .cta__actions {
        flex-direction: column;
        width: 100%;
    }
    .cta__actions .btn {
        width: 100%; 
        justify-content: center;
    }
    
    /* Give form fields more breathing room on small screens */
    .contact-form-card {
        padding: 24px 20px; 
    }
    
    /* Allow the popup modal to use more screen real estate */
    .cert-modal__dialog {
        max-height: 95vh;
    }
}