/*
Theme Name: Unique Cooling Experts
Theme URI: https://uniquecoolingexperts.com/
Description: Unique Cooling Experts - HVAC, Cold Room & Air Conditioning WordPress Theme. A professional theme for air conditioning contractors, cold room installation, ventilation and refrigeration services in Kenya.
Version: 1.0
Author: Unique Cooling Experts
Author URI: https://uniquecoolingexperts.com/
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: unique-cooling-experts
Tags: custom-background, custom-logo, featured-images, theme-options, translation-ready, two-columns

  HVAC, Cold Room Installation, Air Conditioning, Refrigeration, Ventilation
*/

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=IBM+Plex+Mono:wght@400;500&display=swap');

:root{
  --white:#FFFFFF;
  --paper:#F7F9FA;
  --ink:#0B1F2A;
  --slate:#5B6B74;
  --line:#E3E9EC;
  --teal:#0C8599;
  --teal-deep:#086573;
  --ice:#E6F7F9;
  --amber:#F2A93C;
  --amber-deep:#D98F1E;
  --radius:6px;
}
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;overflow-x:hidden;}
body{
  background:var(--white);
  color:var(--ink);
  font-family:'Inter',sans-serif;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
.mono{font-family:'IBM Plex Mono',monospace;}
h1,h2,h3{
  font-family:'Inter',sans-serif;
  letter-spacing:-0.01em;
  line-height:1.08;
  color:var(--ink);
}
.wrap{max-width:1180px;margin:0 auto;padding:0 32px;}
a{color:inherit;text-decoration:none;}
img,svg{display:block;max-width:100%;height:auto;}
.container-fluid{width:100%;}

/* ---- reveal on scroll ---- */
.reveal{opacity:0;transform:translateY(18px);transition:opacity .6s ease, transform .6s ease;}
.reveal.in,.reveal.visible{opacity:1;transform:translateY(0);}

/* ---- top bar / header ---- */
.topbar{
  position:sticky;top:0;z-index:50;
  background:rgba(255,255,255,0.92);
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
  padding:12px 0;
  transition:box-shadow .2s ease, padding .2s ease;
}
.topbar.scrolled{box-shadow:0 4px 20px rgba(11,31,42,0.06);padding:10px 0;}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;}
.wordmark{display:flex;align-items:center;gap:10px;font-family:'Inter',sans-serif;font-weight:700;font-size:17px;letter-spacing:0.01em;}
.wordmark .dot{width:9px;height:9px;border-radius:50%;background:var(--teal);position:relative;}
.wordmark .dot::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:1px solid var(--teal);opacity:.4;animation:pulse 2.4s ease-out infinite;}
@keyframes pulse{0%{transform:scale(.6);opacity:.6;}100%{transform:scale(1.8);opacity:0;}}
.topbar-right{display:flex;align-items:center;gap:22px;}
.topbar-tag{font-size:12px;color:var(--slate);letter-spacing:0.1em;text-transform:uppercase;display:none;}
@media(min-width:700px){.topbar-tag{display:block;}}

.cspt-main-logo{max-height:120px;width:auto;height:auto;}
.footer-logo{max-height:48px;width:auto;height:auto;}

/* ---- navigation ---- */
.main-nav ul{list-style:none;display:flex;align-items:center;gap:6px;}
.main-nav li{position:relative;}
.main-nav a{color:var(--ink);font-family:'Inter',sans-serif;font-size:14px;font-weight:500;padding:6px 12px;border-radius:6px;transition:all .18s ease;}
.main-nav a:hover{color:var(--teal);}
.main-nav .has-children > a::after{
  content:"";display:inline-block;margin-left:4px;
  border:3px solid transparent;border-top-color:var(--slate);
  transform:rotate(0);transition:transform .2s ease;
}
.main-nav .has-children:hover > a::after{transform:rotate(180deg);border-top-color:var(--teal);}
.sub-menu{
  position:absolute;top:100%;left:0;background:var(--white);
  border:1px solid var(--line);border-radius:10px;
  padding:8px 0;min-width:180px;box-shadow:0 12px 40px rgba(11,31,42,0.1);
  opacity:0;visibility:hidden;transform:translateY(6px);transition:all .2s ease;
  z-index:100;
}
.main-nav .has-children:hover .sub-menu{opacity:1;visibility:visible;transform:translateY(0);}
.sub-menu li{width:100%;}
.sub-menu a{padding:8px 16px;font-size:13px;}
.sub-menu a:hover{background:var(--ice);color:var(--teal);}

.menu-toggle{
  display:none;
  background:none;
  border:none;
  color:var(--ink);
  font-size:22px;
  cursor:pointer;
}

