/* components.css */
/* ── Navbar ── */
.navbar{position:fixed;top:0;left:0;right:0;z-index:1000;padding:18px 0;transition:all .4s ease}
.navbar.scrolled{background:var(--nav-bg);backdrop-filter:blur(20px);padding:12px 0;border-bottom:1px solid var(--border)}
.navbar .container{display:flex;align-items:center;justify-content:space-between;gap:20px}
.nav-logo{display:flex;align-items:center;gap:12px;font-family:var(--font-h);font-weight:700;font-size:1.15rem}
.nav-logo .logo-icon{width:40px;height:40px;background:var(--grad-o);border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:1.2rem;box-shadow:0 4px 20px rgba(255,107,0,.4)}
.nav-links{display:flex;align-items:center;gap:32px}
.nav-links a{font-size:.9rem;font-weight:500;color:var(--text-2);transition:color var(--tr-fast);position:relative}
.nav-links a::after{content:'';position:absolute;bottom:-3px;left:0;width:0;height:2px;background:var(--orange);border-radius:99px;transition:width var(--tr-mid)}
.nav-links a:hover,.nav-links a.active{color:var(--text)}
.nav-links a:hover::after,.nav-links a.active::after{width:100%}
.nav-cta{display:flex;align-items:center;gap:12px}
.hamburger{display:none;flex-direction:column;gap:6px;cursor:pointer;padding:8px;z-index:1001;border-radius:8px;transition:background .3s}
.hamburger:active{background:rgba(255,107,0,.1)}
.hamburger span{display:block;width:24px;height:2px;background:var(--text);border-radius:99px;transition:all var(--tr-fast);transform-origin:center}
.hamburger.open span:nth-child(1){transform:translateY(8px) rotate(45deg)}
.hamburger.open span:nth-child(2){opacity:0;transform:scaleX(0)}
.hamburger.open span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
.mobile-menu{display:flex;position:fixed;inset:0;top:0;background:var(--nav-bg);backdrop-filter:blur(25px);z-index:999;padding:100px 40px 40px;flex-direction:column;gap:20px;transform:translateX(100%);transition:transform .5s cubic-bezier(0.4, 0, 0.2, 1);pointer-events:none;opacity:0}
.mobile-menu.open{transform:translateX(0);pointer-events:all;opacity:1}
.mobile-menu a{font-size:1.4rem;font-weight:600;color:var(--text-2);padding:10px 0;border-bottom:1px solid var(--border);transition:color var(--tr-fast)}
.mobile-menu a:hover{color:var(--orange)}

