/* ═══════════ SHARED SUBPAGE STYLES ═══════════ */
/* Loaded after index.css on all subpages */

/* ═══════════ PAGE HERO ═══════════ */
.page-hero{
  padding:180px 0 100px;text-align:center;position:relative;z-index:10;
  background:linear-gradient(180deg,rgba(5,5,16,.7),rgba(5,5,16,.4));
}
.page-hero h1{
  font-size:clamp(2.5rem,6vw,4.5rem);font-weight:700;line-height:1.08;
  letter-spacing:-.035em;margin:20px 0 24px;color:var(--white);
}
.page-hero p{color:rgba(255,255,255,.7);font-size:18px;max-width:640px;margin:0 auto;line-height:1.8}
.hero-stats{display:flex;gap:20px;justify-content:center;flex-wrap:wrap;margin-top:36px}
.stat-badge{
  display:inline-flex;align-items:center;gap:8px;
  padding:10px 22px;border-radius:50px;
  background:rgba(6,182,212,.08);border:1px solid rgba(6,182,212,.2);
  color:var(--cyan);font-size:13px;font-weight:600;letter-spacing:.3px;
  backdrop-filter:blur(12px);
}
.stat-badge svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2}
.section-tag{
  display:inline-flex;align-items:center;gap:8px;
  padding:9px 20px;border-radius:50px;
  background:rgba(6,182,212,.08);border:1px solid rgba(6,182,212,.2);
  color:var(--cyan);font-size:12px;font-weight:600;
  letter-spacing:2.2px;text-transform:uppercase;
}
.section-tag::before{content:'';width:6px;height:6px;background:var(--cyan);border-radius:50%;box-shadow:0 0 8px rgba(6,182,212,.55)}

/* ═══════════ PAGE HERO VARIANTS ═══════════ */
.page-hero-bg{padding:180px 0 100px;text-align:center;position:relative;z-index:10}
.page-hero-content{position:relative;z-index:2}
.page-hero-inner{max-width:800px;margin:0 auto}
.page-hero-desc{color:var(--text-muted);font-size:18px;max-width:640px;margin:0 auto;line-height:1.8}
.page-tag{display:inline-flex;align-items:center;gap:8px;padding:9px 20px;border-radius:50px;background:rgba(6,182,212,.06);border:1px solid rgba(6,182,212,.14);color:var(--cyan);font-size:12px;font-weight:600;letter-spacing:2.2px;text-transform:uppercase}
.page-title{font-size:clamp(2.5rem,6vw,4.5rem);font-weight:700;line-height:1.08;letter-spacing:-.035em;margin:20px 0 24px;color:var(--title-color)}
.page-description{color:var(--text-muted);font-size:18px;max-width:640px;margin:0 auto;line-height:1.8}
.page-stats{display:flex;gap:20px;justify-content:center;flex-wrap:wrap;margin-top:36px}
.page-hero-stats{display:flex;gap:20px;justify-content:center;flex-wrap:wrap;margin-top:36px}
.page-hero-stat{text-align:center}
.page-hero-stat-num{font-size:36px;font-weight:700;color:var(--cyan);font-family:var(--font-heading);line-height:1}
.page-hero-stat-label{font-size:12px;color:var(--text-dim);text-transform:uppercase;letter-spacing:1.5px;margin-top:6px}
.hero-tag{display:inline-flex;align-items:center;gap:8px;padding:9px 20px;border-radius:50px;background:rgba(6,182,212,.06);border:1px solid rgba(6,182,212,.14);color:var(--cyan);font-size:12px;font-weight:600;letter-spacing:2.2px;text-transform:uppercase}

/* ═══════════ GLASS CARD (generic) ═══════════ */
.glass-card{
  background:linear-gradient(180deg,rgba(15,15,42,.7),rgba(10,10,30,.6));
  backdrop-filter:blur(22px) saturate(1.15);
  border:1px solid rgba(6,182,212,.08);box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
  border-radius:var(--radius-lg);
  transition:transform .45s var(--transition),box-shadow .45s var(--transition),border-color .45s var(--transition);
}
.glass-card:hover{border-color:var(--border-glow);box-shadow:0 24px 60px rgba(6,182,212,.08)}

/* ═══════════ CONTENT SECTION ═══════════ */
.content-section{padding:3rem;position:relative;z-index:10}
.content-section h2{font-size:24px;margin:40px 0 16px;color:var(--title-color)}
.content-section h3{font-size:20px;margin:28px 0 12px;color:var(--title-color)}
.content-section p{color:var(--text-muted);font-size:15px;line-height:1.85;margin-bottom:16px}

/* ═══════════ SERVICES GRID ═══════════ */
.services-section{padding:100px 0;position:relative;z-index:10}
.services-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:28px}
.service-card{
  padding:40px;position:relative;overflow:hidden;
  background:linear-gradient(180deg,rgba(15,15,42,.7),rgba(10,10,30,.6));
  backdrop-filter:blur(22px);border:1px solid rgba(6,182,212,.08);
  border-radius:var(--radius-lg);
  transition:transform .45s var(--transition),box-shadow .45s var(--transition),border-color .45s var(--transition);
}
.service-card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--cyan),var(--purple),transparent);opacity:0;transition:opacity .4s}
.service-card:hover::before{opacity:1}
.service-card:hover{
  border-color:var(--border-glow);
  box-shadow:0 24px 60px rgba(6,182,212,.08),0 0 40px rgba(6,182,212,.04);
  transform:translateY(-4px);
}
.service-icon{
  width:64px;height:64px;border-radius:18px;
  background:rgba(6,182,212,.08);border:1px solid rgba(6,182,212,.12);
  display:flex;align-items:center;justify-content:center;
  color:var(--cyan);margin-bottom:28px;transition:all .4s;
}
.service-icon svg{width:28px;height:28px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.service-card:hover .service-icon{background:var(--cyan);color:var(--white);box-shadow:var(--glow-cyan);transform:scale(1.08)}
.service-card h3,.service-title{font-size:22px;font-weight:700;margin-bottom:14px;color:var(--title-color)}
.service-card>p,.service-description{color:var(--text-muted);font-size:15px;line-height:1.75;margin-bottom:24px}
.service-features{list-style:none;display:flex;flex-wrap:wrap;gap:8px}
.service-features li{
  padding:6px 14px;border-radius:8px;font-size:12px;font-weight:600;
  background:rgba(6,182,212,.06);border:1px solid rgba(6,182,212,.1);
  color:var(--cyan);letter-spacing:.3px;
}

/* ═══════════ TECH GRID ═══════════ */
.tech-section{padding:100px 0;position:relative;z-index:10}
.tech-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:20px;margin-top:48px}
.tech-item,.tech-card{
  padding:24px;text-align:center;
  background:rgba(15,15,42,.4);border:1px solid rgba(6,182,212,.08);
  border-radius:var(--radius);transition:all .3s;
}
.tech-item:hover,.tech-card:hover{border-color:var(--cyan);background:rgba(6,182,212,.06);box-shadow:0 0 20px rgba(6,182,212,.08)}
.tech-item h4,.tech-title{font-size:14px;font-weight:700;color:var(--title-color);margin-bottom:4px}
.tech-item p{font-size:12px;color:var(--text-dim)}
.tech-icon{width:48px;height:48px;border-radius:14px;background:rgba(6,182,212,.08);border:1px solid rgba(6,182,212,.12);display:flex;align-items:center;justify-content:center;color:var(--cyan);margin:0 auto 16px}
.tech-icon svg{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:1.5}
.tech-tags{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin-top:12px}
.tech-tag{padding:4px 12px;border-radius:6px;font-size:11px;font-weight:600;background:rgba(6,182,212,.06);border:1px solid rgba(6,182,212,.1);color:var(--cyan)}

