:root{--navy:#081b3a;--navy-2:#0d2954;--blue:#2674ea;--blue-2:#55a3ff;--ink:#10213b;--muted:#647187;--line:#dfe6ef;--soft:#f4f7fb;--white:#fff;--green:#28b579;--shadow:0 24px 70px rgba(10,34,70,.12);--radius:24px}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:92px}body{margin:0;color:var(--ink);background:#fff;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.55;-webkit-font-smoothing:antialiased}body.menu-open,body.panel-open{overflow:hidden}a{color:inherit;text-decoration:none}button{font:inherit}.container{width:min(1180px,calc(100% - 40px));margin-inline:auto}.section-pad{padding:112px 0}.skip-link{position:fixed;top:-100px;left:20px;z-index:9999;background:var(--navy);color:#fff;padding:12px 18px;border-radius:8px}.skip-link:focus{top:20px}
.site-header{position:fixed;inset:0 0 auto;z-index:100;height:82px;display:flex;align-items:center;background:rgba(255,255,255,.86);border-bottom:1px solid rgba(220,228,239,.75);backdrop-filter:blur(18px)}.nav-wrap{display:flex;align-items:center;justify-content:space-between}.logo{display:flex;align-items:center;gap:12px}.logo-mark{display:grid;place-items:center;width:42px;height:42px;border-radius:13px;color:#fff;background:linear-gradient(145deg,var(--navy),var(--blue));font-size:14px;font-weight:850;letter-spacing:-.5px;box-shadow:0 9px 22px rgba(25,91,188,.22)}.logo-copy{display:flex;flex-direction:column;line-height:1.12}.logo-copy strong{font-size:15px;letter-spacing:-.2px}.logo-copy small{margin-top:4px;color:#8994a5;font-size:10px;letter-spacing:1.6px;text-transform:uppercase}.main-nav{display:flex;align-items:center;gap:34px}.main-nav>a{font-size:13px;font-weight:650;color:#44536a;transition:.2s}.main-nav>a:hover{color:var(--blue)}.main-nav .nav-cta{padding:11px 18px;color:#fff;background:var(--navy);border-radius:11px}.main-nav .nav-cta:hover{color:#fff;background:var(--blue)}.menu-toggle{display:none;border:0;background:none;padding:8px}.menu-toggle span{display:block;width:24px;height:2px;margin:5px;background:var(--navy);transition:.25s}
.hero{position:relative;overflow:hidden;padding-top:164px;padding-bottom:92px;background:radial-gradient(circle at 75% 25%,#eef5ff 0,rgba(245,248,252,0) 38%),linear-gradient(135deg,#fff 0%,#f6f8fb 100%)}.hero:before{content:"";position:absolute;inset:0;background-image:radial-gradient(#a6b9d3 1px,transparent 1px);background-size:26px 26px;opacity:.15;mask-image:linear-gradient(90deg,transparent,black 75%,transparent)}.hero-grid{position:relative;display:grid;grid-template-columns:.88fr 1.12fr;align-items:center;gap:60px;min-height:570px}.eyebrow{display:flex;align-items:center;gap:9px;margin:0 0 22px;color:var(--blue);font-size:11px;font-weight:800;letter-spacing:1.7px;text-transform:uppercase}.eyebrow>span{width:28px;height:2px;background:currentColor}.eyebrow.light{color:#78b2ff}.hero h1{margin:0;max-width:610px;font-size:clamp(48px,5.7vw,78px);line-height:1.02;letter-spacing:-4px;font-weight:780}.hero h1 em,.web-copy h2 em,.custom-copy h2 em,.contact h2 em,.experience h2 em{color:var(--blue);font-style:normal}.hero-lead{max-width:570px;margin:28px 0 34px;color:var(--muted);font-size:18px;line-height:1.7}.hero-actions{display:flex;flex-wrap:wrap;gap:12px}.button{display:inline-flex;align-items:center;justify-content:center;gap:13px;min-height:54px;padding:0 23px;border-radius:13px;font-size:14px;font-weight:750;transition:transform .2s,box-shadow .2s,background .2s}.button:hover{transform:translateY(-2px)}.button-primary{color:#fff;background:linear-gradient(135deg,var(--blue),#155ac9);box-shadow:0 14px 28px rgba(38,116,234,.24)}.button-primary:hover{box-shadow:0 18px 34px rgba(38,116,234,.32)}.button-ghost{border:1px solid #cfd8e5;background:rgba(255,255,255,.68)}.button-ghost:hover{background:#fff}.hero-proof{display:flex;align-items:center;gap:17px;margin-top:38px}.hero-proof p{margin:0;color:#7b8798;font-size:12px;line-height:1.5}.hero-proof strong{color:var(--ink);font-size:13px}.avatars{display:flex}.avatars span{display:grid;place-items:center;width:36px;height:36px;margin-left:-8px;border:3px solid #fff;border-radius:50%;color:#fff;background:var(--navy);font-size:9px;font-weight:800}.avatars span:first-child{margin:0;background:var(--blue)}.avatars span:nth-child(2){background:#5e789d}.avatars span:nth-child(3){background:#0e315f}
.hero-visual{position:relative;min-height:490px;display:grid;place-items:center;perspective:1200px}.glow{position:absolute;border-radius:50%;filter:blur(5px)}.glow-one{width:430px;height:430px;background:rgba(72,143,248,.15)}.glow-two{right:2%;bottom:5%;width:170px;height:170px;background:rgba(102,192,255,.2)}.browser-card{position:relative;z-index:2;width:100%;max-width:670px;border:1px solid rgba(255,255,255,.9);border-radius:20px;background:#fff;box-shadow:0 35px 90px rgba(8,35,76,.19);overflow:hidden;transform:rotateY(-5deg) rotateX(2deg)}.browser-top{height:41px;display:flex;align-items:center;gap:6px;padding:0 14px;border-bottom:1px solid #e8edf4;background:#f8fafc}.browser-top i{width:7px;height:7px;border-radius:50%;background:#d3dae4}.browser-top i:first-child{background:#ff7a73}.browser-top i:nth-child(2){background:#f5c860}.browser-top i:nth-child(3){background:#62ce8e}.browser-top span{margin-left:16px;padding:5px 65px;border-radius:5px;color:#a1adbd;background:#eef2f6;font-size:7px}.dashboard{display:grid;grid-template-columns:58px 1fr;min-height:382px}.dashboard aside{display:flex;flex-direction:column;align-items:center;gap:25px;padding-top:22px;background:#0b2246}.dashboard aside b{display:grid;place-items:center;width:28px;height:28px;border-radius:8px;color:#fff;background:#2d7df1;font-size:8px}.dashboard aside span{width:17px;height:4px;border-radius:5px;background:#3e5474}.dashboard aside span:nth-child(2){background:#67a7ff}.dash-content{padding:27px 29px;background:#f7f9fc}.dash-head{display:flex;justify-content:space-between;align-items:center}.dash-head div:first-child{display:flex;flex-direction:column}.dash-head small{font-size:8px;color:#9aa5b6}.dash-head strong{font-size:17px;letter-spacing:-.5px}.mini-avatar{display:grid;place-items:center;width:31px;height:31px;border-radius:50%;color:#fff;background:var(--blue);font-size:8px}.metric-row{display:grid;grid-template-columns:repeat(3,1fr);gap:11px;margin-top:24px}.metric-row div{position:relative;display:flex;flex-direction:column;padding:14px;border:1px solid #e8edf4;border-radius:11px;background:#fff}.metric-row small{font-size:7px;color:#8895a8}.metric-row b{margin-top:5px;font-size:15px}.metric-row em{position:absolute;right:10px;bottom:12px;color:#20aa70;font-size:6px;font-style:normal}.chart-card{margin-top:14px;padding:14px 18px 0;border:1px solid #e7edf4;border-radius:12px;background:#fff}.chart-card span{font-size:8px;font-weight:700}.chart-card svg{display:block;width:100%;height:135px}.floating-chip{position:absolute;z-index:4;display:flex;align-items:center;gap:11px;padding:12px 16px;border:1px solid rgba(255,255,255,.8);border-radius:14px;background:rgba(255,255,255,.92);box-shadow:0 18px 38px rgba(15,47,91,.15);backdrop-filter:blur(10px);animation:float 5s ease-in-out infinite}.chip-one{left:-15px;bottom:45px}.chip-two{right:-15px;top:66px;animation-delay:-2.5s}.chip-icon{display:grid;place-items:center;width:31px;height:31px;border-radius:9px;color:#fff;background:var(--green);font-size:12px;font-weight:900}.chip-two .chip-icon{background:var(--blue)}.floating-chip div{display:flex;flex-direction:column}.floating-chip small{font-size:7px;color:#8893a5}.floating-chip strong{font-size:9px}@keyframes float{50%{transform:translateY(-9px)}}
.trust-strip{border-block:1px solid #e6ebf2;background:#fff}.trust-grid{min-height:77px;display:grid;grid-template-columns:repeat(4,1fr);align-items:center}.trust-grid span{display:flex;align-items:center;justify-content:center;gap:10px;border-right:1px solid #e6ebf2;color:#647187;font-size:12px;font-weight:650}.trust-grid span:last-child{border:0}.trust-grid i{display:grid;place-items:center;width:20px;height:20px;border-radius:50%;color:var(--blue);background:#eaf2ff;font-size:9px;font-style:normal}
.section-heading{display:flex;align-items:end;justify-content:space-between;gap:40px;margin-bottom:48px}.section-heading h2,.web-copy h2,.custom-copy h2{margin:0;font-size:clamp(38px,4.5vw,59px);line-height:1.08;letter-spacing:-2.5px}.section-heading>p{max-width:450px;margin:0;color:var(--muted);font-size:15px}.system-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.system-card{position:relative;display:flex;flex-direction:column;min-height:580px;padding:30px 30px 26px;border:1px solid #e2e8f1;border-radius:var(--radius);background:#fff;overflow:hidden;transition:.3s}.system-card:hover{transform:translateY(-8px);box-shadow:var(--shadow);border-color:transparent}.system-top{display:flex;align-items:center;justify-content:space-between}.system-icon{display:grid;place-items:center;width:44px;height:44px;border-radius:13px;color:#fff;background:var(--blue);font-size:19px}.barber .system-icon{background:#7152d6}.remis .system-icon{background:#0f9b81}.pill{padding:6px 10px;border-radius:99px;color:#778397;background:#f2f5f8;font-size:9px;font-weight:800;letter-spacing:.8px;text-transform:uppercase}.system-card h3{margin:25px 0 2px;font-size:26px;letter-spacing:-1px}.system-card>p{margin:0 0 22px;color:var(--muted);font-size:13px}.system-card ul{display:grid;gap:8px;margin:0;padding:0;list-style:none;color:#46566c;font-size:12px}.system-card li:before{content:"✓";margin-right:8px;color:var(--blue);font-weight:800}.mini-screen{position:relative;height:180px;margin:28px -30px 21px;background:#edf4fd;overflow:hidden}.system-card>a{display:flex;align-items:center;justify-content:space-between;margin-top:auto;font-size:12px;font-weight:800}.system-card>a span{font-size:19px;color:var(--blue)}.stock-screen{display:grid;grid-template-columns:38px 1fr;padding:21px 20px 0;background:linear-gradient(135deg,#eaf3ff,#f8fbff)}.screen-side{border-radius:8px 0 0 0;background:#15335f}.screen-main{padding:15px;border-radius:0 8px 0 0;background:#fff}.screen-main>span{display:block;width:40%;height:6px;border-radius:8px;background:#223e65}.screen-stats{display:flex;gap:6px;margin-top:14px}.screen-stats i{width:30%;height:30px;border-radius:5px;background:#e8f1ff}.screen-stats i:nth-child(2){background:#eaf8f2}.screen-stats i:nth-child(3){background:#f2edff}.bars{height:63px;display:flex;align-items:end;gap:9px;margin-top:12px;padding:8px;background:#f8fafc}.bars i{flex:1;height:40%;border-radius:3px 3px 0 0;background:#75a9f4}.bars i:nth-child(2){height:65%}.bars i:nth-child(3){height:48%}.bars i:nth-child(4){height:85%}.bars i:nth-child(5){height:72%}.barber-screen{background:linear-gradient(135deg,#eee9ff,#faf8ff)}.phone{position:absolute;z-index:2;left:44px;top:18px;width:87px;height:172px;padding:18px 10px;border:4px solid #182642;border-radius:16px;background:#fff;box-shadow:0 12px 25px rgba(44,25,102,.18)}.phone b{font-size:7px}.phone span{display:block;height:23px;margin-top:7px;border-radius:5px;background:#f1edff}.calendar{position:absolute;right:25px;top:35px;width:190px;height:130px;padding:17px;border-radius:12px;background:#fff;box-shadow:0 15px 35px rgba(47,25,107,.12)}.calendar b{font-size:9px}.calendar>div{display:flex;gap:6px;margin:13px 0}.calendar i{display:grid;place-items:center;width:29px;height:29px;border-radius:7px;background:#f4f1ff;font-size:7px;font-style:normal}.calendar i:nth-child(2){color:#fff;background:#7658dc}.calendar>span{display:block;height:6px;margin-top:8px;border-radius:6px;background:#eeeafa}.remis-screen{background:#e7f4f1}.map-lines{position:absolute;inset:0;background:linear-gradient(27deg,transparent 38%,rgba(255,255,255,.8) 39% 42%,transparent 43%),linear-gradient(145deg,transparent 42%,rgba(255,255,255,.8) 43% 47%,transparent 48%)}.pin{position:absolute;width:15px;height:15px;border:4px solid #fff;border-radius:50%;background:#12a083;box-shadow:0 5px 12px rgba(0,90,70,.25)}.p1{left:17%;top:34%}.p2{right:20%;top:20%}.p3{right:36%;bottom:22%;background:var(--blue)}.trip{position:absolute;left:50%;bottom:16px;width:160px;padding:12px 14px;border-radius:10px;background:#fff;box-shadow:0 12px 25px rgba(9,65,53,.14);transform:translateX(-50%)}.trip i{float:left;width:27px;height:27px;margin-right:9px;border-radius:8px;background:#dff5ef}.trip b,.trip small{display:block;font-size:7px}.trip small{color:#11a078}
.experience{position:relative;color:#fff;background:var(--navy);overflow:hidden}.experience:after{content:"";position:absolute;width:520px;height:520px;right:-180px;top:-220px;border:1px solid rgba(74,146,244,.18);border-radius:50%;box-shadow:0 0 0 80px rgba(40,105,194,.04),0 0 0 160px rgba(40,105,194,.03)}.experience-grid{position:relative;z-index:1;display:grid;grid-template-columns:.88fr 1.12fr;gap:100px;align-items:center}.portrait-card{position:relative;min-height:500px;border-radius:26px;background:linear-gradient(145deg,#173761,#091c3b);overflow:hidden}.portrait-card:before{content:"";position:absolute;inset:40px;background:radial-gradient(circle at 48% 36%,#2f659f,transparent 24%),radial-gradient(ellipse at 50% 105%,#1d4d85 0,transparent 55%);filter:saturate(.7)}.portrait-card:after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:25px 25px}.portrait-initials{position:absolute;z-index:2;left:50%;top:45%;font-size:104px;font-weight:900;letter-spacing:-9px;color:rgba(255,255,255,.12);transform:translate(-50%,-50%)}.portrait-label{position:absolute;z-index:3;inset:auto 34px 32px;display:flex;align-items:end;justify-content:space-between;border-top:1px solid rgba(255,255,255,.2);padding-top:20px}.portrait-label span{color:#78b2ff;font-size:9px;text-transform:uppercase;letter-spacing:1.5px}.portrait-label strong{text-align:right;font-size:12px}.experience h2{margin:0;font-size:clamp(44px,5vw,64px);line-height:1.08;letter-spacing:-2.5px}.experience h2 em{color:#73adfb}.experience-copy>.big-copy{margin:27px 0 15px;color:#fff;font-size:20px;line-height:1.55}.experience-copy>p:not(.eyebrow):not(.big-copy){color:#aebbd0;font-size:14px}.experience-numbers{display:grid;grid-template-columns:repeat(3,1fr);gap:17px;margin-top:38px;padding-top:28px;border-top:1px solid rgba(255,255,255,.13)}.experience-numbers div{display:flex;align-items:center;gap:12px}.experience-numbers strong{font-size:26px;color:#fff;letter-spacing:-1px}.experience-numbers span{color:#91a0b7;font-size:9px;line-height:1.35;text-transform:uppercase;letter-spacing:.6px}
.web-section{overflow:hidden;background:#f7f9fc}.web-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:100px;align-items:center}.web-copy>p:not(.eyebrow){color:var(--muted)}.feature-list{display:grid;gap:16px;margin:33px 0}.feature-list>div{display:flex;align-items:center;gap:15px}.feature-list i{display:grid;place-items:center;width:39px;height:39px;border:1px solid #dbe4f0;border-radius:11px;color:var(--blue);background:#fff;font-size:9px;font-style:normal;font-weight:800}.feature-list span{display:flex;flex-direction:column}.feature-list b{font-size:13px}.feature-list small{color:#7d899a;font-size:11px}.text-link{display:inline-flex;gap:16px;color:var(--blue);font-size:12px;font-weight:800}.devices{position:relative;min-height:510px}.desktop-device{position:absolute;top:35px;right:-40px;width:690px;padding:9px 9px 21px;border:1px solid #d5dde8;border-radius:19px;background:#ecf0f5;box-shadow:0 35px 70px rgba(19,38,68,.18)}.device-bar{height:27px;display:flex;gap:5px;align-items:center;padding-left:8px}.device-bar i{width:6px;height:6px;border-radius:50%;background:#c5ccd6}.website-shot{height:390px;color:#fff;background:linear-gradient(rgba(9,24,43,.16),rgba(9,24,43,.22)),linear-gradient(125deg,#6b7d83,#24343e 48%,#9a8c79);overflow:hidden}.website-shot nav{display:flex;justify-content:space-between;padding:24px 30px;font-size:8px}.website-shot nav b{font-size:14px}.shot-copy{padding:68px 45px}.shot-copy small{font-size:7px;letter-spacing:1.4px}.shot-copy b{display:block;margin-top:12px;font-family:Georgia,serif;font-size:48px;line-height:.98;font-weight:400}.shot-copy i{display:block;width:72px;height:2px;margin-top:25px;background:#fff}.mobile-device{position:absolute;z-index:3;left:10px;bottom:0;width:176px;height:370px;padding:7px;border-radius:27px;background:#152235;box-shadow:0 26px 55px rgba(15,33,62,.28)}.mobile-notch{position:absolute;z-index:4;top:11px;left:50%;width:62px;height:13px;border-radius:10px;background:#152235;transform:translateX(-50%)}.mobile-shot{height:100%;padding:32px 17px;color:#fff;border-radius:21px;background:linear-gradient(rgba(7,24,42,.28),rgba(7,24,42,.36)),linear-gradient(145deg,#9d927e,#34454d 65%,#1b2d37)}.mobile-shot>b{font-size:11px}.mobile-shot>div{height:116px}.mobile-shot small{font-family:Georgia,serif;font-size:22px;line-height:1.2}.mobile-shot i{display:block;width:45px;height:2px;margin-top:20px;background:#fff}
.finder{padding-top:90px;background:#fff}.finder-box{position:relative;padding:64px;border-radius:30px;color:#fff;background:linear-gradient(130deg,#0a2145,#103c72);overflow:hidden}.finder-box:after{content:"";position:absolute;width:380px;height:380px;right:-100px;top:-190px;border-radius:50%;background:rgba(54,134,244,.15)}.finder-copy{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:end}.finder-copy .eyebrow{grid-column:1/-1;margin-bottom:0}.finder-copy h2{margin:15px 0 0;font-size:clamp(35px,4.2vw,52px);line-height:1.1;letter-spacing:-2px}.finder-copy>p:last-child{max-width:390px;margin:0;color:#adbed3;font-size:14px}.finder-options{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:38px}.finder-options button{display:grid;grid-template-columns:44px 1fr 20px;grid-template-rows:auto auto;align-items:center;gap:1px 13px;padding:21px;text-align:left;color:#fff;border:1px solid rgba(255,255,255,.13);border-radius:15px;background:rgba(255,255,255,.06);cursor:pointer;transition:.2s}.finder-options button:hover,.finder-options button.active{border-color:#5b9ff5;background:rgba(52,128,230,.22);transform:translateY(-3px)}.finder-options button>span{grid-row:1/3;display:grid;place-items:center;width:42px;height:42px;border-radius:11px;background:rgba(93,159,248,.17);color:#79b4ff}.finder-options button b{font-size:12px}.finder-options button small{color:#90a5c0;font-size:9px}.finder-options button i{grid-column:3;grid-row:1/3;font-style:normal}.finder-result{position:relative;z-index:1;display:none;align-items:center;gap:14px;margin-top:20px;padding:16px 20px;border-radius:13px;background:#fff;color:var(--ink)}.finder-result.show{display:flex}.finder-result>span{width:9px;height:9px;border-radius:50%;background:var(--green)}.finder-result p{flex:1;margin:0;font-size:12px}.finder-result a{color:var(--blue);font-size:11px;font-weight:800}
.custom-grid{display:grid;grid-template-columns:1fr 1fr;gap:100px;align-items:center}.custom-visual{position:relative;min-height:490px;border-radius:30px;background:radial-gradient(circle at 50% 50%,#f5f9ff,#edf3fa);overflow:hidden}.core{position:absolute;z-index:3;left:50%;top:50%;display:grid;place-items:center;width:110px;height:110px;border:12px solid #fff;border-radius:50%;color:#fff;background:linear-gradient(145deg,var(--navy),var(--blue));box-shadow:0 20px 50px rgba(27,91,183,.26);font-size:25px;font-weight:900;transform:translate(-50%,-50%)}.core small{position:absolute;top:69px;font-size:7px;letter-spacing:1px;text-transform:uppercase}.orbit{position:absolute;left:50%;top:50%;border:1px dashed #a9bfdc;border-radius:50%;transform:translate(-50%,-50%)}.orbit-one{width:285px;height:285px}.orbit-two{width:420px;height:420px}.node{position:absolute;z-index:4;display:grid;place-items:center;width:46px;height:46px;border:7px solid #fff;border-radius:50%;color:var(--blue);background:#e7f0fd;box-shadow:0 10px 24px rgba(15,60,121,.13);font-size:9px;font-weight:850}.n1{left:18%;top:24%}.n2{right:16%;top:27%}.n3{left:24%;bottom:16%}.n4{right:19%;bottom:19%;color:#13a174;background:#e3f7f0}.custom-copy>p:not(.eyebrow){color:var(--muted);font-size:15px}.process{display:grid;gap:18px;margin:30px 0}.process>div{display:flex;align-items:center;gap:15px}.process i{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;color:var(--blue);background:#edf4fe;font-size:11px;font-style:normal;font-weight:800}.process span{display:flex;flex-direction:column}.process b{font-size:13px}.process small{color:#7c8899;font-size:11px}
.contact{padding-top:40px}.contact-box{display:grid;grid-template-columns:1.1fr .9fr;gap:70px;align-items:center;padding:67px;border-radius:30px;color:#fff;background:linear-gradient(135deg,#071a39,#0d2d5d);box-shadow:0 28px 70px rgba(8,29,63,.2)}.contact h2{margin:0;font-size:clamp(36px,4.3vw,54px);line-height:1.13;letter-spacing:-2.4px}.contact h2 em{color:#74afff}.contact-box>div>p:not(.eyebrow){color:#a8b7cb}.contact-actions>p{text-align:center;color:#7185a1;font-size:9px}.whatsapp-button{display:flex;align-items:center;gap:14px;padding:17px;border-radius:16px;color:var(--ink);background:#fff;box-shadow:0 15px 30px rgba(0,0,0,.15);transition:.2s}.whatsapp-button:hover{transform:translateY(-3px)}.whatsapp-button>span{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;color:#fff;background:#27bc72;font-size:10px;font-weight:900}.whatsapp-button>div{display:flex;flex:1;flex-direction:column}.whatsapp-button small{color:#788599;font-size:9px}.whatsapp-button strong{font-size:18px}.whatsapp-button>i{font-style:normal;color:var(--blue)}
footer{padding:33px 0;border-top:1px solid #e7ebf1}.footer-grid{display:flex;align-items:center;justify-content:space-between}.footer-logo .logo-mark{width:34px;height:34px;border-radius:10px}.footer-logo .logo-copy strong{font-size:12px}.footer-logo .logo-copy small{font-size:8px}.footer-grid>p{color:#929cab;font-size:9px}.footer-grid>div{display:flex;gap:25px}.footer-grid>div a{color:#687689;font-size:10px}
.assistant-trigger{position:fixed;z-index:90;right:24px;bottom:22px;display:flex;align-items:center;gap:10px;padding:8px 14px 8px 8px;border:0;border-radius:99px;color:#fff;background:var(--navy);box-shadow:0 12px 34px rgba(8,27,58,.3);cursor:pointer}.assistant-trigger>b{display:grid;place-items:center;width:37px;height:37px;border-radius:50%;background:var(--blue);font-size:11px}.assistant-trigger>i{font-size:11px;font-style:normal;font-weight:750}.assistant-dot{position:absolute;left:36px;top:7px;width:8px;height:8px;border:2px solid var(--navy);border-radius:50%;background:#39d98a}.assistant-panel{position:fixed;z-index:101;right:24px;bottom:82px;width:min(360px,calc(100vw - 32px));border:1px solid #e2e7ee;border-radius:21px;background:#fff;box-shadow:0 25px 70px rgba(8,29,63,.22);opacity:0;visibility:hidden;transform:translateY(15px) scale(.97);transition:.25s;overflow:hidden}.assistant-panel.open{opacity:1;visibility:visible;transform:none}.assistant-head{display:flex;align-items:center;justify-content:space-between;padding:17px 18px;color:#fff;background:var(--navy)}.assistant-head>div{display:flex;align-items:center;gap:11px}.assistant-head>div>span{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;background:var(--blue);font-size:10px;font-weight:900}.assistant-head p{display:flex;flex-direction:column;margin:0}.assistant-head b{font-size:12px}.assistant-head small{color:#9eb0c8;font-size:8px}.assistant-head small i{display:inline-block;width:6px;height:6px;border-radius:50%;background:#3fd18d}.assistant-head button{border:0;color:#9fb0c6;background:none;font-size:23px;cursor:pointer}.assistant-body{min-height:245px;padding:18px;background:#f7f9fc}.bot-message,.assistant-answer p{width:86%;margin:0 0 14px;padding:12px 14px;border-radius:5px 13px 13px 13px;background:#fff;box-shadow:0 5px 15px rgba(24,46,77,.06);font-size:11px}.quick-replies{display:flex;flex-wrap:wrap;gap:7px}.quick-replies button{padding:8px 10px;border:1px solid #dce5f1;border-radius:99px;color:#356fbf;background:#fff;font-size:9px;cursor:pointer}.quick-replies button:hover{color:#fff;border-color:var(--blue);background:var(--blue)}.assistant-wa{display:block;padding:14px;text-align:center;color:#fff;background:#22b96b;font-size:10px;font-weight:800}
/* Real product portfolio hero */
.product-stage,.product-switcher{display:none}.real-hero-collage{position:relative;width:100%;height:520px}.real-main-shot{position:absolute;z-index:2;inset:52px 0 26px 15px;margin:0;border:8px solid #fff;border-radius:22px;background:#fff;box-shadow:0 35px 85px rgba(8,35,76,.22);overflow:hidden;transform:rotate(-1.4deg)}.real-main-shot:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 63%,rgba(3,16,35,.84))}.real-main-shot img{width:100%;height:100%;object-fit:cover}.real-main-shot figcaption{position:absolute;z-index:2;left:23px;bottom:17px;display:grid;grid-template-columns:auto 1fr;column-gap:10px;color:#fff}.real-main-shot figcaption span{grid-row:1/3;align-self:center;padding:6px 9px;border-radius:99px;color:#062918;background:#44dc91;font-size:6px;font-weight:800;text-transform:uppercase}.real-main-shot figcaption b{font-size:13px;letter-spacing:.8px}.real-main-shot figcaption small{color:#c5d1df;font-size:7px}.real-float-shot{position:absolute;z-index:4;margin:0;border:6px solid #fff;border-radius:16px;background:#fff;box-shadow:0 20px 48px rgba(11,35,70,.2);overflow:hidden}.real-float-shot img{width:100%;height:100%;object-fit:cover}.real-float-shot figcaption{position:absolute;inset:auto 7px 7px;display:grid;grid-template-columns:7px 1fr;padding:8px;border-radius:9px;background:rgba(7,23,43,.88);color:#fff;backdrop-filter:blur(7px)}.real-float-shot figcaption i{grid-row:1/3;align-self:center;width:5px;height:5px;border-radius:50%;background:#ffcf3d}.real-float-shot figcaption b{font-size:7px}.real-float-shot figcaption small{color:#aebbc9;font-size:5px}.shot-barber{right:-20px;top:0;width:270px;height:174px;transform:rotate(2.5deg)}.shot-stock{left:-14px;bottom:-4px;width:236px;height:168px;transform:rotate(-3deg)}.shot-stock figcaption i{background:#30c98a}.real-product-tabs{position:absolute;z-index:5;right:14px;bottom:-9px;display:flex;gap:3px;padding:4px;border:1px solid #e4e9f0;border-radius:99px;background:#fff;box-shadow:0 10px 25px rgba(15,43,81,.13)}.real-product-tabs span{padding:6px 8px;border-radius:99px;color:#7d899b;font-size:5px;font-weight:750}.real-product-tabs .active{color:#111;background:#ffd32e}.mini-screen.realized{padding:0}.mini-screen.realized>img{display:block;width:100%;height:100%;object-fit:cover}.mini-screen.realized>*:not(img){display:none}
/* Visual refinement: authentic product interfaces */
body{font-family:"Aptos","Segoe UI Variable","Segoe UI",sans-serif}.main-nav>a{font-weight:540;letter-spacing:-.05px}.logo-copy strong{font-weight:650}.logo-copy small{font-weight:500}.hero-grid{grid-template-columns:.82fr 1.18fr;gap:48px}.hero h1{max-width:650px;font-weight:610;letter-spacing:-4.8px}.hero-lead{font-weight:350}.eyebrow{font-weight:650;letter-spacing:2px}.button{font-weight:620}.trust-grid span{font-weight:520}.section-heading h2,.web-copy h2,.custom-copy h2,.experience h2,.contact h2{font-weight:560}.system-card h3{font-weight:680}.system-card{min-height:650px}.mini-screen{height:250px;margin-top:26px}
.hero-visual{min-height:535px}.product-stage{position:relative;width:100%;height:500px}.product-window{position:absolute;z-index:2;inset:28px 0 30px 16px;border:1px solid rgba(255,255,255,.9);border-radius:19px;background:#fff;box-shadow:0 35px 90px rgba(8,35,76,.2);overflow:hidden;transform:rotateY(-3deg) rotateX(1deg)}.product-bar{height:42px;display:flex;align-items:center;gap:14px;padding:0 15px;border-bottom:1px solid #e8edf4;background:#f9fbfd}.product-bar>span{display:flex;gap:5px}.product-bar>span i{width:7px;height:7px;border-radius:50%;background:#ff786f}.product-bar>span i:nth-child(2){background:#ffc95c}.product-bar>span i:nth-child(3){background:#5bd397}.product-bar>b{color:#1559c3;font-size:9px;letter-spacing:.6px}.product-bar>small{margin-left:auto;color:#9ba6b6;font-size:7px}.stockia-ui{display:grid;grid-template-columns:54px 1fr;height:calc(100% - 42px);background:#f5f8fc}.stockia-ui>aside{display:flex;flex-direction:column;align-items:center;gap:23px;padding:17px 0;background:#102c57}.stockia-ui>aside strong{display:grid;place-items:center;width:27px;height:27px;border-radius:8px;color:#fff;background:#2b7bf0;font-size:9px}.stockia-ui>aside i{color:#6882a8;font-size:13px;font-style:normal}.stockia-ui>aside i.active{color:#72acff}.stockia-ui>aside span{display:grid;place-items:center;width:25px;height:25px;margin-top:auto;margin-bottom:16px;border-radius:50%;color:#fff;background:#3d5e8a;font-size:7px}.stockia-content{padding:21px 23px}.stockia-content>header{display:flex;align-items:center;justify-content:space-between}.stockia-content>header>div{display:flex;flex-direction:column}.stockia-content header small{color:#9aa6b7;font-size:7px}.stockia-content header b{font-size:15px;font-weight:650}.stockia-content header button{padding:8px 12px;border:0;border-radius:7px;color:#fff;background:#2674ea;font-size:7px;font-weight:650}.stockia-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:17px}.stockia-kpis article{display:flex;flex-direction:column;padding:12px;border:1px solid #e3eaf3;border-radius:10px;background:#fff}.stockia-kpis span{color:#8794a7;font-size:6px}.stockia-kpis strong{margin:3px 0;font-size:13px}.stockia-kpis small{color:#27af77;font-size:6px}.stockia-kpis small:not(.live){color:#e09236}.stockia-bottom{display:grid;grid-template-columns:1.35fr .9fr;gap:9px;margin-top:10px}.sales-panel,.stock-panel{padding:12px;border:1px solid #e3eaf3;border-radius:10px;background:#fff}.sales-panel>b,.stock-panel>b{font-size:7px}.color-bars{height:85px;display:flex;align-items:end;gap:8px;padding:13px 7px 4px}.color-bars i{flex:1;height:43%;border-radius:3px 3px 1px 1px;background:linear-gradient(#51a0ff,#2c72de)}.color-bars i:nth-child(2){height:67%;background:linear-gradient(#8d6bf1,#6848c8)}.color-bars i:nth-child(3){height:51%;background:linear-gradient(#45d0b1,#19a583)}.color-bars i:nth-child(4){height:79%;background:linear-gradient(#ffad63,#eb7a33)}.color-bars i:nth-child(5){height:62%}.color-bars i:nth-child(6){height:89%;background:linear-gradient(#42cfac,#16a583)}.color-bars i:nth-child(7){height:75%;background:linear-gradient(#9b7af2,#7557d1)}.days{display:flex;justify-content:space-around;color:#9aa7b8;font-size:5px}.stock-panel{position:relative}.donut{position:absolute;left:13px;top:38px;display:grid;place-items:center;width:70px;height:70px;border-radius:50%;background:conic-gradient(#2d7df0 0 42%,#7a5be0 42% 75%,#28ba8b 75%);}.donut:before{content:"";position:absolute;width:45px;height:45px;border-radius:50%;background:#fff}.donut span{position:relative;z-index:1;font-size:9px;font-weight:700}.donut span small{display:block;text-align:center;color:#9ba6b6;font-size:5px}.stock-panel ul{display:grid;gap:7px;margin:19px 0 0 86px;padding:0;list-style:none;font-size:5px}.stock-panel li{display:flex;align-items:center;gap:4px}.stock-panel li i{width:5px;height:5px;border-radius:50%;background:#2d7df0}.stock-panel li:nth-child(2) i{background:#7a5be0}.stock-panel li:nth-child(3) i{background:#28ba8b}.stock-panel li b{margin-left:auto}.product-float{position:absolute;z-index:4;border:1px solid rgba(255,255,255,.9);background:rgba(255,255,255,.96);box-shadow:0 18px 45px rgba(16,42,80,.18);backdrop-filter:blur(12px)}.barber-float{right:-20px;top:0;width:275px;padding:14px;border-radius:15px}.barber-float header{display:flex;align-items:center;gap:8px;margin-bottom:10px}.barber-float header>span{display:grid;place-items:center;width:29px;height:29px;border-radius:9px;color:#fff;background:linear-gradient(145deg,#7e59e7,#5033ae);font-size:7px;font-weight:800}.barber-float header div{display:flex;flex:1;flex-direction:column}.barber-float header b{font-size:8px}.barber-float header small{color:#929cad;font-size:6px}.barber-float header em{padding:4px 6px;border-radius:99px;color:#6545c5;background:#eee9ff;font-size:5px;font-style:normal}.appointment{display:grid;grid-template-columns:30px 5px 1fr auto;align-items:center;gap:7px;margin-top:6px;padding:7px;border-radius:8px;background:#f8f6ff}.appointment time{font-size:6px;font-weight:700}.appointment>i{width:4px;height:23px;border-radius:5px;background:#7556db}.appointment p{display:flex;flex-direction:column;margin:0}.appointment p b{font-size:6px}.appointment p small{color:#9a8fbc;font-size:5px}.appointment>span{color:#25a975;font-size:5px}.appointment:last-child>i{background:#f19a4b}.appointment:last-child>span{color:#d98a3e}.remisia-float{left:-12px;bottom:5px;width:290px;border-radius:15px;overflow:hidden}.remisia-map{position:relative;height:74px;background:#dff1ec;overflow:hidden}.remisia-map:before,.remisia-map:after{content:"";position:absolute;width:340px;height:13px;left:-20px;top:30px;background:#fff;transform:rotate(-10deg)}.remisia-map:after{top:25px;left:50px;transform:rotate(35deg)}.route{position:absolute;z-index:2;width:190px;height:55px;left:45px;top:5px;border:3px solid transparent;border-top-color:#18a380;border-radius:50%;transform:rotate(-8deg)}.remisia-map i{position:absolute;z-index:3;font-style:normal}.remisia-map .car{left:130px;top:13px;display:grid;place-items:center;width:23px;height:23px;border:3px solid #fff;border-radius:8px;color:#fff;background:#159d7f;font-size:6px;box-shadow:0 5px 12px rgba(10,99,80,.2)}.remisia-map .origin,.remisia-map .destination{width:11px;height:11px;border:3px solid #fff;border-radius:50%;background:#19a484}.remisia-map .origin{left:39px;bottom:14px}.remisia-map .destination{right:34px;top:13px;background:#2977e7}.remisia-info{display:flex;flex-direction:column;padding:10px 13px}.remisia-info span{color:#159877;font-size:5px;font-weight:700}.remisia-info b{font-size:8px}.remisia-info small{color:#82909f;font-size:6px}.product-switcher{position:absolute;z-index:5;right:15px;bottom:-5px;display:flex;gap:4px;padding:4px;border-radius:99px;background:#fff;box-shadow:0 10px 25px rgba(15,43,81,.13)}.product-switcher span{padding:6px 9px;border-radius:99px;color:#8793a5;font-size:5px;font-weight:750}.product-switcher .active{color:#fff;background:#2876e8}
.stock-screen{display:block;padding:0;background:#f5f8fc}.mini-appbar{height:32px;display:flex;align-items:center;padding:0 12px;color:#fff;background:#143462}.mini-appbar>b{font-size:7px}.mini-appbar>span{margin-left:13px;color:#9fb2cd;font-size:5px}.mini-appbar>i{display:grid;place-items:center;width:17px;height:17px;margin-left:auto;border-radius:50%;background:#3a5d8d;font-size:5px;font-style:normal}.mini-stock-body{display:grid;grid-template-columns:32px 1fr;height:218px}.mini-stock-body>aside{display:flex;flex-direction:column;align-items:center;gap:15px;padding-top:14px;background:#102a52}.mini-stock-body>aside i{width:12px;height:4px;border-radius:4px;background:#54739e}.mini-stock-body>aside i:first-child{background:#5ca0ff}.mini-stock-body>main{padding:11px}.mini-stock-body main>header{display:flex;justify-content:space-between}.mini-stock-body main>header b{font-size:7px}.mini-stock-body main>header button{border:0;border-radius:5px;color:#fff;background:#2877e8;font-size:5px}.mini-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-top:8px}.mini-kpis>div{display:flex;flex-direction:column;padding:7px;border:1px solid #e0e8f1;border-radius:6px;background:#fff}.mini-kpis span{color:#8b97a8;font-size:4px}.mini-kpis b{font-size:8px}.mini-kpis small{color:#20a975;font-size:4px}.mini-stock-body main>section{display:grid;grid-template-columns:1.2fr 1fr;gap:5px;margin-top:6px}.mini-chart,.mini-list{padding:7px;border-radius:6px;background:#fff}.mini-chart>b,.mini-list>b{font-size:5px}.mini-chart>span{height:47px;display:flex;align-items:end;gap:5px;margin-top:5px}.mini-chart i{flex:1;height:40%;background:#4f94f1}.mini-chart i:nth-child(2){height:70%;background:#785be0}.mini-chart i:nth-child(3){height:55%;background:#22b28b}.mini-chart i:nth-child(4){height:88%;background:#ef9145}.mini-chart i:nth-child(5){height:65%}.mini-chart i:nth-child(6){height:79%;background:#775ae0}.mini-list p{display:flex;align-items:center;gap:4px;margin:5px 0;font-size:4px}.mini-list p>i{width:13px;height:13px;border-radius:4px;background:#e8f1ff}.mini-list p small{margin-left:auto;color:#e67d45}.barber-screen{padding:0 12px;background:linear-gradient(135deg,#f3efff,#fcfaff)}.barber-head{height:43px;display:flex;align-items:center;gap:8px}.barber-head>span{display:grid;place-items:center;width:25px;height:25px;border-radius:8px;color:#fff;background:#7050d6;font-size:6px;font-weight:800}.barber-head>div{display:flex;flex:1;flex-direction:column}.barber-head b{font-size:7px}.barber-head small{color:#927fbd;font-size:5px}.barber-head button{border:0;border-radius:6px;padding:6px 8px;color:#fff;background:#6f50d4;font-size:5px}.barber-days{display:grid;grid-template-columns:repeat(5,1fr);gap:5px}.barber-days span{padding:6px;text-align:center;border-radius:7px;color:#6d6287;background:#fff;font-size:7px;font-style:normal}.barber-days span small{display:block;color:#a89dbc;font-size:4px}.barber-days span.today{color:#fff;background:#7658dc;box-shadow:0 7px 14px rgba(103,72,194,.22)}.barber-days span.today small{color:#dcd3ff}.barber-grid{display:grid;grid-template-columns:28px 1fr;margin-top:9px}.barber-grid>aside{display:grid;align-content:space-around;color:#9b91b1;font-size:5px}.barber-grid>main{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.barber-grid article{display:flex;flex-direction:column;padding:9px;border-left:3px solid #7658db;border-radius:7px;background:#ebe5ff}.barber-grid article.orange{border-color:#ef9551;background:#fff0e5}.barber-grid article.aqua{border-color:#1bb69c;background:#e3f7f2}.barber-grid article small{font-size:4px}.barber-grid article b{margin-top:6px;font-size:6px}.barber-grid article span{color:#8d7caf;font-size:4px}.remis-screen{display:grid;grid-template-columns:100px 1fr;background:#e7f4f1}.remis-side{z-index:2;display:flex;flex-direction:column;padding:14px;color:#fff;background:#0b3c3b}.remis-side>b{font-size:8px;letter-spacing:.5px}.remis-side>span{margin-top:7px;color:#9fd7cd;font-size:4px}.remis-side>span i{display:inline-block;width:5px;height:5px;margin-right:3px;border-radius:50%;background:#28d59b}.remis-side>div{margin-top:16px;padding:8px;border:1px solid rgba(255,255,255,.1);border-radius:7px;background:rgba(255,255,255,.06)}.remis-side small{display:block;color:#8cc2ba;font-size:4px}.remis-side strong{font-size:13px}.real-map{position:relative;overflow:hidden;background:#dceee9}.street{position:absolute;height:12px;width:350px;background:rgba(255,255,255,.92)}.s1{left:-30px;top:43px;transform:rotate(-13deg)}.s2{left:-50px;top:130px;transform:rotate(20deg)}.s3{left:35px;top:88px;transform:rotate(67deg)}.s4{left:90px;top:155px;transform:rotate(-8deg)}.map-car{position:absolute;z-index:2;display:grid;place-items:center;width:22px;height:22px;border:3px solid #fff;border-radius:8px;color:#fff;background:#15a081;box-shadow:0 6px 12px rgba(9,86,70,.2);font-size:5px;font-style:normal}.c1{left:24px;top:30px}.c2{right:36px;top:72px;background:#2778ea}.c3{left:65px;bottom:25px}.active-trip{position:absolute;z-index:3;right:10px;bottom:10px;display:flex;flex-direction:column;width:135px;padding:9px;border-radius:8px;background:#fff;box-shadow:0 8px 20px rgba(15,65,57,.14)}.active-trip small{color:#16a081;font-size:4px;font-weight:700}.active-trip b{font-size:6px}.active-trip span{color:#869599;font-size:5px}
/* Innovation and Chatbot */
.innovation{position:relative;color:#fff;background:radial-gradient(circle at 75% 32%,rgba(15,133,226,.25),transparent 32%),linear-gradient(135deg,#03152f,#073568 60%,#032341);overflow:hidden}.innovation-glow{position:absolute;border-radius:50%;filter:blur(2px);opacity:.25}.innovation-glow.one{width:480px;height:480px;right:-180px;top:-170px;border:1px solid #27b0f4;box-shadow:0 0 80px #0c7bc6}.innovation-glow.two{width:300px;height:300px;left:-120px;bottom:-150px;background:#0468b4;filter:blur(70px)}.innovation-grid{position:relative;z-index:1;display:grid;grid-template-columns:.78fr 1.22fr;gap:70px;align-items:center}.innovation-copy h2{margin:0;font-size:clamp(42px,4.7vw,64px);line-height:1.05;letter-spacing:-2.8px;font-weight:590}.innovation-copy h2 em{color:#29c1ff;font-style:normal}.innovation-copy>p:not(.eyebrow){max-width:510px;margin:25px 0;color:#b4c7dc;font-size:16px}.innovation-actions{display:flex;flex-wrap:wrap;gap:12px}.chatbot-button{background:linear-gradient(135deg,#12b969,#24d983);box-shadow:0 15px 34px rgba(24,199,116,.25)}.chatbot-button span{display:grid;place-items:center;width:24px;height:24px;border:2px solid #fff;border-radius:50%;font-size:7px}.innovation-ghost{color:#fff;border:1px solid rgba(121,184,239,.45);background:rgba(255,255,255,.04)}.innovation-points{display:flex;gap:22px;margin-top:35px}.innovation-points span{display:flex;align-items:center;gap:7px;color:#a7bbd2;font-size:8px}.innovation-points i{display:grid;place-items:center;width:25px;height:25px;border:1px solid #267dc2;border-radius:50%;color:#39b9ff;font-style:normal}.chatbot-showcase{position:relative;min-height:570px}.chat-phone{position:absolute;z-index:5;left:28px;top:0;width:250px;height:540px;border:8px solid #101925;border-radius:34px;background:#f1ece4;box-shadow:0 30px 65px rgba(0,0,0,.35);overflow:hidden}.chat-phone-top{height:25px;display:flex;align-items:center;padding:0 15px;background:#fff;font-size:7px}.chat-phone-top span{margin-right:auto;font-weight:800}.chat-phone-top i{width:4px;height:4px;margin-left:4px;border-radius:50%;background:#111}.chat-phone-top b{margin-left:5px;color:#19a768;font-size:6px}.chat-phone>header{height:50px;display:flex;align-items:center;gap:8px;padding:0 12px;background:#fff;border-bottom:1px solid #e8e3db}.chat-phone>header>span{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;color:#fff;background:#2677e7;font-size:8px;font-weight:800}.chat-phone>header>div{display:flex;flex:1;flex-direction:column}.chat-phone>header b{color:#17263a;font-size:9px}.chat-phone>header small{color:#758194;font-size:6px}.chat-phone>header small i{display:inline-block;width:5px;height:5px;border-radius:50%;background:#22b972}.chat-phone>header em{color:#3b4655;font-style:normal}.chat-body{height:421px;padding:9px 8px;overflow:hidden;background-color:#efeae2;background-image:radial-gradient(rgba(79,96,89,.08) 1px,transparent 1px);background-size:12px 12px;color:#1c2b3c;font-size:7px}.chat-body .today{display:block;width:max-content;margin:0 auto 7px;padding:3px 8px;border-radius:6px;background:#fff;color:#708091}.chat-body p{position:relative;width:84%;margin:4px 0;padding:7px 8px;border-radius:3px 8px 8px 8px;background:#fff;box-shadow:0 2px 3px rgba(0,0,0,.05);line-height:1.33}.chat-body p.out{width:max-content;max-width:84%;margin-left:auto;border-radius:8px 3px 8px 8px;background:#d9fdd3}.chat-body p time{display:block;margin-top:2px;text-align:right;color:#769278;font-size:5px}.chat-body p.confirmed{border-left:3px solid #20bb72;background:#f6fff8}.chat-phone>footer{height:44px;display:flex;align-items:center;justify-content:space-between;padding:0 10px;background:#f7f7f7}.chat-phone>footer span{flex:1;padding:8px 11px;border-radius:99px;color:#97a0aa;background:#fff;font-size:7px}.chat-phone>footer b{display:grid;place-items:center;width:29px;height:29px;margin-left:6px;border-radius:50%;color:#fff;background:#20b66a}.chat-flow{position:absolute;z-index:4;left:250px;top:35px;display:flex;align-items:center;gap:8px}.chat-flow span{padding:8px 12px;border:1px solid #19e089;border-radius:10px;color:#fff;background:rgba(22,189,111,.14);box-shadow:0 0 22px rgba(28,217,132,.23);font-size:7px}.chat-flow i{width:45px;height:1px;background:#27dca7;box-shadow:0 0 10px #26e0a8}.chat-flow b{font-family:Georgia,serif;font-size:10px;font-style:italic;font-weight:400}.agenda-panel{position:absolute;z-index:3;right:0;top:100px;width:390px;padding:18px;border:1px solid rgba(89,167,227,.45);border-radius:17px;color:#18304d;background:rgba(248,252,255,.97);box-shadow:0 25px 70px rgba(0,0,0,.28)}.agenda-panel>header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.agenda-panel>header div{display:flex;align-items:center;gap:8px}.agenda-panel>header div span{display:grid;place-items:center;width:29px;height:29px;border-radius:8px;color:#fff;background:#2679e8}.agenda-panel>header b{font-size:11px}.agenda-panel>header small{padding:6px 8px;border-radius:7px;background:#ecf3fb;font-size:6px}.agenda-row{display:grid;grid-template-columns:45px 1fr auto;align-items:center;gap:9px;padding:11px;border-bottom:1px solid #e7edf4}.agenda-row.active{border:1px solid #52dba5;border-radius:9px;background:#edfff8;box-shadow:0 7px 15px rgba(40,182,128,.12)}.agenda-row time{color:#2479e8;font-size:11px;font-weight:750}.agenda-row p{display:flex;flex-direction:column;margin:0}.agenda-row p b{font-size:7px}.agenda-row p small{color:#8796a7;font-size:6px}.agenda-row>span{padding:4px 6px;border-radius:99px;color:#1d9b6d;background:#dcf8ec;font-size:5px;font-weight:800}.agenda-panel>footer{margin-top:12px;color:#309873;font-size:7px}.agenda-panel>footer i{display:inline-block;width:6px;height:6px;border-radius:50%;background:#26c684;box-shadow:0 0 0 4px #e1f9ef}.ai-products{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:25px}.ai-products article{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:22px;border:1px solid rgba(75,158,224,.32);border-radius:18px;background:rgba(6,34,68,.76);box-shadow:inset 0 1px rgba(255,255,255,.05)}.ai-card-head{display:flex;align-items:center;gap:12px}.ai-card-head>span{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;color:#fff;background:#286dea}.ai-card-head>div{display:flex;flex-direction:column}.ai-card-head b{font-size:14px}.ai-card-head small{color:#45b8ff;font-size:8px}.ai-card-head.green>span{background:#0baa6d}.memory-search{grid-column:2;grid-row:1;display:flex;align-items:center;padding:8px 10px;border:1px solid #2f6598;border-radius:8px;color:#91abc5;background:#061d39;font-size:6px}.memory-search span{flex:1}.memory-result{grid-column:1/-1;display:flex;align-items:center;gap:10px;padding:10px;border-radius:10px;background:#082446}.memory-result>i{display:grid;place-items:center;width:38px;height:38px;border-radius:8px;color:#fff;background:#215cbd;font-style:normal}.memory-result p{display:flex;flex-direction:column;margin:0}.memory-result b{font-size:8px}.memory-result small{color:#8fa9c4;font-size:6px}.face-grid{position:relative;display:flex;align-items:center;justify-content:space-around;height:60px;border:1px solid #0c7d76;border-radius:10px;background:linear-gradient(135deg,#123c50,#09293f)}.face-grid i{width:35px;height:35px;border:2px solid #32da85;border-radius:50%;background:linear-gradient(#507383,#1e3f50)}.face-grid span{position:absolute;right:4px;top:4px;padding:3px 5px;border-radius:5px;background:#0d765b;font-size:5px}.access-result{grid-column:1/-1;display:flex;align-items:center;gap:9px;padding:10px;border-radius:9px;background:#082f39}.access-result i{display:grid;place-items:center;width:22px;height:22px;border:2px solid #28d77e;border-radius:50%;color:#28d77e;font-style:normal}.access-result b{font-size:8px}.access-result time{margin-left:auto;color:#bfe8d8;font-size:8px}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}.reveal.visible{opacity:1;transform:none}.reveal-delay{transition-delay:.14s}.reveal-delay-sm{transition-delay:.1s}.reveal-delay-lg{transition-delay:.2s}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}.floating-chip{animation:none}}
@media(max-width:1020px){.hero-grid{grid-template-columns:1fr}.hero-copy{max-width:730px}.hero-visual{margin-top:20px}.system-grid{grid-template-columns:1fr 1fr}.system-card:last-child{grid-column:1/-1}.experience-grid,.web-grid,.custom-grid{gap:55px}.devices{min-height:450px}.desktop-device{width:570px}.contact-box{grid-template-columns:1fr}.contact-actions{max-width:430px}}
@media(max-width:760px){.container{width:min(100% - 28px,620px)}.section-pad{padding:78px 0}.site-header{height:70px}.menu-toggle{display:block}.main-nav{position:fixed;inset:70px 0 auto;display:flex;flex-direction:column;align-items:stretch;gap:0;padding:15px 20px 24px;border-bottom:1px solid #dde4ee;background:#fff;opacity:0;visibility:hidden;transform:translateY(-12px);transition:.25s;box-shadow:0 20px 40px rgba(13,37,71,.12)}.main-nav.open{opacity:1;visibility:visible;transform:none}.main-nav>a{padding:14px;border-bottom:1px solid #edf0f4}.main-nav .nav-cta{margin-top:10px;text-align:center}.menu-toggle.active span:first-child{transform:translateY(7px) rotate(45deg)}.menu-toggle.active span:nth-child(2){opacity:0}.menu-toggle.active span:last-child{transform:translateY(-7px) rotate(-45deg)}.hero{padding-top:122px}.hero-grid{gap:20px;min-height:auto}.hero h1{font-size:48px;letter-spacing:-2.8px}.hero-lead{font-size:16px}.hero-actions .button{width:100%}.hero-visual{min-height:385px}.browser-card{width:108%;transform:rotateY(-3deg) scale(.86)}.chip-one{left:0;bottom:10px}.chip-two{right:0;top:24px}.trust-grid{grid-template-columns:1fr 1fr;padding:12px 0}.trust-grid span{min-height:48px;border:0;font-size:10px}.section-heading{display:block}.section-heading>p{margin-top:18px}.system-grid{grid-template-columns:1fr}.system-card:last-child{grid-column:auto}.system-card{min-height:550px}.experience-grid,.web-grid,.custom-grid{grid-template-columns:1fr}.portrait-card{min-height:430px}.experience-grid{gap:55px}.experience-numbers{gap:8px}.experience-numbers div{display:block}.experience-numbers span{display:block;margin-top:5px}.web-grid{gap:15px}.devices{min-height:420px;margin-top:25px}.desktop-device{right:-160px;width:570px;transform:scale(.85)}.mobile-device{left:0;transform:scale(.85);transform-origin:bottom left}.finder-box{padding:40px 24px}.finder-copy{grid-template-columns:1fr}.finder-copy .eyebrow{grid-column:auto}.finder-options{grid-template-columns:1fr}.finder-result{align-items:flex-start;flex-wrap:wrap}.finder-result a{margin-left:22px}.custom-grid{gap:30px}.custom-visual{min-height:400px;order:2}.orbit-two{width:350px;height:350px}.contact{padding-top:20px}.contact-box{padding:42px 25px}.footer-grid{flex-direction:column;gap:22px}.assistant-trigger{right:14px;bottom:14px}.assistant-panel{right:16px;bottom:72px}}
@media(max-width:420px){.hero h1{font-size:42px}.hero-visual{min-height:330px}.browser-card{width:123%;transform:scale(.72)}.floating-chip{transform:scale(.86)}.chip-one{left:-10px}.chip-two{right:-8px}.experience-numbers strong{font-size:21px}.devices{min-height:370px}.desktop-device{right:-230px;transform:scale(.72);transform-origin:top center}.mobile-device{transform:scale(.72)}.custom-visual{min-height:350px}.orbit-one{width:235px;height:235px}.orbit-two{width:310px;height:310px}.contact h2{font-size:35px}}
@media(max-width:1020px){.hero-grid{grid-template-columns:1fr}.product-stage{width:min(720px,100%);margin-inline:auto}.system-card{min-height:650px}}
@media(max-width:760px){.hero h1{font-weight:600;letter-spacing:-3.1px}.product-stage{height:430px}.product-window{width:680px;left:50%;right:auto;transform:translateX(-50%) scale(.76);transform-origin:top center}.barber-float{right:-8px;top:6px;transform:scale(.78);transform-origin:top right}.remisia-float{left:-8px;bottom:8px;transform:scale(.8);transform-origin:bottom left}.product-switcher{right:0;bottom:0}.system-card{min-height:640px}.mini-screen{height:245px}.section-heading h2,.web-copy h2,.custom-copy h2{font-weight:560}}
@media(max-width:420px){.hero-visual{min-height:390px}.product-stage{height:390px}.product-window{width:680px;transform:translateX(-50%) scale(.64)}.barber-float{right:-17px;transform:scale(.66)}.remisia-float{left:-15px;bottom:20px;transform:scale(.68)}.product-switcher{display:none}.system-card{padding-inline:24px}.mini-screen{margin-inline:-24px}.hero h1{font-size:43px}.stockia-bottom{grid-template-columns:1.35fr .9fr}}
@media(max-width:1100px) and (min-width:761px){.main-nav{gap:20px}.main-nav>a{font-size:11px}}
@media(max-width:1020px){.real-hero-collage{width:min(720px,100%);margin-inline:auto}.innovation-grid{grid-template-columns:1fr}.innovation-copy{max-width:760px}.chatbot-showcase{width:min(690px,100%);margin-inline:auto}.ai-products{grid-column:auto}}
@media(max-width:760px){.real-hero-collage{height:420px}.real-main-shot{inset:48px -105px 34px -105px;transform:scale(.82)}.shot-barber{right:-8px;width:205px;height:132px}.shot-stock{left:-6px;width:175px;height:125px}.real-product-tabs{right:50%;bottom:2px;transform:translateX(50%)}.real-product-tabs span:nth-child(n+4){display:none}.innovation{padding-top:85px}.innovation-grid{gap:40px}.innovation-copy h2{font-size:43px}.innovation-actions .button{width:100%}.innovation-points{display:grid;grid-template-columns:1fr 1fr}.chatbot-showcase{min-height:690px}.chat-phone{left:0;top:0;transform:scale(.82);transform-origin:top left}.chat-flow{left:205px;top:20px}.chat-flow b{display:none}.agenda-panel{top:305px;width:100%}.ai-products{grid-template-columns:1fr;margin-top:0}.ai-products article{grid-template-columns:1fr}.memory-search{grid-column:1;grid-row:auto}.memory-result,.access-result{grid-column:1}.assistant-trigger{z-index:99}}
@media(max-width:420px){.real-hero-collage{height:365px}.real-main-shot{inset:42px -150px 36px -150px;transform:scale(.72)}.shot-barber{right:-10px;width:170px;height:110px}.shot-stock{left:-9px;width:145px;height:105px}.real-product-tabs{bottom:4px}.innovation-copy h2{font-size:38px}.chatbot-showcase{min-height:670px}.chat-phone{transform:scale(.76)}.chat-flow{left:185px}.agenda-panel{top:285px;padding:13px}.agenda-row{padding:9px 6px}.ai-products article{padding:17px}}


/* =========================================================
   HERO PREMIUM DEVICES — 23/09/2026
   ========================================================= */

.hero-devices{
    min-height:560px;
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
}

.hero-device-glow{
    position:absolute;
    width:540px;
    height:430px;
    border-radius:50%;
    background:
        radial-gradient(circle at 50% 50%,
        rgba(66,145,255,.22) 0%,
        rgba(101,176,255,.11) 38%,
        rgba(255,255,255,0) 72%);
    filter:blur(12px);
}

.device-showcase{
    position:relative;
    width:690px;
    height:525px;
    isolation:isolate;
}

/* NOTEBOOK PRINCIPAL */

.device-laptop{
    position:absolute;
    z-index:2;
    width:590px;
    left:48px;
    top:83px;
    margin:0;
    animation:heroDeviceIn .75s cubic-bezier(.2,.8,.2,1) both;
}

.device-laptop-frame{
    position:relative;
    padding:10px 10px 12px;
    border-radius:17px 17px 11px 11px;
    background:linear-gradient(145deg,#263242,#111a27);
    box-shadow:
        0 38px 75px rgba(17,42,76,.22),
        0 8px 18px rgba(18,42,74,.12);
}

.device-camera{
    position:absolute;
    z-index:3;
    top:4px;
    left:50%;
    width:4px;
    height:4px;
    border-radius:50%;
    background:#718094;
    transform:translateX(-50%);
}

.device-screen{
    position:relative;
    overflow:hidden;
    background:#e9eef4;
}

.device-laptop .device-screen{
    aspect-ratio:16/9;
    border-radius:8px;
}

.device-screen img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
}

.device-laptop-base{
    position:relative;
    width:640px;
    height:14px;
    left:-25px;
    border-radius:2px 2px 14px 14px;
    background:linear-gradient(180deg,#dce2e9,#9ca7b4);
    box-shadow:0 11px 18px rgba(25,45,70,.13);
}

.device-laptop-base:after{
    content:"";
    position:absolute;
    left:50%;
    top:0;
    width:95px;
    height:4px;
    border-radius:0 0 6px 6px;
    background:#aab4c0;
    transform:translateX(-50%);
}

.device-laptop figcaption{
    position:absolute;
    left:23px;
    bottom:31px;
    display:flex;
    align-items:center;
    gap:9px;
    padding:9px 13px;
    border:1px solid rgba(255,255,255,.65);
    border-radius:11px;
    color:#fff;
    background:rgba(5,24,42,.82);
    box-shadow:0 9px 25px rgba(0,0,0,.18);
    backdrop-filter:blur(10px);
}

.device-laptop figcaption div{
    display:flex;
    flex-direction:column;
}

.device-laptop figcaption strong{
    font-size:9px;
    letter-spacing:.5px;
}

.device-laptop figcaption small{
    color:#cbd6e1;
    font-size:6px;
}

.status-dot{
    width:7px;
    height:7px;
    border-radius:50%;
    background:#31d895;
    box-shadow:0 0 0 4px rgba(49,216,149,.15);
}


/* TABLETS */

.device-tablet{
    position:absolute;
    z-index:4;
    margin:0;
}

.device-tablet-frame{
    padding:7px;
    border-radius:15px;
    background:linear-gradient(145deg,#293545,#101925);
    box-shadow:
        0 25px 50px rgba(13,36,67,.22),
        0 5px 12px rgba(13,36,67,.12);
}

.device-tablet .device-screen{
    aspect-ratio:16/10;
    border-radius:9px;
}

.device-tablet figcaption{
    position:absolute;
    display:flex;
    flex-direction:column;
    padding:7px 10px;
    border:1px solid rgba(255,255,255,.72);
    border-radius:9px;
    background:rgba(255,255,255,.94);
    box-shadow:0 9px 22px rgba(15,43,81,.12);
    backdrop-filter:blur(9px);
}

.device-tablet figcaption strong{
    color:#15253a;
    font-size:8px;
}

.device-tablet figcaption small{
    margin-top:1px;
    color:#7b899a;
    font-size:6px;
}


/* STOCKIA */

.device-stock{
    width:260px;
    left:0;
    bottom:5px;
    animation:heroDeviceIn .7s .16s cubic-bezier(.2,.8,.2,1) both;
}

.device-stock figcaption{
    left:13px;
    bottom:12px;
}


/* BARBERPRO */

.device-barber{
    width:250px;
    right:0;
    top:5px;
    animation:heroDeviceIn .7s .28s cubic-bezier(.2,.8,.2,1) both;
}

.device-barber figcaption{
    right:12px;
    bottom:11px;
}


/* BADGE */

.showcase-badge{
    position:absolute;
    z-index:6;
    right:5px;
    bottom:44px;
    display:flex;
    align-items:center;
    gap:10px;
    padding:11px 14px;
    border:1px solid #e1e8f0;
    border-radius:13px;
    background:rgba(255,255,255,.94);
    box-shadow:0 15px 35px rgba(16,49,91,.13);
    backdrop-filter:blur(10px);
    animation:heroDeviceIn .7s .4s both;
}

.showcase-badge>i{
    width:9px;
    height:9px;
    border-radius:50%;
    background:#2bcb8b;
    box-shadow:0 0 0 5px rgba(43,203,139,.12);
}

.showcase-badge span{
    display:flex;
    flex-direction:column;
}

.showcase-badge strong{
    color:#17283d;
    font-size:9px;
}

.showcase-badge small{
    color:#8491a2;
    font-size:6px;
}

@keyframes heroDeviceIn{
    from{
        opacity:0;
        transform:translateY(18px) scale(.98);
    }
    to{
        opacity:1;
        transform:translateY(0) scale(1);
    }
}


/* HERO COPY REFINEMENT */

.hero h1{
    max-width:720px;
}

.hero-copy{
    position:relative;
    z-index:5;
}


/* RESPONSIVE */

@media(max-width:1050px){
    .device-showcase{
        transform:scale(.88);
        transform-origin:center;
    }
}

@media(max-width:820px){

    .hero-grid{
        grid-template-columns:1fr;
    }

    .hero-devices{
        min-height:510px;
        margin-top:10px;
    }

    .device-showcase{
        transform:scale(.9);
    }
}

@media(max-width:600px){

    .hero-devices{
        min-height:390px;
        margin-top:15px;
    }

    .device-showcase{
        width:690px;
        transform:scale(.55);
        transform-origin:top center;
    }

    .hero h1{
        letter-spacing:-3px;
    }
}



/* =========================================================
   HERO PREMIUM V2 — REFERENCE APPROVED
   ========================================================= */

.hero{
    padding-top:135px;
    padding-bottom:65px;
    background:
        radial-gradient(circle at 76% 42%,
        rgba(98,167,255,.20) 0,
        rgba(202,226,255,.14) 28%,
        rgba(255,255,255,0) 58%),
        linear-gradient(135deg,#ffffff 0%,#f8fbff 45%,#eef6ff 100%);
}

.hero-grid{
    grid-template-columns:.92fr 1.38fr;
    gap:24px;
    max-width:1420px;
    min-height:625px;
}

.hero-copy{
    align-self:center;
}

.hero h1{
    max-width:700px;
    font-size:clamp(56px,5vw,80px);
    line-height:.99;
    letter-spacing:-4.8px;
}

.hero-lead{
    max-width:580px;
    margin-top:27px;
    font-size:18px;
    line-height:1.62;
}


/* ESCENA */

.hero-premium{
    position:relative;
    min-height:610px;
    overflow:visible;
}

.premium-aura{
    position:absolute;
    left:2%;
    top:2%;
    width:105%;
    height:95%;
    border-radius:50%;
    background:
        radial-gradient(circle at 58% 48%,
        rgba(74,151,255,.19),
        rgba(123,188,255,.08) 43%,
        transparent 70%);
    filter:blur(8px);
}

.premium-stage{
    position:absolute;
    width:800px;
    height:590px;
    left:50%;
    top:50%;
    transform:translate(-48%,-50%);
}


/* NOTEBOOK REMISIA */

.premium-laptop{
    position:absolute;
    z-index:2;
    width:650px;
    right:-4px;
    top:92px;
    margin:0;
    animation:premiumEnter .75s ease both;
}

.premium-laptop-shell{
    position:relative;
    padding:10px 10px 13px;
    border-radius:18px 18px 9px 9px;
    background:linear-gradient(145deg,#26313d,#101823);
    box-shadow:
        0 40px 75px rgba(14,42,77,.23),
        0 8px 20px rgba(16,37,65,.14);
}

.premium-camera{
    position:absolute;
    z-index:3;
    top:4px;
    left:50%;
    width:4px;
    height:4px;
    border-radius:50%;
    background:#6d7c8e;
}

.premium-laptop-screen{
    position:relative;
    aspect-ratio:16/9;
    overflow:hidden;
    border-radius:8px;
    background:#e8edf2;
}

.premium-laptop-screen img{
    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
}

.premium-laptop-base{
    position:relative;
    left:-27px;
    width:704px;
    height:15px;
    border-radius:2px 2px 18px 18px;
    background:linear-gradient(#e4e8ed,#a5afba);
    box-shadow:0 12px 19px rgba(17,38,64,.13);
}

.premium-laptop-base:after{
    content:"";
    position:absolute;
    left:50%;
    top:0;
    width:105px;
    height:4px;
    border-radius:0 0 6px 6px;
    background:#adb6c0;
    transform:translateX(-50%);
}


/* TARJETAS PRODUCTO */

.premium-product{
    position:absolute;
    z-index:4;
    width:255px;
    margin:0;
    padding:11px;
    border:1px solid rgba(218,228,240,.92);
    border-radius:19px;
    background:rgba(255,255,255,.97);
    box-shadow:
        0 25px 55px rgba(14,49,91,.17),
        0 5px 14px rgba(14,49,91,.08);
    backdrop-filter:blur(10px);
}

.premium-product figcaption{
    display:grid;
    grid-template-columns:38px 1fr 28px;
    align-items:center;
    gap:9px;
    margin-bottom:9px;
}

.premium-product-icon{
    display:grid;
    place-items:center;
    width:38px;
    height:38px;
    border-radius:10px;
    color:#fff;
    font-size:15px;
    font-weight:800;
}

.stock-icon{
    background:linear-gradient(145deg,#18a868,#087d4d);
}

.barber-icon{
    background:linear-gradient(145deg,#ffbd1e,#ed8d00);
}

.premium-product figcaption div{
    display:flex;
    flex-direction:column;
}

.premium-product figcaption strong{
    color:#14243a;
    font-size:11px;
    letter-spacing:.1px;
}

.premium-product figcaption small{
    margin-top:2px;
    color:#8793a4;
    font-size:7px;
}

.premium-product figcaption>b{
    display:grid;
    place-items:center;
    width:28px;
    height:28px;
    border-radius:50%;
    color:#536276;
    background:#f2f5f9;
    font-size:13px;
}

.premium-product-shot{
    height:125px;
    overflow:hidden;
    border-radius:11px;
    background:#edf2f7;
}

.premium-product-shot img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
}

.premium-stock{
    left:0;
    top:145px;
    animation:premiumEnter .65s .15s ease both;
}

.premium-barber{
    left:-15px;
    top:355px;
    animation:premiumEnter .65s .27s ease both;
}


/* CELULAR */

.premium-phone{
    position:absolute;
    z-index:5;
    right:-16px;
    bottom:19px;
    width:154px;
    height:315px;
    padding:7px;
    border-radius:29px;
    background:linear-gradient(145deg,#26313e,#0c121a);
    box-shadow:
        0 28px 55px rgba(10,31,59,.27),
        0 7px 16px rgba(10,31,59,.15);
    animation:premiumEnter .7s .34s ease both;
}

.premium-phone-speaker{
    position:absolute;
    z-index:4;
    left:50%;
    top:11px;
    width:52px;
    height:13px;
    border-radius:8px;
    background:#0c121a;
    transform:translateX(-50%);
}

.premium-phone-screen{
    width:100%;
    height:100%;
    overflow:hidden;
    border-radius:23px;
    background:#fff;
}

.premium-phone-screen img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:76% center;
}


/* ENTRADA SUAVE */

@keyframes premiumEnter{
    from{
        opacity:0;
        transform:translateY(16px) scale(.985);
    }
    to{
        opacity:1;
        transform:translateY(0) scale(1);
    }
}


/* RESPONSIVE */

@media(max-width:1250px){

    .hero-grid{
        grid-template-columns:.9fr 1.1fr;
    }

    .premium-stage{
        transform:translate(-50%,-50%) scale(.88);
    }
}

@media(max-width:900px){

    .hero{
        padding-top:120px;
    }

    .hero-grid{
        grid-template-columns:1fr;
    }

    .hero-copy{
        max-width:720px;
    }

    .hero-premium{
        min-height:580px;
    }

    .premium-stage{
        transform:translate(-50%,-50%) scale(.88);
    }
}

@media(max-width:600px){

    .hero{
        padding-top:105px;
        padding-bottom:40px;
    }

    .hero h1{
        font-size:48px;
        letter-spacing:-3px;
    }

    .hero-lead{
        font-size:16px;
    }

    .hero-premium{
        min-height:390px;
    }

    .premium-stage{
        transform:translate(-50%,-48%) scale(.57);
    }
}



/* ==========================================================
   HERO FINAL — REAL ASSETS
   Referencia visual aprobada 23/09/2026
   ========================================================== */

.hero{
    overflow:hidden;
    padding-top:118px;
    padding-bottom:42px;
    background:
      radial-gradient(circle at 79% 42%,
        rgba(92,166,255,.23) 0%,
        rgba(172,213,255,.13) 31%,
        rgba(255,255,255,0) 61%),
      linear-gradient(135deg,#fff 0%,#fbfdff 42%,#edf6ff 100%);
}

.hero-grid{
    width:min(1500px,94vw);
    max-width:1500px;
    grid-template-columns: .92fr 1.38fr;
    gap:5px;
    min-height:650px;
}

.hero-copy{
    align-self:center;
    padding-left:8px;
}

.hero h1{
    max-width:670px;
    font-size:clamp(58px,4.75vw,82px);
    line-height:.98;
    letter-spacing:-5px;
}

.hero h1 em{
    white-space:normal;
}

.hero-lead{
    max-width:580px;
    font-size:18px;
    line-height:1.6;
}


/* STAGE */

.hero-final{
    position:relative;
    min-height:650px;
}

.hero-final-aura{
    position:absolute;
    left:-3%;
    top:1%;
    width:110%;
    height:100%;
    border-radius:50%;
    background:
      radial-gradient(circle at 58% 46%,
        rgba(71,151,255,.20),
        rgba(131,192,255,.09) 42%,
        transparent 70%);
    filter:blur(10px);
}

.hero-final-stage{
    position:absolute;
    left:50%;
    top:50%;
    width:900px;
    height:620px;
    transform:translate(-48%,-50%);
}


/* REMISIA NOTEBOOK */

.final-laptop{
    position:absolute;
    z-index:2;
    width:680px;
    right:-2px;
    top:98px;
    margin:0;
    transform:perspective(1500px) rotateY(-3deg) rotateX(1deg);
    transform-origin:center bottom;
    filter:drop-shadow(0 28px 30px rgba(18,52,90,.16));
}

.final-laptop-shell{
    position:relative;
    padding:10px 10px 12px;
    border-radius:20px 20px 9px 9px;
    background:linear-gradient(145deg,#26323f,#0d151f);
    box-shadow:
      0 25px 55px rgba(11,35,66,.20),
      inset 0 0 0 1px rgba(255,255,255,.12);
}

.final-camera{
    position:absolute;
    z-index:4;
    left:50%;
    top:4px;
    width:4px;
    height:4px;
    border-radius:50%;
    background:#758496;
}

.final-laptop-screen{
    aspect-ratio:16/9;
    overflow:hidden;
    border-radius:9px;
    background:#fff;
}

.final-laptop-screen img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
}

.final-laptop-base{
    position:relative;
    left:-31px;
    width:742px;
    height:16px;
    border-radius:2px 2px 19px 19px;
    background:linear-gradient(180deg,#e8ebef,#a2acb7);
    box-shadow:0 12px 18px rgba(16,39,66,.15);
}

.final-laptop-base:after{
    content:"";
    position:absolute;
    left:50%;
    top:0;
    width:110px;
    height:4px;
    transform:translateX(-50%);
    border-radius:0 0 7px 7px;
    background:#aeb7c1;
}


/* CARDS */

.final-card{
    position:absolute;
    z-index:5;
    width:310px;
    margin:0;
    padding:12px;
    border:1px solid rgba(216,228,242,.92);
    border-radius:21px;
    background:rgba(255,255,255,.97);
    box-shadow:
      0 27px 55px rgba(15,49,91,.18),
      0 5px 14px rgba(15,49,91,.08);
    backdrop-filter:blur(12px);
}

.final-card figcaption{
    display:grid;
    grid-template-columns:42px 1fr 31px;
    gap:10px;
    align-items:center;
    margin-bottom:10px;
}

.final-icon{
    display:grid;
    place-items:center;
    width:42px;
    height:42px;
    border-radius:11px;
    color:#fff;
    font-weight:900;
    font-size:15px;
}

.luna-icon{
    background:linear-gradient(145deg,#111827,#334155);
}

.barber-final-icon{
    color:#111827;
    background:linear-gradient(145deg,#ffd45c,#eaa917);
}

.final-card figcaption div{
    display:flex;
    flex-direction:column;
}

.final-card figcaption strong{
    color:#14243a;
    font-size:11px;
    letter-spacing:.15px;
}

.final-card figcaption small{
    margin-top:2px;
    color:#8592a4;
    font-size:7px;
}

.final-card figcaption b{
    display:grid;
    place-items:center;
    width:31px;
    height:31px;
    border-radius:50%;
    color:#526176;
    background:#f1f5f9;
    font-size:14px;
}

.final-card-screen{
    height:160px;
    overflow:hidden;
    border-radius:12px;
    background:#eef2f6;
}

.final-card-screen img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
}


/* LUNA */

.final-luna{
    left:0;
    top:92px;
    transform:rotate(-1deg);
}

.final-luna .final-card-screen img{
    object-position:center 18%;
}


/* BARBERPRO */

.final-barber{
    left:-8px;
    top:354px;
    transform:rotate(.5deg);
}

.final-barber .final-card-screen img{
    object-position:center 30%;
}


/* PHONE */

.final-phone{
    position:absolute;
    z-index:7;
    right:-24px;
    bottom:16px;
    width:177px;
    margin:0;
    transform:
      perspective(1000px)
      rotateY(-5deg)
      rotateZ(1deg);
    filter:drop-shadow(0 24px 28px rgba(10,33,62,.25));
}

.final-phone-shell{
    position:relative;
    padding:7px;
    border-radius:32px;
    background:linear-gradient(145deg,#293541,#080d13);
    box-shadow:
      inset 0 0 0 1px rgba(255,255,255,.22),
      0 8px 18px rgba(12,32,55,.16);
}

.final-phone-screen{
    position:relative;
    aspect-ratio:740/1600;
    overflow:hidden;
    border-radius:26px;
    background:#fff;
}

.final-phone-screen img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
}

.final-phone-island{
    position:absolute;
    z-index:5;
    left:50%;
    top:12px;
    width:54px;
    height:14px;
    border-radius:10px;
    background:#090d12;
    transform:translateX(-50%);
}


/* ENTRADAS */

.final-laptop{
    animation:heroFinalIn .7s ease both;
}

.final-luna{
    animation:heroFinalIn .65s .13s ease both;
}

.final-barber{
    animation:heroFinalIn .65s .23s ease both;
}

.final-phone{
    animation:heroFinalIn .7s .32s ease both;
}

@keyframes heroFinalIn{
    from{
        opacity:0;
        margin-top:15px;
    }
    to{
        opacity:1;
        margin-top:0;
    }
}


/* RESPONSIVE */

@media(max-width:1320px){
    .hero-grid{
        grid-template-columns:.88fr 1.12fr;
    }

    .hero-final-stage{
        transform:translate(-50%,-50%) scale(.87);
    }

    .hero h1{
        font-size:62px;
    }
}

@media(max-width:950px){
    .hero-grid{
        grid-template-columns:1fr;
    }

    .hero-copy{
        max-width:760px;
    }

    .hero-final{
        min-height:600px;
    }

    .hero-final-stage{
        transform:translate(-50%,-50%) scale(.88);
    }
}

@media(max-width:600px){
    .hero{
        padding-top:105px;
    }

    .hero h1{
        font-size:48px;
        letter-spacing:-3px;
    }

    .hero-final{
        min-height:405px;
    }

    .hero-final-stage{
        transform:translate(-50%,-48%) scale(.58);
    }
}



/* ==========================================================
   HERO SHOWCASE INTERACTIVO
   ========================================================== */

.hero-showcase{
    position:relative;
    min-height:650px;
}

.showcase-aura{
    position:absolute;
    inset:0 -7%;
    background:
      radial-gradient(circle at 58% 43%,
        rgba(66,150,255,.20),
        rgba(141,198,255,.09) 43%,
        transparent 70%);
    filter:blur(10px);
}

.showcase-stage{
    position:absolute;
    width:860px;
    height:625px;
    left:50%;
    top:50%;
    transform:translate(-48%,-50%);
}

.showcase-heading{
    position:absolute;
    z-index:8;
    top:26px;
    left:86px;
    display:flex;
    align-items:center;
    gap:9px;
    color:#6d7e94;
    font-size:9px;
    font-weight:800;
    letter-spacing:1.6px;
}

.showcase-heading span{
    width:24px;
    height:2px;
    background:#2580ed;
}


/* NOTEBOOK */

.showcase-laptop{
    position:absolute;
    z-index:2;
    top:75px;
    left:65px;
    width:700px;
    margin:0;
    transform:
      perspective(1600px)
      rotateY(-3deg)
      rotateX(1deg);
    filter:drop-shadow(0 28px 31px rgba(16,47,84,.17));
}

.showcase-laptop-shell{
    position:relative;
    padding:10px 10px 12px;
    border-radius:20px 20px 9px 9px;
    background:linear-gradient(145deg,#273440,#0c141e);
    box-shadow:
      0 25px 55px rgba(11,35,66,.20),
      inset 0 0 0 1px rgba(255,255,255,.12);
}

.showcase-camera{
    position:absolute;
    z-index:4;
    top:4px;
    left:50%;
    width:4px;
    height:4px;
    border-radius:50%;
    background:#748395;
}

.showcase-screen{
    aspect-ratio:16/9;
    overflow:hidden;
    border-radius:9px;
    background:#fff;
}

.showcase-screen img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
    transition:
      opacity .28s ease,
      transform .38s ease;
}

.showcase-screen img.switching{
    opacity:0;
    transform:scale(.985);
}

.showcase-laptop-base{
    position:relative;
    left:-31px;
    width:762px;
    height:16px;
    border-radius:2px 2px 19px 19px;
    background:linear-gradient(#e9edf1,#a4aeba);
    box-shadow:0 12px 18px rgba(16,39,66,.15);
}

.showcase-laptop-base:after{
    content:"";
    position:absolute;
    left:50%;
    top:0;
    width:110px;
    height:4px;
    transform:translateX(-50%);
    border-radius:0 0 7px 7px;
    background:#aeb7c1;
}


/* CELULAR */

.showcase-phone{
    position:absolute;
    z-index:6;
    right:-4px;
    top:188px;
    width:177px;
    margin:0;
    transition:
      opacity .3s ease,
      transform .35s ease;
    transform:
      perspective(1000px)
      rotateY(-5deg)
      rotateZ(1deg);
    filter:drop-shadow(0 24px 28px rgba(10,33,62,.25));
}

.showcase-phone.hidden{
    opacity:0;
    transform:
      translateX(15px)
      perspective(1000px)
      rotateY(-5deg);
    pointer-events:none;
}

.showcase-phone-shell{
    position:relative;
    padding:7px;
    border-radius:32px;
    background:linear-gradient(145deg,#293541,#080d13);
}

.showcase-phone-island{
    position:absolute;
    z-index:5;
    left:50%;
    top:12px;
    width:54px;
    height:14px;
    transform:translateX(-50%);
    border-radius:10px;
    background:#090d12;
}

.showcase-phone-screen{
    aspect-ratio:740/1600;
    overflow:hidden;
    border-radius:26px;
    background:#fff;
}

.showcase-phone-screen img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
    transition:opacity .28s ease;
}


/* SELECTOR */

.showcase-tabs{
    position:absolute;
    z-index:9;
    left:72px;
    bottom:5px;
    width:720px;
    display:grid;
    grid-template-columns:repeat(4,1fr);
    padding:6px;
    border:1px solid rgba(210,224,241,.95);
    border-radius:18px;
    background:rgba(255,255,255,.96);
    box-shadow:0 18px 42px rgba(17,52,92,.14);
    backdrop-filter:blur(12px);
}

.showcase-tab{
    position:relative;
    display:grid;
    grid-template-columns:38px 1fr;
    align-items:center;
    gap:9px;
    min-width:0;
    padding:10px 10px 13px;
    border:0;
    border-right:1px solid #e8eef5;
    border-radius:13px;
    text-align:left;
    background:transparent;
    cursor:pointer;
    transition:background .2s ease;
}

.showcase-tab:last-child{
    border-right:0;
}

.showcase-tab:hover{
    background:#f6f9fd;
}

.showcase-tab.active{
    background:#fffaf0;
}

.tab-icon{
    display:grid;
    place-items:center;
    width:38px;
    height:38px;
    border-radius:10px;
    font-size:14px;
    font-weight:900;
}

.tab-icon.web{
    color:#fff;
    background:#172437;
}

.tab-icon.barber{
    color:#172437;
    background:#f6c54b;
}

.tab-icon.remisia{
    color:#111;
    background:#ffc400;
}

.tab-icon.stock{
    color:#fff;
    background:#15955e;
}

.tab-copy{
    display:flex;
    flex-direction:column;
    min-width:0;
}

.tab-copy strong{
    color:#15263c;
    font-size:9px;
    white-space:nowrap;
}

.tab-copy small{
    margin-top:2px;
    color:#8794a6;
    font-size:7px;
    white-space:nowrap;
}

.showcase-tab i{
    position:absolute;
    left:12px;
    right:12px;
    bottom:4px;
    height:3px;
    overflow:hidden;
    border-radius:4px;
    background:transparent;
}

.showcase-tab.active i{
    background:#e8edf3;
}

.showcase-tab.active i:after{
    content:"";
    display:block;
    width:0;
    height:100%;
    border-radius:inherit;
    background:#2780ed;
    animation:showcaseProgress 5s linear forwards;
}

@keyframes showcaseProgress{
    from{width:0}
    to{width:100%}
}


/* RESPONSIVE */

@media(max-width:1320px){
    .showcase-stage{
        transform:translate(-50%,-50%) scale(.88);
    }
}

@media(max-width:950px){
    .hero-showcase{
        min-height:610px;
    }

    .showcase-stage{
        transform:translate(-50%,-50%) scale(.87);
    }
}

@media(max-width:600px){
    .hero-showcase{
        min-height:420px;
    }

    .showcase-stage{
        transform:translate(-50%,-48%) scale(.56);
    }
}



/* ==========================================================
   SOLUCIONES — GRID PREMIUM 3x2
   ========================================================== */

.solutions-heading{
    margin-bottom:42px;
}

.solutions-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:22px;
}

.solution-card{
    position:relative;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    min-height:560px;
    border:1px solid #e1e8f1;
    border-radius:24px;
    background:#fff;
    box-shadow:0 8px 25px rgba(20,47,79,.045);
    transition:
      transform .28s ease,
      box-shadow .28s ease,
      border-color .28s ease;
}

.solution-card:hover{
    transform:translateY(-6px);
    border-color:transparent;
    box-shadow:0 25px 55px rgba(18,48,85,.12);
}


/* IMAGEN */

.solution-media{
    position:relative;
    height:300px;
    overflow:hidden;
    background:#f1f5f9;
}

.solution-media>img{
    display:block;
}

.solution-category{
    position:absolute;
    z-index:5;
    left:18px;
    top:18px;
    padding:7px 10px;
    border:1px solid rgba(255,255,255,.55);
    border-radius:99px;
    color:#fff;
    background:rgba(13,29,48,.72);
    backdrop-filter:blur(10px);
    font-size:8px;
    font-weight:800;
    letter-spacing:1px;
}


/* CAPTURAS HORIZONTALES */

.media-desktop img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center top;
}


/* CAPTURAS VERTICALES */

.media-mobile{
    display:flex;
    align-items:flex-end;
    justify-content:center;
    background:
      radial-gradient(circle at 50% 45%,rgba(71,151,255,.18),transparent 52%),
      linear-gradient(145deg,#f8fbff,#eaf3ff);
}

.media-mobile .media-glow{
    position:absolute;
    width:260px;
    height:260px;
    border-radius:50%;
    background:rgba(74,151,255,.13);
    filter:blur(18px);
}

.media-mobile>img{
    position:relative;
    z-index:2;
    width:155px;
    height:auto;
    max-height:278px;
    object-fit:contain;
    object-position:bottom;
    border:5px solid #172333;
    border-bottom:0;
    border-radius:23px 23px 0 0;
    box-shadow:0 18px 35px rgba(18,47,82,.20);
}

.reclamos-media{
    background:
      radial-gradient(circle at 50% 45%,rgba(19,163,128,.16),transparent 52%),
      linear-gradient(145deg,#f5fffb,#e8f8f2);
}

.reclamos-media .media-glow{
    background:rgba(28,169,129,.12);
}


/* MEMORIA IA */

.media-square{
    background:#070b12;
}

.media-square img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center;
}


/* CONTROL ACCESO */

.media-portrait{
    background:#07101c;
}

.media-portrait img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center 37%;
}


/* CUERPO */

.solution-body{
    display:flex;
    flex-direction:column;
    flex:1;
    padding:25px 26px 24px;
}

.solution-brand{
    display:flex;
    align-items:center;
    gap:12px;
}

.solution-icon{
    flex:0 0 auto;
    display:grid;
    place-items:center;
    width:43px;
    height:43px;
    border-radius:12px;
    color:#fff;
    background:#246fdd;
    font-size:14px;
    font-weight:900;
}

.solution-brand>div{
    min-width:0;
}

.solution-brand small{
    display:block;
    margin-bottom:2px;
    color:#8793a3;
    font-size:8px;
    font-weight:800;
    letter-spacing:.9px;
}

.solution-brand h3{
    margin:0;
    color:#15263b;
    font-size:20px;
    line-height:1.1;
    letter-spacing:-.5px;
}

.solution-body>p{
    margin:19px 0 24px;
    color:#68778a;
    font-size:13px;
    line-height:1.65;
}

.solution-body>a{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-top:auto;
    padding-top:17px;
    border-top:1px solid #edf1f5;
    color:#172a42;
    font-size:11px;
    font-weight:800;
}

.solution-body>a span{
    color:#287ee8;
    font-size:18px;
    transition:transform .2s ease;
}

.solution-card:hover .solution-body>a span{
    transform:translateX(4px);
}


/* ACENTOS */

.presentia-icon{
    background:linear-gradient(145deg,#1769d1,#22a5ef);
}

.reclamos-icon{
    background:linear-gradient(145deg,#119e77,#0b795c);
}

.bomberos-icon{
    background:linear-gradient(145deg,#e3262e,#a90e16);
}

.recibos-icon{
    background:linear-gradient(145deg,#0876b8,#064c80);
}

.memoria-icon{
    background:linear-gradient(145deg,#5c54e8,#8753d9);
}

.acceso-icon{
    background:linear-gradient(145deg,#1678e7,#744fe0);
}


/* PIE */

.solutions-more{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:30px;
    margin-top:30px;
    padding:20px 4px 0;
}

.solutions-more p{
    margin:0;
    color:#8491a1;
    font-size:12px;
}

.solutions-more a{
    display:flex;
    align-items:center;
    gap:13px;
    color:#1e6ed0;
    font-size:12px;
    font-weight:800;
}

.solutions-more a span{
    font-size:18px;
}


/* RESPONSIVE */

@media(max-width:1050px){
    .solutions-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media(max-width:680px){
    .solutions-grid{
        grid-template-columns:1fr;
    }

    .solution-card{
        min-height:530px;
    }

    .solution-media{
        height:285px;
    }

    .solutions-more{
        align-items:flex-start;
        flex-direction:column;
        gap:10px;
    }
}



/* ==========================================================
   SOLUCIONES — REFINAMIENTO COMPACTO PREMIUM
   ========================================================== */

.solutions-grid{
    gap:18px;
}

.solution-card{
    min-height:0;
    height:500px;
    border-radius:22px;
    box-shadow:0 10px 28px rgba(20,47,79,.06);
}


/* FOTO MÁS INTEGRADA A LA TARJETA */

.solution-media{
    flex:0 0 255px;
    height:255px;
}

.media-desktop img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center top;
}

.media-square img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.media-portrait img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center 32%;
}


/* CELULARES MÁS GRANDES, COMO EN LA REFERENCIA */

.media-mobile>img{
    width:178px;
    max-height:248px;
    border-width:4px;
    border-bottom:0;
    border-radius:22px 22px 0 0;
}

.solution-category{
    left:16px;
    top:15px;
    padding:7px 12px;
    font-size:9px;
    letter-spacing:.7px;
}


/* CONTENIDO MÁS COMPACTO */

.solution-body{
    padding:18px 22px 17px;
}

.solution-brand{
    gap:12px;
}

.solution-icon{
    width:42px;
    height:42px;
    border-radius:11px;
}

.solution-brand small{
    margin-bottom:3px;
    font-size:8px;
    font-weight:700;
    letter-spacing:1px;
}

.solution-brand h3{
    font-size:21px;
    font-weight:650;
    line-height:1.05;
    letter-spacing:-.7px;
}

.solution-body>p{
    margin:13px 0 13px;
    font-size:12.5px;
    line-height:1.5;
}


/* CONOCER SOLUCIÓN: MÁS GRANDE Y FINO */

.solution-body>a{
    margin-top:auto;
    padding-top:12px;
    font-size:13px;
    font-weight:560;
    letter-spacing:-.1px;
}

.solution-body>a span{
    font-size:20px;
    font-weight:400;
}


/* COLORES DE ETIQUETAS MÁS VISUALES */

.solution-presentia .solution-category{
    background:#1478ed;
}

.solution-reclamos .solution-category{
    background:#07996e;
}

.solution-bomberos .solution-category{
    background:#e51c35;
}

.solution-recibos .solution-category{
    background:#1184d6;
}

.solution-memoria .solution-category{
    background:#7254e8;
}

.solution-acceso .solution-category{
    background:#176fd6;
}


/* HOVER MÁS ELEGANTE */

.solution-card:hover{
    transform:translateY(-5px);
    box-shadow:0 22px 48px rgba(18,48,85,.12);
}


/* TABLET */

@media(max-width:1050px){
    .solution-card{
        height:510px;
    }
}


/* MÓVIL */

@media(max-width:680px){

    .solutions-grid{
        gap:18px;
    }

    .solution-card{
        height:auto;
        min-height:490px;
    }

    .solution-media{
        flex-basis:245px;
        height:245px;
    }

    .solution-body{
        min-height:225px;
        padding:18px 20px 17px;
    }

    .solution-brand h3{
        font-size:20px;
    }

    .solution-body>p{
        font-size:13px;
    }

    .solution-body>a{
        font-size:13px;
    }
}



/* ==========================================================
   AJUSTE VISUAL — PRIMERA FILA DE SOLUCIONES
   ========================================================== */


/* PRESENTIA + RECLAMOS
   El celular pasa a ocupar mucho más ancho de la tarjeta */

.solution-presentia .solution-media,
.solution-reclamos .solution-media{
    align-items:flex-start;
    overflow:hidden;
}

.solution-presentia .solution-media>img,
.solution-reclamos .solution-media>img{
    position:absolute;
    z-index:2;

    width:225px;
    max-height:none;
    height:auto;

    top:5px;
    bottom:auto;
    left:50%;

    transform:translateX(-50%);

    border:4px solid #172333;
    border-bottom:0;
    border-radius:25px 25px 0 0;

    box-shadow:0 18px 38px rgba(18,47,82,.22);
}


/* PRESENTIA un poco más protagonista */

.solution-presentia .solution-media>img{
    width:235px;
}


/* RECLAMOS */

.solution-reclamos .solution-media>img{
    width:230px;
}


/* El fondo acompaña al teléfono y elimina sensación de vacío */

.solution-presentia .solution-media{
    background:
      radial-gradient(circle at 50% 50%,
        rgba(68,159,255,.25) 0%,
        rgba(68,159,255,.12) 35%,
        transparent 67%),
      linear-gradient(135deg,#eef7ff 0%,#dcecff 100%);
}

.solution-reclamos .solution-media{
    background:
      radial-gradient(circle at 50% 50%,
        rgba(16,177,139,.22) 0%,
        rgba(16,177,139,.10) 36%,
        transparent 67%),
      linear-gradient(135deg,#effcf8 0%,#dff6ef 100%);
}


/* BOMBEROS
   Mostramos la captura completa en lugar de recortarla */

.solution-bomberos .solution-media{
    display:flex;
    align-items:center;
    justify-content:center;
    background:#f5f7f9;
}

.solution-bomberos .solution-media img{
    width:100%;
    height:100%;
    object-fit:contain;
    object-position:center center;
}


/* Las etiquetas siempre quedan arriba de las capturas */

.solution-presentia .solution-category,
.solution-reclamos .solution-category,
.solution-bomberos .solution-category{
    z-index:10;
}


/* Móvil */

@media(max-width:680px){

    .solution-presentia .solution-media>img{
        width:225px;
    }

    .solution-reclamos .solution-media>img{
        width:220px;
    }

}



/* ==========================================================
   SOLUCIONES — TIPOGRAFÍA PREMIUM
   ========================================================== */

/* Categoría superior del contenido */
.solution-brand small{
    font-family:"Aptos","Segoe UI Variable","Segoe UI",sans-serif;
    font-size:8.5px;
    font-weight:550;
    letter-spacing:1.15px;
    color:#7d8999;
}


/* Nombre principal del sistema */
.solution-brand h3{
    font-family:"Aptos","Segoe UI Variable","Segoe UI",sans-serif;
    font-size:21px;
    font-weight:520;
    line-height:1.08;
    letter-spacing:-.65px;
    color:#10243e;
}


/* Texto descriptivo */
.solution-body>p{
    font-family:"Aptos","Segoe UI Variable","Segoe UI",sans-serif;
    font-size:13px;
    font-weight:350;
    line-height:1.48;
    letter-spacing:-.08px;
    color:#65758a;
}


/* CTA inferior */
.solution-body>a{
    font-family:"Aptos","Segoe UI Variable","Segoe UI",sans-serif;
    font-size:14px;
    font-weight:450;
    letter-spacing:-.25px;
    color:#126fe5;
}

.solution-body>a span{
    font-size:21px;
    font-weight:300;
    color:#126fe5;
}


/* Etiquetas sobre las imágenes */
.solution-category{
    font-family:"Aptos","Segoe UI Variable","Segoe UI",sans-serif;
    font-size:9px;
    font-weight:600;
    letter-spacing:.65px;
}


/* Un poco más de aire entre icono y nombre */
.solution-brand{
    gap:13px;
}


/* Responsive */
@media(max-width:680px){
    .solution-brand h3{
        font-size:20px;
        font-weight:520;
    }

    .solution-body>p{
        font-size:13px;
        font-weight:350;
    }

    .solution-body>a{
        font-size:14px;
        font-weight:450;
    }
}



/* ==========================================================
   SOLUCIONES — AJUSTE FINAL TIPOGRAFÍA + ESPACIADO
   ========================================================== */

/* Un poco más de separación entre filas */
.solutions-grid{
    column-gap:18px;
    row-gap:28px;
}


/* Categoría sobre el nombre */
.solution-brand small{
    font-family:"Aptos","Segoe UI Variable","Segoe UI",sans-serif;
    font-size:8.5px;
    font-weight:500;
    letter-spacing:1.1px;
    color:#7d8999;
}


/* Nombre principal del sistema: más fino y elegante */
.solution-brand h3{
    font-family:"Aptos","Segoe UI Variable","Segoe UI",sans-serif;
    font-size:21px;
    font-weight:500;
    line-height:1.08;
    letter-spacing:-.65px;
    color:#10243e;
}


/* Descripción */
.solution-body>p{
    font-family:"Aptos","Segoe UI Variable","Segoe UI",sans-serif;
    font-size:13px;
    font-weight:350;
    line-height:1.5;
    letter-spacing:-.08px;
    color:#65758a;
}


/* Conocer solución */
.solution-body>a{
    font-family:"Aptos","Segoe UI Variable","Segoe UI",sans-serif;
    font-size:14px;
    font-weight:450;
    letter-spacing:-.25px;
    color:#126fe5;
}

.solution-body>a span{
    font-size:21px;
    font-weight:300;
    color:#126fe5;
}


/* Etiquetas PERSONAL / MUNICIPIOS / etc. */
.solution-category{
    font-family:"Aptos","Segoe UI Variable","Segoe UI",sans-serif;
    font-size:9px;
    font-weight:600;
    letter-spacing:.65px;
}


/* Separación icono / nombre */
.solution-brand{
    gap:13px;
}


@media(max-width:680px){

    .solutions-grid{
        row-gap:24px;
    }

    .solution-brand h3{
        font-size:20px;
        font-weight:500;
    }

    .solution-body>p{
        font-size:13px;
        font-weight:350;
    }

    .solution-body>a{
        font-size:14px;
        font-weight:450;
    }
}



/* ==========================================================
   CHATBOT IA — SHOWCASE PREMIUM V2
   ========================================================== */

.chatbot-showcase-v2{
    position:relative;
    min-height:590px;
}


/* ========================
   TELEFONO
   ======================== */

.chat-phone-v2{
    position:absolute;
    z-index:6;
    left:0;
    top:5px;
    width:265px;
    height:565px;
    overflow:hidden;
    color:#14243a;
    border:7px solid #111a26;
    border-radius:38px;
    background:#efeae2;
    box-shadow:
      0 35px 75px rgba(0,0,0,.38),
      0 0 0 1px rgba(255,255,255,.2);
}

.phone-status{
    height:29px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:0 16px;
    color:#111;
    background:#fff;
    font-size:8px;
}

.phone-status strong{
    font-size:9px;
}

.phone-status span{
    font-size:6px;
}


.phone-chat-header{
    height:57px;
    display:flex;
    align-items:center;
    gap:8px;
    padding:0 10px;
    background:#fff;
    border-bottom:1px solid #eee;
}

.phone-back{
    font-size:25px;
    font-weight:300;
}

.hospital-avatar{
    display:grid;
    place-items:center;
    width:34px;
    height:34px;
    border-radius:50%;
    color:#fff;
    background:linear-gradient(145deg,#0f4ea8,#167af0);
    font-size:24px;
    font-weight:300;
}

.phone-chat-header>div{
    display:flex;
    flex:1;
    flex-direction:column;
}

.phone-chat-header strong{
    font-size:9px;
    font-weight:650;
}

.phone-chat-header small{
    color:#7b8490;
    font-size:6px;
}

.phone-chat-header small b{
    color:#17b96c;
}

.phone-menu{
    font-size:17px;
}


.phone-conversation{
    height:431px;
    overflow:hidden;
    padding:8px;
    background-color:#efeae2;
    background-image:
      radial-gradient(rgba(74,83,78,.08) 1px,transparent 1px);
    background-size:13px 13px;
}

.phone-day{
    width:max-content;
    margin:0 auto 7px;
    padding:3px 9px;
    border-radius:6px;
    color:#778493;
    background:#fff;
    font-size:6px;
}

.wa-out{
    width:max-content;
    margin:0 0 7px auto;
    padding:7px 9px 4px;
    border-radius:8px 3px 8px 8px;
    background:#d9fdd3;
    font-size:8px;
}

.wa-out small{
    margin-left:7px;
    color:#65876b;
    font-size:5px;
}

.wa-in{
    position:relative;
    width:94%;
    padding:10px;
    border-radius:4px 10px 10px 10px;
    background:#fff;
    box-shadow:0 2px 4px rgba(0,0,0,.06);
}

.bot-intro{
    display:flex;
    align-items:center;
    gap:8px;
}

.bot-avatar{
    display:grid;
    place-items:center;
    width:34px;
    height:34px;
    flex:0 0 34px;
    border-radius:50%;
    color:#fff;
    background:linear-gradient(145deg,#086de4,#24b6f0);
    font-size:15px;
}

.bot-intro strong{
    display:block;
    margin-bottom:2px;
    font-size:10px;
}

.bot-intro p{
    margin:0;
    font-size:7px;
    line-height:1.25;
}

.bot-intro p b{
    color:#096ee8;
}

.bot-help{
    margin:8px 0;
    color:#607084;
    font-size:6.5px;
    line-height:1.4;
}

.choose-title{
    display:block;
    margin-bottom:6px;
    font-size:7px;
}

.bot-options{
    display:grid;
    gap:3px;
}

.bot-options span{
    display:flex;
    align-items:center;
    min-height:25px;
    padding:4px 7px;
    border-radius:6px;
    color:#17304e;
    background:#f1f6fc;
    font-size:6.5px;
}

.bot-options b{
    display:grid;
    place-items:center;
    width:17px;
    height:17px;
    margin-right:7px;
    border-radius:50%;
    color:#fff;
    background:#0876ed;
    font-size:6px;
}

.bot-tip{
    display:flex;
    align-items:center;
    gap:6px;
    margin-top:6px;
    padding:6px 8px;
    border-radius:7px;
    color:#0768d2;
    background:#e6f3ff;
    font-size:6px;
}

.wa-time{
    display:block;
    margin-top:3px;
    text-align:right;
    color:#8b949e;
    font-size:5px;
}

.phone-input{
    height:41px;
    display:flex;
    align-items:center;
    gap:6px;
    padding:5px 8px;
    background:#f7f7f7;
}

.phone-input>span{
    font-size:17px;
}

.phone-input div{
    flex:1;
    padding:7px 10px;
    border-radius:99px;
    color:#9aa2ab;
    background:#fff;
    font-size:6px;
}

.phone-input b{
    display:grid;
    place-items:center;
    width:27px;
    height:27px;
    border-radius:50%;
    color:#fff;
    background:#20b86c;
}


/* ========================
   CONEXION
   ======================== */

.chat-sync-badge{
    position:absolute;
    z-index:8;
    left:225px;
    top:38px;
    display:flex;
    align-items:center;
}

.chat-sync-badge span{
    padding:7px 10px;
    border:1px solid #2bdba0;
    border-radius:8px;
    color:#fff;
    background:rgba(22,189,111,.16);
    font-size:6px;
}

.chat-sync-badge i{
    width:45px;
    height:1px;
    background:#29dba5;
}

.chat-sync-badge small{
    margin-left:7px;
    color:#d8ecff;
    font-family:Georgia,serif;
    font-size:7px;
    font-style:italic;
}


/* ========================
   DASHBOARD
   ======================== */

.turnos-dashboard{
    position:absolute;
    z-index:4;
    left:225px;
    top:90px;
    width:545px;
    height:425px;
    display:grid;
    grid-template-columns:112px 1fr;
    overflow:hidden;
    border:1px solid rgba(138,195,239,.55);
    border-radius:18px;
    background:#f5f8fc;
    box-shadow:0 30px 75px rgba(0,0,0,.32);
}


/* SIDEBAR */

.turnos-sidebar{
    position:relative;
    display:flex;
    flex-direction:column;
    padding:17px 10px 12px;
    color:#fff;
    background:
      linear-gradient(180deg,#071c3d,#082b56);
}

.hospital-brand{
    display:flex;
    align-items:center;
    gap:7px;
    padding:0 4px 17px;
}

.hospital-brand>span{
    display:grid;
    place-items:center;
    width:27px;
    height:27px;
    border-radius:8px;
    background:#1877ed;
    font-size:20px;
}

.hospital-brand div{
    display:flex;
    flex-direction:column;
}

.hospital-brand strong{
    font-size:7px;
}

.hospital-brand small{
    color:#a7c2df;
    font-size:6px;
}


.turnos-sidebar nav{
    display:grid;
    gap:5px;
}

.turnos-sidebar nav a{
    display:flex;
    align-items:center;
    gap:8px;
    padding:9px 8px;
    border-radius:7px;
    color:#c9d8e8;
    font-size:7px;
}

.turnos-sidebar nav a span{
    width:14px;
    text-align:center;
    font-size:9px;
}

.turnos-sidebar nav a.active{
    color:#fff;
    background:linear-gradient(135deg,#0871e8,#1b8cff);
    box-shadow:0 7px 16px rgba(0,108,235,.24);
}


.sidebar-foot{
    display:flex;
    align-items:center;
    gap:6px;
    margin-top:auto;
    padding:8px;
    border:1px solid rgba(255,255,255,.08);
    border-radius:8px;
    background:rgba(255,255,255,.04);
}

.sidebar-foot>span{
    display:grid;
    place-items:center;
    width:23px;
    height:23px;
    border-radius:7px;
    background:#1777ee;
    font-size:17px;
}

.sidebar-foot div{
    display:flex;
    flex-direction:column;
}

.sidebar-foot strong{
    font-size:5.5px;
}

.sidebar-foot small{
    color:#8faac5;
    font-size:5px;
}


/* MAIN */

.turnos-main{
    min-width:0;
}

.turnos-topbar{
    height:45px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:0 15px;
    border-bottom:1px solid #e4eaf1;
    background:#fff;
}

.dashboard-search{
    width:210px;
    padding:7px 10px;
    border:1px solid #dbe4ef;
    border-radius:7px;
    color:#8b9aae;
    font-size:6px;
}

.operator{
    display:flex;
    align-items:center;
    gap:6px;
}

.operator>span{
    display:grid;
    place-items:center;
    width:24px;
    height:24px;
    border-radius:50%;
    color:#fff;
    background:#1777ed;
}

.operator div{
    display:flex;
    flex-direction:column;
}

.operator strong{
    color:#17283f;
    font-size:6px;
}

.operator small{
    color:#8a97a7;
    font-size:5px;
}


.dashboard-content{
    padding:14px;
    color:#172940;
}

.dashboard-title{
    display:flex;
    align-items:center;
    justify-content:space-between;
}

.dashboard-title>div{
    display:flex;
    align-items:center;
    gap:8px;
}

.title-icon{
    display:grid;
    place-items:center;
    width:29px;
    height:29px;
    border-radius:8px;
    color:#fff;
    background:#1679ee;
    box-shadow:0 6px 14px rgba(18,118,234,.24);
}

.dashboard-title div div{
    display:flex;
    flex-direction:column;
}

.dashboard-title strong{
    font-size:11px;
}

.dashboard-title small{
    margin-top:2px;
    color:#8594a6;
    font-size:5.5px;
}

.dashboard-title button{
    border:0;
    padding:8px 11px;
    border-radius:7px;
    color:#fff;
    background:#0878ee;
    font-size:6px;
    font-weight:700;
    box-shadow:0 6px 15px rgba(7,120,238,.22);
}


/* STATS */

.turnos-stats{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:7px;
    margin-top:13px;
}

.turnos-stats>div{
    display:flex;
    align-items:center;
    gap:7px;
    min-width:0;
    padding:9px 7px;
    border:1px solid #e6ecf3;
    border-radius:9px;
    background:#fff;
}

.stat-icon{
    display:grid;
    place-items:center;
    width:25px;
    height:25px;
    flex:0 0 25px;
    border-radius:7px;
    font-size:9px;
}

.stat-icon.blue{color:#0874e8;background:#e5f1ff}
.stat-icon.cyan{color:#0789d5;background:#e4f6ff}
.stat-icon.green{color:#0aa675;background:#e1f8ef}
.stat-icon.red{color:#e43e49;background:#ffe8e9}

.turnos-stats p{
    display:flex;
    flex-direction:column;
    margin:0;
}

.turnos-stats strong{
    font-size:11px;
    line-height:1;
}

.turnos-stats small{
    margin-top:2px;
    color:#7f8fa2;
    font-size:5px;
}


/* FILTROS */

.dashboard-filters{
    display:grid;
    grid-template-columns:1.3fr .8fr 1fr auto;
    gap:6px;
    margin-top:10px;
    padding:8px;
    border:1px solid #e7edf4;
    border-radius:9px;
    background:#fff;
}

.dashboard-filters>div{
    display:flex;
    flex-direction:column;
    gap:3px;
}

.dashboard-filters small{
    font-size:5px;
    font-weight:700;
}

.dashboard-filters span{
    padding:6px;
    border:1px solid #dfe6ef;
    border-radius:5px;
    color:#8390a0;
    font-size:5px;
}

.dashboard-filters button{
    align-self:end;
    border:0;
    padding:7px 10px;
    border-radius:5px;
    color:#fff;
    background:#0878ed;
    font-size:5px;
}


/* TABLA */

.turnos-table{
    margin-top:10px;
    overflow:hidden;
    border:1px solid #e3eaf2;
    border-radius:9px;
    background:#fff;
}

.table-heading{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:8px 9px;
}

.table-heading>div{
    display:flex;
    align-items:center;
    gap:5px;
}

.table-heading span{
    color:#0b75e8;
}

.table-heading strong{
    font-size:7px;
}

.table-heading small{
    padding:4px 6px;
    border-radius:5px;
    color:#0873df;
    background:#eaf4ff;
    font-size:5px;
}

.table-header,
.table-row{
    display:grid;
    grid-template-columns:55px 1.5fr 1fr 75px;
    align-items:center;
}

.table-header{
    padding:6px 8px;
    color:#fff;
    background:linear-gradient(90deg,#0877ed,#1489f2);
    font-size:5px;
    font-weight:700;
}

.table-row{
    min-height:27px;
    padding:4px 8px;
    border-bottom:1px solid #edf1f5;
    font-size:5.5px;
}

.table-row:last-child{
    border-bottom:0;
}

.table-row b{
    font-weight:600;
}

.table-row em{
    width:max-content;
    padding:4px 6px;
    border-radius:99px;
    font-size:5px;
    font-style:normal;
}

.table-row em.pending{
    color:#a87406;
    background:#fff2cf;
}

.table-row em.loaded{
    color:#087a58;
    background:#dcf7eb;
}


/* RESPONSIVE */

@media(max-width:1020px){

    .chatbot-showcase-v2{
        width:min(760px,100%);
        min-height:600px;
        margin-inline:auto;
    }

    .turnos-dashboard{
        left:210px;
        width:540px;
    }
}

@media(max-width:760px){

    .chatbot-showcase-v2{
        min-height:870px;
    }

    .chat-phone-v2{
        left:50%;
        transform:translateX(-50%);
    }

    .chat-sync-badge{
        display:none;
    }

    .turnos-dashboard{
        left:50%;
        top:590px;
        width:680px;
        transform:translateX(-50%) scale(.72);
        transform-origin:top center;
    }
}

@media(max-width:480px){

    .chatbot-showcase-v2{
        min-height:830px;
    }

    .chat-phone-v2{
        transform:translateX(-50%) scale(.92);
        transform-origin:top center;
    }

    .turnos-dashboard{
        top:555px;
        transform:translateX(-50%) scale(.56);
    }
}



/* ==========================================================
   CHATBOT V2 — CORRECCION DE COMPOSICION DESKTOP
   ========================================================== */

@media (min-width:1021px){

    /* Mantener texto a la izquierda y producto a la derecha */
    .innovation-grid{
        display:grid !important;
        grid-template-columns:360px minmax(0,1fr) !important;
        column-gap:55px !important;
        align-items:center !important;
    }

    .innovation-copy{
        grid-column:1 !important;
        grid-row:1 !important;
        align-self:center !important;
        position:relative !important;
        z-index:5 !important;
    }

    .chatbot-showcase-v2{
        grid-column:2 !important;
        grid-row:1 !important;

        width:780px !important;
        max-width:none !important;
        height:590px !important;
        min-height:590px !important;

        margin:0 !important;
        position:relative !important;
        align-self:center !important;

        transform:translateY(0) !important;
    }

    /* Teléfono */
    .chatbot-showcase-v2 .chat-phone-v2{
        left:0 !important;
        top:10px !important;
        width:265px !important;
        height:565px !important;
        transform:none !important;
    }

    /* Panel administrativo */
    .chatbot-showcase-v2 .turnos-dashboard{
        left:225px !important;
        top:95px !important;
        width:550px !important;
        height:425px !important;
        transform:none !important;
    }

    /* Conector */
    .chatbot-showcase-v2 .chat-sync-badge{
        left:220px !important;
        top:45px !important;
    }

    /*
       Las tarjetas inferiores de IA siguen ocupando
       el ancho completo debajo del bloque principal.
    */
    .innovation-grid > .ai-products{
        grid-column:1 / -1 !important;
        grid-row:2 !important;
        margin-top:55px !important;
    }
}



/* ==========================================================
   CHATBOT V2 — MAYOR PROTAGONISMO DESKTOP
   ========================================================== */

@media (min-width:1200px){

    /* Damos más espacio al producto */
    .innovation-grid{
        grid-template-columns:340px minmax(0,1fr) !important;
        column-gap:38px !important;
    }

    /* Área completa derecha */
    .chatbot-showcase-v2{
        width:900px !important;
        height:610px !important;
        min-height:610px !important;
        overflow:visible !important;
    }

    /* Teléfono más grande */
    .chatbot-showcase-v2 .chat-phone-v2{
        left:0 !important;
        top:4px !important;

        width:295px !important;
        height:600px !important;

        transform:none !important;
    }

    /* Panel aprovecha el espacio derecho */
    .chatbot-showcase-v2 .turnos-dashboard{
        left:255px !important;
        top:92px !important;

        width:640px !important;
        height:470px !important;

        grid-template-columns:125px 1fr !important;

        transform:none !important;
    }

    /* Conector WhatsApp */
    .chatbot-showcase-v2 .chat-sync-badge{
        left:252px !important;
        top:39px !important;
    }

}


/* Pantallas realmente grandes */
@media (min-width:1500px){

    .innovation-grid{
        grid-template-columns:350px minmax(0,1fr) !important;
        column-gap:42px !important;
    }

    .chatbot-showcase-v2{
        width:940px !important;
    }

    .chatbot-showcase-v2 .turnos-dashboard{
        width:670px !important;
    }

}



/* ==========================================================
   INNOVACION — CHATBOT COMO PROTAGONISTA ÚNICO
   Memoria IA y Control de Acceso ya se muestran en Sistemas
   ========================================================== */

.innovation .ai-products{
    display:none !important;
}

/* Quitamos el espacio que estaba reservado para esas tarjetas */
@media (min-width:1021px){
    .innovation-grid > .ai-products{
        margin-top:0 !important;
    }
}



/* ==========================================================
   DESARROLLOS WEB — SHOWCASE PREMIUM
   ========================================================== */

.web-section .web-grid{
    align-items:center;
    gap:65px;
}

.web-showcase{
    position:relative;
    width:100%;
    max-width:690px;
    margin-left:auto;
}


/* Ventana principal */

.web-showcase-window{
    position:relative;
    height:455px;
    overflow:hidden;
    border:1px solid #dbe5f0;
    border-radius:25px;
    background:#eef4fa;
    box-shadow:
      0 30px 65px rgba(23,54,88,.14),
      0 4px 12px rgba(23,54,88,.05);
}


/*
   La imagen completa contiene texto a la izquierda.
   La desplazamos y agrandamos para que la composición
   notebook + tablet + móvil sea la protagonista.
*/

.web-showcase-window>img{
    position:absolute;
    width:auto;
    max-width:none;
    height:112%;
    top:50%;
    left:45%;
    transform:translate(-45%,-50%);
    object-fit:cover;
}


/* Degradado sutil para integrar la imagen */

.web-showcase-shade{
    position:absolute;
    inset:0;
    pointer-events:none;
    background:
      linear-gradient(
        90deg,
        rgba(244,248,252,.92) 0%,
        rgba(244,248,252,.45) 17%,
        rgba(244,248,252,0) 42%
      );
}


/* Etiqueta propia de nuestra web */

.web-project-label{
    position:absolute;
    z-index:4;
    left:24px;
    bottom:25px;
    display:flex;
    flex-direction:column;
    gap:6px;
}

.web-project-label small{
    color:#1475df;
    font-size:8px;
    font-weight:750;
    letter-spacing:1.4px;
}

.web-project-label strong{
    color:#10253e;
    font-family:"Aptos","Segoe UI Variable","Segoe UI",sans-serif;
    font-size:18px;
    font-weight:520;
    line-height:1.15;
    letter-spacing:-.5px;
}


/* Capacidades */

.web-capabilities{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-wrap:wrap;
    gap:9px;
    margin-top:18px;
}

.web-capabilities span{
    display:flex;
    align-items:center;
    gap:7px;
    padding:9px 12px;
    border:1px solid #e0e7ef;
    border-radius:99px;
    color:#53657a;
    background:#fff;
    box-shadow:0 4px 12px rgba(24,54,86,.035);
    font-size:10px;
    font-weight:500;
}

.web-capabilities i{
    color:#1879e6;
    font-size:10px;
    font-style:normal;
}


/* Desktop grande */

@media(min-width:1400px){

    .web-showcase{
        max-width:720px;
    }

    .web-showcase-window{
        height:470px;
    }
}


/* Tablet */

@media(max-width:1050px){

    .web-section .web-grid{
        gap:45px;
    }

    .web-showcase{
        max-width:650px;
        margin:25px auto 0;
    }

    .web-showcase-window{
        height:420px;
    }
}


/* Móvil */

@media(max-width:680px){

    .web-showcase-window{
        height:330px;
        border-radius:20px;
    }

    .web-showcase-window>img{
        height:105%;
        left:51%;
        transform:translate(-51%,-50%);
    }

    .web-project-label{
        left:18px;
        bottom:18px;
    }

    .web-project-label strong{
        font-size:15px;
    }

    .web-capabilities{
        justify-content:flex-start;
        gap:7px;
    }

    .web-capabilities span{
        padding:8px 10px;
        font-size:9px;
    }
}


/* ==========================================================
   DESARROLLOS WEB — INTEGRACIÓN LIMPIA
   Quita efecto tarjeta-dentro-de-tarjeta
   ========================================================== */

.web-showcase{
    max-width:760px !important;
    margin-left:auto !important;
}

.web-showcase-window{
    height:465px !important;
    overflow:hidden !important;

    /* quitamos la tarjeta exterior */
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
}

/* Agrandamos la imagen para sacar de escena
   gran parte de su columna izquierda y dar protagonismo
   a los dispositivos */

.web-showcase-window > img{
    height:124% !important;
    width:auto !important;
    max-width:none !important;

    top:50% !important;
    left:38% !important;

    transform:translate(-38%,-50%) !important;
}

/* No necesitamos texto encima de la propia composición */

.web-showcase-shade,
.web-project-label{
    display:none !important;
}

/* La imagen ya contiene esta fila,
   así que evitamos mostrarla dos veces */

.web-capabilities{
    display:none !important;
}

@media(min-width:1400px){

    .web-showcase{
        max-width:790px !important;
    }

    .web-showcase-window{
        height:490px !important;
    }
}

@media(max-width:1050px){

    .web-showcase{
        max-width:680px !important;
        margin:25px auto 0 !important;
    }

    .web-showcase-window{
        height:420px !important;
    }
}

@media(max-width:680px){

    .web-showcase-window{
        height:310px !important;
    }

    .web-showcase-window > img{
        height:110% !important;
        left:50% !important;
        transform:translate(-50%,-50%) !important;
    }
}



/* ==========================================================
   DESARROLLOS WEB — DISPOSITIVOS LIMPIOS
   ========================================================== */

.web-section .web-grid{
    align-items:center;
    gap:52px;
}

.web-devices-premium{
    position:relative;
    width:100%;
    max-width:790px;
    margin-left:auto;
    display:flex;
    flex-direction:column;
    align-items:center;
}

/* Sin tarjeta, sin fondo, sin borde */
.web-devices-image{
    display:block;
    width:100%;
    height:auto;
    max-width:none;
    object-fit:contain;
    background:transparent;
    border:0;
    border-radius:0;
    box-shadow:none;
    filter:none;
}

/* Servicios debajo */
.web-services-row{
    display:flex;
    justify-content:center;
    align-items:center;
    flex-wrap:wrap;
    gap:0;
    margin-top:8px;
    padding:11px 20px;
    border:1px solid #e2e9f1;
    border-radius:999px;
    background:rgba(255,255,255,.72);
    box-shadow:0 8px 25px rgba(27,55,87,.04);
}

.web-services-row span{
    position:relative;
    padding:0 20px;
    color:#52657b;
    font-size:10px;
    font-weight:550;
    white-space:nowrap;
}

.web-services-row span + span:before{
    content:"";
    position:absolute;
    left:0;
    top:50%;
    width:1px;
    height:13px;
    background:#d9e2ec;
    transform:translateY(-50%);
}

@media(min-width:1200px){

    .web-section .web-grid{
        grid-template-columns:390px minmax(0,1fr);
        column-gap:55px;
    }

    .web-devices-premium{
        width:760px;
    }
}

@media(min-width:1500px){

    .web-section .web-grid{
        grid-template-columns:400px minmax(0,1fr);
        column-gap:65px;
    }

    .web-devices-premium{
        width:820px;
    }
}

@media(max-width:1050px){

    .web-devices-premium{
        max-width:720px;
        margin:35px auto 0;
    }
}

@media(max-width:680px){

    .web-devices-premium{
        width:110%;
        margin-left:-5%;
    }

    .web-services-row{
        width:91%;
        gap:7px;
        padding:9px;
        border-radius:18px;
    }

    .web-services-row span{
        padding:5px 9px;
        font-size:9px;
    }

    .web-services-row span + span:before{
        display:none;
    }
}


/* DESARROLLOS WEB — ajuste final de tamaño */
@media (min-width:1200px){

    .web-section .web-grid{
        grid-template-columns:390px minmax(0,1fr) !important;
        column-gap:42px !important;
    }

    .web-devices-premium{
        width:830px !important;
        max-width:none !important;
    }
}

@media (min-width:1500px){

    .web-devices-premium{
        width:880px !important;
    }
}



/* ==========================================================
   SOLUCIONES — TERCERA FILA
   REMISIA / STOCKIA / BARBERPRO
   ========================================================== */

/* REMISIA Y STOCKIA: capturas panorámicas */

.solution-remisia .solution-media img,
.solution-stockia .solution-media img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center top;
}

/* REMISIA: mapa como protagonista */
.solution-remisia .solution-media img{
    object-position:50% 18%;
}

/* STOCKIA: productos + menú lateral */
.solution-stockia .solution-media img{
    object-position:50% 12%;
}


/* BARBERPRO: captura móvil.
   No la estiramos horizontalmente. */

.solution-barberpro .solution-media{
    position:relative;
    overflow:hidden;
    background:
      radial-gradient(circle at 50% 42%, #24333d 0%, #14242e 48%, #0c1921 100%);
}

.solution-barberpro .solution-media:before{
    content:"";
    position:absolute;
    inset:0;
    background:
      radial-gradient(circle at 50% 70%, rgba(226,180,77,.15), transparent 48%);
    pointer-events:none;
}

.solution-barberpro .solution-media img{
    position:relative;
    z-index:1;
    display:block;
    width:auto;
    height:118%;
    max-width:none;
    margin:0 auto;
    object-fit:contain;
    object-position:center top;
    transform:translateY(-2%);
    filter:drop-shadow(0 14px 22px rgba(0,0,0,.18));
}

.solution-barberpro .solution-category{
    z-index:3;
}


/* Íconos */

.remisia-icon{
    background:#f7c51e !important;
    color:#17212a !important;
}

.stockia-icon{
    background:#12634d !important;
    color:#fff !important;
}

.barberpro-icon{
    background:#d9aa43 !important;
    color:#14232d !important;
}


/* Un poco más de aire entre segunda y tercera fila */

.solutions-grid{
    row-gap:34px;
}



/* Colores tercera fila de sistemas */

.solutions-grid .solution-card.solution-remisia .solution-category {
    background: #f7c51e !important;
    color: #17212a !important;
    border-color: #f7c51e !important;
}

.solutions-grid .solution-card.solution-remisia .solution-icon {
    background: #f7c51e !important;
    color: #17212a !important;
}

.solutions-grid .solution-card.solution-stockia .solution-category {
    background: #128566 !important;
    color: #ffffff !important;
    border-color: #128566 !important;
}

.solutions-grid .solution-card.solution-stockia .solution-icon {
    background: #128566 !important;
    color: #ffffff !important;
}

.solutions-grid .solution-card.solution-barberpro .solution-category {
    background: #d9aa35 !important;
    color: #17212a !important;
    border-color: #d9aa35 !important;
}

.solutions-grid .solution-card.solution-barberpro .solution-icon {
    background: #d9aa35 !important;
    color: #17212a !important;
}

/* Fotografía - sección Experiencia */
.portrait-card .portrait-photo {
    position: absolute;
    inset: 0;
    z-index: 1;
    overflow: hidden;
}

.portrait-card .portrait-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    display: block;
}

.portrait-card .portrait-photo::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(
            180deg,
            rgba(5, 28, 58, .03) 35%,
            rgba(5, 28, 58, .25) 67%,
            rgba(5, 28, 58, .88) 100%
        );
    pointer-events: none;
}

.portrait-card .portrait-label {
    position: absolute;
    z-index: 3;
}

/* Foto Rodrigo - Experiencia */
.portrait-card .portrait-photo {
    position: absolute;
    inset: 0;
    z-index: 1;
    overflow: hidden;
}

.portrait-card .portrait-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    display: block;
}

.portrait-card .portrait-photo::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(5,28,58,.02) 35%,
        rgba(5,28,58,.20) 65%,
        rgba(5,28,58,.88) 100%
    );
}

.portrait-card .portrait-label {
    position: absolute;
    z-index: 3;
}

/* Rodrigo Perez - fotografia en Experiencia */
.portrait-card {
    position: relative;
    overflow: hidden;
}

.portrait-card .portrait-initials {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    font-size: 0 !important;
    background-image: url('/assets/img/experiencia/rodrigo-perfil.png') !important;
    background-size: cover !important;
    background-position: center top !important;
    background-repeat: no-repeat !important;
    opacity: 1 !important;
}

.portrait-card .portrait-initials::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(5,25,52,0) 45%,
        rgba(5,25,52,.18) 65%,
        rgba(5,25,52,.90) 100%
    );
}

.portrait-card .portrait-label {
    position: absolute !important;
    z-index: 5 !important;
}

/* AJUSTE FINAL FOTO EXPERIENCIA */
.experience .portrait-card {
    position: relative !important;
    overflow: hidden !important;
}

.experience .portrait-card .portrait-initials {
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;

    width: auto !important;
    height: auto !important;
    max-width: none !important;
    max-height: none !important;

    transform: none !important;
    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    border-radius: 0 !important;

    font-size: 0 !important;

    background-image: url('/assets/img/experiencia/rodrigo-perfil.png') !important;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;

    opacity: 1 !important;
    z-index: 1 !important;
}

.experience .portrait-card .portrait-initials::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    background: linear-gradient(
        to bottom,
        rgba(4,24,50,0) 45%,
        rgba(4,24,50,.20) 65%,
        rgba(4,24,50,.92) 100%
    ) !important;
}

.experience .portrait-card .portrait-label {
    position: absolute !important;
    left: 28px !important;
    right: 28px !important;
    bottom: 27px !important;
    z-index: 10 !important;
}

/* =========================================================
   CONTACTO WHATSAPP — PREMIUM
   ========================================================= */

.contact-actions{
    width:100%;
    max-width:470px;
    justify-self:end;
}

.whatsapp-button{
    position:relative;
    display:grid;
    grid-template-columns:58px 1fr 42px;
    align-items:center;
    gap:17px;
    min-height:104px;
    padding:20px 22px;
    border:1px solid rgba(255,255,255,.85);
    border-radius:20px;
    color:#0b2346;
    background:
        radial-gradient(circle at 88% 20%,rgba(37,211,102,.10),transparent 28%),
        #ffffff;
    box-shadow:
        0 20px 45px rgba(0,0,0,.18),
        inset 0 1px 0 rgba(255,255,255,.9);
    transition:transform .25s ease,box-shadow .25s ease;
    overflow:hidden;
}

.whatsapp-button:hover{
    transform:translateY(-4px);
    box-shadow:0 26px 55px rgba(0,0,0,.23);
}

/* Icono WhatsApp */
.whatsapp-button>span{
    position:relative;
    width:58px;
    height:58px;
    display:grid;
    place-items:center;
    border-radius:18px;
    font-size:0;
    background:linear-gradient(145deg,#2bd675,#18ad5b);
    box-shadow:0 10px 24px rgba(30,190,103,.28);
}

.whatsapp-button>span::before{
    content:"";
    width:25px;
    height:25px;
    border:3px solid #fff;
    border-radius:50%;
    box-sizing:border-box;
}

.whatsapp-button>span::after{
    content:"";
    position:absolute;
    left:17px;
    bottom:14px;
    width:8px;
    height:8px;
    border-left:3px solid #fff;
    transform:rotate(-25deg);
}

/* Textos */
.whatsapp-button>div{
    display:flex;
    flex-direction:column;
    justify-content:center;
    gap:4px;
}

.whatsapp-button small{
    color:#159b59;
    font-size:12px;
    line-height:1.2;
    font-weight:700;
    letter-spacing:.15px;
}

.whatsapp-button small::before{
    content:"Hablemos de tu proyecto";
    display:block;
    margin-bottom:5px;
    color:#718097;
    font-size:10px;
    font-weight:600;
    text-transform:uppercase;
    letter-spacing:1px;
}

.whatsapp-button strong{
    color:#0a2347;
    font-size:22px;
    line-height:1.1;
    letter-spacing:-.5px;
}

/* Flecha */
.whatsapp-button>i{
    display:grid;
    place-items:center;
    width:40px;
    height:40px;
    border-radius:50%;
    color:#fff;
    background:#1f70e8;
    font-size:16px;
    font-style:normal;
    transition:transform .2s ease;
}

.whatsapp-button:hover>i{
    transform:translate(2px,-2px);
}

/* Texto inferior */
.contact-actions>p{
    margin:13px 0 0;
    text-align:center;
    color:#a9bad0;
    font-size:11px;
    line-height:1.4;
    font-weight:500;
    letter-spacing:.15px;
}

@media(max-width:760px){
    .contact-actions{
        max-width:none;
        justify-self:stretch;
    }

    .whatsapp-button{
        grid-template-columns:52px 1fr 36px;
        gap:13px;
        min-height:94px;
        padding:17px;
    }

    .whatsapp-button>span{
        width:52px;
        height:52px;
        border-radius:16px;
    }

    .whatsapp-button strong{
        font-size:19px;
    }

    .whatsapp-button>i{
        width:35px;
        height:35px;
    }
}


/* WhatsApp — icono real */
.whatsapp-button>span::before{
    content:"" !important;
    width:30px !important;
    height:30px !important;
    border:0 !important;
    border-radius:0 !important;
    background-color:#fff !important;
    -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M380.9 97.1C339 55.1 283.2 32 223.9 32c-122.4 0-222 99.6-222 222 0 39.1 10.2 77.3 29.6 111L0 480l117.7-30.9c32.4 17.7 68.9 27 106.1 27h.1c122.3 0 224.1-99.6 224.1-222 0-59.3-25.2-115-67.1-157zm-157 341.6c-33.2 0-65.7-8.9-94-25.8l-6.7-4-69.8 18.3L72 359.2l-4.4-7c-18.5-29.4-28.2-63.4-28.2-98.2 0-101.7 82.8-184.5 184.6-184.5 49.3 0 95.6 19.2 130.4 54.1 34.8 34.9 56.2 81.2 56.1 130.5 0 101.8-84.9 184.6-186.6 184.6zm101.2-138.2c-5.5-2.8-32.8-16.1-37.9-18-5.1-1.9-8.8-2.8-12.5 2.8-3.7 5.6-14.3 18-17.6 21.8-3.2 3.7-6.5 4.2-12 1.4-32.6-16.3-54-29.1-75.6-66-5.7-9.8 5.7-9.1 16.3-30.3 1.8-3.7.9-6.9-.5-9.7-1.4-2.8-12.5-30.1-17.1-41.2-4.5-10.8-9.1-9.3-12.5-9.5-3.2-.2-6.9-.2-10.6-.2-3.7 0-9.7 1.4-14.8 6.9-5.1 5.6-19.4 19-19.4 46.3 0 27.3 19.9 53.7 22.6 57.4 2.8 3.7 39.1 59.7 94.8 83.8 35.2 15.2 49 16.5 66.6 13.9 10.7-1.6 32.8-13.4 37.4-26.4 4.6-13 4.6-24.1 3.2-26.4-1.3-2.5-5-3.9-10.5-6.6z'/%3E%3C/svg%3E") center/contain no-repeat !important;
    mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M380.9 97.1C339 55.1 283.2 32 223.9 32c-122.4 0-222 99.6-222 222 0 39.1 10.2 77.3 29.6 111L0 480l117.7-30.9c32.4 17.7 68.9 27 106.1 27h.1c122.3 0 224.1-99.6 224.1-222 0-59.3-25.2-115-67.1-157zm-157 341.6c-33.2 0-65.7-8.9-94-25.8l-6.7-4-69.8 18.3L72 359.2l-4.4-7c-18.5-29.4-28.2-63.4-28.2-98.2 0-101.7 82.8-184.5 184.6-184.5 49.3 0 95.6 19.2 130.4 54.1 34.8 34.9 56.2 81.2 56.1 130.5 0 101.8-84.9 184.6-186.6 184.6zm101.2-138.2c-5.5-2.8-32.8-16.1-37.9-18-5.1-1.9-8.8-2.8-12.5 2.8-3.7 5.6-14.3 18-17.6 21.8-3.2 3.7-6.5 4.2-12 1.4-32.6-16.3-54-29.1-75.6-66-5.7-9.8 5.7-9.1 16.3-30.3 1.8-3.7.9-6.9-.5-9.7-1.4-2.8-12.5-30.1-17.1-41.2-4.5-10.8-9.1-9.3-12.5-9.5-3.2-.2-6.9-.2-10.6-.2-3.7 0-9.7 1.4-14.8 6.9-5.1 5.6-19.4 19-19.4 46.3 0 27.3 19.9 53.7 22.6 57.4 2.8 3.7 39.1 59.7 94.8 83.8 35.2 15.2 49 16.5 66.6 13.9 10.7-1.6 32.8-13.4 37.4-26.4 4.6-13 4.6-24.1 3.2-26.4-1.3-2.5-5-3.9-10.5-6.6z'/%3E%3C/svg%3E") center/contain no-repeat !important;
}

.whatsapp-button>span::after{
    display:none !important;
}


/* =========================================================
   ASISTENTE SO — FLUJO COMERCIAL
   ========================================================= */

.assistant-flow-options{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px;
    margin-top:12px;
}

.assistant-flow-options button{
    min-height:54px;
    display:flex;
    align-items:center;
    gap:9px;
    padding:10px 11px;
    border:1px solid #dce7f5;
    border-radius:12px;
    background:#fff;
    color:#102a4f;
    text-align:left;
    cursor:pointer;
    transition:.2s ease;
}

.assistant-flow-options button:hover{
    transform:translateY(-2px);
    border-color:#8eb9f5;
    box-shadow:0 7px 18px rgba(18,67,125,.09);
}

.assistant-flow-options button span{
    flex:0 0 28px;
    width:28px;
    height:28px;
    display:grid;
    place-items:center;
    border-radius:8px;
    background:#edf5ff;
    color:#2474df;
    font-size:13px;
    font-weight:800;
}

.assistant-flow-options button b{
    font-size:11px;
    line-height:1.2;
}

.assistant-result-card{
    display:grid;
    grid-template-columns:34px 1fr;
    gap:11px;
    margin-top:12px;
    padding:14px;
    border:1px solid #dbe8f7;
    border-radius:14px;
    background:linear-gradient(145deg,#f8fbff,#fff);
}

.assistant-result-check{
    width:34px;
    height:34px;
    display:grid;
    place-items:center;
    border-radius:10px;
    background:#e7f8ef;
    color:#13a45b;
    font-weight:900;
}

.assistant-result-card small{
    display:block;
    margin-bottom:3px;
    color:#2474df;
    font-size:8px;
    font-weight:800;
    letter-spacing:.8px;
}

.assistant-result-card b{
    display:block;
    color:#0b2448;
    font-size:15px;
}

.assistant-result-card p{
    margin:5px 0 8px;
    color:#61738b;
    font-size:10px;
    line-height:1.45;
}

.assistant-see{
    color:#176bd6;
    font-size:10px;
    font-weight:800;
}

.assistant-restart{
    margin-top:9px;
    padding:0;
    border:0;
    background:transparent;
    color:#718198;
    font-size:9px;
    font-weight:700;
    cursor:pointer;
}

@media(max-width:480px){
    .assistant-flow-options{
        grid-template-columns:1fr;
    }
}


/* =========================================================
   ASISTENTE SO — PREMIUM V2
   ========================================================= */

.assistant-panel{
    width:min(410px,calc(100vw - 32px)) !important;
}

.assistant-head{
    padding:18px 20px !important;
}

.assistant-head b{
    font-size:14px !important;
    font-weight:700 !important;
    letter-spacing:-.15px;
}

.assistant-head small{
    margin-top:2px;
    font-size:10px !important;
}

.assistant-body{
    min-height:330px !important;
    padding:20px !important;
}

.bot-message,
.assistant-answer p{
    width:100% !important;
    padding:14px 15px !important;
    border-radius:8px 15px 15px 15px !important;
    color:#263b56 !important;
    font-size:13px !important;
    line-height:1.5 !important;
}

.quick-replies{
    display:grid !important;
    grid-template-columns:1fr 1fr;
    gap:8px !important;
    margin-top:13px;
}

.quick-replies button{
    min-height:48px;
    padding:10px 12px !important;
    border:1px solid #dbe5f2 !important;
    border-radius:11px !important;
    color:#244b7c !important;
    background:#fff !important;
    font-size:11px !important;
    font-weight:650;
    line-height:1.25;
    text-align:left;
    transition:.2s ease;
}

.quick-replies button:hover,
.quick-replies button.active{
    color:#fff !important;
    border-color:#2474df !important;
    background:#2474df !important;
    box-shadow:0 7px 18px rgba(36,116,223,.18);
    transform:translateY(-1px);
}

.assistant-answer{
    margin-top:12px;
}

.assistant-answer p{
    margin-bottom:8px !important;
    border:1px solid #e0e9f5;
    background:linear-gradient(145deg,#f8fbff,#fff) !important;
    box-shadow:none !important;
}

.assistant-answer strong{
    display:block;
    margin-bottom:4px;
    color:#0d2d57;
    font-size:14px;
}

.assistant-compose{
    display:flex;
    gap:7px;
    margin-top:11px;
}

.assistant-compose input{
    min-width:0;
    flex:1;
    height:43px;
    padding:0 13px;
    border:1px solid #d7e2ef;
    border-radius:11px;
    outline:none;
    color:#183453;
    background:#fff;
    font:500 12px/1.2 "Aptos","Segoe UI Variable","Segoe UI",sans-serif;
}

.assistant-compose input:focus{
    border-color:#5598ee;
    box-shadow:0 0 0 3px rgba(55,128,225,.10);
}

.assistant-compose button{
    width:43px;
    height:43px;
    flex:0 0 43px;
    border:0;
    border-radius:11px;
    color:#fff;
    background:#2474df;
    font-size:18px;
    cursor:pointer;
    box-shadow:0 7px 17px rgba(36,116,223,.22);
}

.assistant-hint{
    display:block;
    margin-top:7px;
    color:#7b8ba0;
    font-size:9px;
    line-height:1.35;
}

.assistant-wa{
    padding:15px !important;
    font-size:12px !important;
    font-weight:750 !important;
}

@media(max-width:480px){
    .assistant-panel{
        width:calc(100vw - 24px) !important;
        right:12px !important;
    }

    .quick-replies{
        grid-template-columns:1fr 1fr !important;
    }
}


/* ==========================================================
   ASISTENTE SO — INPUT + CTA WHATSAPP PREMIUM
   ========================================================== */

.assistant-compose{
    gap:9px!important;
    margin-top:14px!important;
}

.assistant-compose input{
    height:48px!important;
    padding:0 15px!important;
    border:1px solid #d8e3f0!important;
    border-radius:13px!important;
    background:#fff!important;
    font-size:12px!important;
    box-shadow:0 3px 10px rgba(15,45,80,.04)!important;
}

.assistant-compose input:focus{
    border-color:#2474df!important;
    box-shadow:0 0 0 3px rgba(36,116,223,.10)!important;
}

/* Botón enviar */
.assistant-compose button{
    position:relative;
    width:48px!important;
    height:48px!important;
    flex:0 0 48px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    border:0!important;
    border-radius:13px!important;
    color:transparent!important;
    background:linear-gradient(135deg,#3185ee,#1768d2)!important;
    box-shadow:0 8px 18px rgba(36,116,223,.24)!important;
    cursor:pointer;
    transition:transform .2s ease,box-shadow .2s ease!important;
}

.assistant-compose button::before{
    content:"";
    width:18px;
    height:18px;
    display:block;
    background:center/contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m22 2-7 20-4-9-9-4Z'/%3E%3Cpath d='M22 2 11 13'/%3E%3C/svg%3E");
}

.assistant-compose button:hover{
    transform:translateY(-2px)!important;
    box-shadow:0 11px 23px rgba(36,116,223,.32)!important;
}

/* CTA WhatsApp */
.assistant-wa{
    position:relative!important;
    min-height:72px!important;
    padding:13px 54px 13px 66px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    justify-content:center!important;
    gap:2px!important;
    overflow:hidden!important;
    color:#fff!important;
    background:linear-gradient(135deg,#16b965,#22c875)!important;
    border-top:1px solid rgba(255,255,255,.22)!important;
    font-size:0!important;
    text-align:left!important;
    text-decoration:none!important;
    box-shadow:0 -5px 18px rgba(20,175,95,.10)!important;
    transition:filter .2s ease!important;
}

.assistant-wa::before{
    content:"";
    position:absolute;
    left:17px;
    top:50%;
    width:36px;
    height:36px;
    transform:translateY(-50%);
    border-radius:50%;
    background:
      center/20px 20px no-repeat
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath fill='white' d='M16.04 3C8.84 3 3 8.72 3 15.78c0 2.48.72 4.79 1.97 6.74L3.68 29l6.72-1.75a13.2 13.2 0 0 0 5.64 1.27C23.24 28.52 29 22.8 29 15.78S23.24 3 16.04 3Zm0 23.36c-1.86 0-3.6-.5-5.1-1.38l-.36-.21-3.98 1.04.84-3.88-.24-.39a10.48 10.48 0 0 1-1.64-5.76c0-5.87 4.7-10.63 10.48-10.63 5.79 0 10.49 4.76 10.49 10.63 0 5.86-4.7 10.58-10.49 10.58Zm5.75-7.95c-.31-.15-1.86-.9-2.15-1-.29-.1-.5-.15-.71.15-.21.31-.81 1-.99 1.2-.18.21-.37.23-.68.08-.31-.16-1.32-.48-2.51-1.52a9.42 9.42 0 0 1-1.74-2.13c-.18-.31-.02-.47.14-.62.14-.14.31-.36.47-.54.15-.18.2-.31.31-.51.1-.21.05-.39-.03-.54-.08-.16-.71-1.68-.97-2.3-.26-.62-.52-.53-.71-.54h-.61c-.21 0-.55.08-.84.39-.29.31-1.1 1.06-1.1 2.58s1.13 2.99 1.29 3.2c.15.2 2.22 3.33 5.38 4.67.75.32 1.34.51 1.8.65.75.23 1.44.2 1.98.12.6-.09 1.86-.75 2.12-1.47.26-.72.26-1.34.18-1.47-.08-.13-.29-.2-.6-.36Z'/%3E%3C/svg%3E"),
      rgba(255,255,255,.15);
    box-shadow:0 0 0 0 rgba(255,255,255,.28);
    animation:assistantWaPulse 2.4s ease-out infinite;
}

.assistant-wa::after{
    content:"›";
    position:absolute;
    right:20px;
    top:50%;
    transform:translateY(-52%);
    color:#fff;
    font-size:28px;
    font-weight:300;
    line-height:1;
}

.assistant-wa span{
    display:block;
}

.assistant-wa:hover{
    filter:brightness(1.045);
}

@keyframes assistantWaPulse{
    0%{box-shadow:0 0 0 0 rgba(255,255,255,.32);}
    55%{box-shadow:0 0 0 8px rgba(255,255,255,0);}
    100%{box-shadow:0 0 0 0 rgba(255,255,255,0);}
}

@media (prefers-reduced-motion:reduce){
    .assistant-wa::before{animation:none!important;}
}


/* Asistente — derivación personal */
.assistant-human-help{
    display:block;
    margin-top:12px;
    padding:11px 12px;
    border-radius:10px;
    background:#eef7ff;
    border:1px solid #d4e8fb;
    color:#34516f;
    font-size:11px;
    line-height:1.45;
}

.assistant-human-help strong{
    display:block;
    margin-bottom:4px;
    color:#123d70;
    font-size:11px;
    font-weight:750;
}

.assistant-human-help small{
    display:block;
    margin-top:7px;
    color:#168d54;
    font-size:9px;
    font-weight:700;
}


/* ==========================================================
   INNOVACIÓN — ECOSISTEMA DE AUTOMATIZACIÓN V3
   ========================================================== */

.automation-ecosystem{
    position:relative;
    width:100%;
    height:610px;
    min-width:0;
}

.automation-aura{
    position:absolute;
    z-index:0;
    width:650px;
    height:500px;
    right:0;
    top:35px;
    border-radius:50%;
    background:
      radial-gradient(circle,
        rgba(21,142,242,.23) 0%,
        rgba(20,119,225,.10) 38%,
        rgba(12,78,151,0) 72%);
    filter:blur(5px);
    pointer-events:none;
}


/* Estado superior */

.automation-live{
    position:absolute;
    z-index:8;
    top:22px;
    left:205px;
    display:flex;
    align-items:center;
    gap:8px;
    padding:8px 13px;
    border:1px solid rgba(116,205,255,.25);
    border-radius:999px;
    color:#d9f4ff;
    background:rgba(8,49,94,.72);
    box-shadow:0 8px 25px rgba(0,0,0,.12);
    backdrop-filter:blur(10px);
    font-size:8px;
    font-weight:700;
    letter-spacing:.8px;
}

.automation-live i{
    width:7px;
    height:7px;
    border-radius:50%;
    background:#28d88d;
    box-shadow:0 0 0 5px rgba(40,216,141,.10);
}


/* Dashboard principal */

.automation-dashboard{
    position:absolute;
    z-index:2;
    top:78px;
    right:5px;
    width:680px;
    height:455px;
    overflow:hidden;
    border:1px solid rgba(187,224,255,.28);
    border-radius:22px;
    background:#f4f8fc;
    box-shadow:
      0 35px 70px rgba(0,13,35,.38),
      0 0 0 1px rgba(255,255,255,.06);
}

.auto-window-bar{
    height:54px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:0 18px;
    border-bottom:1px solid #e1e9f2;
    background:#fff;
}

.auto-window-brand{
    display:flex;
    align-items:center;
    gap:9px;
}

.auto-window-brand>span{
    width:29px;
    height:29px;
    display:grid;
    place-items:center;
    border-radius:8px;
    color:#fff;
    background:linear-gradient(145deg,#1177e8,#25a7ef);
    font-size:8px;
    font-weight:800;
}

.auto-window-brand div{
    display:flex;
    flex-direction:column;
}

.auto-window-brand strong{
    color:#16324f;
    font-size:10px;
}

.auto-window-brand small{
    margin-top:1px;
    color:#8190a0;
    font-size:6px;
}

.auto-window-status{
    display:flex;
    align-items:center;
    gap:6px;
    color:#607489;
    font-size:7px;
}

.auto-window-status i{
    width:6px;
    height:6px;
    border-radius:50%;
    background:#20c979;
}

.auto-dashboard-body{
    height:calc(100% - 54px);
    display:grid;
    grid-template-columns:56px 1fr;
}


/* Sidebar */

.auto-sidebar{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:13px;
    padding:15px 0 12px;
    background:linear-gradient(180deg,#082d59,#062448);
}

.auto-side-logo{
    width:28px;
    height:28px;
    display:grid;
    place-items:center;
    margin-bottom:4px;
    border-radius:8px;
    color:#fff;
    background:#147cec;
    font-size:17px;
    font-weight:300;
}

.auto-sidebar>span{
    width:29px;
    height:29px;
    display:grid;
    place-items:center;
    border-radius:8px;
    color:#7798ba;
    font-size:10px;
}

.auto-sidebar>span.active{
    color:#fff;
    background:#1679e6;
}

.auto-side-bottom{
    width:27px;
    height:27px;
    display:grid;
    place-items:center;
    margin-top:auto;
    border:1px solid rgba(255,255,255,.15);
    border-radius:50%;
    color:#92abc4;
    font-size:6px;
    font-weight:800;
}


/* Área principal */

.auto-main{
    padding:18px 20px;
    color:#18324e;
}

.auto-top{
    display:flex;
    align-items:center;
    justify-content:space-between;
}

.auto-top small{
    color:#8a9bad;
    font-size:6px;
    font-weight:750;
    letter-spacing:.8px;
}

.auto-top h3{
    margin:3px 0 0;
    color:#122e4c;
    font-size:17px;
    font-weight:650;
    letter-spacing:-.4px;
}

.auto-top button{
    border:0;
    border-radius:8px;
    padding:9px 13px;
    color:#fff;
    background:#1479e8;
    box-shadow:0 6px 15px rgba(20,121,232,.20);
    font-size:7px;
    font-weight:700;
}

.auto-stats{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:9px;
    margin-top:15px;
}

.auto-stats>div{
    min-height:61px;
    display:flex;
    align-items:center;
    gap:9px;
    padding:10px;
    border:1px solid #e1e9f2;
    border-radius:11px;
    background:#fff;
    box-shadow:0 3px 10px rgba(28,61,95,.025);
}

.auto-stats>div>span{
    width:31px;
    height:31px;
    display:grid;
    place-items:center;
    flex:0 0 31px;
    border-radius:9px;
    font-size:10px;
    font-weight:800;
}

.auto-stats span.blue{
    color:#1479e8;
    background:#eaf4ff;
}

.auto-stats span.cyan{
    color:#159fbd;
    background:#e9f9fc;
}

.auto-stats span.green{
    color:#17a765;
    background:#e9f8f0;
}

.auto-stats p{
    margin:0;
    display:flex;
    flex-direction:column;
}

.auto-stats strong{
    color:#18324e;
    font-size:9px;
}

.auto-stats small{
    margin-top:2px;
    color:#8b9aaa;
    font-size:6px;
}

.auto-search{
    height:38px;
    display:flex;
    align-items:center;
    gap:8px;
    margin-top:11px;
    padding:5px 6px 5px 11px;
    border:1px solid #dfe8f1;
    border-radius:9px;
    background:#fff;
}

.auto-search span{
    flex:1;
    color:#95a4b4;
    font-size:6.5px;
}

.auto-search button{
    height:26px;
    padding:0 12px;
    border:0;
    border-radius:6px;
    color:#fff;
    background:#167be8;
    font-size:6px;
}

.auto-table{
    margin-top:11px;
    overflow:hidden;
    border:1px solid #dfe8f1;
    border-radius:10px;
    background:#fff;
}

.auto-table-title{
    height:37px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:0 12px;
    border-bottom:1px solid #edf1f5;
}

.auto-table-title>div{
    display:flex;
    align-items:center;
    gap:7px;
}

.auto-table-title>div span{
    color:#1479e8;
    font-size:9px;
}

.auto-table-title strong{
    font-size:8px;
}

.auto-table-title small{
    color:#9aa8b6;
    font-size:5.5px;
}

.auto-row{
    min-height:29px;
    display:grid;
    grid-template-columns:.55fr 1.2fr 1fr .85fr;
    align-items:center;
    padding:0 12px;
    border-bottom:1px solid #f0f3f6;
    color:#596c80;
    font-size:6px;
}

.auto-row:last-child{
    border-bottom:0;
}

.auto-row-head{
    min-height:25px;
    color:#8091a3;
    background:#f7fafd;
    font-size:5px;
    font-weight:750;
}

.auto-row b{
    width:max-content;
    display:inline-flex;
    padding:4px 7px;
    border-radius:999px;
    font-size:5px;
    font-weight:700;
}

.auto-row b.pending{
    color:#b47a16;
    background:#fff5db;
}

.auto-row b.confirmed{
    color:#168653;
    background:#e5f7ed;
}

.auto-row b.new{
    color:#1473d6;
    background:#e8f3ff;
}


/* Chat flotante */

.automation-chat{
    position:absolute;
    z-index:6;
    left:8px;
    top:126px;
    width:275px;
    height:360px;
    overflow:hidden;
    border:1px solid rgba(210,230,246,.75);
    border-radius:20px;
    background:#f4f0e9;
    box-shadow:
      0 30px 60px rgba(0,12,32,.40),
      0 0 0 1px rgba(255,255,255,.08);
}

.auto-chat-head{
    height:57px;
    display:flex;
    align-items:center;
    gap:9px;
    padding:0 13px;
    background:#fff;
}

.auto-wa-logo{
    width:33px;
    height:33px;
    display:grid;
    place-items:center;
    flex:0 0 33px;
    border-radius:50%;
    color:#fff;
    background:#1fbe6b;
    font-size:7px;
    font-weight:800;
}

.auto-chat-head>div{
    display:flex;
    flex:1;
    flex-direction:column;
}

.auto-chat-head strong{
    color:#19314c;
    font-size:9px;
}

.auto-chat-head small{
    margin-top:2px;
    color:#8190a0;
    font-size:6px;
}

.auto-chat-head small i{
    display:inline-block;
    width:5px;
    height:5px;
    margin-right:3px;
    border-radius:50%;
    background:#20c979;
}

.auto-chat-head>b{
    color:#8392a2;
    font-size:15px;
}

.auto-chat-body{
    height:263px;
    overflow:hidden;
    padding:10px;
    background-color:#efeae2;
    background-image:
      radial-gradient(rgba(70,83,77,.07) 1px,transparent 1px);
    background-size:13px 13px;
}

.auto-today{
    width:max-content;
    display:block;
    margin:0 auto 8px;
    padding:3px 8px;
    border-radius:5px;
    color:#85919d;
    background:rgba(255,255,255,.88);
    font-size:5px;
}

.auto-user-message{
    width:max-content;
    max-width:80%;
    margin:0 0 7px auto;
    padding:7px 8px 5px;
    border-radius:8px 3px 8px 8px;
    color:#304353;
    background:#d9fdd3;
    font-size:7px;
}

.auto-user-message small{
    display:block;
    margin-top:3px;
    color:#6d8c72;
    text-align:right;
    font-size:4.5px;
}

.auto-user-message.short{
    min-width:38px;
}

.auto-bot-message{
    width:88%;
    margin-bottom:7px;
    padding:9px;
    border-radius:4px 9px 9px 9px;
    color:#304353;
    background:#fff;
    box-shadow:0 2px 5px rgba(0,0,0,.04);
}

.auto-bot-message strong{
    font-size:8px;
}

.auto-bot-message p{
    margin:3px 0 7px;
    color:#657484;
    font-size:6px;
    line-height:1.35;
}

.auto-option{
    display:flex;
    align-items:center;
    gap:6px;
    margin-top:4px;
    padding:5px 6px;
    border-radius:6px;
    color:#38526e;
    background:#f1f6fb;
    font-size:5.5px;
}

.auto-option span{
    width:16px;
    height:16px;
    display:grid;
    place-items:center;
    border-radius:50%;
    color:#fff;
    background:#1479e8;
    font-size:5px;
}

.auto-confirm-message{
    display:flex;
    align-items:center;
    gap:7px;
    width:88%;
    padding:7px 8px;
    border-radius:4px 9px 9px 9px;
    background:#fff;
}

.auto-confirm-message>span{
    width:24px;
    height:24px;
    display:grid;
    place-items:center;
    border-radius:50%;
    color:#fff;
    background:#20bd6b;
    font-size:9px;
}

.auto-confirm-message>div{
    display:flex;
    flex-direction:column;
}

.auto-confirm-message strong{
    color:#24405d;
    font-size:6.5px;
}

.auto-confirm-message small{
    margin-top:2px;
    color:#8a99a7;
    font-size:5px;
}

.auto-chat-input{
    height:40px;
    display:flex;
    align-items:center;
    gap:8px;
    padding:6px 8px;
    background:#f5f5f5;
}

.auto-chat-input span{
    height:28px;
    display:flex;
    align-items:center;
    flex:1;
    padding:0 10px;
    border-radius:999px;
    color:#9aa5af;
    background:#fff;
    font-size:5.5px;
}

.auto-chat-input b{
    width:28px;
    height:28px;
    display:grid;
    place-items:center;
    border-radius:50%;
    color:#fff;
    background:#20bd6b;
    font-size:8px;
}


/* Conexión */

.automation-flow-line{
    position:absolute;
    z-index:4;
    left:270px;
    top:277px;
    width:105px;
    height:2px;
    overflow:visible;
    background:linear-gradient(90deg,#29d58a,#28a9f2);
}

.automation-flow-line::before,
.automation-flow-line::after{
    content:"";
    position:absolute;
    top:50%;
    width:8px;
    height:8px;
    transform:translateY(-50%);
    border-radius:50%;
}

.automation-flow-line::before{
    left:0;
    background:#29d58a;
    box-shadow:0 0 0 5px rgba(41,213,138,.13);
}

.automation-flow-line::after{
    right:0;
    background:#28a9f2;
    box-shadow:0 0 0 5px rgba(40,169,242,.13);
}

.automation-flow-line span{
    position:absolute;
    top:-2px;
    left:0;
    width:16px;
    height:6px;
    border-radius:999px;
    background:#bfffe2;
    box-shadow:0 0 10px rgba(71,255,174,.8);
    animation:autoDataFlow 2.3s linear infinite;
}

@keyframes autoDataFlow{
    from{left:0;}
    to{left:88px;}
}


/* Eventos flotantes */

.auto-event{
    position:absolute;
    z-index:8;
    min-width:155px;
    display:flex;
    align-items:center;
    gap:8px;
    padding:9px 11px;
    border:1px solid rgba(186,222,250,.24);
    border-radius:12px;
    background:rgba(7,43,82,.88);
    box-shadow:0 15px 30px rgba(0,13,35,.20);
    backdrop-filter:blur(12px);
}

.auto-event>i{
    width:28px;
    height:28px;
    display:grid;
    place-items:center;
    flex:0 0 28px;
    border-radius:8px;
    color:#fff;
    font-size:9px;
    font-style:normal;
    font-weight:800;
}

.auto-event i.green{
    background:linear-gradient(145deg,#18bb69,#28d88c);
}

.auto-event i.blue{
    background:linear-gradient(145deg,#1477e5,#27a9ef);
}

.auto-event i.purple{
    background:linear-gradient(145deg,#7756e8,#a274f2);
}

.auto-event>div{
    display:flex;
    flex-direction:column;
}

.auto-event small{
    color:#6ebdf1;
    font-size:5px;
    font-weight:750;
    letter-spacing:.65px;
}

.auto-event strong{
    margin-top:2px;
    color:#fff;
    font-size:7px;
    font-weight:650;
}

.event-one{
    left:31px;
    top:500px;
}

.event-two{
    right:40px;
    top:39px;
}

.event-three{
    right:18px;
    bottom:20px;
}


/* Desktop */

@media(min-width:1200px){

    .innovation-grid{
        grid-template-columns:340px minmax(0,1fr)!important;
        column-gap:42px!important;
    }

    .automation-ecosystem{
        width:930px;
    }
}

@media(min-width:1500px){

    .innovation-grid{
        grid-template-columns:350px minmax(0,1fr)!important;
        column-gap:48px!important;
    }

    .automation-ecosystem{
        width:970px;
    }

    .automation-dashboard{
        width:700px;
    }
}


/* Tablet */

@media(max-width:1199px){

    .automation-ecosystem{
        max-width:850px;
        margin:15px auto 0;
    }

    .automation-dashboard{
        width:650px;
    }
}


/* Móvil */

@media(max-width:760px){

    .automation-ecosystem{
        height:580px;
        margin-top:25px;
    }

    .automation-live{
        top:0;
        left:50%;
        transform:translateX(-50%);
        white-space:nowrap;
    }

    .automation-dashboard{
        top:58px;
        left:0;
        right:auto;
        width:100%;
        height:335px;
        border-radius:16px;
    }

    .auto-dashboard-body{
        grid-template-columns:42px 1fr;
    }

    .auto-sidebar{
        gap:8px;
    }

    .auto-main{
        padding:12px;
    }

    .auto-top h3{
        font-size:13px;
    }

    .auto-stats{
        gap:5px;
    }

    .auto-stats>div{
        min-height:48px;
        padding:6px;
    }

    .auto-stats>div>span{
        width:24px;
        height:24px;
        flex-basis:24px;
        font-size:7px;
    }

    .auto-stats small{
        display:none;
    }

    .auto-search{
        display:none;
    }

    .auto-table{
        margin-top:8px;
    }

    .automation-chat{
        left:18px;
        top:315px;
        width:225px;
        height:250px;
    }

    .auto-chat-head{
        height:48px;
    }

    .auto-chat-body{
        height:164px;
    }

    .auto-chat-input{
        height:38px;
    }

    .auto-bot-message{
        display:none;
    }

    .automation-flow-line{
        display:none;
    }

    .auto-event{
        min-width:130px;
        padding:7px 8px;
    }

    .event-one{
        display:none;
    }

    .event-two{
        right:8px;
        top:375px;
    }

    .event-three{
        right:8px;
        bottom:18px;
    }
}



/* ==========================================================
   INNOVACIÓN V3 — CORRECCIÓN DE POSICIÓN
   ========================================================== */

@media (min-width:1021px){

    .innovation{
        min-height:720px!important;
        padding-top:70px!important;
        padding-bottom:70px!important;
    }

    .innovation .innovation-grid{
        display:grid!important;
        grid-template-columns:350px minmax(0,1fr)!important;
        align-items:center!important;
        column-gap:45px!important;
        min-height:580px!important;
    }

    .innovation .innovation-copy{
        align-self:center!important;
        margin:0!important;
        transform:none!important;
    }

    .innovation .automation-ecosystem{
        align-self:center!important;
        width:900px!important;
        height:590px!important;
        margin:0!important;
        transform:none!important;
    }

    .innovation .automation-dashboard{
        top:75px!important;
        right:0!important;
    }

    .innovation .automation-chat{
        top:125px!important;
    }

}


/* Pantallas grandes como la tuya */

@media (min-width:1450px){

    .innovation .innovation-grid{
        grid-template-columns:350px minmax(0,1fr)!important;
        column-gap:50px!important;
    }

    .innovation .automation-ecosystem{
        width:940px!important;
    }

}


/* Evitar que elementos anteriores alteren la grilla */

.innovation .ai-products{
    display:none!important;
}



/* ==========================================================
   INNOVACIÓN — IMAGEN PREMIUM FINAL
   ========================================================== */

.innovation-image-section{
    position:relative!important;
    width:100%!important;
    min-height:0!important;
    padding:0!important;
    margin:0!important;
    overflow:hidden!important;
    background:#052b56!important;
}

.innovation-premium-image{
    width:100%;
    max-width:1920px;
    margin:0 auto;
    line-height:0;
}

.innovation-premium-image img{
    display:block;
    width:100%;
    height:auto;
    margin:0;
    object-fit:contain;
}


/* En pantallas muy grandes evitamos que se estire demasiado */

@media(min-width:1921px){
    .innovation-image-section{
        background:#062d59!important;
    }

    .innovation-premium-image{
        max-width:1920px;
    }
}


/* Móvil: mantenemos la imagen completa */

@media(max-width:700px){
    .innovation-premium-image{
        width:100%;
        overflow:hidden;
    }

    .innovation-premium-image img{
        width:100%;
        height:auto;
    }
}



/* ==========================================================
   INNOVACIÓN — AJUSTE FINAL DE TAMAÑO
   ========================================================== */

@media (min-width:901px){

    .innovation-image-section{
        padding:34px 0!important;
        background:#052b56!important;
    }

    .innovation-premium-image{
        width:90%!important;
        max-width:1720px!important;
        margin:0 auto!important;
    }

    .innovation-premium-image img{
        display:block!important;
        width:100%!important;
        height:auto!important;
        border-radius:18px;
    }
}


/* Tablet y móvil conservan más superficie útil */

@media (max-width:900px){

    .innovation-image-section{
        padding:18px 0!important;
    }

    .innovation-premium-image{
        width:96%!important;
        margin:0 auto!important;
    }

    .innovation-premium-image img{
        width:100%!important;
        height:auto!important;
        border-radius:12px;
    }
}



/* ==========================================================
   INNOVACIÓN — OCULTAR CABECERA INCLUIDA EN LA IMAGEN
   ========================================================== */

@media (min-width:901px){

    .innovation-premium-image{
        width:90%!important;
        max-width:1720px!important;
        margin:0 auto!important;

        /* Recortamos la navegación que viene dentro del PNG */
        overflow:hidden!important;
        border-radius:18px!important;
    }

    .innovation-premium-image img{
        display:block!important;
        width:100%!important;
        height:auto!important;

        /* Subimos la imagen para esconder su cabecera interna */
        margin-top:-6.8%!important;
        margin-bottom:-1%!important;

        border-radius:0!important;
    }

    .innovation-image-section{
        padding:34px 0!important;
    }
}


/* En móvil también quitamos la barra duplicada */

@media (max-width:900px){

    .innovation-premium-image{
        overflow:hidden!important;
        border-radius:12px!important;
    }

    .innovation-premium-image img{
        margin-top:-6.8%!important;
        border-radius:0!important;
    }
}