/* ============================================================================
   ALTEC | Equipments Exporters — style2.css
   Modern design layer. Loads AFTER bootstrap5 + style1.css and overrides them.
   - Restyles existing class names so NO html/php changes are required.
   - Includes Bootstrap 3 -> 5 compatibility aliases (col-xs-*, img-responsive).
   - Design tokens via CSS variables; em/rem sizing; soft shadows; hover motion.
   ============================================================================ */

:root{
  /* Palette: coral + navy + cream */
  --alt-navy:#0a2342;       /* primary dark (deep navy) */
  --alt-navy-d:#061731;     /* darker navy */
  --alt-navy-m:#13325c;     /* mid navy */
  --alt-sage:#4a6a9a;       /* tonal mid (cool steel) */
  --alt-amber:#f97316;      /* accent (coral) */
  --alt-amber-soft:#fb923c; /* soft coral */
  --alt-ink:#0e1a2b;        /* body text */
  --alt-mut:#52617a;        /* muted text */
  --alt-line:#e4e0de;       /* hairline (warm cream-tinted) */
  --alt-bg:#ffffff;
  --alt-bg2:#f7f4f2;        /* very light cream */
  --alt-bg3:#efe9e7;        /* cream */
  --alt-radius:12px;
  --alt-radius-sm:9px;
  --alt-radius-lg:16px;
  --alt-shadow-sm:0 1px 2px rgba(10,35,66,.06), 0 2px 10px rgba(10,35,66,.05);
  --alt-shadow-md:0 6px 22px rgba(10,35,66,.10);
  --alt-shadow-lg:0 24px 60px rgba(10,35,66,.16);
  --alt-ease:.28s cubic-bezier(.3,.8,.3,1);
  --alt-ff-display:"Manrope",system-ui,-apple-system,sans-serif;
  --alt-ff-body:"Manrope",system-ui,-apple-system,sans-serif;
}

/* ============================================================
   BS3 -> BS5 COMPATIBILITY ALIASES
   (so existing markup keeps working without edits)
   ============================================================ */
.img-responsive{max-width:100%;height:auto;display:block;}
/* col-xs-* was removed in BS5; only force 50% on SMALL screens so that
   col-md-3 / col-sm-6 still control desktop & tablet widths. */
@media (max-width:575.98px){
  .col-xs-6{flex:0 0 auto;width:50%;}
}

/* ============================================================
   HEADER / NAV  (standalone — style1.css no longer loaded)
   Header is an overlay on the banner; flexbox instead of floats.
   ============================================================ */
.top_head{position:absolute;left:0;top:0;width:100%;z-index:99;}
.mainhead{
  width:100%;background:rgba(10,35,66,.55);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  transition:background .3s ease;
}
.mainhead.fixed{position:fixed;top:0;left:0;right:0;z-index:1000;background:rgba(10,35,66,.95);box-shadow:0 6px 22px rgba(0,0,0,.18);}
.mainhead .header{
  display:flex;align-items:center;justify-content:space-between;
  gap:1rem;padding:.5rem 0;position:relative;
}
.logo{display:inline-block;}
.logo img{width:150px;height:auto;display:block;}
.mainhead.fixed .logo img{width:130px;}

/* nav */
.topnav>ul{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:.2rem;}
.topnav>ul>li{position:relative;}
.topnav>ul>li>a{
  display:block;color:#fff;font-family:var(--alt-ff-body);font-weight:600;
  font-size:.86rem;letter-spacing:.02em;text-transform:uppercase;
  padding:.7rem .85rem;transition:color .25s ease;
}
.topnav>ul>li>a:hover{color:var(--alt-amber-soft);}