/* ── Custom Cursor ── */
.cursor{pointer-events:none;z-index:9998}
.cursor-dot{
  position:fixed;top:0;left:0;
  width:8px;height:8px;
  background:#ff6b00;
  border-radius:50%;
  transform:translate(-50%,-50%);
  transition:width .2s,height .2s,opacity .3s;
  pointer-events:none;
  z-index:9999;
  opacity:0;
}
.cursor-ring{
  position:fixed;top:0;left:0;
  width:36px;height:36px;
  border:2px solid rgba(255,107,0,.6);
  border-radius:50%;
  transform:translate(-50%,-50%);
  transition:width .3s,height .3s,border-color .3s,opacity .3s;
  pointer-events:none;
  z-index:9998;
  opacity:0;
}
.cursor.hover .cursor-dot{width:14px;height:14px;background:#fff}
.cursor.hover .cursor-ring{width:52px;height:52px;border-color:#ff6b00;border-width:2px}

/* ── Loader ── */
.loader{position:fixed;inset:0;background:var(--bg);z-index:9999;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:30px;transition:opacity .6s ease,visibility .6s ease}
.loader.hidden{opacity:0;visibility:hidden}
.loader-logo{font-family:var(--font-h);font-size:2rem;font-weight:700;animation:logo-reveal .8s ease forwards}
.loader-bar-wrap{width:200px;height:3px;background:rgba(255,255,255,.1);border-radius:99px;overflow:hidden}
.loader-bar{height:100%;background:var(--grad-o);border-radius:99px;animation:loading-bar 2.2s ease forwards}
.loader-dots{display:flex;gap:8px}
.loader-dots span{width:8px;height:8px;background:var(--orange);border-radius:50%;animation:dot-bounce 1.4s ease infinite}
.loader-dots span:nth-child(2){animation-delay:.16s}
.loader-dots span:nth-child(3){animation-delay:.32s}

/* ── Product Cards ── */
.product-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r-lg);padding:32px;transition:all .4s ease;position:relative;overflow:hidden;cursor:pointer}
.product-card::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at top left,rgba(255,107,0,.07),transparent 70%);opacity:0;transition:opacity .4s}
.product-card:hover{border-color:var(--border-o);transform:translateY(-6px);box-shadow:0 20px 60px rgba(0,0,0,.4),0 0 40px rgba(255,107,0,.1)}
.product-card:hover::before{opacity:1}
.product-card .card-icon{width:60px;height:60px;border-radius:var(--r-md);background:rgba(255,107,0,.12);border:1px solid rgba(255,107,0,.2);display:flex;align-items:center;justify-content:center;font-size:1.6rem;margin-bottom:22px;transition:all .4s}
.product-card:hover .card-icon{background:rgba(255,107,0,.2);box-shadow:0 0 25px rgba(255,107,0,.3);transform:scale(1.1)}
.product-card h4{margin-bottom:10px;font-size:1.15rem}
.product-card p{font-size:.9rem;color:var(--text-2);margin-bottom:20px}
.card-arrow{display:inline-flex;align-items:center;gap:6px;font-size:.85rem;font-weight:600;color:var(--orange);opacity:0;transform:translateX(-8px);transition:all .3s}
.product-card:hover .card-arrow{opacity:1;transform:translateX(0)}

/* ── Feature blocks ── */
.feature-block{display:flex;gap:20px;align-items:flex-start;padding:24px;border-radius:var(--r-md);background:var(--bg-card);border:1px solid var(--border);transition:all .3s}
.feature-block:hover{border-color:var(--border-o);background:rgba(255,107,0,.04)}
.feature-block .f-icon{width:48px;height:48px;min-width:48px;border-radius:12px;background:rgba(255,107,0,.1);display:flex;align-items:center;justify-content:center;font-size:1.3rem}
.feature-block h4{font-size:1rem;margin-bottom:5px}
.feature-block p{font-size:.87rem;color:var(--text-2)}

/* ── Why card ── */
.why-card{text-align:center;padding:36px 24px;border-radius:var(--r-lg);background:var(--bg-card);border:1px solid var(--border);transition:all .4s}
.why-card:hover{border-color:var(--border-o);transform:translateY(-5px);box-shadow:0 20px 50px rgba(0,0,0,.35),var(--shadow-o)}
.why-icon{width:70px;height:70px;border-radius:50%;background:rgba(255,107,0,.1);border:2px solid rgba(255,107,0,.2);display:flex;align-items:center;justify-content:center;font-size:1.8rem;margin:0 auto 18px;transition:all .4s}
.why-card:hover .why-icon{background:rgba(255,107,0,.2);box-shadow:0 0 40px rgba(255,107,0,.35);animation:glow-pulse 2s ease-in-out infinite}
.why-card h4{font-size:1.05rem;margin-bottom:10px}
.why-card p{font-size:.88rem;color:var(--text-2)}

/* ── Industry cards ── */
.industry-card{display:flex;flex-direction:column;align-items:center;gap:14px;padding:28px 20px;border-radius:var(--r-lg);background:var(--bg-card);border:1px solid var(--border);text-align:center;transition:all .35s;cursor:pointer}
.industry-card:hover{border-color:var(--border-o);background:rgba(255,107,0,.05);transform:translateY(-5px);box-shadow:0 20px 50px rgba(0,0,0,.3)}
.industry-card .ind-icon{font-size:2.2rem;width:70px;height:70px;display:flex;align-items:center;justify-content:center;background:rgba(255,107,0,.1);border-radius:var(--r-md);transition:all .3s}
.industry-card:hover .ind-icon{background:rgba(255,107,0,.2);transform:scale(1.12)}
.industry-card h4{font-size:1rem;font-weight:600}

