/* Servicios: editorial layout scoped to the redesigned main. */
.sv-page { --sv-navy:#081e34; --sv-blue:#0a527e; --sv-cyan:#83d8f6; --sv-muted:#526579; color:#344d62; }
.sv-page [id] { scroll-margin-top:100px; }
.sv-wrap { width:min(1200px,90%); margin-inline:auto; }
.sv-page h1,.sv-page h2,.sv-page h3,.sv-page h4 { font-family:'Outfit',sans-serif; color:#0a3d62; line-height:1.16; text-wrap:balance; }
.sv-page h1 { font-size:clamp(38px,4.25vw,60px); letter-spacing:-1.6px; font-weight:700; }
.sv-page h2 { font-size:clamp(30px,3.1vw,44px); letter-spacing:-.8px; }
.sv-page h3 { font-size:clamp(25px,2.4vw,34px); letter-spacing:-.4px; }
.sv-page h4 { font-size:21px; margin:24px 0 12px; }
.sv-page p { margin:18px 0; }
.sv-page .sv-eyebrow { font-size:12px; font-weight:700; letter-spacing:2px; color:#1673a7; margin:0 0 20px; }
.sv-lead,.sv-value { font-size:19px; line-height:1.65; }
.sv-value { color:#244e6a; }
.sv-reading { max-width:780px; }
.sv-button { display:inline-flex; align-items:center; justify-content:center; gap:15px; background:#0a527e; color:#fff; padding:17px 22px; border:1px solid transparent; border-radius:8px; font-size:13px; font-weight:700; line-height:1.5; text-decoration:none; max-width:100%; text-align:center; transition:background .2s,box-shadow .2s; }
.sv-page a:focus-visible { outline:3px solid #149ed4; outline-offset:5px; }
.sv-button:hover { background:#083b5b; box-shadow:0 6px 18px #082e4e22; }
.sv-button span { flex-shrink:0; font-size:18px; }
.sv-hero { background:linear-gradient(120deg,#081e34,#103954); color:#d3e3ef; padding:88px 0; }
.sv-hero-grid { display:grid; grid-template-columns:1.15fr .85fr; gap:70px; align-items:center; }
.sv-hero h1,.sv-dark h2,.sv-dark h3,.sv-dark h4,.sv-final h2 { color:#fff; }
.sv-hero .sv-eyebrow,.sv-dark .sv-eyebrow { color:var(--sv-cyan); }
.sv-hero .sv-lead { margin-top:26px; }
.sv-hero-support { max-width:550px; font-size:16px; color:#afc5d7; }
.sv-hero .sv-button { margin-top:16px; background:#fff; color:#0a3d62; }
.sv-capabilities { border-left:1px solid #ffffff26; padding-left:30px; }
.sv-capabilities div { display:flex; align-items:center; gap:16px; font:500 clamp(17px,1.9vw,26px)/1.4 'Outfit',sans-serif; color:#e5f4ff; padding:25px 0; border-bottom:1px solid #ffffff26; }
.sv-capabilities div:nth-child(2) { padding-left:12px; }.sv-capabilities div:nth-child(3) { padding-left:24px; }.sv-capabilities div:nth-child(4) { padding-left:36px; }
.sv-capabilities span { font:400 12px 'DM Sans',sans-serif; color:#83d8f6; }
.sv-area-nav { padding:30px 0 40px; }
.sv-area-nav>p { color:#526579; font-size:14px; }
.sv-area-nav>div { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; }
.sv-area-nav a { padding:20px 16px; border:1px solid #dce7ee; border-radius:8px; color:#0a3d62; text-decoration:none; transition:background .2s,border-color .2s; }
.sv-area-nav a:hover { border-color:#149ed4; background:#f1f8fc; }
.sv-area-nav span { color:#1673a7; font-size:12px; display:block; }.sv-area-nav strong { display:block; font:500 22px 'Outfit',sans-serif; margin:5px 0; }.sv-area-nav small { font-size:13px; line-height:1.5; display:block; }
.sv-section { padding:80px 0; }
.sv-section-heading { max-width:810px; margin-bottom:54px; }
.sv-section-heading>p:last-child { max-width:750px; }
.sv-split { display:grid; grid-template-columns:1fr 1.08fr; gap:54px; align-items:center; }
.sv-placeholder { min-height:290px; padding:35px; border:1px dashed #91a8b9; background:#edf2f5; color:#536c80; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; gap:16px; border-radius:12px; }
.sv-placeholder strong { font:500 23px/1.3 'Outfit',sans-serif; max-width:350px; }.sv-placeholder>span:last-child { font-size:13px; max-width:340px; }.sv-placeholder-label { font-size:10px; letter-spacing:2px; border:1px solid #adbecb; border-radius:4px; padding:5px 9px; }
.sv-web-visual { position:relative; padding-bottom:90px; }.sv-web-visual>.sv-placeholder:first-child { aspect-ratio:16/10; }
.sv-mobile-placeholder { position:absolute; width:170px; min-height:230px; padding:20px; right:20px; bottom:0; background:#f9fbfc; border-radius:20px; }.sv-mobile-placeholder strong { font-size:17px; }.sv-mobile-placeholder .sv-placeholder-label { font-size:8px; }
.sv-feature-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:32px; margin:42px 0 32px; border-top:1px solid #dce7ee; padding-top:26px; }
.sv-feature-grid h3,.sv-feature-grid h4 { font-size:23px; margin:0 0 18px; }
.sv-list { padding:0; margin:24px 0; list-style:none; }.sv-list li { position:relative; padding-left:18px; margin:12px 0; }.sv-list li::before { content:''; position:absolute; left:0; top:.7em; width:5px; height:5px; background:#168cc0; border-radius:50%; }
.sv-ideal { border-left:2px solid #95c9de; padding-left:16px; max-width:860px; }.sv-ideal strong { display:block; color:#0a3d62; font-size:13px; margin-bottom:4px; }
.sv-page .sv-scope { font-size:14px; line-height:1.6; color:#617184; max-width:820px; margin:22px 0; }.sv-scope strong { font-weight:500; }
.sv-tech { color:#116487; font-size:14px; }
.sv-tint { background:#f2f5f8; }
.sv-case-grid { display:grid; grid-template-columns:1fr 1fr; gap:30px; }.sv-case>.sv-placeholder { aspect-ratio:16/10; }
.sv-case-caption { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-top:22px; }.sv-case-caption h3 { font-size:25px; }.sv-case-caption p { margin:4px 0 0; font-size:14px; }.sv-text-link { color:#0a527e; text-decoration:none; font-weight:700; font-size:12px; border-bottom:1px solid #86b8d1; padding:8px 0; }.sv-text-link:hover { color:#06324f; border-color:currentColor; }.sv-case-close { text-align:center; padding-top:20px; }
.sv-duo { display:grid; grid-template-columns:1fr 1fr; gap:0; }.sv-duo>article { padding-right:44px; }.sv-duo>article+article { padding:0 0 0 44px; border-left:1px solid #dce7ee; }
.sv-related { font-size:14px; }.sv-related a,.sv-compat a { color:#0a527e; text-underline-offset:4px; }.sv-compat { margin-top:50px; padding-top:22px; border-top:1px solid #dce7ee; display:flex; flex-wrap:wrap; gap:12px 24px; font-size:14px; }
.sv-operation { grid-template-columns:1fr 1fr; }.sv-operation-visual>.sv-placeholder { aspect-ratio:16/12; }
.sv-dark { background:#081e34; color:#c5d7e5; }.sv-dark .sv-tech { color:#83d8f6; }.sv-dark .sv-scope { color:#b0c4d5; }.sv-dark .sv-ideal strong { color:#ecf7ff; }.sv-dark .sv-feature-grid { border-color:#ffffff26; }
.sv-data-flow { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:30px; list-style:none; margin:36px 0; }.sv-data-flow li { border-top:1px solid #5e8fa8; padding-top:18px; }.sv-data-flow strong { color:#83d8f6; font:500 18px 'Outfit',sans-serif; }.sv-data-flow p { font-size:15px; }
.sv-dark .sv-placeholder { background:#112c43; color:#b9cedd; border-color:#648398; min-height:350px; }.sv-dashboard { aspect-ratio:16/6; }.sv-two { grid-template-columns:1fr 1fr; }.sv-dark .sv-button { background:#dff5ff; color:#0a3d62; }.sv-dark .sv-button:hover { background:#fff; }
.sv-cloud-map { padding:34px; text-align:center; background:#f2f7fa; border-radius:12px; }.sv-cloud-map>div { border:1px solid #c4d9e5; padding:20px; background:white; border-radius:6px; font-family:'Outfit',sans-serif; }.sv-cloud-map>span { display:block; color:#187eae; }.sv-cloud-map>span:not(.sv-eyebrow) { padding:8px; }
.sv-cloud>.sv-list { columns:2; column-gap:40px; margin-top:35px; }.sv-cloud>.sv-list li { break-inside:avoid; }.sv-infra-duo { margin-top:65px; padding-top:55px; border-top:1px solid #dce7ee; }
.sv-final { padding:75px 0; background:linear-gradient(120deg,#0a3d62,#086a9b); color:#edf6ff; text-align:center; }.sv-final h2 { max-width:760px; margin:auto; }.sv-final p { max-width:620px; margin:24px auto 30px; font-size:18px; }.sv-final .sv-button { background:#fff; color:#0a3d62; }
@media(max-width:1000px) { .sv-hero-grid { gap:35px; }.sv-capabilities { padding-left:18px; }.sv-capabilities div:nth-child(n) { padding-left:0; }.sv-split { gap:30px; }.sv-duo>article { padding-right:25px; }.sv-duo>article+article { padding-left:25px; }.sv-feature-grid { gap:22px; } }
@media(max-width:800px) {
 .sv-hero-grid,.sv-split { grid-template-columns:1fr; }.sv-hero { padding:55px 0; }.sv-capabilities { display:grid; grid-template-columns:1fr 1fr; border-left:0; padding:0; gap:0 22px; }.sv-capabilities div { font-size:17px; }
 .sv-area-nav>div { grid-template-columns:1fr 1fr; }.sv-section { padding:55px 0; }.sv-section-heading { margin-bottom:36px; }.sv-operation-visual { order:2; }.sv-web-visual { max-width:600px; width:100%; margin:auto; }
 .sv-duo { grid-template-columns:1fr; gap:45px; }.sv-duo>article { padding:0; }.sv-duo>article+article { padding:40px 0 0; border-left:0; border-top:1px solid #dce7ee; }.sv-case-grid { gap:24px; }.sv-case-caption { align-items:flex-start; flex-direction:column; gap:10px; }.sv-case>.sv-placeholder { min-height:230px; padding:24px; }.sv-feature-grid { grid-template-columns:1fr; gap:20px; }.sv-feature-grid>div { border-bottom:1px solid #dce7ee; padding-bottom:12px; }.sv-dark .sv-feature-grid>div { border-color:#ffffff26; }
}
@media(max-width:600px) {
 .sv-wrap { width:88%; }.sv-page h1 { font-size:36px; letter-spacing:-.9px; }.sv-page h2 { font-size:30px; }.sv-page h3 { font-size:26px; }.sv-page .sv-eyebrow { font-size:11px; letter-spacing:1.5px; }.sv-lead,.sv-value { font-size:17px; }.sv-page p,.sv-list { line-height:1.65; }.sv-button { width:100%; padding:16px 12px; font-size:12px; gap:10px; }
 .sv-capabilities div { font-size:14px; gap:8px; padding:16px 0; }.sv-hero { padding:44px 0; }.sv-area-nav a { padding:15px 12px; }.sv-area-nav strong { font-size:18px; }.sv-area-nav>div { gap:10px; }.sv-area-nav small { font-size:12px; }
 .sv-case-grid { grid-template-columns:1fr; gap:35px; }.sv-case-caption { flex-direction:row; align-items:center; }.sv-placeholder { min-height:220px; padding:24px; }.sv-placeholder strong { font-size:21px; }.sv-web-visual { padding-bottom:0; }.sv-mobile-placeholder { position:static; width:100%; min-height:160px; margin-top:15px; border-radius:12px; }
 .sv-data-flow { grid-template-columns:1fr; gap:12px; }.sv-data-flow p { margin:10px 0; }.sv-dark .sv-placeholder { min-height:260px; aspect-ratio:auto; }.sv-cloud>.sv-list { columns:1; }.sv-cloud-map { padding:22px; }.sv-compat { flex-direction:column; gap:12px; }.sv-final { padding:50px 0; }.sv-final p { font-size:16px; }
}
@media(prefers-reduced-motion:reduce) { .sv-page * { animation:none!important; transition:none!important; scroll-behavior:auto!important; } }
/* Keep placeholder aspect ratios from imposing a minimum grid width. */
.sv-placeholder { width:100%; max-width:100%; min-width:0; }
.sv-case-grid,.sv-split,.sv-hero-grid { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
.sv-case,.sv-split>div,.sv-hero-grid>div { min-width:0; }
.sv-mobile-placeholder { width:170px; }
@media(min-width:801px) { .sv-hero-grid { grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); } }
@media(max-width:800px) { .sv-split,.sv-hero-grid { grid-template-columns:minmax(0,1fr); } }
@media(max-width:600px) { .sv-case-grid { grid-template-columns:minmax(0,1fr); }.sv-mobile-placeholder { width:100%; } }
/* Authentic project captures, framed in HTML without altering the images. */
.sv-project-preview { position:relative; padding:0 35px 58px 0; }
.sv-browser { overflow:hidden; border:1px solid #c8d6e0; border-radius:10px; background:#fff; box-shadow:0 12px 30px #0a3d6212; }
.sv-browser-bar { padding:8px 14px; background:#e5edf3; color:#526579; font-size:11px; border-bottom:1px solid #c8d6e0; }
.sv-browser img { display:block; width:100%; height:auto; }
.sv-phone { position:absolute; bottom:0; right:0; width:24%; border:5px solid #183349; border-radius:18px; overflow:hidden; background:#183349; box-shadow:0 8px 24px #081e3426; }
.sv-phone img { display:block; width:100%; height:auto; }
.sv-web-visual { padding-bottom:0; }
@media(max-width:600px) {
 .sv-project-preview { padding:0 22px 42px 0; }
 .sv-phone { width:27%; border-width:3px; border-radius:11px; }
 .sv-browser-bar { font-size:10px; padding:6px 10px; }
}
/* Approved real system captures; open originals for readable detail. */
.sv-system-gallery { display:grid; gap:24px; }
.sv-system-capture { margin:0; min-width:0; }
.sv-system-capture>a { display:block; border:1px solid #c3d3df; border-radius:10px; overflow:hidden; background:#fff; transition:box-shadow .2s; }
.sv-system-capture>a:hover { box-shadow:0 6px 22px #0a3d6220; }
.sv-system-capture img { display:block; width:100%; height:auto; }
.sv-system-capture figcaption { display:flex; justify-content:space-between; align-items:center; gap:14px; margin-top:12px; }
.sv-system-capture figcaption strong { display:block; color:#0a3d62; font-family:'Outfit',sans-serif; font-size:17px; }
.sv-system-capture figcaption span { display:block; font-size:13px; color:#526579; }
.sv-system-capture figcaption>a { color:#0a527e; font-size:13px; padding:10px 0; white-space:nowrap; text-underline-offset:4px; }
@media(prefers-reduced-motion:reduce) { .sv-system-capture>a { transition:none; } }
.sv-demo-dashboard { margin:36px 0; }
.sv-demo-dashboard>a { display:block; border:1px solid #426078; border-radius:12px; overflow:hidden; }
.sv-demo-dashboard img { display:block; width:100%; height:auto; }
.sv-demo-dashboard figcaption { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-top:14px; color:#bed0df; font-size:13px; line-height:1.6; }
.sv-demo-dashboard figcaption strong { display:block; color:#edf7ff; }
.sv-demo-dashboard figcaption a { color:#83d8f6; flex-shrink:0; padding:10px 0; text-underline-offset:4px; }
@media(max-width:600px) { .sv-demo-dashboard figcaption { flex-direction:column; align-items:flex-start; gap:5px; } }
/* Align infrastructure CTAs across the two desktop columns. */
@media(min-width:801px) {
 .sv-infra-duo>article { display:flex; flex-direction:column; }
 .sv-infra-duo>article>.sv-button { margin-top:auto; align-self:flex-start; }
}
/* Commercial entry after the web projects. */
.sv-package { margin-top:38px; padding:32px; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:32px; align-items:center; background:#fff; border:1px solid #cfdee8; border-left:4px solid #1673a7; border-radius:12px; }
.sv-package .sv-eyebrow { margin-bottom:12px; }
.sv-package h3 { font-size:clamp(23px,2.1vw,29px); max-width:650px; }
.sv-package p:last-child { margin-bottom:0; max-width:700px; }
@media(max-width:800px) { .sv-package { grid-template-columns:minmax(0,1fr); padding:25px; gap:22px; }.sv-package>.sv-button { justify-self:start; } }
@media(max-width:600px) { .sv-package { padding:22px 18px; }.sv-package>.sv-button { justify-self:stretch; } }