/* ═══════════ SECTION HEADER (generic) ═══════════ */
.section-header{text-align:center;margin-bottom:64px}
.section-header h2,.section-title{font-size:clamp(2rem,4vw,3.2rem);margin:0 0 16px;color:var(--title-color)}
.section-header p,.section-description{color:var(--text-muted);font-size:17px;max-width:520px;margin:0 auto}

/* ═══════════ PROCESS STEPS ═══════════ */
.process-section{padding:100px 0;position:relative;z-index:10}
.process-header{text-align:center;margin-bottom:64px}
.process-header h2{font-size:clamp(2rem,4vw,3.2rem);margin:20px 0}
.process-header p{color:var(--text-muted);font-size:17px;max-width:520px;margin:0 auto}
.process-steps,.process-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:28px}
.process-step,.process-card{
  padding:36px;text-align:center;position:relative;
  background:linear-gradient(180deg,rgba(15,15,42,.6),rgba(10,10,30,.5));
  backdrop-filter:blur(12px);border:1px solid rgba(6,182,212,.08);
  border-radius:var(--radius-lg);
  transition:all .4s var(--transition);
}
.process-step:hover,.process-card:hover{border-color:var(--border-glow);box-shadow:0 16px 40px rgba(6,182,212,.06);transform:translateY(-4px)}
.step-number,.process-number,.process-num{
  font-size:48px;font-weight:700;font-family:var(--font-heading);
  background:linear-gradient(135deg,var(--cyan),var(--blue));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
  margin-bottom:20px;line-height:1;opacity:.6;
}
.process-step h3,.process-title{font-size:20px;font-weight:700;margin-bottom:12px;color:var(--title-color)}
.process-step p,.process-description{color:var(--text-muted);font-size:14px;line-height:1.7}
.process-icon{width:56px;height:56px;border-radius:16px;background:rgba(6,182,212,.08);border:1px solid rgba(6,182,212,.12);display:flex;align-items:center;justify-content:center;color:var(--cyan);margin:0 auto 20px}
.process-icon svg{width:26px;height:26px;stroke:currentColor;fill:none;stroke-width:1.5}
.process-wrap{position:relative}
.process-arrow{display:flex;align-items:center;justify-content:center;color:var(--cyan);opacity:.4;font-size:24px}

/* ═══════════ CTA (subpage) ═══════════ */
.cta-section{padding:100px 0;position:relative;z-index:10}
.cta-section-inner{
  padding:110px 48px;text-align:center;
  background:linear-gradient(180deg,rgba(6,182,212,.05),rgba(59,130,246,.03) 50%,rgba(139,92,246,.02));
  border:1px solid rgba(6,182,212,.1);border-radius:var(--radius-xl);
  position:relative;overflow:hidden;backdrop-filter:blur(8px);
}
.cta-section-inner::before{
  content:'';position:absolute;top:-40%;left:-20%;width:140%;height:180%;
  background:radial-gradient(circle 300px at 20% 50%,rgba(6,182,212,.06),transparent),radial-gradient(circle 250px at 80% 30%,rgba(59,130,246,.04),transparent);
}
.cta-content{text-align:center;position:relative;z-index:1}
.cta-content h2,.cta-title{font-size:clamp(1.8rem,4vw,3rem);margin-bottom:20px;color:var(--title-color)}
.cta-content p,.cta-description{color:var(--text-muted);font-size:17px;margin-bottom:36px;max-width:520px;margin-left:auto;margin-right:auto}
.cta-btn{
  display:inline-flex;align-items:center;gap:10px;
  padding:16px 36px;border-radius:var(--radius);
  background:linear-gradient(135deg,var(--orange),#ea580c);
  color:var(--white);font-family:var(--font-heading);font-weight:600;font-size:15px;
  transition:all .35s var(--transition);box-shadow:var(--glow-orange);
}
.cta-btn:hover{transform:translateY(-3px);box-shadow:0 0 40px rgba(249,115,22,.3),0 8px 32px rgba(249,115,22,.25)}
.cta-btn svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2}
.cta-box{
  padding:80px 48px;text-align:center;
  background:linear-gradient(180deg,rgba(6,182,212,.05),rgba(59,130,246,.03));
  border:1px solid rgba(6,182,212,.1);border-radius:var(--radius-xl);
  position:relative;overflow:hidden;
}
.cta-card{padding:48px;text-align:center}
.cta-contrib{margin-top:48px;text-align:center}

/* ═══════════ STAT VARIANTS ═══════════ */
.stat,.stat-item{padding:32px;text-align:center}
.stat-number,.stat-val{font-size:48px;font-weight:700;color:var(--cyan);font-family:var(--font-heading);line-height:1}
.stat-lbl,.stat-label{color:var(--text-dim);font-size:13px;font-weight:600;margin-top:12px;text-transform:uppercase;letter-spacing:2px}
.stats-bar{padding:60px 0;position:relative;z-index:10}
.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:28px}
.hero-stat,.hero-stat-item{text-align:center;padding:24px}
.hero-stat-value,.stat-value{font-size:42px;font-weight:700;color:var(--cyan);font-family:var(--font-heading);line-height:1}
.hero-stat-label{font-size:11px;color:var(--text-dim);text-transform:uppercase;letter-spacing:2.8px;margin-top:10px}
.hero-stats-grid,.hero-stats-row{display:flex;gap:24px;justify-content:center;flex-wrap:wrap;margin-top:32px}

/* ═══════════ PRODUCT CARD (product pages) ═══════════ */
.product-hero{padding:180px 0 80px;position:relative;z-index:10}
.product-hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.product-hero-text h1{font-size:clamp(2rem,5vw,3.5rem);margin-bottom:20px;color:var(--title-color)}
.product-hero-text p{color:var(--text-muted);font-size:17px;line-height:1.8;margin-bottom:36px}
.product-hero-visual{display:flex;align-items:center;justify-content:center}
.product-img-wrap{
  width:100%;aspect-ratio:16/10;border-radius:var(--radius-xl);overflow:hidden;
  border:1px solid rgba(6,182,212,.12);
  background:linear-gradient(135deg,rgba(6,182,212,.06),rgba(59,130,246,.04));
  display:flex;align-items:center;justify-content:center;
}
.product-img-wrap img{width:100%;height:100%;object-fit:cover}

