/* ============================================================
   EnterFirst.io — Page-Specific Component Styles (pages.css)
   Covers: legal pages, error pages, blog, portfolio, team,
   careers, products, services, contact, pricing, templates,
   about, partners, testimonials, and shared utilities.
   ============================================================ */

/* ── Shared Utilities ──────────────────────────────────── */
.x-small       { font-size: .75rem; }
.letter-spacing-1 { letter-spacing: .1em; }
.hover-primary:hover { color: var(--primary) !important; }
.scroll-to-top {
  position: fixed; bottom: 90px; right: 28px; z-index: 998;
  width: 40px; height: 40px; border-radius: 50%;
  background: linear-gradient(135deg,#6366F1,#8B5CF6);
  color:#fff; border:none; cursor:pointer; font-size:.9rem;
  display:flex; align-items:center; justify-content:center;
  opacity:0; pointer-events:none; transition:.3s;
}
.scroll-to-top.show { opacity:1; pointer-events:auto; }
.cta-buttons { display:flex; gap:12px; flex-wrap:wrap; }
.cta-content  { max-width:600px; }
.ef-link-primary { color:var(--primary); font-weight:600; text-decoration:none; transition:color .15s; }
.ef-link-primary:hover { color:var(--primary-dark); text-decoration:underline; }

/* ── Filter Buttons (shared across many pages) ─────────── */
.filter-section { padding:0 0 32px; }
.filter-buttons, .filter-tabs { display:flex; gap:8px; flex-wrap:wrap; justify-content:center; }
.filter-label { font-size:.75rem; font-weight:700; text-transform:uppercase; letter-spacing:.1em; color:var(--text-muted); margin-bottom:12px; }
.filter-btn {
  padding:10px 20px; border-radius:100px; font-size:.825rem; font-weight:600;
  border:1.5px solid var(--border); background:transparent; color:var(--text-muted);
  cursor:pointer; transition:.2s; min-height:44px;
}
.filter-btn:hover  { border-color:var(--primary); color:var(--primary); }
.filter-btn.active { background:var(--primary); border-color:var(--primary); color:#fff; }

/* ── Stars Rating ──────────────────────────────────────── */
.stars { color:#F59E0B; font-size:.875rem; display:flex; gap:2px; }
.rating{ color:#F59E0B; display:inline-flex; gap:2px; font-size:.875rem; }

/* ── FAQ (page-level, not accordion) ──────────────────── */
.faq-container { max-width:780px; margin:0 auto; }
.faq-item {
  border:1px solid var(--border); border-radius:12px; overflow:hidden; margin-bottom:10px;
  transition:.2s;
}
.faq-question {
  display:flex; align-items:center; justify-content:space-between;
  padding:18px 24px; cursor:pointer; font-weight:600; font-size:.9375rem;
  color:var(--text-primary); background:#fff; gap:12px;
}
.faq-question:hover { color:var(--primary); }
.faq-toggle, .faq-icon { flex-shrink:0; color:var(--primary); transition:.25s; }
.faq-item.open .faq-toggle,
.faq-item.open .faq-icon { transform:rotate(45deg); }
.faq-answer, .faq-answer-text {
  padding:0 24px 18px; font-size:.9rem; color:var(--text-muted); line-height:1.7;
  display:none;
}
.faq-item.open .faq-answer,
.faq-item.open .faq-answer-text { display:block; }
.faq-answer-inner { padding-bottom:4px; }

/* ── Legal Pages ───────────────────────────────────────── */
.legal-updated {
  display:inline-flex; align-items:center; gap:8px; font-size:.8125rem;
  color:var(--text-muted); background:rgba(99,102,241,.07); border:1px solid rgba(99,102,241,.15);
  border-radius:100px; padding:6px 16px; margin-bottom:24px;
}
.legal-body { max-width:820px; margin:0 auto; }
.legal-body h2 { font-size:1.25rem; font-weight:700; color:var(--text-primary); margin:32px 0 12px; }
.legal-body h3 { font-size:1.05rem; font-weight:700; color:var(--text-primary); margin:24px 0 8px; }
.legal-body p  { font-size:.9375rem; color:var(--text-muted); line-height:1.75; margin-bottom:14px; }
.legal-body ul { color:var(--text-muted); font-size:.9375rem; line-height:1.75; padding-left:20px; margin-bottom:14px; }
.cookie-table, .policy-table { width:100%; border-collapse:collapse; font-size:.875rem; }
.cookie-table th, .policy-table th { background:rgba(99,102,241,.07); color:var(--text-primary); font-weight:600; padding:12px 16px; text-align:left; border-bottom:2px solid var(--border); }
.cookie-table td, .policy-table td { padding:12px 16px; border-bottom:1px solid var(--border); color:var(--text-muted); }

/* ── Error / Utility Pages ─────────────────────────────── */
.error-page    { min-height:80vh; display:flex; align-items:center; justify-content:center; text-align:center; padding:60px 20px; background:linear-gradient(160deg,#030014 0%,#0A0025 20%,#150040 40%,#1E1B4B 60%,#312E81 80%,#4F46E5 100%); position:relative; overflow:hidden; }
.error-page::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse 80% 60% at 50% 40%,rgba(99,102,241,.18) 0%,transparent 70%); pointer-events:none; }
.error-content { max-width:560px; margin:0 auto; position:relative; z-index:1; }
.error-number  { font-size:clamp(4rem,15vw,8rem); font-weight:900; line-height:1; background:linear-gradient(135deg,#6366F1,#8B5CF6,#06B6D4); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; display:block; }
.status-pulse  { width:20px; height:20px; border-radius:50%; background:#EF4444; display:inline-block; animation:pulse-red 1.5s infinite; }
@keyframes pulse-red { 0%,100%{box-shadow:0 0 0 0 rgba(239,68,68,.4);} 50%{box-shadow:0 0 0 12px rgba(239,68,68,0);} }
.search-form   { display:flex; gap:8px; max-width:440px; margin:0 auto 1.5rem; }
.search-form input { flex:1; padding:10px 18px; border-radius:100px; border:1.5px solid rgba(255,255,255,.15); background:rgba(255,255,255,.07); color:#fff; font-size:.9rem; outline:none; }
.search-form input::placeholder { color:rgba(255,255,255,.4); }
.search-form input:focus { border-color:var(--primary); }

/* ── Coming Soon / Maintenance ─────────────────────────── */
.coming-soon-page  { min-height:100vh; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; background:var(--dark-bg); padding:60px 20px; }
.maintenance-page  { min-height:100vh; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; background:var(--dark-bg); padding:60px 20px; }
.brand-logo        { display:inline-flex; align-items:center; gap:10px; text-decoration:none; margin-bottom:32px; }
.countdown-block   { display:flex; align-items:center; gap:12px; justify-content:center; margin:32px 0; flex-wrap:wrap; }
.countdown-unit    { text-align:center; background:rgba(255,255,255,.06); border:1px solid rgba(99,102,241,.25); border-radius:14px; padding:16px 20px; min-width:80px; }
.countdown-unit .label { font-size:.68rem; font-weight:700; text-transform:uppercase; letter-spacing:.1em; color:rgba(255,255,255,.3); margin-top:6px; }
.notify-form  { display:flex; gap:8px; max-width:420px; margin:24px auto; }
.notify-form input { flex:1; padding:10px 18px; border-radius:100px; border:1.5px solid rgba(255,255,255,.15); background:rgba(255,255,255,.07); color:#fff; font-size:.875rem; outline:none; }
.maintenance-icon  { width:80px; height:80px; border-radius:24px; background:rgba(99,102,241,.1); border:1px solid rgba(99,102,241,.2); display:flex; align-items:center; justify-content:center; font-size:2rem; color:#818CF8; margin:0 auto 24px; }
.maintenance-progress { height:6px; background:rgba(255,255,255,.08); border-radius:100px; margin:24px 0; overflow:hidden; max-width:400px; margin-left:auto; margin-right:auto; }
.maintenance-progress-fill { height:100%; background:linear-gradient(90deg,#6366F1,#8B5CF6); border-radius:100px; animation:progress-anim 2.5s ease-in-out infinite alternate; }
@keyframes progress-anim { from{width:20%;} to{width:80%;} }
.update-item  { display:flex; align-items:center; gap:10px; padding:10px 0; border-bottom:1px solid rgba(255,255,255,.07); font-size:.875rem; color:rgba(255,255,255,.5); }

/* ── About Page ────────────────────────────────────────── */
.mission-vision { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:24px; }
.mv-card { padding:32px; background:#fff; border:1px solid var(--border); border-radius:20px; border-top:4px solid var(--primary); }
.mv-card h3 { font-size:1.125rem; font-weight:700; color:var(--text-primary); margin-bottom:12px; }
.mv-card p  { font-size:.9rem; color:var(--text-muted); line-height:1.7; margin:0; }

/* ── Blog Page ─────────────────────────────────────────── */
.author-avatar  { width:32px; height:32px; border-radius:50%; background:linear-gradient(135deg,#6366F1,#8B5CF6); color:#fff; font-size:.75rem; font-weight:700; display:inline-flex; align-items:center; justify-content:center; }
.filter-section.blog-filter { padding:40px 0; border-bottom:1px solid var(--border); }
.blog-main { display:grid; grid-template-columns:1fr 340px; gap:48px; padding:60px 0; }
.blog-grid { display:flex; flex-direction:column; gap:32px; }
.blog-image { aspect-ratio:16/9; border-radius:14px; overflow:hidden; background:linear-gradient(135deg,rgba(99,102,241,.08),rgba(139,92,246,.08)); display:flex; align-items:center; justify-content:center; font-size:3rem; margin-bottom:18px; }
.blog-category { display:inline-block; font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:var(--primary); margin-bottom:8px; }
.blog-title { font-size:1.25rem; font-weight:700; color:var(--text-primary); margin-bottom:10px; line-height:1.35; }
.blog-title a { color:inherit; text-decoration:none; }
.blog-title a:hover { color:var(--primary); }
.blog-excerpt  { font-size:.875rem; color:var(--text-muted); line-height:1.7; margin-bottom:14px; }
.blog-meta     { display:flex; gap:14px; flex-wrap:wrap; font-size:.8rem; color:var(--text-muted); }
.blog-author   { display:flex; align-items:center; gap:8px; }
.blog-read-more{ font-size:.8125rem; font-weight:600; color:var(--primary); text-decoration:none; }
.blog-read-more:hover{ color:var(--primary-dark); }
.blog-card-link { text-decoration:none; }
/* Category color accents */
.blog-category.fintech  { color:#6366F1; }
.blog-category.legaltech{ color:#8B5CF6; }
.blog-category.agritech { color:#10B981; }
.blog-category.tax      { color:#F59E0B; }
.blog-category.business { color:#06B6D4; }
.blog-category.software { color:#EF4444; }
/* Blog detail */
.blog-content { max-width:780px; margin:0 auto; font-size:1rem; color:var(--text-primary); line-height:1.8; }
.blog-content h2 { font-size:1.375rem; font-weight:700; margin:32px 0 12px; }
.blog-content p  { margin-bottom:16px; }
.blog-tag { display:inline-flex; padding:4px 12px; border-radius:100px; border:1px solid var(--border); font-size:.72rem; color:var(--text-muted); margin-right:6px; margin-bottom:6px; }
.share-btn{ display:inline-flex; align-items:center; gap:6px; padding:8px 16px; border-radius:100px; border:1px solid var(--border); font-size:.8rem; color:var(--text-muted); text-decoration:none; transition:.2s; }
.share-btn:hover { border-color:var(--primary); color:var(--primary); }
.toc-link { display:block; font-size:.875rem; color:var(--text-muted); text-decoration:none; padding:4px 0; transition:.2s; }
.toc-link:hover { color:var(--primary); }
.comment-form label { font-size:.875rem; font-weight:600; color:var(--text-primary); }
@media(max-width:991.98px){
  .featured-post { grid-template-columns:1fr; }
  .blog-main { grid-template-columns:1fr; }
}

/* ── Portfolio Page ────────────────────────────────────── */
.stats-bar { display:flex; gap:32px; flex-wrap:wrap; }
.portfolio-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(340px,1fr)); gap:28px; margin-top:40px; }
.project-card { background:#fff; border:1px solid var(--border); border-radius:20px; overflow:hidden; transition:.25s; }
.project-card:hover { transform:translateY(-6px); box-shadow:0 20px 50px rgba(99,102,241,.12); border-color:rgba(99,102,241,.2); }
.project-image { aspect-ratio:16/9; background:linear-gradient(135deg,rgba(99,102,241,.08),rgba(139,92,246,.08)); display:flex; align-items:center; justify-content:center; font-size:3.5rem; position:relative; overflow:hidden; }
.project-image-icon { font-size:3.5rem; }
.project-overlay { position:absolute; inset:0; background:rgba(99,102,241,.85); display:flex; align-items:center; justify-content:center; opacity:0; transition:.25s; }
.project-card:hover .project-overlay { opacity:1; }
.overlay-text { color:#fff; font-size:.875rem; font-weight:600; }
.project-content { padding:24px; }
.project-header  { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:10px; }
.project-title   { font-size:1.0625rem; font-weight:700; color:var(--text-primary); }
.project-tag     { font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; padding:4px 10px; border-radius:100px; background:rgba(99,102,241,.1); color:var(--primary); white-space:nowrap; }
.project-description { font-size:.875rem; color:var(--text-muted); line-height:1.65; margin-bottom:16px; }
.tech-stack      { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:16px; }
.tech-pill       { font-size:.72rem; color:var(--text-muted); background:var(--light-bg); border:1px solid var(--border); border-radius:100px; padding:3px 10px; }
.project-link    { font-size:.8125rem; font-weight:600; color:var(--primary); text-decoration:none; }
/* Category filters */
.fintech.active, .agritech.active, .legaltech.active, .ecommerce.active,
.webapp.active, .websites.active, .mobileapp.active { background:var(--primary); border-color:var(--primary); color:#fff; }
/* Case study */
.case-study { display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center; margin:60px 0; }
.case-study-image { border-radius:20px; overflow:hidden; background:rgba(99,102,241,.05); border:1px solid var(--border); padding:32px; text-align:center; }
.case-study-section { border-top:1px solid var(--border); padding-top:60px; }
.metrics { display:flex; gap:24px; flex-wrap:wrap; margin:24px 0; }
.metric { text-align:center; }
.metric-value { font-size:1.75rem; font-weight:800; color:var(--primary); font-family:var(--font-heading); }
.metric-label { font-size:.78rem; color:var(--text-muted); font-weight:500; margin-top:4px; }
.clients-section { padding:60px 0; border-top:1px solid var(--border); }
.clients-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(120px,1fr)); gap:20px; }
@media(max-width:767.98px){ .case-study{ grid-template-columns:1fr; } .portfolio-grid{ grid-template-columns:1fr; } }

/* ── Team Page ─────────────────────────────────────────── */
.department-filter { margin:32px 0; }
.team-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:28px; }
.job-card       { padding:24px; background:#fff; border:1px solid var(--border); border-radius:16px; transition:.2s; }
.job-card:hover { border-color:rgba(99,102,241,.3); box-shadow:0 8px 24px rgba(99,102,241,.08); }
.job-meta       { display:flex; gap:10px; flex-wrap:wrap; margin:8px 0; }
.job-meta span  { font-size:.75rem; color:var(--text-muted); background:var(--light-bg); border-radius:100px; padding:3px 10px; }

/* ── Careers Page ──────────────────────────────────────── */
.section-container { max-width:1200px; margin:0 auto; padding:0 1rem; }
.life-grid      { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:24px; margin-top:40px; }
.life-card      { background:#fff; border:1px solid var(--border); border-radius:20px; overflow:hidden; }
.life-image     { aspect-ratio:4/3; background:linear-gradient(135deg,rgba(99,102,241,.08),rgba(139,92,246,.08)); display:flex; align-items:center; justify-content:center; font-size:3rem; }
.life-content   { padding:20px; }
.life-content h4 { font-size:1rem; font-weight:700; color:var(--text-primary); margin-bottom:6px; }
.life-content p  { font-size:.875rem; color:var(--text-muted); margin:0; }
.positions-list { display:flex; flex-direction:column; gap:16px; margin-top:32px; }
.application-form { max-width:640px; margin:0 auto; }
.file-upload       { position:relative; }
.file-upload-label { display:flex; align-items:center; gap:10px; padding:12px 20px; border:2px dashed var(--border); border-radius:12px; cursor:pointer; font-size:.875rem; color:var(--text-muted); transition:.2s; }
.file-upload-label:hover { border-color:var(--primary); color:var(--primary); }
.file-upload input[type=file] { position:absolute; opacity:0; width:0; height:0; }
.submit-btn { display:inline-flex; align-items:center; gap:8px; padding:14px 32px; border-radius:100px; background:linear-gradient(135deg,#6366F1,#8B5CF6); color:#fff; border:none; font-size:.9375rem; font-weight:700; cursor:pointer; transition:.2s; }
.submit-btn:hover { opacity:.85; }
.perks-grid     { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:24px; margin-top:40px; }
.perk-card      { padding:28px; background:#fff; border:1px solid var(--border); border-radius:16px; text-align:center; transition:.2s; }
.perk-card:hover{ transform:translateY(-4px); box-shadow:0 12px 32px rgba(99,102,241,.1); border-color:rgba(99,102,241,.2); }
.perk-icon      { width:56px; height:56px; border-radius:14px; background:rgba(99,102,241,.1); color:var(--primary); display:flex; align-items:center; justify-content:center; font-size:1.375rem; margin:0 auto 14px; }
.perk-card h4   { font-size:.9375rem; font-weight:700; color:var(--text-primary); margin-bottom:8px; }
.perk-card p    { font-size:.8125rem; color:var(--text-muted); margin:0; }
.job-header     { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; flex-wrap:wrap; margin-bottom:16px; }
.job-title      { font-size:1.0625rem; font-weight:700; color:var(--text-primary); }
.job-description, .job-requirements { font-size:.9rem; color:var(--text-muted); line-height:1.7; }
.job-toggle     { background:none; border:none; cursor:pointer; color:var(--primary); font-size:.85rem; font-weight:600; padding:0; }
.apply-btn      { display:inline-flex; align-items:center; gap:6px; padding:11px 22px; min-height:44px; border-radius:100px; background:linear-gradient(135deg,#6366F1,#8B5CF6); color:#fff; border:none; font-size:.825rem; font-weight:700; cursor:pointer; text-decoration:none; transition:.2s; }
.apply-btn:hover { opacity:.85; }
.testimonials.dark-bg .ef-testimonial-card { background:var(--dark-surface); border-color:var(--border-dark); }

/* ── Products Page ─────────────────────────────────────── */
.filters-section    { padding:32px 0 0; max-width:1320px; margin:0 auto; padding-left:1rem; padding-right:1rem; }
.filters            { display:flex; gap:8px; flex-wrap:wrap; padding-bottom:4px; }
.filter-btn         { border:1px solid var(--border); border-radius:100px; padding:7px 18px; font-size:.8125rem; font-weight:500; background:#fff; color:var(--text-muted); cursor:pointer; transition:.2s; white-space:nowrap; flex-shrink:0; }
.products-section   { padding:40px 0 60px; }
.products-grid      { display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:28px; margin-top:32px; }
.product-card       { background:#fff; border:1px solid var(--border); border-radius:20px; padding:28px; transition:.25s; display:flex; flex-direction:column; position:relative; overflow:hidden; }
.product-card:hover { transform:translateY(-5px); box-shadow:0 20px 48px rgba(99,102,241,.12); border-color:rgba(99,102,241,.2); }
.product-header     { display:flex; align-items:flex-start; gap:14px; margin-bottom:16px; }
.product-info       { flex:1; min-width:0; }
.product-info h3    { font-size:1.0625rem; font-weight:700; margin-bottom:2px; line-height:1.3; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.product-icon       { width:52px; height:52px; border-radius:14px; background:rgba(99,102,241,.1); border:1px solid rgba(99,102,241,.15); display:flex; align-items:center; justify-content:center; font-size:1.375rem; color:var(--primary); flex-shrink:0; }
.product-url        { font-size:.72rem; color:var(--text-muted); }
.product-description{ font-size:.875rem; color:var(--text-muted); line-height:1.65; margin-bottom:14px; }
.product-features   { list-style:none; padding:0; margin:0 0 16px; display:flex; flex-direction:column; gap:6px; }
.product-features li{ display:flex; align-items:center; gap:8px; font-size:.8125rem; color:var(--text-muted); }
.product-features li::before { content:'✓'; color:var(--primary); font-weight:700; flex-shrink:0; }
.product-screenshot { aspect-ratio:16/9; background:rgba(99,102,241,.05); border:1px solid var(--border); border-radius:12px; margin-bottom:16px; display:flex; align-items:center; justify-content:center; font-size:2.5rem; }
.product-actions    { display:flex; gap:8px; margin-top:auto; }
.product-actions a  { flex:1; text-align:center; }
/* Category dot accents */
.product-card.finance  .product-icon { background:rgba(99,102,241,.1); color:#6366F1; }
.product-card.dairy    .product-icon { background:rgba(16,185,129,.1); color:#10B981; }
.product-card.legal    .product-icon { background:rgba(139,92,246,.1); color:#8B5CF6; }
.product-card.tax      .product-icon { background:rgba(245,158,11,.1); color:#F59E0B; }
.product-card.payments .product-icon { background:rgba(6,182,212,.1);  color:#06B6D4; }
.product-card.practice .product-icon { background:rgba(239,68,68,.1);  color:#EF4444; }
.product-card.call     .product-icon { background:rgba(20,184,166,.1); color:#14B8A6; }
/* Product card badge */
.ef-product-badge      { font-size:.65rem; font-weight:700; padding:3px 10px; border-radius:100px; letter-spacing:.03em; white-space:nowrap; margin-left:auto; flex-shrink:0; }
.ef-pb-popular         { background:rgba(245,158,11,.12); color:#D97706; border:1px solid rgba(245,158,11,.25); }
.ef-pb-hot             { background:rgba(239,68,68,.1);   color:#DC2626; border:1px solid rgba(239,68,68,.2); }
.ef-pb-new             { background:rgba(16,185,129,.1);  color:#059669; border:1px solid rgba(16,185,129,.2); }
/* Integrations */
.integrations-container{ max-width:900px; margin:0 auto; }
.integrations-grid     { display:grid; grid-template-columns:repeat(auto-fill,minmax(130px,1fr)); gap:16px; margin-top:32px; }
.integration-card      { text-align:center; padding:20px 12px; background:#fff; border:1px solid var(--border); border-radius:14px; transition:.2s; }
.integration-card:hover{ border-color:rgba(99,102,241,.25); box-shadow:0 6px 20px rgba(99,102,241,.08); }
.integration-icon      { font-size:1.75rem; margin-bottom:8px; }
.why-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:24px; margin-top:40px; }
.why-card { padding:28px; background:#fff; border:1px solid var(--border); border-radius:16px; }
.why-icon { width:48px; height:48px; border-radius:12px; background:rgba(99,102,241,.1); color:var(--primary); display:flex; align-items:center; justify-content:center; font-size:1.25rem; margin-bottom:14px; }
.cta-container{ max-width:680px; margin:0 auto; text-align:center; }

/* ── Services Page ─────────────────────────────────────── */
.ef-services-grid  { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:28px; margin-top:40px; }
.service-card      { background:#fff; border:1px solid var(--border); border-radius:20px; padding:28px; transition:.25s; }
.service-card:hover{ transform:translateY(-5px); box-shadow:0 20px 48px rgba(99,102,241,.12); border-color:rgba(99,102,241,.2); }
.service-icon      { width:52px; height:52px; border-radius:14px; background:rgba(99,102,241,.1); color:var(--primary); display:flex; align-items:center; justify-content:center; font-size:1.375rem; margin-bottom:16px; }
.service-features  { list-style:none; padding:0; margin:12px 0 0; display:flex; flex-direction:column; gap:6px; }
.service-features li{ display:flex; align-items:center; gap:8px; font-size:.8125rem; color:var(--text-muted); }
.service-features li::before { content:'→'; color:var(--primary); flex-shrink:0; }
.tech-grid  { display:flex; flex-wrap:wrap; gap:10px; }
.tech-item  { padding:8px 18px; border-radius:100px; border:1px solid var(--border); background:#fff; font-size:.8rem; color:var(--text-muted); font-weight:500; display:flex; align-items:center; gap:8px; }
.timeline-step{ display:flex; gap:20px; align-items:flex-start; padding:24px 0; border-bottom:1px solid var(--border); }
.step-number{ width:36px; height:36px; border-radius:50%; background:linear-gradient(135deg,#6366F1,#8B5CF6); color:#fff; font-size:.85rem; font-weight:800; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.step-name  { font-size:1rem; font-weight:700; color:var(--text-primary); margin-bottom:4px; }
.step-description { font-size:.875rem; color:var(--text-muted); }
.step-text  { flex:1; }
.industries-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:16px; }
.industry-item  { padding:20px; background:#fff; border:1px solid var(--border); border-radius:14px; text-align:center; transition:.2s; }
.industry-item:hover { border-color:rgba(99,102,241,.25); }
.industry-icon  { font-size:1.75rem; margin-bottom:10px; }
/* website dev / plans */
.pricing-highlight { font-size:2rem; font-weight:800; color:var(--primary); font-family:var(--font-heading); }
.plans-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:16px; }
.plan-card  { padding:24px; background:#fff; border:1px solid var(--border); border-radius:16px; text-align:center; }
.plan-features { list-style:none; padding:0; margin:16px 0; text-align:left; }
.plan-features li{ display:flex; align-items:center; gap:8px; font-size:.8rem; color:var(--text-muted); margin-bottom:8px; }
.why-choose-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:20px; }
.feature-icon    { font-size:1.5rem; margin-bottom:12px; }
.testimonial-company { font-size:.8rem; color:var(--text-muted); }

/* ── Digital Marketing Page ────────────────────────────── */
.service-card .deliverables { margin-top:14px; }
.deliverables-list { list-style:none; padding:0; margin:0; }
.deliverables-list li{ display:flex; align-items:center; gap:6px; font-size:.8rem; color:var(--text-muted); margin-bottom:6px; }
.pricing-grid   { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:24px; margin-top:40px; }
.pricing-amount { font-size:2rem; font-weight:800; color:var(--primary); font-family:var(--font-heading); }
.pricing-period { font-size:.8rem; color:var(--text-muted); }
.process-steps  { display:flex; flex-direction:column; gap:0; }
.case-studies-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:24px; }
.case-study-card { padding:28px; background:#fff; border:1px solid var(--border); border-radius:16px; }
.case-study-tag  { display:inline-block; font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.07em; color:var(--primary); background:rgba(99,102,241,.1); border-radius:100px; padding:3px 10px; margin-bottom:10px; }
.case-study-metrics { display:flex; gap:24px; flex-wrap:wrap; margin-top:16px; }
.platforms-grid  { display:grid; grid-template-columns:repeat(auto-fill,minmax(130px,1fr)); gap:14px; }
.platform-item   { text-align:center; padding:18px 10px; background:#fff; border:1px solid var(--border); border-radius:14px; transition:.2s; }
.platform-item:hover { border-color:rgba(99,102,241,.3); }
.platform-icon   { font-size:1.75rem; margin-bottom:8px; }
.platform-name   { font-size:.75rem; font-weight:600; color:var(--text-muted); }
.why-grid  { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:20px; }
.why-item  { padding:24px; background:#fff; border:1px solid var(--border); border-radius:16px; }
.why-icon  { font-size:1.5rem; margin-bottom:10px; }

/* ── Contact Page ──────────────────────────────────────── */
.info-cards   { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:20px; margin-top:40px; }
.info-card    { padding:28px; background:#fff; border:1px solid var(--border); border-radius:16px; text-align:center; transition:.2s; }
.info-card:hover { border-color:rgba(99,102,241,.2); box-shadow:0 8px 24px rgba(99,102,241,.08); }
.required     { color:#EF4444; }
.success-message { display:none; padding:16px 24px; background:rgba(16,185,129,.1); border:1px solid rgba(16,185,129,.25); border-radius:12px; color:#10B981; font-weight:600; }
.error-message   { display:none; padding:16px 24px; background:rgba(239,68,68,.1); border:1px solid rgba(239,68,68,.25); border-radius:12px; color:#EF4444; font-weight:600; }
.hidden { display:none !important; }
.full   { grid-column:1/-1; }
.map-container   { border-radius:20px; overflow:hidden; border:1px solid var(--border); height:380px; }
.map-placeholder { height:100%; background:rgba(99,102,241,.05); display:flex; align-items:center; justify-content:center; font-size:3rem; }
.quick-links     { display:flex; flex-wrap:wrap; gap:12px; }
.quick-link      { display:inline-flex; align-items:center; gap:8px; padding:10px 20px; border-radius:100px; border:1px solid var(--border); font-size:.875rem; color:var(--text-muted); text-decoration:none; transition:.2s; }
.quick-link:hover { border-color:var(--primary); color:var(--primary); }
.departments     { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:20px; }
.dept-card       { padding:24px; background:#fff; border:1px solid var(--border); border-radius:16px; transition:.2s; }
.dept-card:hover { border-color:rgba(99,102,241,.2); }
.dept-icon       { width:44px; height:44px; border-radius:12px; background:rgba(99,102,241,.1); color:var(--primary); display:flex; align-items:center; justify-content:center; font-size:1.25rem; margin-bottom:12px; }
.highlight       { display:flex; align-items:center; gap:10px; margin-bottom:12px; }
.highlight-text  { font-size:.875rem; color:var(--text-muted); }
.cta-buttons     { display:flex; gap:12px; flex-wrap:wrap; }

/* ── Pricing Page ──────────────────────────────────────── */
.price-val { font-size:2.5rem; font-weight:900; color:var(--primary); font-family:var(--font-heading); line-height:1; }

/* Steps number circle inside step-card (templates How It Works) */
.step-card .step-number { width:48px; height:48px; border-radius:50%; background:linear-gradient(135deg,#6366F1,#8B5CF6); color:#fff; font-weight:800; font-size:.9rem; display:flex; align-items:center; justify-content:center; margin:0 auto 14px; }
.step-dot { width:10px; height:10px; border-radius:50%; background:var(--border); transition:.2s; }
.step-dot.active { background:var(--primary); }

/* ── Partners Page ─────────────────────────────────────── */
/* uses Bootstrap + ef-card, nothing extra needed */

/* ── SEO / Branding page ───────────────────────────────── */
.pillars-grid  { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:24px; }
.pillar-card   { padding:28px; background:#fff; border:1px solid var(--border); border-radius:20px; transition:.2s; }
.pillar-card:hover { border-color:rgba(99,102,241,.2); box-shadow:0 12px 32px rgba(99,102,241,.08); transform:translateY(-4px); }
.pillar-icon   { width:52px; height:52px; border-radius:14px; background:rgba(99,102,241,.1); color:var(--primary); display:flex; align-items:center; justify-content:center; font-size:1.375rem; margin-bottom:16px; }
.pillar-features { list-style:none; padding:0; margin:12px 0 0; }
.pillar-features li { display:flex; align-items:center; gap:8px; font-size:.825rem; color:var(--text-muted); margin-bottom:7px; }
.pillar-features li::before { content:'✓'; color:var(--primary); font-weight:700; }
.pillar-card.seo    .pillar-icon { background:rgba(99,102,241,.1); color:#6366F1; }
.pillar-card.branding .pillar-icon { background:rgba(245,158,11,.1); color:#F59E0B; }
.section-grid  { display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center; }
.feature-list  { list-style:none; padding:0; margin:16px 0; }
.feature-list li{ display:flex; align-items:center; gap:10px; font-size:.9rem; color:var(--text-muted); margin-bottom:10px; }
.section-image { border-radius:20px; overflow:hidden; background:rgba(99,102,241,.05); border:1px solid var(--border); padding:32px; text-align:center; }
.pricing-tabs  { display:flex; gap:8px; justify-content:center; margin-bottom:32px; flex-wrap:wrap; }
.pricing-tab   { padding:9px 24px; border-radius:100px; border:1.5px solid var(--border); font-size:.825rem; font-weight:600; cursor:pointer; transition:.2s; color:var(--text-muted); background:transparent; }
.pricing-tab.active,.pricing-tab:hover { border-color:var(--primary); color:var(--primary); background:rgba(99,102,241,.06); }
.pricing-title   { font-size:1.125rem; font-weight:700; margin-bottom:6px; }
.featured-badge  { display:inline-block; font-size:.68rem; font-weight:800; text-transform:uppercase; letter-spacing:.08em; background:linear-gradient(135deg,#6366F1,#8B5CF6); color:#fff; border-radius:100px; padding:4px 12px; margin-bottom:10px; }
.ai-grid  { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:20px; }
.ai-card  { padding:24px; background:#fff; border:1px solid var(--border); border-radius:16px; }
.stats-grid  { display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:20px; }
.stat-card   { text-align:center; padding:24px; background:#fff; border:1px solid var(--border); border-radius:16px; }
.case-study  { padding:28px; background:#fff; border:1px solid var(--border); border-radius:16px; margin-bottom:16px; }
.case-study-title  { font-size:1rem; font-weight:700; color:var(--text-primary); margin-bottom:10px; }
.case-study-metric { display:inline-flex; align-items:center; gap:8px; font-size:.9rem; font-weight:600; color:var(--primary); margin-top:8px; }
.testimonials-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:24px; }
.author-avatar { width:44px; height:44px; border-radius:50%; background:linear-gradient(135deg,#6366F1,#8B5CF6); color:#fff; font-size:.875rem; font-weight:700; display:flex; align-items:center; justify-content:center; }
.author-name   { font-size:.9375rem; font-weight:700; color:var(--text-primary); }
.author-title  { font-size:.8rem; color:var(--text-muted); }
@media(max-width:767.98px){ .section-grid { grid-template-columns:1fr; } }

/* ── Sitemap ───────────────────────────────────────────── */
.sitemap-links   { list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:8px; }
.sitemap-links li a { font-size:.875rem; color:var(--text-muted); text-decoration:none; display:flex; align-items:center; gap:8px; transition:.2s; }
.sitemap-links li a:hover { color:var(--primary); }

/* ── Case Studies / Portfolio Detail ───────────────────── */
.metric-highlight { background:rgba(99,102,241,.08); border:1px solid rgba(99,102,241,.15); border-radius:16px; padding:20px 24px; text-align:center; }
.cs-body  { max-width:820px; margin:0 auto; font-size:1rem; line-height:1.8; color:var(--text-primary); }
.cs-quote { border-left:4px solid var(--primary); padding:16px 24px; background:rgba(99,102,241,.05); border-radius:0 12px 12px 0; font-style:italic; color:var(--text-muted); margin:24px 0; }
.cs-filter { display:flex; gap:8px; flex-wrap:wrap; justify-content:center; margin-bottom:40px; }

/* ── Testimonials page ─────────────────────────────────── */

/* ── Portfolio detail ──────────────────────────────────── */
/* uses Bootstrap + ef-card */

/* ── Leaderboard ───────────────────────────────────────── */
.leaderboard-table { width:100%; border-collapse:collapse; }
.leaderboard-table th { background:rgba(99,102,241,.06); color:var(--text-primary); font-weight:600; padding:12px 16px; text-align:left; border-bottom:2px solid var(--border); font-size:.8125rem; }
.leaderboard-table td { padding:12px 16px; border-bottom:1px solid var(--border); font-size:.875rem; color:var(--text-muted); }
.rank-badge { display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; border-radius:50%; font-size:.85rem; font-weight:800; }
.rank-1 { background:linear-gradient(135deg,#F59E0B,#FCD34D); color:#fff; }
.rank-2 { background:linear-gradient(135deg,#94A3B8,#CBD5E1); color:#fff; }
.rank-3 { background:linear-gradient(135deg,#B45309,#D97706); color:#fff; }
.rank-other { background:rgba(99,102,241,.1); color:var(--primary); }
.achievement-badge { display:inline-flex; align-items:center; gap:4px; padding:3px 10px; border-radius:100px; font-size:.7rem; font-weight:700; background:rgba(99,102,241,.1); color:var(--primary); }
.dept-filter { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:24px; }
/* ── Thank You page ────────────────────────────────────── */
.check-circle { width:80px; height:80px; border-radius:50%; background:linear-gradient(135deg,#10B981,#34D399); color:#fff; font-size:2rem; display:flex; align-items:center; justify-content:center; margin:0 auto 24px; }

/* ── Newsletter subscribe ──────────────────────────────── */
/* uses Bootstrap min-vh-100, ef-card */

/* ── Get Quote / Request Demo (multi-step) ─────────────── */
/* uses Bootstrap + ef-page-hero */

/* ── Global responsive fixes ───────────────────────────── */
@media(max-width:767.98px){
  .ef-services-grid  { grid-template-columns:1fr; }
  .products-grid     { grid-template-columns:1fr; }
  .portfolio-grid    { grid-template-columns:1fr; }
  .templates-grid    { grid-template-columns:1fr; }
  .hiring-grid       { grid-template-columns:1fr; }
  .case-studies-grid { grid-template-columns:1fr; }
  .team-grid         { grid-template-columns:repeat(2,1fr); }
  .life-grid         { grid-template-columns:1fr; }
  .perks-grid        { grid-template-columns:1fr; }
  .blog-main         { grid-template-columns:1fr; }
  .mission-vision    { grid-template-columns:1fr; }
  .pillars-grid      { grid-template-columns:1fr; }
  .pricing-grid      { grid-template-columns:1fr; }
  .case-study        { grid-template-columns:1fr; }
  .ef-card { padding:20px 16px; }
  .hero-centered { padding:40px 0 56px; }
  /* Filters: horizontal scroll on mobile */
  .filters-section { padding-left:.75rem; padding-right:.75rem; }
  .filters         { flex-wrap:nowrap; overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
  .filters::-webkit-scrollbar { display:none; }
  /* Product card actions: stack on very small */
  .product-actions { flex-wrap:wrap; }
  .product-actions a { flex:1 1 calc(50% - 4px); min-width:120px; }
  .integrations-grid { grid-template-columns:repeat(3,1fr); }
}
@media(max-width:575.98px){
  .team-grid { grid-template-columns:1fr; }
  .hiring-grid { grid-template-columns:1fr; }
}
@media(max-width:479.98px){
  .products-grid, .portfolio-grid, .ef-services-grid,
  .hiring-grid, .case-studies-grid, .templates-grid { grid-template-columns:1fr; }
}


/* ===============================================================
   BLOG PAGE
=============================================================== */
.blog-tag { display:inline-block; background:rgba(99,102,241,.08); color:var(--primary); border-radius:100px; padding:3px 12px; font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; }
.blog-card-link { text-decoration:none; color:inherit; display:block; }
.blog-card { background:#fff; border:1px solid var(--border); border-radius:20px; padding:20px; transition:transform .25s, box-shadow .25s, border-color .25s; height:100%; }
.blog-card-link:hover .blog-card { transform:translateY(-4px); box-shadow:0 16px 48px rgba(99,102,241,.1); border-color:rgba(99,102,241,.2); }
.blog-card-link:hover .blog-title { color:var(--primary); }
.sidebar { position:sticky; top:100px; display:flex; flex-direction:column; }
.sidebar-widget { background:#fff; border:1px solid var(--border); border-radius:16px; padding:24px; margin-bottom:24px; }
.sidebar-widget h5 { font-size:.9375rem; font-weight:700; color:var(--text-primary); margin-bottom:16px; padding-bottom:12px; border-bottom:1px solid var(--border); }
.search-box { display:flex; gap:8px; }
.search-box input { flex:1; padding:9px 16px; border-radius:100px; border:1.5px solid var(--border); font-size:.875rem; outline:none; }
.search-box input:focus { border-color:var(--primary); }
.popular-posts { display:flex; flex-direction:column; gap:12px; }
.popular-post { display:flex; gap:12px; align-items:flex-start; padding-bottom:12px; border-bottom:1px solid var(--border); }
.popular-post:last-child { border-bottom:none; padding-bottom:0; }
.popular-thumbnail { width:64px; height:52px; border-radius:8px; background:linear-gradient(135deg,rgba(99,102,241,.1),rgba(139,92,246,.1)); flex-shrink:0; display:flex; align-items:center; justify-content:center; font-size:1.5rem; }
.popular-text { flex:1; }
.popular-text a { font-size:.8125rem; font-weight:600; color:var(--text-primary); text-decoration:none; line-height:1.4; }
.popular-text a:hover { color:var(--primary); }
.popular-text small { display:block; font-size:.72rem; color:var(--text-muted); margin-top:4px; }
.categories-list { display:flex; flex-direction:column; gap:0; }
.category-item { display:flex; align-items:center; justify-content:space-between; padding:9px 0; border-bottom:1px solid var(--border); text-decoration:none; color:var(--text-muted); font-size:.875rem; transition:.2s; }
.category-item:hover { color:var(--primary); }
.category-item:last-child { border-bottom:none; }
.category-count { background:rgba(99,102,241,.08); color:var(--primary); border-radius:100px; padding:2px 10px; font-size:.72rem; font-weight:700; }
.tags-cloud { display:flex; flex-wrap:wrap; gap:8px; }
.tag { display:inline-block; padding:5px 14px; border-radius:100px; border:1px solid var(--border); font-size:.75rem; color:var(--text-muted); text-decoration:none; transition:.2s; }
.tag:hover { border-color:var(--primary); color:var(--primary); background:rgba(99,102,241,.05); }
.download-guide { background:linear-gradient(135deg,rgba(99,102,241,.08),rgba(139,92,246,.08)); border:1px solid rgba(99,102,241,.2); border-radius:16px; padding:24px; }
.newsletter-section { padding:80px 0; background:rgba(99,102,241,.04); border-top:1px solid var(--border); }
.newsletter-form { display:flex; gap:10px; max-width:480px; margin:20px auto 0; }
.newsletter-form input { flex:1; padding:11px 18px; border-radius:100px; border:1.5px solid var(--border); font-size:.875rem; outline:none; }
.newsletter-form input:focus { border-color:var(--primary); }
.write-for-us { background:linear-gradient(135deg,rgba(6,182,212,.06),rgba(99,102,241,.06)); border:1px solid rgba(6,182,212,.2); border-radius:16px; padding:40px; text-align:center; }
.legaltech  { color:#8B5CF6; }
.fintech    { color:#6366F1; }
.agritech   { color:#10B981; }
.tax        { color:#F59E0B; }
.business   { color:#06B6D4; }
.software   { color:#EC4899; }
/* Category-specific blog image background tints */
.blog-image.legaltech { background:linear-gradient(135deg,rgba(139,92,246,.1),rgba(109,40,217,.08)); }
.blog-image.fintech   { background:linear-gradient(135deg,rgba(99,102,241,.1),rgba(79,70,229,.08)); }
.blog-image.agritech  { background:linear-gradient(135deg,rgba(16,185,129,.1),rgba(5,150,105,.08)); }
.blog-image.tax       { background:linear-gradient(135deg,rgba(245,158,11,.1),rgba(217,119,6,.08)); }
.blog-image.business  { background:linear-gradient(135deg,rgba(6,182,212,.1),rgba(8,145,178,.08)); }
.blog-image.software  { background:linear-gradient(135deg,rgba(236,72,153,.1),rgba(190,24,93,.08)); }

/* ===============================================================
   BLOG DETAIL / ARTICLE
=============================================================== */
.blog-content { font-size:1rem; line-height:1.85; color:var(--text-muted); }
.blog-content h2 { font-size:1.375rem; font-weight:700; color:var(--text-primary); margin:36px 0 14px; }
.blog-content h3 { font-size:1.125rem; font-weight:700; color:var(--text-primary); margin:28px 0 10px; }
.blog-content p  { margin-bottom:18px; }
.blog-content blockquote { border-left:4px solid var(--primary); padding:16px 20px; background:rgba(99,102,241,.05); border-radius:0 8px 8px 0; margin:24px 0; font-style:italic; }
.blog-content code { background:rgba(99,102,241,.08); color:var(--primary); padding:2px 8px; border-radius:5px; font-size:.875em; }
.share-btn { display:inline-flex; align-items:center; gap:8px; padding:8px 20px; border-radius:100px; border:1.5px solid var(--border); color:var(--text-muted); font-size:.8125rem; font-weight:600; text-decoration:none; transition:.2s; }
.share-btn:hover { border-color:var(--primary); color:var(--primary); }
.comment-form label { font-size:.8125rem; font-weight:600; color:var(--text-primary); margin-bottom:6px; display:block; }
.toc-link { display:block; padding:6px 12px; border-radius:8px; text-decoration:none; color:var(--text-muted); font-size:.8125rem; transition:.2s; border-left:2px solid transparent; }
.toc-link:hover, .toc-link.active { color:var(--primary); border-left-color:var(--primary); background:rgba(99,102,241,.05); }

/* ===============================================================
   SERVICES PAGE
=============================================================== */
.services-overview { padding:80px 0; }
.ef-services-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:28px; }
.service-card { background:#fff; border:1px solid var(--border); border-radius:20px; padding:32px; transition:.3s; }
.service-card:hover { transform:translateY(-4px); box-shadow:0 16px 40px rgba(99,102,241,.12); border-color:rgba(99,102,241,.25); }
.service-icon { width:56px; height:56px; border-radius:16px; background:linear-gradient(135deg,rgba(99,102,241,.12),rgba(139,92,246,.12)); display:flex; align-items:center; justify-content:center; font-size:1.5rem; color:var(--primary); margin-bottom:20px; }
.service-content h3 { font-size:1.125rem; font-weight:700; color:var(--text-primary); margin-bottom:10px; }
.service-content p  { font-size:.875rem; color:var(--text-muted); line-height:1.7; margin-bottom:16px; }
.service-features { list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:8px; }
.service-features li { display:flex; align-items:flex-start; gap:8px; font-size:.8125rem; color:var(--text-muted); }
.service-features li::before { content:"✓"; color:var(--primary); font-weight:700; flex-shrink:0; }
.tech-stack { padding:80px 0; background:rgba(99,102,241,.03); }
.tech-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:16px; margin-top:40px; }
.tech-item { background:#fff; border:1px solid var(--border); border-radius:14px; padding:20px 16px; text-align:center; transition:.3s; }
.tech-item:hover { border-color:rgba(99,102,241,.3); transform:translateY(-3px); }
.tech-item i { font-size:2rem; color:var(--primary); margin-bottom:8px; display:block; }
.tech-item span { font-size:.8rem; font-weight:600; color:var(--text-muted); }
.timeline-step { display:flex; gap:20px; align-items:flex-start; margin-bottom:32px; }
.step-number { width:44px; height:44px; border-radius:50%; background:linear-gradient(135deg,#6366F1,#8B5CF6); color:#fff; font-weight:800; font-size:1.125rem; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.step-name { font-size:1rem; font-weight:700; color:var(--text-primary); margin-bottom:6px; }
.step-description { font-size:.875rem; color:var(--text-muted); line-height:1.7; }
.industries { padding:80px 0; }
.industries-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:20px; margin-top:40px; }
.industry-item { background:#fff; border:1px solid var(--border); border-radius:16px; padding:24px; text-align:center; transition:.3s; }
.industry-item:hover { border-color:rgba(99,102,241,.3); transform:translateY(-3px); box-shadow:0 8px 24px rgba(99,102,241,.08); }
.industry-icon { font-size:2rem; margin-bottom:10px; display:block; }
.industry-item span { font-size:.875rem; font-weight:600; color:var(--text-primary); }
.website-dev { padding:80px 0; }
.website-dev-content { display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center; }
.website-dev-left h2 { font-size:2rem; font-weight:800; color:var(--text-primary); margin-bottom:16px; }
.website-dev-left p  { font-size:.9375rem; color:var(--text-muted); line-height:1.75; }
.pricing-highlight { background:linear-gradient(135deg,rgba(99,102,241,.08),rgba(139,92,246,.08)); border:1px solid rgba(99,102,241,.2); border-radius:20px; padding:28px; margin-top:24px; }
.plans-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:20px; margin-top:32px; }
.plan-card { background:#fff; border:1px solid var(--border); border-radius:18px; padding:28px; transition:.3s; }
.plan-card:hover { border-color:rgba(99,102,241,.3); transform:translateY(-3px); }
.plan-card h4 { font-size:1rem; font-weight:700; color:var(--text-primary); margin-bottom:8px; }
.plan-features { list-style:none; padding:0; margin:16px 0; display:flex; flex-direction:column; gap:7px; }
.plan-features li { font-size:.8125rem; color:var(--text-muted); display:flex; gap:7px; align-items:center; }
.why-choose { padding:80px 0; }
.why-choose-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:24px; margin-top:40px; }
.feature-icon { width:48px; height:48px; border-radius:14px; background:linear-gradient(135deg,rgba(99,102,241,.1),rgba(139,92,246,.1)); display:flex; align-items:center; justify-content:center; font-size:1.25rem; color:var(--primary); margin-bottom:16px; }
.form-container { max-width:720px; margin:0 auto; background:#fff; border-radius:20px; padding:40px; box-shadow:0 4px 24px rgba(99,102,241,.08); }
.form-group { margin-bottom:20px; }
.form-group label { display:block; font-size:.875rem; font-weight:600; color:var(--text-primary); margin-bottom:6px; }
.form-group input, .form-group select, .form-group textarea { width:100%; padding:10px 14px; border:1.5px solid var(--border); border-radius:10px; font-size:.9375rem; color:var(--text-primary); background:#fff; transition:.2s; outline:none; }
.form-group input:focus, .form-group select:focus, .form-group textarea:focus { border-color:var(--primary); box-shadow:0 0 0 3px rgba(99,102,241,.08); }
.form-group textarea { min-height:120px; resize:vertical; }
.testimonial-company { font-size:.75rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:var(--text-muted); }

/* ===============================================================
   TEAM PAGE
=============================================================== */
.department-filter { display:flex; gap:8px; flex-wrap:wrap; justify-content:center; padding:0 0 40px; }
.ef-team-section { padding:80px 0; }
.team-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:24px; }
.team-card-inner { background:#fff; border:1px solid var(--border); border-radius:20px; padding:28px; text-align:center; transition:.3s; }
.team-card-inner:hover { transform:translateY(-5px); box-shadow:0 16px 40px rgba(99,102,241,.1); border-color:rgba(99,102,241,.2); }
.avatar { width:72px; height:72px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:1.75rem; font-weight:800; color:#fff; margin:0 auto 16px; }
.role { font-size:.875rem; font-weight:600; color:var(--text-muted); }
.department-tag { display:inline-block; background:rgba(99,102,241,.08); color:var(--primary); border-radius:100px; padding:3px 12px; font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.06em; margin-top:8px; }
.specialty { font-size:.8rem; color:var(--text-muted); margin-top:6px; }
.team-social { display:flex; justify-content:center; gap:8px; margin-top:14px; }
.team-social a { width:32px; height:32px; border-radius:50%; border:1px solid var(--border); display:flex; align-items:center; justify-content:center; color:var(--text-muted); font-size:.8rem; text-decoration:none; transition:.2s; }
.team-social a:hover { border-color:var(--primary); color:var(--primary); }
.hiring { padding:80px 0; background:rgba(99,102,241,.03); }
.hiring-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:20px; margin-top:40px; }
.job-card { background:#fff; border:1px solid var(--border); border-radius:16px; padding:24px; transition:.3s; }
.job-card:hover { border-color:rgba(99,102,241,.3); transform:translateY(-3px); }
.job-card h4 { font-size:1rem; font-weight:700; color:var(--text-primary); margin-bottom:8px; }
.job-meta { display:flex; gap:12px; flex-wrap:wrap; margin-top:10px; }
.job-meta span { display:inline-flex; align-items:center; gap:5px; font-size:.75rem; color:var(--text-muted); }

/* ===============================================================
   TEMPLATES PAGE
=============================================================== */
.mobile-nav  { display:none; }
.mobile-cta  { display:none; }
.filter-bar  { display:flex; align-items:center; gap:16px; flex-wrap:wrap; padding:24px 0; border-bottom:1px solid var(--border); }
.filter-top  { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; margin-bottom:12px; }
.filter-search { position:relative; }
.filter-search input { padding:9px 36px 9px 16px; border-radius:100px; border:1.5px solid var(--border); font-size:.875rem; width:240px; outline:none; }
.filter-search input:focus { border-color:var(--primary); }
.filter-tags { display:flex; gap:8px; flex-wrap:wrap; }
.filter-tag  { display:inline-flex; align-items:center; gap:6px; padding:5px 14px; border-radius:100px; border:1.5px solid var(--border); font-size:.75rem; font-weight:600; color:var(--text-muted); cursor:pointer; transition:.2s; background:#fff; }
.filter-tag:hover  { border-color:var(--primary); color:var(--primary); }
.filter-tag.active { background:var(--primary); border-color:var(--primary); color:#fff; }
.tag-count   { background:rgba(255,255,255,.25); border-radius:100px; padding:0 6px; font-size:.65rem; }
.templates-section { padding:60px 0; }
.templates-count   { font-size:.875rem; color:var(--text-muted); margin-bottom:24px; }
.templates-grid    { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:28px; }
.template-card     { background:#fff; border:1px solid var(--border); border-radius:20px; overflow:hidden; transition:.3s; }
.template-card:hover { transform:translateY(-5px); box-shadow:0 20px 50px rgba(99,102,241,.12); border-color:rgba(99,102,241,.2); }
.template-preview  { aspect-ratio:16/9; position:relative; overflow:hidden; }
.template-preview-inner { width:100%; height:100%; display:flex; align-items:center; justify-content:center; font-size:2rem; }
.theme-blue   { background:linear-gradient(135deg,#1e40af,#3b82f6); }
.theme-indigo { background:linear-gradient(135deg,#4338ca,#6366F1); }
.theme-teal   { background:linear-gradient(135deg,#0d9488,#06B6D4); }
.theme-rose   { background:linear-gradient(135deg,#be123c,#f43f5e); }
.theme-amber  { background:linear-gradient(135deg,#b45309,#F59E0B); }
.theme-green  { background:linear-gradient(135deg,#166534,#22c55e); }
.preview-browser { position:absolute; inset:8px; background:rgba(255,255,255,.15); border-radius:8px; backdrop-filter:blur(4px); }
.preview-mockup  { padding:8px; }
.mock-header { height:8px; background:rgba(255,255,255,.3); border-radius:4px; margin-bottom:6px; }
.mock-nav    { height:5px; background:rgba(255,255,255,.2); border-radius:3px; margin-bottom:8px; }
.mock-hero   { height:28px; background:rgba(255,255,255,.25); border-radius:6px; margin-bottom:6px; }
.mock-cols   { display:flex; gap:4px; }
.mock-cols > * { flex:1; height:16px; background:rgba(255,255,255,.15); border-radius:4px; }
.preview-overlay { position:absolute; inset:0; background:rgba(0,0,0,.45); display:flex; align-items:center; justify-content:center; gap:10px; opacity:0; transition:.3s; }
.template-card:hover .preview-overlay { opacity:1; }
.template-info    { padding:20px; }
.template-name    { font-size:1.0625rem; font-weight:700; color:var(--text-primary); margin-bottom:6px; }
.template-desc    { font-size:.8125rem; color:var(--text-muted); margin-bottom:12px; }
.template-features { display:flex; gap:6px; flex-wrap:wrap; margin-bottom:14px; }
.template-features span { font-size:.7rem; padding:3px 10px; border-radius:100px; background:rgba(99,102,241,.07); color:var(--primary); font-weight:600; }
.template-footer  { display:flex; align-items:center; justify-content:space-between; padding-top:12px; border-top:1px solid var(--border); }
.template-price   { display:flex; flex-direction:column; }
.price-label      { font-size:.65rem; color:var(--text-muted); text-transform:uppercase; letter-spacing:.06em; }
.price-value      { font-size:1.25rem; font-weight:800; color:var(--text-primary); }
.buy-actions      { display:flex; gap:8px; }
.no-results       { text-align:center; padding:60px 20px; color:var(--text-muted); }
.section-header   { text-align:center; margin-bottom:40px; }
.section-label    { display:inline-block; background:rgba(99,102,241,.08); color:var(--primary); border-radius:100px; padding:5px 16px; font-size:.75rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; margin-bottom:12px; }
.steps-grid  { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:24px; }
.step-card   { background:#fff; border:1px solid var(--border); border-radius:16px; padding:28px; text-align:center; transition:.2s; }
.step-card:hover { border-color:rgba(99,102,241,.2); box-shadow:0 8px 24px rgba(99,102,241,.08); }
.pricing-section  { padding:80px 0; }
.pricing-grid     { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:24px; margin-top:40px; }
.pricing-subtitle { font-size:.875rem; color:var(--text-muted); margin-top:8px; }
.pricing-amount   { font-size:2.25rem; font-weight:800; color:var(--text-primary); }
.pricing-note     { font-size:.75rem; color:var(--text-muted); margin-top:4px; }
.pricing-divider  { height:1px; background:var(--border); margin:20px 0; }
.industries-row   { display:flex; flex-wrap:wrap; gap:12px; justify-content:center; margin-top:32px; }
.ind-card { background:#fff; border:1px solid var(--border); border-radius:14px; padding:20px 24px; text-align:center; cursor:pointer; transition:.25s; }
.ind-card:hover { border-color:var(--primary); transform:translateY(-3px); box-shadow:0 8px 24px rgba(99,102,241,.1); color:var(--primary); }
.ind-icon { font-size:1.75rem; display:block; margin-bottom:8px; }
.ind-card h4 { font-size:.9rem; font-weight:700; color:var(--text-primary); margin:8px 0 2px; }
.ind-card p  { font-size:.75rem; color:var(--text-muted); margin:0; }
.faq-list { display:flex; flex-direction:column; gap:0; max-width:780px; margin:0 auto; }
.sum-name  { font-weight:700; color:var(--text-primary); }
.sum-plan  { font-size:.875rem; color:var(--text-muted); }
.sum-price { font-size:1.5rem; font-weight:800; color:var(--text-primary); }
.secure-note { display:flex; align-items:center; justify-content:center; gap:8px; font-size:.8rem; color:var(--text-muted); margin-top:12px; }
.scroll-top { position:fixed; bottom:90px; right:28px; width:44px; height:44px; border-radius:50%; background:var(--primary); color:#fff; border:none; display:flex; align-items:center; justify-content:center; cursor:pointer; opacity:0; transition:.3s; z-index:999; }
.scroll-top.show { opacity:1; }

/* ===============================================================
   PORTFOLIO PAGE
=============================================================== */
.portfolio-grid    { display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:28px; align-items:stretch; }
.project-card      { background:#fff; border:1px solid var(--border); border-radius:20px; overflow:hidden; transition:.3s; display:flex; flex-direction:column; }
.project-card:hover { transform:translateY(-6px); box-shadow:0 24px 56px rgba(99,102,241,.14); border-color:rgba(99,102,241,.25); }
.project-image     { height:148px; background:linear-gradient(135deg,rgba(99,102,241,.1),rgba(139,92,246,.1)); display:flex; align-items:center; justify-content:center; overflow:hidden; position:relative; flex-shrink:0; }
.project-content   { padding:22px; flex:1; display:flex; flex-direction:column; }
.project-title     { font-size:1.0625rem; font-weight:700; color:var(--text-primary); margin-bottom:8px; }
.project-desc      { font-size:.875rem; color:var(--text-muted); margin-bottom:14px; line-height:1.65; }
.project-tags      { display:flex; gap:6px; flex-wrap:wrap; margin-bottom:14px; }
.project-tag       { font-size:.7rem; padding:3px 10px; border-radius:100px; background:rgba(99,102,241,.07); color:var(--primary); font-weight:600; }
.project-footer    { display:flex; align-items:center; justify-content:space-between; padding-top:12px; border-top:1px solid var(--border); margin-top:auto; }
.project-meta      { font-size:.75rem; color:var(--text-muted); }
.portfolio-filter  { display:flex; gap:8px; flex-wrap:wrap; justify-content:center; padding:0 0 40px; }
.case-study-card   { background:#fff; border:1px solid var(--border); border-radius:20px; overflow:hidden; transition:.3s; }
.case-study-card:hover { transform:translateY(-4px); box-shadow:0 16px 40px rgba(99,102,241,.1); }
.case-study-image  { aspect-ratio:21/9; background:linear-gradient(135deg,rgba(99,102,241,.08),rgba(139,92,246,.08)); display:flex; align-items:center; justify-content:center; font-size:4rem; }
.case-study-body   { padding:32px; }
.result-metric     { text-align:center; }
.result-metric strong { display:block; font-size:1.75rem; font-weight:900; color:var(--primary); }
.result-metric span   { font-size:.75rem; color:var(--text-muted); font-weight:600; }

.dept-card   { background:rgba(99,102,241,.05); border:1px solid rgba(99,102,241,.15); border-radius:16px; padding:24px; transition:.3s; }
.dept-card:hover { transform:translateY(-3px); }
.dept-card h4 { font-size:1rem; font-weight:700; color:var(--text-primary); margin-bottom:6px; }
.dept-filter { display:flex; gap:8px; flex-wrap:wrap; justify-content:center; margin-bottom:32px; }
.dept-progress-bar  { background:rgba(99,102,241,.1); border-radius:100px; height:6px; overflow:hidden; margin-top:8px; }
.dept-progress-fill { height:100%; background:linear-gradient(90deg,#6366F1,#8B5CF6); border-radius:100px; }
.rank-badge  { width:36px; height:36px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-size:.875rem; font-weight:800; }
.rank-1      { background:linear-gradient(135deg,#F59E0B,#FCD34D); color:#7c3a00; }
.rank-2      { background:linear-gradient(135deg,#9CA3AF,#D1D5DB); color:#1f2937; }
.rank-3      { background:linear-gradient(135deg,#CD7C2F,#D97706); color:#fff; }
.rank-other  { background:rgba(99,102,241,.1); color:var(--primary); }
.leaderboard-table { width:100%; border-collapse:collapse; }
.leaderboard-table th { padding:12px 16px; text-align:left; font-size:.75rem; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:var(--text-muted); border-bottom:2px solid var(--border); }
.leaderboard-table td { padding:14px 16px; border-bottom:1px solid var(--border); font-size:.875rem; color:var(--text-muted); }
.achievement-badge { display:inline-block; font-size:1.25rem; cursor:default; }

/* ===============================================================
   TESTIMONIALS PAGE
=============================================================== */
.testimonial-swiper { overflow:hidden; }
.testimonial-item   { background:#fff; border:1px solid var(--border); border-radius:20px; padding:32px; height:100%; }
.author-info  { margin-top:20px; padding-top:16px; border-top:1px solid var(--border); }
.author-name  { font-weight:700; color:var(--text-primary); font-size:.9375rem; }
.author-title { font-size:.8125rem; color:var(--text-muted); }

/* ===============================================================
   PARTNERS PAGE
=============================================================== */
.partner-card    { background:#fff; border:1px solid var(--border); border-radius:20px; padding:32px; text-align:center; transition:.3s; }
.partner-card:hover { transform:translateY(-4px); box-shadow:0 12px 36px rgba(99,102,241,.1); }
.partner-logo    { width:80px; height:80px; border-radius:20px; background:linear-gradient(135deg,rgba(99,102,241,.08),rgba(139,92,246,.08)); display:flex; align-items:center; justify-content:center; font-size:2rem; margin:0 auto 16px; }
.partner-grid    { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:24px; }
.pillar-card     { background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08); border-radius:18px; padding:28px; transition:.3s; }
.pillar-card:hover { border-color:rgba(99,102,241,.3); }
.pillar-card h4  { font-size:1.0625rem; font-weight:700; color:#fff; margin-bottom:10px; }
.pillar-card p   { font-size:.875rem; color:rgba(255,255,255,.55); line-height:1.7; margin:0; }
.benefit-card    { background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.07); border-radius:16px; padding:24px; }
.tiers-grid      { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:20px; }
.tier-card       { border-radius:20px; padding:28px; position:relative; overflow:hidden; }
.tier-bronze     { background:linear-gradient(135deg,rgba(180,83,9,.15),rgba(217,119,6,.1)); border:1px solid rgba(217,119,6,.25); }
.tier-silver     { background:linear-gradient(135deg,rgba(107,114,128,.15),rgba(156,163,175,.1)); border:1px solid rgba(156,163,175,.25); }
.tier-gold       { background:linear-gradient(135deg,rgba(161,98,7,.15),rgba(245,158,11,.1)); border:1px solid rgba(245,158,11,.25); }
.tier-platinum   { background:linear-gradient(135deg,rgba(99,102,241,.15),rgba(139,92,246,.1)); border:1px solid rgba(99,102,241,.25); }

/* ===============================================================
   CONTACT PAGE
=============================================================== */
.contact-card    { background:#fff; border:1px solid var(--border); border-radius:20px; padding:32px; }
.contact-info-item { display:flex; gap:16px; align-items:flex-start; padding:16px 0; border-bottom:1px solid var(--border); }
.contact-info-item:last-child { border-bottom:none; }
.contact-icon    { width:44px; height:44px; border-radius:12px; background:rgba(99,102,241,.08); display:flex; align-items:center; justify-content:center; color:var(--primary); font-size:1.1rem; flex-shrink:0; }
.office-card     { background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.07); border-radius:16px; padding:24px; }
.contact-form-wrap { background:#fff; border:1px solid var(--border); border-radius:24px; padding:40px; }

/* ===============================================================
   PRICING PAGE
=============================================================== */
.pricing-toggle  { display:flex; align-items:center; gap:12px; justify-content:center; margin-bottom:40px; }
.pricing-badge   { background:linear-gradient(135deg,#6366F1,#8B5CF6); color:#fff; border-radius:100px; padding:3px 12px; font-size:.7rem; font-weight:700; }
.ef-pricing-card { background:#fff; border:1px solid var(--border); border-radius:24px; padding:36px; transition:.3s; position:relative; }
.ef-pricing-card.popular { border-color:var(--primary); box-shadow:0 0 0 2px rgba(99,102,241,.25); }
.ef-pricing-card:hover { transform:translateY(-4px); box-shadow:0 16px 40px rgba(99,102,241,.1); }
.pricing-features-list { list-style:none; padding:0; margin:24px 0; display:flex; flex-direction:column; gap:10px; }
.pricing-features-list li { display:flex; align-items:center; gap:10px; font-size:.875rem; color:var(--text-muted); }
.comparison-table { width:100%; border-collapse:collapse; }
.comparison-table th { padding:16px; text-align:left; border-bottom:2px solid var(--border); font-size:.875rem; font-weight:700; }
.comparison-table td { padding:14px 16px; border-bottom:1px solid var(--border); font-size:.875rem; color:var(--text-muted); }
.add-on-card { background:#fff; border:1px solid var(--border); border-radius:16px; padding:24px; transition:.3s; }
.add-on-card:hover { border-color:rgba(99,102,241,.3); }

/* ===============================================================
   PRODUCTS PAGE — individual product detail pages (.products/ folder)
=============================================================== */
.modules-grid      { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:20px; }
.module-card       { background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08); border-radius:16px; padding:24px; transition:.3s; }
.module-card:hover { border-color:rgba(99,102,241,.3); }
.module-icon       { font-size:1.75rem; margin-bottom:12px; display:block; }
.module-card h4    { font-size:.9375rem; font-weight:700; color:#fff; margin-bottom:6px; }
.module-card p     { font-size:.8125rem; color:rgba(255,255,255,.5); margin:0; }

/* ===============================================================
   FAQ PAGE
=============================================================== */
.faq-category-nav  { display:flex; gap:8px; flex-wrap:wrap; justify-content:center; margin-bottom:48px; }
.faq-category-tab  { padding:8px 22px; border-radius:100px; border:1.5px solid var(--border); font-size:.8125rem; font-weight:600; color:var(--text-muted); cursor:pointer; transition:.2s; background:#fff; }
.faq-category-tab.active, .faq-category-tab:hover { background:var(--primary); border-color:var(--primary); color:#fff; }
.faq-group         { margin-bottom:40px; }
.faq-group-title   { font-size:1.125rem; font-weight:700; color:var(--text-primary); margin-bottom:16px; padding-bottom:12px; border-bottom:1px solid var(--border); }

/* ===============================================================
   SITEMAP PAGE
=============================================================== */
.sitemap-section { padding:80px 0; }
.sitemap-links   { display:flex; flex-direction:column; gap:6px; }
.sitemap-links a { display:block; padding:8px 12px; border-radius:8px; text-decoration:none; color:var(--text-muted); font-size:.875rem; transition:.2s; }
.sitemap-links a:hover { background:rgba(99,102,241,.06); color:var(--primary); }

/* ===============================================================
   MISC / SHARED
=============================================================== */
.check-circle      { width:80px; height:80px; border-radius:50%; background:linear-gradient(135deg,#10B981,#059669); display:flex; align-items:center; justify-content:center; font-size:2rem; color:#fff; margin:0 auto 24px; }
.thank-you-card    { background:#fff; border:1px solid var(--border); border-radius:24px; padding:48px; max-width:580px; margin:0 auto; text-align:center; }
.digital-kpi-grid  { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:24px; }
.kpi-card          { background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08); border-radius:16px; padding:24px; text-align:center; }
.kpi-value         { font-size:2.5rem; font-weight:900; color:var(--primary); }
.kpi-label         { font-size:.8125rem; color:rgba(255,255,255,.5); }
.result-grid       { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:20px; }
.result-card       { background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.07); border-radius:14px; padding:24px; text-align:center; }
.result-value      { font-size:2rem; font-weight:900; color:var(--primary); }
.mini-service-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:20px; }
.mini-service-card { background:#fff; border:1px solid var(--border); border-radius:16px; padding:20px; transition:.3s; }
.mini-service-card:hover { border-color:rgba(99,102,241,.25); transform:translateY(-3px); }
.newsletter-page   { min-height:80vh; display:flex; align-items:center; justify-content:center; padding:80px 20px; }
.newsletter-card   { background:#fff; border:1px solid var(--border); border-radius:24px; padding:48px; max-width:560px; width:100%; text-align:center; }
.form-section      { padding:80px 0; }
.form-card         { background:#fff; border:1px solid var(--border); border-radius:24px; padding:40px; }
.channel-card      { background:#fff; border:1px solid var(--border); border-radius:18px; padding:28px; transition:.3s; }
.channel-card:hover { transform:translateY(-3px); border-color:rgba(99,102,241,.25); }
.metric-highlight  { background:linear-gradient(135deg,rgba(99,102,241,.08),rgba(139,92,246,.06)); border:1px solid rgba(99,102,241,.15); border-radius:16px; padding:24px; text-align:center; }
.metric-value      { font-size:2rem; font-weight:900; color:var(--primary); }
.audit-checklist   { display:flex; flex-direction:column; gap:8px; }
.audit-item        { display:flex; align-items:center; gap:12px; padding:10px 14px; background:#fff; border:1px solid var(--border); border-radius:10px; font-size:.875rem; }
.audit-item i      { color:#10B981; }

/* Location/type badges (careers page) */
.location { background:rgba(99,102,241,.08); color:var(--primary); }
.type     { background:rgba(6,182,212,.08); color:#06B6D4; }
/* Detailed section layout (seo-branding page) */
.detailed-section { padding:80px 0; }

/* Process section */
.process-section { padding:80px 0; }
.process-steps-list { display:flex; flex-direction:column; gap:0; max-width:780px; margin:40px auto 0; }
.process-step-item { display:flex; gap:24px; align-items:flex-start; padding:28px 0; border-bottom:1px solid var(--border); position:relative; }
.process-step-item:last-child { border-bottom:none; }
.process-step-num { width:48px; height:48px; border-radius:50%; background:linear-gradient(135deg,#6366F1,#8B5CF6); color:#fff; font-weight:800; font-size:1.125rem; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.process-step-body h4 { font-size:1rem; font-weight:700; color:var(--text-primary); margin-bottom:6px; }
.process-step-body p  { font-size:.875rem; color:var(--text-muted); line-height:1.7; margin:0; }
/* For process section in services.html with inline step-number */
.process .container h2 { font-size:clamp(1.75rem,3vw,2.25rem); font-weight:800; color:var(--text-primary); }
.process .container p.section-subtitle { max-width:600px; margin:12px auto 40px; }

/* ── product-features h4 heading ── */
.product-features h4 { font-size:.875rem; font-weight:700; color:var(--text-primary); margin-bottom:10px; }
/* ── product-icon base (fallback) ── */
.product-icon { width:52px; height:52px; border-radius:14px; display:flex; align-items:center; justify-content:center; font-size:1.375rem; }
/* ── btn-outline fallback for old-style buttons ── */
.btn-outline { display:inline-flex; align-items:center; justify-content:center; gap:6px; padding:8px 20px; border-radius:100px; border:1.5px solid var(--primary); color:var(--primary); font-size:.875rem; font-weight:600; text-decoration:none; transition:.2s; background:transparent; }
.btn-outline:hover { background:var(--primary); color:#fff; }
/* ── section spacing utility ── */
.section-lg { padding:100px 0; }
.section-sm { padding:48px 0; }
/* ── text alignment helpers for dark sections ── */
.section-dark .section-title { color:#fff; }
.section-dark p { color:rgba(255,255,255,.65); }
/* ── Fix section-dark subtitle that needed inline override ── */
.section-dark .section-subtitle { color:rgba(255,255,255,.65); }

/* ── Careers specific ── */
.life-at { padding:80px 0; background:var(--light-bg); }
.positions { padding:80px 0; }
.positions-list { display:flex; flex-direction:column; gap:16px; max-width:900px; margin:40px auto 0; }
.application-form { padding:80px 0; background:var(--light-bg); }
.file-upload { position:relative; }
.file-upload input[type=file] { position:absolute; inset:0; opacity:0; cursor:pointer; }
.file-upload-label { display:flex; align-items:center; gap:10px; padding:10px 16px; border:2px dashed var(--border); border-radius:10px; color:var(--text-muted); font-size:.875rem; cursor:pointer; transition:.2s; }
.file-upload-label:hover { border-color:var(--primary); color:var(--primary); }
.submit-btn { width:100%; }
.job-header { margin-bottom:16px; }
.job-title { font-size:1rem; font-weight:700; color:var(--text-primary); margin-bottom:8px; }
.job-description { font-size:.875rem; color:var(--text-muted); margin-bottom:12px; line-height:1.65; }
.job-requirements { list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:6px; }
.job-requirements li { font-size:.8125rem; color:var(--text-muted); display:flex; gap:7px; }
.job-requirements li::before { content:"•"; color:var(--primary); font-weight:700; }
.job-toggle { background:none; border:none; cursor:pointer; color:var(--primary); font-size:.875rem; padding:0; }
.apply-btn { display:inline-flex; align-items:center; gap:6px; padding:8px 20px; border-radius:100px; background:var(--primary); color:#fff; font-size:.8125rem; font-weight:600; text-decoration:none; transition:.2s; }
.apply-btn:hover { background:var(--primary-dark); color:#fff; }

/* ── Case studies ── */
.cs-filter { display:flex; gap:8px; flex-wrap:wrap; justify-content:center; margin-bottom:40px; }
.cs-item { transition:.3s; }
.cs-body { padding:32px; }
.cs-quote { border-left:4px solid var(--primary); padding:16px 20px; background:rgba(99,102,241,.05); border-radius:0 8px 8px 0; margin:24px 0; font-style:italic; color:var(--text-muted); }

/* process section alias */
.process { padding:80px 0; }
.perks { padding:80px 0; }
.faq { padding:80px 0; }


/* ── fade-in animation (AOS alternative for legacy classes) ── */
@keyframes ef-fade-in {
  from { opacity:0; transform:translateY(16px); }
  to   { opacity:1; transform:none; }
}
.fade-in { animation: ef-fade-in .6s ease both; }

/* ── results-section ── */
.results-section { padding:80px 0; }

/* ── about page specific ── */
.about-hero-img { width:100%; border-radius:20px; }
.stats-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:20px; margin-top:40px; }
.stat-card { background:#fff; border:1px solid var(--border); border-radius:16px; padding:28px; text-align:center; }
.stat-value { font-size:2rem; font-weight:900; color:var(--primary); }
.stat-label { font-size:.8125rem; color:var(--text-muted); margin-top:4px; }

/* ── contact page ── */
.info-cards  { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:20px; }
.info-card   { background:#fff; border:1px solid var(--border); border-radius:16px; padding:28px; text-align:center; transition:.3s; }
.info-card:hover { transform:translateY(-3px); box-shadow:0 8px 24px rgba(99,102,241,.08); }
.info-card i { font-size:1.75rem; color:var(--primary); margin-bottom:14px; display:block; }
.contact-form-section { padding:80px 0; }
.required    { color:#EF4444; }
.success-message { display:none; padding:16px 20px; background:rgba(16,185,129,.1); border:1px solid rgba(16,185,129,.3); border-radius:10px; color:#059669; font-size:.875rem; margin-top:16px; }
.error-message   { display:none; padding:16px 20px; background:rgba(239,68,68,.1); border:1px solid rgba(239,68,68,.3); border-radius:10px; color:#DC2626; font-size:.875rem; margin-top:16px; }
.hidden      { display:none !important; }
.full        { grid-column:1/-1; }
.map-container { border-radius:16px; overflow:hidden; height:400px; background:rgba(99,102,241,.05); border:1px solid var(--border); }
.map-placeholder { width:100%; height:100%; display:flex; align-items:center; justify-content:center; color:var(--text-muted); font-size:.9rem; }
.quick-links { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:16px; margin-top:32px; }
.quick-link  { display:flex; align-items:center; gap:10px; padding:14px 18px; background:#fff; border:1px solid var(--border); border-radius:12px; text-decoration:none; color:var(--text-muted); font-size:.875rem; transition:.2s; }
.quick-link:hover { border-color:rgba(99,102,241,.3); color:var(--primary); }
.departments { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:16px; margin-top:32px; }
.dept-icon   { width:44px; height:44px; border-radius:12px; background:rgba(99,102,241,.08); display:flex; align-items:center; justify-content:center; color:var(--primary); font-size:1.1rem; flex-shrink:0; margin-bottom:14px; }
.presence-content { display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center; }
.presence-globe { background:rgba(99,102,241,.05); border:1px solid rgba(99,102,241,.1); border-radius:20px; display:flex; align-items:center; justify-content:center; font-size:5rem; min-height:280px; }
.presence-highlights { display:flex; flex-direction:column; gap:12px; margin-top:24px; }
.highlight { display:flex; align-items:center; gap:12px; font-size:.9rem; color:var(--text-muted); }
.highlight i { color:var(--primary); width:20px; text-align:center; }
.highlight-text { font-weight:600; }

/* ── portfolio page extra ── */
.stats-bar { display:flex; gap:32px; flex-wrap:wrap; justify-content:center; padding:32px 0; border-bottom:1px solid var(--border); margin-bottom:40px; }
.project-image-icon { font-size:3.5rem; color:rgba(99,102,241,.45); }
.project-overlay { position:absolute; inset:0; background:rgba(67,56,202,.90); display:flex; align-items:center; justify-content:center; gap:12px; opacity:0; transition:.28s; }
.project-card:hover .project-overlay { opacity:1; }
.overlay-text { color:#fff; font-size:.875rem; font-weight:600; }
.project-header { display:flex; align-items:flex-start; justify-content:space-between; margin-bottom:10px; gap:10px; }
.project-description { font-size:.875rem; color:var(--text-muted); line-height:1.65; margin-bottom:14px; }
.tech-stack { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:16px; }
.tech-pill { display:inline-block; font-size:.7rem; padding:4px 10px; border-radius:100px; background:rgba(99,102,241,.08); color:var(--primary); font-weight:600; border:1px solid rgba(99,102,241,.14); }
.project-link { font-size:.8125rem; font-weight:600; color:var(--primary); text-decoration:none; }
.ecommerce { color:#10B981; }
.webapp { color:#6366F1; }
.websites { color:#06B6D4; }
.mobileapp { color:#F59E0B; }
.case-study-section { padding:80px 0; background:var(--dark-bg); }
.case-study-content { display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center; }
.case-study-text { color:rgba(255,255,255,.7); }
.metrics { display:flex; gap:32px; flex-wrap:wrap; margin-top:32px; }
.metric { text-align:center; }
.metric-label { font-size:.75rem; color:rgba(255,255,255,.4); margin-top:4px; font-weight:600; text-transform:uppercase; }
.clients-section { padding:80px 0; }
.clients-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:16px; margin-top:40px; }

/* ── SEO & branding page ── */
.service-pillars { padding:80px 0; }
.pillars-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:24px; margin-top:40px; }
.pillar-icon { width:56px; height:56px; border-radius:16px; background:linear-gradient(135deg,rgba(99,102,241,.1),rgba(139,92,246,.1)); display:flex; align-items:center; justify-content:center; font-size:1.5rem; color:var(--primary); margin-bottom:18px; }
.pillar-features { list-style:none; padding:0; margin:14px 0; display:flex; flex-direction:column; gap:7px; }
.pillar-features li { font-size:.8125rem; color:var(--text-muted); display:flex; gap:7px; align-items:center; }
.pillar-features li::before { content:"✓"; color:var(--primary); font-weight:700; }
.section-grid { display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center; }
.section-content h2 { font-size:clamp(1.5rem,3vw,2rem); font-weight:800; color:var(--text-primary); }
.feature-list { list-style:none; padding:0; margin:20px 0; display:flex; flex-direction:column; gap:8px; }
.feature-list li { display:flex; gap:10px; font-size:.875rem; color:var(--text-muted); }
.section-image { border-radius:16px; overflow:hidden; background:rgba(99,102,241,.05); border:1px solid rgba(99,102,241,.1); display:flex; align-items:center; justify-content:center; min-height:280px; font-size:4rem; }
.detailed-section { padding:80px 0; }
.pricing-tabs { display:flex; gap:8px; justify-content:center; margin-bottom:32px; }
.pricing-tab  { padding:8px 22px; border-radius:100px; border:1.5px solid var(--border); font-size:.8125rem; font-weight:600; color:var(--text-muted); cursor:pointer; transition:.2s; }
.pricing-tab.active, .pricing-tab:hover { background:var(--primary); border-color:var(--primary); color:#fff; }
.pricing-title { font-size:1.125rem; font-weight:700; color:var(--text-primary); margin-bottom:6px; }
.pricing-period { font-size:.75rem; color:var(--text-muted); margin-left:4px; }
.featured-badge { position:absolute; top:-12px; left:50%; transform:translateX(-50%); background:linear-gradient(135deg,#6366F1,#8B5CF6); color:#fff; border-radius:100px; padding:4px 16px; font-size:.7rem; font-weight:700; white-space:nowrap; }
.ai-advantage { padding:80px 0; }
.ai-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:20px; margin-top:40px; }
.ai-card { background:rgba(99,102,241,.04); border:1px solid rgba(99,102,241,.1); border-radius:16px; padding:24px; transition:.3s; }
.ai-card:hover { border-color:rgba(99,102,241,.25); transform:translateY(-3px); }
.testimonials-section { padding:80px 0; }
.faq-section { padding:80px 0; }
.faq-answer-text { font-size:.875rem; color:var(--text-muted); line-height:1.7; padding:0 0 8px; }
.stat-card { background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.08); border-radius:16px; padding:28px; text-align:center; }
.case-study-title { font-size:1.0625rem; font-weight:700; color:var(--text-primary); margin-bottom:10px; }
.case-study-metric { display:flex; gap:16px; flex-wrap:wrap; margin-top:12px; }
.stats-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:20px; }

/* ── Digital marketing page ── */
.deliverables { list-style:none; padding:0; margin:16px 0; display:flex; flex-direction:column; gap:7px; }
.deliverables li { display:flex; gap:8px; font-size:.8125rem; color:var(--text-muted); }
.deliverables li::before { content:"✓"; color:var(--primary); font-weight:700; }
.pricing-period { font-size:.75rem; color:var(--text-muted); }
.process-steps { display:flex; flex-direction:column; gap:0; }
.platforms-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); gap:16px; margin-top:32px; }
.platform-item { background:#fff; border:1px solid var(--border); border-radius:14px; padding:20px; text-align:center; transition:.3s; }
.platform-item:hover { border-color:rgba(99,102,241,.25); transform:translateY(-3px); }
.platform-icon { font-size:2rem; margin-bottom:8px; display:block; }
.platform-name { font-size:.8125rem; font-weight:600; color:var(--text-muted); }
.content-video { padding:80px 0; }
.content-grid { display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center; }
.content-text h2 { font-size:clamp(1.5rem,3vw,2rem); font-weight:800; color:var(--text-primary); }
.deliverables-list { list-style:none; padding:0; margin:20px 0; }
.deliverables-list li { display:flex; gap:10px; padding:10px 0; border-bottom:1px solid var(--border); font-size:.875rem; color:var(--text-muted); }
.deliverables-list li:last-child { border-bottom:none; }
.content-visual { border-radius:16px; overflow:hidden; background:linear-gradient(135deg,rgba(99,102,241,.08),rgba(139,92,246,.08)); display:flex; align-items:center; justify-content:center; min-height:300px; font-size:5rem; }
.why-item { display:flex; gap:16px; align-items:flex-start; padding:20px 0; border-bottom:1px solid var(--border); }
.why-item:last-child { border-bottom:none; }
.platforms { padding:80px 0; }
.case-studies-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:24px; margin-top:40px; }
.case-study-tag { display:inline-block; font-size:.7rem; padding:3px 10px; border-radius:100px; background:rgba(99,102,241,.08); color:var(--primary); font-weight:600; margin-bottom:8px; }
.case-study-metrics { display:flex; gap:16px; flex-wrap:wrap; margin-top:14px; }
.metric-label { font-size:.72rem; color:var(--text-muted); font-weight:600; text-transform:uppercase; }

/* step-card AOS delay variants */
.step-card-delay-1 { animation-delay:.1s; }
.step-card-delay-2 { animation-delay:.2s; }
.step-card-delay-3 { animation-delay:.3s; }


/* orphaned rules cleaned up — moved to responsive block below */

/* ── Testimonial swiper nav buttons (all pages) ────────── */
.ef-testi-prev,
.ef-testi-next {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: 2px solid rgba(99,102,241,.25);
    background: #fff;
    color: #6366F1;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    flex-shrink: 0;
    transition: background .2s, border-color .2s, color .2s, box-shadow .2s;
    box-shadow: 0 2px 12px rgba(99,102,241,.1);
}
.ef-testi-prev:hover,
.ef-testi-next:hover {
    background: #6366F1;
    border-color: #6366F1;
    color: #fff;
    box-shadow: 0 4px 20px rgba(99,102,241,.3);
}
/* Wrap the swiper + buttons in .ef-testi-wrap for proper side placement */
.ef-testi-wrap {
    position: relative;
    padding: 0 56px;
}
.ef-testi-wrap .ef-testi-prev,
.ef-testi-wrap .ef-testi-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    display: flex;
}
.ef-testi-wrap .ef-testi-prev { left: 0; }
.ef-testi-wrap .ef-testi-next { right: 0; }
@media (max-width: 575px) {
    .ef-testi-wrap { padding: 0 0 60px; }
    .ef-testi-wrap .ef-testi-prev,
    .ef-testi-wrap .ef-testi-next { top: auto; transform: none; bottom: 0; }
    .ef-testi-wrap .ef-testi-prev { left: calc(50% - 52px); }
    .ef-testi-wrap .ef-testi-next { right: calc(50% - 52px); }
}

/* ═══════════════════════════════════════════════════════════════
   PHONE MOCKUP — realistic frame
═══════════════════════════════════════════════════════════════ */
.ef-pm-outer { display:flex; flex-direction:column; align-items:center; gap:10px; }
.ef-pm-frame {
  position:relative; background:#1E293B; border-radius:46px;
  padding:14px 12px; border:2px solid rgba(148,163,184,.2);
  box-shadow:
    0 0 0 1px rgba(0,0,0,.25),
    inset 0 1px 0 rgba(255,255,255,.05),
    0 24px 56px rgba(0,0,0,.3),
    0 0 24px rgba(99,102,241,.08);
  width:162px; flex-shrink:0;
}
/* Side buttons */
.ef-pm-frame::before {
  content:''; position:absolute; right:-3px; top:80px;
  width:3px; height:52px; background:#334155; border-radius:0 3px 3px 0;
}
.ef-pm-frame::after {
  content:''; position:absolute; left:-3px; top:68px;
  width:3px; height:78px; background:#334155; border-radius:3px 0 0 3px;
}
.ef-pm-notch {
  position:absolute; top:14px; left:50%; transform:translateX(-50%);
  width:88px; height:26px; background:#1E293B;
  border-radius:0 0 20px 20px; z-index:2;
  display:flex; align-items:center; justify-content:center; gap:7px; padding-bottom:3px;
}
.ef-pm-notch-cam  { width:9px; height:9px; background:#334155; border-radius:50%; border:1.5px solid rgba(148,163,184,.25); }
.ef-pm-notch-bar  { width:38px; height:4px; background:#334155; border-radius:3px; }
.ef-pm-screen {
  border-radius:32px; overflow:hidden;
  aspect-ratio:9/19.5; background:#0F172A; position:relative;
}
.ef-pm-screen img { width:100%; height:100%; object-fit:cover; display:block; }
.ef-pm-home-bar { width:36%; height:4px; background:rgba(255,255,255,.2); border-radius:3px; margin:8px auto 0; }
.ef-pm-label {
  font-size:.68rem; font-weight:700; color:rgba(0,0,0,.4);
  text-transform:uppercase; letter-spacing:.1em; text-align:center; margin-top:4px;
}

/* ── Swiper slide states — 5 visible, center featured ── */
.ef-phone-swiper {
  overflow:hidden;
  padding: 56px 0 24px;
  margin: 44px 0 0;
}
.ef-phone-swiper .swiper-wrapper { align-items:center; }
.ef-phone-swiper .swiper-slide {
  opacity:.35; transform:scale(.76);
  transition:opacity .45s cubic-bezier(.4,0,.2,1), transform .45s cubic-bezier(.4,0,.2,1);
  display:flex; justify-content:center;
}
.ef-phone-swiper .swiper-slide-prev,
.ef-phone-swiper .swiper-slide-next {
  opacity:.68; transform:scale(.88);
}
.ef-phone-swiper .swiper-slide-active {
  opacity:1; transform:scale(1.12);
}
.ef-phone-swiper .swiper-slide-active .ef-pm-frame {
  border-color:rgba(99,102,241,.45);
  box-shadow:
    0 0 0 1px rgba(0,0,0,.2),
    inset 0 1px 0 rgba(255,255,255,.08),
    0 32px 64px rgba(0,0,0,.25),
    0 0 40px rgba(99,102,241,.2);
}

/* ── Phone Swiper pagination (external — sits below the overflow:hidden swiper) ── */
.ef-phone-swiper-dots.swiper-pagination {
  position: relative; bottom: auto;
  text-align: center; padding: 18px 0 8px;
}
.ef-phone-swiper-dots .swiper-pagination-bullet { background:#6366F1; opacity:.25; width:10px; height:10px; }
.ef-phone-swiper-dots .swiper-pagination-bullet-active { background:#6366F1; opacity:1; }
.ef-phone-swiper .swiper-button-prev,
.ef-phone-swiper .swiper-button-next { color:#6366F1; }
.ef-phone-swiper .swiper-button-prev::after,
.ef-phone-swiper .swiper-button-next::after { font-size:1.2rem; }

/* ═══════════════════════════════════════════════════════════════
   APP SCREENSHOTS SECTION
═══════════════════════════════════════════════════════════════ */
.ef-app-ss-section {
  padding: 88px 0 0; overflow:hidden;
  background:
    radial-gradient(ellipse 60% 40% at 50% 0%, rgba(99,102,241,.08) 0%, transparent 55%),
    linear-gradient(180deg, #FFFFFF 0%, #F5F3FF 40%, #EDE9FE 100%);
}
.ef-ss-pill-row {
  display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin:48px 0 56px;
}
.ef-ss-pill {
  display:inline-flex; align-items:center; gap:7px;
  background:rgba(99,102,241,.08); border:1px solid rgba(99,102,241,.18);
  border-radius:100px; padding:8px 18px;
  font-size:.8rem; font-weight:600; color:#4338CA;
}
.ef-ss-pill i { color:#6366F1; font-size:.75rem; }

/* ── App Feature Highlights (grid below swiper) ── */
.ef-app-features-grid {
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:1px; background:rgba(99,102,241,.16); border-radius:20px;
  overflow:hidden; margin-top:0;
}
.ef-app-feat-item {
  background:rgba(255,255,255,.025);
  padding:28px 24px; display:flex; align-items:flex-start; gap:14px;
  transition:background .2s;
}
.ef-app-feat-item:hover { background:rgba(99,102,241,.09); }
.ef-app-feat-icon {
  width:42px; height:42px; flex-shrink:0; border-radius:12px;
  background:linear-gradient(135deg,rgba(99,102,241,.12),rgba(139,92,246,.08));
  display:flex; align-items:center; justify-content:center;
  color:#6366F1; font-size:.9rem;
}
.ef-app-feat-title { font-size:.875rem; font-weight:700; color:var(--text-primary); margin-bottom:5px; }
.ef-app-feat-desc  { font-size:.775rem; color:var(--text-secondary); line-height:1.55; margin:0; }

/* ── App Spotlight (alternating feature rows) ── */
.ef-app-spotlight-section {
  padding:88px 0;
  background: linear-gradient(180deg, #FFFFFF 0%, #F8F7FF 50%, #F0EEFF 100%);
}
.ef-spotlight-row { margin-bottom:72px; }
.ef-spotlight-row:last-child { margin-bottom:0; }
.ef-spotlight-phone-wrap {
  display:flex; justify-content:center; align-items:center;
  position:relative;
}
.ef-spotlight-phone-wrap .ef-pm-frame { width:200px; }
.ef-spotlight-phone-glow {
  position:absolute; inset:0;
  background:radial-gradient(circle at 50% 50%, rgba(99,102,241,.25) 0%, transparent 65%);
  pointer-events:none;
}
.ef-spotlight-num {
  font-size:5rem; font-weight:900; line-height:1;
  background:linear-gradient(135deg,rgba(99,102,241,.2),rgba(139,92,246,.1));
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
  margin-bottom:4px;
}
.ef-spotlight-tag {
  display:inline-flex; align-items:center; gap:6px;
  background:rgba(99,102,241,.12); border:1px solid rgba(99,102,241,.25);
  border-radius:100px; padding:5px 14px;
  font-size:.75rem; font-weight:700; color:#a5b4fc; letter-spacing:.06em;
  text-transform:uppercase; margin-bottom:16px;
}
.ef-spotlight-title { font-size:1.5rem; font-weight:800; color:#fff; margin-bottom:12px; }
.ef-spotlight-desc  { font-size:.9rem; color:rgba(255,255,255,.6); line-height:1.7; margin-bottom:20px; }
.ef-spotlight-list  { list-style:none; padding:0; margin:0; }
.ef-spotlight-list li {
  display:flex; align-items:flex-start; gap:10px;
  font-size:.85rem; color:rgba(255,255,255,.72); padding:7px 0;
  border-bottom:1px solid rgba(99,102,241,.1);
}
.ef-spotlight-list li:last-child { border-bottom:none; }
.ef-spotlight-list li i { color:#818cf8; font-size:.75rem; margin-top:3px; flex-shrink:0; }

/* ═══════════════════════════════════════════════════════════════
   WEB DASHBOARD SECTION (tabbed)
═══════════════════════════════════════════════════════════════ */
.ef-dashboard-section {
  padding:88px 0;
  background: linear-gradient(160deg, #F5F3FF 0%, #EDE9FE 40%, #E0D9FF 75%, #D5CCFF 100%);
  background-image: radial-gradient(ellipse 60% 40% at 80% 20%, rgba(99,102,241,.10) 0%, transparent 60%);
}
.ef-dash-tabs-wrap { text-align:center; margin:44px 0 0; }
.ef-dash-tabs {
  display:inline-flex; background:rgba(99,102,241,.14); border-radius:16px;
  padding:5px; gap:3px; flex-wrap:wrap; justify-content:center;
}
.ef-dash-tab {
  padding:10px 24px; border-radius:12px;
  font-size:.84rem; font-weight:600; color:#6b7280;
  background:none; border:none; cursor:pointer; transition:.2s;
  white-space:nowrap;
}
.ef-dash-tab:hover { color:#6366F1; }
.ef-dash-tab.active {
  background:#fff; color:#6366F1;
  box-shadow:0 2px 12px rgba(99,102,241,.18);
}
.ef-dash-panel { display:none; animation:dashIn .35s ease; margin-top:28px; }
.ef-dash-panel.active { display:block; }
@keyframes dashIn { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:none; } }
.ef-browser-mockup {
  background:#1a1740; border-radius:16px; overflow:hidden;
  box-shadow:0 32px 80px rgba(99,102,241,.22), 0 0 0 1px rgba(99,102,241,.18);
}
.ef-browser-bar {
  background:#26235a; padding:11px 18px;
  display:flex; align-items:center; gap:7px;
}
.ef-browser-dot { width:12px; height:12px; border-radius:50%; flex-shrink:0; }
.ef-browser-dot-r { background:#FF5F57; }
.ef-browser-dot-y { background:#FEBC2E; }
.ef-browser-dot-g { background:#28C840; }
.ef-browser-url {
  flex:1; background:rgba(255,255,255,.08); border-radius:8px;
  padding:5px 14px; font-size:.73rem; color:rgba(255,255,255,.4);
  margin-left:10px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.ef-browser-body img { width:100%; display:block; }
.ef-dash-tab-desc {
  text-align:center; font-size:.85rem; color:var(--text-muted);
  margin-top:14px; max-width:640px; margin-left:auto; margin-right:auto;
}

/* ── Dashboard Feature Cards ── */
.ef-dash-features {
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:20px; margin-top:56px;
}
.ef-dash-feat-card {
  background:rgba(255,255,255,.88); border:1.5px solid rgba(99,102,241,.18); border-radius:16px;
  padding:26px; transition:transform .25s, box-shadow .25s, border-color .25s;
  position:relative; overflow:hidden; backdrop-filter:blur(8px);
}
.ef-dash-feat-card::before {
  content:''; position:absolute; top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg,#6366F1,#8B5CF6);
  transform:scaleX(0); transform-origin:left; transition:.3s;
}
.ef-dash-feat-card:hover { border-color:rgba(99,102,241,.3); transform:translateY(-4px); box-shadow:0 12px 32px rgba(99,102,241,.1); }
.ef-dash-feat-card:hover::before { transform:scaleX(1); }
.ef-dash-feat-icon {
  width:46px; height:46px; border-radius:14px; margin-bottom:16px;
  background:linear-gradient(135deg,rgba(99,102,241,.12),rgba(139,92,246,.12));
  display:flex; align-items:center; justify-content:center;
  color:#6366F1; font-size:1.05rem;
}
.ef-dash-feat-title { font-size:.9375rem; font-weight:700; color:var(--text-primary); margin-bottom:6px; }
.ef-dash-feat-desc  { font-size:.82rem; color:var(--text-muted); line-height:1.65; margin:0; }

/* ── Integrations strip ── */
.ef-integrations-strip { padding:48px 0; background:linear-gradient(135deg,#F0EEFF 0%,#EDE9FE 50%,#E8E2FF 100%); border-top:1px solid rgba(99,102,241,.15); border-bottom:1px solid rgba(99,102,241,.15); }
.ef-integration-logos {
  display:flex; flex-wrap:wrap; gap:12px 20px;
  justify-content:center; align-items:center; margin-top:20px;
}
.ef-int-logo {
  display:inline-flex; align-items:center; gap:8px;
  background:rgba(255,255,255,.7); border:1px solid rgba(99,102,241,.2); border-radius:10px;
  padding:10px 18px; font-size:.8rem; font-weight:700; color:#4338CA;
  transition:.2s; backdrop-filter:blur(4px);
}
.ef-int-logo:hover { border-color:rgba(99,102,241,.45); color:#6366F1; background:#fff; box-shadow:0 4px 14px rgba(99,102,241,.12); }
.ef-int-logo i { font-size:1rem; }

/* ═══════════════════════════════════════════════════════════════
   DAIRYKHATA — HERO
═══════════════════════════════════════════════════════════════ */
.ef-dk-hero {
  position:relative; overflow:hidden; padding:100px 0 80px;
  background:
    radial-gradient(ellipse 60% 70% at 90% 40%, rgba(99,102,241,.2) 0%, transparent 60%),
    radial-gradient(ellipse 50% 60% at 5% 80%, rgba(139,92,246,.15) 0%, transparent 55%),
    linear-gradient(160deg, #050212 0%, #0a0528 25%, #130e3a 50%, #1e1a6a 75%, #2d2880 100%);
}
.ef-dk-hero-bg {
  position:absolute; inset:0; pointer-events:none;
  background-image:
    radial-gradient(circle 1px at 20% 30%, rgba(99,102,241,.35) 0%, transparent 0%),
    radial-gradient(circle 1.5px at 60% 15%, rgba(139,92,246,.3) 0%, transparent 0%),
    radial-gradient(circle 1px at 80% 60%, rgba(6,182,212,.25) 0%, transparent 0%),
    radial-gradient(circle 1px at 40% 75%, rgba(99,102,241,.2) 0%, transparent 0%);
  background-size:200px 200px, 300px 300px, 250px 250px, 180px 180px;
}
.min-vh-hero { min-height:80vh; padding:60px 0; }
/* Trust bar */
.ef-dk-trust-bar { display:flex; align-items:center; gap:0; flex-wrap:wrap; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.1); border-radius:16px; padding:16px 24px; gap:0; }
.ef-dk-trust-item { flex:1; min-width:80px; text-align:center; }
.ef-dk-trust-num { display:block; font-size:clamp(1.1rem,2vw,1.4rem); font-weight:900; color:#fff; line-height:1.1; }
.ef-dk-trust-label { display:block; font-size:.7rem; color:rgba(255,255,255,.5); font-weight:600; text-transform:uppercase; letter-spacing:.04em; margin-top:2px; }
.ef-dk-trust-sep { width:1px; height:36px; background:rgba(255,255,255,.12); flex-shrink:0; }
/* App download badges */
.ef-dk-badges { display:flex; gap:12px; flex-wrap:wrap; }
/* Hero visual */
.ef-dk-hero-visual { position:relative; width:100%; max-width:500px; }
.ef-dk-hero-phone { position:relative; z-index:2; margin-left:40px; }
.ef-dk-hero-phone .ef-pm-frame { width:200px; }
/* Phone UI content */
.ef-dk-phone-screen { background:linear-gradient(160deg,#0d0b2a,#1a1748) !important; }
.ef-dk-phone-ui { padding:12px 10px; font-size:.65rem; }
.ef-dk-phone-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:10px; }
.ef-dk-phone-logo { font-weight:800; color:#fff; font-size:.7rem; }
.ef-dk-phone-time { color:rgba(255,255,255,.45); font-size:.6rem; }
.ef-dk-phone-card { background:linear-gradient(135deg,rgba(99,102,241,.3),rgba(139,92,246,.2)); border-radius:10px; padding:10px; margin-bottom:8px; text-align:center; }
.ef-dk-phone-card-label { font-size:.58rem; color:rgba(255,255,255,.55); text-transform:uppercase; letter-spacing:.05em; }
.ef-dk-phone-card-value { font-size:1.3rem; font-weight:900; color:#fff; line-height:1.1; }
.ef-dk-phone-card-sub { font-size:.58rem; color:#10B981; }
.ef-dk-phone-row { display:flex; gap:4px; margin-bottom:8px; }
.ef-dk-phone-mini { flex:1; background:rgba(255,255,255,.06); border-radius:8px; padding:6px 4px; text-align:center; font-size:.58rem; color:rgba(255,255,255,.65); }
.ef-dk-phone-mini strong { display:block; color:#fff; font-size:.72rem; }
.ef-dk-phone-mini .ef-dk-phone-mini-icon { font-size:.85rem; margin-bottom:2px; }
.ef-dk-phone-btn { background:linear-gradient(135deg,#6366F1,#8B5CF6); color:#fff; border-radius:8px; padding:7px; text-align:center; font-size:.65rem; font-weight:700; margin-bottom:8px; cursor:pointer; }
.ef-dk-phone-list { display:flex; flex-direction:column; gap:4px; }
.ef-dk-phone-list-item { display:flex; justify-content:space-between; align-items:center; padding:4px 6px; background:rgba(255,255,255,.04); border-radius:6px; font-size:.6rem; color:rgba(255,255,255,.65); }
.ef-dk-phone-paid { color:#10B981; font-weight:700; font-size:.62rem; }
/* Floating dashboard card */
.ef-dk-hero-dash-card { position:absolute; top:20px; right:-20px; background:rgba(15,12,40,.92); border:1px solid rgba(99,102,241,.3); border-radius:16px; padding:16px 18px; min-width:180px; backdrop-filter:blur(12px); z-index:3; }
.ef-dk-dash-card-header { font-size:.72rem; font-weight:700; color:#a5b4fc; margin-bottom:10px; }
.ef-dk-dash-card-row { display:flex; justify-content:space-between; font-size:.72rem; color:rgba(255,255,255,.55); margin-bottom:6px; }
.ef-dk-dash-card-row strong { color:#fff; }
.ef-dk-dash-bar { height:4px; background:rgba(255,255,255,.1); border-radius:2px; margin:8px 0 4px; }
.ef-dk-dash-bar-fill { height:100%; background:linear-gradient(90deg,#6366F1,#8B5CF6); border-radius:2px; }
/* Floating badge */
.ef-dk-hero-badge-float { position:absolute; bottom:30px; left:-20px; display:flex; align-items:center; gap:10px; background:rgba(10,5,40,.92); border:1px solid rgba(16,185,129,.3); border-radius:12px; padding:12px 14px; backdrop-filter:blur(12px); z-index:3; }
/* Hero title */
.ef-dk-hero-title { font-size:clamp(1.75rem,3.5vw,2.75rem); font-weight:900; color:#fff; line-height:1.18; margin-bottom:16px; }
.ef-dk-hero-sub { font-size:clamp(.9rem,1.4vw,1.05rem); color:rgba(255,255,255,.65); line-height:1.75; margin-bottom:28px; max-width:580px; }

/* ═══════════════════════════════════════════════════════════════
   DAIRYKHATA — WHAT'S IN STORE FOR / BENEFITS / ABOUT
═══════════════════════════════════════════════════════════════ */
.ef-for-section { padding:88px 0; background:linear-gradient(180deg,#F9F7FF 0%,#F0EDFF 100%); }
/* For-cards */
.ef-for-card { border-radius:24px; padding:36px 32px; height:100%; display:flex; flex-direction:column; }
.ef-for-farmer  { background:#fff; border:2px solid rgba(99,102,241,.15); box-shadow:0 8px 32px rgba(99,102,241,.08); }
.ef-for-gaushala{ background:#fff; border:2px solid rgba(16,185,129,.15); box-shadow:0 8px 32px rgba(16,185,129,.06); }
.ef-for-card-header { display:flex; align-items:flex-start; gap:16px; margin-bottom:24px; }
.ef-for-icon { width:52px; height:52px; border-radius:16px; display:flex; align-items:center; justify-content:center; font-size:1.3rem; flex-shrink:0; }
.ef-for-farmer  .ef-for-icon { background:linear-gradient(135deg,rgba(99,102,241,.15),rgba(139,92,246,.1)); color:#6366F1; }
.ef-for-gaushala .ef-for-icon { background:linear-gradient(135deg,rgba(16,185,129,.15),rgba(5,150,105,.1)); color:#10B981; }
.ef-for-title { font-size:1.2rem; font-weight:900; color:var(--text-primary); margin:0 0 4px; }
.ef-for-subtitle { font-size:.82rem; color:var(--text-secondary); margin:0; }
.ef-for-list { list-style:none; padding:0; margin:0 0 24px; display:flex; flex-direction:column; gap:16px; flex:1; }
.ef-for-list li { display:flex; gap:12px; align-items:flex-start; }
.ef-for-li-icon { margin-top:2px; flex-shrink:0; }
.ef-for-farmer   .ef-for-li-icon { color:#6366F1; }
.ef-for-gaushala .ef-for-li-icon { color:#10B981; }
.ef-for-list li strong { font-size:.875rem; font-weight:800; color:var(--text-primary); display:block; margin-bottom:3px; }
.ef-for-list li p { font-size:.8rem; color:var(--text-secondary); margin:0; line-height:1.6; }
.ef-for-btn { display:inline-block; padding:12px 28px; border-radius:100px; font-size:.875rem; font-weight:700; text-decoration:none; transition:.2s; text-align:center; }
.ef-for-btn-farmer  { background:linear-gradient(135deg,#6366F1,#8B5CF6); color:#fff; }
.ef-for-btn-gaushala{ background:linear-gradient(135deg,#10B981,#059669); color:#fff; }
.ef-for-btn:hover { transform:translateY(-2px); box-shadow:0 6px 20px rgba(99,102,241,.25); }

/* Benefits */
.ef-benefits-section { padding:88px 0; }
.ef-benefit-card { background:rgba(255,255,255,.04); border:1px solid rgba(99,102,241,.15); border-radius:20px; padding:32px 28px; height:100%; position:relative; overflow:hidden; transition:transform .25s, box-shadow .25s; }
.ef-benefit-card::before { content:''; position:absolute; top:0; left:0; right:0; height:3px; background:linear-gradient(90deg, var(--bc, #6366F1), color-mix(in srgb, var(--bc, #6366F1) 50%, #8B5CF6)); }
.ef-benefit-card:hover { transform:translateY(-6px); box-shadow:0 16px 40px rgba(99,102,241,.15); }
.ef-benefit-icon { width:52px; height:52px; border-radius:16px; display:flex; align-items:center; justify-content:center; font-size:1.25rem; margin-bottom:18px; background:rgba(99,102,241,.12); color:var(--bc, #6366F1); }
.ef-benefit-title { font-size:.9375rem; font-weight:800; color:#fff; margin-bottom:10px; }
.ef-benefit-desc { font-size:.825rem; color:rgba(255,255,255,.55); line-height:1.7; margin-bottom:14px; }
.ef-benefit-stat { display:inline-block; background:rgba(99,102,241,.15); border:1px solid rgba(99,102,241,.2); border-radius:100px; padding:4px 14px; font-size:.72rem; font-weight:700; color:#a5b4fc; }

/* About DairyKhata */
.ef-about-dk-section { padding:88px 0; }
.ef-about-dk-visual { position:relative; }
.ef-about-dk-card1 { background:linear-gradient(135deg,#6366F1,#8B5CF6); border-radius:20px; padding:28px 24px; margin-bottom:12px; }
.ef-about-dk-icon { font-size:2rem; color:rgba(255,255,255,.7); display:block; margin-bottom:10px; }
.ef-about-dk-card-title { font-size:1rem; font-weight:800; color:#fff; margin-bottom:6px; }
.ef-about-dk-card-desc { font-size:.8rem; color:rgba(255,255,255,.7); line-height:1.6; margin:0; }
.ef-about-dk-card2 { background:#fff; border:1.5px solid rgba(99,102,241,.12); border-radius:16px; padding:20px 24px; margin-bottom:12px; box-shadow:0 4px 20px rgba(99,102,241,.06); }
.ef-about-dk-stat-row { display:flex; justify-content:space-around; }
.ef-about-dk-stat span { display:block; font-size:1.4rem; font-weight:900; color:#6366F1; text-align:center; }
.ef-about-dk-stat small { display:block; font-size:.72rem; color:var(--text-secondary); text-align:center; font-weight:600; }
.ef-about-dk-card3 { background:#FFF7ED; border:1px solid rgba(245,158,11,.2); border-radius:12px; padding:12px 18px; font-size:.78rem; color:#92400E; font-weight:600; display:flex; align-items:center; }
.ef-about-dk-feat { font-size:.875rem; color:var(--text-secondary); display:flex; align-items:center; padding:6px 0; }

/* ─── Responsive ─── */
@media (max-width:991.98px) {
  .ef-dk-hero-dash-card, .ef-dk-hero-badge-float { display:none; }
  .ef-dk-hero { padding:80px 0 60px; }
  .min-vh-hero { min-height:auto; }
}
@media (max-width:767.98px) {
  .ef-for-section, .ef-benefits-section, .ef-about-dk-section { padding:64px 0; }
  .ef-for-card { padding:24px 20px; }
  .ef-dk-trust-bar { gap:8px; }
  .ef-dk-trust-sep { display:none; }
  .ef-dk-badges { flex-direction:column; }
}

/* ═══════════════════════════════════════════════════════════════
   INDUSTRIES / USE CASES SECTION
═══════════════════════════════════════════════════════════════ */
.ef-industries-section { padding:88px 0; }
.ef-industry-card {
  padding:28px 24px; border-radius:16px;
  background:#fff; border:1px solid #E5E7EB;
  transition:transform .25s, box-shadow .25s, border-color .25s;
  height:100%; position:relative; overflow:hidden;
}
.ef-industry-card::before {
  content:''; position:absolute; top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg,#6366F1,#8B5CF6);
  transform:scaleX(0); transform-origin:left; transition:.3s;
}
.ef-industry-card:hover {
  transform:translateY(-5px);
  box-shadow:0 12px 32px rgba(99,102,241,.12);
  border-color:rgba(99,102,241,.35);
}
.ef-industry-card:hover::before { transform:scaleX(1); }
.ef-industry-card:hover .ef-industry-icon {
  background:linear-gradient(135deg,#6366F1,#8B5CF6);
  color:#fff;
  box-shadow:0 6px 20px rgba(99,102,241,.3);
}
.ef-industry-icon {
  width:52px; height:52px; border-radius:14px; margin-bottom:18px;
  background:#EEF2FF;
  border:1px solid rgba(99,102,241,.15);
  display:flex; align-items:center; justify-content:center;
  font-size:1.15rem; color:#4F46E5;
  transition:background .25s, color .25s, box-shadow .25s;
}
.ef-industry-title { font-size:1rem; font-weight:800; color:#111827; margin-bottom:8px; }
.ef-industry-desc  { font-size:.84rem; color:#6B7280; line-height:1.65; margin:0; }

/* ═══════════════════════════════════════════════════════════════
   GET THE APP SECTION
═══════════════════════════════════════════════════════════════ */
.ef-getapp-section {
  padding:88px 0;
  background:
    radial-gradient(ellipse 55% 60% at 90% 50%, rgba(99,102,241,.2) 0%, transparent 60%),
    radial-gradient(ellipse 45% 50% at 5% 70%, rgba(139,92,246,.14) 0%, transparent 55%),
    linear-gradient(160deg, #050212 0%, #0a0528 30%, #130e3a 55%, #1e1a6a 80%, #2d2880 100%);
  overflow:hidden; position:relative;
}
.ef-getapp-desc {
  font-size:.9375rem; color:rgba(255,255,255,.65); line-height:1.75; margin-bottom:20px;
}
.ef-getapp-platform {
  display:inline-flex; align-items:center; gap:8px;
  background:rgba(99,102,241,.15); border:1px solid rgba(99,102,241,.25);
  border-radius:100px; padding:7px 18px;
  font-size:.78rem; font-weight:700; color:#a5b4fc;
  letter-spacing:.04em; margin-bottom:28px;
}
.ef-getapp-badges { display:flex; gap:14px; flex-wrap:wrap; margin-bottom:20px; }
.ef-store-badge {
  display:inline-flex; align-items:center; gap:12px;
  background:rgba(255,255,255,.08); border:1.5px solid rgba(255,255,255,.15);
  border-radius:14px; padding:12px 20px;
  text-decoration:none; transition:.2s; min-width:160px;
}
.ef-store-badge:hover { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.3); transform:translateY(-2px); }
.ef-store-icon { font-size:1.5rem; color:#fff; flex-shrink:0; }
.ef-store-text span  { display:block; font-size:.65rem; color:rgba(255,255,255,.55); line-height:1; margin-bottom:2px; }
.ef-store-text strong{ display:block; font-size:.95rem; color:#fff; font-weight:700; }
.ef-getapp-web-link {
  display:inline-flex; align-items:center; gap:6px;
  font-size:.84rem; color:rgba(255,255,255,.5); text-decoration:none; transition:.2s;
}
.ef-getapp-web-link:hover { color:#a5b4fc; }
/* Visual area */
.ef-getapp-visual { position:relative; display:flex; align-items:center; justify-content:center; gap:24px; }
.ef-getapp-phone1,
.ef-getapp-phone2 { width:140px; }
.ef-getapp-phone1 { transform:rotate(-6deg) translateY(16px); }
.ef-getapp-phone2 { transform:rotate(4deg) translateY(-10px); }
.ef-getapp-qr {
  position:absolute; bottom:-20px; right:-10px;
  background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.15);
  border-radius:16px; padding:14px; text-align:center;
}
.ef-getapp-qr-inner {
  width:80px; height:80px; background:#fff; border-radius:8px;
  display:flex; align-items:center; justify-content:center; margin-bottom:8px;
}
.ef-qr-grid {
  width:64px; height:64px;
  background-image:
    linear-gradient(#6366F1 2px, transparent 2px),
    linear-gradient(90deg, #6366F1 2px, transparent 2px),
    linear-gradient(rgba(99,102,241,.3) 1px, transparent 1px),
    linear-gradient(90deg, rgba(99,102,241,.3) 1px, transparent 1px);
  background-size: 16px 16px, 16px 16px, 4px 4px, 4px 4px;
  border-radius:4px;
}
.ef-getapp-qr span { font-size:.65rem; color:rgba(255,255,255,.45); font-weight:600; }

/* ═══════════════════════════════════════════════════════════════
   RESULTS / ROI SECTION
═══════════════════════════════════════════════════════════════ */
.ef-roi-section { padding:88px 0; }
.ef-roi-card {
  padding:32px 28px; border-radius:20px;
  background:rgba(255,255,255,.04); border:1px solid rgba(99,102,241,.18);
  height:100%; transition:transform .25s, box-shadow .25s, background .25s;
  text-align:center; position:relative; overflow:hidden;
}
.ef-roi-card::before {
  content:''; position:absolute; top:0; left:0; right:0; height:2px;
  background:linear-gradient(90deg,#6366F1,#8B5CF6,#06B6D4);
}
.ef-roi-card:hover { transform:translateY(-6px); background:rgba(99,102,241,.08); box-shadow:0 16px 48px rgba(99,102,241,.18); }
.ef-roi-icon {
  width:52px; height:52px; border-radius:16px; margin:0 auto 16px;
  background:linear-gradient(135deg,rgba(99,102,241,.2),rgba(139,92,246,.15));
  display:flex; align-items:center; justify-content:center;
  font-size:1.2rem; color:#a5b4fc;
}
.ef-roi-num   { font-size:clamp(2rem,4vw,2.75rem); font-weight:900; color:#fff; line-height:1; margin-bottom:6px; background:linear-gradient(135deg,#a5b4fc,#818cf8); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.ef-roi-label { font-size:.875rem; font-weight:800; color:#fff; margin-bottom:10px; }
.ef-roi-desc  { font-size:.8rem; color:rgba(255,255,255,.5); line-height:1.65; margin:0; }

/* ─── Responsive ─── */
@media (max-width:767.98px) {
  .ef-industries-section,
  .ef-getapp-section,
  .ef-roi-section { padding:64px 0; }
  .ef-getapp-badges { flex-direction:column; }
  .ef-store-badge { min-width:0; }
}

/* ═══════════════════════════════════════════════════════════════
   PRODUCT PRICING
═══════════════════════════════════════════════════════════════ */
.ef-product-pricing {
  padding:88px 0;
  background: linear-gradient(180deg, #FAFAFE 0%, #F5F3FF 50%, #EDE9FE 100%);
}
.ef-pp-card {
  background:#fff; border:1px solid #E5E7EB; border-radius:16px;
  padding:32px 28px; height:100%;
  transition:transform .25s, box-shadow .25s, border-color .25s;
  display:flex; flex-direction:column; position:relative;
}
.ef-pp-card:hover {
  transform:translateY(-6px);
  box-shadow:0 16px 40px rgba(0,0,0,.08);
  border-color:rgba(99,102,241,.3);
}
/* ── Popular card ── */
.ef-pp-card.ef-pp-popular {
  background:linear-gradient(160deg, #4338CA 0%, #6366F1 50%, #7C3AED 100%);
  border:2px solid rgba(255,255,255,.15);
  box-shadow:0 20px 48px rgba(99,102,241,.3);
  transform:scale(1.03);
}
.ef-pp-card.ef-pp-popular:hover { transform:scale(1.05) translateY(-4px); box-shadow:0 24px 56px rgba(99,102,241,.35); }

/* ── Badge ── */
.ef-pp-badge {
  display:inline-flex; align-items:center; gap:5px;
  background:rgba(255,255,255,.2); color:#fff;
  font-size:.65rem; font-weight:800; letter-spacing:.1em;
  text-transform:uppercase; padding:5px 14px; border-radius:100px; margin-bottom:14px;
  backdrop-filter:blur(4px);
}

/* ── Plan name ── */
.ef-pp-plan, .ef-pp-name {
  font-size:1.1rem; font-weight:800; color:#111827; margin-bottom:4px;
}
.ef-pp-popular .ef-pp-plan, .ef-pp-popular .ef-pp-name { color:rgba(255,255,255,.85); }

/* ── Price ── */
.ef-pp-price {
  font-size:clamp(1.75rem,4vw,2.25rem); font-weight:900; line-height:1.1;
  margin:8px 0 4px; color:#111827;
}
.ef-pp-popular .ef-pp-price { color:#fff; }
.ef-pp-period { font-size:.78rem; color:#9CA3AF; display:inline; font-weight:500; }
.ef-pp-popular .ef-pp-period { color:rgba(255,255,255,.6); }

/* ── Divider ── */
.ef-pp-divider { height:1px; background:#E5E7EB; margin:20px 0; }
.ef-pp-popular .ef-pp-divider { background:rgba(255,255,255,.15); }

/* ── Features ── */
.ef-pp-features { list-style:none; padding:0; margin:0 0 24px; flex:1; }
.ef-pp-features li {
  display:flex; align-items:flex-start; gap:10px;
  font-size:.84rem; color:#4B5563; padding:7px 0; line-height:1.5;
}
.ef-pp-popular .ef-pp-features li { color:rgba(255,255,255,.85); }
.ef-pp-features li i { color:#22C55E; margin-top:3px; flex-shrink:0; font-size:.75rem; }
.ef-pp-popular .ef-pp-features li i { color:#86EFAC; }

/* ── CTA button alignment ── */
.ef-pp-card .btn { margin-top:auto; font-weight:700; padding:12px 24px; border-radius:10px; }
.ef-pp-popular .btn-primary { background:#fff; color:#4F46E5; border-color:#fff; }
.ef-pp-popular .btn-primary:hover { background:#EEF2FF; color:#4338CA; }

/* ── Responsive ── */
@media (max-width:991.98px) { .ef-dash-features { grid-template-columns:repeat(2,1fr); } }
@media (max-width:767.98px) {
  .ef-app-features-grid { grid-template-columns:repeat(2,1fr); }
  .ef-dash-features     { grid-template-columns:repeat(2,1fr); }
  .ef-phone-swiper .swiper-slide { transform:scale(.82) !important; }
  .ef-phone-swiper .swiper-slide-active { transform:scale(1.06) !important; }
  .ef-pp-card.ef-pp-popular { transform:scale(1); }
  .ef-pp-card.ef-pp-popular:hover { transform:translateY(-4px); }
  .ef-spotlight-phone-wrap .ef-pm-frame { width:160px; }
  .ef-spotlight-num { font-size:3.5rem; }
}
@media (max-width:575.98px) {
  .ef-app-features-grid { grid-template-columns:1fr; }
  .ef-dash-features     { grid-template-columns:1fr; }
  .ef-phone-swiper .swiper-slide { transform:scale(.78) !important; }
  .ef-phone-swiper .swiper-slide-active { transform:scale(1.02) !important; }
}

/* ── Pages-specific mobile responsive ── */
@media (max-width:767.98px) {
  /* Phone swiper section */
  .ef-app-ss-section { padding:56px 0 0; }
  .ef-phone-swiper { padding:36px 0 16px; margin-top:32px; }
  .ef-pm-frame { width:130px !important; border-radius:36px; padding:10px 8px; }
  .ef-pm-notch { width:70px; height:20px; }
  .ef-pm-label { font-size:.6rem; }

  /* App spotlight alternating rows */
  .ef-app-spotlight-section .row.flex-row-reverse { flex-direction:column !important; }
  .ef-app-spotlight-section .ef-pm-frame { width:140px !important; }

  /* Dashboard alternating rows */
  .section-white .row.flex-row-reverse,
  .section-light .row.flex-row-reverse { flex-direction:column !important; }

  /* Get the App */
  .ef-getapp-section { padding:56px 0; }
  .ef-getapp-badges { flex-direction:column; }
  .ef-store-badge { min-width:0; width:100%; }

  /* Integrations strip */
  .ef-integrations-strip { padding:32px 0; }
  .ef-int-logo { font-size:.72rem; padding:8px 14px; }

  /* Pricing cards */
  .ef-product-pricing { padding:56px 0; }

  /* Blog grid */
  .portfolio-grid, .blog-grid { grid-template-columns:1fr !important; }

  /* Team grid */
  .team-grid { grid-template-columns:repeat(2,1fr) !important; gap:16px !important; }

  /* Filter buttons */
  .filter-buttons, .dept-filter, .cs-filter { gap:8px; }
  .filter-btn { font-size:.75rem; padding:8px 14px; min-height:38px; }

  /* Table responsive */
  .table-responsive { font-size:.78rem; }

  /* Comparison table */
  .table th, .table td { white-space:normal; word-break:break-word; }
}

@media (max-width:375px) {
  .ef-pm-frame { width:110px !important; border-radius:30px; padding:8px 6px; }
  .ef-phone-swiper { padding:24px 0 20px; }
  .ef-pm-notch { width:58px; height:16px; }
  .ef-pm-home-bar { width:30%; height:3px; }
  .ef-getapp-section .col-lg-5 { display:none !important; }
}

/* ══════════════════════════════════════════════════════════
   RESPONSIVE POLISH — v3
   Additional targeted fixes for cross-device consistency
   ══════════════════════════════════════════════════════════ */

/* ── Map container: reduce fixed height on small screens ── */
@media (max-width:767.98px) {
  .map-container { height:240px; }
}

/* ── Countdown units: fit 4 on narrowest phones without overflow ── */
@media (max-width:479.98px) {
  .countdown-unit { min-width:60px; padding:12px 10px; }
}

/* ── Sidebar: tighten sticky-top to match navbar height ── */
@media (min-width:992px) {
  .sidebar { top:84px; }
}

/* ── Case-study content: reduce gap on tablet ── */
@media (min-width:768px) and (max-width:991.98px) {
  .case-study        { gap:32px; }
  .case-study-content { gap:32px; }
}

/* ── Blog main: ensure sidebar collapses cleanly at lg breakpoint ── */
@media (max-width:991.98px) {
  .blog-main { gap:32px; }
  .sidebar   { position:static; }
}

/* ── Coming-soon: countdown responsive on 320px phones ── */
@media (max-width:359px) {
  .countdown-block { gap:8px; }
  .countdown-unit  { min-width:54px; padding:10px 8px; border-radius:10px; }
  .countdown-unit .number { font-size:1.5rem !important; }
}

/* ══════════════════════════════════════════════════════════
   pf-* — Browse Our Work cards (our-portfolio.php)
   Clean new system — zero cascade conflicts
   ══════════════════════════════════════════════════════════ */

/* Grid */
.pf-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 24px;
}

/* Card */
.pf-card {
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 18px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform .25s, box-shadow .25s, border-color .25s;
}
.pf-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 20px 48px rgba(99,102,241,.13);
  border-color: rgba(99,102,241,.28);
}
.pf-card.hidden { display: none !important; }

/* Head — colored image area */
.pf-head {
  height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
  text-decoration: none;
  flex-shrink: 0;
}
/* Bottom accent line */
.pf-head::after {
  content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 3px;
  transition: opacity .25s;
}
.pf-card:hover .pf-head::after { opacity: 0; }

/* Icon */
.pf-icon {
  font-size: 2.75rem;
  position: relative;
  z-index: 1;
  transition: transform .25s;
}
.pf-card:hover .pf-icon { transform: scale(1.1); }

/* Hover overlay */
.pf-overlay {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-size: .875rem; font-weight: 600; gap: 6px;
  opacity: 0; transition: opacity .25s;
}
.pf-card:hover .pf-overlay { opacity: 1; }

/* ── Category colour tokens ── */
.pf-fintech   { background: linear-gradient(135deg,rgba(99,102,241,.13),rgba(67,56,202,.09)); }
.pf-fintech   .pf-icon    { color: rgba(99,102,241,.6); }
.pf-fintech   .pf-overlay { background: rgba(67,56,202,.92); }
.pf-fintech::after         { background: #6366F1; }

.pf-agritech  { background: linear-gradient(135deg,rgba(16,185,129,.13),rgba(5,150,105,.09)); }
.pf-agritech  .pf-icon    { color: rgba(16,185,129,.6); }
.pf-agritech  .pf-overlay { background: rgba(4,120,87,.92); }
.pf-agritech::after        { background: #10B981; }

.pf-legaltech { background: linear-gradient(135deg,rgba(139,92,246,.13),rgba(109,40,217,.09)); }
.pf-legaltech .pf-icon    { color: rgba(139,92,246,.6); }
.pf-legaltech .pf-overlay { background: rgba(109,40,217,.92); }
.pf-legaltech::after       { background: #8B5CF6; }

.pf-ecommerce { background: linear-gradient(135deg,rgba(6,182,212,.13),rgba(8,145,178,.09)); }
.pf-ecommerce .pf-icon    { color: rgba(6,182,212,.6); }
.pf-ecommerce .pf-overlay { background: rgba(8,145,178,.92); }
.pf-ecommerce::after       { background: #06B6D4; }

.pf-webapp    { background: linear-gradient(135deg,rgba(79,70,229,.13),rgba(99,102,241,.09)); }
.pf-webapp    .pf-icon    { color: rgba(79,70,229,.6); }
.pf-webapp    .pf-overlay { background: rgba(67,56,202,.92); }
.pf-webapp::after          { background: #4F46E5; }

.pf-websites  { background: linear-gradient(135deg,rgba(59,130,246,.13),rgba(37,99,235,.09)); }
.pf-websites  .pf-icon    { color: rgba(59,130,246,.6); }
.pf-websites  .pf-overlay { background: rgba(29,78,216,.92); }
.pf-websites::after        { background: #3B82F6; }

.pf-mobileapp { background: linear-gradient(135deg,rgba(245,158,11,.13),rgba(217,119,6,.09)); }
.pf-mobileapp .pf-icon    { color: rgba(217,119,6,.6); }
.pf-mobileapp .pf-overlay { background: rgba(180,83,9,.92); }
.pf-mobileapp::after       { background: #F59E0B; }

/* Body */
.pf-body {
  padding: 18px 20px 0;
  flex: 1;
  display: flex;
  flex-direction: column;
}
.pf-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}
.pf-title {
  font-size: 1rem;
  font-weight: 700;
  color: #111827;
  margin: 0;
  line-height: 1.4;
}
.pf-tag {
  flex-shrink: 0;
  font-size: .64rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .07em;
  padding: 3px 9px;
  border-radius: 100px;
  white-space: nowrap;
  margin-top: 2px;
}
.pf-tag-fintech   { color: #6366F1; background: rgba(99,102,241,.1); }
.pf-tag-agritech  { color: #059669; background: rgba(16,185,129,.1); }
.pf-tag-legaltech { color: #7C3AED; background: rgba(139,92,246,.1); }
.pf-tag-ecommerce { color: #0891B2; background: rgba(6,182,212,.1); }
.pf-tag-webapp    { color: #4F46E5; background: rgba(79,70,229,.1); }
.pf-tag-websites  { color: #2563EB; background: rgba(59,130,246,.1); }
.pf-tag-mobileapp { color: #D97706; background: rgba(245,158,11,.1); }

.pf-desc {
  font-size: .855rem;
  color: #6b7280;
  line-height: 1.65;
  margin-bottom: 14px;
}
.pf-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 16px;
}
.pf-pills span {
  font-size: .68rem;
  padding: 4px 10px;
  border-radius: 100px;
  background: rgba(99,102,241,.07);
  color: #6366F1;
  font-weight: 600;
  border: 1px solid rgba(99,102,241,.14);
}

/* Footer — pinned to bottom */
.pf-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 20px;
  border-top: 1px solid #f3f4f6;
  margin-top: auto;
  gap: 8px;
  flex-shrink: 0;
}
.pf-foot > span {
  font-size: .74rem;
  color: #9ca3af;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.pf-foot > a {
  font-size: .8rem;
  font-weight: 700;
  color: #6366F1;
  text-decoration: none;
  white-space: nowrap;
  flex-shrink: 0;
}
.pf-foot > a:hover { color: #4338CA; }

/* Responsive */
@media (max-width:767.98px) {
  .pf-grid { grid-template-columns: 1fr; gap: 16px; }
}

/* ── Category image backgrounds ── */
.project-image.fintech   { background:linear-gradient(135deg,rgba(99,102,241,.14) 0%,rgba(67,56,202,.10) 100%); }
.project-image.agritech  { background:linear-gradient(135deg,rgba(16,185,129,.14) 0%,rgba(5,150,105,.10) 100%); }
.project-image.legaltech { background:linear-gradient(135deg,rgba(139,92,246,.14) 0%,rgba(109,40,217,.10) 100%); }
.project-image.ecommerce { background:linear-gradient(135deg,rgba(6,182,212,.14) 0%,rgba(8,145,178,.10) 100%); }
.project-image.webapp    { background:linear-gradient(135deg,rgba(79,70,229,.14) 0%,rgba(99,102,241,.10) 100%); }
.project-image.websites  { background:linear-gradient(135deg,rgba(59,130,246,.14) 0%,rgba(37,99,235,.10) 100%); }
.project-image.mobileapp { background:linear-gradient(135deg,rgba(245,158,11,.14) 0%,rgba(217,119,6,.10) 100%); }

/* ── Category accent strip (bottom of image) ── */
.project-image::after {
  content:''; position:absolute; bottom:0; left:0; right:0; height:3px;
  background:rgba(99,102,241,.4);
}
.project-image.fintech::after   { background:#6366F1; }
.project-image.agritech::after  { background:#10B981; }
.project-image.legaltech::after { background:#8B5CF6; }
.project-image.ecommerce::after { background:#06B6D4; }
.project-image.webapp::after    { background:#4F46E5; }
.project-image.websites::after  { background:#3B82F6; }
.project-image.mobileapp::after { background:#F59E0B; }
.project-card:hover .project-image::after { opacity:0; }

/* ── Category icon colours (more visible) ── */
.project-image.fintech   .project-image-icon { color:rgba(99,102,241,.55); }
.project-image.agritech  .project-image-icon { color:rgba(16,185,129,.55); }
.project-image.legaltech .project-image-icon { color:rgba(139,92,246,.55); }
.project-image.ecommerce .project-image-icon { color:rgba(6,182,212,.55); }
.project-image.webapp    .project-image-icon { color:rgba(79,70,229,.55); }
.project-image.websites  .project-image-icon { color:rgba(59,130,246,.55); }
.project-image.mobileapp .project-image-icon { color:rgba(217,119,6,.55); }

/* ── Category overlay colours ── */
.project-overlay { border-radius:0; } /* override erroneous border-radius:14px */
.project-image.fintech   .project-overlay { background:rgba(67,56,202,.90); }
.project-image.agritech  .project-overlay { background:rgba(4,120,87,.90); }
.project-image.legaltech .project-overlay { background:rgba(109,40,217,.90); }
.project-image.ecommerce .project-overlay { background:rgba(8,145,178,.90); }
.project-image.webapp    .project-overlay { background:rgba(67,56,202,.90); }
.project-image.websites  .project-overlay { background:rgba(29,78,216,.90); }
.project-image.mobileapp .project-overlay { background:rgba(180,83,9,.90); }

/* ── Category project tag colours (via data-category) ── */
.project-card[data-category="fintech"]   .project-tag { color:#6366F1; background:rgba(99,102,241,.10); }
.project-card[data-category="agritech"]  .project-tag { color:#059669; background:rgba(16,185,129,.10); }
.project-card[data-category="legaltech"] .project-tag { color:#7C3AED; background:rgba(139,92,246,.10); }
.project-card[data-category="ecommerce"] .project-tag { color:#0891B2; background:rgba(6,182,212,.10); }
.project-card[data-category="webapp"]    .project-tag { color:#4F46E5; background:rgba(79,70,229,.10); }
.project-card[data-category="websites"]  .project-tag { color:#2563EB; background:rgba(59,130,246,.10); }
.project-card[data-category="mobileapp"] .project-tag { color:#D97706; background:rgba(245,158,11,.10); }

/* ── Tech pills — border for better definition ── */
.tech-stack .tech-pill { background:rgba(99,102,241,.07); border:1px solid rgba(99,102,241,.14); color:var(--primary); font-weight:600; }

/* ── Enhanced hover shadow ── */
.project-card:hover {
  transform:translateY(-6px);
  box-shadow:0 24px 56px rgba(99,102,241,.14);
  border-color:rgba(99,102,241,.25);
}