/* ---- buttons ---- */
.btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:13px 24px;font-weight:600;font-size:14px;
  border-radius:var(--radius);border:1px solid transparent;
  cursor:pointer;transition:all .18s ease;
  font-family:'Inter',sans-serif;
}
.btn svg{width:14px;height:14px;transition:transform .18s ease;}
.btn-primary{background:var(--amber);color:#20150A;}
.btn-primary:hover{background:var(--amber-deep);transform:translateY(-1px);box-shadow:0 8px 20px rgba(242,169,60,0.35);}
.btn-primary:hover svg{transform:translateX(3px);}
.btn-ghost{border-color:var(--line);color:var(--ink);background:var(--white);}
.btn-ghost:hover{border-color:var(--teal);color:var(--teal);transform:translateY(-1px);}
.btn-ghost:hover svg{transform:translateX(3px);}
.btn-sm{padding:9px 16px;font-size:13px;}
.btn-teal{background:var(--teal);color:#fff;}
.btn-teal:hover{background:var(--teal-deep);transform:translateY(-1px);box-shadow:0 8px 20px rgba(12,133,153,0.28);}

/* ---- eyebrow (shared) ---- */
.eyebrow{
  font-family:'IBM Plex Mono',monospace;
  font-size:12px;letter-spacing:0.16em;text-transform:uppercase;color:var(--teal);
  display:flex;align-items:center;gap:10px;margin-bottom:20px;
}
.eyebrow::before{content:"";width:24px;height:1px;background:var(--teal);}
.cta-row{display:flex;gap:14px;flex-wrap:wrap;}
.trust-row{display:flex;gap:26px;margin-top:30px;flex-wrap:wrap;}
.trust-item{font-size:13px;color:var(--slate);display:flex;align-items:center;gap:8px;}
.trust-item .tick{color:var(--teal);font-family:'IBM Plex Mono',monospace;}

/* ============================================================
   HERO SLIDER - Desktop (16:9 ratio)
   ============================================================ */
.hero-slider{
  position:relative;
  overflow:hidden;
  width:100%;
  min-height:75vh;
  border-bottom:1px solid var(--line);
  background:#0f2a47;
}
.slide{
  position:absolute;
  inset:0;
  opacity:0;
  visibility:hidden;
  transition:opacity .9s ease;
  display:flex;
  align-items:center;
}
.slide.active{
  opacity:1;
  visibility:visible;
  z-index:1;
}
.slide-art{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}
.slide-art svg{
  width:100%;
  height:100%;
  display:block;
}
.slide-art img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
}
.slide-scrim{
  position:absolute;
  inset:0;
  background:linear-gradient(100deg, rgba(15,42,71,0.92) 0%, rgba(15,42,71,0.78) 32%, rgba(15,42,71,0.35) 58%, rgba(15,42,71,0.08) 78%);
}
.slide-content{
  position:relative;
  z-index:2;
  max-width:600px;
  padding:0 32px;
  color:var(--white);
  margin-left:calc((100% - 1180px)/2);
}
@media(max-width:1244px){
  .slide-content{
    margin-left:0;
  }
}
.slide .eyebrow{
  color:var(--ice);
}
.slide .eyebrow::before{
  background:var(--ice);
}
.slide h1{
  font-size:50px;
  font-weight:800;
  margin-bottom:18px;
  color:var(--white);
  line-height:1.06;
}
.slide h1 span{
  color:var(--ice);
}
.slide p.lede{
  font-size:16.5px;
  color:rgba(255,255,255,0.78);
  max-width:480px;
  margin-bottom:30px;
}
.slide .trust-item{
  color:rgba(255,255,255,0.7);
}
.slide .trust-item .tick{
  color:var(--ice);
}

/* ---- index-page-only hero slider font styling ---- */
.front-page .hero-slider .slide h1{
  font-family:'Georgia',serif;
  font-size:56px;
  font-weight:400;
  letter-spacing:-0.02em;
}
.front-page .hero-slider .slide h1 span{
  font-family:inherit;
  color:var(--ice);
}
.front-page .hero-slider .slide p.lede{
  font-family:'Georgia',serif;
  font-size:18px;
  font-style:italic;
  color:rgba(255,255,255,0.82);
}
.front-page .hero-slider .slide .eyebrow{
  font-family:'Inter',sans-serif;
  text-transform:none;
  letter-spacing:0.02em;
}

/* ---- slider controls ---- */
.slider-arrow{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  z-index:5;
  width:46px;
  height:46px;
  border-radius:50%;
  background:rgba(255,255,255,0.1);
  border:1px solid rgba(255,255,255,0.28);
  color:var(--white);
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  backdrop-filter:blur(6px);
  transition:all .2s ease;
}
.slider-arrow:hover{
  background:var(--teal);
  border-color:var(--teal);
}
.slider-arrow svg{
  width:18px;
  height:18px;
}
.slider-arrow.prev{
  left:28px;
}
.slider-arrow.next{
  right:28px;
}
@media(max-width:700px){
  .slider-arrow{
    display:none;
  }
}
.slider-nav{
  position:absolute;
  left:0;
  right:0;
  bottom:28px;
  z-index:5;
  display:flex;
  justify-content:center;
  gap:10px;
}
.slider-dot{
  width:34px;
  height:4px;
  border-radius:2px;
  border:none;
  cursor:pointer;
  background:rgba(255,255,255,0.3);
  padding:0;
  position:relative;
  overflow:hidden;
}
.slider-dot .fill{
  position:absolute;
  inset:0;
  background:var(--ice);
  width:0%;
}
.slider-dot.active .fill{
  width:100%;
  transition:width 6s linear;
}
.slide-counter{
  position:absolute;
  top:28px;
  right:32px;
  z-index:5;
  font-family:'IBM Plex Mono',monospace;
  font-size:12px;
  color:rgba(255,255,255,0.65);
  letter-spacing:0.08em;
}
.slide-counter .cur{
  color:var(--white);
  font-weight:600;
}

/* ============================================================
   MOBILE - 1:1 Square Ratio
   ============================================================ */
@media(max-width:1000px){
  .hero-slider{
    min-height:65vh;
    width:100%;
    position:relative;
    overflow:hidden;
  }
  .slide{
    position:absolute !important;
    top:0 !important;
    left:0 !important;
    right:0 !important;
    bottom:0 !important;
    width:100% !important;
    height:100% !important;
    display:block !important;
    opacity:0;
    visibility:hidden;
    transition:opacity .6s ease;
  }
  .slide.active{
    opacity:1;
    visibility:visible;
    z-index:1;
    display:block !important;
  }
  .slide-art{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
  }
  .slide-art img{
    width:100%;
    height:100%;
    object-fit:contain;
  }
  .slide-art svg{
    width:100%;
    height:100%;
    display:block;
  }
  .slide-scrim{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:linear-gradient(0deg, rgba(15,42,71,0.8) 0%, rgba(15,42,71,0.3) 60%, rgba(15,42,71,0.05) 100%);
  }
  .slide-content{
    position:absolute;
    bottom:40px;
    left:0;
    right:0;
    z-index:2;
    padding:0 20px;
    max-width:100%;
    width:100%;
    margin-left:0;
    text-align:center;
  }
  .slide .trust-row{
    gap:14px;
    margin-top:0;
    justify-content:center;
  }
  .slide .trust-item{
    font-size:13px;
    color:rgba(255,255,255,0.9);
  }
  .slider-nav{
    bottom:100px;
  }
  .slide-counter{
    top:16px;
    right:16px;
    font-size:11px;
  }
  .slider-arrow{
    display:none !important;
  }
}

@media(max-width:600px){
  .hero-slider{
    aspect-ratio:1 / 1;
  }
  .slide-content{
    bottom:30px;
    padding:0 16px;
  }
  .slide .trust-row{
    gap:10px;
    flex-wrap:wrap;
  }
  .slide .trust-item{
    font-size:11px;
  }
  .slider-nav{
    bottom:80px;
  }
  .slider-dot{
    width:24px;
    height:3px;
  }
  .slide-counter{
    top:12px;
    right:12px;
    font-size:10px;
  }
  .slide-scrim{
    background:linear-gradient(0deg, rgba(15,42,71,0.85) 0%, rgba(15,42,71,0.3) 60%, rgba(15,42,71,0.05) 100%);
  }
}

/* ---- sections ---- */
section{padding:80px 0;border-bottom:1px solid var(--line);}
.section-head{max-width:640px;margin-bottom:44px;display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;}
.section-head .eyebrow{margin-bottom:14px;}
.section-head h2{font-size:32px;font-weight:700;}
.section-head p{color:var(--slate);margin-top:12px;font-size:15px;}
.section-cta{flex-shrink:0;}

/* featured images */
.featured-images-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:40px 0;
}
.featured-image-item{
  background:var(--ice);border:1px solid var(--line);border-radius:12px;
  padding:24px;text-align:center;transition:all .2s ease;cursor:default;
}
.featured-image-item:hover{border-color:var(--teal);box-shadow:0 12px 30px rgba(11,31,42,0.07);transform:translateY(-4px);}
.featured-image-placeholder{
  display:flex;flex-direction:column;align-items:center;gap:12px;
}
.featured-image-icon{font-size:48px;opacity:0.6;}
.featured-image-label{
  font-family:'IBM Plex Mono',monospace;font-size:13px;letter-spacing:0.1em;
  text-transform:uppercase;color:var(--slate);font-weight:600;
}