/* ═══════════ PRODUCTS SECTION ═══════════ */
.products-section{padding:100px 0;position:relative;z-index:10}
.products-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:28px}
.product-card{
  padding:36px;position:relative;overflow:hidden;
  background:linear-gradient(180deg,rgba(15,15,42,.6),rgba(10,10,30,.5));
  backdrop-filter:blur(12px);border:1px solid rgba(6,182,212,.08);
  border-radius:var(--radius-lg);transition:all .4s var(--transition);
}
.product-card:hover{border-color:var(--border-glow);box-shadow:0 16px 40px rgba(6,182,212,.06);transform:translateY(-4px)}
.product-icon-wrap{width:64px;height:64px;border-radius:18px;margin-bottom:24px;display:flex;align-items:center;justify-content:center}
.product-icon{width:48px;height:48px;border-radius:14px;display:flex;align-items:center;justify-content:center}
.cyan-glow{background:rgba(6,182,212,.1);border:1px solid rgba(6,182,212,.15);color:var(--cyan)}
.purple-glow{background:rgba(139,92,246,.1);border:1px solid rgba(139,92,246,.15);color:var(--purple)}
.product-icon svg{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:1.5}
.product-body h3{font-size:20px;font-weight:700;margin-bottom:8px;color:var(--title-color)}
.product-subtitle{font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:1.5px;margin-bottom:12px}
.product-subtitle.cyan{color:var(--cyan)}
.product-subtitle.purple{color:var(--purple)}
.product-body p{color:var(--text-muted);font-size:14px;line-height:1.7;margin-bottom:20px}
.product-features{list-style:none;margin-bottom:24px}
.product-features li{padding:8px 0;font-size:14px;color:var(--text);display:flex;align-items:center;gap:10px;border-bottom:1px solid rgba(6,182,212,.06)}
.product-features li:last-child{border-bottom:none}
.product-footer{margin-top:auto}
.product-pricing{font-size:14px;color:var(--text-dim);margin-top:8px}

/* ═══════════ BENEFITS SECTION ═══════════ */
.benefits-section{padding:100px 0;position:relative;z-index:10}
.benefits-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:28px}
.benefit-card{
  padding:32px;display:flex;gap:16px;align-items:flex-start;
  background:linear-gradient(180deg,rgba(15,15,42,.6),rgba(10,10,30,.5));
  backdrop-filter:blur(12px);border:1px solid rgba(6,182,212,.08);
  border-radius:var(--radius-lg);transition:all .4s var(--transition);
}
.benefit-card:hover{border-color:var(--border-glow);box-shadow:0 16px 40px rgba(6,182,212,.06);transform:translateY(-3px)}
.benefit-icon{width:48px;height:48px;border-radius:14px;background:rgba(6,182,212,.08);border:1px solid rgba(6,182,212,.12);display:flex;align-items:center;justify-content:center;color:var(--cyan);flex-shrink:0}
.benefit-icon svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.5}
.benefit-card h3{font-size:16px;font-weight:700;margin-bottom:6px;color:var(--title-color)}
.benefit-card p{color:var(--text-muted);font-size:14px;line-height:1.65}

/* ═══════════ FEATURES LIST (product pages) ═══════════ */
.features-section{padding:100px 0;position:relative;z-index:10}
.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:28px}
.feature-item{
  padding:36px;display:flex;gap:20px;align-items:flex-start;
  background:linear-gradient(180deg,rgba(15,15,42,.6),rgba(10,10,30,.5));
  backdrop-filter:blur(12px);border:1px solid rgba(6,182,212,.08);
  border-radius:var(--radius-lg);transition:all .4s var(--transition);
}
.feature-item:hover{border-color:var(--border-glow);box-shadow:0 16px 40px rgba(6,182,212,.06);transform:translateY(-3px)}
.feature-icon{
  width:56px;height:56px;border-radius:16px;flex-shrink:0;
  background:rgba(6,182,212,.08);border:1px solid rgba(6,182,212,.12);
  display:flex;align-items:center;justify-content:center;color:var(--cyan);
}
.feature-icon svg{width:26px;height:26px;stroke:currentColor;fill:none;stroke-width:1.5}
.feature-item h3{font-size:18px;font-weight:700;margin-bottom:8px;color:var(--title-color)}
.feature-item p{color:var(--text-muted);font-size:14px;line-height:1.7}

/* ═══════════ PORTFOLIO PAGE ═══════════ */
.filter-bar{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-bottom:48px}
.filter-btn{
  padding:10px 24px;border-radius:50px;border:1px solid rgba(6,182,212,.12);
  background:rgba(15,15,42,.4);color:var(--text-muted);font-size:14px;font-weight:600;
  cursor:pointer;transition:all .3s;font-family:var(--font-body);
}
.filter-btn:hover,.filter-btn.active{background:rgba(6,182,212,.1);border-color:var(--cyan);color:var(--cyan)}

.portfolio-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(360px,1fr));gap:28px}
.portfolio-card{
  position:relative;overflow:hidden;border-radius:var(--radius-lg);
  border:1px solid rgba(6,182,212,.08);
  background:linear-gradient(180deg,rgba(15,15,42,.6),rgba(10,10,30,.5));
  transition:all .5s var(--transition);
}
.portfolio-card:hover{border-color:var(--border-glow);box-shadow:0 24px 60px rgba(6,182,212,.08)}
.portfolio-card-img{overflow:hidden}
.portfolio-card-img img{width:100%;height:280px;object-fit:cover;transition:transform .65s var(--transition)}
.portfolio-card:hover .portfolio-card-img img{transform:scale(1.05)}
.portfolio-card-content{
  padding:24px 28px 28px;
}
.portfolio-card-tag{
  display:inline-flex;align-items:center;gap:6px;
  padding:6px 14px;border-radius:8px;font-size:11px;font-weight:600;
  background:rgba(6,182,212,.15);color:var(--cyan);width:fit-content;margin-bottom:12px;
  letter-spacing:.5px;text-transform:uppercase;
}
.portfolio-card-tag svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2}
.portfolio-card-title{font-size:22px;font-weight:700;color:var(--title-color);margin-bottom:8px}
.portfolio-card-desc{color:var(--text-muted);font-size:14px;line-height:1.7;margin-bottom:16px}
.portfolio-card-link{
  display:inline-flex;align-items:center;gap:8px;color:var(--cyan);font-weight:600;font-size:14px;transition:all .3s;
}
.portfolio-card-link:hover{gap:14px}
.portfolio-card-link svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2}
.portfolio-bg,.portfolio-content{position:relative;z-index:2}
.portfolio-overlay{position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(5,5,16,.9));display:flex;flex-direction:column;justify-content:flex-end;padding:32px}
.portfolio-tag{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:8px;font-size:11px;font-weight:600;background:rgba(6,182,212,.15);color:var(--cyan);width:fit-content;margin-bottom:12px;letter-spacing:.5px;text-transform:uppercase}

