/* Scoped to #gsr-comparison-hub only - Won't affect your site header/footer */
#gsr-comparison-hub *{margin:0;padding:0;box-sizing:border-box}
#gsr-comparison-hub{font-family:'Inter','Noto Sans Devanagari',sans-serif;background:#fbf8ff;color:#1a1a2e;position:relative;isolation:isolate;padding:0 0 40px 0;overflow:hidden;min-height:100vh}
#gsr-comparison-hub .gsr-container{max-width:1150px;margin:0 auto;padding:0 16px;position:relative;z-index:2}

/* Blobs - scoped */
#gsr-comparison-hub .bg-blobs{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}
#gsr-comparison-hub .blob{position:absolute;border-radius:50%;filter:blur(70px);opacity:0.32}
#gsr-comparison-hub .b1{width:520px;height:520px;background:#a78bfa;top:-120px;left:-120px}
#gsr-comparison-hub .b2{width:620px;height:620px;background:#fbbf24;bottom:-160px;right:-120px}
#gsr-comparison-hub .b3{width:420px;height:420px;background:#34d399;top:40%;left:45%}

#gsr-comparison-hub .page-heading{text-align:center;padding:42px 10px 26px}
#gsr-comparison-hub .heading-badge{display:inline-block;background:linear-gradient(90deg,#7c3aed,#ec4899);color:#fff;padding:7px 16px;border-radius:30px;font-size:12px;font-weight:800;letter-spacing:0.6px;margin-bottom:14px;box-shadow:0 6px 18px rgba(124,58,237,0.3)}
#gsr-comparison-hub .page-heading h1{font-size:clamp(24px,5vw,38px);font-weight:800;line-height:1.15;margin-bottom:10px}
#gsr-comparison-hub .gradient-text{background:linear-gradient(90deg,#7c3aed,#ec4899,#f59e0b);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
#gsr-comparison-hub .page-heading p{color:#6b7280;font-size:clamp(13px,2.5vw,17px);max-width:650px;margin:0 auto}

#gsr-comparison-hub .law-group{margin:28px 0}
#gsr-comparison-hub .group-header{padding:12px 18px;border-radius:12px;font-weight:700;color:#fff;margin-bottom:14px;display:flex;gap:8px;align-items:center;font-size:clamp(14px,2.8vw,16px);box-shadow:0 8px 20px rgba(0,0,0,0.12)}
#gsr-comparison-hub .g1{background:linear-gradient(90deg,#6366f1,#8b5cf6)}
#gsr-comparison-hub .g2{background:linear-gradient(90deg,#10b981,#06b6d4)}
#gsr-comparison-hub .g3{background:linear-gradient(90deg,#f59e0b,#ef4444)}

#gsr-comparison-hub .cards-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}

#gsr-comparison-hub .compare-card{position:relative;background:#fff;border-radius:20px;padding:22px 20px;text-decoration:none;color:inherit;border:1.5px solid transparent;overflow:hidden;transition:all 0.32s cubic-bezier(0.175,0.885,0.32,1.275);box-shadow:0 4px 20px rgba(0,0,0,0.05);display:flex;flex-direction:column;min-height:165px}
#gsr-comparison-hub .compare-card:hover{transform:translateY(-6px);box-shadow:0 18px 36px rgba(0,0,0,0.14)}
#gsr-comparison-hub .card-glow{position:absolute;width:180px;height:180px;border-radius:50%;top:-60px;right:-60px;opacity:0.18;filter:blur(20px);pointer-events:none}
#gsr-comparison-hub .color-1 .card-glow{background:#6366f1}
#gsr-comparison-hub .color-2 .card-glow{background:#ec4899}
#gsr-comparison-hub .color-3 .card-glow{background:#10b981}
#gsr-comparison-hub .color-4 .card-glow{background:#06b6d4}
#gsr-comparison-hub .color-5 .card-glow{background:#f59e0b}
#gsr-comparison-hub .color-6 .card-glow{background:#ef4444}

