/* =========================================================
   Sitemap — Blue Energy Motors
   Page-specific stylesheet (content only — no header/footer
   rules; your existing site header/footer keep their own CSS)

   Suggested location:  assets/css/sitemap.css
   Include it from your header/template file, e.g.:
     <link rel="stylesheet" href="<?php echo base_url('assets/css/sitemap.css'); ?>">

   Loads the Barlow font used across blueenergymotors.com.
   If you already load Barlow globally in your main layout,
   you can delete the @import line below to avoid loading it twice.
   ========================================================= */

@import url('https://fonts.googleapis.com/css2?family=Barlow:ital,wght@0,200;0,400;0,500;0,600;0,700&display=swap');

.ir-page{
  --navy:#272660;
  --navy-dark:#1a1948;
  --footer:#090917;
  --bg:#fbfbff;
  --surface:#ffffff;
  --line:#e4e4ee;
  --ink:#0f0f0f;
  --muted:#5c5c6b;

  font-family:'Barlow', sans-serif;
  background:var(--bg);
  color:var(--ink);
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
.ir-page *{box-sizing:border-box;}
.ir-page img{max-width:100%;display:block;}
.ir-page .wrap{max-width:1180px;margin:0 auto;padding:0 32px;}
@media (max-width:640px){ .ir-page .wrap{padding:0 20px;} }

/* ---------- scroll-reveal animation ---------- */
.ir-page [data-reveal]{
  opacity:0; transform:translateY(28px);
  transition:opacity .6s ease, transform .6s ease;
  will-change:opacity, transform;
}
.ir-page [data-reveal].is-visible{opacity:1; transform:none;}
@media (prefers-reduced-motion: reduce){
  .ir-page [data-reveal]{opacity:1; transform:none; transition:none;}
}
.ir-page .stagger > *{transition-delay:calc(var(--i,0) * 90ms);}

/* ---------- hero ---------- */
.ir-hero{
  position:relative; overflow:hidden;
  background:linear-gradient(120deg,#090917 0%, #171545 45%, var(--navy) 100%);
  padding:96px 0 84px;
  color:#fff;
}
.ir-hero .badge-ring{
  position:absolute; right:-90px; top:50%; transform:translateY(-50%);
  width:420px; height:420px; border-radius:50%;
  border:1px solid rgba(255,255,255,.14);
}
.ir-hero .badge-ring::after{
  content:""; position:absolute; inset:38px; border-radius:50%;
  border:1px solid rgba(255,255,255,.10);
}
.ir-hero-inner{position:relative; z-index:1;}
.ir-hero h1{
  font-weight:700; text-transform:uppercase;
  font-size:clamp(36px,6vw,60px); line-height:1.05; margin:0 0 22px;
  max-width:760px;
}
.ir-hero p{
  font-size:18px; color:rgba(255,255,255,.75); max-width:620px; margin:0;
  font-weight:400;
}

/* ---------- sections ---------- */
.ir-section{padding:80px 0; position:relative;}
.ir-section .wrap{position:relative; z-index:1;}
.section-decor{position:absolute; inset:0; overflow:hidden; pointer-events:none; z-index:0;}
.section-decor .ring{position:absolute; border:1px solid rgba(39,38,96,.12); border-radius:50%;}
.section-decor .ring::after{
  content:""; position:absolute; inset:26px; border-radius:50%; border:1px solid rgba(39,38,96,.10);
}
.ir-page h3.sub-heading{
  font-size:15px; font-weight:600; letter-spacing:1.5px; text-transform:uppercase;
  color:var(--navy); margin:0 0 24px;
}

/* ---------- sitemap groups ---------- */
.ir-page .sitemap-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:28px;}
@media (max-width:900px){ .ir-page .sitemap-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:640px){ .ir-page .sitemap-grid{grid-template-columns:1fr;} }
.ir-page .sitemap-group{
  background:var(--surface); border:1px solid var(--line); padding:34px 30px;
}
.ir-page .sitemap-group ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:20px;}
.ir-page .sitemap-group li + li{padding-top:20px; border-top:1px solid var(--line);}
.ir-page .sitemap-link{display:flex; align-items:flex-start; justify-content:space-between; gap:14px; text-decoration:none; color:var(--ink);}
.ir-page .sitemap-link .label{font-size:16.5px; font-weight:600; margin:0 0 5px; transition:color .2s ease;}
.ir-page .sitemap-link .desc{font-size:13.5px; color:var(--muted); font-weight:400; line-height:1.5; margin:0;}
.ir-page .sitemap-link .chev{flex:none; margin-top:4px; color:var(--navy); transition:transform .2s ease;}
.ir-page .sitemap-link:hover .label{color:var(--navy); text-decoration:underline;}
.ir-page .sitemap-link:hover .chev{transform:translateX(4px);}

.ir-page .sitemap-resources{margin-top:56px; padding-top:44px; border-top:1px solid var(--line);}
.ir-page .resource-link{
  display:inline-flex; align-items:center; gap:10px; text-decoration:none;
  color:var(--navy); font-weight:600; font-size:15px;
  border:1px solid var(--navy); padding:13px 24px;
  transition:background .2s ease, color .2s ease;
}
.ir-page .resource-link:hover{background:var(--navy); color:#fff;}