/* ═══════════ BLOG PAGE ═══════════ */
.blog-hero{padding:180px 0 80px;text-align:center;position:relative;z-index:10;background:linear-gradient(180deg,rgba(5,5,16,.7),rgba(5,5,16,.4))}
.blog-grid-page{display:grid;grid-template-columns:repeat(auto-fill,minmax(360px,1fr));gap:28px}
.blog-card-page{
  overflow:hidden;text-decoration:none;color:inherit;cursor:pointer;display:block;
  border-radius:var(--radius-lg);
  background:linear-gradient(180deg,rgba(15,15,42,.6),rgba(10,10,30,.5));
  backdrop-filter:blur(12px);border:1px solid rgba(6,182,212,.08);
  transition:transform .45s var(--transition),box-shadow .45s var(--transition);
}
.blog-card-page:hover{transform:translateY(-6px);box-shadow:0 20px 50px rgba(6,182,212,.08)}
.blog-card-page .blog-img{height:240px;overflow:hidden;position:relative}
.blog-card-page .blog-img img{width:100%;height:100%;object-fit:cover;transition:transform .65s var(--transition)}
.blog-card-page:hover .blog-img img{transform:scale(1.05)}
.blog-card-page .blog-body{padding:28px}
.blog-card-page .blog-body h3{font-size:20px;font-weight:700;margin-bottom:12px;color:var(--title-color)}
.blog-card-page .blog-body p{color:var(--text-muted);font-size:14px;line-height:1.75;margin-bottom:18px}
.blog-empty{text-align:center;padding:80px 0;position:relative;z-index:10}
.blog-loading{display:flex;align-items:center;justify-content:center;padding:80px 0;position:relative;z-index:10}
.loader-spinner{width:40px;height:40px;border:3px solid rgba(6,182,212,.15);border-top-color:var(--cyan);border-radius:50%;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* ═══════════ BLOG POST ═══════════ */
.blog-post{position:relative;z-index:10}
.blog-post-hero{padding:180px 0 60px;text-align:center;position:relative;z-index:10;background:linear-gradient(180deg,rgba(5,5,16,.7),rgba(5,5,16,.4))}
.blog-post-loading{display:flex;align-items:center;justify-content:center;padding:120px 0;position:relative;z-index:10}
.blog-post-error{text-align:center;padding:120px 0;position:relative;z-index:10}
.blog-post-inner{position:relative;z-index:10}
.blog-back-link{display:inline-flex;align-items:center;gap:8px;color:var(--cyan);font-weight:600;font-size:14px;margin-bottom:32px;transition:all .3s}
.blog-back-link:hover{gap:14px}
.blog-post-tag{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:8px;font-size:11px;font-weight:600;background:rgba(6,182,212,.15);color:var(--cyan);width:fit-content;margin-bottom:16px;letter-spacing:.5px;text-transform:uppercase}
.blog-post-meta{display:flex;gap:20px;justify-content:center;flex-wrap:wrap;margin-top:16px}
.meta-author-text,.meta-date-text,.meta-read-text{font-size:13px;color:var(--text-dim);display:flex;align-items:center;gap:6px}
.blog-post-nav{display:flex;gap:20px;justify-content:center;margin-top:48px;position:relative;z-index:10}
.blog-post-meta svg,.blog-back-link svg,.blog-post-nav svg{width:16px;height:16px;flex-shrink:0}
.blog-post-content{max-width:760px;margin:40px auto 0;color:var(--text);font-size:16px;line-height:1.8}
.blog-post-content h2{font-size:24px;font-weight:700;margin:40px 0 16px;color:var(--title-color)}
.blog-post-content h3{font-size:20px;font-weight:700;margin:32px 0 12px;color:var(--title-color)}
.blog-post-content p{margin-bottom:20px}
.blog-post-content ul,.blog-post-content ol{margin:0 0 20px 24px}
.blog-post-content li{margin-bottom:8px}
.blog-post-content img{width:100%;border-radius:var(--radius);margin:24px 0}
.blog-post-content blockquote{border-left:3px solid var(--cyan);padding:16px 24px;margin:24px 0;background:rgba(6,182,212,.04);border-radius:0 var(--radius) var(--radius) 0;font-style:italic;color:var(--text-muted)}
.related-section{padding:80px 0;position:relative;z-index:10}
.related-header{text-align:center;margin-bottom:40px}
.related-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:28px}

/* ═══════════ ABOUT PAGE ═══════════ */
.nosotros-hero{padding:180px 0 100px;text-align:center;position:relative;z-index:10;background:linear-gradient(180deg,rgba(5,5,16,.7),rgba(5,5,16,.4))}
.about-values{padding:100px 0;position:relative;z-index:10}
.values-section,.values-header{position:relative;z-index:10}
.values-header{text-align:center;margin-bottom:64px}
.values-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:28px}
.value-card{
  padding:40px;text-align:center;
  background:linear-gradient(180deg,rgba(15,15,42,.6),rgba(10,10,30,.5));
  backdrop-filter:blur(12px);border:1px solid rgba(6,182,212,.08);
  border-radius:var(--radius-lg);transition:all .4s var(--transition);
}
.value-card:hover{border-color:var(--border-glow);box-shadow:0 16px 40px rgba(6,182,212,.06);transform:translateY(-4px)}
.value-icon{
  width:72px;height:72px;border-radius:20px;margin:0 auto 24px;
  background:rgba(6,182,212,.08);border:1px solid rgba(6,182,212,.12);
  display:flex;align-items:center;justify-content:center;color:var(--cyan);
}
.value-icon svg{width:32px;height:32px;stroke:currentColor;fill:none;stroke-width:1.5}
.value-card h3{font-size:20px;font-weight:700;margin-bottom:12px;color:var(--title-color)}
.value-card p{color:var(--text-muted);font-size:14px;line-height:1.75}