#gsr-comparison-hub .card-icon{font-size:28px;position:absolute;top:16px;right:16px}
#gsr-comparison-hub .card-top{display:flex;align-items:center;gap:6px;margin-bottom:14px;flex-wrap:wrap}
#gsr-comparison-hub .badge{font-size:10.5px;font-weight:800;padding:5px 10px;border-radius:20px;letter-spacing:0.3px;white-space:nowrap}
#gsr-comparison-hub .badge.bns{background:#ede9fe;color:#5b21b6}
#gsr-comparison-hub .badge.ipc{background:#f3f4f6;color:#374151}
#gsr-comparison-hub .arrow{font-weight:800;color:#9ca3af;font-size:13px}

#gsr-comparison-hub .color-1{border-color:#c7d2fe;background:linear-gradient(135deg,#ffffff 0%,#eef2ff 100%)}
#gsr-comparison-hub .color-1 .card-btn{background:#6366f1}
#gsr-comparison-hub .color-2{border-color:#fbcfe8;background:linear-gradient(135deg,#ffffff 0%,#fdf2f8 100%)}
#gsr-comparison-hub .color-2 .card-btn{background:#ec4899}
#gsr-comparison-hub .color-3{border-color:#a7f3d0;background:linear-gradient(135deg,#ffffff 0%,#ecfdf5 100%)}
#gsr-comparison-hub .color-3 .card-btn{background:#10b981}
#gsr-comparison-hub .color-4{border-color:#99f6e0;background:linear-gradient(135deg,#ffffff 0%,#f0fdfa 100%)}
#gsr-comparison-hub .color-4 .card-btn{background:#06b6d4}
#gsr-comparison-hub .color-5{border-color:#fde68a;background:linear-gradient(135deg,#ffffff 0%,#fffbeb 100%)}
#gsr-comparison-hub .color-5 .card-btn{background:#f59e0b}
#gsr-comparison-hub .color-6{border-color:#fecaca;background:linear-gradient(135deg,#ffffff 0%,#fef2f2 100%)}
#gsr-comparison-hub .color-6 .card-btn{background:#ef4444}

#gsr-comparison-hub .compare-card h3{font-size:clamp(16px,3.5vw,20px);font-weight:800;margin-bottom:6px}
#gsr-comparison-hub .compare-card p{font-size:clamp(12px,2.8vw,14px);color:#6b7280;line-height:1.4;margin-bottom:16px;flex:1}
#gsr-comparison-hub .card-btn{display:inline-flex;align-self:flex-start;color:#fff;padding:8px 16px;border-radius:30px;font-size:12.5px;font-weight:700;transition:0.2s;box-shadow:0 4px 12px rgba(0,0,0,0.15)}

/* Tablet */
@media(max-width:900px){
  #gsr-comparison-hub .gsr-container{padding:0 14px}
  #gsr-comparison-hub .cards-grid{gap:14px}
}

/* Mobile Landscape & Portrait */
@media(max-width:640px){
  #gsr-comparison-hub .cards-grid{grid-template-columns:1fr;gap:14px}
  #gsr-comparison-hub .page-heading{padding:28px 8px 18px}
  #gsr-comparison-hub .law-group{margin:20px 0}
  #gsr-comparison-hub .compare-card{padding:18px 16px;min-height:145px;border-radius:16px}
  #gsr-comparison-hub .blob{opacity:0.22;filter:blur(50px)}
  #gsr-comparison-hub .b1{width:320px;height:320px}
  #gsr-comparison-hub .b2{width:380px;height:380px}
}

/* Small Mobile */
@media(max-width:380px){
  #gsr-comparison-hub .card-top{gap:4px}
  #gsr-comparison-hub .badge{font-size:10px;padding:4px 8px}
  #gsr-comparison-hub .compare-card h3{font-size:17px}
}

/* Large Desktop */
@media(min-width:1300px){
  #gsr-comparison-hub .gsr-container{max-width:1250px}
  #gsr-comparison-hub .page-heading h1{font-size:42px}
}