/* services */
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.service-card{
  background:var(--white);border:1px solid var(--line);border-radius:12px;
  padding:30px 26px;transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.service-card:hover{transform:translateY(-6px);box-shadow:0 24px 50px rgba(11,31,42,0.1);border-color:var(--teal);}
.service-card .idx{font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--teal);margin-bottom:16px;}
.service-card h3{font-size:19px;font-weight:700;margin-bottom:12px;}
.service-card p{font-size:14px;color:var(--slate);margin-bottom:20px;}
.service-card .more{font-size:13px;font-weight:600;color:var(--ink);display:inline-flex;align-items:center;gap:6px;}
.service-card .more svg{width:13px;height:13px;transition:transform .2s ease;}
.service-card:hover .more svg{transform:translateX(4px);}

/* products */
.products-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;}
.product-chip{
  border:1px solid var(--line);border-radius:8px;padding:16px 18px;font-size:14px;font-weight:500;
  display:flex;align-items:center;justify-content:space-between;background:var(--white);
  transition:all .2s ease;
}
.product-chip:hover{border-color:var(--teal);background:var(--ice);transform:translateY(-2px);}
.product-chip svg{width:14px;height:14px;color:var(--teal);flex-shrink:0;transition:transform .2s ease;}
.product-chip:hover svg{transform:translateX(3px);}