/* ═══════════ STORY SECTION ═══════════ */
.story-section{padding:100px 0;position:relative;z-index:10}
.story-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.story-content{position:relative;z-index:2}
.story-tag{display:inline-flex;align-items:center;gap:8px;padding:9px 20px;border-radius:50px;background:rgba(6,182,212,.06);border:1px solid rgba(6,182,212,.14);color:var(--cyan);font-size:12px;font-weight:600;letter-spacing:2.2px;text-transform:uppercase;margin-bottom:20px}
.story-content h2{font-size:clamp(2rem,4vw,3.2rem);margin-bottom:20px;color:#0f172a}
.story-content p{color:var(--text-muted);font-size:16px;line-height:1.85;margin-bottom:16px}
.story-visual{position:relative;display:flex;align-items:center;justify-content:center}
.story-img{width:100%;border-radius:var(--radius-xl);overflow:hidden;border:1px solid rgba(6,182,212,.1);position:relative;z-index:2}
.story-img-inner{width:100%;aspect-ratio:4/3;background:linear-gradient(135deg,rgba(6,182,212,.08),rgba(139,92,246,.06));display:flex;align-items:center;justify-content:center}
.story-img img{width:100%;height:100%;object-fit:cover}

/* ═══════════ TEAM SECTION ═══════════ */
.team-section{padding:100px 0;position:relative;z-index:10}
.team-header{text-align:center;margin-bottom:64px}
.team-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:28px}
.team-card{
  padding:36px;text-align:center;
  background:linear-gradient(180deg,rgba(15,15,42,.6),rgba(10,10,30,.5));
  backdrop-filter:blur(12px);border:1px solid rgba(6,182,212,.08);
  border-radius:var(--radius-lg);transition:all .4s var(--transition);
}
.team-card:hover{border-color:var(--border-glow);box-shadow:0 16px 40px rgba(6,182,212,.06);transform:translateY(-4px)}
.team-avatar{
  width:80px;height:80px;border-radius:50%;margin:0 auto 20px;
  background:linear-gradient(135deg,rgba(6,182,212,.15),rgba(139,92,246,.1));
  border:2px solid rgba(6,182,212,.2);display:flex;align-items:center;justify-content:center;
  font-size:28px;font-weight:700;color:var(--cyan);font-family:var(--font-heading);
}
.team-avatar-1{background:linear-gradient(135deg,rgba(6,182,212,.2),rgba(6,182,212,.05))}
.team-avatar-2{background:linear-gradient(135deg,rgba(59,130,246,.2),rgba(59,130,246,.05))}
.team-avatar-3{background:linear-gradient(135deg,rgba(139,92,246,.2),rgba(139,92,246,.05))}
.team-avatar-4{background:linear-gradient(135deg,rgba(249,115,22,.2),rgba(249,115,22,.05))}
.team-card h3{font-size:18px;font-weight:700;margin-bottom:4px;color:var(--title-color)}
.team-role{font-size:13px;color:var(--cyan);font-weight:600;text-transform:uppercase;letter-spacing:1px}

/* ═══════════ SEO PAGE ═══════════ */
.seo-hero{padding:180px 0 100px;position:relative;z-index:10;background:linear-gradient(180deg,rgba(5,5,16,.7),rgba(5,5,16,.4))}
.seo-hero-content{max-width:700px;margin:0 auto;text-align:center}
.seo-hero-tag{display:inline-flex;align-items:center;gap:8px;padding:9px 20px;border-radius:50px;background:rgba(6,182,212,.06);border:1px solid rgba(6,182,212,.14);color:var(--cyan);font-size:12px;font-weight:600;letter-spacing:2.2px;text-transform:uppercase;margin-bottom:24px}
.seo-hero h1{font-size:clamp(2.5rem,6vw,4.5rem);font-weight:700;line-height:1.08;letter-spacing:-.035em;margin:20px 0 24px;color:var(--white)}
.seo-hero-content>p{color:rgba(255,255,255,.7);font-size:18px;line-height:1.8;margin-bottom:36px}
.seo-hero-stats{display:flex;gap:32px;justify-content:center;flex-wrap:wrap;margin-top:40px}
.seo-hero-stat{text-align:center;padding:20px 28px;background:rgba(15,15,42,.4);border:1px solid rgba(6,182,212,.08);border-radius:var(--radius)}
.stat-value{font-size:36px;font-weight:700;color:var(--cyan);font-family:var(--font-heading);line-height:1}
.seo-hero-stat p{font-size:12px;color:var(--text-dim);text-transform:uppercase;letter-spacing:1.5px;margin-top:8px}
.seo-section{padding:100px 0;position:relative;z-index:10}
.seo-section-title{font-size:clamp(2rem,4vw,3.2rem);text-align:center;margin-bottom:16px;color:var(--title-color)}
.seo-section-subtitle{color:var(--text-muted);font-size:17px;text-align:center;max-width:520px;margin:0 auto 64px}
.seo-services-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:28px}
.seo-service-card{
  padding:36px;
  background:linear-gradient(180deg,rgba(15,15,42,.6),rgba(10,10,30,.5));
  backdrop-filter:blur(12px);border:1px solid rgba(6,182,212,.08);
  border-radius:var(--radius-lg);transition:all .4s var(--transition);
}
.seo-service-card:hover{border-color:var(--border-glow);box-shadow:0 16px 40px rgba(6,182,212,.06);transform:translateY(-4px)}
.seo-service-icon{width:56px;height:56px;border-radius:16px;background:rgba(6,182,212,.08);border:1px solid rgba(6,182,212,.12);display:flex;align-items:center;justify-content:center;color:var(--cyan);margin-bottom:20px}
.seo-service-icon svg{width:26px;height:26px;stroke:currentColor;fill:none;stroke-width:1.5}
.seo-service-card h3{font-size:18px;font-weight:700;margin-bottom:10px;color:var(--title-color)}
.seo-service-card p{color:var(--text-muted);font-size:14px;line-height:1.7}
.seo-results{padding:100px 0;position:relative;z-index:10}
.seo-results-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:24px}
.seo-result-card{
  padding:32px;text-align:center;
  background:rgba(15,15,42,.4);border:1px solid rgba(6,182,212,.08);
  border-radius:var(--radius-lg);transition:all .3s;
}
.seo-result-card:hover{border-color:var(--cyan);box-shadow:0 0 20px rgba(6,182,212,.08)}
.seo-result-metric{font-size:42px;font-weight:700;color:var(--cyan);font-family:var(--font-heading);line-height:1}
.seo-result-label{font-size:13px;color:var(--text-dim);text-transform:uppercase;letter-spacing:1.5px;margin-top:10px}
.seo-process{padding:100px 0;position:relative;z-index:10}
.seo-process-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:28px}
.seo-process-step{
  padding:36px;text-align:center;
  background:linear-gradient(180deg,rgba(15,15,42,.6),rgba(10,10,30,.5));
  backdrop-filter:blur(12px);border:1px solid rgba(6,182,212,.08);
  border-radius:var(--radius-lg);transition:all .4s var(--transition);
}
.seo-process-step:hover{border-color:var(--border-glow);box-shadow:0 16px 40px rgba(6,182,212,.06);transform:translateY(-4px)}
.seo-process-number{font-size:48px;font-weight:700;font-family:var(--font-heading);background:linear-gradient(135deg,var(--cyan),var(--blue));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:20px;line-height:1;opacity:.6}
.seo-process-step h3{font-size:18px;font-weight:700;margin-bottom:10px;color:var(--title-color)}
.seo-process-step p{color:var(--text-muted);font-size:14px;line-height:1.7}
.seo-cta{text-align:center;padding:80px 0;position:relative;z-index:10}
.seo-cta-btn{
  display:inline-flex;align-items:center;gap:10px;
  padding:16px 36px;border-radius:var(--radius);
  background:linear-gradient(135deg,var(--orange),#ea580c);
  color:var(--white);font-family:var(--font-heading);font-weight:600;font-size:15px;
  transition:all .35s var(--transition);box-shadow:var(--glow-orange);
}
.seo-cta-btn:hover{transform:translateY(-3px);box-shadow:0 0 40px rgba(249,115,22,.3),0 8px 32px rgba(249,115,22,.25)}

/* ═══════════ BEAM CRM / PRICING ═══════════ */
.pricing-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:28px}
.pricing-card{
  padding:40px;position:relative;
  background:linear-gradient(180deg,rgba(15,15,42,.6),rgba(10,10,30,.5));
  backdrop-filter:blur(12px);border:1px solid rgba(6,182,212,.08);
  border-radius:var(--radius-lg);transition:all .4s var(--transition);
}
.pricing-card:hover{border-color:var(--border-glow);box-shadow:0 16px 40px rgba(6,182,212,.06);transform:translateY(-4px)}
.pricing-card.highlighted{border-color:var(--cyan);box-shadow:0 0 30px rgba(6,182,212,.1)}
.pricing-tier{font-size:12px;font-weight:700;color:var(--cyan);text-transform:uppercase;letter-spacing:2px;margin-bottom:12px}
.pricing-price{font-size:42px;font-weight:700;color:var(--title-color);font-family:var(--font-heading);margin-bottom:8px}
.pricing-desc{color:var(--text-muted);font-size:14px;line-height:1.7;margin-bottom:24px}
.pricing-features{list-style:none;margin-bottom:32px}
.pricing-features li{padding:10px 0;font-size:14px;color:var(--text);display:flex;align-items:center;gap:10px;border-bottom:1px solid rgba(6,182,212,.06)}
.pricing-features li:last-child{border-bottom:none}

