.eyebrow{display:inline-flex; align-items:center; gap:8px; font-weight:700; color:#CFE0FF; padding:6px 10px; border-radius:999px; border:1px solid var(--line); background:rgba(255,255,255,0.04)}
.feature-row{display:grid; grid-template-columns: 1.05fr 1fr; gap:28px; align-items:center; padding:22px 0}
.feature-row + .feature-row{border-top:1px solid var(--line); margin-top:18px; padding-top:28px}
.feature-row.reverse{grid-template-columns: 1fr 1.05fr}
.feature-row.reverse .feature-copy{order:2}
.feature-row.reverse .feature-media{order:1}
.feature-copy h3{margin:0 0 8px; font-size:clamp(22px,3.4vw,30px)}
.feature-copy p{margin:0 0 12px; color:#C7D2EA}
.bullets{list-style:none; padding:0; margin:0 0 12px; display:grid; gap:8px}
.bullets li{display:flex; gap:10px; color:#D9E6FF}
.bullets i{color:#7BE6A2; margin-top:2px}
.grid-bullets{list-style:none; padding:0; margin:0 14px 14px 0; display:grid; gap:10px; grid-template-columns: repeat(2, minmax(0,1fr))}
.grid-bullets li{display:flex; gap:10px; align-items:flex-start; color:#D9E6FF}
.grid-bullets i{color:#BFD4FF; margin-top:2px}
.feature-row .actions{display:flex; gap:10px; flex-wrap:wrap}
.feature-media{display:flex; justify-content:center}
.card-scene{position:relative; width:min(560px, 100%); padding:14px; border-radius:16px; background:rgba(255,255,255,0.02); border:1px solid var(--line-soft); box-shadow: 0 12px 26px rgba(0,0,0,0.28); overflow:hidden; isolation:isolate}
.card-scene::before{content:""; position:absolute; inset:-35%; background: radial-gradient(520px 220px at 20% 10%, rgba(36,97,230,0.14), transparent 60%), radial-gradient(420px 200px at 85% 80%, rgba(167,139,250,0.12), transparent 60%), radial-gradient(320px 180px at 40% 90%, rgba(110,231,243,0.10), transparent 60%); filter: blur(30px); z-index:-2; opacity:0.8}
.card-scene::after{content:""; position:absolute; inset:0; background: repeating-linear-gradient(135deg, rgba(255,255,255,0.04) 0 1px, transparent 1px 9px); opacity:0.04; z-index:-1; pointer-events:none}
.card-glow{position:absolute; width:120px; height:120px; border-radius:50%; background:radial-gradient(closest-side, rgba(36,97,230,0.28), rgba(36,97,230,0)); filter: blur(22px); top:-24px; right:-24px; opacity:0.45}
.card-glow.alt{left:-26px; bottom:-26px; top:auto; right:auto; background:radial-gradient(closest-side, rgba(167,139,250,0.28), rgba(167,139,250,0)); opacity:0.42}
.card-edge-sheen{pointer-events:none; position:absolute; inset:0; border-radius:16px; background: linear-gradient(180deg, rgba(255,255,255,0.06), rgba(255,255,255,0.0)); mask: linear-gradient(#000,#000) padding-box, linear-gradient(#000,#000); -webkit-mask: linear-gradient(#000,#000) padding-box, linear-gradient(#000,#000); opacity:0.06}
.section .lead{color:#C7D2EA; max-width:70ch}
#testimonials{background:linear-gradient(180deg, #0f1219, #131824); border-top:1px solid var(--line); border-bottom:1px solid var(--line); position:relative; overflow:hidden}
#testimonials::before,#testimonials::after{content:""; position:absolute; inset:auto; width:520px; height:520px; border-radius:50%; filter:blur(40px); opacity:0.18; pointer-events:none; transform:translate3d(0,0,0)}
#testimonials::before{right:-220px; top:-200px; background:radial-gradient(closest-side, rgba(36,97,230,0.55), rgba(36,97,230,0))}
#testimonials::after{left:-220px; bottom:-240px; background:radial-gradient(closest-side, rgba(167,139,250,0.5), rgba(167,139,250,0))}
.testi-head{display:flex; align-items:flex-start; justify-content:space-between; gap:18px; flex-wrap:wrap; margin-bottom:18px}
.testi-eyebrow{display:inline-flex; align-items:center; gap:8px; font-weight:800; letter-spacing:0.3px; color:#D8E5FF; background:linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.03)); border:1px solid var(--line); padding:6px 12px; border-radius:999px}
.testi-title{margin:8px 0 0; font-size:clamp(22px, 3.8vw, 34px); letter-spacing:0.2px}
.testi-lead{color:#C7D2EA; max-width:68ch; margin-top:8px}
.testi-grid{display:grid; gap:16px; margin-top:16px; grid-template-columns: repeat(12, 1fr)}
.testi-card{grid-column: span 6; position:relative; border:1px solid var(--line); border-radius:16px; padding:18px 18px 16px 18px; background: linear-gradient(180deg, rgba(255,255,255,0.06), rgba(255,255,255,0.03)); box-shadow: 0 12px 28px rgba(0,0,0,0.28), inset 0 1px 0 rgba(255,255,255,0.03); overflow:hidden; isolation:isolate; transition: transform .18s ease, border-color .2s ease, box-shadow .2s ease, background .25s ease}
.testi-card:nth-child(3n){grid-column: span 7}
.testi-card:nth-child(4n){grid-column: span 5}
.testi-card::before{content:""; position:absolute; inset:-40% -40% auto -40%; height:120px; background: radial-gradient(700px 90px at 50% 0%, rgba(110,231,243,0.14), transparent 60%), radial-gradient(500px 70px at 20% 0%, rgba(36,97,230,0.10), transparent 60%); pointer-events:none; opacity:0.9}
.testi-card::after{content:""; position:absolute; right:-26px; bottom:-26px; width:160px; height:160px; border-radius:50%; background:radial-gradient(closest-side, rgba(36,97,230,0.24), rgba(36,97,230,0)); filter: blur(20px); opacity:0.55; pointer-events:none}
.testi-card .accent-alt{position:absolute; left:-26px; top:-26px; width:150px; height:150px; border-radius:50%; background:radial-gradient(closest-side, rgba(167,139,250,0.26), rgba(167,139,250,0)); filter:blur(18px); opacity:0.55; pointer-events:none}
.testi-card:hover{transform:translateY(0); border-color:rgba(36,97,230,0.35); background: linear-gradient(180deg, rgba(255,255,255,0.08), rgba(255,255,255,0.035)); box-shadow: 0 18px 36px rgba(0,0,0,0.34), inset 0 1px 0 rgba(255,255,255,0.05)}
.testi-card .stripe{position:absolute; left:0; right:0; top:0; height:3px; background:linear-gradient(90deg, var(--blue), var(--accent-3), var(--accent-2)); opacity:0.6}
.testi-quote{position:relative; color:#E7ECFF; font-size:17px; line-height:1.7}
.testi-quote .mark{position:absolute; top:-8px; left:-2px; font-size:44px; line-height:1; color:#2049A4; filter:drop-shadow(0 6px 12px rgba(0,0,0,0.45)); user-select:none; pointer-events:none}
.testi-quote p{margin:0; padding-left:28px; text-wrap:pretty}
.testi-author{display:flex; align-items:center; gap:10px; margin-top:14px; color:#B6C8EC; font-weight:800; letter-spacing:0.2px}
.testi-role{margin-left:auto; font-size:12px; font-weight:700; letter-spacing:0.3px; color:#CFE0FF; padding:4px 8px; border-radius:999px; background:rgba(255,255,255,0.04); border:1px solid var(--line)}
.testi-meta{margin-top:6px; color:#9FB2D6; font-size:12px; opacity:0.9}
.testi-tags{margin-top:10px; display:flex; flex-wrap:wrap; gap:8px}
.testi-tag{font-size:12px; color:#cfe1ff; padding:4px 8px; border-radius:999px; background:rgba(36,97,230,0.12); border:1px solid rgba(36,97,230,0.28)}
.metrics{margin-top:10px; display:grid; grid-template-columns: repeat(4, 1fr); gap:14px}
.metric{background:rgba(16,20,30,0.6); border:1px solid var(--line); border-radius:14px; padding:16px; text-align:center}
.metric strong{ display:block; font-size:22px }
.metric span{ color:#AFC2E8; font-size:13px }
.cta-section{padding:42px 0; border-top:1px solid var(--line); background:linear-gradient(180deg, #101218, #191C24)}
.cta-panel{background:linear-gradient(180deg, rgba(255,255,255,0.04), rgba(255,255,255,0.02)); border:1px solid var(--line); border-radius:18px; padding:20px; display:flex; align-items:center; gap:18px; flex-wrap:wrap}
.cta-panel .grow{flex:1 1 360px}
.cta-panel p{margin:6px 0 0; color:#C7D2EA}
.band{margin-top:16px; display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; background:rgba(255,255,255,0.03); border:1px dashed rgba(255,255,255,0.12); padding:14px; border-radius:14px}
.band small{ color:#AFC2E8 }
@media (max-width: 1024px){
  .testi-grid{grid-template-columns: repeat(8, 1fr)}
  .testi-card{ grid-column: span 8 }
  .testi-card:nth-child(3n), .testi-card:nth-child(4n){ grid-column: span 8 }
}
@media (max-width: 700px){
  .testi-grid{grid-template-columns: repeat(4, 1fr)}
  .testi-card{ grid-column: span 4 }
  .testi-quote{ font-size:16px }
}
@media (prefers-reduced-motion: reduce){
  .testi-card, .testi-card:hover{transition:none; transform:none}
}