/*
Theme Name: Aryan Engineers
Theme URI: https://aryanengineers.net.in
Author: Aryan Engineers
Description: Custom WordPress theme for Aryan Engineers - Manufacturer of Biomass Wood Pellet Machines, Pellet Burners, and Industrial Equipment, Pune.
Version: 2.0
Text Domain: aryan-engineers
*/

/* ==========================================================================
   1. Design tokens
   ========================================================================== */
:root{
  --ink:        #10151F;
  --blue:       #0B3D91;
  --blue-deep:  #061B45;
  --blue-mid:   #123B87;
  --red:        #ED1C24;
  --red-deep:   #C0121A;
  --steel:      #4B5567;
  --steel-soft: #7B8698;
  --paper:      #FFFFFF;
  --paper-dim:  #F4F6FA;
  --line:       #E1E6EE;
  --line-dark:  rgba(255,255,255,.14);
  --radius:     3px;

  --font-display: "Space Grotesk", "Archivo", sans-serif;
  --font-body:    "IBM Plex Sans", "Inter", sans-serif;
  --font-mono:    "IBM Plex Mono", "SFMono-Regular", monospace;

  --container: 1200px;
  --ease: cubic-bezier(.22,.61,.36,1);
}

/* ==========================================================================
   2. Reset & base
   ========================================================================== */
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  font-family:var(--font-body);
  color:var(--ink);
  background:var(--paper);
  line-height:1.65;
  font-size:16px;
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; display:block; height:auto; }
a{ color:inherit; text-decoration:none; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4,h5,h6{
  font-family:var(--font-display);
  font-weight:600;
  letter-spacing:-.01em;
  margin:0 0 .5em;
  color:var(--ink);
  line-height:1.12;
}
p{ margin:0 0 1em; color:var(--steel); }
:focus-visible{ outline:2px solid var(--red); outline-offset:3px; }
@media (prefers-reduced-motion:reduce){
  *{ animation:none !important; transition:none !important; scroll-behavior:auto !important; }
}

.container{ max-width:var(--container); margin:0 auto; padding:0 28px; }

/* Reveal-on-scroll (progressively enhanced by main.js).
   Content is visible by default; only hidden pre-reveal when JS has
   added the "js" class to <html> AND the element hasn't been revealed yet. */
.reveal{ opacity:1; transform:none; transition:opacity .6s var(--ease), transform .6s var(--ease); }
.js .reveal:not(.is-visible){ opacity:0; transform:translateY(18px); }
.reveal.is-visible{ opacity:1; transform:none; }

/* ==========================================================================
   3. Type utilities
   ========================================================================== */
.eyebrow{
  font-family:var(--font-mono); text-transform:uppercase; letter-spacing:.14em;
  color:var(--red); font-size:.76rem; font-weight:600; display:inline-flex; align-items:center;
  margin-bottom:.9em;
}
.mono-tag{
  font-family:var(--font-mono); font-size:.72rem; letter-spacing:.08em; text-transform:uppercase;
  color:var(--steel-soft);
}

/* ==========================================================================
   4. Buttons
   ========================================================================== */
.btn{
  display:inline-flex; align-items:center; gap:.6em;
  background:var(--red); color:#fff; font-family:var(--font-display); font-weight:600;
  font-size:.95rem; letter-spacing:.01em;
  padding:14px 30px; border-radius:var(--radius); border:none; cursor:pointer;
  transition:background .2s var(--ease), transform .2s var(--ease);
}
.btn:hover{ background:var(--red-deep); transform:translateY(-1px); }
.btn-outline{ background:transparent; border:1px solid rgba(255,255,255,.5); color:#fff; }
.btn-outline:hover{ background:rgba(255,255,255,.08); border-color:#fff; }
.btn-dark{ background:var(--ink); }
.btn-dark:hover{ background:#000; }

/* ==========================================================================
   5. Technical corner-bracket frame (signature element)
   ========================================================================== */
.tech-frame{ position:relative; }
.tech-frame .corner{ position:absolute; width:22px; height:22px; z-index:2; }
.tech-frame .corner.tl{ top:-1px; left:-1px; border-top:2px solid var(--red); border-left:2px solid var(--red); }
.tech-frame .corner.tr{ top:-1px; right:-1px; border-top:2px solid var(--red); border-right:2px solid var(--red); }
.tech-frame .corner.bl{ bottom:-1px; left:-1px; border-bottom:2px solid var(--red); border-left:2px solid var(--red); }
.tech-frame .corner.br{ bottom:-1px; right:-1px; border-bottom:2px solid var(--red); border-right:2px solid var(--red); }
.tech-frame img{ display:block; }
.fig-label{
  position:absolute; bottom:12px; left:12px; z-index:3; background:var(--ink); color:#fff;
  font-family:var(--font-mono); font-size:.68rem; letter-spacing:.08em; padding:5px 10px;
  text-transform:uppercase;
}

/* ==========================================================================
   6. Top bar
   ========================================================================== */
.topbar{ background:var(--ink); color:#B9C2D1; font-family:var(--font-mono); font-size:.78rem; }
.topbar .container{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; padding:9px 28px; gap:8px; }
.topbar-left{ display:flex; gap:26px; flex-wrap:wrap; }
.topbar a{ color:#B9C2D1; }
.topbar a:hover{ color:var(--red); }
.topbar-social{ display:flex; gap:10px; }
.topbar-social a{
  width:24px; height:24px; border:1px solid #2B3646; display:flex; align-items:center; justify-content:center;
  font-size:.68rem; font-family:var(--font-body);
}

/* ==========================================================================
   7. Header / nav
   ========================================================================== */
.site-header{ background:#fff; border-bottom:1px solid var(--line); position:sticky; top:0; z-index:100; }
.site-header .container{ display:flex; align-items:center; justify-content:space-between; padding:16px 28px; }
.site-logo img{ max-height:50px; }
.main-nav ul{ display:flex; align-items:center; gap:30px; }
.main-nav li{ position:relative; }
.main-nav a{
  font-family:var(--font-display); font-size:.92rem; font-weight:600; color:var(--ink); padding:8px 0;
}
.main-nav a:hover{ color:var(--red); }
.main-nav .sub-menu{
  display:none; position:absolute; top:100%; left:0; background:#fff; min-width:230px;
  box-shadow:0 18px 36px rgba(11,61,145,.14); padding:6px 0; border-top:2px solid var(--red);
}
.main-nav li:hover > .sub-menu{ display:block; }
.main-nav .sub-menu a{ display:block; padding:11px 20px; font-weight:500; font-size:.88rem; }
.main-nav .sub-menu a:hover{ background:var(--paper-dim); }
.header-cta{ display:flex; align-items:center; gap:18px; }
.header-cta .btn{ padding:12px 24px; font-size:.88rem; }
.menu-toggle{ display:none; background:none; border:none; font-size:1.6rem; cursor:pointer; color:var(--ink); }

@media (max-width:900px){
  .main-nav{ display:none; width:100%; }
  .main-nav.is-open{ display:block; }
  .main-nav ul{ flex-direction:column; align-items:flex-start; gap:0; }
  .main-nav li{ width:100%; border-top:1px solid var(--line); }
  .main-nav a{ display:block; padding:13px 0; }
  .main-nav .sub-menu{ position:static; box-shadow:none; display:block; border-top:none; padding-left:14px; }
  .site-header .container{ flex-wrap:wrap; }
  .menu-toggle{ display:block; }
  .header-cta .btn{ display:none; }
}

/* ==========================================================================
   8. Hero — blueprint grid on brand-blue field
   ========================================================================== */
.hero{
  position:relative; overflow:hidden; color:#fff; padding:100px 0 0;
  background:
    linear-gradient(180deg, var(--blue-deep) 0%, var(--blue) 55%, var(--blue-mid) 100%);
}
.hero::before{
  content:""; position:absolute; inset:0;
  background-image:
    repeating-linear-gradient(0deg, var(--line-dark) 0 1px, transparent 1px 64px),
    repeating-linear-gradient(90deg, var(--line-dark) 0 1px, transparent 1px 64px);
  mask-image:radial-gradient(ellipse 90% 70% at 30% 20%, black 40%, transparent 85%);
  pointer-events:none;
}
.hero::after{
  content:""; position:absolute; right:-160px; top:-160px; width:520px; height:520px; border-radius:50%;
  background:radial-gradient(circle, rgba(237,28,36,.22), transparent 70%); pointer-events:none;
}
.hero .container{ position:relative; display:grid; grid-template-columns:1.15fr .85fr; gap:52px; align-items:end; padding-bottom:64px; }
.hero h1{ color:#fff; font-size:clamp(2.2rem,4vw,3.3rem); margin-bottom:.35em; max-width:14ch; }
.hero p{ color:#C7D2E5; font-size:1.08rem; max-width:46ch; }
.hero-actions{ margin-top:30px; display:flex; gap:14px; flex-wrap:wrap; }

@keyframes heroRise{ from{ opacity:0; transform:translateY(22px); } to{ opacity:1; transform:none; } }
.hero-copy{ animation:heroRise .7s var(--ease) both; }
.quote-panel{ animation:heroRise .7s var(--ease) .15s both; }
@media (prefers-reduced-motion:reduce){ .hero-copy, .quote-panel{ animation:none; } }

.quote-panel{
  background:#fff; padding:28px; color:var(--ink); position:relative; box-shadow:0 24px 60px rgba(0,0,0,.28);
  border-top:3px solid var(--red);
}
.quote-panel h3{ font-size:1.05rem; margin-bottom:16px; }
.quote-panel select, .quote-panel input{
  width:100%; padding:13px 14px; margin-bottom:12px; border:1px solid var(--line); border-radius:var(--radius);
  font-family:var(--font-body); font-size:.94rem; background:var(--paper-dim);
}
.quote-panel .btn{ width:100%; justify-content:center; }

@media (max-width:860px){ .hero .container{ grid-template-columns:1fr; padding-bottom:48px; } }

/* Stat strip — spec-sheet style, straddles hero bottom edge */
.stat-strip{ position:relative; z-index:2; }
.stat-strip .container{ padding:0 28px; }
.stat-grid{
  display:grid; grid-template-columns:repeat(4,1fr); background:var(--ink); color:#fff;
  transform:translateY(-1px);
}
.stat-cell{ padding:26px 24px; border-right:1px solid rgba(255,255,255,.1); }
.stat-cell:last-child{ border-right:none; }
.stat-cell b{ display:block; font-family:var(--font-display); font-size:1.9rem; color:#fff; }
.stat-cell span{ font-family:var(--font-mono); font-size:.72rem; text-transform:uppercase; letter-spacing:.08em; color:#9BA8BE; }
@media (max-width:760px){ .stat-grid{ grid-template-columns:repeat(2,1fr); } .stat-cell{ border-bottom:1px solid rgba(255,255,255,.1); } }

/* ==========================================================================
   9. Section scaffolding
   ========================================================================== */
section{ padding:72px 0; }
.section-off{ background:var(--paper-dim); }
@media (max-width:640px){
  section{ padding:56px 0; }
  .page-hero{ padding:44px 0; }
  .hero{ padding-top:76px; }
  .cta-band{ padding:32px 24px; text-align:center; justify-content:center; }
  .cta-band > div{ width:100%; }
  .newsletter .container{ text-align:center; justify-content:center; }
  .section-head{ margin-bottom:36px; }
}
.section-industrial{
  position:relative; background:#fff;
  background-image:
    repeating-linear-gradient(0deg, var(--line) 0 1px, transparent 1px 44px),
    repeating-linear-gradient(90deg, var(--line) 0 1px, transparent 1px 44px);
}
.section-industrial::before{
  content:""; position:absolute; inset:0; background:#fff;
  mask-image:radial-gradient(ellipse 78% 85% at 50% 45%, black 35%, transparent 88%);
  pointer-events:none;
}
.section-industrial .container{ position:relative; z-index:1; }
.section-head{ max-width:660px; margin:0 auto 52px; text-align:center; }
.section-head h2{ font-size:clamp(1.7rem,3vw,2.35rem); }
.section-head.align-left{ margin:0 0 48px; text-align:left; }
.hr-line{ height:1px; background:var(--line); border:none; margin:0; }

/* ==========================================================================
   10. Cards
   ========================================================================== */
.grid-4{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border:1px solid var(--line); }
.grid-3{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line); }
.grid-2{ display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--line); border:1px solid var(--line); }
@media (max-width:980px){ .grid-4{ grid-template-columns:repeat(2,1fr);} .grid-3{ grid-template-columns:repeat(2,1fr);} }
@media (max-width:600px){ .grid-4, .grid-3, .grid-2{ grid-template-columns:1fr; } }

.card{
  background:#fff; position:relative; overflow:hidden; display:flex; flex-direction:column;
  transition:box-shadow .25s var(--ease), transform .25s var(--ease);
}
.card::after{
  content:""; position:absolute; top:0; left:0; right:0; height:3px; background:var(--red);
  transform:scaleX(0); transform-origin:left; transition:transform .3s var(--ease);
}
.card:hover{ transform:translateY(-4px); box-shadow:0 18px 36px rgba(11,61,145,.16), inset 0 0 0 1px var(--red); z-index:1; }
.card:hover::after{ transform:scaleX(1); }
.card img{ aspect-ratio:4/3; object-fit:cover; width:100%; transition:transform .4s var(--ease); }
.card:hover img{ transform:scale(1.04); }
.card-body{ padding:22px 24px 26px; display:flex; flex-direction:column; flex:1; }
.card-body h3{ font-size:1.1rem; margin-bottom:.4em; min-height:2.5em; display:-webkit-box; -webkit-line-clamp:2; line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.card-body p{
  font-size:.9rem; margin-bottom:12px; flex:1;
  display:-webkit-box; -webkit-line-clamp:3; line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
}
.card-link{ font-family:var(--font-mono); text-transform:uppercase; font-size:.74rem; color:var(--red); font-weight:600; letter-spacing:.06em; margin-top:auto; }

/* Category subheadings on the Products page */
.category-block{ margin-bottom:56px; }
.category-block:last-child{ margin-bottom:0; }
.category-heading{
  font-size:1.15rem; margin-bottom:20px; padding-bottom:10px; border-bottom:2px solid var(--red);
  display:inline-block;
}

/* Why us / features */
.feature-row{ display:flex; gap:16px; margin-bottom:22px; align-items:flex-start; }
.feature-row .mono-tag{ flex:none; width:38px; padding-top:.2em; }
.feature-row h4{ font-size:1rem; margin:0; }
.about-grid{ display:grid; grid-template-columns:.9fr 1.1fr; gap:60px; align-items:center; }
@media (max-width:860px){ .about-grid{ grid-template-columns:1fr; } }
.about-media{ position:relative; padding:14px; }
.stat-badge{
  position:absolute; bottom:-1px; left:-1px; background:var(--ink); color:#fff;
  padding:18px 22px; text-align:left; z-index:3;
}
.stat-badge b{ display:block; font-family:var(--font-display); font-size:1.8rem; color:var(--red); }
.stat-badge span{ font-family:var(--font-mono); font-size:.68rem; text-transform:uppercase; letter-spacing:.07em; color:#B9C2D1; }

/* Certification strip */
.cert-strip{ display:flex; flex-wrap:wrap; gap:14px; margin-top:28px; }
.cert-pill{
  font-family:var(--font-mono); font-size:.72rem; letter-spacing:.06em; text-transform:uppercase;
  border:1px solid var(--line); padding:8px 14px; color:var(--steel); display:inline-flex; align-items:center; gap:8px;
  margin-bottom:14px;
}
.cert-pill::before{ content:"✓"; color:var(--red); font-weight:700; }

/* Products showcase (full grid) */
.product-tile{ position:relative; overflow:hidden; background:#fff; }
.product-tile img{ aspect-ratio:4/3; object-fit:cover; width:100%; transition:transform .4s var(--ease); }
.product-tile:hover img{ transform:scale(1.05); }
.product-tile-overlay{
  position:absolute; inset:0; background:linear-gradient(to top, rgba(11,20,31,.94) 0%, rgba(11,20,31,.1) 55%, transparent 80%);
  display:flex; flex-direction:column; justify-content:flex-end; padding:20px;
}
.product-tile-overlay .tag{ color:var(--red); font-family:var(--font-mono); text-transform:uppercase; font-size:.68rem; letter-spacing:.1em; }
.product-tile-overlay h3{ color:#fff; margin:4px 0 0; font-size:1.15rem; }

/* Product slider — native scroll-snap carousel. Swipes smoothly on
   touch devices with zero JS required for that part; prev/next
   buttons (main.js) just call scrollBy for desktop/mouse users. */
.slider-nav{ display:flex; gap:10px; flex:none; }
.slider-btn{
  width:44px; height:44px; border:1px solid var(--line); background:#fff; color:var(--ink);
  font-size:1.1rem; cursor:pointer; transition:background .2s var(--ease), color .2s var(--ease), border-color .2s var(--ease);
}
.slider-btn:hover{ background:var(--red); border-color:var(--red); color:#fff; }
.slider-track{
  display:flex; gap:1px; overflow-x:auto; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch;
  background:var(--line); border:1px solid var(--line);
  scrollbar-width:none;
}
.slider-track::-webkit-scrollbar{ display:none; }
.slider-item{ flex:0 0 33.333%; scroll-snap-align:start; background:#fff; }
.slider-item .product-tile{ height:100%; }
@media (max-width:980px){ .slider-item{ flex:0 0 50%; } }
@media (max-width:640px){ .slider-item{ flex:0 0 85%; } }

/* Testimonials */
.testimonial-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--line); border:1px solid var(--line); }
@media (max-width:780px){ .testimonial-grid{ grid-template-columns:1fr; } }
.testimonial{ background:#fff; padding:32px; position:relative; }
.testimonial::before{ content:"“"; font-family:var(--font-display); font-size:3rem; color:var(--line); position:absolute; top:12px; left:20px; line-height:1; }
.testimonial p{ color:var(--ink); position:relative; margin-bottom:18px; padding-top:8px; }
.testimonial-author{ font-family:var(--font-display); color:var(--blue); font-weight:600; font-size:.95rem; }
.testimonial-author span{ display:block; font-family:var(--font-mono); font-weight:400; color:var(--steel-soft); font-size:.75rem; text-transform:uppercase; letter-spacing:.05em; margin-top:2px; }

/* News / media cards */
.news-card{ display:block; color:inherit; }
.news-card img{ margin-bottom:18px; aspect-ratio:16/10; object-fit:cover; transition:transform .4s var(--ease); }
.news-card:hover img{ transform:scale(1.03); }
.news-card h3{ font-size:1.1rem; transition:color .2s var(--ease); }
.news-card:hover h3{ color:var(--red); }
.news-card time{ font-family:var(--font-mono); font-size:.7rem; text-transform:uppercase; letter-spacing:.06em; color:var(--red); }

/* FAQ */
.faq-list{ display:flex; flex-direction:column; max-width:820px; margin:0 auto; }
.faq-item{ border-bottom:1px solid var(--line); }
.faq-item summary{
  font-family:var(--font-display); font-weight:600; color:var(--ink); cursor:pointer; padding:22px 4px;
  display:flex; justify-content:space-between; align-items:center; list-style:none; font-size:1rem;
}
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-item summary::after{ content:"+"; font-family:var(--font-mono); color:var(--red); font-size:1.3rem; }
.faq-item[open] summary::after{ content:"−"; }
.faq-item p{ padding:0 4px 22px; margin:0; max-width:70ch; }

/* Contact / CTA band */
.cta-band{
  background:var(--ink); color:#fff; padding:52px; display:flex; align-items:center; justify-content:space-between;
  flex-wrap:wrap; gap:24px;
}
.cta-band h2{ color:#fff; margin:0; font-size:1.6rem; }
.cta-band p{ color:#B9C2D1; margin:6px 0 0; }

.contact-section{ background:var(--blue-deep); color:#dfe4ec; position:relative; overflow:hidden; }
.contact-section::before{
  content:""; position:absolute; inset:0;
  background-image:
    repeating-linear-gradient(0deg, var(--line-dark) 0 1px, transparent 1px 64px),
    repeating-linear-gradient(90deg, var(--line-dark) 0 1px, transparent 1px 64px);
  mask-image:radial-gradient(ellipse 70% 60% at 80% 30%, black 30%, transparent 80%);
  pointer-events:none;
}
.contact-section .container{ position:relative; }
.contact-section .section-head h2{ color:#fff; }
.contact-wrap{ display:grid; grid-template-columns:1fr 1fr; gap:60px; }
@media (max-width:860px){ .contact-wrap{ grid-template-columns:1fr; } }

/* Contact page: form beside map */
.contact-form-map-grid{ display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:stretch; }
@media (max-width:860px){ .contact-form-map-grid{ grid-template-columns:1fr; } }
.contact-map-frame{ min-height:420px; position:relative; }
.contact-map-frame iframe{ position:absolute; inset:0; }
.contact-form input, .contact-form select, .contact-form textarea{
  width:100%; padding:14px 14px; margin-bottom:14px; border-radius:var(--radius); border:1px solid #29407A;
  background:rgba(255,255,255,.06); color:#fff; font-family:var(--font-body);
}
.contact-form ::placeholder{ color:#93A2C2; }
.contact-info-row{ display:flex; gap:16px; margin-bottom:26px; align-items:flex-start; }
.contact-info-row .mono-tag{ flex:none; width:38px; padding-top:.2em; color:var(--red); }
.contact-info-row h4{ color:#fff; margin-bottom:.25em; font-size:1rem; font-family:var(--font-display); }
.contact-info-row p{ color:#A9B4CC; margin:0; font-size:.92rem; }

/* Newsletter */
.newsletter{ background:var(--red); color:#fff; }
.newsletter .container{ display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap; padding-top:32px; padding-bottom:32px; }
.newsletter h3{ color:#fff; margin:0; font-size:1.15rem; }
.newsletter form{ display:flex; gap:10px; flex-wrap:wrap; }
.newsletter input{ padding:13px 16px; border-radius:var(--radius); border:none; min-width:260px; }
.newsletter .btn{ background:var(--ink); }
.newsletter .btn:hover{ background:#000; }

/* ==========================================================================
   11. Footer
   ========================================================================== */
.site-footer{ background:var(--ink); color:#8E99AD; padding-top:68px; }
.footer-grid{ display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:48px; padding-bottom:44px; border-bottom:1px solid #232E3F; }
@media (max-width:780px){ .footer-grid{ grid-template-columns:1fr; } }
.footer-grid h4{ color:#fff; font-family:var(--font-mono); font-size:.82rem; text-transform:uppercase; letter-spacing:.08em; margin-bottom:20px; }
.footer-grid img{ max-height:42px; margin-bottom:16px; }
.footer-grid ul li{ margin-bottom:11px; font-size:.92rem; }
.footer-grid a:hover{ color:var(--red); }
.footer-social{ display:flex; gap:10px; margin-top:18px; }
.footer-social a{ width:32px; height:32px; border:1px solid #29354A; display:flex; align-items:center; justify-content:center; font-size:.78rem; }
.footer-bottom{ display:flex; justify-content:space-between; align-items:center; padding:22px 0; font-size:.82rem; flex-wrap:wrap; gap:10px; font-family:var(--font-mono); }

/* WhatsApp float */
.whatsapp-float{
  position:fixed; bottom:26px; right:26px; width:56px; height:56px; background:#25D366; border-radius:50%;
  display:flex; align-items:center; justify-content:center; color:#fff; font-size:1.6rem;
  box-shadow:0 10px 24px rgba(0,0,0,.25); z-index:200;
}

/* Mobile sticky Call/WhatsApp bar — hidden on desktop, replaces the
   floating round button below 900px so it doesn't sit on top of it. */
.mobile-cta-bar{ display:none; }
@media (max-width:900px){
  .whatsapp-float{ display:none; }
  .mobile-cta-bar{
    display:flex; position:fixed; left:0; right:0; bottom:0; z-index:250;
    box-shadow:0 -6px 20px rgba(0,0,0,.15);
  }
  .mobile-cta-bar a{
    flex:1; display:flex; align-items:center; justify-content:center; gap:8px;
    padding:15px 12px; font-family:var(--font-display); font-weight:600; font-size:.92rem; color:#fff;
  }
  .mobile-cta-call{ background:var(--ink); }
  .mobile-cta-whatsapp{ background:#25D366; }
  /* keep content from being hidden behind the fixed bar */
  body{ padding-bottom:54px; }
}

/* Inner page hero (used by page.php for pages added later) */
.page-hero{
  background:linear-gradient(180deg, var(--blue-deep), var(--blue)); color:#fff; padding:64px 0; text-align:center;
  position:relative; overflow:hidden;
}
.page-hero::before{
  content:""; position:absolute; inset:0;
  background-image:
    repeating-linear-gradient(0deg, var(--line-dark) 0 1px, transparent 1px 64px),
    repeating-linear-gradient(90deg, var(--line-dark) 0 1px, transparent 1px 64px);
  mask-image:radial-gradient(ellipse 80% 70% at 50% 0%, black 40%, transparent 85%);
}
.page-hero .container{ position:relative; }
.page-hero h1{ color:#fff; margin-bottom:.2em; }
.page-hero .breadcrumb{ font-family:var(--font-mono); color:#A9B4CC; font-size:.82rem; text-transform:uppercase; letter-spacing:.04em; }
.page-hero .breadcrumb a{ color:var(--red); }

.entry-content{ max-width:820px; margin:0 auto; padding:72px 28px; }
.entry-content h2{ margin-top:1.4em; }
.entry-content img{ margin:1em 0; }
.entry-content ul{ list-style:disc; padding-left:1.4em; margin-bottom:1em; }
.entry-content ul li{ margin-bottom:.4em; color:var(--steel); }

/* Blog list */
.blog-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line); padding:0; margin:64px 0; }
@media (max-width:980px){ .blog-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:640px){ .blog-grid{ grid-template-columns:1fr; } }
.blog-card{ background:#fff; }
.blog-card img{ aspect-ratio:16/10; object-fit:cover; }
.blog-card .card-body time{ font-family:var(--font-mono); font-size:.72rem; text-transform:uppercase; letter-spacing:.06em; color:var(--red); }

/* ==========================================================================
   HOMEPAGE V2 — cloned layout (rounded pills / colored category cards)
   ========================================================================== */
:root{
  --blue-light:#9DC4FF;
  --cat-thermal-a:#0B3D91; --cat-thermal-b:#123B87;
  --cat-food-a:#C2410C; --cat-food-b:#9A3412;
  --cat-green-a:#15803D; --cat-green-b:#14532D;
  --cat-metal-a:#7C2D12; --cat-metal-b:#431407;
  --cat-process-a:#334155; --cat-process-b:#1E293B;
}

/* Pill buttons */
.btn-pill{
  display:inline-flex; align-items:center; gap:.5em; font-family:var(--font-display); font-weight:600;
  font-size:.95rem; padding:14px 28px; border-radius:999px; border:2px solid transparent; cursor:pointer;
  transition:background .2s var(--ease), transform .2s var(--ease), border-color .2s var(--ease), color .2s var(--ease);
}
.btn-pill:hover{ transform:translateY(-1px); }
.btn-pill-red{ background:var(--red); color:#fff; }
.btn-pill-red:hover{ background:var(--red-deep); }
.btn-pill-outline{ background:rgba(255,255,255,.06); border-color:rgba(255,255,255,.5); color:#fff; }
.btn-pill-outline:hover{ background:rgba(255,255,255,.14); border-color:#fff; }
.btn-pill-outline-blue{ background:#fff; border-color:var(--blue); color:var(--blue); }
.btn-pill-outline-blue:hover{ background:var(--paper-dim); }
.btn-pill-white{ background:#fff; color:var(--red); }
.btn-pill-white:hover{ background:#f2f2f2; }
.btn-pill-white-outline{ background:transparent; border-color:rgba(255,255,255,.7); color:#fff; }
.btn-pill-white-outline:hover{ background:rgba(255,255,255,.14); }

/* Hero v2 */
.hero-v2{ position:relative; background-size:cover; background-position:center; padding:130px 0 60px; color:#fff; overflow:hidden; }
.hero-slider{ position:absolute; inset:0; }
.hero-slide{
  position:absolute; inset:0; background-size:cover; background-position:center;
  opacity:0; transition:opacity 1.4s ease-in-out;
}
.hero-slide.is-active{ opacity:1; }
.hero-v2-overlay{ position:absolute; inset:0; background:linear-gradient(100deg, rgba(6,20,45,.92) 0%, rgba(6,20,45,.78) 45%, rgba(6,20,45,.35) 100%); }
.hero-v2-inner{ position:relative; max-width:760px; }
.hero-badge{
  display:inline-block; font-family:var(--font-mono); text-transform:uppercase; letter-spacing:.1em; font-size:.74rem;
  font-weight:600; color:#ffb4b4; background:rgba(237,28,36,.16); border:1px solid rgba(237,28,36,.4);
  padding:9px 20px; border-radius:999px; margin-bottom:22px;
}
.hero-v2 h1{ color:#fff; font-size:clamp(2.1rem,4.4vw,3.4rem); line-height:1.1; margin-bottom:.4em; }
.hero-v2 h1 .accent-blue{ color:var(--blue-light); }
.hero-v2 p{ color:#D7DEEC; font-size:1.05rem; max-width:52ch; }
.hero-v2-actions{ display:flex; gap:14px; flex-wrap:wrap; margin-top:28px; }
.hero-v2-stats{ display:flex; gap:44px; flex-wrap:wrap; margin-top:48px; }
.hero-v2-stats b{ display:block; font-family:var(--font-display); font-size:1.7rem; color:#fff; }
.hero-v2-stats span{ font-family:var(--font-mono); font-size:.76rem; text-transform:uppercase; letter-spacing:.05em; color:#A9B4CC; }
.hero-scroll-dot{
  position:absolute; left:50%; bottom:22px; transform:translateX(-50%); width:34px; height:34px; border-radius:50%;
  border:1px solid rgba(255,255,255,.4); display:flex; align-items:center; justify-content:center; color:#fff; font-size:.8rem;
}

/* About v2 */
.about-v2-grid{ display:grid; grid-template-columns:1fr 1.1fr; gap:56px; align-items:center; }
@media (max-width:860px){ .about-v2-grid{ grid-template-columns:1fr; } }
.video-thumb{
  position:relative; display:block; width:100%; aspect-ratio:4/3; background:var(--ink);
  border:none; border-radius:14px; overflow:hidden; cursor:pointer; padding:0; transition:transform .3s var(--ease), box-shadow .3s var(--ease);
}
.video-thumb:hover{ transform:translateY(-3px); box-shadow:0 18px 34px rgba(11,20,31,.22); }
.video-thumb-media{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0;
  transition:transform .5s var(--ease);
}
.video-thumb:hover .video-thumb-media{ transform:scale(1.05); }
.video-thumb::after{ content:""; position:absolute; inset:0; background:rgba(6,20,45,.28); z-index:1; transition:background .25s var(--ease); }
.video-thumb:hover::after{ background:rgba(6,20,45,.1); }
.video-thumb-live .video-thumb-media{ transform:none; }
.video-thumb-live:hover .video-thumb-media{ transform:scale(1.02); }
.play-circle{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:64px; height:64px; border-radius:50%;
  background:rgba(255,255,255,.92); color:var(--red); display:flex; align-items:center; justify-content:center;
  font-size:1.2rem; z-index:2; box-shadow:0 8px 20px rgba(0,0,0,.3); transition:transform .25s var(--ease), background .25s var(--ease);
}
.video-thumb:hover .play-circle{ transform:translate(-50%,-50%) scale(1.1); background:#fff; }
.play-circle-sm{ width:40px; height:40px; font-size:.85rem; }
.video-thumb-label{
  position:absolute; left:16px; bottom:16px; z-index:2; background:var(--red); color:#fff; font-family:var(--font-display);
  font-weight:600; font-size:.85rem; padding:9px 16px; border-radius:999px;
}
.video-thumb-sm .video-thumb-label{ left:10px; bottom:10px; font-size:.72rem; padding:5px 11px; background:rgba(16,21,31,.85); }
.check-list{ list-style:none; margin:24px 0; padding:0; }
.check-list li{ display:flex; gap:14px; margin-bottom:16px; align-items:flex-start; }
.check-dot{
  flex:none; width:24px; height:24px; border-radius:50%; background:var(--blue); color:#fff; font-size:.75rem;
  display:flex; align-items:center; justify-content:center; margin-top:2px;
}
.check-list p, .check-list div{ color:var(--steel); margin:0; }
.check-list strong{ color:var(--ink); }

/* Filter bar */
.filter-bar{ display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin:0 0 44px; }
.filter-pill{
  font-family:var(--font-display); font-weight:600; font-size:.85rem; padding:10px 20px; border-radius:999px;
  border:1px solid var(--line); background:#fff; color:var(--steel); cursor:pointer; transition:.2s var(--ease);
}
.filter-pill.is-active, .filter-pill:hover{ background:var(--blue); border-color:var(--blue); color:#fff; }

/* Product cards v2 */
.pcard-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
@media (max-width:980px){ .pcard-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:600px){ .pcard-grid{ grid-template-columns:1fr; } }
.pcard{ background:#fff; border-radius:14px; overflow:hidden; box-shadow:0 4px 16px rgba(11,20,31,.06); transition:transform .25s var(--ease), box-shadow .25s var(--ease); display:flex; flex-direction:column; }
.pcard:hover{ transform:translateY(-4px); box-shadow:0 16px 32px rgba(11,20,31,.14); }
.pcard-head{ position:relative; height:96px; display:flex; align-items:center; justify-content:center; }
.pcard-head-thermal{ background:linear-gradient(135deg,var(--cat-thermal-a),var(--cat-thermal-b)); }
.pcard-head-food{ background:linear-gradient(135deg,var(--cat-food-a),var(--cat-food-b)); }
.pcard-head-green{ background:linear-gradient(135deg,var(--cat-green-a),var(--cat-green-b)); }
.pcard-head-metal{ background:linear-gradient(135deg,var(--cat-metal-a),var(--cat-metal-b)); }
.pcard-head-process{ background:linear-gradient(135deg,var(--cat-process-a),var(--cat-process-b)); }
.pcard-head .pcard-icon{ font-size:2rem; }
.pcard-badge{
  position:absolute; top:10px; right:10px; background:rgba(255,255,255,.22); color:#fff; font-family:var(--font-mono);
  font-size:.62rem; text-transform:uppercase; letter-spacing:.06em; padding:4px 10px; border-radius:999px;
}
.pcard .card-body{ padding:18px 20px 20px; }
.pcard .card-body h3{ font-size:1rem; min-height:2.4em; }
.pcard .card-body p{ font-size:.85rem; -webkit-line-clamp:3; }
.pcard[data-hide]{ display:none; }

/* Video grid */
.video-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
@media (max-width:860px){ .video-grid{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:600px){ .video-grid{ grid-template-columns:repeat(2,1fr); } }
.video-thumb-sm{ aspect-ratio:1/1; border-radius:10px; background-color:var(--ink); }

/* Video lightbox */
.video-lightbox{
  display:none; position:fixed; inset:0; z-index:999; background:rgba(6,10,20,.92); align-items:center; justify-content:center; padding:24px;
}
.video-lightbox.is-open{ display:flex; }
.video-lightbox video{ max-width:960px; width:100%; max-height:82vh; border-radius:8px; background:#000; }
.video-lightbox-close{
  position:absolute; top:22px; right:26px; width:44px; height:44px; border-radius:50%; background:rgba(255,255,255,.12);
  color:#fff; border:none; font-size:1.3rem; cursor:pointer;
}

/* Feature 4-card (dark) */
.feature4-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
@media (max-width:860px){ .feature4-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:500px){ .feature4-grid{ grid-template-columns:1fr; } }
.feature4-card{ background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.1); border-radius:12px; padding:22px; }
.feature4-icon{ font-size:1.5rem; display:block; margin-bottom:14px; }
.feature4-card h4{ color:#fff; font-size:1rem; margin-bottom:.4em; }
.feature4-card p{ color:#A9B4CC; font-size:.86rem; margin:0; }

/* Industries grid */
.industry-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
@media (max-width:760px){ .industry-grid{ grid-template-columns:repeat(2,1fr); } }
.industry-card{
  background:#fff; border:1px solid var(--line); border-radius:10px; padding:16px 18px; display:flex; align-items:center;
  gap:12px; font-family:var(--font-display); font-weight:600; font-size:.92rem; color:var(--ink);
}
.industry-card span{ font-size:1.3rem; }

/* Testimonial carousel */
.testi-slider{ position:relative; min-height:180px; }
.testi-slide{ display:none; }
.testi-slide.is-active{ display:block; }
.testi-quote{ font-size:1.15rem; color:var(--ink); font-style:italic; }
.testi-dots{ display:flex; gap:8px; justify-content:center; margin-top:20px; }
.testi-dot{ width:9px; height:9px; border-radius:50%; background:var(--line); border:none; cursor:pointer; padding:0; }
.testi-dot.is-active{ background:var(--red); width:22px; border-radius:5px; transition:width .2s var(--ease); }

/* CTA band v2 */
.cta-band-v2{ background:var(--red); border-radius:14px; padding:36px 44px; display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap; }
.cta-band-v2 h2{ color:#fff; margin:0; font-size:1.3rem; }
.cta-band-v2 p{ color:#FFD9D9; margin:4px 0 0; font-size:.92rem; }
.cta-band-v2-actions{ display:flex; gap:12px; flex-wrap:wrap; }

/* Back to top */
.back-to-top{
  position:fixed; right:26px; bottom:92px; width:44px; height:44px; border-radius:50%; background:var(--blue); color:#fff;
  border:none; display:none; align-items:center; justify-content:center; font-size:1rem; cursor:pointer; z-index:190;
  box-shadow:0 8px 20px rgba(0,0,0,.25);
}
.back-to-top.is-visible{ display:flex; }
@media (max-width:900px){ .back-to-top{ bottom:150px; } }

/* ==========================================================================
   Utility classes — replace repeated inline styles for cleaner markup
   ========================================================================== */
.section-dark{ background:var(--ink); }
.section-dark h2{ color:#fff; }
.u-max-900{ max-width:900px; }
.u-max-760-center{ max-width:760px; text-align:center; }
.u-center{ justify-content:center; }
.u-no-pad-top{ padding-top:0; }
.u-no-pad-bottom{ padding-bottom:0; }
.u-mb-0{ margin-bottom:0; }
.u-mt-neg20{ margin-top:-20px; }
.u-full-btn{ width:100%; justify-content:center; }
.u-text-lead{ font-size:1.1rem; color:var(--ink); }
.u-actions-top{ margin-top:28px; }
.u-pad-top-64{ padding-top:64px; }
.u-mb-36{ margin-bottom:36px; }
.u-fs-1rem{ font-size:1rem; }
.mono-tag-accent{ color:var(--red); }
.u-max-full{ max-width:100%; }
.u-max-640-center{ max-width:640px; margin:0 auto; }
.u-iframe-reset{ border:0; display:block; }
.pagination-nav{ display:flex; gap:10px; justify-content:center; margin-top:20px; font-family:var(--font-mono); font-size:.85rem; }
.u-empty-state{ text-align:center; padding:40px 0; }
.u-benefit-lead{ max-width:760px; margin:-20px auto 32px; text-align:center; color:var(--steel); }
.u-max-640-center-text{ max-width:640px; text-align:center; margin:0 auto; }
.u-fs-105{ font-size:1.05rem; }
.u-btn-row-center{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; margin-top:28px; }