/* ═══════════ WP CODE CLONER ═══════════ */
.wcc-hero{padding:180px 0 100px;text-align:center;position:relative;z-index:10;background:linear-gradient(180deg,rgba(5,5,16,.7),rgba(5,5,16,.4))}
.wcc-hero h1{font-size:clamp(2.5rem,6vw,4.5rem);font-weight:700;line-height:1.08;letter-spacing:-.035em;margin:20px 0 24px;color:var(--white)}
.wcc-hero-stats{display:flex;gap:20px;justify-content:center;flex-wrap:wrap;margin-top:40px}
.wcc-hero-stat{text-align:center;padding:20px 28px;background:rgba(15,15,42,.4);border:1px solid rgba(6,182,212,.08);border-radius:var(--radius)}
.wcc-hero-stat-num{font-size:36px;font-weight:700;color:var(--cyan);font-family:var(--font-heading);line-height:1}
.wcc-hero-stat-label{font-size:12px;color:var(--text-dim);text-transform:uppercase;letter-spacing:1.5px;margin-top:8px}
.wcc-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:28px;margin-top:80px}
.wcc-step{
  padding:36px;text-align:center;
  background:linear-gradient(180deg,rgba(15,15,42,.6),rgba(10,10,30,.5));
  backdrop-filter:blur(12px);border:1px solid rgba(6,182,212,.08);
  border-radius:var(--radius-lg);transition:all .4s var(--transition);
}
.wcc-step:hover{border-color:var(--border-glow);box-shadow:0 16px 40px rgba(6,182,212,.06);transform:translateY(-4px)}
.wcc-step-num{font-size:48px;font-weight:700;font-family:var(--font-heading);background:linear-gradient(135deg,var(--cyan),var(--blue));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:20px;line-height:1;opacity:.6}
.wcc-step h3{font-size:18px;font-weight:700;margin-bottom:10px;color:var(--title-color)}
.wcc-step p{color:var(--text-muted);font-size:14px;line-height:1.7}
.wcc-pricing-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:28px;margin-top:80px}
.wcc-price-card{
  padding:40px;position:relative;
  background:linear-gradient(180deg,rgba(15,15,42,.6),rgba(10,10,30,.5));
  backdrop-filter:blur(12px);border:1px solid rgba(6,182,212,.08);
  border-radius:var(--radius-lg);transition:all .4s var(--transition);
}
.wcc-price-card:hover{border-color:var(--border-glow);box-shadow:0 16px 40px rgba(6,182,212,.06);transform:translateY(-4px)}
.wcc-price-card.featured{border-color:var(--cyan);box-shadow:0 0 30px rgba(6,182,212,.1)}
.wcc-price-name{font-size:12px;font-weight:700;color:var(--cyan);text-transform:uppercase;letter-spacing:2px;margin-bottom:12px}
.wcc-price-amount{font-size:42px;font-weight:700;color:var(--title-color);font-family:var(--font-heading);margin-bottom:8px}
.wcc-price-desc{color:var(--text-muted);font-size:14px;line-height:1.7;margin-bottom:24px}
.wcc-price-features{list-style:none;margin-bottom:32px}
.wcc-price-features li{padding:10px 0;font-size:14px;color:var(--text);display:flex;align-items:center;gap:10px;border-bottom:1px solid rgba(6,182,212,.06)}
.wcc-price-features li:last-child{border-bottom:none}

/* ═══════════ E-COMMERCE PAGE ═══════════ */
.platforms-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px;margin-top:48px}
.platform-card{
  padding:28px;text-align:center;
  background:rgba(15,15,42,.4);border:1px solid rgba(6,182,212,.08);
  border-radius:var(--radius);transition:all .3s;
}
.platform-card:hover{border-color:var(--cyan);background:rgba(6,182,212,.06);box-shadow:0 0 20px rgba(6,182,212,.08)}
.platform-icon{width:48px;height:48px;border-radius:14px;background:rgba(6,182,212,.08);border:1px solid rgba(6,182,212,.12);display:flex;align-items:center;justify-content:center;color:var(--cyan);margin:0 auto 12px}
.platform-icon svg{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:1.5}
.platform-card h4{font-size:14px;font-weight:700;color:var(--title-color);margin-bottom:4px}
.platform-card p{font-size:12px;color:var(--text-dim)}

/* ═══════════ UX/UI PAGE ═══════════ */
.ba-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:28px;margin-top:48px}
.ba-card{
  overflow:hidden;border-radius:var(--radius-lg);
  border:1px solid rgba(6,182,212,.08);background:rgba(15,15,42,.5);
  transition:all .4s var(--transition);
}
.ba-card:hover{border-color:var(--border-glow);box-shadow:0 16px 40px rgba(6,182,212,.06)}
.ba-card img{width:100%;height:220px;object-fit:cover}
.ba-arrow{display:flex;align-items:center;justify-content:center;color:var(--cyan);opacity:.4;font-size:24px;padding:20px 0}
.ba-label{padding:16px 20px;font-size:13px;font-weight:600;color:var(--cyan);letter-spacing:.5px;text-transform:uppercase}
.ba-label-before{color:var(--text-dim)}
.ba-label-after{color:var(--cyan)}

