/* =========================================================
   Press & Media — Blue Energy Motors
   Page-specific stylesheet (content only — no header/footer
   rules of your own site; this page's mock header/footer CSS
   selectors — .site-header, .site-footer, etc. — were removed
   since the CI view no longer renders that markup itself)

   Suggested location:  assets/css/press-media.css
   Include it from your header/template file, e.g.:
     <link rel="stylesheet" href="<?php echo base_url('assets/css/press-media.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');

  :root{
    --navy:#272660;
    --navy-dark:#1a1948;
    --footer:#090917;
    --bg:#fbfbff;
    --surface:#ffffff;
    --line:#e4e4ee;
    --ink:#0f0f0f;
    --muted:#5c5c6b;
  }
  *{box-sizing:border-box;}
  body{margin:0;background:var(--bg);color:var(--ink);}
  .ir-page{
    font-family:'Barlow', sans-serif;
    background:var(--bg);
    color:var(--ink);
    line-height:1.5;
    -webkit-font-smoothing:antialiased;
  }
  .ir-page img{max-width:100%;display:block;}
  .wrap{max-width:1180px;margin:0 auto;padding:0 32px;}
  @media (max-width:640px){ .wrap{padding:0 20px;} }

  /* ---------- scroll-reveal animation (mirrors the AOS fade used on blueenergymotors.com) ---------- */
  [data-reveal]{
    opacity:0; transform:translateY(28px);
    transition:opacity .6s ease, transform .6s ease;
    will-change:opacity, transform;
  }
  [data-reveal].is-visible{opacity:1; transform:none;}
  @media (prefers-reduced-motion: reduce){
    [data-reveal]{opacity:1; transform:none; transition:none;}
  }
  .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 .badge-ring-alt{
    position:absolute; left:-70px; bottom:-140px;
    width:260px; height:260px; border-radius:50%;
    border:1px solid rgba(255,255,255,.10);
  }
  .ir-hero .badge-ring-alt::after{
    content:""; position:absolute; inset:24px; border-radius:50%;
    border:1px solid rgba(255,255,255,.08);
  }
  .ir-hero-inner{position:relative; z-index:1;}
  .ir-hero .eyebrow{
    display:inline-flex; align-items:center; gap:10px;
    font-size:13px; font-weight:600; letter-spacing:3px; text-transform:uppercase;
    color:rgba(255,255,255,.6); margin:0 0 18px;
  }
  .ir-hero .eyebrow::before{content:""; width:26px; height:2px; background:#fff; display:inline-block;}
  .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;
  }

  /* ---------- sub nav ---------- */
  .ir-subnav{
    position:sticky; top:80px; z-index:30;
    background:var(--navy-dark);
  }
  .ir-subnav .wrap{
    display:flex; gap:10px; overflow-x:auto;
    padding-top:14px; padding-bottom:14px;
    scrollbar-width:none;
  }
  .ir-subnav .wrap::-webkit-scrollbar{display:none;}
  .ir-subnav a{
    flex:none;
    display:block; padding:10px 20px; font-size:14px; font-weight:500;
    text-transform:uppercase; letter-spacing:.5px; color:rgba(255,255,255,.72);
    text-decoration:none; white-space:nowrap; border-radius:999px;
    background:rgba(255,255,255,.06);
    transition:color .2s ease, background .2s ease;
  }
  .ir-subnav a:hover{color:#fff; background:rgba(255,255,255,.16);}

  /* ---------- sections ---------- */
  .ir-section{padding:80px 0; position:relative; scroll-margin-top:140px;}
  .ir-section .wrap{position:relative; z-index:1;}
  .ir-section.alt{
    background:#f2f2f8;
    background-image:repeating-linear-gradient(115deg, rgba(39,38,96,.035) 0 1px, transparent 1px 42px);
  }
  .ir-section.alt::before{
    content:""; position:absolute; top:-1px; left:0; right:0; height:56px;
    background:#f2f2f8; transform-origin:top left; transform:skewY(-1.2deg);
  }
  .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);
  }
  .section-head{max-width:640px; margin:0 auto 44px; text-align:center;}
  .ir-section h2{
    text-transform:uppercase;
    font-size:clamp(30px,4vw,42px); font-weight:200; margin:0 0 18px; color:var(--ink);
  }
  .ir-section h2::after{
    content:""; display:block; width:54px; height:3px; background:var(--navy);
    margin:18px auto 0;
  }
  .ir-section .lede{color:var(--muted); font-size:18px; margin:0 auto; font-weight:400;}
  .ir-page h3.sub-heading{
    font-size:15px; font-weight:600; letter-spacing:1.5px; text-transform:uppercase;
    color:var(--navy); margin:0 0 20px;
  }
  .sub-block + .sub-block{margin-top:48px;}
  .releases-row{display:grid; grid-template-columns:repeat(2,1fr); gap:26px;}
  .releases-row .sub-block{margin-top:0;}
  .releases-row + .sub-block{margin-top:48px;}
  @media (max-width:900px){ .releases-row{grid-template-columns:1fr; gap:0;} .releases-row .sub-block + .sub-block{margin-top:48px;} }

  /* ---------- press cards ---------- */
  .press-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:26px;}
  .press-grid.cols-2{grid-template-columns:repeat(2,1fr);}
  .press-grid.cols-1{grid-template-columns:1fr; max-width:640px;}
  @media (max-width:900px){ .press-grid{grid-template-columns:repeat(2,1fr);} }
  @media (max-width:600px){ .press-grid, .press-grid.cols-2{grid-template-columns:1fr;} }
  .press-card{
    background:var(--surface); border:1px solid var(--line); border-radius:12px;
    display:flex; flex-direction:column; overflow:hidden;
    transition:transform .3s ease, box-shadow .3s ease;
  }
  .press-card:hover{transform:translateY(-6px); box-shadow:0 20px 40px rgba(9,9,23,.12);}
  .press-thumb{aspect-ratio:16/9; overflow:hidden; display:block; position:relative; background:var(--navy-dark);}
  .press-thumb svg{width:100%; height:100%; display:block;}
  .press-thumb img{
    width:100%; height:100%; object-fit:cover; display:block;
    transition:transform .5s ease;
  }
  .press-card:hover .press-thumb img{transform:scale(1.07);}
  .press-thumb.has-photo::after{
    content:""; position:absolute; inset:0;
    background:linear-gradient(180deg, rgba(9,9,23,0) 55%, rgba(9,9,23,.42) 100%);
    pointer-events:none;
  }
  .press-body{padding:22px 24px 24px; display:flex; flex-direction:column; gap:10px; flex:1; position:relative;}
  .press-pub{
    font-size:12.5px; font-weight:600; letter-spacing:1px; text-transform:uppercase;
    color:var(--navy); margin:0; padding-left:14px; position:relative;
  }
  .press-pub::before{
    content:""; position:absolute; left:0; top:3px; width:6px; height:6px; border-radius:50%;
    background:var(--navy);
  }
  .press-title{font-size:16.5px; font-weight:600; line-height:1.4; margin:0;}
  .press-title a{color:var(--ink); text-decoration:none;}
  .press-title a:hover{color:var(--navy); text-decoration:underline;}
  .press-link{
    margin-top:auto; padding-top:6px;
    display:inline-flex; align-items:center; gap:6px;
    font-size:13px; font-weight:600; letter-spacing:.5px; text-transform:uppercase;
    color:var(--navy); text-decoration:none;
  }
  .press-link:hover{text-decoration:underline;}