/* =========================================================
   SITHO XYZ — VORTEX / 3D EDITION
   Referencia de estilo: negro profundo + rojo escarlata + azul eléctrico
   Ilustraciones SVG propias, responsive, sin librerías adicionales.
========================================================= */
:root {color-scheme:dark;--bg:#050710;--bg-2:#09101c;--bg-3:#0f1a2c;--panel:#0e1525;--panel-2:#111b2d;--line:rgba(136,171,244,.17);--line-2:rgba(153,181,254,.28);--white:#fcfdff;--text:#d1dbed;--muted:#91a3c0;--red:#ff1839;--red-light:#ff536b;--blue:#0b60ff;--blue-light:#75caff;--purple:#265eff;--gradient:linear-gradient(106deg,#ff2444 0%,#f20f34 23%,#174de9 67%,#1a96ff 100%);--glass:linear-gradient(153deg,rgba(35,58,97,.45),rgba(11,18,31,.75));--radius:20px}
body.sitho-vortex{background:#050710;color:var(--text);overflow-x:clip}
body.sitho-vortex::before{opacity:.04}
.container{width:min(calc(100% - 48px),1200px)}
.topline{background:#03050b;border-color:rgba(46,84,158,.22)}.topline-inner{color:#98accd}.topline-domain{color:#cbd8ef}.status-dot,.live-dot{background:#39df9c;box-shadow:0 0 15px rgba(57,223,156,.55)}
.site-header{background:rgba(5,9,20,.88);border-bottom:1px solid rgba(75,113,205,.2);backdrop-filter:blur(20px) saturate(145%);-webkit-backdrop-filter:blur(20px) saturate(145%)}
.brand-mark{border:1px solid #415785;border-radius:14px;background:linear-gradient(145deg,#143f9b 2%,#050914 42%,#430818 100%);box-shadow:inset 0 2px 0 rgba(255,255,255,.2),0 12px 26px rgba(0,0,0,.44),0 0 25px rgba(0,89,255,.14)}
.brand-mark:before{background:linear-gradient(110deg,#ff0c32 0%,#175dfd 90%);opacity:.85}.brand-mark-pixel,.brand-dot{background:#ff2446;color:#ff2446}.brand-word small{color:#b5c6e7}.nav-link{color:#b2c0d8}.nav-link.active,.nav-link:hover{color:white}.desktop-nav .nav-link:after{background:var(--gradient);height:3px}
.nav-cta{background:linear-gradient(114deg,#e6002d,#ff3042);border:1px solid rgba(255,106,128,.67);box-shadow:0 8px 23px rgba(255,0,49,.18);border-radius:12px}.nav-cta:hover{background:linear-gradient(110deg,#fd214a,#da0029);border-color:#ff8394;box-shadow:0 11px 34px rgba(240,20,49,.34)}.nav-cta svg{color:#fff}
.menu-toggle{border:1px solid rgba(64,119,235,.45);background:#0e182a}.mobile-nav{background:#070c16;border-bottom:1px solid #143d8c}.mobile-nav .nav-link.active{color:#ff3655}.mobile-nav .mobile-wa{background:linear-gradient(110deg,#ea123d,#095ff2)!important}
.btn{border-radius:12px;min-height:54px;font-size:13px;font-weight:800}
.btn-primary{background:linear-gradient(111deg,#fd163b,#e60935 44%,#d50031);border:1px solid rgba(255,112,129,.54);box-shadow:0 10px 32px rgba(238,9,55,.25),inset 0 1px 0 rgba(255,255,255,.26)}.btn-primary:hover{background:linear-gradient(100deg,#ff2d4d,#ef0a36);box-shadow:0 12px 37px rgba(240,2,50,.45)}
.btn-ghost,.btn-outline,.btn-outline-light{background:rgba(10,25,57,.58);border:1px solid rgba(49,117,255,.54);color:#f4f8ff}.btn-ghost:hover,.btn-outline:hover,.btn-outline-light:hover{background:rgba(15,52,120,.68);border-color:#318bff}
.btn-white{background:white;color:#121c31}.gradient-text{background:linear-gradient(110deg,#ff2449 2%,#ff1945 30%,#1778ff 79%,#4dbdff);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.eyebrow,.section-heading span{color:#8cb8ff}.eyebrow-line{background:linear-gradient(90deg,#fc103e,#1777ff)}
.section{padding-block:clamp(70px,8vw,116px)}.section-alt{background:radial-gradient(ellipse 670px 410px at 92% 6%,rgba(0,78,225,.14),transparent),linear-gradient(115deg,#09101d,#0a1428 60%,#090e19);border-block:1px solid rgba(55,102,199,.18)}
.section-heading{font-size:clamp(34px,4.4vw,56px)}.section-aside p,.section-heading-centered p,.body-copy{color:#a7bad5}
/* HOME HERO */
.hero{padding:80px 0 41px;border-bottom:1px solid rgba(25,87,216,.26);background:
 radial-gradient(ellipse 580px 600px at 78% 30%,rgba(0,79,234,.25),transparent 66%),
 radial-gradient(ellipse 600px 440px at 42% 92%,rgba(227,6,44,.13),transparent 71%),
 linear-gradient(123deg,#04060c 0%,#070c18 49%,#060a16 100%)}
.hero:before{content:"";position:absolute;z-index:-1;inset:0;pointer-events:none;background:repeating-linear-gradient(90deg,transparent 0,transparent 79px,rgba(40,99,223,.025) 80px),repeating-linear-gradient(0deg,transparent 0,transparent 79px,rgba(40,99,223,.025) 80px);transform:none;border:0;box-shadow:none;width:auto;height:auto;opacity:1}
.hero-noise{opacity:.1}.hero-glow-red{background:#f3002b;opacity:.26;filter:blur(125px)}.hero-glow-blue{background:#005eff;opacity:.28;filter:blur(120px)}
.hero-layout{grid-template-columns:1.02fr .98fr;gap:clamp(0px,2vw,32px);min-height:590px;align-items:center}.hero-copy{padding:10px 0 32px}
.hero h1{font-size:clamp(51px,5.5vw,81px);font-weight:800;letter-spacing:-.07em;color:white;line-height:1.03;overflow-wrap:normal;text-shadow:0 10px 30px rgba(0,0,0,.25)}
.hero-desc{max-width:505px;color:#c0cee5;font-size:16px;line-height:1.8}
.hero-tag{background:linear-gradient(100deg,rgba(245,15,61,.12),rgba(17,89,237,.1));border:1px solid rgba(81,122,220,.44);color:#d7e5ff;padding:9px 16px;border-radius:90px}.tag-spark{color:#ff3050}.tag-slash{color:#79baff}
.hero-trust{gap:13px 19px}.hero-trust span{color:#b1c4e5}.hero-trust svg{color:#3e94ff}.hero-scroll{color:#829cc6}.scroll-line{background:linear-gradient(90deg,#ff1741,#247eff)}
.hero-visual{height:590px;width:100%;max-width:620px;margin-inline:auto;isolation:isolate;overflow:visible;display:flex;align-items:center;justify-content:center}
.vortex-device-stage{position:relative;width:100%;display:grid;place-items:center;transform:translate3d(0,0,0);transition:transform .3s ease;isolation:isolate}
.hero-phones-img{display:block;width:115%;max-width:none;height:auto;object-fit:contain;filter:drop-shadow(0 25px 30px rgba(0,0,0,.28));pointer-events:none;user-select:none}
.device-halo{position:absolute;width:68%;height:64%;border-radius:50%;filter:blur(85px);opacity:.5;z-index:-1;pointer-events:none}.device-halo-blue{right:4%;top:5%;background:#005bff}.device-halo-red{left:4%;bottom:4%;background:#f00035}
.vortex-corner-label{position:absolute;bottom:7%;left:9%;border:1px solid #2b5999;background:rgba(8,18,38,.87);color:#b7d3ff;display:flex;align-items:center;gap:9px;padding:9px 12px;border-radius:9px;font-size:9px;letter-spacing:.11em;font-weight:800;box-shadow:0 14px 35px rgba(0,0,0,.35)}
.live-dot{height:6px;width:6px;flex:none;border-radius:50%}.vortex-corner-label strong{color:#ff3b59;font-size:9px}
.build-strip{background:linear-gradient(90deg,#080c16,#0b1832 58%,#0d101c);border-block:1px solid rgba(50,103,223,.19)}
/* Original designed illustrations, vector 3D: three preview panels. */
.vortex-lab-section{background:linear-gradient(130deg,#070b15,#090d18 50%,#060b1c);border-bottom:1px solid rgba(38,80,168,.18)}
.vortex-lab-head{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.68fr);align-items:end;gap:35px;margin-bottom:40px}.vortex-lab-head .section-heading{margin:0}.vortex-lab-head>p{margin:0 0 5px;color:#a9bfde;font-size:15px}.vortex-highlight{color:#4b98ff!important}
.vortex-art-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.vortex-art-card{position:relative;min-width:0;overflow:hidden;background:#0b1324;border:1px solid rgba(62,107,208,.35);border-radius:22px;box-shadow:0 24px 40px rgba(0,0,0,.23);transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease}
.vortex-art-card:hover{transform:translateY(-8px);border-color:#3579ff;box-shadow:0 30px 60px rgba(0,0,0,.38),0 0 26px rgba(22,77,232,.17)}
.art-image-wrap{position:relative;aspect-ratio:1.18;overflow:hidden;display:flex;justify-content:center;align-items:center}.art-image-wrap:before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 50%,rgba(18,77,198,.25),transparent 65%)}
.art-image-wrap.blue-art{background:radial-gradient(ellipse at 25% 15%,rgba(1,81,245,.28),transparent 62%),#081021}.art-image-wrap.red-art{background:radial-gradient(ellipse at 85% 21%,rgba(245,6,54,.25),transparent 66%),#0a0c18}.art-image-wrap.mixed-art{background:radial-gradient(ellipse at 45% 35%,rgba(15,99,238,.19),transparent 70%),#0d1423}
.art-image-wrap img{position:relative;width:108%;height:100%;object-fit:contain;max-width:none;filter:drop-shadow(0 14px 20px rgba(0,0,0,.2));transform:scale(1.08);transition:transform .35s ease}
.vortex-art-card:hover .art-image-wrap img{transform:scale(1.14) translateY(-5px)}
.art-card-bottom{display:flex;justify-content:space-between;align-items:center;padding:20px 22px 22px;gap:10px;background:linear-gradient(130deg,#101b2e,#090f1d);border-top:1px solid rgba(78,120,210,.22)}
.art-card-bottom span{font-size:10px;letter-spacing:.13em;font-weight:800;color:#76aeff}.art-card-bottom h3{font-size:20px;margin:6px 0 0;color:#fff}
.art-card-bottom a{width:43px;height:43px;display:grid;place-items:center;border-radius:12px;font-size:25px;color:white;border:1px solid #2766d1;background:linear-gradient(140deg,#173e8a,#0b2047);transition:background .25s}.art-card-bottom a:hover{background:linear-gradient(140deg,#ff1742,#cd0030);border-color:#ff4a68}
/* Strong saturated translucent cards throughout all pages. */
.feature-card,.service-detail-card,.example-card,.value-card,.process-item,.contact-form-panel,.contact-banner{border:1px solid rgba(74,120,218,.24);background:linear-gradient(155deg,rgba(19,35,68,.71),rgba(8,13,25,.85));box-shadow:inset 0 1px 0 rgba(95,148,255,.07)}
.feature-card:hover,.service-detail-card:hover,.example-card:hover,.value-card:hover{border-color:rgba(29,108,255,.66);box-shadow:0 25px 60px rgba(0,0,0,.4),0 0 40px rgba(4,97,255,.14)}
.feature-card::after,.service-detail-card::after,.example-card::after,.value-card::after{background:radial-gradient(350px circle at var(--spot-x,50%) var(--spot-y,35%),rgba(18,82,238,.21),transparent 65%)}
.feature-card .feature-icon,.service-circle{box-shadow:0 9px 22px rgba(0,0,0,.25)}
.code-window{border-color:rgba(31,112,255,.55);box-shadow:0 27px 61px rgba(0,0,0,.45),0 0 25px rgba(0,92,255,.13)}
.showcase-grid{background-image:linear-gradient(rgba(33,92,199,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(33,92,199,.09) 1px,transparent 1px)}
.cta-panel{background:radial-gradient(ellipse at 87% 30%,rgba(5,98,248,.65),transparent 56%),linear-gradient(115deg,#a3002a 0%,#740222 40%,#092975 100%);border:1px solid rgba(91,144,255,.53);box-shadow:0 25px 63px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.14)}
.cta-orb{background:#1559e7;opacity:.6}.orb-ring{border-color:rgba(137,185,255,.55)}
/* second-level pages with 3D brand render */
.page-hero{background:radial-gradient(ellipse 550px 370px at 89% 50%,rgba(0,92,249,.19),transparent 75%),radial-gradient(ellipse 500px 370px at 5% 100%,rgba(221,0,51,.11),transparent 72%),linear-gradient(124deg,#050711,#0a1122);border-bottom-color:rgba(62,111,220,.28)}
.page-hero:after{opacity:.35;background-image:linear-gradient(rgba(44,104,229,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(44,104,229,.09) 1px,transparent 1px)}
.page-hero h1{color:#fff}.page-hero p{color:#c0cce0}.inner-hero-sculpture{opacity:.3}
.service-hero-pictures{width:min(100%,800px);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:24px auto -35px;position:relative;z-index:2}
.service-hero-pictures img{display:block;min-width:0;max-width:100%;height:auto;filter:drop-shadow(0 16px 22px rgba(0,0,0,.35));transition:transform .2s}.service-hero-pictures img:nth-child(2){transform:translateY(-12px);position:relative}.service-hero-pictures img:hover{transform:translateY(-8px) scale(1.025)}.service-hero-pictures img:nth-child(2):hover{transform:translateY(-20px) scale(1.025)}
.about-symbol-wrap{isolation:isolate;overflow:visible}.about-brand-3d{display:block;width:min(100%,580px);height:auto;object-fit:contain;filter:drop-shadow(0 27px 30px rgba(0,0,0,.25))}
.contact-hero{isolation:isolate}.contact-hero .container{position:relative;z-index:2}.contact-orb-3d{position:absolute;width:380px;max-width:40%;top:50%;right:5%;opacity:.46;transform:translateY(-50%);z-index:0;pointer-events:none;filter:drop-shadow(0 20px 30px rgba(0,0,0,.22))}
/* 3D concept panels in all six Solutions examples */
.example-visual{background:#080d1a;display:flex;align-items:center;justify-content:center;overflow:hidden;padding:0!important;isolation:isolate}
.example-visual:before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 60%,rgba(1,92,250,.19),transparent 72%);z-index:-1}
.example-visual.sky,.example-visual.coral,.example-visual.indigo,.example-visual.peach,.example-visual.teal,.example-visual.slate{background:linear-gradient(122deg,#061022,#0b1426 58%,#120b19)!important}
.example-visual .example-watermark{position:absolute;top:16px;left:18px;z-index:2;color:#9cb9e5;border-radius:8px;border:1px solid rgba(75,126,223,.4);background:rgba(5,13,30,.8);padding:5px 9px;font-size:9px;font-weight:800;letter-spacing:.12em}
.example-art-3d{position:relative;width:100%;height:100%;max-width:none;object-fit:contain;transform:scale(1.12);filter:drop-shadow(0 20px 21px rgba(0,0,0,.32));transition:transform .3s ease}
.example-card:hover .example-art-3d{transform:scale(1.17) translateY(-5px)}
.example-kicker{color:#6aa9ff}.example-info a:hover{color:#72baff}
/* Contacts fields legibility */
.contact-form-panel input,.contact-form-panel select,.contact-form-panel textarea{background:#0d1729;border-color:rgba(66,111,213,.38);color:#fff}.contact-form-panel input:focus,.contact-form-panel select:focus,.contact-form-panel textarea:focus{border-color:#2281ff}.contact-form-panel input::placeholder,.contact-form-panel textarea::placeholder{color:#94a8c6}
.footer{background:#04060b;border-top:1px solid rgba(63,103,195,.28)}.float-wa{filter:drop-shadow(0 9px 20px rgba(0,0,0,.42))}.wa-round{box-shadow:0 0 0 5px rgba(8,205,106,.09),0 0 20px rgba(1,198,95,.2)}
/* Accessible motion fallback; the images remain visible without animations. */
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){.vortex-device-stage{transform:perspective(1300px) rotateX(var(--holo-x,0deg)) rotateY(var(--holo-y,0deg))}}
@media(max-width:1150px){.hero h1{font-size:clamp(48px,5.5vw,72px)}.hero-phones-img{width:108%}.vortex-art-grid{gap:14px}.art-card-bottom{padding:16px}}
@media(max-width:960px){.hero{padding-top:65px}.hero-layout{grid-template-columns:1fr;gap:6px;min-height:0}.hero-copy{padding:0}.hero h1{font-size:clamp(56px,8.4vw,80px)}.hero-visual{height:auto;max-width:660px;min-height:0;margin:4px auto 0}.hero-phones-img{width:100%;max-width:100%}.vortex-corner-label{bottom:4%;left:10%}.vortex-lab-head{gap:24px}.vortex-art-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.art-card-bottom h3{font-size:17px}.service-hero-pictures{max-width:680px}.contact-orb-3d{max-width:42%;right:0;opacity:.22}}
@media(max-width:680px){.container{width:min(calc(100% - 32px),1200px)}.hero{padding-top:50px;padding-bottom:25px}.hero h1{font-size:clamp(42px,11.5vw,65px);line-height:1.06}.hero-desc{font-size:14px}.hero-tag{font-size:9px;max-width:100%;letter-spacing:.04em;padding:9px 12px}.hero-trust{gap:10px 13px}.hero-trust span{font-size:11px}.hero-visual{min-height:0;height:auto;max-width:470px}.hero-phones-img{width:100%;height:auto}.vortex-corner-label{font-size:8px;bottom:3%;left:4%;padding:7px 9px}.vortex-lab-head{display:block;margin-bottom:23px}.vortex-lab-head>p{margin-top:18px;font-size:14px}.vortex-art-grid{grid-template-columns:1fr;gap:16px}.vortex-art-card{display:grid;grid-template-columns:44% 56%;min-height:176px;align-items:stretch}.art-image-wrap{aspect-ratio:auto;min-height:180px}.art-image-wrap img{width:140%;height:100%;transform:scale(1.08);object-fit:contain}.art-card-bottom{display:flex;align-items:flex-start;justify-content:center;flex-direction:column;padding:17px 11px 17px 8px}.art-card-bottom h3{font-size:17px}.art-card-bottom span{font-size:9px;letter-spacing:.06em}.art-card-bottom a{width:36px;height:36px;font-size:20px}.vortex-art-card:hover .art-image-wrap img{transform:scale(1.1)}.service-hero-pictures{gap:0;margin:25px auto -19px}.service-hero-pictures img{min-width:0}.contact-orb-3d{width:270px;max-width:70%;right:-13%;opacity:.12}.contact-hero .container{position:relative;z-index:2}.example-art-3d{transform:scale(1.15)}.example-card:hover .example-art-3d{transform:scale(1.15)}}
@media(max-width:390px){.hero h1{font-size:clamp(39px,11vw,48px)}.hero-tag .tag-slash{display:none}.hero-phones-img{width:110%;margin-inline:-5%}.vortex-corner-label{bottom:0;left:4%}.vortex-art-card{grid-template-columns:45% 55%}.art-card-bottom h3{font-size:15px}}
@media(prefers-reduced-motion:reduce){.vortex-device-stage,.vortex-art-card,.art-image-wrap img,.service-hero-pictures img,.example-art-3d{transition:none!important;transform:none!important}.service-hero-pictures img:nth-child(2){transform:none!important}}
@media print{.vortex-corner-label,.float-wa{display:none!important}}
/* Correcciones de contraste para que no queden tonos pastel de la edición anterior. */
.brand-dot{background:none!important;color:#ff2448!important}
.hero h1 .gradient-text{background:linear-gradient(103deg,#ff2448 0%,#ff1744 30%,#125efa 70%,#35acff 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