/* ═══════════ UX TRANSFORMATION CARDS ═══════════ */
.ux-trans-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:28px;margin-top:48px}
.ux-trans-card{
  padding:32px;
  background:linear-gradient(180deg,rgba(15,15,42,.6),rgba(10,10,30,.5));
  backdrop-filter:blur(12px);border:1px solid rgba(6,182,212,.08);
  border-radius:var(--radius-lg);transition:all .4s var(--transition);
}
.ux-trans-card:hover{border-color:var(--border-glow);box-shadow:0 16px 40px rgba(6,182,212,.06);transform:translateY(-4px)}
.ux-trans-visual{display:flex;align-items:center;gap:16px;margin-bottom:24px}
.ux-trans-before,.ux-trans-after{flex:1;text-align:center}
.ux-trans-mockup{
  padding:20px;border-radius:var(--radius);
  background:rgba(6,182,212,.04);border:1px solid rgba(6,182,212,.08);
  min-height:140px;display:flex;flex-direction:column;gap:10px;align-items:stretch;
}
.ux-trans-messy .ux-mock-bar{height:12px;background:rgba(6,182,212,.15);border-radius:4px}
.ux-trans-messy .ux-mock-row{display:flex;gap:8px}
.ux-trans-messy .ux-mock-block{height:24px;flex:1;background:rgba(6,182,212,.1);border-radius:4px}
.ux-trans-messy .ux-mock-block.sm{flex:.4}
.ux-trans-messy .ux-mock-block.full{flex:1}
.ux-trans-messy .ux-mock-btn{height:20px;width:60%;margin:4px auto 0;border-radius:10px;background:rgba(6,182,212,.2)}
.ux-trans-messy .ux-mock-btn.bad{background:rgba(239,68,68,.2);border:1px solid rgba(239,68,68,.2)}

.ux-trans-clean .ux-mock-bar{height:12px;background:rgba(6,182,212,.25);border-radius:4px}
.ux-trans-clean .ux-mock-bar.clean{background:linear-gradient(90deg,var(--cyan),var(--blue))}
.ux-trans-clean .ux-mock-row{display:flex;justify-content:center}
.ux-trans-clean .ux-mock-block{height:20px;background:rgba(6,182,212,.12);border-radius:6px}
.ux-trans-clean .ux-mock-block.big{width:80%}
.ux-trans-clean .ux-mock-block.med{width:60%}
.ux-trans-clean .ux-mock-btn{height:20px;width:50%;margin:4px auto 0;border-radius:10px;background:linear-gradient(135deg,var(--cyan),var(--blue))}

.ux-trans-arrow{color:var(--cyan);opacity:.6;flex-shrink:0}
.ux-trans-arrow svg{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:2}

.ux-trans-label{
  display:inline-block;margin-top:10px;font-size:10px;font-weight:700;letter-spacing:2px;text-transform:uppercase;
  color:var(--text-dim);
}
.ux-trans-label.after{color:var(--cyan)}

.ux-trans-generic .ux-mock-avatar{width:40px;height:40px;border-radius:50%;margin:0 auto 10px}
.ux-trans-generic .ux-mock-avatar.gray{background:rgba(148,163,184,.3)}
.ux-trans-generic .ux-mock-text{display:flex;flex-direction:column;gap:6px;margin-bottom:10px}
.ux-trans-generic .ux-mock-line{height:8px;background:rgba(148,163,184,.2);border-radius:4px}
.ux-trans-generic .ux-mock-line.short{width:60%}
.ux-trans-generic .ux-mock-cards{display:flex;gap:8px}
.ux-trans-generic .ux-mock-card{flex:1;height:32px;background:rgba(148,163,184,.15);border-radius:6px}

.ux-trans-branded .ux-mock-avatar.brand{background:linear-gradient(135deg,var(--cyan),var(--blue))}
.ux-trans-branded .ux-mock-line.cyan{background:rgba(6,182,212,.3)}
.ux-trans-branded .ux-mock-card.brand{background:rgba(6,182,212,.15);border:1px solid rgba(6,182,212,.2)}

.ux-trans-static .ux-mock-box{height:28px;border-radius:6px;margin-bottom:8px}
.ux-trans-static .ux-mock-box.flat{background:rgba(148,163,184,.15)}

.ux-trans-dynamic .ux-mock-box{height:28px;border-radius:6px;margin-bottom:8px}
.ux-trans-dynamic .ux-mock-box.anim{background:linear-gradient(90deg,rgba(6,182,212,.2),rgba(139,92,246,.2));animation:uxPulse 2s ease-in-out infinite}
.ux-trans-dynamic .ux-mock-box.delay{animation-delay:.3s}
.ux-trans-dynamic .ux-mock-box.delay2{animation-delay:.6s}
@keyframes uxPulse{0%,100%{opacity:.4;transform:scaleX(.95)}50%{opacity:1;transform:scaleX(1)}}

.ux-trans-info h3{font-size:18px;font-weight:700;margin-bottom:8px;color:var(--title-color)}
.ux-trans-info p{color:var(--text-muted);font-size:14px;line-height:1.7}
.ba-card .ba-label{padding:16px 20px;font-size:13px;font-weight:600;color:var(--cyan);letter-spacing:.5px;text-transform:uppercase}
.ba-arrow{display:flex;align-items:center;justify-content:center;color:var(--cyan);opacity:.4;font-size:24px;padding:20px 0}
.ba-label-before{color:var(--text-dim)}
.ba-label-after{color:var(--cyan)}

/* ═══════════ DISENO GRAFICO PAGE ═══════════ */
.portfolio-bg{position:relative;border-radius:var(--radius-lg);overflow:hidden}
.portfolio-overlay{position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(5,5,16,.9));display:flex;flex-direction:column;justify-content:flex-end;padding:32px}
.portfolio-content{position:relative;z-index:2}
.portfolio-tag{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:8px;font-size:11px;font-weight:600;background:rgba(6,182,212,.15);color:var(--cyan);width:fit-content;margin-bottom:12px;letter-spacing:.5px;text-transform:uppercase}

/* ═══════════ TERMS / PRIVACY ═══════════ */
.legal-content{max-width:780px;margin:0 auto;padding:40px 28px;position:relative;z-index:10}
.legal-content h2{font-size:24px;margin:40px 0 16px;color:var(--title-color)}
.legal-content h3{font-size:20px;margin:28px 0 12px;color:var(--title-color)}
.legal-content p{color:var(--text-muted);font-size:15px;line-height:1.85;margin-bottom:16px}
.legal-content ul{margin:16px 0;padding-left:24px}
.legal-content li{color:var(--text-muted);font-size:15px;line-height:1.85;margin-bottom:8px}