/* product cards */
.home-cards{grid-template-columns:repeat(2,1fr);}
@media (max-width:700px){ .home-cards{grid-template-columns:1fr;} }
.product-card{
  background:var(--white);border:1px solid var(--line);border-radius:var(--radius);
  padding:24px;display:flex;flex-direction:row;gap:24px;align-items:flex-start;text-align:left;
}
.product-media{flex:0 0 260px;max-width:260px;}
.product-media img{width:100%;height:auto;max-height:240px;object-fit:cover;display:block;border-radius:8px;}
.product-body{flex:1 1 auto;min-width:0;}
.product-categories{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px;}
.product-badge{
  display:inline-block;font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:0.05em;text-transform:uppercase;
  background:var(--ice);color:var(--teal-deep);border:1px solid var(--line);border-radius:999px;padding:5px 12px;
}
.product-title{font-size:18px;font-weight:600;color:var(--ink);margin:0 0 8px;line-height:1.3;}
.product-title-link{display:block;text-decoration:none;color:inherit;}
.product-title-link:hover .product-title{color:var(--teal);}
.product-price{font-size:18px;font-weight:700;color:var(--teal);margin-bottom:12px;}
.product-excerpt{font-size:14.5px;color:var(--slate);line-height:1.6;margin:0 0 12px;}
.product-cat-list{font-size:13px;color:var(--slate);margin-bottom:14px;}
.product-cat-label{font-weight:600;color:var(--ink);margin-right:6px;}
.product-cat-item{display:inline-block;margin:0 8px 4px 0;}
.product-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-start;margin-top:4px;}

/* ============================================================
   SHOP CATALOGUE — clean, borderless 4-column product grid
   Scoped to .shop-grid (used only on shop.php) so the homepage
   cards remain untouched.
   ============================================================ */