/* search button + dropdown */
.topnav li.searchlink{position:relative;}
.topnav li.searchlink>a.sbtn{padding:.5rem .6rem;}
.topnav li.searchlink>a.sbtn img{width:18px;height:18px;display:block;filter:brightness(0) invert(1);}
.h_search{
  position:absolute;right:0;top:100%;width:280px;background:#fff;
  padding:.8rem;border-radius:var(--alt-radius-sm);box-shadow:var(--alt-shadow-md);
  opacity:0;visibility:hidden;transform:translateY(8px);transition:all .25s ease;z-index:50;
}
.topnav li.searchlink:hover .h_search{opacity:1;visibility:visible;transform:none;}
.h_search form{display:flex;gap:.4rem;}
.h_search form input[type="text"]{flex:1;border:1px solid var(--alt-line);border-radius:7px;padding:.5rem .7rem;font-size:.85rem;}
.h_search form input[type="submit"]{border:none;background:var(--alt-navy);color:#fff;border-radius:7px;padding:.5rem .9rem;font-weight:600;cursor:pointer;}
.h_search form input[type="submit"]:hover{background:var(--alt-amber);color:#ffffff;}

/* mobile hamburger (.navicon) — hidden on desktop */
.navicon{display:none;width:42px;height:42px;border-radius:9px;background:rgba(255,255,255,.12);cursor:pointer;position:relative;}
.navicon span,.navicon span::before,.navicon span::after{
  content:"";position:absolute;left:50%;width:20px;height:2px;border-radius:2px;
  background:#fff;transition:transform .25s ease,opacity .2s ease;
}
.navicon span{top:50%;transform:translate(-50%,-50%);}
.navicon span::before{top:-7px;left:0;transform:none;}
.navicon span::after{top:7px;left:0;transform:none;}
.navicon.active span{background:transparent;}
.navicon.active span::before{top:0;transform:rotate(45deg);}
.navicon.active span::after{top:0;transform:rotate(-45deg);}

@media (max-width:991px){
  .navicon{display:block;}
  .topnav{
    position:fixed !important;top:0 !important;right:-300px;left:auto !important;
    width:280px;max-width:85vw;height:100vh;
    background:linear-gradient(180deg,var(--alt-navy-d),var(--alt-navy));
    padding:5rem 1rem 2rem;transition:right .3s ease;z-index:2000 !important;
    overflow-y:auto;display:block !important;
  }
  .topnav.showmenu{right:0;box-shadow:-10px 0 40px rgba(0,0,0,.45);}
  .topnav>ul{flex-direction:column;align-items:stretch;gap:0;width:100%;display:flex !important;}
  .topnav>ul>li{position:relative;width:100%;}
  .topnav>ul>li>a{display:block;width:100%;padding:.85rem .5rem;border-bottom:1px solid rgba(255,255,255,.08);}
  .topnav li.searchlink{position:relative;}
  .h_search{position:static;width:100%;opacity:1;visibility:visible;transform:none;box-shadow:none;margin-top:.6rem;padding:0;background:transparent;}
  .h_search form{display:flex;gap:.4rem;}
  .h_search form input[type="text"]{background:#fff;}
  /* raise hamburger above the off-canvas panel so it can still be tapped */
  .navicon{position:relative;z-index:2001;}
}

/* ============================================================
   BASE / TYPOGRAPHY
   ============================================================ */
body{
  font-family:var(--alt-ff-body);
  color:var(--alt-ink);
  line-height:1.7;
  background:var(--alt-bg);
  -webkit-font-smoothing:antialiased;
  margin:0;padding:0;
}
html,body{min-height:0;scroll-behavior:smooth;}
footer ~ *{margin:0;padding:0;} /* fab and scripts at end of body don't add layout */
h1,h2,h3,h4{font-family:var(--alt-ff-display);font-weight:800;letter-spacing:-.02em;line-height:1.18;}
a{transition:color var(--alt-ease);}
img{max-width:100%;}

.sec-title{
  font-family:var(--alt-ff-display);
  font-weight:600;
  color:var(--alt-navy-d);
  letter-spacing:-.02em;
}
.sec-title span{color:var(--alt-amber);font-weight:600;}

/* section heading wrapper (was in style1) */
.headingsec{margin-bottom:1.5rem;}
.headingsec h2,.headingsec .sec-title{font-size:clamp(1.6rem,3vw,2.2rem);margin:0 0 .5rem;}
.headingsec.text-center{text-align:center;}

/* owl-carousel prev/next on the home banner */
.homebanner .owl-nav button{
  position:absolute;top:50%;transform:translateY(-50%);
  width:46px;height:46px;border-radius:50%!important;
  background:rgba(255,255,255,.18)!important;color:#fff!important;
  font-size:1.4rem!important;border:1px solid rgba(255,255,255,.3)!important;
  transition:background .25s ease;
}
.homebanner .owl-nav button:hover{background:var(--alt-amber)!important;color:#ffffff!important;}
.homebanner .owl-nav button.owl-prev{left:18px;}
.homebanner .owl-nav button.owl-next{right:18px;}

/* products section heading band */
.categorysec{padding:3.5rem 0;background:var(--alt-bg2);}
.categorysec .headingsec h2{color:var(--alt-navy-d);}

/* a reusable eyebrow you can add via the new SEO sections */
.alt-eyebrow{
  display:inline-flex;align-items:center;gap:.55em;
  font-family:var(--alt-ff-body);font-size:.78rem;font-weight:600;
  letter-spacing:.18em;text-transform:uppercase;color:var(--alt-navy);
  margin-bottom:.9rem;
}
.alt-eyebrow::before{content:"";width:1.8em;height:2px;background:var(--alt-amber);border-radius:2px;}

/* ============================================================
   HOME BANNER / SLIDER  (.homebanner .bannersec .slidebox)
   ============================================================ */
.homebanner{position:relative;}
.homebanner .bannersec{position:relative;}
.homebanner .bannersec img{width:100%;height:auto;object-fit:cover;}
.homebanner .slidebox{
  position:absolute;inset:0;display:flex;align-items:center;
  background:linear-gradient(90deg,rgba(6,23,49,.78) 0%,rgba(6,23,49,.4) 55%,rgba(6,23,49,0) 100%);
}
.homebanner .bcontent{max-width:1180px;margin:0 auto;padding:0 1.5rem;width:100%;}
.homebanner .slide_title{
  font-family:var(--alt-ff-display);
  font-size:clamp(1.6rem,4vw,3rem);
  font-weight:600;color:#fff;line-height:1.1;max-width:18ch;
  text-shadow:0 2px 18px rgba(0,0,0,.3);margin-bottom:.6rem;
}
.homebanner .slide_title span{color:var(--alt-amber-soft);}
.homebanner .bcontent p{
  color:rgba(255,255,255,.9);font-size:1.05rem;max-width:46ch;
  margin-bottom:1.4rem;font-weight:300;text-shadow:0 1px 10px rgba(0,0,0,.4);
}
.bbtn{
  display:inline-block;background:linear-gradient(180deg,var(--alt-amber-soft),var(--alt-amber));
  color:#ffffff;font-weight:600;padding:.8rem 1.7rem;border-radius:var(--alt-radius-sm);
  box-shadow:0 8px 24px rgba(249,115,22,.34);transition:all var(--alt-ease);
}
.bbtn:hover{transform:translateY(-2px);box-shadow:0 14px 34px rgba(249,115,22,.44);color:#ffffff;}

/* ============================================================
   SERVICES STRIP  (.firsthome .cbox) — overlaps banner bottom
   ============================================================ */
.firsthome{padding:0 0 3.5rem;background:transparent;position:relative;z-index:9;}
.firsthome ul{display:grid;grid-template-columns:repeat(4,1fr);gap:1.25rem;list-style:none;margin:0;padding:0;transform:translateY(-60px);margin-bottom:-60px;}
.firsthome .cbox{
  border:1px solid rgba(255,255,255,.12);border-radius:var(--alt-radius);
  padding:2.2rem 1.5rem;text-align:center;height:100%;color:#fff;
  box-shadow:var(--alt-shadow-md);transition:transform var(--alt-ease),box-shadow var(--alt-ease),background var(--alt-ease);
  position:relative;overflow:hidden;
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
}
.firsthome .cbox:hover{transform:translateY(-6px);box-shadow:var(--alt-shadow-lg);}
/* calm, theme-matching translucent shades (navy family + one amber) — image shows through */
.firsthome ul li:nth-child(1) .cbox{background:rgba(6,23,49,.82);}    /* deep navy */
.firsthome ul li:nth-child(2) .cbox{background:rgba(10,35,66,.82);}   /* navy */
.firsthome ul li:nth-child(3) .cbox{background:rgba(74,106,154,.85);} /* steel */
.firsthome ul li:nth-child(4) .cbox{background:rgba(249,115,22,.88);} /* coral */
.firsthome ul li:nth-child(1) .cbox:hover{background:rgba(6,23,49,.94);}
.firsthome ul li:nth-child(2) .cbox:hover{background:rgba(10,35,66,.94);}
.firsthome ul li:nth-child(3) .cbox:hover{background:rgba(74,106,154,.95);}
.firsthome ul li:nth-child(4) .cbox:hover{background:rgba(249,115,22,.97);}

/* large faint watermark icon in the background (like the reference tiles) */
.firsthome .cbox::before{
  font-family:"FontAwesome";position:absolute;right:-12px;bottom:-22px;
  font-size:8rem;line-height:1;color:rgba(255,255,255,.10);pointer-events:none;
  transition:transform var(--alt-ease);
}
.firsthome .cbox:hover::before{transform:scale(1.08) rotate(-6deg);}
.firsthome ul li:nth-child(1) .cbox::before{content:"\f19d";} /* graduation cap */
.firsthome ul li:nth-child(2) .cbox::before{content:"\f0ad";} /* wrench */
.firsthome ul li:nth-child(3) .cbox::before{content:"\f1cd";} /* life-ring */
.firsthome ul li:nth-child(4) .cbox::before{content:"\f0b1";} /* briefcase */

/* service icon tiles — Font Awesome glyphs injected via CSS (no image files) */
.firsthome .cbox i[class^="icon"]{
  position:relative;z-index:1;
  display:inline-flex;align-items:center;justify-content:center;
  width:70px;height:70px;border-radius:16px;margin:0 auto 1rem;
  background:rgba(255,255,255,.16);
  color:#fff;font-size:1.7rem;line-height:1;
  transition:transform var(--alt-ease),background var(--alt-ease);
}
.firsthome .cbox i[class^="icon"]::before{
  font-family:"FontAwesome";font-style:normal;font-weight:normal;-webkit-font-smoothing:antialiased;
}
.firsthome .cbox:hover i[class^="icon"]{
  transform:translateY(-3px) scale(1.05);
  background:rgba(255,255,255,.26);
}
/* one glyph per service (FA4 unicode) */
.firsthome .cbox .icon1::before{content:"\f19d";} /* graduation-cap — Technical Training */
.firsthome .cbox .icon2::before{content:"\f0ad";} /* wrench — Implementation & Installation */
.firsthome .cbox .icon3::before{content:"\f1cd";} /* life-ring — Support & Assistance */
.firsthome .cbox .icon4::before{content:"\f0b1";} /* briefcase — Turn-Key Services */
.firsthome .heading2{position:relative;z-index:1;font-family:var(--alt-ff-display);font-weight:700;font-size:1.12rem;color:#fff;margin-bottom:.5rem;}

/* descriptive line under each title (injected via CSS, no HTML change) */
.firsthome .cbox .heading2::after{
  display:block;margin:.5rem auto 0;max-width:18ch;
  font-family:var(--alt-ff-body);font-weight:400;font-size:.82rem;line-height:1.5;
  color:rgba(255,255,255,.82);letter-spacing:0;text-transform:none;
}
.firsthome ul li:nth-child(1) .heading2::after{content:"Hands-on operator and technician training for your team.";}
.firsthome ul li:nth-child(2) .heading2::after{content:"Complete setup, commissioning and on-site installation.";}
.firsthome ul li:nth-child(3) .heading2::after{content:"Dedicated after-sales support and maintenance assistance.";}
.firsthome ul li:nth-child(4) .heading2::after{content:"End-to-end turn-key laboratory project delivery.";}

.morbtn{
  position:relative;z-index:1;margin-top:1.1rem;
  display:inline-block;font-size:.82rem;font-weight:600;letter-spacing:.04em;
  color:#fff;border:1.5px solid rgba(255,255,255,.5);border-radius:100px;
  padding:.42rem 1.3rem;transition:all var(--alt-ease);
}
.morbtn:hover{background:#fff;color:var(--alt-navy-d);border-color:#fff;}

/* ============================================================
   WELCOME  (.welcomesec)
   ============================================================ */
.welcomesec{padding:4rem 0 1rem;text-align:center;}
.welcomesec .headingsec{max-width:820px;margin:0 auto;}
.welcomesec .sec-title{font-size:clamp(1.8rem,3.5vw,2.6rem);margin-bottom:1rem;}
.welcomesec p{color:var(--alt-mut);font-size:1.08rem;font-weight:300;margin-bottom:1.5rem;}
.readbtn{
  display:inline-block;background:var(--alt-navy);color:#fff;font-weight:600;
  padding:.75rem 1.7rem;border-radius:var(--alt-radius-sm);transition:all var(--alt-ease);
  text-decoration:none !important;
}
.readbtn:hover{background:var(--alt-amber);color:#ffffff;transform:translateY(-2px);text-decoration:none !important;}

/* ============================================================
   CATEGORY BLOCKS  (.homecategory .hcategory)
   ============================================================ */
.homecategory{padding:3rem 0;}
.homecategory ul{list-style:none;margin:0;padding:0;}
.homecategory .hcategory{
  display:grid;grid-template-columns:minmax(260px,420px) 1fr;gap:2rem;align-items:center;
  background:var(--alt-bg);border:1px solid var(--alt-line);border-radius:var(--alt-radius-lg);
  padding:1.6rem;margin-bottom:1.6rem;box-shadow:var(--alt-shadow-sm);
  transition:box-shadow var(--alt-ease),transform var(--alt-ease);
}
.homecategory .hcategory:hover{box-shadow:var(--alt-shadow-md);transform:translateY(-3px);}
/* zigzag: even rows put the image on the RIGHT */
.homecategory ul li:nth-child(even) .hcategory{grid-template-columns:1fr minmax(260px,420px);}
.homecategory ul li:nth-child(even) .categoryimg{order:2;}
.homecategory ul li:nth-child(even) .categorycontent{order:1;}
.homecategory .categoryimg{position:relative;border-radius:var(--alt-radius);overflow:hidden;}
.homecategory .categoryimg img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease;}
.homecategory .hcategory:hover .categoryimg img{transform:scale(1.05);}
.homecategory .categoryimg span{
  position:absolute;top:12px;left:12px;z-index:2;
  font-family:var(--alt-ff-display);font-weight:600;font-size:1.1rem;color:#fff;
  width:42px;height:42px;border-radius:10px;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(150deg,var(--alt-amber-soft),var(--alt-amber));color:#ffffff;
}
.homecategory .categorycontent h2{font-family:var(--alt-ff-display);font-size:1.5rem;font-weight:600;margin-bottom:.7rem;}
.homecategory .categorycontent h2 a{color:var(--alt-navy-d);}
.homecategory .categorycontent h2 a:hover{color:var(--alt-amber);}
.homecategory .categorycontent p{color:var(--alt-mut);font-size:.97rem;font-weight:300;margin-bottom:.7rem;}
@media (max-width:768px){
  .homecategory .hcategory{grid-template-columns:1fr;}
}

/* ============================================================
   ABOUT  (.homeabout)  — proper 2-column, fills the width
   ============================================================ */
.homeabout{padding:4rem 0;background:linear-gradient(180deg,var(--alt-bg2),var(--alt-bg3));}
.homeabout .abougbg{
  display:grid;grid-template-columns:1fr 1fr;gap:2.5rem;align-items:center;
  background:var(--alt-bg);border:1px solid var(--alt-line);border-radius:var(--alt-radius-lg);
  padding:2.5rem;box-shadow:var(--alt-shadow-md);
}
.homeabout .abougbg > .col-sm-6{width:auto;padding:0;flex:none;}
.homeabout .aboutimg1{position:relative;}
.homeabout .aboutimg1 img{border-radius:var(--alt-radius);width:100%;height:100%;object-fit:cover;box-shadow:var(--alt-shadow-md);}
.homeabout .aboutimg1::after{content:"";position:absolute;right:-14px;bottom:-14px;width:90px;height:90px;border-radius:14px;background:linear-gradient(150deg,var(--alt-amber-soft),var(--alt-amber));z-index:-1;}
.homeabout h3{font-family:var(--alt-ff-display);font-size:2.1rem;font-weight:800;color:var(--alt-navy-d);margin-bottom:1.1rem;letter-spacing:-.02em;}
.homeabout h3 small{display:block;font-size:.78rem;letter-spacing:.2em;text-transform:uppercase;color:var(--alt-amber);font-family:var(--alt-ff-body);font-weight:700;margin-bottom:.6rem;}
.homeabout p{color:var(--alt-mut);font-weight:400;line-height:1.8;margin-bottom:1.3rem;}
@media (max-width:768px){
  .homeabout .abougbg{grid-template-columns:1fr;gap:1.8rem;padding:1.6rem;}
}

/* ============================================================
   STATS  (.fac_section .lab_element)
   ============================================================ */
.fac_section{
  padding:4rem 0;color:#fff;position:relative;overflow:hidden;
  background:
    radial-gradient(80% 80% at 85% 15%,rgba(249,115,22,.14) 0%,transparent 50%),
    linear-gradient(160deg,var(--alt-navy-d),var(--alt-navy));
}
.fac_section .sec-title{color:#fff;}
.fac_section .sec-title span{color:var(--alt-amber);}
.fac_section .headingsec{margin-bottom:2rem;}
.fac_section .lab_element{
  text-align:center;padding:1.5rem 1rem;border:1px solid rgba(255,255,255,.12);
  border-radius:var(--alt-radius);background:rgba(255,255,255,.04);
  transition:background var(--alt-ease);height:100%;
}
.fac_section .lab_element:hover{background:rgba(255,255,255,.08);}
.fac_section .lab_element h4{order:2;}
.fac_section .lab_element h4 span{font-family:var(--alt-ff-body);font-size:.8rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.6);}
.fac_section .lab_element > span{
  display:block;font-family:var(--alt-ff-display);font-size:2.6rem;font-weight:600;
  color:var(--alt-amber);line-height:1;margin-bottom:.4rem;
}

/* ============================================================
   ARTICLES  (.articalsec .articlebox)
   ============================================================ */
.articalsec{padding:4.5rem 0;background:linear-gradient(180deg,#fff,var(--alt-bg2));}
.articalsec .sec-title{font-size:clamp(1.7rem,3vw,2.4rem);margin-bottom:2rem;}
.articlebox{
  background:var(--alt-bg);border:1px solid var(--alt-line);border-radius:var(--alt-radius-lg);
  overflow:hidden;box-shadow:var(--alt-shadow-sm);height:100%;
  display:flex;flex-direction:column;
  transition:transform var(--alt-ease),box-shadow var(--alt-ease);
}
.articlebox:hover{transform:translateY(-6px);box-shadow:var(--alt-shadow-lg);}
.articlebox .artimage{position:relative;overflow:hidden;}
.articlebox .artimage img{width:100%;aspect-ratio:16/10;object-fit:cover;transition:transform .6s ease;}
.articlebox:hover .artimage img{transform:scale(1.07);}
.articlebox .articles-date{
  position:absolute;top:12px;left:12px;background:var(--alt-amber);color:#ffffff;
  font-size:.72rem;font-weight:700;padding:.35rem .8rem;border-radius:100px;
  box-shadow:0 4px 12px rgba(249,115,22,.4);
}
.articlebox .articles-date strong{font-weight:700;}
.articlebox .artcontent{padding:1.4rem 1.5rem 1.6rem;display:flex;flex-direction:column;flex:1;}
.articlebox .artcontent h3{font-size:1.18rem;font-weight:700;margin-bottom:.7rem;line-height:1.3;}
.articlebox .artcontent h3 a{color:var(--alt-navy-d);transition:color var(--alt-ease);}
.articlebox .artcontent h3 a:hover{color:var(--alt-amber);}
.articlebox .artcontent p{color:var(--alt-mut);font-size:.93rem;font-weight:400;line-height:1.7;margin-bottom:1.1rem;flex:1;}
.articlebox .artcontent > a{
  align-self:flex-start;font-weight:600;color:var(--alt-navy);font-size:.9rem;
  display:inline-flex;align-items:center;gap:.4rem;transition:gap var(--alt-ease),color var(--alt-ease);
}
.articlebox .artcontent > a::after{content:"\f178";font-family:"FontAwesome";font-size:.85rem;}
.articlebox .artcontent > a:hover{color:var(--alt-amber);gap:.7rem;}
.articalview{margin-top:2rem;}

/* ============================================================
   PRODUCT LISTING  (.plistsec .pbox .pimage .ptitle)
   Long category list — responsive grid (was style1 float:25%)
   ============================================================ */
.plistsec{width:100%;}
.plistsec ul{
  list-style:none;margin:0;padding:0;
  display:grid;grid-template-columns:repeat(4,1fr);gap:1.1rem;
}
.plistsec ul li{margin:0;padding:0;}
.plistsec .pbox{
  background:var(--alt-bg);border:1px solid var(--alt-line);border-radius:var(--alt-radius);
  padding:.9rem;text-align:center;height:100%;box-shadow:var(--alt-shadow-sm);
  transition:transform var(--alt-ease),box-shadow var(--alt-ease);
}
.plistsec .pbox:hover{transform:translateY(-4px);box-shadow:var(--alt-shadow-md);}
.plistsec .pbox a{text-decoration:none;color:inherit;display:block;}
.plistsec .pimage{
  height:180px;display:flex;align-items:center;justify-content:center;
  overflow:hidden;border-radius:var(--alt-radius-sm);background:#fff;
}
.plistsec .pimage img{max-width:100%;max-height:180px;object-fit:contain;transition:transform .4s ease;}
.plistsec .pbox:hover .pimage img{transform:scale(1.06);}
.plistsec .ptitle{margin-top:.7rem;}
.plistsec .ptitle h3{font-size:.92rem;font-weight:600;color:var(--alt-navy-d);margin:0;line-height:1.35;}
@media (max-width:991px){.plistsec ul{grid-template-columns:repeat(3,1fr);}}
@media (max-width:680px){.plistsec ul{grid-template-columns:repeat(2,1fr);}}
@media (max-width:420px){.plistsec ul{grid-template-columns:1fr;}}

/* ============================================================
   CARDS / FORMS GENERAL POLISH
   ============================================================ */
.form-control{
  border-radius:var(--alt-radius-sm);border:1px solid var(--alt-line);padding:.65rem .9rem;
  transition:border-color var(--alt-ease),box-shadow var(--alt-ease);
}
.form-control:focus{border-color:var(--alt-amber);box-shadow:0 0 0 3px rgba(249,115,22,.15);outline:none;}
.btn-product,.btn-default{
  background:var(--alt-navy)!important;color:#fff!important;border:none;border-radius:var(--alt-radius-sm);
  font-weight:600;padding:.7rem 1.6rem;transition:all var(--alt-ease);
}
.btn-product:hover,.btn-default:hover{background:var(--alt-amber)!important;color:#ffffff!important;transform:translateY(-2px);}

/* ============================================================
   FOOTER (.alt-footer + trust strip + 4-col layout + back-to-top)
   ============================================================ */
.alt-footer{position:relative;}

/* trust strip — sits above the main footer */
.alt-footer-trust{
  background:linear-gradient(90deg,var(--alt-navy-d),var(--alt-navy),var(--alt-navy-d));
  border-top:1px solid rgba(255,255,255,.06);
  border-bottom:1px solid rgba(255,255,255,.06);
  padding:1.1rem 0;color:#fff;
}
.alt-trust-item{
  display:flex;align-items:center;gap:.7rem;color:rgba(255,255,255,.85);
  font-size:.9rem;line-height:1.5;
}
.alt-trust-item i{
  color:var(--alt-amber);font-size:1.4rem;
  background:rgba(249,115,22,.13);border-radius:50%;
  width:42px;height:42px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;
}
.alt-trust-item strong{color:#fff;font-weight:700;}

/* main footer */
.footer_top{
  background:linear-gradient(160deg,var(--alt-navy-d),var(--alt-navy));
  color:rgba(255,255,255,.82);padding:3.5rem 0 2.5rem;
}
.footer_top .flogo img{margin-bottom:1rem;max-width:170px;}
.footer_top .flogo p{font-size:.9rem;font-weight:400;line-height:1.7;color:rgba(255,255,255,.7);margin-bottom:1.1rem;}
.footer_top h4{
  font-family:var(--alt-ff-display);color:#fff;font-size:1.05rem;font-weight:700;
  margin-bottom:1.2rem;position:relative;padding-bottom:.6rem;letter-spacing:-.01em;
}
.footer_top h4::after{content:"";position:absolute;left:0;bottom:0;width:34px;height:3px;border-radius:3px;background:var(--alt-amber);}
.footer_top ul{list-style:none;margin:0;padding:0;}
.footer_top li{margin-bottom:.45rem;}
.footer_top a{color:rgba(255,255,255,.74);font-size:.9rem;font-weight:400;text-decoration:none;
  transition:color var(--alt-ease),padding var(--alt-ease);display:inline-block;}
.footer_top a:hover{color:var(--alt-amber);padding-left:4px;}
.footer_top li.active a{color:var(--alt-amber);font-weight:600;}

/* contact list with icons */
.alt-footer-contact{margin-bottom:1.3rem !important;}
.alt-footer-contact li{
  display:flex;align-items:flex-start;gap:.7rem;font-size:.9rem;
  color:rgba(255,255,255,.78);margin-bottom:.7rem;line-height:1.55;
}
.alt-footer-contact li i{
  color:var(--alt-amber);width:18px;flex-shrink:0;margin-top:.18rem;text-align:center;
}
.alt-footer-contact a{font-size:.9rem;padding:0 !important;}
.alt-footer-contact a:hover{padding:0 !important;}

/* footer CTA button */
.alt-footer-cta{
  display:inline-flex;align-items:center;gap:.5rem;
  background:var(--alt-amber);color:#fff !important;
  font-weight:600;font-size:.88rem;padding:.6rem 1.2rem;border-radius:100px;
  text-decoration:none;box-shadow:0 6px 18px rgba(249,115,22,.32);
  transition:all var(--alt-ease);
}
.alt-footer-cta:hover{background:#e0640f;transform:translateY(-2px);padding:.6rem 1.2rem !important;color:#fff !important;}
.alt-footer-cta i{transition:transform var(--alt-ease);}
.alt-footer-cta:hover i{transform:translateX(3px);}

/* social icons */
.alt-footer-social{display:flex;gap:.5rem;margin-top:.5rem;}
.alt-footer-social a{
  width:38px;height:38px;border-radius:50%;
  background:rgba(255,255,255,.08);color:#fff !important;
  display:inline-flex;align-items:center;justify-content:center;
  font-size:1rem;text-decoration:none;
  transition:all var(--alt-ease);
}
.alt-footer-social a:hover{background:var(--alt-amber);transform:translateY(-3px);padding:0 !important;}

/* bottom strip */
.footer_bot{background:var(--alt-navy-d);padding:1.1rem 0;border-top:1px solid rgba(255,255,255,.08);}
.footer_bot .copyright{color:rgba(255,255,255,.55);font-size:.82rem;margin:0;text-align:center;line-height:1.6;}
.alt-copy-sep{color:rgba(255,255,255,.25);margin:0 .4rem;}

/* ============================================================
   SCROLL TO TOP BUTTON — right side, above the FAB stack
   ============================================================ */
.alt-backtop{
  position:fixed;right:22px;bottom:90px;z-index:1049;
  width:48px;height:48px;border-radius:50%;
  background:#ffffff;color:var(--alt-navy-d) !important;
  display:flex;align-items:center;justify-content:center;
  font-size:1.3rem;text-decoration:none;
  box-shadow:0 6px 20px rgba(0,0,0,.25), 0 0 0 1px rgba(255,255,255,.4);
  opacity:0;pointer-events:none;transform:translateY(10px);
  transition:all var(--alt-ease);
}
.alt-backtop.show{opacity:1;pointer-events:auto;transform:none;}
.alt-backtop:hover{background:var(--alt-amber);color:#fff !important;transform:translateY(-3px);}
/* when sub-FABs open, lift back-to-top above them (3 fabs * ~67px + gap) */
.alt-backtop.lift{bottom:300px;}

@media (max-width:680px){
  .alt-trust-item{font-size:.8rem;}
  .alt-trust-item i{width:36px;height:36px;font-size:1.1rem;}
  .alt-backtop{width:42px;height:42px;font-size:1.1rem;}
}

/* ============================================================
   FLOATING SUPPORT FAB (.support .inner-fabs)  — modern polish
   ============================================================ */
.support{
  position:fixed;right:22px;bottom:22px;z-index:1050;width:56px;height:56px;border-radius:50%;
  background:linear-gradient(150deg,var(--alt-amber-soft),var(--alt-amber));
  box-shadow:0 10px 30px rgba(249,115,22,.4);display:flex;align-items:center;justify-content:center;
  cursor:pointer;transition:transform var(--alt-ease);
}
.support:hover{transform:scale(1.08);}
.support img{width:26px;height:26px;}
/* expanded contact channels — stack ABOVE the main FAB */
.inner-fabs{
  position:fixed;right:22px;bottom:90px;z-index:1050;
  display:flex;flex-direction:column;gap:.7rem;
  opacity:0;pointer-events:none;transform:translateY(10px);
  transition:all var(--alt-ease);
}
.inner-fabs.show{opacity:1;pointer-events:auto;transform:none;}
.inner-fabs a,
.inner-fabs > a{
  width:56px !important;height:56px !important;
  border-radius:50% !important;
  background:#ffffff !important;color:var(--alt-navy-d) !important;
  display:flex !important;align-items:center;justify-content:center;
  font-size:1.5rem;
  box-shadow:0 6px 20px rgba(0,0,0,.25), 0 0 0 1px rgba(255,255,255,.4) !important;
  transition:all var(--alt-ease);
  text-decoration:none;
}
/* per-channel default icon color so each button has its own identity */
.inner-fabs a[href^="https://wa"],
.inner-fabs a[href^="https://api.whatsapp"]{color:#25d366 !important;}
.inner-fabs a[href^="mailto"]{color:var(--alt-amber) !important;}
.inner-fabs a[href^="tel"]{color:#3b82f6 !important;}
/* hover — fill with the channel color, icon goes white */
.inner-fabs a:hover{transform:scale(1.08);color:#fff !important;}
.inner-fabs a[href^="https://wa"]:hover,
.inner-fabs a[href^="https://api.whatsapp"]:hover{background:#25d366 !important;}
.inner-fabs a[href^="mailto"]:hover{background:var(--alt-amber) !important;}
.inner-fabs a[href^="tel"]:hover{background:#3b82f6 !important;}

/* ============================================================
   INNER BANNER (kept consistent with the modernized version)
   ============================================================ */
.inner_banner{
  position:relative;overflow:hidden;padding:92px 0 56px;background-color:#0e2b51;
  background-image:
    radial-gradient(900px 380px at 88% -40%, rgba(249,115,22,.18) 0%, rgba(249,115,22,0) 60%),
    radial-gradient(700px 420px at 8% 130%, rgba(74,106,154,.35) 0%, rgba(74,106,154,0) 60%),
    linear-gradient(125deg,#061731 0%,#0a2342 55%,#13325c 100%);
}
.inner_banner::before{content:"";position:absolute;inset:0;
  background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);
  background-size:44px 44px;-webkit-mask-image:radial-gradient(120% 100% at 75% 0%,#000,transparent 72%);mask-image:radial-gradient(120% 100% at 75% 0%,#000,transparent 72%);pointer-events:none;}
.inner_banner::after{content:"";position:absolute;top:-90px;right:-60px;width:240px;height:240px;border-radius:50%;border:40px solid rgba(255,255,255,.03);pointer-events:none;}
.inner_banner .container{position:relative;z-index:2;}
.inner_banner h1,.inner_banner h3,.inner_banner .title{
  position:relative;display:inline-block;color:#fff;font-family:var(--alt-ff-display);
  font-weight:600;letter-spacing:-.5px;text-shadow:0 2px 18px rgba(0,0,0,.25);
}
.inner_banner h1{font-size:clamp(1.9rem,3.5vw,2.6rem);margin:0 0 10px;padding-bottom:14px;}
.inner_banner h1::after{content:"";position:absolute;left:0;bottom:0;width:64px;height:4px;border-radius:4px;background:linear-gradient(90deg,var(--alt-amber-soft),var(--alt-amber));}
.inner_banner h3{font-size:1.05rem;font-weight:400;font-family:var(--alt-ff-body);color:rgba(255,255,255,.85);}

/* sticky-header offset preserved */
.inner_banner{margin-top:60px;}
.mainhead.fixed{position:fixed;top:0;left:0;right:0;width:100%;z-index:1000;}

/* ============================================================
   BREADCRUMBS
   ============================================================ */
.bread-crumbs{background:var(--alt-bg2);border-bottom:1px solid var(--alt-line);padding:.7rem 0;font-size:.85rem;}
.bread-crumbs a{color:var(--alt-navy);}
.bread-crumbs a:hover{color:var(--alt-amber);}

/* ============================================================
   NEW SEO SECTIONS (optional helper components)
   class names prefixed alt-seo so they never clash
   ============================================================ */
.alt-seo{padding:3.5rem 0;}
.alt-seo--tint{background:linear-gradient(180deg,var(--alt-bg2),var(--alt-bg3));}
.alt-seo h2{font-family:var(--alt-ff-display);font-size:clamp(1.6rem,3vw,2.2rem);font-weight:600;color:var(--alt-navy-d);margin-bottom:1rem;}
.alt-seo h2 em{color:var(--alt-amber);font-style:normal;font-weight:600;}
.alt-seo p{color:var(--alt-mut);font-weight:300;line-height:1.85;}
.alt-seo .alt-feature{
  background:var(--alt-bg);border:1px solid var(--alt-line);border-radius:var(--alt-radius);
  padding:1.5rem;height:100%;box-shadow:var(--alt-shadow-sm);transition:transform var(--alt-ease),box-shadow var(--alt-ease);
}
.alt-seo .alt-feature:hover{transform:translateY(-4px);box-shadow:var(--alt-shadow-md);}
.alt-seo .alt-feature h3{font-size:1.1rem;font-weight:600;color:var(--alt-navy-d);margin-bottom:.5rem;}
.alt-seo .alt-feature p{font-size:.93rem;}
.alt-seo .alt-ico{
  width:48px;height:48px;border-radius:12px;margin-bottom:1rem;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(150deg,var(--alt-navy),var(--alt-navy-d));color:#fff;font-size:1.3rem;
}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:992px){
  .firsthome ul{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:575.98px){
  .firsthome ul{grid-template-columns:1fr;}
  .fac_section .lab_element > span{font-size:2rem;}

  /* ---- MOBILE HERO BANNER ---- */
  /* give each slide a real height so the image + text always show */
  .homebanner .bannersec{position:relative;min-height:300px;}
  .homebanner .bannersec img{width:100%;height:300px;object-fit:cover;display:block;}
  .homebanner .owl-carousel .owl-item img{height:300px;width:100%;object-fit:cover;}
  /* darker overlay so white slide text is legible on mobile */
  .homebanner .slidebox{
    position:absolute;inset:0;display:flex;align-items:center;
    background:linear-gradient(90deg,rgba(6,23,49,.85) 0%,rgba(6,23,49,.62) 60%,rgba(6,23,49,.45) 100%);
  }
  .homebanner .bcontent{padding:0 1.1rem;}
  .homebanner .slide_title{font-size:1.45rem !important;line-height:1.18;max-width:100%;margin-bottom:.5rem;}
  .homebanner .bcontent p{font-size:.9rem;max-width:100%;line-height:1.45;margin-bottom:1rem;}
  .bbtn{padding:.6rem 1.2rem;font-size:.9rem;}

  /* service cards must NOT pull up into the banner on mobile */
  .firsthome{padding:1.5rem 0 2.5rem;}
  .firsthome ul{transform:none !important;margin-bottom:0 !important;gap:1rem;}
}


/* ============================================================
   INNER-PAGE LAYOUT  (.page_inner_full + .sidebarsec + .contentsection)
   used by products.php, contacts.php, profile.php
   ============================================================ */
.page_inner_full{padding:2.5rem 0 4rem;}
.page_inner_full > .container > .row{margin:0;}
/* widen the inner-page container to ~90% of screen for product browsing */
.page_inner_full > .container{max-width:min(1600px,85%);}
.sidebarsec{width:288px;float:left;padding-right:1.25rem;}
.sidebarsec.left-menu{width:288px;}
.contentsection{margin-left:288px;padding-left:1.25rem;}
.contentsection.productpage{min-height:600px;}
.headsec{margin-bottom:1.8rem;}
.headsec h1{font-family:var(--alt-ff-display);font-size:clamp(1.6rem,2.6vw,2rem);font-weight:800;color:var(--alt-navy-d);letter-spacing:-.01em;margin-bottom:.7rem;}
.headsec p{color:var(--alt-mut);line-height:1.75;}
@media (max-width:991px){
  .sidebarsec,.sidebarsec.left-menu{width:100%;float:none;padding-right:0;margin-bottom:1.5rem;}
  .contentsection{margin-left:0;padding-left:0;}
}

/* ============================================================
   SIDEBAR  (.sidebar .shead #cssmenu)  — used by left.php
   ============================================================ */
.sidebar{background:var(--alt-bg);border:1px solid var(--alt-line);border-radius:var(--alt-radius-lg);overflow:hidden;box-shadow:var(--alt-shadow-sm);}
.sidebar .shead{background:linear-gradient(150deg,var(--alt-navy),var(--alt-navy-d));padding:1rem 1.2rem;}
.sidebar .shead h2{font-family:var(--alt-ff-display);font-size:1.05rem;font-weight:700;color:#fff;margin:0;display:flex;align-items:center;gap:.55rem;letter-spacing:0;}
.sidebar .shead h2 i{color:var(--alt-amber);font-size:1rem;}
.sidebar .submenu-toogle{display:none;}
.left_section{padding:.3rem 0;}
#cssmenu ul{list-style:none;margin:0;padding:0;}
#cssmenu ul li{border-bottom:1px solid var(--alt-line);}
#cssmenu ul li:last-child{border-bottom:none;}
#cssmenu ul li a{
  display:block;padding:.55rem .9rem;color:var(--alt-ink);font-size:.83rem;font-weight:500;
  text-decoration:none;line-height:1.35;position:relative;transition:all var(--alt-ease);
  border-left:3px solid transparent;
}
#cssmenu ul li a:hover{background:var(--alt-bg2);color:var(--alt-navy);border-left-color:var(--alt-amber);padding-left:1.15rem;}
#cssmenu ul li.active > a{background:var(--alt-bg3);color:var(--alt-navy-d);border-left-color:var(--alt-amber);font-weight:600;}

/* ============================================================
   PRODUCT LIST ROWS  (.category_box.plist.prolist on products.php)
   Each result is a wide row with image left + content right
   ============================================================ */
.category_box.plist.prolist{
  display:grid;grid-template-columns:200px 1fr;gap:1.5rem;align-items:start;
  background:var(--alt-bg);border:1px solid var(--alt-line);border-radius:var(--alt-radius-lg);
  padding:1.2rem;margin-bottom:1.1rem;box-shadow:var(--alt-shadow-sm);
  transition:box-shadow var(--alt-ease),transform var(--alt-ease);
}
.category_box.plist.prolist:hover{box-shadow:var(--alt-shadow-md);transform:translateY(-2px);}
.category_box.plist.prolist .images{display:flex;align-items:center;justify-content:center;height:170px;overflow:hidden;border-radius:var(--alt-radius);background:var(--alt-bg2);}
.category_box.plist.prolist .images img{max-width:100%;max-height:170px;object-fit:contain;}
.category_box.plist.prolist .procont .about_product h3{font-family:var(--alt-ff-display);font-size:1.15rem;font-weight:700;margin-bottom:.4rem;line-height:1.3;}
.category_box.plist.prolist .procont .about_product h3 a{color:var(--alt-navy-d);}
.category_box.plist.prolist .procont .about_product h3 a:hover{color:var(--alt-amber);}
.category_box.plist.prolist .procont .about_product p{color:var(--alt-mut);font-size:.92rem;line-height:1.65;margin-bottom:.55rem;}
.category_box.plist.prolist .procont .about_product p strong{color:var(--alt-ink);}
.category_box.plist.prolist .btn-product{display:inline-flex;align-items:center;gap:.4rem;margin-right:.5rem;margin-top:.4rem;}
@media (max-width:680px){
  .category_box.plist.prolist{grid-template-columns:1fr;}
  .category_box.plist.prolist .images{height:200px;}
}

/* ============================================================
   PAGINATION  (output of seo_paginate_new)
   ============================================================ */
.contentsection .paginate, .pagination, .contentsection a.page-link{font-family:var(--alt-ff-body);}
.contentsection ul.pagination{display:flex;flex-wrap:wrap;gap:.4rem;list-style:none;padding:0;margin:2rem 0 0;justify-content:center;}
.contentsection ul.pagination li a, .contentsection ul.pagination li span{
  display:inline-flex;align-items:center;justify-content:center;min-width:36px;height:36px;padding:0 .7rem;
  border:1px solid var(--alt-line);border-radius:8px;background:var(--alt-bg);color:var(--alt-navy);
  font-size:.88rem;font-weight:600;text-decoration:none;transition:all var(--alt-ease);
}
.contentsection ul.pagination li a:hover{background:var(--alt-navy);color:#fff;border-color:var(--alt-navy);}
.contentsection ul.pagination li.active a, .contentsection ul.pagination li.active span{background:var(--alt-amber);color:#fff;border-color:var(--alt-amber);}

/* ============================================================
   PROFILE: ACCORDION PRODUCT RANGE  (.altec-range on profile.php)
   ============================================================ */
.alt-range-title{font-family:var(--alt-ff-display);font-size:clamp(1.5rem,2.4vw,2rem);font-weight:800;color:var(--alt-navy-d);letter-spacing:-.01em;margin:2rem 0 .6rem;}
.alt-range-intro{color:var(--alt-mut);max-width:75ch;margin-bottom:1.5rem;line-height:1.75;}
.altec-range{border:1px solid var(--alt-line);border-radius:var(--alt-radius-lg);overflow:hidden;background:var(--alt-bg);box-shadow:var(--alt-shadow-sm);}
.altec-range .accordion-item{border:none;border-bottom:1px solid var(--alt-line);border-radius:0;background:transparent;}
.altec-range .accordion-item:last-child{border-bottom:none;}
.altec-range .accordion-header{margin:0;}
.altec-range .accordion-button{
  background:transparent;color:var(--alt-navy-d);font-family:var(--alt-ff-display);font-weight:700;
  font-size:1rem;padding:1rem 1.2rem;box-shadow:none;border:none;
  display:flex;align-items:center;gap:.8rem;
}
.altec-range .accordion-button:not(.collapsed){background:var(--alt-bg2);color:var(--alt-navy-d);box-shadow:inset 0 -1px 0 var(--alt-line);}
.altec-range .accordion-button:focus{box-shadow:none;border-color:var(--alt-line);}
.altec-range .accordion-button::after{margin-left:auto;}
.alt-range-count{
  font-family:var(--alt-ff-body);font-size:.75rem;font-weight:600;letter-spacing:.02em;
  color:#fff;background:var(--alt-amber);padding:.18rem .55rem;border-radius:100px;flex-shrink:0;
}
.altec-range .accordion-body{padding:.4rem 1.2rem 1.2rem;background:var(--alt-bg);}
.alt-range-pills{display:flex;flex-wrap:wrap;gap:.5rem;}
.alt-range-pill{
  display:inline-block;padding:.4rem .85rem;border-radius:100px;
  background:var(--alt-bg3);color:var(--alt-ink);
  font-size:.84rem;font-weight:500;line-height:1.3;
  border:1px solid transparent;transition:all var(--alt-ease);
}
.alt-range-pill:hover{background:var(--alt-navy);color:#fff;cursor:default;}



/* products page: pbox tile titles should not be underlined or huge */
.plistsec .pbox a,
.contentsection .pbox a{text-decoration:none;color:inherit;}
.contentsection .pbox .ptitle h3{font-size:.95rem;font-weight:600;color:var(--alt-navy-d);margin:.7rem 0 0;line-height:1.3;}


/* ============================================================
   CONTACT PAGE  (.alt-contact-cards, etc.)
   used by contacts.php
   ============================================================ */
.alt-contact-cards{margin-top:1.5rem;}
.alt-contact-card{
  background:var(--alt-bg);border:1px solid var(--alt-line);border-radius:var(--alt-radius-lg);
  padding:1.6rem 1.4rem;height:100%;box-shadow:var(--alt-shadow-sm);text-align:center;
  transition:transform var(--alt-ease),box-shadow var(--alt-ease);
}
.alt-contact-card:hover{transform:translateY(-4px);box-shadow:var(--alt-shadow-md);}
.alt-contact-ico{
  display:inline-flex;align-items:center;justify-content:center;
  width:56px;height:56px;border-radius:14px;margin:0 auto 1rem;
  background:linear-gradient(150deg,var(--alt-navy),var(--alt-navy-d));
  color:#fff;font-size:1.4rem;
}
.alt-contact-card h3{font-family:var(--alt-ff-display);font-size:1.05rem;font-weight:700;color:var(--alt-navy-d);margin-bottom:.5rem;letter-spacing:-.01em;}
.alt-contact-card p{color:var(--alt-mut);font-size:.92rem;line-height:1.6;margin-bottom:0;}
.alt-contact-card a{color:var(--alt-navy);font-weight:500;text-decoration:none;}
.alt-contact-card a:hover{color:var(--alt-amber);}
.alt-contact-card .alt-wa-link{display:inline-flex;align-items:center;gap:.35rem;margin-top:.3rem;}
.alt-mut-small{display:inline-block;color:var(--alt-mut);font-size:.78rem;margin-top:.2rem;}
.readbtn-wa{background:#25d366!important;color:#fff!important;}
.readbtn-wa:hover{background:#1ebd57!important;color:#fff!important;}

/* ============================================================
   PRODUCT DETAILS PAGE  (.alt-pd-*)
   used by product-details.php
   ============================================================ */
.alt-pd-hero{padding:2.5rem 0 3rem;background:var(--alt-bg);}
.alt-pd-img{
  background:var(--alt-bg);border:1px solid var(--alt-line);border-radius:var(--alt-radius-lg);
  padding:1.5rem;box-shadow:var(--alt-shadow-md);
  display:flex;align-items:center;justify-content:center;
  aspect-ratio:1/1;overflow:hidden;
}
.alt-pd-img img{max-width:100%;max-height:100%;object-fit:contain;}
.alt-pd-info{
  background:var(--alt-bg);border:1px solid var(--alt-line);border-radius:var(--alt-radius-lg);
  padding:1.8rem;box-shadow:var(--alt-shadow-sm);
}
.alt-pd-eyebrow{
  display:inline-flex;align-items:center;gap:.5rem;
  background:var(--alt-bg3);color:var(--alt-amber);
  font-family:var(--alt-ff-body);font-size:.74rem;font-weight:700;
  letter-spacing:.18em;text-transform:uppercase;
  padding:.35rem .8rem;border-radius:100px;margin-bottom:1rem;
}
.alt-pd-info .alt-pd-title{
  font-family:var(--alt-ff-display);color:var(--alt-navy-d);
  font-size:clamp(1.5rem,2.4vw,1.95rem);font-weight:800;
  letter-spacing:-.02em;margin-bottom:1.1rem;line-height:1.2;
}
.alt-pd-meta{list-style:none;margin:0 0 1.2rem;padding:0;}
.alt-pd-meta li{
  display:flex;align-items:flex-start;gap:.7rem;
  padding:.7rem 0;border-bottom:1px solid var(--alt-line);
  font-size:.9rem;color:var(--alt-ink);
}
.alt-pd-meta li:last-child{border-bottom:none;}
.alt-pd-meta li > i{color:var(--alt-navy);width:18px;flex-shrink:0;margin-top:.2rem;}
.alt-pd-meta-lbl{color:var(--alt-mut);min-width:90px;}
.alt-pd-meta-val{color:var(--alt-navy-d);font-weight:500;flex:1;}
.alt-pd-meta-val a{color:var(--alt-navy);text-decoration:none;}
.alt-pd-meta-val a:hover{color:var(--alt-amber);}
.alt-pd-tag{
  display:inline-block;padding:.18rem .55rem;margin:0 .25rem .25rem 0;border-radius:6px;
  background:var(--alt-bg3);color:var(--alt-navy-d);font-size:.78rem;font-weight:500;
}
.alt-pd-badges{display:flex;flex-wrap:wrap;gap:.5rem;margin:0 0 1.2rem;}
.alt-pd-badge{
  display:inline-flex;align-items:center;gap:.35rem;
  background:#e8f4ea;color:#1d6533;
  font-size:.78rem;font-weight:600;padding:.32rem .7rem;border-radius:100px;
}
.alt-pd-badge i{font-size:.72rem;}
.alt-pd-cta{display:flex;flex-wrap:wrap;gap:.6rem;margin-bottom:1.2rem;}
.alt-btn{
  display:inline-flex;align-items:center;gap:.45rem;
  font-family:var(--alt-ff-body);font-weight:600;font-size:.92rem;
  padding:.7rem 1.2rem;border-radius:var(--alt-radius-sm);
  text-decoration:none;border:none;cursor:pointer;
  transition:all var(--alt-ease);
}
.alt-btn-primary{background:var(--alt-navy);color:#fff;}
.alt-btn-primary:hover{background:var(--alt-navy-d);color:#fff;transform:translateY(-2px);}
.alt-btn-accent{background:var(--alt-amber);color:#fff;box-shadow:0 8px 22px rgba(249,115,22,.35);}
.alt-btn-accent:hover{background:#e0640f;color:#fff;transform:translateY(-2px);}
.alt-btn-wa{background:#25d366;color:#fff;}
.alt-btn-wa:hover{background:#1ebd57;color:#fff;transform:translateY(-2px);}
.alt-pd-trust{list-style:none;margin:0;padding-top:1rem;border-top:1px solid var(--alt-line);
  display:flex;flex-wrap:wrap;gap:1.2rem;font-size:.8rem;color:var(--alt-mut);}
.alt-pd-trust li{display:inline-flex;align-items:center;gap:.4rem;}
.alt-pd-trust li i{color:var(--alt-amber);}

/* tabs */
.alt-pd-tabs{margin-top:2.5rem;background:var(--alt-bg);border:1px solid var(--alt-line);border-radius:var(--alt-radius-lg);overflow:hidden;box-shadow:var(--alt-shadow-sm);}
.alt-pd-tabs .nav-tabs{border-bottom:1px solid var(--alt-line);padding:0 1rem;background:var(--alt-bg2);margin:0;}
.alt-pd-tabs .nav-tabs .nav-link{
  border:none;border-bottom:3px solid transparent;border-radius:0;
  background:transparent;color:var(--alt-mut);
  font-family:var(--alt-ff-body);font-weight:600;font-size:.92rem;
  padding:.95rem 1.2rem;margin:0 .2rem;display:inline-flex;align-items:center;gap:.5rem;
  transition:color var(--alt-ease),border-color var(--alt-ease);
}
.alt-pd-tabs .nav-tabs .nav-link:hover{color:var(--alt-navy);border-color:transparent;}
.alt-pd-tabs .nav-tabs .nav-link.active{
  color:var(--alt-navy-d);border-bottom-color:var(--alt-amber);background:var(--alt-bg);
}
.alt-pd-tab-body{padding:1.6rem 1.8rem;color:var(--alt-ink);line-height:1.8;}
.alt-pd-tab-body p{margin-bottom:.8rem;}
.alt-pd-tab-body ul{margin:.5rem 0 1rem 1.2rem;}
.alt-pd-tab-body h2,.alt-pd-tab-body h3{font-family:var(--alt-ff-display);color:var(--alt-navy-d);margin:1.2rem 0 .6rem;font-weight:700;}
.alt-pd-tab-body h2{font-size:1.25rem;}
.alt-pd-tab-body h3{font-size:1.1rem;}

/* related products */
.alt-pd-related{padding:3rem 0;background:linear-gradient(180deg,var(--alt-bg),var(--alt-bg2));}
.alt-pd-related h2{font-family:var(--alt-ff-display);font-size:clamp(1.5rem,2.4vw,1.95rem);font-weight:800;color:var(--alt-navy-d);letter-spacing:-.01em;}
.alt-pd-related .pbox{background:var(--alt-bg);border:1px solid var(--alt-line);border-radius:var(--alt-radius);padding:.9rem;text-align:center;height:100%;box-shadow:var(--alt-shadow-sm);transition:transform var(--alt-ease),box-shadow var(--alt-ease);}
.alt-pd-related .pbox:hover{transform:translateY(-4px);box-shadow:var(--alt-shadow-md);}
.alt-pd-related .pbox a{text-decoration:none;color:inherit;display:block;}
.alt-pd-related .pimage{height:160px;display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:var(--alt-radius-sm);background:var(--alt-bg);margin-bottom:.6rem;}
.alt-pd-related .pimage img{max-width:100%;max-height:160px;object-fit:contain;border:none;}
.alt-pd-related .ptitle h3{font-family:var(--alt-ff-display);font-size:.92rem;font-weight:600;color:var(--alt-navy-d);margin:.5rem 0 .3rem;line-height:1.35;}
.alt-pd-related .pbox a:after{content:"View Details \00a0\f105";font-family:"FontAwesome","Manrope",system-ui,sans-serif;color:var(--alt-amber);font-size:.78rem;font-weight:600;display:block;margin-top:.3rem;}

.alt-mut{color:var(--alt-mut);}

@media (max-width:991px){
  .alt-pd-info{padding:1.3rem;}
  .alt-pd-cta .alt-btn{font-size:.85rem;padding:.6rem 1rem;}
}



/* ============================================================
   PRODUCT CATEGORY CARDS  (.contentsection .pbox)
   used on products.php category grid — attractive BS5 cards
   ============================================================ */
.contentsection.productpage .row{margin:0 -.6rem;}
.contentsection.productpage > .row > [class*="col-"]{padding:.6rem;}
.contentsection .pbox{
  background:var(--alt-bg);
  border:1px solid var(--alt-line);
  border-radius:var(--alt-radius-lg);
  padding:1.1rem 1.1rem 1.2rem;
  text-align:center;
  height:100%;
  box-shadow:var(--alt-shadow-sm);
  transition:transform var(--alt-ease),box-shadow var(--alt-ease),border-color var(--alt-ease);
  position:relative;
  overflow:hidden;
}
.contentsection .pbox:hover{
  transform:translateY(-6px);
  box-shadow:var(--alt-shadow-lg);
  border-color:var(--alt-amber-soft);
}
/* top accent bar that fills in on hover */
.contentsection .pbox::before{
  content:"";position:absolute;left:0;top:0;height:3px;width:0;
  background:linear-gradient(90deg,var(--alt-amber),var(--alt-amber-soft));
  transition:width var(--alt-ease);
}
.contentsection .pbox:hover::before{width:100%;}
.contentsection .pbox a{text-decoration:none;color:inherit;display:block;}
.contentsection .pbox .pimage{
  height:200px;display:flex;align-items:center;justify-content:center;
  overflow:hidden;border-radius:var(--alt-radius);
  background:linear-gradient(180deg,var(--alt-bg) 0%,var(--alt-bg2) 100%);
  margin-bottom:1rem;padding:.8rem;
}
.contentsection .pbox .pimage img{max-width:100%;max-height:170px;object-fit:contain;transition:transform .45s ease;border:none;}
.contentsection .pbox:hover .pimage img{transform:scale(1.08);}
.contentsection .pbox .ptitle{margin:0;padding:0 .4rem;}
.contentsection .pbox .ptitle h3{
  font-family:var(--alt-ff-display);
  font-size:.95rem;font-weight:700;
  color:var(--alt-navy-d);
  margin:0;line-height:1.35;letter-spacing:-.01em;
}
.contentsection .pbox:hover .ptitle h3{color:var(--alt-navy);}
/* tiny "View Range" affordance appears on hover */
.contentsection .pbox .ptitle{position:relative;}
.contentsection .pbox .ptitle::after{
  content:"View Range \00a0\f105";
  font-family:"FontAwesome","Manrope",system-ui,sans-serif;
  display:block;margin-top:.35rem;
  font-size:.74rem;font-weight:700;letter-spacing:.04em;
  color:var(--alt-amber);opacity:0;transform:translateY(4px);
  transition:opacity var(--alt-ease),transform var(--alt-ease);
}
.contentsection .pbox:hover .ptitle::after{opacity:1;transform:translateY(0);}

/* tighten/refresh the headsec heading for the wider container */
.contentsection .headsec h1{font-size:clamp(1.5rem,2.2vw,1.85rem);line-height:1.25;margin-bottom:.6rem;}



/* ============================================================
   PRODUCTS PAGE — ENHANCED INNER BANNER (SEO hero)
   ============================================================ */
.inner_banner--products{padding:54px 0 50px;}
.inner_banner--products .alt-banner-content{position:relative;z-index:2;max-width:980px;display:flex;flex-direction:column;align-items:flex-start;}
.inner_banner--products .alt-banner-eyebrow{
  display:inline-flex;align-items:center;gap:.5rem;
  background:rgba(255,255,255,.10);color:#fff;
  font-family:var(--alt-ff-body);font-size:.74rem;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;
  padding:.4rem .9rem;border-radius:100px;
  border:1px solid rgba(255,255,255,.18);margin-bottom:1rem;
}
.inner_banner--products .alt-banner-eyebrow i{color:var(--alt-amber);}
.inner_banner--products h1{
  font-family:var(--alt-ff-display);color:#fff;
  font-size:clamp(1.8rem,3.2vw,2.7rem);font-weight:800;
  letter-spacing:-.02em;line-height:1.15;margin:0 0 .7rem;
  text-shadow:0 2px 18px rgba(0,0,0,.25);
}
.inner_banner--products h1::after{content:none;}
.inner_banner--products .alt-banner-sub{
  color:rgba(255,255,255,.84);font-family:var(--alt-ff-body);
  font-size:1rem;line-height:1.65;margin:0 0 1.1rem;font-weight:400;
  max-width:780px;
}
.inner_banner--products .alt-banner-badges{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.2rem;}
.inner_banner--products .alt-banner-badge{
  display:inline-flex;align-items:center;gap:.35rem;
  background:rgba(255,255,255,.10);color:#fff;
  font-size:.78rem;font-weight:600;
  padding:.35rem .8rem;border-radius:100px;
  border:1px solid rgba(255,255,255,.16);
}
.inner_banner--products .alt-banner-badge i{color:var(--alt-amber);font-size:.72rem;}
.inner_banner--products .alt-banner-cta{display:flex;flex-wrap:wrap;gap:.7rem;}
.inner_banner--products .alt-btn{
  display:inline-flex;align-items:center;gap:.45rem;
  font-weight:600;font-size:.9rem;padding:.65rem 1.3rem;
  border-radius:var(--alt-radius-sm);text-decoration:none;
  transition:all var(--alt-ease);border:none;
}
.inner_banner--products .alt-btn-accent{background:var(--alt-amber);color:#fff;box-shadow:0 8px 22px rgba(249,115,22,.35);}
.inner_banner--products .alt-btn-accent:hover{background:#e0640f;color:#fff;transform:translateY(-2px);}
.inner_banner--products .alt-btn-wa{background:#25d366;color:#fff;}
.inner_banner--products .alt-btn-wa:hover{background:#1ebd57;color:#fff;transform:translateY(-2px);}

/* on products page only: H1 moved to banner, so hide any duplicate in headsec */
.contentsection.productpage .headsec h1{display:none;}
.contentsection .headsec{margin-bottom:1.5rem;}
.contentsection .headsec p{color:var(--alt-mut);line-height:1.75;margin-bottom:.5rem;}

@media (max-width:680px){
  .inner_banner--products .alt-banner-cta .alt-btn{font-size:.82rem;padding:.55rem 1rem;}
}


/* product-details: inline product code chip inside the SEO banner subtitle */
.inner_banner--products .alt-banner-code{
  display:inline-block;margin-left:.6rem;
  background:rgba(255,255,255,.08);color:#fff;
  font-family:var(--alt-ff-body);font-size:.8rem;font-weight:500;
  padding:.18rem .65rem;border-radius:6px;
  border:1px solid rgba(255,255,255,.14);
  vertical-align:baseline;
}
.inner_banner--products .alt-banner-code strong{color:var(--alt-amber);font-weight:700;}


/* ============================================================
   PROFILE PAGE HERO — attractive top section
   used by profile.php (.alt-profile-hero, .alt-profile-stats, .alt-profile-img-wrap)
   ============================================================ */
/* profile page has NO sidebar — undo the margin-left applied by .contentsection */
.contentsection.profile-wrapper{margin-left:0;padding-left:0;width:100%;float:none;}
.alt-profile-hero{
  background:linear-gradient(180deg,var(--alt-bg) 0%,var(--alt-bg2) 100%);
  border:1px solid var(--alt-line);border-radius:var(--alt-radius-lg);
  padding:2.5rem;margin-bottom:2.5rem;box-shadow:var(--alt-shadow-md);
}
.alt-profile-hero .alt-eyebrow{margin-bottom:.9rem;}
.alt-profile-h2{
  font-family:var(--alt-ff-display);
  font-size:clamp(1.6rem,2.6vw,2.1rem);font-weight:800;
  color:var(--alt-navy-d);letter-spacing:-.02em;line-height:1.2;
  margin:0 0 1.1rem;
}
.alt-profile-h2 span{color:var(--alt-mut);font-weight:600;font-size:.65em;display:block;margin-top:.3rem;letter-spacing:0;}
.alt-profile-lead{
  font-size:1.05rem;line-height:1.75;color:var(--alt-ink);font-weight:500;
  margin-bottom:1.1rem;
}
.alt-profile-hero p{color:var(--alt-mut);line-height:1.8;margin-bottom:1rem;}
.alt-profile-cta{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.4rem;}
.readbtn-ghost{
  background:transparent !important;color:var(--alt-navy) !important;
  border:1.5px solid var(--alt-navy) !important;
}
.readbtn-ghost:hover{background:var(--alt-navy) !important;color:#fff !important;}

/* Image side */
.alt-profile-img-wrap{position:relative;border-radius:var(--alt-radius-lg);overflow:hidden;box-shadow:var(--alt-shadow-lg);}
.alt-profile-img{width:100%;height:auto;display:block;border-radius:var(--alt-radius-lg);}
.alt-profile-img-badge{
  position:absolute;left:1rem;bottom:1rem;z-index:2;
  background:rgba(10,35,66,.9);color:#fff;
  font-family:var(--alt-ff-body);font-size:.85rem;font-weight:600;
  padding:.5rem 1rem;border-radius:100px;
  display:inline-flex;align-items:center;gap:.5rem;
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
}
.alt-profile-img-badge i{color:var(--alt-amber);}

/* Stats row under the image */
.alt-profile-stats{
  display:grid;grid-template-columns:repeat(4,1fr);gap:.6rem;
  margin-top:1rem;
}
.alt-profile-stat{
  background:var(--alt-bg);border:1px solid var(--alt-line);border-radius:var(--alt-radius);
  padding:.9rem .5rem;text-align:center;
  transition:transform var(--alt-ease),box-shadow var(--alt-ease);
}
.alt-profile-stat:hover{transform:translateY(-3px);box-shadow:var(--alt-shadow-md);}
.alt-profile-stat strong{
  display:block;font-family:var(--alt-ff-display);font-size:1.3rem;
  font-weight:800;color:var(--alt-amber);line-height:1;letter-spacing:-.01em;
}
.alt-profile-stat span{
  display:block;font-size:.72rem;color:var(--alt-mut);
  text-transform:uppercase;letter-spacing:.06em;font-weight:600;margin-top:.35rem;
}

/* About_us_page — clean up the body text below the hero */
.about_us_page{padding:1rem 0 2rem;}
.about_us_page h2{
  font-family:var(--alt-ff-display);font-weight:700;
  font-size:1.4rem;color:var(--alt-navy-d);letter-spacing:-.01em;
  margin:1.8rem 0 .8rem;
}
.about_us_page p{color:var(--alt-mut);line-height:1.85;margin-bottom:1rem;}

/* Final accordion section at end of profile.php */
.alt-range-section{background:linear-gradient(180deg,var(--alt-bg2),var(--alt-bg3));padding:3.5rem 0;}
.alt-range-section .alt-range-title{
  font-family:var(--alt-ff-display);font-weight:800;
  font-size:clamp(1.6rem,2.6vw,2.1rem);color:var(--alt-navy-d);letter-spacing:-.02em;
  margin:.5rem 0 .8rem;
}
.alt-range-section .alt-range-intro{max-width:75ch;color:var(--alt-mut);}

@media (max-width:991px){
  .alt-profile-hero{padding:1.8rem;}
  .alt-profile-stats{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:575px){
  .alt-profile-h2{font-size:1.4rem;}
}


/* ============================================================
   ARTICLES LIST  (.articalsec .artlist on articles.php)
   already styled via .articlebox from index — just unify spacing
   ============================================================ */
.articalsec.artlist{padding:3rem 0 4rem;background:linear-gradient(180deg,#fff,var(--alt-bg2));}
.articalsec.artlist .alist{width:100%;}
.articalsec.artlist .headingsec h2{
  font-family:var(--alt-ff-display);font-weight:800;
  font-size:clamp(1.5rem,2.4vw,2rem);color:var(--alt-navy-d);
  letter-spacing:-.02em;margin:0 0 2rem;text-align:center;
}
.articalsec.artlist .headingsec h2 span{color:var(--alt-amber);}

/* ============================================================
   ARTICLE DETAIL  (.alt-article on article-detail.php)
   ============================================================ */
.contentsection.alt-article{padding-top:.5rem;}
.contentsection.alt-article .artimage1{
  border-radius:var(--alt-radius-lg);overflow:hidden;
  margin-bottom:1.2rem;box-shadow:var(--alt-shadow-md);
}
.contentsection.alt-article .artimage1 img{width:100%;height:auto;display:block;}
.alt-article-meta{
  display:inline-flex;align-items:center;gap:.5rem;
  background:var(--alt-bg3);color:var(--alt-navy-d);
  font-family:var(--alt-ff-body);font-size:.82rem;font-weight:600;
  padding:.4rem .85rem;border-radius:100px;margin-bottom:1.5rem;
}
.alt-article-meta i{color:var(--alt-amber);}
.alt-article-body{
  font-family:var(--alt-ff-body);font-size:1.02rem;line-height:1.85;
  color:var(--alt-ink);
}
.alt-article-body p{margin-bottom:1.1rem;}
.alt-article-body h2{
  font-family:var(--alt-ff-display);font-weight:800;
  font-size:1.5rem;color:var(--alt-navy-d);
  letter-spacing:-.02em;margin:2rem 0 .9rem;line-height:1.3;
}
.alt-article-body h3{
  font-family:var(--alt-ff-display);font-weight:700;
  font-size:1.2rem;color:var(--alt-navy-d);
  margin:1.6rem 0 .7rem;
}
.alt-article-body h4{
  font-family:var(--alt-ff-display);font-weight:700;
  font-size:1.05rem;color:var(--alt-navy);
  margin:1.4rem 0 .6rem;
}
.alt-article-body ul,.alt-article-body ol{margin:.6rem 0 1.2rem 1.4rem;}
.alt-article-body ul li,.alt-article-body ol li{margin-bottom:.5rem;line-height:1.75;}
.alt-article-body a{color:var(--alt-navy);font-weight:600;text-decoration:underline;text-decoration-color:var(--alt-amber);text-underline-offset:3px;}
.alt-article-body a:hover{color:var(--alt-amber);}
.alt-article-body blockquote{
  border-left:4px solid var(--alt-amber);
  background:var(--alt-bg2);padding:1rem 1.4rem;
  margin:1.5rem 0;border-radius:0 var(--alt-radius) var(--alt-radius) 0;
  font-style:italic;color:var(--alt-mut);
}
.alt-article-body img{max-width:100%;height:auto;border-radius:var(--alt-radius);margin:1rem 0;}

/* CTA at end of article */
.alt-article-cta{
  margin-top:2.5rem;padding:1.8rem;border-radius:var(--alt-radius-lg);
  background:linear-gradient(135deg,var(--alt-navy-d),var(--alt-navy));
  color:#fff;box-shadow:var(--alt-shadow-md);
}
.alt-article-cta h3{
  font-family:var(--alt-ff-display);font-weight:800;
  font-size:1.25rem;color:#fff;letter-spacing:-.01em;
  margin:0 0 .7rem;
}
.alt-article-cta p{color:rgba(255,255,255,.85);line-height:1.7;margin-bottom:1rem;}
.alt-article-cta p:last-child{margin-bottom:0;}
.alt-article-cta .readbtn{background:var(--alt-amber);color:#fff;border:none;}
.alt-article-cta .readbtn:hover{background:#e0640f;}
.alt-article-cta .readbtn-ghost{background:transparent !important;color:#fff !important;border:1.5px solid rgba(255,255,255,.5) !important;}
.alt-article-cta .readbtn-ghost:hover{background:#fff !important;color:var(--alt-navy-d) !important;border-color:#fff !important;}

/* ============================================================
   SEARCH PAGE  (.alt-search-form, .alt-az-index on search.php)
   ============================================================ */
.contentsection.search_page{padding-top:.5rem;}
.contentsection.search_page h4{
  font-family:var(--alt-ff-display);font-weight:800;
  font-size:1.4rem;color:var(--alt-navy-d);letter-spacing:-.01em;
  margin:0 0 1.4rem;
}
.alt-search-form{
  background:var(--alt-bg);border:1px solid var(--alt-line);border-radius:var(--alt-radius-lg);
  padding:1.6rem;box-shadow:var(--alt-shadow-sm);margin-bottom:2rem;
}
.alt-search-label{
  display:block;font-family:var(--alt-ff-body);font-size:.85rem;font-weight:600;
  color:var(--alt-navy-d);margin-bottom:.4rem;letter-spacing:-.01em;
}
.alt-search-label i{color:var(--alt-amber);margin-right:.3rem;}
.alt-search-form .form-control{padding:.7rem 1rem;font-size:.95rem;}
.alt-search-form .alt-btn-primary{
  background:var(--alt-navy);color:#fff;border:none;
  font-weight:600;padding:.7rem 1.2rem;border-radius:var(--alt-radius-sm);
  transition:all var(--alt-ease);
}
.alt-search-form .alt-btn-primary:hover{background:var(--alt-navy-d);transform:translateY(-1px);}

/* search page — full width override (no sidebar) */
.alt-search-page > .container{max-width:min(1500px,85%);}
.contentsection--full{margin-left:0 !important;padding-left:0 !important;width:100%;float:none;}

/* A-Z index — denser, more attractive */
.alt-az-index{margin-top:2rem;}
.alt-az-header{margin-bottom:1.5rem;}
.alt-az-title{
  font-family:var(--alt-ff-display);font-weight:800;
  font-size:1.5rem;color:var(--alt-navy-d);letter-spacing:-.02em;
  margin:0 0 1rem;
}
/* sticky quick-nav letter bar */
.alt-az-nav{
  position:sticky;top:0;z-index:10;
  display:flex;flex-wrap:wrap;gap:.3rem;
  background:var(--alt-bg);border:1px solid var(--alt-line);
  border-radius:var(--alt-radius);padding:.5rem;
  box-shadow:var(--alt-shadow-sm);
}
.alt-az-jump{
  flex:1 1 auto;min-width:32px;
  display:inline-flex;align-items:center;justify-content:center;
  height:34px;border-radius:6px;
  font-family:var(--alt-ff-display);font-weight:700;font-size:.92rem;
  color:var(--alt-navy);background:var(--alt-bg2);
  text-decoration:none;
  transition:all var(--alt-ease);
}
.alt-az-jump:hover{background:var(--alt-navy);color:#fff;transform:translateY(-1px);}
.alt-az-jump--off{color:var(--alt-line);background:transparent;cursor:default;}
.alt-az-jump--off:hover{background:transparent;color:var(--alt-line);transform:none;}

/* each letter section */
.alt-az-section{
  background:var(--alt-bg);border:1px solid var(--alt-line);
  border-radius:var(--alt-radius-lg);
  padding:1.4rem 1.6rem;margin-bottom:1rem;
  scroll-margin-top:80px; /* offset for sticky nav when jumping */
}
.alt-az-section-head{
  display:flex;align-items:center;gap:.8rem;
  padding-bottom:1rem;margin-bottom:1rem;
  border-bottom:1px solid var(--alt-line);
}
.alt-az-letter{
  display:inline-flex;align-items:center;justify-content:center;
  background:linear-gradient(150deg,var(--alt-navy),var(--alt-navy-d));color:#fff;
  font-family:var(--alt-ff-display);font-size:1.5rem;font-weight:800;
  width:48px;height:48px;border-radius:var(--alt-radius);
  letter-spacing:-.02em;flex-shrink:0;box-shadow:var(--alt-shadow-sm);
}
.alt-az-count{
  font-family:var(--alt-ff-body);font-size:.78rem;font-weight:600;
  color:#fff;background:var(--alt-amber);
  padding:.25rem .65rem;border-radius:100px;
}
.alt-az-items{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:.5rem;
}
.alt-az-link{
  display:block;padding:.7rem 1rem;
  color:var(--alt-ink);font-size:.9rem;font-weight:500;
  text-decoration:none;line-height:1.4;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  border:1px solid var(--alt-line);
  border-radius:var(--alt-radius-sm);
  background:var(--alt-bg);
  transition:all .18s ease;
}
/* alternating box colors — checker pattern across the 3-col grid */
.alt-az-link:nth-child(2n){background:var(--alt-bg2);}
.alt-az-link:hover{
  background:var(--alt-navy);color:#fff;
  border-color:var(--alt-navy);transform:translateY(-2px);
  box-shadow:var(--alt-shadow-sm);
}

@media (max-width:680px){
  .alt-az-section{padding:1rem;}
  .alt-az-letter{width:42px;height:42px;font-size:1.25rem;}
  .alt-az-items{grid-template-columns:1fr;}
  .alt-az-jump{min-width:28px;height:30px;font-size:.82rem;}
}


/* ============================================================
   SEARCH RESULT PAGE  (.alt-search-results-head, .alt-result-*)
   used by search_result.php
   ============================================================ */
.alt-search-results-head{
  display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1rem;
  margin-bottom:1.5rem;padding-bottom:1rem;border-bottom:2px solid var(--alt-line);
}
.alt-search-results-head h2{
  font-family:var(--alt-ff-display);font-weight:800;
  font-size:1.5rem;color:var(--alt-navy-d);letter-spacing:-.02em;
  margin:0;
}
.alt-results-count{
  display:inline-block;margin-left:.5rem;
  background:var(--alt-amber);color:#fff;
  font-size:.8rem;font-weight:600;padding:.22rem .65rem;border-radius:100px;
  vertical-align:middle;
}
.alt-result-list{display:flex;flex-direction:column;gap:1rem;}
.alt-result-card{
  display:grid;grid-template-columns:180px 1fr;gap:1.5rem;align-items:start;
  background:var(--alt-bg);border:1px solid var(--alt-line);border-radius:var(--alt-radius-lg);
  padding:1.2rem;box-shadow:var(--alt-shadow-sm);
  transition:box-shadow var(--alt-ease),transform var(--alt-ease);
}
.alt-result-card:hover{box-shadow:var(--alt-shadow-md);transform:translateY(-2px);}
.alt-result-img{
  display:flex;align-items:center;justify-content:center;
  height:160px;overflow:hidden;border-radius:var(--alt-radius);
  background:linear-gradient(180deg,var(--alt-bg) 0%,var(--alt-bg2) 100%);
  padding:.6rem;
}
.alt-result-img img{max-width:100%;max-height:140px;object-fit:contain;}
.alt-result-body h3{
  font-family:var(--alt-ff-display);font-size:1.15rem;font-weight:700;
  margin:0 0 .5rem;line-height:1.3;letter-spacing:-.01em;
}
.alt-result-body h3 a{color:var(--alt-navy-d);text-decoration:none;}
.alt-result-body h3 a:hover{color:var(--alt-amber);}
.alt-result-meta{
  display:flex;flex-wrap:wrap;gap:.6rem;margin-bottom:.7rem;
  font-size:.85rem;color:var(--alt-mut);
}
.alt-result-meta i{color:var(--alt-amber);margin-right:.25rem;}
.alt-result-meta strong{color:var(--alt-navy-d);font-weight:600;}
.alt-result-desc{color:var(--alt-mut);font-size:.92rem;line-height:1.65;margin-bottom:.9rem;}
.alt-result-cta{display:flex;flex-wrap:wrap;gap:.5rem;}
.alt-result-cta .btn{
  display:inline-flex;align-items:center;font-size:.85rem;font-weight:600;
  padding:.5rem 1rem;border-radius:var(--alt-radius-sm);border:none;text-decoration:none;
  transition:all var(--alt-ease);
}
@media (max-width:680px){
  .alt-result-card{grid-template-columns:1fr;}
  .alt-result-img{height:200px;}
}

/* alt-btn-secondary (lighter than primary, useful for cart actions) */
.alt-btn-secondary{
  background:var(--alt-bg2);color:var(--alt-navy-d);
  border:1px solid var(--alt-line);font-weight:600;padding:.6rem 1.2rem;
  border-radius:var(--alt-radius-sm);text-decoration:none;
  transition:all var(--alt-ease);display:inline-flex;align-items:center;
}
.alt-btn-secondary:hover{background:var(--alt-navy);color:#fff;border-color:var(--alt-navy);transform:translateY(-1px);}

/* pagination output of paginate() helper */
.alt-pagination{margin-top:2rem;text-align:center;}
.alt-pagination a, .alt-pagination span, .alt-pagination strong{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:36px;height:36px;padding:0 .7rem;margin:0 .15rem;
  border:1px solid var(--alt-line);border-radius:8px;background:var(--alt-bg);
  color:var(--alt-navy);font-size:.88rem;font-weight:600;text-decoration:none;
  transition:all var(--alt-ease);
}
.alt-pagination a:hover{background:var(--alt-navy);color:#fff;border-color:var(--alt-navy);}
.alt-pagination strong, .alt-pagination .current{background:var(--alt-amber);color:#fff;border-color:var(--alt-amber);}

/* empty state (no results / empty cart) */
.alt-empty-state{
  text-align:center;padding:3rem 1.5rem;
  background:var(--alt-bg);border:1px solid var(--alt-line);
  border-radius:var(--alt-radius-lg);box-shadow:var(--alt-shadow-sm);
}
.alt-empty-ico{
  font-size:3.5rem;color:var(--alt-line);margin-bottom:1rem;display:block;
}
.alt-empty-state h3{
  font-family:var(--alt-ff-display);font-weight:700;color:var(--alt-navy-d);
  font-size:1.4rem;margin:0 0 .5rem;
}
.alt-empty-state p{color:var(--alt-mut);margin:0 0 1.5rem;}

/* ============================================================
   SHOPPING CART  (.alt-cart-*)
   used by shopping_cart.php
   ============================================================ */
.alt-cart-head{
  display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.6rem;
  margin-bottom:1.5rem;padding-bottom:1rem;border-bottom:2px solid var(--alt-line);
}
.alt-cart-head h2{
  font-family:var(--alt-ff-display);font-weight:800;
  font-size:1.5rem;color:var(--alt-navy-d);letter-spacing:-.02em;
  margin:0;
}
.alt-cart-count{
  background:var(--alt-amber);color:#fff;
  font-size:.82rem;font-weight:600;padding:.3rem .8rem;border-radius:100px;
}

.alt-cart-table{
  background:var(--alt-bg);border:1px solid var(--alt-line);border-radius:var(--alt-radius-lg);
  overflow:hidden;box-shadow:var(--alt-shadow-sm);margin-bottom:1.5rem;
}
.alt-cart-row{
  display:grid;
  grid-template-columns:90px 160px 1fr 130px;
  align-items:center;
  padding:1rem 1.2rem;
  border-bottom:1px solid var(--alt-line);
}
.alt-cart-row:last-child{border-bottom:none;}
.alt-cart-row:nth-child(even):not(.alt-cart-header){background:var(--alt-bg2);}
.alt-cart-header,
.alt-cart-header .alt-cart-col{
  background:linear-gradient(150deg,var(--alt-navy),var(--alt-navy-d));
  color:#fff !important;font-family:var(--alt-ff-display);font-weight:700;
  font-size:.85rem;letter-spacing:.02em;text-transform:uppercase;
}
.alt-cart-col{font-size:.93rem;}
.alt-cart-col-name{color:var(--alt-ink);font-weight:500;}
.alt-cart-col-code code{
  background:var(--alt-bg3);color:var(--alt-navy-d);
  font-family:'Manrope',monospace;font-size:.85rem;font-weight:600;
  padding:.25rem .55rem;border-radius:6px;
}
.alt-qty-input{
  width:90px;padding:.4rem .6rem;font-size:.9rem;font-weight:600;
  text-align:center;border-radius:6px;
}
.alt-cart-check{position:relative;display:inline-block;cursor:pointer;width:22px;height:22px;}
.alt-cart-check input{position:absolute;opacity:0;width:0;height:0;}
.alt-cart-check span{
  position:absolute;inset:0;border:2px solid var(--alt-line);border-radius:5px;
  background:var(--alt-bg);transition:all var(--alt-ease);
}
.alt-cart-check input:checked + span{background:var(--alt-amber);border-color:var(--alt-amber);}
.alt-cart-check input:checked + span::after{
  content:"\f00c";font-family:"FontAwesome";color:#fff;font-size:.78rem;
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
}

.alt-cart-actions{display:flex;flex-wrap:wrap;gap:.7rem;margin-bottom:1.5rem;}
.alt-cart-actions .btn{font-size:.92rem;padding:.7rem 1.3rem;}

.alt-cart-info{
  background:var(--alt-bg2);border-left:3px solid var(--alt-amber);
  padding:1rem 1.2rem;border-radius:var(--alt-radius-sm);
  font-size:.9rem;color:var(--alt-mut);line-height:1.65;
}
.alt-cart-info i{color:var(--alt-amber);}
.alt-cart-info p{margin:0;}

@media (max-width:768px){
  .alt-cart-row{grid-template-columns:1fr 1fr;gap:.6rem;padding:.9rem;}
  .alt-cart-row[class*="header"]{display:none;}
  .alt-cart-col{padding:.2rem 0;}
  .alt-cart-col[data-label]::before{
    content:attr(data-label) ": ";font-weight:700;color:var(--alt-mut);
    font-size:.78rem;text-transform:uppercase;letter-spacing:.04em;margin-right:.3rem;
  }
  .alt-cart-col-name{grid-column:1 / -1;}
}


/* ============================================================
   STATS STRIP — used below banner on tender-guide/index.php
   ============================================================ */
.alt-stats-strip{
  padding:1.8rem 0;
  background:linear-gradient(180deg,var(--alt-bg) 0%,var(--alt-bg2) 100%);
  border-bottom:1px solid var(--alt-line);
}
.alt-stats-strip .alt-profile-stats{
  grid-template-columns:repeat(4,1fr);
  max-width:1100px;margin:0 auto;
}
@media (max-width:680px){
  .alt-stats-strip .alt-profile-stats{grid-template-columns:repeat(2,1fr);}
}


/* ============================================================
   EXPORT REGIONS  (.alt-export-regions on search.php)
   beautified continent/region cards
   ============================================================ */
.alt-export-regions{
  padding:3rem 0 3.5rem;
  background:linear-gradient(180deg,var(--alt-bg) 0%,var(--alt-bg2) 100%);
  border-top:1px solid var(--alt-line);
}
.alt-export-regions h2{
  font-family:var(--alt-ff-display);font-weight:800;
  font-size:clamp(1.5rem,2.4vw,2rem);color:var(--alt-navy-d);
  letter-spacing:-.02em;margin:.6rem 0 .7rem;
}
.alt-export-regions h2 em{color:var(--alt-amber);font-style:normal;}
.alt-export-regions > .container > .text-center > p{
  color:var(--alt-mut);font-size:.98rem;line-height:1.7;
}

.alt-region-card{
  background:var(--alt-bg);border:1px solid var(--alt-line);
  border-radius:var(--alt-radius-lg);
  padding:1.4rem 1.5rem;height:100%;
  box-shadow:var(--alt-shadow-sm);
  transition:transform var(--alt-ease),box-shadow var(--alt-ease),border-color var(--alt-ease);
  position:relative;overflow:hidden;
}
.alt-region-card:hover{
  transform:translateY(-3px);
  box-shadow:var(--alt-shadow-md);
  border-color:var(--alt-amber-soft);
}
/* orange accent bar that fills on hover */
.alt-region-card::before{
  content:"";position:absolute;left:0;top:0;height:3px;width:0;
  background:linear-gradient(90deg,var(--alt-amber),var(--alt-amber-soft));
  transition:width var(--alt-ease);
}
.alt-region-card:hover::before{width:100%;}

.alt-region-head{
  display:flex;align-items:center;gap:.7rem;
  margin-bottom:.8rem;padding-bottom:.8rem;
  border-bottom:1px solid var(--alt-line);
}
.alt-region-ico{
  display:inline-flex;align-items:center;justify-content:center;
  width:42px;height:42px;border-radius:12px;flex-shrink:0;
  background:linear-gradient(150deg,var(--alt-navy),var(--alt-navy-d));
  color:#fff;font-size:1.1rem;
  box-shadow:var(--alt-shadow-sm);
}
.alt-region-ico i{color:var(--alt-amber);}
.alt-region-head h3{
  flex:1;margin:0;
  font-family:var(--alt-ff-display);font-size:1.1rem;font-weight:700;
  color:var(--alt-navy-d);letter-spacing:-.01em;
}
.alt-region-count{
  display:inline-block;font-size:.74rem;font-weight:600;
  color:#fff;background:var(--alt-amber);
  padding:.25rem .65rem;border-radius:100px;
  white-space:nowrap;
}
.alt-region-card p{
  color:var(--alt-ink);font-size:.92rem;line-height:1.75;
  margin:0;font-weight:400;
}

/* the 5th card (Southern Africa) spans full width — give it a subtle tint */
.alt-region-card--accent{
  background:linear-gradient(135deg,var(--alt-bg) 0%,var(--alt-bg3) 100%);
  border-color:var(--alt-bg3);
}

.alt-export-regions a{color:var(--alt-navy);font-weight:600;text-decoration:underline;text-decoration-color:var(--alt-amber);text-underline-offset:3px;}
.alt-export-regions a:hover{color:var(--alt-amber);}

@media (max-width:680px){
  .alt-region-card{padding:1.1rem;}
  .alt-region-ico{width:36px;height:36px;font-size:1rem;}
  .alt-region-head h3{font-size:1rem;}
}


/* ============================================================
   HOMEPAGE CATEGORY CARDS — SEO enhancements
   used by index.php (.hcategory enhanced with .cat-features, .cat-eyebrow, .cat-ctas)
   ============================================================ */

/* Trust strip below image — 4 equal compact tiles, icon-over-label */
.hcategory .categoryimg .cat-features{
  display:grid;grid-template-columns:repeat(2,1fr);
  gap:.6rem;margin-top:.9rem;
}
.cat-feature{
  box-sizing:border-box;
  background:var(--alt-bg);
  border:1px solid var(--alt-line);
  border-radius:12px;
  padding:.8rem .6rem;
  font-size:.78rem;font-weight:600;
  color:var(--alt-navy-d);
  display:flex;flex-direction:column;
  align-items:center;justify-content:center;
  gap:.45rem;text-align:center;
  line-height:1.3;
  text-decoration:none !important;
  box-shadow:var(--alt-shadow-sm);
  overflow:hidden;
  transition:all var(--alt-ease);
}
.cat-feature,.cat-feature *{text-decoration:none !important;}
.cat-feature:hover{
  background:var(--alt-bg3);
  border-color:var(--alt-amber-soft);
  transform:translateY(-2px);
  box-shadow:var(--alt-shadow-md);
}
.cat-feature i{
  color:var(--alt-amber);
  font-size:1.1rem;
  width:38px;height:38px;
  border-radius:50%;
  background:rgba(249,115,22,.12);
  display:inline-flex;
  align-items:center;justify-content:center;
  flex-shrink:0;
  transition:all var(--alt-ease);
}
.cat-feature:hover i{
  background:var(--alt-amber);color:#fff;transform:scale(1.05);
}

/* Eyebrow above heading */
.hcategory .categorycontent .cat-eyebrow{
  display:inline-flex;align-items:center;gap:.4rem;
  background:var(--alt-bg3);color:var(--alt-amber);
  font-family:var(--alt-ff-body);
  font-size:.72rem;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;
  padding:.3rem .75rem;border-radius:100px;
  margin-bottom:.8rem;
  border:1px solid rgba(249,115,22,.15);
}
.hcategory .categorycontent .cat-eyebrow i{font-size:.75rem;}

/* Beautified H2 link — animated underline + arrow on hover */
.hcategory .categorycontent h2{margin:0 0 .9rem;}
.hcategory .categorycontent h2 a{
  position:relative;display:inline-block;
  color:var(--alt-navy-d);text-decoration:none;
  background-image:linear-gradient(0deg,var(--alt-amber),var(--alt-amber));
  background-position:0 100%;
  background-size:0 2px;
  background-repeat:no-repeat;
  padding-bottom:2px;
  transition:background-size .3s ease,color var(--alt-ease);
}
.hcategory .categorycontent h2 a:hover{
  background-size:100% 2px;
  color:var(--alt-navy);
}
/* arrow icon after the heading that fades in on card hover */
.hcategory .categorycontent h2 a::after{
  content:" \f061";
  font-family:"FontAwesome","Manrope",system-ui,sans-serif;
  margin-left:.5rem;
  color:var(--alt-amber);
  opacity:0;
  display:inline-block;
  transform:translateX(-4px);
  transition:all .25s ease;
  font-size:.75em;
  vertical-align:middle;
}
.hcategory:hover .categorycontent h2 a::after{
  opacity:1;
  transform:translateX(0);
}

/* Dual CTA row — distinct colors + reassurance line */
.hcategory .categorycontent .cat-ctas{
  display:flex;flex-wrap:wrap;gap:.75rem;
  margin-top:1.3rem;
}
.hcategory .categorycontent .cat-ctas .readbtn{
  flex:1 1 auto;min-width:200px;
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  font-size:.95rem;padding:.85rem 1.5rem;
  text-decoration:none !important;
  white-space:nowrap;
}
.hcategory .categorycontent .cat-ctas .readbtn i{
  font-size:.85em;transition:transform var(--alt-ease);
}
.hcategory .categorycontent .cat-ctas .readbtn:hover i{
  transform:translateX(3px);
}
/* PRIMARY — navy filled (stays default .readbtn) */
.hcategory .categorycontent .cat-ctas .readbtn:not(.readbtn-ghost){
  background:var(--alt-navy);color:#fff !important;
  box-shadow:0 4px 14px rgba(10,35,66,.18);
}
.hcategory .categorycontent .cat-ctas .readbtn:not(.readbtn-ghost):hover{
  background:var(--alt-navy-d);transform:translateY(-2px);
  box-shadow:0 8px 22px rgba(10,35,66,.25);
}
/* SECONDARY — orange filled (was ghost, now amber for clear distinction) */
.hcategory .categorycontent .cat-ctas .readbtn-ghost{
  background:var(--alt-amber) !important;
  color:#fff !important;
  border:none !important;
  box-shadow:0 4px 14px rgba(249,115,22,.28) !important;
}
.hcategory .categorycontent .cat-ctas .readbtn-ghost:hover{
  background:#e0640f !important;
  color:#fff !important;
  transform:translateY(-2px);
  box-shadow:0 8px 22px rgba(249,115,22,.4) !important;
}
.hcategory .categorycontent .cat-ctas .readbtn-ghost:hover i{
  transform:translateX(3px);
}

/* Reassurance line below buttons */
.hcategory .categorycontent .cat-cta-info{
  display:flex;flex-wrap:wrap;align-items:center;gap:1.2rem;
  margin-top:.8rem;font-size:.82rem;color:var(--alt-mut);
  font-weight:500;
}
.hcategory .categorycontent .cat-cta-info span{
  display:inline-flex;align-items:center;gap:.4rem;
}
.hcategory .categorycontent .cat-cta-info i{
  color:var(--alt-amber);font-size:.95rem;
}

@media (max-width:680px){
  .hcategory .categoryimg .cat-features{grid-template-columns:repeat(2,1fr);gap:.5rem;}
  .cat-feature{font-size:.72rem;padding:.7rem .5rem;gap:.4rem;}
  .cat-feature i{width:38px;height:38px;font-size:1.1rem;}
  .hcategory .categorycontent .cat-ctas{gap:.5rem;}
  .hcategory .categorycontent .cat-ctas .readbtn{font-size:.85rem;padding:.7rem 1rem;min-width:140px;}
}


/* ============================================================
   COMPREHENSIVE MOBILE OPTIMISATION
   Single block ensuring every component reflows correctly
   on tablets (≤991px), phones (≤680px), and small phones (≤480px).
   Placed late in the cascade so it overrides earlier rules.
   ============================================================ */

/* ---- TABLETS (≤991px): collapse 2-col layouts, shrink sidebars ---- */
@media (max-width:991px){
  /* page containers use more of the viewport */
  .page_inner_full > .container,
  .alt-search-page > .container{max-width:96% !important;}
  .page_inner_full{padding:1.75rem 0 2.5rem;}

  /* SIDEBAR: stack full-width above content instead of floating */
  .sidebarsec.fleft{
    float:none !important;width:100% !important;
    margin-bottom:1.5rem;
  }
  .contentsection{margin-left:0 !important;padding-left:0 !important;}
  .contentsection.profile-wrapper{margin-left:0 !important;}
  /* contract the sticky sidebar height behaviour */
  .sidebar{position:static !important;max-height:none;}

  /* category zig-zag layout — single column, image first */
  .homecategory .hcategory,
  .homecategory ul li:nth-child(even) .hcategory{
    grid-template-columns:1fr !important;gap:1.25rem;padding:1.2rem;
  }
  .homecategory ul li:nth-child(even) .categoryimg{order:0 !important;}
  .homecategory ul li:nth-child(even) .categorycontent{order:0 !important;}

  /* welcome/about — stack */
  .homeabout .abougbg{grid-template-columns:1fr !important;gap:1.5rem;padding:1.5rem;}

  /* profile hero — stack image + text */
  .alt-profile-hero{padding:1.5rem !important;}
  .alt-profile-hero-grid{grid-template-columns:1fr !important;gap:1.5rem;}
  .alt-profile-stats{grid-template-columns:repeat(2,1fr) !important;}

  /* product details hero card — stack */
  .alt-pd-card{grid-template-columns:1fr !important;}
  .alt-pd-img{min-height:280px;}

  /* footer 4-col → 2-col on tablet */
  .footer_top .col-lg-4,
  .footer_top .col-lg-3,
  .footer_top .col-lg-2{margin-bottom:1.25rem;}
  .alt-footer-trust .row > [class*=col-]{margin-bottom:.7rem;}

  /* hero/banner — smaller padding */
  .inner_banner{padding:60px 0 40px !important;}
  .alt-banner-content h1{font-size:1.8rem !important;}
  .alt-banner-sub{font-size:.98rem !important;}

  /* tone down service cards */
  .alt-service-card{padding:1.25rem !important;}

  /* tabs — let them wrap */
  .alt-pd-tabs .nav{flex-wrap:wrap !important;}
  .alt-pd-tabs .nav-item{flex:1 1 auto;}
}

/* ---- PHONES (≤680px): single column everywhere, tight spacing ---- */
@media (max-width:680px){
  /* full bleed for content */
  .page_inner_full > .container,
  .alt-search-page > .container{max-width:100% !important;padding:0 .9rem !important;}
  .page_inner_full{padding:1.25rem 0 2rem;}
  .container{padding-left:.9rem !important;padding-right:.9rem !important;}

  /* banner is much smaller */
  .inner_banner{padding:42px 0 32px !important;}
  .alt-banner-content h1{font-size:1.45rem !important;line-height:1.2;}
  .alt-banner-eyebrow{font-size:.66rem !important;padding:.3rem .7rem !important;}
  .alt-banner-sub{font-size:.9rem !important;line-height:1.55;margin-bottom:.9rem !important;}
  .alt-banner-badges{gap:.4rem;}
  .alt-banner-badge{font-size:.72rem !important;padding:.3rem .7rem !important;}

  /* breadcrumbs — smaller */
  .bread-crumbs{padding:.7rem 0 !important;font-size:.82rem;}

  /* section headings */
  .sec-title,h2{font-size:1.45rem !important;}
  .alt-seo h2,.alt-export-regions h2{font-size:1.4rem !important;}
  .alt-seo .alt-eyebrow,.alt-export-regions .alt-eyebrow{font-size:.7rem;}

  /* SEO/feature grids — single column */
  .alt-seo .row > [class*=col-]{margin-bottom:.6rem;}
  .alt-feature{padding:1rem !important;}
  .alt-feature h3{font-size:.95rem !important;}
  .alt-feature p{font-size:.85rem !important;}

  /* profile hero stats — 2 col */
  .alt-profile-stats{gap:.6rem;}
  .alt-profile-stat strong{font-size:1.5rem;}
  .alt-profile-stat span{font-size:.66rem;}

  /* product details */
  .alt-pd-card{padding:1rem !important;gap:1rem !important;}
  .alt-pd-title{font-size:1.25rem !important;}
  .alt-pd-info-meta{flex-direction:column;align-items:flex-start;gap:.5rem;}
  .alt-pd-tabs .nav-link{font-size:.85rem;padding:.6rem .9rem !important;}
  .alt-pd-tab-content{padding:1.2rem !important;}

  /* product list cards (pbox) — 2 col → 1 col */
  .productpage .row > [class*=col-]{margin-bottom:.8rem;}

  /* contact cards single column */
  .alt-contact-cards .col-md-6{margin-bottom:.6rem;}

  /* search result cards — stack image above body */
  .alt-result-card{grid-template-columns:1fr !important;gap:.9rem !important;padding:.9rem !important;}
  .alt-result-img{height:180px;}
  .alt-result-body h3{font-size:1.05rem !important;}
  .alt-result-cta{flex-wrap:wrap;}
  .alt-result-cta .btn{flex:1 1 auto;justify-content:center;font-size:.85rem;}

  /* search form — stack */
  .alt-search-form .row{flex-direction:column;}
  .alt-search-form .col-md-5,.alt-search-form .col-md-4,.alt-search-form .col-md-3{
    width:100% !important;max-width:100% !important;flex:0 0 100% !important;margin-bottom:.6rem;
  }

  /* A-Z items — single column for legibility, smaller jump nav */
  .alt-az-items{grid-template-columns:1fr !important;}
  .alt-az-jump{min-width:26px;height:28px;font-size:.78rem;}
  .alt-az-section{padding:.9rem !important;}
  .alt-az-letter{width:38px;height:38px;font-size:1.1rem;}
  .alt-az-title{font-size:1.2rem !important;}

  /* cart — already responsive via data-label */
  .alt-cart-row{padding:.7rem !important;}
  .alt-cart-actions{flex-direction:column;}
  .alt-cart-actions .btn{width:100%;justify-content:center;}

  /* export regions — single col */
  .alt-region-card{padding:1rem !important;}
  .alt-region-head h3{font-size:.98rem !important;}

  /* category cards on homepage */
  .hcategory .categoryimg .cat-features{gap:.45rem;margin-top:.7rem;}
  .cat-feature{padding:.65rem .5rem !important;font-size:.7rem !important;gap:.35rem !important;}
  .cat-feature i{width:34px;height:34px;font-size:1rem !important;}
  .hcategory .categorycontent{padding:.5rem 0 !important;}
  .hcategory .categorycontent h2{font-size:1.15rem !important;}
  .hcategory .categorycontent p{font-size:.88rem !important;}
  .hcategory .categorycontent .cat-ctas{flex-direction:column;gap:.5rem;}
  .hcategory .categorycontent .cat-ctas .readbtn{
    width:100%;min-width:0 !important;justify-content:center;font-size:.9rem !important;padding:.75rem 1rem !important;
  }
  .hcategory .categorycontent .cat-cta-info{flex-direction:column;align-items:flex-start;gap:.4rem;font-size:.78rem;}

  /* footer — single column */
  .footer_top{padding:2.5rem 0 1.5rem !important;}
  .footer_top .col-lg-4,
  .footer_top .col-lg-3,
  .footer_top .col-lg-2,
  .footer_top .col-md-6{flex:0 0 100% !important;max-width:100% !important;margin-bottom:1.5rem;}
  .footer_top h4{font-size:1rem;}
  .footer_top .flogo p{font-size:.86rem;}
  .alt-footer-cta{padding:.55rem 1rem !important;font-size:.84rem;}
  .footer_bot .copyright{font-size:.74rem;line-height:1.5;padding:0 .5rem;}
  .alt-footer-trust{padding:.8rem 0 !important;}
  .alt-trust-item{padding:.3rem 0;}

  /* FAB sizing */
  .support{width:50px;height:50px;right:14px;bottom:14px;}
  .support img{width:22px;height:22px;}
  .inner-fabs{right:14px;bottom:74px;gap:.5rem;}
  .inner-fabs a,.inner-fabs > a{
    width:46px !important;height:46px !important;font-size:1.25rem;
  }
  .alt-backtop{width:42px !important;height:42px !important;right:14px !important;bottom:74px !important;font-size:1.05rem;}
  .alt-backtop.lift{bottom:240px !important;}

  /* article list & detail */
  .articlebox{padding:1rem !important;}
  .alt-article-body{padding:0 !important;}
  .alt-article-body h2{font-size:1.3rem !important;}

  /* tender page eex-grid keep readable */
  .eex-guide-grid{grid-template-columns:1fr !important;}
  .alt-stats-strip .alt-profile-stats{grid-template-columns:repeat(2,1fr) !important;}
}

/* ---- SMALL PHONES (≤420px): tightest spacing for narrow viewports ---- */
@media (max-width:420px){
  .alt-banner-content h1{font-size:1.25rem !important;}
  .alt-banner-sub{font-size:.84rem !important;}
  .container{padding-left:.7rem !important;padding-right:.7rem !important;}

  /* category trust badges still fit 2-col */
  .hcategory .categoryimg .cat-features{grid-template-columns:repeat(2,1fr) !important;gap:.35rem;}
  .cat-feature{font-size:.65rem !important;padding:.55rem .35rem !important;}
  .cat-feature i{width:30px;height:30px;font-size:.85rem !important;}

  /* heading scaling */
  .hcategory .categorycontent h2{font-size:1rem !important;}
  .sec-title,h2{font-size:1.25rem !important;}

  /* hero stats — keep 2 col but smaller */
  .alt-profile-stat strong{font-size:1.3rem !important;}
  .alt-profile-stat span{font-size:.62rem !important;letter-spacing:.04em;}

  /* breadcrumbs */
  .bread-crumbs{font-size:.76rem;}
}


/* honor reduced motion */
@media (prefers-reduced-motion:reduce){
  *{transition:none!important;animation:none!important;}
}