/* ═══════════ PRIVACY PAGE ═══════════ */
.privacy-hero{padding:180px 0 80px;text-align:center;position:relative;z-index:10;background:linear-gradient(180deg,rgba(5,5,16,.7),rgba(5,5,16,.4))}
.privacy-hero h1{font-size:clamp(2.5rem,6vw,4.5rem);font-weight:700;line-height:1.08;letter-spacing:-.035em;margin:20px 0;color:var(--white)}
.privacy-hero .updated{display:flex;align-items:center;justify-content:center;gap:8px;color:rgba(255,255,255,.5);font-size:14px;margin-top:12px}
.privacy-hero .updated svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2}
.privacy-content{padding:60px 0;position:relative;z-index:10}
.privacy-card{
  max-width:800px;margin:0 auto;padding:48px;
  background:linear-gradient(180deg,rgba(15,15,42,.7),rgba(10,10,30,.6));
  backdrop-filter:blur(22px);border:1px solid rgba(6,182,212,.08);
  border-radius:var(--radius-lg);
}
.privacy-card h2{font-size:22px;font-weight:700;margin:36px 0 14px;color:var(--title-color);display:flex;align-items:center;gap:12px}
.privacy-card h2:first-child{margin-top:0}
.privacy-card p{color:var(--text-muted);font-size:15px;line-height:1.85;margin-bottom:16px}
.section-num{
  display:inline-flex;align-items:center;justify-content:center;
  width:36px;height:36px;border-radius:10px;flex-shrink:0;
  background:rgba(6,182,212,.1);border:1px solid rgba(6,182,212,.15);
  color:var(--cyan);font-size:16px;font-weight:700;
}
.privacy-divider{height:1px;background:rgba(6,182,212,.08);margin:24px 0}

/* ═══════════ BA GRID (before/after) ═══════════ */
.ba-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:28px;margin-top:48px}

/* ═══════════ BUTTON VARIANTS ═══════════ */
.btn-purple{
  background:linear-gradient(135deg,#7c3aed,var(--purple));
  color:var(--white);box-shadow:0 0 20px rgba(139,92,246,.2);
}
.btn-purple:hover{transform:translateY(-3px);box-shadow:0 0 40px rgba(139,92,246,.3),0 8px 32px rgba(139,92,246,.25)}
.btn-orange{
  background:linear-gradient(135deg,#c2410c,var(--orange),#fb923c);
  color:var(--white);box-shadow:0 0 20px rgba(249,115,22,.2);
}
.btn-orange:hover{transform:translateY(-3px);box-shadow:0 0 40px rgba(249,115,22,.3),0 8px 32px rgba(249,115,22,.25)}

/* ═══════════ RESPONSIVE (subpages) ═══════════ */
@media(max-width:768px){
  .page-hero,.page-hero-bg{padding:140px 0 60px}
  .page-hero h1,.page-title{font-size:2.2rem}
  .services-grid{grid-template-columns:1fr}
  .process-steps,.process-grid{grid-template-columns:1fr}
  .product-hero-grid{grid-template-columns:1fr;gap:40px}
  .features-grid{grid-template-columns:1fr}
  .portfolio-grid{grid-template-columns:1fr}
  .blog-grid-page{grid-template-columns:1fr}
  .values-grid{grid-template-columns:1fr}
  .ba-grid{grid-template-columns:1fr}
  .hero-stats{flex-direction:column;align-items:center}
  .story-grid{grid-template-columns:1fr;gap:48px}
  .team-grid{grid-template-columns:1fr}
  .seo-hero-stats,.wcc-hero-stats{flex-direction:column;align-items:center}
  .seo-services-grid,.seo-results-grid,.seo-process-grid{grid-template-columns:1fr}
  .pricing-grid,.wcc-pricing-grid{grid-template-columns:1fr}
  .platforms-grid{grid-template-columns:1fr}
  .stats-grid{grid-template-columns:1fr}
  .hero-stats-grid,.hero-stats-row{flex-direction:column;align-items:center}
  .cta-section-inner{padding:60px 28px}
  .cta-box{padding:48px 28px}
  .privacy-card{padding:28px}
  .content-section{padding:2rem}
}

/* ═══════════ SEC-WHITE DARK TEXT OVERRIDES ═══════════ */
.sec-white .page-title,
.sec-white .section-header h2,.sec-white .section-title,
.sec-white .process-header h2,
.sec-white .cta-content h2,.sec-white .cta-title,
.sec-white .product-hero-text h1,
.sec-white .seo-section-title,
.sec-white .legal-content h2,.sec-white .legal-content h3,
.sec-white .privacy-card h2{color:#0f172a !important}

.sec-white .content-section h2,.sec-white .content-section h3,
.sec-white .service-card h3,.sec-white .service-title,
.sec-white .tech-item h4,.sec-white .tech-title,
.sec-white .process-step h3,.sec-white .process-title,
.sec-white .product-body h3,
.sec-white .benefit-card h3,
.sec-white .feature-item h3,
.sec-white .portfolio-card-title,
.sec-white .blog-card-page .blog-body h3,
.sec-white .blog-post-content h2,.sec-white .blog-post-content h3,
.sec-white .value-card h3,
.sec-white .team-card h3,
.sec-white .seo-service-card h3,
.sec-white .seo-process-step h3,
.sec-white .wcc-step h3,
.sec-white .platform-card h4{color:#0f172a !important}

.sec-white .content-section p,.sec-white .service-card p,
.sec-white .tech-item p,.sec-white .process-step p,
.sec-white .product-body p,.sec-white .benefit-card p,
.sec-white .feature-item p,.sec-white .portfolio-card-desc,
.sec-white .blog-card-page .blog-body p,.sec-white .blog-post-content p,
.sec-white .value-card p,.sec-white .team-card p,
.sec-white .seo-service-card p,.sec-white .seo-process-step p,
.sec-white .wcc-step p,.sec-white .platform-card p,
.sec-white .page-hero-desc,.sec-white .hero-desc,
.sec-white .section-description,
.sec-white .pricing-desc{color:#475569 !important}

.sec-white .pricing-price,.sec-white .wcc-price-amount{color:#0f172a !important}
.sec-white .pricing-features li,.sec-white .wcc-price-features li,
.sec-white .product-features li{color:#475569 !important}
.sec-white .btn-outline{color:#0891b2 !important;border-color:rgba(6,182,212,.3) !important}
.sec-white .tag{background:rgba(6,182,212,.08) !important;border-color:rgba(6,182,212,.18) !important;color:#0891b2 !important}
.sec-white .filter-btn{background:rgba(248,250,252,.8) !important;border-color:rgba(6,182,212,.15) !important;color:#475569 !important}
.sec-white .filter-btn:hover,.sec-white .filter-btn.active{background:rgba(6,182,212,.08) !important;border-color:#0891b2 !important;color:#0891b2 !important}
.sec-white li,.sec-white ul li{color:#475569 !important}