/* ── Testimonials ── */
.testimonial-card{padding:32px;border-radius:var(--r-lg);background:rgba(255,255,255,.04);border:1px solid var(--border);backdrop-filter:blur(20px);transition:all .4s}
.testimonial-card .stars{display:flex;gap:4px;margin-bottom:16px;color:#ffc107;font-size:1rem}
.testimonial-card blockquote{font-size:.97rem;color:var(--text-2);line-height:1.8;margin-bottom:24px;font-style:italic}
.testimonial-card .client{display:flex;align-items:center;gap:14px}
.client-avatar{width:46px;height:46px;border-radius:50%;background:var(--grad-o);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.1rem;font-family:var(--font-h)}
.client-name{font-weight:600;font-size:.95rem}
.client-role{font-size:.8rem;color:var(--text-3)}

/* ── Tech logos ── */
.tech-item{display:flex;flex-direction:column;align-items:center;gap:12px;padding:24px 16px;border-radius:var(--r-md);background:var(--bg-card);border:1px solid var(--border);transition:all .3s;cursor:default}
.tech-item:hover{border-color:var(--border-o);transform:translateY(-4px);box-shadow:0 15px 40px rgba(0,0,0,.3)}
.tech-item .tech-icon{font-size:2.2rem}
.tech-item span{font-size:.82rem;font-weight:600;color:var(--text-2)}

/* ── Contact ── */
.contact-card{display:flex;align-items:center;gap:18px;padding:24px;border-radius:var(--r-lg);background:var(--bg-card);border:1px solid var(--border);transition:all .3s}
.contact-card:hover{border-color:var(--border-o);transform:translateY(-3px)}
.contact-card .c-icon{width:52px;height:52px;min-width:52px;border-radius:var(--r-md);background:rgba(255,107,0,.1);border:1px solid rgba(255,107,0,.2);display:flex;align-items:center;justify-content:center;font-size:1.3rem}
.contact-card h4{font-size:.95rem;margin-bottom:4px}
.contact-card p,.contact-card a{font-size:.9rem;color:var(--text-2)}
.form-group{position:relative;margin-bottom:22px}
.form-group label{position:absolute;left:18px;top:50%;transform:translateY(-50%);font-size:.9rem;color:var(--text-3);transition:all .25s;pointer-events:none;background:transparent}
.form-group textarea~label{top:20px;transform:none}
.form-group input,.form-group textarea,.form-group select{width:100%;background:rgba(255,255,255,.05);border:1px solid var(--border);border-radius:var(--r-md);padding:18px;font-size:.95rem;color:var(--text);font-family:var(--font-b);transition:border-color .25s,box-shadow .25s;outline:none;resize:none}
.form-group textarea{min-height:130px;padding-top:24px}
.form-group input:focus,.form-group textarea:focus{border-color:var(--orange);box-shadow:0 0 0 3px rgba(255,107,0,.12)}
.form-group input:focus~label,.form-group input:not(:placeholder-shown)~label,
.form-group textarea:focus~label,.form-group textarea:not(:placeholder-shown)~label{top:-10px;font-size:.78rem;color:var(--orange);background:var(--bg-2);padding:0 6px;left:14px}
.form-group input::placeholder,.form-group textarea::placeholder{color:transparent}
.form-group.error input,.form-group.error textarea{border-color:#ff4444}
.form-group .err-msg{font-size:.78rem;color:#ff4444;margin-top:5px}

/* ── Footer ── */
footer{background:var(--bg-2);border-top:1px solid var(--border);padding:80px 0 30px}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:48px;margin-bottom:60px}
.footer-brand .f-logo{display:flex;align-items:center;gap:12px;font-family:var(--font-h);font-weight:700;font-size:1.1rem;margin-bottom:16px}
.footer-brand p{font-size:.9rem;color:var(--text-2);max-width:300px;margin-bottom:22px}
.social-links{display:flex;gap:12px}
.social-link{width:38px;height:38px;border-radius:50%;background:var(--bg-card);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:.95rem;transition:all .25s;cursor:pointer;color:var(--text);}
.social-link:hover{background:rgba(255,107,0,.15);border-color:var(--border-o);transform:translateY(-3px)}
footer h5{font-size:.95rem;font-weight:700;margin-bottom:20px;color:var(--text)}
footer ul li{margin-bottom:12px}
footer ul a{font-size:.88rem;color:var(--text-2);transition:color .2s}
footer ul a:hover{color:var(--orange)}
.footer-newsletter input{width:100%;background:var(--form-bg);border:1px solid var(--border);border-radius:var(--r-full);padding:12px 20px;color:var(--text);font-size:.9rem;outline:none;margin-bottom:12px;transition:border-color .25s}
.footer-newsletter input:focus{border-color:var(--orange)}
.footer-newsletter .btn{width:100%;justify-content:center}
.footer-bottom{border-top:1px solid var(--border);padding-top:24px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px}
.footer-bottom p{font-size:.85rem;color:var(--text-3)}

/* ── Back to top ── */
.back-top{position:fixed;bottom:30px;right:30px;width:44px;height:44px;border-radius:50%;background:var(--grad-o);display:flex;align-items:center;justify-content:center;font-size:1rem;box-shadow:0 4px 20px rgba(255,107,0,.4);opacity:0;transform:translateY(20px);transition:all .35s;z-index:500;cursor:pointer}
.back-top.visible{opacity:1;transform:translateY(0)}
.back-top:hover{transform:translateY(-3px);box-shadow:0 8px 30px rgba(255,107,0,.5)}

/* ── WhatsApp FAB ── */
.whatsapp-fab{position:fixed;bottom:82px;right:30px;width:48px;height:48px;border-radius:50%;background:#25D366;display:flex;align-items:center;justify-content:center;font-size:1.4rem;box-shadow:0 4px 20px rgba(37,211,102,.4);z-index:500;cursor:pointer;transition:all .3s}
.whatsapp-fab:hover{transform:scale(1.12);box-shadow:0 6px 28px rgba(37,211,102,.5)}

/* ── Testimonial Slider ── */
.testimonial-slider{position:relative;overflow:hidden}
.testimonial-track{display:flex;gap:24px;transition:transform .6s cubic-bezier(.4,0,.2,1)}
.testimonial-dots{display:flex;justify-content:center;gap:8px;margin-top:32px}
.t-dot{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.2);transition:all .3s;cursor:pointer}
.t-dot.active{width:24px;border-radius:99px;background:var(--orange)}

/* ── Hero floating cards ── */
.hero-float-card{position:absolute;background:rgba(13,13,26,.8);border:1px solid rgba(255,255,255,.1);backdrop-filter:blur(20px);border-radius:var(--r-md);padding:14px 18px;display:flex;align-items:center;gap:12px;white-space:nowrap;z-index:5}
.hero-float-card .hfc-icon{width:36px;height:36px;border-radius:8px;background:rgba(255,107,0,.15);display:flex;align-items:center;justify-content:center;font-size:1rem;flex-shrink:0}
.hero-float-card h5{font-size:.85rem;font-weight:600;margin-bottom:1px}
.hero-float-card p{font-size:.72rem;color:var(--text-2)}

/* ── Dashboard mockup ── */
.dashboard-mockup{background:rgba(13,13,26,.9);border:1px solid rgba(255,255,255,.1);border-radius:var(--r-lg);padding:20px;overflow:hidden}
.dash-header{display:flex;align-items:center;gap:8px;margin-bottom:18px}
.dash-dot{width:10px;height:10px;border-radius:50%}
.dash-bar{height:6px;border-radius:99px;background:var(--grad-o);margin-bottom:8px}
.dash-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.dash-stat{background:rgba(255,255,255,.04);border-radius:10px;padding:12px;border:1px solid rgba(255,255,255,.06)}
.dash-stat .ds-num{font-family:var(--font-h);font-weight:700;font-size:1.3rem;color:var(--text)}
.dash-stat .ds-lbl{font-size:.7rem;color:var(--text-3);margin-top:2px}
.dash-chart{margin-top:14px;height:60px;display:flex;align-items:flex-end;gap:5px}
.dash-chart .bar{flex:1;border-radius:4px 4px 0 0;background:rgba(255,107,0,.3);transition:height .5s}
.dash-chart .bar.active{background:var(--grad-o)}

/* ══════════════════════════════════════════════
   ABOUT SECTION — Full Company Profile
   ══════════════════════════════════════════════ */

/* ── Hero Intro ── */
.about-hero-intro{text-align:center;max-width:860px;margin:0 auto 60px;padding:0 20px}
.about-hero-intro h2{margin:16px 0 24px}
.about-lead{font-size:1.05rem;color:var(--text-2);line-height:1.8;margin-bottom:20px}
.about-location-badges{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:20px 0}
.loc-badge{display:inline-flex;align-items:center;gap:7px;font-size:.82rem;font-weight:600;color:var(--orange);background:rgba(255,107,0,.08);border:1px solid rgba(255,107,0,.22);padding:6px 14px;border-radius:var(--r-full);letter-spacing:.02em}
.about-mission{font-size:.97rem;color:var(--text-2);line-height:1.7;margin-top:16px;font-style:italic}
.about-mission em{color:var(--orange);font-style:normal;font-weight:600}

/* ── Stats Row ── */
.about-stats-row{display:grid;grid-template-columns:repeat(5,1fr);gap:18px;margin-bottom:70px}
.asr-card{text-align:center;padding:24px 16px;border-radius:var(--r-lg);background:var(--bg-card);border:1px solid var(--border);transition:all .35s}
.asr-card:hover{border-color:var(--border-o);transform:translateY(-5px);box-shadow:0 16px 40px rgba(0,0,0,.35),var(--shadow-o)}
.asr-num{font-family:var(--font-h);font-size:clamp(1.8rem,3vw,2.8rem);font-weight:700;line-height:1;margin-bottom:6px}
.asr-lbl{font-size:.8rem;color:var(--text-3);font-weight:500;text-transform:uppercase;letter-spacing:.06em}

/* ── Section sub-title ── */
.about-section-title{text-align:center;margin:0 0 48px}
.about-section-title h3{font-size:clamp(1.5rem,2.5vw,2.2rem);margin-top:12px}

/* ── Expertise Block wrapper ── */
.expertise-block{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r-xl);padding:36px 40px;margin-bottom:28px;transition:border-color .35s}
.expertise-block:hover{border-color:var(--border-o)}

/* ── EB Header ── */
.eb-header{display:flex;align-items:flex-start;gap:20px;margin-bottom:28px}
.eb-icon{width:56px;height:56px;min-width:56px;border-radius:var(--r-md);background:rgba(255,107,0,.1);border:1px solid rgba(255,107,0,.2);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .3s}
.expertise-block:hover .eb-icon{background:rgba(255,107,0,.2);box-shadow:0 0 25px rgba(255,107,0,.25)}
.eb-header h3{font-size:clamp(1.1rem,1.8vw,1.4rem);margin-bottom:6px}
.eb-header p{font-size:.9rem;color:var(--text-2)}

/* ── Features Grid ── */
.eb-features-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
.eb-feature{display:flex;align-items:center;gap:10px;padding:12px 16px;border-radius:var(--r-md);background:rgba(255,255,255,.03);border:1px solid var(--border);font-size:.88rem;color:var(--text-2);transition:all .25s}
.eb-feature:hover{border-color:var(--border-o);background:rgba(255,107,0,.04);color:var(--text)}
.ef-icon{font-size:1.1rem;flex-shrink:0;line-height:1}

/* ── Awards — Standalone Section ── */
.awards-standalone{
  margin-bottom:28px;
  padding:40px 44px;
  border-radius:var(--r-xl);
  background:linear-gradient(135deg,rgba(255,193,7,.06) 0%,rgba(255,160,0,.03) 100%);
  border:2px solid rgba(255,193,7,.28);
  position:relative;
  overflow:hidden;
}
.awards-standalone::before{
  content:'';position:absolute;inset:0;
  background:radial-gradient(ellipse at top left,rgba(255,193,7,.08),transparent 60%);
  pointer-events:none;
}
.awards-standalone-header{
  display:flex;align-items:center;gap:20px;margin-bottom:32px;
}
.awards-trophy-icon{
  font-size:2.8rem;line-height:1;
  width:72px;height:72px;min-width:72px;
  display:flex;align-items:center;justify-content:center;
  background:rgba(255,193,7,.12);
  border:2px solid rgba(255,193,7,.3);
  border-radius:var(--r-lg);
}
.awards-standalone-header h3{
  font-size:clamp(1.2rem,2vw,1.6rem);
  margin-bottom:6px;
  background:linear-gradient(135deg,#ffd700,#ffb300);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
.awards-standalone-header p{font-size:.92rem;color:var(--text-2)}

/* Award Cards Grid */
.awards-cards-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(200px,1fr));
  gap:18px;
}
.award-card{
  padding:24px 20px;
  border-radius:var(--r-lg);
  background:var(--bg-card);
  border:1px solid rgba(255,193,7,.2);
  text-align:center;
  transition:all .35s;
  position:relative;
  overflow:hidden;
  cursor:default;
}
.award-card::before{
  content:'';position:absolute;inset:0;
  background:radial-gradient(circle at top center,rgba(255,193,7,.07),transparent 65%);
  opacity:0;transition:opacity .35s;
}
.award-card:hover{
  border-color:rgba(255,193,7,.5);
  transform:translateY(-6px);
  box-shadow:0 16px 48px rgba(0,0,0,.3),0 0 30px rgba(255,193,7,.12);
}
.award-card:hover::before{opacity:1}
.award-card-medal{font-size:2.4rem;line-height:1;margin-bottom:10px}
.award-card-tag{
  display:inline-block;
  font-size:.7rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  color:#ffc107;background:rgba(255,193,7,.12);
  border:1px solid rgba(255,193,7,.25);
  padding:3px 10px;border-radius:var(--r-full);
  margin-bottom:10px;
}
.award-card h4{font-size:.95rem;margin-bottom:8px;color:var(--text)}
.award-card p{font-size:.82rem;color:var(--text-2);line-height:1.6}
.award-card p strong{color:var(--text)}

/* Light theme overrides */
:root.light .awards-standalone{background:linear-gradient(135deg,rgba(255,193,7,.08),rgba(255,160,0,.04));border-color:rgba(255,193,7,.35)}
:root.light .award-card{background:#fff;border-color:rgba(255,193,7,.25);box-shadow:0 2px 16px rgba(0,0,0,.06)}
:root.light .award-card:hover{box-shadow:0 12px 36px rgba(0,0,0,.12),0 0 24px rgba(255,193,7,.15)}

/* Responsive */
@media(max-width:768px){
  .awards-standalone{padding:24px 20px}
  .awards-cards-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:480px){
  .awards-cards-grid{grid-template-columns:1fr}
  .awards-standalone-header{flex-direction:column;text-align:center}
}

/* ── Full-section Awards (standalone section after Products) ── */
#awards{padding:80px 0}
.awards-grid-full{
  grid-template-columns:repeat(5,1fr);
  gap:24px;
}
@media(max-width:1100px){.awards-grid-full{grid-template-columns:repeat(3,1fr)}}
@media(max-width:768px){.awards-grid-full{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.awards-grid-full{grid-template-columns:1fr}}

/* ── Two-column layout inside EB ── */
.eb-two-col{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:start}

/* ── Web Focus List ── */
.web-focus-list{padding:28px;border-radius:var(--r-lg);background:rgba(255,107,0,.04);border:1px solid rgba(255,107,0,.15);display:flex;flex-direction:column;gap:14px}
.wfl-item{display:flex;align-items:center;gap:14px;font-size:.9rem;color:var(--text-2)}
.wfl-dot{width:8px;height:8px;min-width:8px;border-radius:50%;background:var(--grad-o)}

/* ── Industry Pills ── */
.industry-pills{display:flex;flex-wrap:wrap;gap:10px;margin-top:4px}
.ind-pill{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:var(--r-full);background:rgba(255,107,0,.08);border:1px solid rgba(255,107,0,.2);font-size:.83rem;color:var(--text-2);transition:all .25s;cursor:default}
.ind-pill:hover{background:rgba(255,107,0,.18);color:var(--text);border-color:var(--orange)}

/* ── Marketing Products Grid ── */
.marketing-products-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:16px}
.mp-card{text-align:center;padding:28px 16px;border-radius:var(--r-lg);background:rgba(255,255,255,.03);border:1px solid var(--border);transition:all .35s;cursor:default}
.mp-card:hover{border-color:var(--border-o);transform:translateY(-5px);background:rgba(255,107,0,.04);box-shadow:0 16px 40px rgba(0,0,0,.25)}
.mp-emoji{font-size:2.2rem;margin-bottom:12px;line-height:1}
.mp-card h4{font-size:1rem;margin-bottom:6px}
.mp-card p{font-size:.82rem;color:var(--text-3)}

/* ── ERP App List ── */
.erp-app-list{display:flex;flex-direction:column;gap:14px}
.erp-app-item{display:flex;align-items:center;gap:16px;padding:16px;border-radius:var(--r-md);background:rgba(255,255,255,.03);border:1px solid var(--border);transition:all .25s}
.erp-app-item:hover{border-color:var(--border-o)}
.erp-app-badge{min-width:50px;padding:6px 12px;border-radius:var(--r-full);background:rgba(255,107,0,.25);color:#fff;font-size:.78rem;font-weight:700;text-align:center;font-family:var(--font-h)}
.erp-app-item h4{font-size:.95rem;margin-bottom:2px}
.erp-app-item p{font-size:.8rem;color:var(--text-3)}

/* ── Why Secura Banner ── */
.why-secura-banner{margin-top:48px;padding:44px 48px;border-radius:var(--r-xl);background:linear-gradient(135deg,rgba(255,107,0,.08),rgba(255,140,0,.04));border:1px solid rgba(255,107,0,.25);text-align:center}
.wsb-header h3{font-size:clamp(1.4rem,2.5vw,2rem);margin-bottom:28px}
.wsb-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px;margin-bottom:28px}
.wsb-item{display:flex;align-items:center;gap:10px;padding:12px 18px;border-radius:var(--r-md);background:rgba(255,255,255,.04);border:1px solid var(--border);font-size:.9rem;color:var(--text-2);transition:all .25s}
.wsb-item:hover{border-color:var(--border-o);color:var(--text)}
.wsb-check{font-size:1rem;flex-shrink:0}
.wsb-tagline{font-size:.97rem;color:var(--text-2);line-height:1.7;max-width:660px;margin:0 auto}
.wsb-tagline em{color:var(--orange);font-style:normal;font-weight:600}

/* ── Light theme overrides for About ── */
:root.light .expertise-block{background:#fff;border-color:rgba(0,0,0,.08);box-shadow:0 2px 20px rgba(0,0,0,.05)}
:root.light .asr-card{background:#fff;border-color:rgba(0,0,0,.08)}
:root.light .eb-feature{background:rgba(0,0,0,.02);border-color:rgba(0,0,0,.07)}
:root.light .mp-card{background:#fff;border-color:rgba(0,0,0,.08)}
:root.light .erp-app-item{background:#fff;border-color:rgba(0,0,0,.08)}
:root.light .wsb-item{background:#fff;border-color:rgba(0,0,0,.08)}
:root.light .awards-block{background:rgba(255,193,7,.06)}
:root.light .why-secura-banner{background:linear-gradient(135deg,rgba(255,107,0,.06),rgba(255,140,0,.02))}

/* ── Responsive ── */
@media(max-width:1024px){
  .about-stats-row{grid-template-columns:repeat(3,1fr)}
  .eb-two-col{grid-template-columns:1fr}
}
@media(max-width:768px){
  .about-stats-row{grid-template-columns:repeat(2,1fr)}
  .expertise-block{padding:24px 20px}
  .why-secura-banner{padding:28px 20px}
  .marketing-products-grid{grid-template-columns:repeat(2,1fr)}
  .wsb-grid{grid-template-columns:1fr}
}
@media(max-width:480px){
  .about-stats-row{grid-template-columns:repeat(2,1fr)}
  .eb-features-grid{grid-template-columns:1fr}
  .marketing-products-grid{grid-template-columns:1fr}
}