.shop-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:48px 32px;
}
.shop-card{
  background:var(--white);
  border:none;
  box-shadow:none;
  border-radius:0;
  padding:0;
  display:flex;
  flex-direction:column;
  text-align:center;
}
.shop-card-media{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  height:280px;
  margin-bottom:20px;
  padding:10px;
}
.shop-card-media img{
  max-width:100%;
  max-height:100%;
  width:auto;
  height:auto;
  object-fit:contain;
  transition:transform .25s ease;
}
.shop-card:hover .shop-card-media img{transform:scale(1.02);}
.shop-card-media:focus-visible{outline:2px solid var(--teal);outline-offset:2px;}
.shop-card-cats{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:6px;
  margin-bottom:10px;
}
.shop-card-cats .product-badge{font-size:10px;padding:4px 10px;}
.shop-card-title{
  font-size:17px;
  font-weight:700;
  color:var(--ink);
  line-height:1.4;
  margin:0 0 10px;
}
.shop-card-title a{color:inherit;text-decoration:none;transition:color .18s ease;}
.shop-card-title a:hover{color:var(--teal);}
.shop-card-title a:focus-visible{outline:2px solid var(--teal);outline-offset:2px;}
.shop-card-price{
  font-size:17px;
  font-weight:500;
  color:var(--slate);
  margin:0 0 18px;
}
.shop-card-actions{
  margin-top:auto;
  display:flex;
  flex-direction:column;
  gap:10px;
  align-items:stretch;
  padding:0 6px;
}
.shop-card-actions .btn{
  width:100%;
  justify-content:center;
  text-transform:uppercase;
  font-weight:700;
  letter-spacing:0.05em;
  border-radius:3px;
  font-size:13px;
}
.btn-cart{background:#8BC34A;color:#fff;border:1px solid #8BC34A;}
.btn-cart:hover{background:#7CB342;border-color:#7CB342;color:#fff;}
.shop-card-actions .btn-whatsapp{background:#20C866;border-color:#20C866;}
.shop-card-actions .btn-whatsapp:hover{background:#1BAF5A;border-color:#1BAF5A;}
.shop-card-actions .btn-whatsapp svg{width:16px;height:16px;flex-shrink:0;}
@media (max-width:1199px){
  .shop-grid{grid-template-columns:repeat(3,1fr);}
}
@media (max-width:860px){
  .shop-grid{grid-template-columns:repeat(2,1fr);gap:36px 20px;}
  .shop-card-media{height:230px;}
}
@media (max-width:480px){
  .shop-grid{grid-template-columns:1fr;gap:40px;}
}

/* ============================================================
   SINGLE PRODUCT — large image left / purchase info right
   ============================================================ */
.product-detail{
  display:grid;
  grid-template-columns:1.05fr 1fr;
  gap:56px;
  align-items:start;
}
.product-detail-media{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:420px;
  padding:20px;
}
.product-detail-media img{
  width:auto;
  height:auto;
  max-width:100%;
  max-height:560px;
  object-fit:contain;
  display:block;
}
.product-detail-body{min-width:0;}
.product-detail-crumb{
  font-family:'IBM Plex Mono',monospace;
  font-size:12px;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:var(--slate);
  margin-bottom:14px;
}
.product-detail-title{
  font-size:34px;
  font-weight:700;
  line-height:1.2;
  margin:0 0 16px;
}
.product-detail-price{
  font-size:24px;
  font-weight:600;
  color:var(--slate);
  margin-bottom:20px;
}
.product-detail-excerpt{
  font-size:15px;
  color:var(--slate);
  line-height:1.8;
  margin-bottom:26px;
}
.product-purchase{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  align-items:stretch;
  margin-bottom:6px;
}
.product-purchase .btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  text-transform:uppercase;
  font-weight:700;
  letter-spacing:0.05em;
  border-radius:3px;
  font-size:13.5px;
  padding:14px 26px;
}
.product-purchase .btn-cart{background:#8BC34A;border-color:#8BC34A;color:#fff;}
.product-purchase .btn-cart:hover{background:#7CB342;border-color:#7CB342;color:#fff;}
.product-purchase .btn-whatsapp{background:#20C866;border-color:#20C866;color:#fff;}
.product-purchase .btn-whatsapp:hover{background:#1BAF5A;border-color:#1BAF5A;}
.product-purchase .btn-whatsapp svg{width:17px;height:17px;flex-shrink:0;}
.qty-box{
  display:inline-flex;
  align-items:stretch;
  border:1px solid var(--line);
  border-radius:3px;
  overflow:hidden;
  background:var(--white);
}
.qty-btn{
  width:44px;
  border:none;
  background:var(--white);
  color:var(--ink);
  font-size:18px;
  line-height:1;
  cursor:pointer;
  transition:background .15s ease;
}
.qty-btn:hover{background:var(--paper);}
.qty-btn:focus-visible{outline:2px solid var(--teal);outline-offset:-2px;}
.qty-input{
  width:56px;
  border:none;
  border-left:1px solid var(--line);
  border-right:1px solid var(--line);
  text-align:center;
  font-family:'Inter',sans-serif;
  font-size:15px;
  color:var(--ink);
  -moz-appearance:textfield;
  appearance:textfield;
}
.qty-input::-webkit-outer-spin-button,
.qty-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
.qty-input:focus{outline:none;}
.product-quote-link{font-size:13.5px;color:var(--slate);margin:16px 0 26px;}
.product-quote-link a{color:var(--teal);text-decoration:underline;}
.product-quote-link a:hover{color:var(--teal-deep);}
.product-meta{
  border-top:1px solid var(--line);
  padding-top:20px;
  display:grid;
  gap:8px;
  font-size:14px;
  color:var(--slate);
}
.product-meta-label{font-weight:600;color:var(--ink);margin-right:6px;}
.product-meta-value .meta-link{color:var(--teal);}
.product-description-section{margin-top:64px;}
.product-description-label{
  font-family:'IBM Plex Mono',monospace;
  font-size:12px;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--slate);
  margin-bottom:14px;
}
.product-description-box{
  background:var(--white);
  border:1px solid var(--line);
  border-radius:6px;
  padding:34px 38px;
  font-size:15px;
  line-height:1.85;
  color:var(--ink);
}
.product-description-box h1,
.product-description-box h2,
.product-description-box h3,
.product-description-box h4{margin:22px 0 10px;}
.product-description-box p{margin-bottom:14px;}
.product-description-box p:last-child{margin-bottom:0;}
.product-description-box ul,
.product-description-box ol{margin:12px 0 16px;padding-left:22px;}
.product-description-box li{margin-bottom:6px;}
.product-description-box img{max-width:100%;height:auto;}
@media (max-width:900px){
  .product-detail{grid-template-columns:1fr;gap:36px;}
  .product-detail-media{min-height:0;padding:8px 0;}
  .product-detail-media img{max-height:420px;}
  .product-detail-title{font-size:28px;}
}
@media (max-width:600px){
  .product-purchase .btn{flex:1 1 100%;}
  .product-description-box{padding:24px 20px;}
}

@media (max-width:700px){
  .product-card{flex-direction:column;}
  .product-media{flex-basis:auto;max-width:100%;}
}
.btn-secondary{background:var(--ice);color:var(--ink);border:1px solid var(--line);}
.btn-secondary:hover{background:var(--teal-deep);color:var(--white);}
.btn-whatsapp{background:#25D36F;color:var(--white);border:1px solid #25D36F;}
.btn-whatsapp:hover{background:#128C7E;border-color:#128C7E;}

/* industries */
.industry-list{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--line);border-left:1px solid var(--line);border-radius:12px;overflow:hidden;}
.industry-item{
  border-right:1px solid var(--line);border-bottom:1px solid var(--line);
  padding:20px 18px;font-size:14px;color:var(--slate);background:var(--white);
  transition:background .2s ease,color .2s ease;
}
.industry-item:hover{background:var(--ice);color:var(--ink);}

/* why choose */
.why-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px 40px;}
.why-item{display:flex;gap:14px;padding:16px 4px;border-bottom:1px solid var(--line);transition:padding-left .2s ease;}
.why-item:hover{padding-left:10px;}
.why-item .check{color:var(--teal);font-family:'IBM Plex Mono',monospace;flex-shrink:0;}
.why-item p{font-size:14.5px;}

/* projects */
.projects-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;}
.project-row{
  background:var(--white);border:1px solid var(--line);border-radius:10px;
  padding:22px 24px;display:flex;justify-content:space-between;align-items:center;font-size:14.5px;font-weight:500;
  transition:all .2s ease;cursor:default;
}
.project-row:hover{border-color:var(--teal);box-shadow:0 12px 30px rgba(11,31,42,0.07);transform:translateY(-2px);}
.project-row .n{font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--teal);}

/* brands */
.brand-row{display:flex;flex-wrap:wrap;gap:14px;}
.brand-chip{
  font-family:'IBM Plex Mono',monospace;font-size:13px;letter-spacing:0.04em;
  border:1px solid var(--line);border-radius:8px;padding:11px 22px;color:var(--slate);
  transition:all .2s ease;
}
.brand-chip:hover{border-color:var(--teal);color:var(--teal-deep);background:var(--ice);}

/* coverage */
.coverage-text{font-size:15px;color:var(--slate);max-width:760px;margin-bottom:28px;}
.coverage-text .hi{color:var(--ink);font-weight:600;}

/* faq accordion */
.faq-item{border-bottom:1px solid var(--line);}
.faq-q{
  width:100%;text-align:left;background:none;border:none;cursor:pointer;
  padding:22px 0;display:flex;justify-content:space-between;align-items:center;gap:16px;
  font-family:'Inter',sans-serif;
}
.faq-q h3{font-size:16px;font-weight:600;}
.faq-q .plus{
  font-family:'IBM Plex Mono',monospace;font-size:18px;color:var(--teal);flex-shrink:0;
  transition:transform .25s ease;width:20px;text-align:center;
}
.faq-item.open .faq-q .plus{transform:rotate(45deg);}
.faq-a{max-height:0;overflow:hidden;transition:max-height .3s ease;}
.faq-item.open .faq-a{max-height:200px;}
.faq-a p{font-size:14.5px;color:var(--slate);padding-bottom:22px;max-width:640px;}

/* final cta */
.final-cta{
  border-bottom:none;
  background:linear-gradient(180deg, var(--paper) 0%, var(--white) 100%);
  text-align:center;padding:96px 0;
}
.final-cta h2{font-size:36px;font-weight:800;max-width:640px;margin:0 auto 16px;}
.final-cta p{color:var(--slate);max-width:520px;margin:0 auto 34px;}
.final-cta .cta-row{justify-content:center;}

footer{padding:32px 0;text-align:center;font-size:12px;color:var(--slate);font-family:'IBM Plex Mono',monospace;letter-spacing:0.04em;border-top:1px solid var(--line);}

/* ---- site footer ---- */
.site-footer{background:var(--ink);color:var(--white);}
.footer-top{padding:56px 0;border-bottom:1px solid rgba(255,255,255,0.08);}
.footer-widgets{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;}
.footer-widget h3{font-family:'Inter',sans-serif;font-size:16px;font-weight:600;color:var(--white);margin-bottom:16px;}
.footer-widget p{color:rgba(255,255,255,0.7);font-size:14px;line-height:1.7;}
.footer-contact{color:rgba(255,255,255,0.85);font-size:14px;}
.footer-contact strong{color:var(--white);}
.footer-links ul{list-style:none;}
.footer-links li{margin-bottom:8px;}
.footer-links a{color:rgba(255,255,255,0.7);font-size:13px;transition:color .2s ease;}
.footer-links a:hover{color:var(--ice);}
.recent-posts ul{list-style:none;}
.recent-posts li{margin-bottom:12px;}
.recent-posts a{color:rgba(255,255,255,0.7);font-size:13px;transition:color .2s ease;}
.recent-posts a:hover{color:var(--ice);}
.social-links{display:flex;gap:10px;}
.social-links a{width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,0.08);border:1px solid rgba(255,255,255,0.12);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,0.7);font-size:14px;transition:all .2s ease;}
.social-links a:hover{background:var(--teal);color:var(--white);transform:translateY(-2px);}
.footer-bottom{padding:20px 0;font-size:11px;color:rgba(255,255,255,0.4);}
.admin-settings-link{
  display:inline-flex;align-items:center;justify-content:center;
  width:32px;height:32px;border-radius:50%;
  color:rgba(255,255,255,0.5);font-size:16px;
  transition:all .2s ease;border:1px solid rgba(255,255,255,0.1);
}
.admin-settings-link:hover{
  background:rgba(255,255,255,0.08);color:rgba(255,255,255,0.8);
  border-color:rgba(255,255,255,0.2);transform:translateY(-2px);
}
.footer-contact-link{color:rgba(255,255,255,0.85);text-decoration:underline;}
.footer-contact-link:hover{color:var(--white);opacity:0.8;}
.payment-logos{display:flex;gap:10px;margin-top:8px;align-items:center;}
.payment-logos img{height:30px;opacity:0.6;}
.scroll-top{
  position:fixed;bottom:32px;right:32px;z-index:100;
  width:40px;height:40px;border-radius:50%;background:var(--ink);color:var(--white);
  border:1px solid var(--line);display:flex;align-items:center;justify-content:center;
  opacity:0;visibility:hidden;transition:all .2s ease;cursor:pointer;
}
.scroll-top.show{opacity:1;visibility:visible;transform:translateY(0);}
.scroll-top:hover{background:var(--teal-deep);transform:translateY(-2px);}

/* blog */
article{max-width:720px;margin:0 auto;}
.eyebrow{margin-bottom:14px;}
.article-meta{font-size:13px;color:var(--slate);margin-bottom:24px;}
.article-content h2{margin:32px 0 16px;font-size:24px;}
.article-content h3{margin:24px 0 12px;font-size:20px;color:var(--ink);}
.article-content ul{margin:16px 0;padding-left:20px;}
.article-content li{margin-bottom:8px;}
.article-content p{margin-bottom:16px;}
.more{display:inline-flex;align-items:center;gap:6px;font-weight:600;color:var(--ink);}
.more svg{width:13px;height:13px;transition:transform .2s ease;}
section.blogs{padding:80px 0;}

/* contact */
.contact-detail .contact-label{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:0.12em;text-transform:uppercase;color:var(--slate);}
.contact-detail div:not(.contact-label){font-size:16px;color:var(--ink);font-weight:500;}

/* ============================================================
   CONTACT PAGE — section head, info card, inquiry form, map
   (contact.php)
   ============================================================ */
.contact-section{padding:88px 0 96px;}
.contact-container{max-width:1180px;margin:0 auto;padding:0 32px;}
.contact-section-head{max-width:760px;}
.contact-eyebrow{
  font-family:'IBM Plex Mono',monospace;
  font-size:12px;letter-spacing:0.16em;text-transform:uppercase;color:var(--teal);
  display:flex;align-items:center;gap:10px;margin-bottom:20px;
}
.contact-eyebrow::before{content:"";width:24px;height:1px;background:var(--teal);}
.contact-h1{font-size:clamp(34px,4.5vw,48px);font-weight:800;margin-bottom:18px;}
.contact-supporting{font-size:16px;color:var(--slate);line-height:1.8;}
.contact-section .cta-row{margin-top:28px;}
.contact-grid{
  display:grid;
  grid-template-columns:0.9fr 1.1fr;
  gap:28px;
  align-items:start;
  margin-top:56px;
}
.contact-info-card,
.contact-form-card{
  background:var(--white);
  border:1px solid var(--line);
  border-radius:10px;
  padding:30px;
}
.contact-info-card h3,
.contact-form-card h3{font-size:20px;font-weight:700;margin-bottom:20px;}
.contact-info-row{display:flex;gap:14px;padding:16px 0;border-top:1px solid var(--line);}
.contact-info-row:first-of-type{border-top:none;padding-top:0;}
.contact-info-icon{
  width:42px;height:42px;border-radius:50%;
  background:var(--ice);color:var(--teal);
  display:flex;align-items:center;justify-content:center;
  font-size:18px;flex-shrink:0;
}
.contact-info-label{
  font-family:'IBM Plex Mono',monospace;
  font-size:11px;letter-spacing:0.12em;text-transform:uppercase;
  color:var(--slate);margin-bottom:4px;
}
.contact-info-value{font-size:15px;color:var(--ink);font-weight:500;}
.contact-info-value a{transition:color .18s ease;}
.contact-info-value a:hover{color:var(--teal);}
.contact-info-row .btn{margin-top:10px;}
.contact-field{margin-bottom:18px;}
.contact-field label{display:block;font-size:13px;font-weight:600;color:var(--ink);margin-bottom:7px;}
.contact-field input,
.contact-field select,
.contact-field textarea{
  width:100%;
  padding:12px 14px;
  font-family:'Inter',sans-serif;
  font-size:14.5px;
  color:var(--ink);
  background:var(--white);
  border:1px solid var(--line);
  border-radius:var(--radius);
  transition:border-color .18s ease, box-shadow .18s ease;
}
.contact-field textarea{resize:vertical;min-height:130px;line-height:1.7;}
.contact-field input:focus,
.contact-field select:focus,
.contact-field textarea:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 3px rgba(12,133,153,0.12);}
.contact-field input::placeholder,
.contact-field textarea::placeholder{color:#9AA7AE;}
.contact-field select{
  appearance:none;-webkit-appearance:none;
  background-image:url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235B6B74' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 14px center;
  background-size:12px;
  padding-right:38px;
  cursor:pointer;
}
.contact-product-note{
  background:var(--ice);
  border:1px solid rgba(12,133,153,0.25);
  border-radius:var(--radius);
  padding:12px 14px;
  font-size:14px;color:var(--ink);
  margin-bottom:18px;
}
.contact-product-note strong{color:var(--teal-deep);}
.contact-submit-row{margin-top:6px;}
.contact-submit-btn{width:100%;justify-content:center;}
.form-response{
  display:none;
  padding:13px 16px;
  border-radius:var(--radius);
  font-size:14px;line-height:1.6;
  margin-bottom:18px;
}
.form-response.show{display:block;}
.form-response.success{background:#EAF7EC;border:1px solid #B7E1BD;color:#1E6B2E;}
.form-response.error{background:#FDEEEC;border:1px solid #F3C1BA;color:#A23527;}
.contact-map{
  margin-top:56px;
  border:1px solid var(--line);
  border-radius:10px;
  overflow:hidden;
  background:var(--paper);
}
.contact-map iframe{display:block;width:100%;border:0;}
.contact-container a:focus-visible,
.contact-container button:focus-visible{outline:2px solid var(--teal);outline-offset:2px;}
@media (max-width:900px){
  .contact-section{padding:64px 0 72px;}
  .contact-grid{grid-template-columns:1fr;gap:22px;margin-top:40px;}
  .contact-map{margin-top:40px;}
}
@media (max-width:600px){
  .contact-container{padding:0 16px;}
  .contact-info-card,
  .contact-form-card{padding:22px 18px;}
  .contact-h1{font-size:30px;}
  .contact-section .cta-row .btn{flex:1 1 100%;justify-content:center;}
}

/* page */
.page-head{padding:100px 0;}
.page-head .section-head{max-width:640px;}

@media (max-width:900px){
  .hero .wrap{grid-template-columns:1fr;}
  .services-grid{grid-template-columns:1fr;}
  .products-grid:not(.shop-grid){grid-template-columns:1fr;}
  .industry-list{grid-template-columns:repeat(2,1fr);}
  .why-grid{grid-template-columns:1fr;}
  .projects-grid{grid-template-columns:1fr;}
  .footer-widgets{grid-template-columns:1fr;}
  .hero h1{font-size:36px;}
  .section-head{flex-direction:column;align-items:flex-start;}
  .main-nav ul{display:none;}
  .main-nav.open ul{display:flex;flex-direction:column;background:var(--white);position:absolute;top:100%;left:0;right:0;border:1px solid var(--line);border-radius:8px;box-shadow:0 12px 40px rgba(11,31,42,0.1);padding:16px;gap:8px;}
  .main-nav.open .has-children .sub-menu{position:static;opacity:1;visibility:visible;transform:none;background:none;box-shadow:none;border:none;border-radius:0;padding:8px 0 8px 20px;margin:0;}
  .menu-toggle{display:block;}
  .topbar .topbar-right{display:none;}
}
@media (max-width:600px){
  .wrap{padding:0 16px;}
  .slide-content{padding:0 16px;}
  .services-grid{gap:14px;}
}

/* ---- gallery ---- */
.gallery-category-title{
  font-size:22px;font-weight:700;margin:32px 0 16px;color:var(--ink);
}
.gallery-images-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:16px;
}
.gallery-image-item{
  background:var(--white);border:1px solid var(--line);border-radius:10px;
  overflow:hidden;position:relative;
}
.gallery-image-item img{
  width:100%;height:220px;object-fit:contain;display:block;
}
.gallery-image-link{cursor:pointer;}
.gallery-image-caption{
  padding:8px 12px;font-size:13px;color:var(--slate);font-family:'Inter',sans-serif;
}
@media (max-width:900px){.gallery-images-grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:600px){.gallery-images-grid{grid-template-columns:1fr;}}

/* ---- visually hidden (accessible offscreen) ---- */
.visually-hidden{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
  border:0!important;
}