/* ServiceFind Anti-Gravity — Page-Level Styles */
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Inter',sans-serif;background:#0A0F1E;color:#fff;overflow-x:hidden}
.sf-page-wrap{display:grid;grid-template-columns:220px 1fr;min-height:100vh}
.sf-sidebar{position:sticky;top:68px;height:calc(100vh - 68px);overflow-y:auto;background:rgba(7,10,20,0.98);border-right:1px solid rgba(255,255,255,0.07);padding:1.5rem 0}
.sf-sidebar::-webkit-scrollbar{width:3px}
.sf-sidebar::-webkit-scrollbar-thumb{background:rgba(45,107,255,0.3)}
.sb-title{font-size:0.65rem;font-weight:700;text-transform:uppercase;letter-spacing:0.1em;color:rgba(255,255,255,0.3);padding:0.875rem 1.25rem 0.375rem;margin-top:0.5rem}
.sb-link{display:flex;align-items:center;gap:0.5rem;padding:0.5rem 0.875rem;border-radius:8px;color:rgba(255,255,255,0.6);font-size:0.8rem;text-decoration:none;transition:all 0.2s ease;cursor:pointer}
.sb-link:hover,.sb-link.active{color:#fff;background:rgba(45,107,255,0.12)}
.sb-link .sb-icon{font-size:0.875rem;flex-shrink:0}
.sf-phone-btns{display:flex;flex-wrap:wrap;gap:0.875rem;margin:1.25rem 0}
.sf-btn-phone{display:inline-flex;align-items:center;gap:0.5rem;padding:0.875rem 1.75rem;border-radius:9999px;font-size:0.9375rem;font-weight:700;text-decoration:none;transition:all 0.2s ease;border:none;cursor:pointer;white-space:nowrap}
.sf-btn-phone--blue{background:linear-gradient(135deg,#2D6BFF,#1A3FBF);color:#fff;box-shadow:0 8px 24px rgba(45,107,255,0.35)}
.sf-btn-phone--blue:hover{transform:translateY(-2px);box-shadow:0 12px 36px rgba(45,107,255,0.5);color:#fff;text-decoration:none}
.sf-btn-phone--green{background:linear-gradient(135deg,#00C853,#007B30);color:#fff;box-shadow:0 8px 24px rgba(0,200,83,0.3)}
.sf-btn-phone--green:hover{transform:translateY(-2px);box-shadow:0 12px 36px rgba(0,200,83,0.45);color:#fff;text-decoration:none}
.sf-phone-disclaimer{font-size:0.775rem;color:rgba(255,255,255,0.45);margin-top:0.25rem;line-height:1.5}
.sf-pricing-note{display:inline-flex;align-items:center;gap:0.5rem;background:rgba(245,158,11,0.12);border:1px solid rgba(245,158,11,0.3);color:#FBBF24;padding:0.5rem 1rem;border-radius:9999px;font-size:0.875rem;font-weight:600;margin-top:0.75rem}
.hero-section{background:linear-gradient(135deg,#0A0F1E 0%,#0D1A40 60%,#0A1628 100%);position:relative;overflow:hidden;padding:3.5rem 2.5rem 3rem}
.hero-section::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 70% 50%,rgba(45,107,255,0.12) 0%,transparent 60%);pointer-events:none}
.hero-grid{display:grid;grid-template-columns:1fr 420px;gap:2.5rem;align-items:center;position:relative;z-index:1}
.hero-eyebrow{display:inline-flex;align-items:center;gap:0.5rem;padding:0.375rem 1rem;background:rgba(0,200,83,0.1);border:1px solid rgba(0,200,83,0.25);border-radius:9999px;font-size:0.7rem;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:#4ADE80;margin-bottom:1.25rem}
.hero-pulse{width:6px;height:6px;background:#00C853;border-radius:50%;animation:sfPulse 2s ease-in-out infinite}
.hero-title{font-family:'Outfit',sans-serif;font-size:clamp(2rem,4vw,3rem);font-weight:900;line-height:1.1;letter-spacing:-0.02em;margin-bottom:1rem}
.hero-title span{background:linear-gradient(135deg,#2D6BFF,#00C853);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.hero-description{font-size:1.0625rem;color:rgba(255,255,255,0.7);line-height:1.7;margin-bottom:1.75rem;max-width:520px}
.terminal-card{background:linear-gradient(135deg,rgba(13,21,48,0.98),rgba(10,15,30,0.99));border:1px solid rgba(45,107,255,0.25);border-radius:20px;overflow:hidden;box-shadow:0 24px 80px rgba(0,0,0,0.4),0 0 60px rgba(45,107,255,0.1)}
.terminal-header{padding:0.875rem 1.25rem;background:rgba(45,107,255,0.08);border-bottom:1px solid rgba(45,107,255,0.15);display:flex;align-items:center;gap:0.625rem}
.terminal-dots{display:flex;gap:5px}
.terminal-dots span{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,0.15)}
.terminal-dots span:nth-child(1){background:#FF5F57}
.terminal-dots span:nth-child(2){background:#FFBD2E}
.terminal-dots span:nth-child(3){background:#28CA41}
.terminal-title{font-size:0.75rem;color:rgba(255,255,255,0.5);font-weight:600;letter-spacing:0.04em;margin-left:0.5rem}
.terminal-body{padding:1.25rem;font-family:'JetBrains Mono','Fira Code',monospace;font-size:0.785rem;line-height:1.75;min-height:220px}
.terminal-line{color:rgba(255,255,255,0.55);margin-bottom:0.125rem}
.terminal-line .cmd{color:#4ADE80}
.terminal-line .val{color:#60A5FA}
.terminal-line .warn{color:#FBBF24}
.terminal-line .ok{color:#4ADE80}
.terminal-line .err{color:#F87171}
.terminal-cursor{display:inline-block;width:8px;height:14px;background:#2D6BFF;animation:sfPulse 1s ease-in-out infinite;vertical-align:text-bottom;margin-left:2px}
.content-section{padding:3.5rem 2.5rem;border-bottom:1px solid rgba(255,255,255,0.05)}
.content-section:nth-child(even){background:rgba(255,255,255,0.015)}
.section-eyebrow{display:inline-flex;align-items:center;gap:0.5rem;padding:0.3rem 0.875rem;background:rgba(45,107,255,0.08);border:1px solid rgba(45,107,255,0.2);border-radius:9999px;font-size:0.7rem;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:#60A5FA;margin-bottom:0.875rem}
.section-title{font-family:'Outfit',sans-serif;font-size:clamp(1.5rem,2.5vw,2rem);font-weight:800;line-height:1.2;margin-bottom:0.75rem;letter-spacing:-0.02em}
.section-desc{color:rgba(255,255,255,0.6);line-height:1.7;font-size:0.9375rem;max-width:640px}
.cards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1rem;margin-top:1.75rem}
.info-card{background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.08);border-radius:14px;padding:1.25rem;transition:all 0.2s ease}
.info-card:hover{background:rgba(45,107,255,0.07);border-color:rgba(45,107,255,0.25);transform:translateY(-2px)}
.info-card__icon{font-size:1.75rem;margin-bottom:0.75rem}
.info-card__title{font-size:0.9375rem;font-weight:700;margin-bottom:0.5rem}
.info-card__text{font-size:0.8125rem;color:rgba(255,255,255,0.55);line-height:1.6}
.cost-table{width:100%;border-collapse:collapse;margin-top:1.5rem;font-size:0.875rem}
.cost-table th{background:rgba(45,107,255,0.1);padding:0.75rem 1rem;text-align:left;font-size:0.725rem;font-weight:700;text-transform:uppercase;letter-spacing:0.06em;color:rgba(255,255,255,0.5);border-bottom:1px solid rgba(255,255,255,0.08)}
.cost-table td{padding:0.875rem 1rem;border-bottom:1px solid rgba(255,255,255,0.05);color:rgba(255,255,255,0.8)}
.cost-table tr:hover td{background:rgba(255,255,255,0.02)}
.cost-badge{display:inline-block;padding:0.2rem 0.625rem;border-radius:9999px;font-size:0.725rem;font-weight:700}
.cost-badge--low{background:rgba(0,200,83,0.12);color:#4ADE80;border:1px solid rgba(0,200,83,0.2)}
.cost-badge--mid{background:rgba(245,158,11,0.12);color:#FBBF24;border:1px solid rgba(245,158,11,0.2)}
.cost-badge--high{background:rgba(255,68,68,0.12);color:#F87171;border:1px solid rgba(255,68,68,0.2)}
.faq-item{border:1px solid rgba(255,255,255,0.07);border-radius:12px;margin-bottom:0.625rem;overflow:hidden;transition:border-color 0.2s ease}
.faq-item.open{border-color:rgba(45,107,255,0.3)}
.faq-q{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.25rem;cursor:pointer;font-weight:600;font-size:0.9375rem;gap:1rem}
.faq-q:hover{background:rgba(255,255,255,0.02)}
.faq-icon{font-size:1.125rem;flex-shrink:0;transition:transform 0.3s ease;color:#60A5FA}
.faq-item.open .faq-icon{transform:rotate(45deg)}
.faq-a{display:none;padding:0 1.25rem 1rem;color:rgba(255,255,255,0.65);font-size:0.875rem;line-height:1.7}
.faq-item.open .faq-a{display:block}
.review-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1rem;margin-top:1.75rem}
.review-card{background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.08);border-radius:14px;padding:1.5rem}
.review-stars{color:#FBBF24;font-size:0.875rem;margin-bottom:0.625rem}
.review-text{font-size:0.875rem;color:rgba(255,255,255,0.7);line-height:1.65;margin-bottom:1rem}
.review-author{font-size:0.8125rem;font-weight:600;color:rgba(255,255,255,0.9)}
.review-location{font-size:0.75rem;color:rgba(255,255,255,0.4);margin-top:0.125rem}
.emergency-bar{background:linear-gradient(135deg,rgba(220,38,38,0.15),rgba(153,27,27,0.1));border:1px solid rgba(220,38,38,0.3);border-radius:16px;padding:1.5rem 2rem;display:flex;align-items:center;justify-content:space-between;gap:1.5rem;flex-wrap:wrap;margin:2rem 0}
.emergency-bar__text h3{font-family:'Outfit',sans-serif;font-size:1.25rem;font-weight:800;margin-bottom:0.25rem}
.emergency-bar__text p{font-size:0.875rem;color:rgba(255,255,255,0.6)}
.science-box{background:rgba(45,107,255,0.05);border:1px solid rgba(45,107,255,0.15);border-radius:14px;padding:1.5rem;margin-top:1.25rem}
.science-box h4{font-size:0.875rem;font-weight:700;color:#60A5FA;margin-bottom:0.75rem;text-transform:uppercase;letter-spacing:0.06em}
.science-box p{font-size:0.875rem;color:rgba(255,255,255,0.65);line-height:1.7}
.edu-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:0.75rem;margin-top:1.25rem}
.edu-link{display:flex;align-items:center;gap:0.75rem;padding:0.875rem 1rem;background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.07);border-radius:10px;text-decoration:none;color:rgba(255,255,255,0.75);font-size:0.8125rem;transition:all 0.2s ease}
.edu-link:hover{background:rgba(45,107,255,0.08);border-color:rgba(45,107,255,0.25);color:#fff;text-decoration:none}
.edu-link__icon{font-size:1.125rem;flex-shrink:0}
.sf-danger-box{background:rgba(220,38,38,0.05);border-color:rgba(220,38,38,0.2)}
.sf-danger-box h4{color:#F87171}
@media(max-width:1024px){.sf-page-wrap{grid-template-columns:1fr}.sf-sidebar{display:none}.hero-grid{grid-template-columns:1fr}.terminal-card{display:none}}
@media(max-width:640px){.hero-section,.content-section{padding:2rem 1.25rem}.cards-grid.sp-grid-2col{grid-template-columns:1fr !important}}

/* Utility classes for service pages — replaces inline styles */
.sp-hero-form{display:flex;gap:0.5rem;margin-bottom:1rem}
.sp-hero-form-icon{font-size:1.25rem}
.sp-hero-input{background:rgba(255,255,255,0.08);border:1px solid rgba(255,255,255,0.15);border-radius:8px;padding:0.5rem 0.875rem;color:#fff;font-size:0.875rem;width:200px;outline:none}
.sp-hero-btn{background:rgba(255,255,255,0.1);border:1px solid rgba(255,255,255,0.2);border-radius:8px;padding:0.5rem 1rem;color:#fff;font-size:0.875rem;cursor:pointer}
.sp-geo-result{font-size:0.8125rem;color:rgba(255,255,255,0.6);min-height:1.25rem;margin-bottom:1rem}
.sp-trust-badges{display:flex;flex-wrap:wrap;gap:1.5rem;margin-top:1.5rem;font-size:0.8125rem;color:rgba(255,255,255,0.5)}
.sp-ai-box{margin-top:1.5rem;padding:1.5rem;background:rgba(45,107,255,0.05);border:1px solid rgba(45,107,255,0.15);border-radius:14px}
.sp-ai-brain{min-height:120px;font-size:0.875rem;color:rgba(255,255,255,0.5)}
.sp-ai-pills{display:flex;flex-wrap:wrap;gap:0.5rem;margin-top:1rem}
.sp-code-hl{color:#60A5FA}
.sp-grid-2col{grid-template-columns:1fr 1fr}
.sp-contact-section{background:linear-gradient(135deg,rgba(13,21,48,0.98),rgba(10,15,30,0.99))}
.sp-contact-grid{grid-template-columns:1fr 1fr;margin-top:2rem}
.sp-contact-title{font-family:'Outfit',sans-serif;font-size:1.125rem;font-weight:800;margin-bottom:1rem}
.sp-garage-box{margin-top:1.5rem;padding:1.25rem;background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.08);border-radius:12px}
.sp-garage-title{font-size:0.875rem;font-weight:700;margin-bottom:0.75rem}
.sp-garage-form{display:flex;gap:0.5rem;flex-wrap:wrap}
.sp-garage-input{flex:1;min-width:120px;background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.12);border-radius:8px;padding:0.5rem 0.75rem;color:#fff;font-size:0.8125rem;outline:none}
.sp-garage-list{margin-top:0.75rem;font-size:0.8rem;color:rgba(255,255,255,0.5)}
.sp-nowrap{white-space:nowrap}
.sp-blog-card{text-decoration:none}
.sp-emergency-call{text-decoration:none}
.sp-mt-0{margin-top:0}
.sp-warning-box{background:rgba(245,158,11,0.08);border-color:rgba(245,158,11,0.2)}
.sp-warning-box h4{color:#FBBF24}
.sf-footer-accent{color:#00C853}
.sp-text-white{color:#fff}
.sp-flex-1{flex:1}
.sp-mt-6{margin-top:1.5rem}
.sp-mt-8{margin-top:2rem}
.sp-grid-1col{grid-template-columns:1fr !important}
.sp-faq-desc{margin-bottom:1.75rem}
.sm-no-underline{text-decoration:none !important}
.sp-faded-text{color:rgba(255,255,255,0.5)}
.sp-contact-bg{background:linear-gradient(135deg,rgba(13,21,48,0.98),rgba(10,15,30,0.99))}
.sp-garage-list-item{padding:0.25rem 0;border-bottom:1px solid rgba(255,255,255,0.05)}
.sp-garage-list-date{color:rgba(255,255,255,0.25);font-size:0.7rem}
.sp-protocol-danger{padding:1rem;background:rgba(220,38,38,0.08);border:1px solid rgba(220,38,38,0.2);border-radius:10px}
.sp-text-red{color:#F87171;font-weight:700}
.sp-protocol-desc{font-size:0.8125rem;color:rgba(255,255,255,0.6);margin-top:0.375rem}
.sp-protocol-warn{padding:1rem;background:rgba(245,158,11,0.08);border:1px solid rgba(245,158,11,0.2);border-radius:10px}
.sp-text-orange{color:#FBBF24;font-weight:700}
.sm-footer-brand{font-family:'Outfit',sans-serif;font-size:1.25rem;font-weight:800;margin-bottom:0.75rem}
.sm-footer-brand-highlight{color:#00C853}
.sm-footer-desc{font-size:0.8125rem;color:rgba(255,255,255,0.45);line-height:1.7;max-width:280px}
.sp-footer-link-hl{color:#60A5FA}
.sm-footer-legal-link{color:inherit}
.sp-text-green{color:#4ADE80}

/* ── ServiceFind Production — Responsive Additions ── */
/* Expanded mobile breakpoints */
@media(max-width:900px){
  .sf-nav-links{display:none}
}
@media(max-width:768px){
  .sf-page-wrap{grid-template-columns:1fr}
  .sf-sidebar{display:none}
  .hero-grid{grid-template-columns:1fr}
  .terminal-card{display:none}
  .hero-section{padding:2rem 1.25rem 1.75rem}
  .content-section{padding:2rem 1.25rem}
  .cards-grid{grid-template-columns:1fr}
  .cost-table{display:block;overflow-x:auto}
  .review-grid{grid-template-columns:1fr}
  .edu-grid{grid-template-columns:repeat(2,1fr)}
  .emergency-bar{flex-direction:column;gap:1rem;text-align:center}
  .sf-btn,.sf-btn-phone{min-height:44px;min-width:44px}
  .cards-grid[style]{grid-template-columns:1fr !important}
}
@media(max-width:480px){
  .hero-title{font-size:1.75rem}
  .section-title{font-size:1.375rem}
  .edu-grid{grid-template-columns:1fr}
}
/* Mobile nav toggle */
.sf-nav-mobile{display:none;flex-direction:column;gap:0;background:rgba(7,10,20,0.98);border-top:1px solid rgba(255,255,255,0.07);padding:1rem 1.5rem}
.sf-nav-mobile--open{display:flex}
.sf-nav-mobile a{color:rgba(255,255,255,0.75);text-decoration:none;font-size:0.9375rem;padding:0.625rem 0;border-bottom:1px solid rgba(255,255,255,0.06)}
.sf-nav-mobile a:last-child{border-bottom:none}
.sf-nav-mobile .sf-nav-cta-mobile{color:#fff;font-weight:700;padding-top:1rem}
.sf-nav-hamburger{background:none;border:none;color:#fff;font-size:1.25rem;cursor:pointer;padding:0.5rem;border-radius:8px;transition:background 0.2s ease;line-height:1}
.sf-nav-hamburger:hover{background:rgba(255,255,255,0.08)}
.sf-nav-cta-group{display:flex;align-items:center;gap:0.75rem}
/* Breadcrumb */
nav[aria-label="breadcrumb"]{background:rgba(255,255,255,0.02);border-bottom:1px solid rgba(255,255,255,0.06)}
/* Footer additions */
.sf-footer-brand{font-family:'Outfit',sans-serif;font-size:1.25rem;font-weight:800;margin-bottom:0.75rem}
.sf-footer-about{font-size:0.8125rem;color:rgba(255,255,255,0.45);line-height:1.7;max-width:280px}
/* Print */
@media print{.sf-sidebar,.sf-nav,.sf-nav-mobile,.sf-nav-hamburger,.sf-ai-send,.sf-btn-phone,.emergency-bar a{display:none}}

/* Inline replacements */
.sp-mt-6 { margin-top: 1.5rem; }
.sp-ul-details { margin-top: 1rem; padding-left: 1.5rem; }
.sp-img-responsive { width: 100%; border-radius: 12px; margin-top: 1.25rem; }
.sp-mb-3 { margin-bottom: 0.75rem; }
.sp-ai-brain-block { margin-top: 1rem; padding: 1rem; background: rgba(255,255,255,0.03); border-radius: 10px; font-size: 0.875rem; color: rgba(255,255,255,0.7); }
.sp-terminal-large { max-width: 800px; }
.sp-terminal-auto { min-height: auto; }
.sp-terminal-desc { margin-bottom: 1.5rem; color: rgba(255,255,255,0.6); }
.sp-btn-full { width: 100%; margin-top: 1rem; justify-content: center; }
.sp-calc-result { margin-top: 1.5rem; border-top: 1px solid rgba(255,255,255,0.1); padding-top: 1.5rem; }
.sp-calc-center { text-align: center; margin-bottom: 1rem; }
.sp-calc-label { font-size: 0.75rem; color: rgba(255,255,255,0.4); text-transform: uppercase; }
.sp-calc-total { font-size: 2rem; font-weight: 900; color: #4ADE80; }
.sp-calc-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 1rem; font-size: 0.875rem; }
.sp-footer-main { padding: 4rem 2.5rem; background: rgba(0,0,0,0.2); border-top: 1px solid rgba(255,255,255,0.05); }
.sp-footer-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 3rem; }
.sp-footer-heading { font-size: 0.875rem; margin-bottom: 1.25rem; }
.sp-footer-copyright { margin-top: 4rem; padding-top: 2rem; border-top: 1px solid rgba(255,255,255,0.05); text-align: center; font-size: 0.75rem; color: rgba(255,255,255,0.3); }

/* Map & Result Utilities */
.sp-map-placeholder { background:#1a1a1a; border-radius:12px; height:400px; display:flex; align-items:center; justify-content:center; color:#666; border:1px solid #333; }
.sp-map-icon { font-size:48px; margin-bottom:12px; }
.sp-no-results { text-align: center; padding: 60px 20px; display: none; }
.sp-no-results i { font-size: 3rem; color: #4b5563; margin-bottom: 20px; display: block; }
.sp-no-results h3 { color: #fff; margin-bottom: 10px; }
.sp-no-results p { color: #94a3b8; max-width: 400px; margin: 10px auto 20px; }

/* Cost Index Utilities */
.sp-cost-index-high { color: #ef4444 !important; }
.sp-cost-index-low { color: #10b981 !important; }
.sp-cost-index-avg { color: #f59e0b !important; }

/* ============================================================
   SERVICE HUB STYLES (Consolidated from service/index.html)
   ============================================================ */
.sf-hub-hero {
  min-height: 60vh;
  background: radial-gradient(circle at top right, #1e293b, #0f172a);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  position: relative;
  overflow: hidden;
  padding: 120px 24px 80px;
}

.sf-hub-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: url('/assets/img/service_hub_hero.png') no-repeat center center;
  background-size: cover;
  opacity: 0.25;
  z-index: 1;
}

.sf-hero-glass-card {
  position: relative;
  z-index: 2;
  background: rgba(15, 23, 42, 0.6);
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
  border: 1px solid var(--sf-glass-border);
  padding: 60px 40px;
  border-radius: 32px;
  max-width: 900px;
  width: 100%;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5);
}

.sf-hub-search-box {
  margin-top: 40px;
  position: relative;
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
}

.sf-hub-search-input {
  width: 100%;
  background: rgba(255, 255, 255, 0.05);
  border: 2px solid rgba(255, 255, 255, 0.1);
  padding: 20px 30px 20px 60px;
  border-radius: 50px;
  color: #fff;
  font-size: 1.1rem;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  outline: none;
}

.sf-hub-search-input:focus {
  background: rgba(255, 255, 255, 0.1);
  border-color: var(--sf-blue);
  box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.2);
}

.sf-hub-search-icon {
  position: absolute;
  left: 25px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--sf-blue);
  font-size: 1.2rem;
}

.sf-hub-content {
  padding: 80px 0;
  background: #0b1120;
}

.sf-category-section {
  margin-bottom: 60px;
}

.sf-category-header {
  display: flex;
  align-items: center;
  gap: 15px;
  margin-bottom: 30px;
  padding-bottom: 15px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.sf-category-header i {
  color: var(--sf-blue);
  font-size: 1.5rem;
}

.sf-category-title {
  font-size: 1.8rem;
  font-weight: 700;
  color: #fff;
  margin: 0;
}

.sf-hub-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 24px;
}

.sf-category-card {
  background: rgba(15, 23, 42, 0.4);
  border: 1px solid var(--sf-glass-border);
  border-radius: 20px;
  padding: 24px;
  transition: all 0.3s ease;
  text-decoration: none;
  display: flex;
  flex-direction: column;
  height: 100%;
}

.sf-category-card:hover {
  transform: translateY(-8px);
  border-color: var(--sf-blue);
  background: rgba(59, 130, 246, 0.05);
  box-shadow: 0 20px 40px -10px rgba(0, 0, 0, 0.5);
}

.sf-card-icon {
  width: 48px;
  height: 48px;
  background: rgba(59, 130, 246, 0.1);
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--sf-blue);
  margin-bottom: 20px;
  font-size: 1.2rem;
}

.sf-card-title {
  color: #fff;
  font-size: 1.25rem;
  font-weight: 600;
  margin: 0 0 10px 0;
}

.sf-card-desc {
  color: #94a3b8;
  font-size: 0.95rem;
  line-height: 1.6;
  margin: 0 0 20px 0;
}

.sf-card-footer {
  margin-top: auto;
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--sf-blue);
  font-weight: 600;
  font-size: 0.9rem;
}

@media (max-width: 768px) {
  .sf-hero-glass-card { padding: 40px 20px; }
  .sf-hub-hero { padding: 100px 16px 60px; }
  .sf-category-title { font-size: 1.5rem; }
}