/* JAZ SYSTEMS — hero aprobado 2026-08-29 */
:root{
  --hero-deep:#072c49;
  --hero-navy:#0b3554;
  --hero-teal:#16536a;
  --hero-blue:#66d0ff;
  --hero-gold:#e5b85d;
  --hero-gold-2:#c9933e;
  --hero-cream:#f4f0e8;
  --hero-white:#f8fafb;
}
.reference-hero{position:relative;overflow:hidden;background:radial-gradient(circle at 66% 43%,rgba(78,164,198,.22),transparent 24%),radial-gradient(circle at 92% 18%,rgba(39,113,143,.20),transparent 22%),linear-gradient(135deg,#062a47 0%,#0a3655 48%,#15556d 100%);color:#fff;padding:68px 0 26px;isolation:isolate}
.reference-hero:before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);background-size:80px 80px;opacity:.24;pointer-events:none}
.reference-hero:after{content:"";position:absolute;width:620px;height:620px;border-radius:50%;right:12%;top:80px;background:radial-gradient(circle,rgba(103,199,236,.09),transparent 65%);filter:blur(8px);pointer-events:none}
.reference-hero .container{position:relative;z-index:2}
.reference-hero-grid{display:grid;grid-template-columns:.72fr 1.28fr;gap:32px;align-items:center;min-height:700px}
.reference-copy{align-self:center;max-width:470px;padding:16px 0 36px}
.reference-eyebrow{display:inline-flex;align-items:center;gap:14px;color:#e6bb67;font-size:11px;font-weight:800;letter-spacing:.2em;text-transform:uppercase;margin-bottom:28px}
.reference-eyebrow:before{content:"";width:26px;height:2px;background:linear-gradient(90deg,#dfaa4f,#f1cf86)}
.reference-copy h1{font-size:clamp(54px,5.9vw,84px);line-height:1.01;letter-spacing:-.05em;margin:0 0 24px;color:#fff;font-weight:790}
.reference-copy h1 span{display:block;color:#e4b862}
.reference-copy>p{font-size:19px;line-height:1.62;color:#d3e0e5;max-width:400px;margin:0 0 28px}
.reference-cta{display:inline-flex;align-items:center;gap:16px;min-height:54px;padding:0 22px;border:1px solid rgba(230,184,93,.74);border-radius:13px;color:#f0c56f;font-weight:700;background:rgba(3,29,48,.18);box-shadow:inset 0 0 0 1px rgba(255,255,255,.02);transition:.2s ease}
.reference-cta:hover{transform:translateY(-2px);background:rgba(230,184,93,.08);border-color:#f1c86f}
.reference-cta svg{width:18px;height:18px}
.reference-orbit{position:relative;height:700px;min-width:0;display:grid;place-items:center;isolation:isolate}
.reference-orbit:before{content:"";position:absolute;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(111,203,235,.09),transparent 66%);filter:blur(4px)}
.reference-ring{position:absolute;border-radius:50%;pointer-events:none;will-change:transform}
.reference-ring.ring-a{width:590px;height:590px}
.reference-ring.ring-b{width:465px;height:465px}
.reference-ring.ring-c{width:345px;height:345px}
.ring-motion{position:absolute;inset:0;border-radius:50%}
.ring-a .ring-motion{border:1px solid rgba(224,177,86,.35);animation:referenceSpin 30s linear infinite}
.ring-b .ring-motion{border:1.5px solid rgba(102,208,255,.43);box-shadow:0 0 24px rgba(77,190,236,.12);animation:referenceSpinReverse 24s linear infinite}
.ring-c .ring-motion{border:1px dashed rgba(211,224,230,.27);animation:referenceSpin 40s linear infinite}
.ring-node{position:absolute;width:11px;height:11px;border-radius:50%;background:#f8fcff;box-shadow:0 0 0 6px rgba(93,196,236,.08),0 0 18px 4px rgba(100,213,255,.7)}
.ring-a .node-a{top:-5px;left:48%}.ring-a .node-b{right:-5px;top:54%;background:#f0c86f;box-shadow:0 0 0 6px rgba(228,184,93,.08),0 0 18px 4px rgba(228,184,93,.72)}
.ring-b .node-a{left:-5px;top:54%;background:#f0c86f;box-shadow:0 0 0 6px rgba(228,184,93,.08),0 0 18px 4px rgba(228,184,93,.72)}
.ring-b .node-b{right:22%;bottom:4%;background:#fff}
.ring-c .node-a{top:10%;right:8%;width:7px;height:7px;box-shadow:0 0 12px rgba(255,255,255,.7)}
@keyframes referenceSpin{to{transform:rotate(360deg)}}
@keyframes referenceSpinReverse{to{transform:rotate(-360deg)}}
.ref-core{position:relative;z-index:8;width:245px!important;height:245px!important;border-radius:50%;background:linear-gradient(155deg,#fffefa,#e6edf1)!important;border:1px solid rgba(255,255,255,.88)!important;box-shadow:0 22px 70px rgba(3,20,32,.26),0 0 34px rgba(255,255,255,.08)!important;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;transition:transform .22s ease!important}
.ref-core img{width:112px!important;height:112px!important;object-fit:cover;border-radius:50%;box-shadow:0 8px 24px rgba(12,50,69,.12)}
.ref-core strong{font-size:18px!important;letter-spacing:.09em!important;color:#0b3853!important;margin-top:14px!important}
.ref-core small{font-size:12px!important;color:#627d8d!important;line-height:1.45!important;max-width:170px!important;margin-top:8px!important}
.ref-card{position:absolute;z-index:9;width:222px;min-height:185px;padding:22px 22px 19px;border-radius:20px;border:1px solid rgba(194,220,231,.43);background:linear-gradient(145deg,rgba(13,59,82,.78),rgba(6,42,63,.68));backdrop-filter:blur(12px);box-shadow:0 18px 44px rgba(1,20,32,.24);color:#fff;transition:box-shadow .22s ease,border-color .22s ease,background .22s ease}
.ref-card:hover{box-shadow:0 24px 52px rgba(1,20,32,.33),0 0 30px rgba(98,207,248,.08);border-color:rgba(216,235,242,.62);background:linear-gradient(145deg,rgba(17,69,92,.88),rgba(7,47,69,.78))}
.ref-card .ref-icon{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(230,184,93,.82);color:#efbd5e;margin-bottom:16px;box-shadow:0 0 0 5px rgba(230,184,93,.035)}
.ref-card .ref-icon svg{width:29px;height:29px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ref-card h3{font-size:22px;line-height:1.1;margin:0 0 11px;color:#fff;letter-spacing:-.025em}
.ref-card h3:after{content:"";display:block;width:25px;height:2px;margin-top:12px;background:linear-gradient(90deg,#e7b453,#f2cd7d)}
.ref-card p{font-size:14px;line-height:1.5;margin:0;color:#cfdee4}
.reference-orbit .card-dev{left:20px;top:92px}
.reference-orbit .card-data{right:0;top:170px}
.reference-orbit .card-auto{left:-10px;bottom:74px}
.reference-orbit .card-support{right:8px;bottom:64px}
.reference-benefits{margin-top:-6px;margin-bottom:0;display:grid;grid-template-columns:repeat(4,1fr);background:linear-gradient(180deg,#f8f5ef,#eeeae1);border:1px solid rgba(255,255,255,.68);border-radius:22px;box-shadow:0 16px 42px rgba(1,20,32,.17);overflow:hidden}
.reference-benefit{min-height:116px;display:flex;align-items:center;gap:16px;padding:22px 26px;position:relative}
.reference-benefit:not(:last-child):after{content:"";position:absolute;right:0;top:24px;bottom:24px;width:1px;background:rgba(11,56,83,.14)}
.reference-benefit-icon{width:48px;height:48px;flex:0 0 48px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(194,145,64,.52);color:#b98535}
.reference-benefit-icon svg{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.reference-benefit span{font-size:13px;line-height:1.48;color:#304b5a;font-weight:650}
.approved-services-section{padding:78px 0 86px;background:linear-gradient(180deg,#f1eee7,#e9e6de)}
.approved-services-section .services-intro{display:grid;grid-template-columns:.85fr 1fr;gap:54px;align-items:end;margin-bottom:34px}
.approved-services-section .services-intro h2{font-size:clamp(38px,4.3vw,62px);line-height:1.02;letter-spacing:-.05em;color:#153447;margin:12px 0 0}
.approved-services-section .services-intro p{margin:0;color:#607786;font-size:16px;line-height:1.7;max-width:510px}
.approved-services-section .approved-services{margin-top:0}
.approved-services-section .approved-value-strip{display:none}
@media(max-width:1180px){.reference-hero-grid{grid-template-columns:.82fr 1.18fr;gap:20px}.reference-orbit{transform:scale(.91);transform-origin:center}.reference-copy h1{font-size:clamp(48px,5.2vw,70px)}}
@media(max-width:980px){.reference-hero-grid{grid-template-columns:1fr;min-height:auto}.reference-copy{max-width:720px;padding-bottom:0}.reference-orbit{height:640px;transform:scale(.88);margin:-20px auto 0;width:min(760px,100%)}.reference-benefits{grid-template-columns:1fr 1fr}.reference-benefit:nth-child(2):after{display:none}.reference-benefit:nth-child(-n+2){border-bottom:1px solid rgba(11,56,83,.12)}.approved-services-section .services-intro{grid-template-columns:1fr;gap:16px}}
@media(max-width:720px){.reference-hero{padding-top:44px}.reference-copy h1{font-size:47px}.reference-copy>p{font-size:17px}.reference-orbit{height:560px;transform:scale(.72);margin:-55px -110px -45px;width:calc(100% + 220px)}.reference-benefits{grid-template-columns:1fr;margin-top:0}.reference-benefit{min-height:86px}.reference-benefit:after{display:none!important}.reference-benefit:not(:last-child){border-bottom:1px solid rgba(11,56,83,.12)}}
@media(prefers-reduced-motion:reduce){.ring-motion{animation:none!important}}