:root {
  --navy-950: #061329;
  --navy-900: #071b3a;
  --navy-800: #0b2854;
  --navy-700: #12366c;
  --ink: #1c2533;
  --muted: #5f6b7a;
  --line: #dfe5ee;
  --soft: #f5f7fb;
  --white: #ffffff;
  --magenta: #a92d62;
  --orange: #b7672d;
  --cyan: #167b9a;
  --blue: #1f5f9f;
  --gradient: linear-gradient(105deg, var(--magenta), var(--orange) 42%, var(--cyan) 78%, var(--blue));
  --gradient-soft: linear-gradient(105deg, rgba(169,45,98,.12), rgba(183,103,45,.10), rgba(22,123,154,.12));
  --shadow-sm: 0 10px 30px rgba(7, 27, 58, .08);
  --shadow-md: 0 22px 60px rgba(7, 27, 58, .14);
  --radius: 24px;
  --radius-sm: 16px;
  --container: 1180px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: Inter, Aptos, Arial, sans-serif;
  color: var(--ink);
  background: var(--white);
  line-height: 1.55;
  overflow-x: hidden;
}
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; }
.container { width: min(var(--container), calc(100% - 40px)); margin-inline: auto; }
.section-pad { padding: 92px 0; }
.skip-link { position: absolute; left: -999px; top: 12px; background: var(--navy-900); color: #fff; padding: 10px 14px; border-radius: 10px; z-index: 999; }
.skip-link:focus { left: 12px; }

.site-header {
  position: sticky; top: 0; z-index: 50;
  background: rgba(255,255,255,.90);
  backdrop-filter: blur(18px);
  border-bottom: 1px solid rgba(223,229,238,.78);
}
.nav-shell { min-height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.brand { display: flex; align-items: center; gap: 14px; min-width: 220px; }
.brand img { width: 232px; height: auto; }
.brand-fallback { display: none; }
.main-nav { display: flex; align-items: center; gap: 24px; font-size: 14px; font-weight: 750; color: #334155; }
.main-nav a:not(.btn) { position: relative; }
.main-nav a:not(.btn)::after { content:""; position:absolute; left:0; bottom:-9px; height:2px; width:0; background: var(--gradient); transition: width .2s ease; opacity:.75; }
.main-nav a:hover::after { width:100%; }
.nav-toggle { display:none; width:46px; height:46px; border:1px solid var(--line); border-radius:14px; background:#fff; cursor:pointer; flex-direction:column; align-items:center; justify-content:center; gap:5px; }
.nav-toggle span { width:20px; height:2px; border-radius:999px; background:var(--navy-900); }

.btn { display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:0 22px; border-radius:999px; font-weight:850; letter-spacing:-.01em; border:1px solid transparent; transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; cursor:pointer; }
.btn:hover { transform: translateY(-2px); }
.btn-primary { color:#fff; background: linear-gradient(105deg, var(--navy-900), var(--navy-700) 68%, var(--cyan)); box-shadow:0 16px 34px rgba(7,27,58,.22); }
.btn-secondary { color: var(--navy-900); background:#fff; border-color:var(--line); box-shadow:var(--shadow-sm); }
.btn-small { min-height:40px; padding:0 16px; color:#fff; background:var(--navy-900); }

.hero {
  position: relative; padding-top: 82px; min-height: 750px;
  background:
    radial-gradient(circle at 8% 20%, rgba(22,123,154,.12), transparent 32%),
    radial-gradient(circle at 82% 9%, rgba(169,45,98,.09), transparent 28%),
    linear-gradient(180deg, #fff 0%, #f8fbff 100%);
  overflow: hidden;
}
.hero::before {
  content:""; position:absolute; top:0; right:-160px; width:54%; height:140px;
  background: var(--navy-900); border-bottom-left-radius:120px;
  box-shadow: inset 0 -4px 0 rgba(22,123,154,.10);
}
.hero::after {
  content:""; position:absolute; top:0; right:260px; width:360px; height:8px;
  background: linear-gradient(90deg, var(--magenta), var(--cyan));
  opacity:.85; border-bottom-left-radius:999px; border-bottom-right-radius:999px;
}
.tech-grid { position:absolute; inset:0; opacity:.35; background-image:linear-gradient(rgba(7,27,58,.045) 1px, transparent 1px),linear-gradient(90deg, rgba(7,27,58,.045) 1px, transparent 1px); background-size:56px 56px; mask-image:linear-gradient(180deg, transparent 0%, #000 24%, transparent 86%); }
.hero-grid { position:relative; display:grid; grid-template-columns:1.04fr .96fr; gap:64px; align-items:center; }
.eyebrow, .section-kicker { display:inline-flex; align-items:center; gap:10px; font-weight:900; text-transform:uppercase; letter-spacing:.12em; color:var(--navy-700); font-size:12px; }
.eyebrow span { width:44px; height:3px; border-radius:999px; background:var(--gradient); opacity:.8; }
h1,h2,h3 { margin:0; color:var(--navy-950); line-height:1.04; letter-spacing:-.045em; }
h1 { max-width:760px; margin-top:20px; font-family:Montserrat,Inter,sans-serif; font-size:clamp(42px,5vw,72px); font-weight:900; }
.hero-lead { max-width:650px; margin:24px 0 0; color:var(--muted); font-size:19px; }
.hero-actions { display:flex; gap:14px; flex-wrap:wrap; margin-top:34px; }
.hero-proof { margin-top:42px; display:grid; grid-template-columns:repeat(3,1fr); gap:18px; max-width:660px; }
.hero-proof div { padding:18px; border:1px solid rgba(223,229,238,.9); border-radius:18px; background:rgba(255,255,255,.72); box-shadow:0 12px 36px rgba(7,27,58,.05); }
.hero-proof strong { display:block; font-size:22px; color:var(--navy-900); }
.hero-proof span { display:block; margin-top:4px; color:var(--muted); font-size:13px; }

.security-panel { position:relative; padding:28px; border-radius:34px; background:rgba(255,255,255,.90); border:1px solid rgba(223,229,238,.92); box-shadow:var(--shadow-md); overflow:hidden; }
.security-panel::before { content:""; position:absolute; inset:0 0 auto 0; height:5px; background:linear-gradient(90deg, var(--navy-900), var(--cyan)); opacity:.92; }
.panel-top { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; }
.panel-top p,.panel-top h2 { margin:0; }
.panel-top p { color:var(--muted); font-size:13px; font-weight:850; text-transform:uppercase; letter-spacing:.08em; }
.panel-top h2 { margin-top:4px; font-size:28px; }
.status-dot { display:inline-flex; align-items:center; gap:8px; padding:8px 11px; border-radius:999px; background:#eef8fa; color:#166276; font-size:12px; font-weight:900; }
.status-dot::before { content:""; width:8px; height:8px; border-radius:999px; background:#167b9a; }

.score-card { margin-top:28px; display:grid; grid-template-columns:132px 1fr; gap:22px; align-items:center; padding:22px; border-radius:24px; background:var(--navy-900); color:#fff; position:relative; overflow:hidden; }
.score-card::after { content:""; position:absolute; right:-70px; bottom:-120px; width:240px; height:240px; background:radial-gradient(circle, rgba(22,123,154,.32), transparent 62%); }
.score-ring { width:112px; height:112px; display:grid; place-items:center; border-radius:999px; background:radial-gradient(circle at center, var(--navy-900) 57%, transparent 58%), conic-gradient(var(--cyan) 0 74%, rgba(255,255,255,.12) 74% 100%); position:relative; z-index:1; }
.score-ring span { font-size:34px; font-weight:900; }
.score-ring small { position:absolute; top:66px; font-size:11px; color:#c9d8f0; }
.score-card h3 { color:#fff; font-size:24px; position:relative; z-index:1; }
.score-card p { color:#c9d8f0; margin:8px 0 0; position:relative; z-index:1; }
.mini-metrics { margin-top:18px; display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
.mini-metrics article { padding:18px; border-radius:20px; border:1px solid var(--line); background:#fff; }
.mini-metrics strong { display:block; color:var(--navy-950); margin-top:10px; }
.mini-metrics small { display:block; color:var(--muted); margin-top:3px; }
.risk-list { margin-top:18px; display:grid; gap:10px; }
.risk-list div { display:flex; align-items:center; gap:10px; padding:14px 15px; border-radius:16px; background:#f7f9fd; color:#334155; font-weight:700; font-size:14px; }
.risk-list span { width:8px; height:8px; border-radius:999px; background:var(--cyan); flex:0 0 auto; }

.icon,.card-icon,.micro-icon { display:inline-block; background:currentColor; mask-repeat:no-repeat; mask-size:contain; mask-position:center; -webkit-mask-repeat:no-repeat; -webkit-mask-size:contain; -webkit-mask-position:center; }
.icon { width:28px; height:28px; color:var(--navy-900); }
.card-icon { width:48px; height:48px; padding:12px; border-radius:16px; color:var(--navy-900); background:#eef4fa; border:1px solid var(--line); }
.micro-icon { width:28px; height:28px; color:#b9d9e4; flex:0 0 auto; }

.icon-shield,.icon-lock { mask-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10Zm0-2.2C9.3 18.3 6 15.5 6 12V6.4l6-2.25 6 2.25V12c0 3.5-3.3 6.3-6 7.8Z'/%3E%3C/svg%3E");}
.icon-cloud { mask-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M19 18H8a5 5 0 0 1-.7-9.95A6.5 6.5 0 0 1 19.6 10.2 4 4 0 0 1 19 18Zm0-2a2 2 0 0 0 .04-4h-1.1l-.25-1.07a4.5 4.5 0 0 0-8.79-.45l-.22.85-.88.02A3 3 0 0 0 8 16h11Z'/%3E%3C/svg%3E");}
.icon-pulse { mask-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M3 13h4l2-6 4 12 2.5-6H21v-2h-6.8l-1 2.4L9 1 5.6 11H3v2Z'/%3E%3C/svg%3E");}
.icon-learn { mask-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M12 3 1 9l11 6 9-4.91V17h2V9L12 3Zm0 9.72L5.17 9 12 5.28 18.83 9 12 12.72ZM5 12.18V17c0 2.21 3.13 4 7 4s7-1.79 7-4v-4.82l-2 1.09V17c0 .55-1.77 2-5 2s-5-1.45-5-2v-3.73l-2-1.09Z'/%3E%3C/svg%3E");}
.icon-support { mask-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M12 2a8 8 0 0 0-8 8v3a3 3 0 0 0 3 3h1V9H6.08a6 6 0 0 1 11.84 0H16v7h1a3 3 0 0 0 3-3v-3a8 8 0 0 0-8-8Zm-1 17h2a2 2 0 0 0 2-2h2a4 4 0 0 1-4 4h-2v-2Z'/%3E%3C/svg%3E");}
.icon-data,.icon-doc { mask-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M12 3C7.58 3 4 4.34 4 6v12c0 1.66 3.58 3 8 3s8-1.34 8-3V6c0-1.66-3.58-3-8-3Zm0 2c3.87 0 6 .97 6 1s-2.13 1-6 1-6-.97-6-1 2.13-1 6-1Zm0 14c-3.87 0-6-.97-6-1v-2.28C7.45 16.53 9.6 17 12 17s4.55-.47 6-1.28V18c0 .03-2.13 1-6 1Zm0-4c-3.87 0-6-.97-6-1v-2.28C7.45 12.53 9.6 13 12 13s4.55-.47 6-1.28V14c0 .03-2.13 1-6 1Zm0-4c-3.87 0-6-.97-6-1V7.72C7.45 8.53 9.6 9 12 9s4.55-.47 6-1.28V10c0 .03-2.13 1-6 1Z'/%3E%3C/svg%3E");}
.icon-map { mask-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='m15 5 6-2v16l-6 2-6-2-6 2V5l6-2 6 2Zm-1 1.76-4-1.33v11.81l4 1.33V6.76Zm2 11.81 3-1V5.77l-3 1v11.8Zm-8-1.33V5.43l-3 1v11.8l3-.99Z'/%3E%3C/svg%3E");}
.icon-users { mask-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M16 11a4 4 0 1 0-3.2-6.4A5 5 0 0 1 12 12c2.67 0 5 1.34 5 3v1h5v-1c0-2.21-2.69-4-6-4Zm-8 0a4 4 0 1 0 0-8 4 4 0 0 0 0 8Zm0 2c-3.31 0-6 1.79-6 4v2h12v-2c0-2.21-2.69-4-6-4Z'/%3E%3C/svg%3E");}
.icon-key { mask-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M7 14a5 5 0 1 1 4.9-6H23v4h-3v3h-3v-3h-5.1A5 5 0 0 1 7 14Zm0-2a3 3 0 1 0 0-6 3 3 0 0 0 0 6Z'/%3E%3C/svg%3E");}
.icon-backup { mask-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M12 6V3L8 7l4 4V8a5 5 0 1 1-4.58 3H5.26A7 7 0 1 0 12 6Z'/%3E%3C/svg%3E");}
.icon-roadmap { mask-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M6 3a3 3 0 0 0-1 5.83V15a3 3 0 1 0 2 0V8.83A3.01 3.01 0 0 0 8.83 7H14a3 3 0 0 1 0 6h-1a5 5 0 0 0 0 10h5.17A3 3 0 1 0 18.17 21H13a3 3 0 0 1 0-6h1a5 5 0 0 0 0-10H8.83A3.01 3.01 0 0 0 6 3Z'/%3E%3C/svg%3E");}

.trust-strip { background:var(--navy-900); color:#fff; border-top:4px solid #0f5b74; }
.trust-grid { display:grid; grid-template-columns:repeat(4,1fr); }
.trust-grid div { padding:26px 24px; border-left:1px solid rgba(255,255,255,.11); }
.trust-grid div:last-child { border-right:1px solid rgba(255,255,255,.11); }
.trust-grid strong { display:block; font-size:18px; }
.trust-grid span { display:block; margin-top:2px; color:#c9d8f0; font-size:14px; }

.section-head { max-width:760px; margin-bottom:44px; }
.section-kicker { color:var(--magenta); margin-bottom:12px; }
.section-kicker.light { color:#95d3e4; }
h2 { font-family:Montserrat,Inter,sans-serif; font-size:clamp(32px,4vw,52px); font-weight:900; }
.section-head p,.local-copy p,.contact-copy p,.cyber-section p { color:var(--muted); font-size:17px; margin:18px 0 0; }
.services-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.service-card,.local-cards article,.contact-form,.contact-card { background:#fff; border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow-sm); }
.service-card { position:relative; padding:30px; overflow:hidden; transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.service-card::after { content:""; position:absolute; inset:0 0 auto 0; height:3px; background:linear-gradient(90deg, var(--navy-900), var(--cyan)); opacity:0; transition:opacity .2s ease; }
.service-card:hover { transform:translateY(-5px); box-shadow:var(--shadow-md); border-color:rgba(22,123,154,.28); }
.service-card:hover::after { opacity:1; }
.service-card h3,.local-cards h3 { margin-top:18px; font-size:21px; }
.service-card p,.local-cards p,.process-step p { color:var(--muted); margin:12px 0 0; }

.soft-bg { background:radial-gradient(circle at 10% 10%, rgba(22,123,154,.07), transparent 24%),radial-gradient(circle at 88% 18%, rgba(169,45,98,.05), transparent 26%),var(--soft); }
.process { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.process-step { position:relative; padding:28px; background:#fff; border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow-sm); }
.process-step:not(:last-child)::after { content:""; position:absolute; top:42px; right:-19px; width:20px; height:2px; background:#94b8c5; }
.process-step span { display:inline-grid; place-items:center; width:50px; height:50px; border-radius:16px; color:#fff; background:var(--navy-900); font-weight:900; box-shadow:inset 0 -4px 0 rgba(22,123,154,.22); }
.process-step h3 { margin-top:20px; font-size:22px; }

.cyber-section { position:relative; background:radial-gradient(circle at 82% 28%, rgba(22,123,154,.22), transparent 30%),radial-gradient(circle at 12% 90%, rgba(169,45,98,.16), transparent 28%),var(--navy-950); color:#fff; overflow:hidden; }
.cyber-section::before { content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px); background-size:54px 54px; mask-image:radial-gradient(circle at center,#000 0,transparent 78%); }
.cyber-grid { position:relative; display:grid; grid-template-columns:.9fr 1.1fr; gap:56px; align-items:center; }
.cyber-section h2 { color:#fff; }
.cyber-section p { color:#c9d8f0; margin-bottom:30px; }
.cyber-cards { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
.cyber-cards article { display:grid; grid-template-columns:34px 1fr; gap:10px 14px; min-height:88px; padding:18px; border-radius:18px; background:rgba(255,255,255,.075); border:1px solid rgba(255,255,255,.13); color:#fff; }
.cyber-cards article .micro-icon { grid-row:1 / span 2; margin-top:2px; }
.cyber-cards strong { font-size:16px; }
.cyber-cards small { color:#c9d8f0; font-size:13px; }

.local-grid { display:grid; grid-template-columns:.85fr 1.15fr; gap:46px; align-items:start; }
.local-cards { display:grid; gap:18px; }
.local-cards article { padding:26px; }

.contact-section { background:radial-gradient(circle at 20% 20%, rgba(22,123,154,.18), transparent 28%),radial-gradient(circle at 80% 80%, rgba(169,45,98,.10), transparent 26%),var(--navy-950); color:#fff; }
.contact-grid { display:grid; grid-template-columns:.82fr 1.18fr; gap:50px; align-items:start; }
.contact-copy h2 { color:#fff; }
.contact-copy p { color:#c9d8f0; }
.contact-card { margin-top:28px; padding:24px; display:grid; gap:16px; background:rgba(255,255,255,.075); border-color:rgba(255,255,255,.13); box-shadow:none; }
.contact-card div { display:grid; gap:2px; }
.contact-card strong { color:#95d3e4; font-size:13px; text-transform:uppercase; letter-spacing:.1em; }
.contact-card a,.contact-card span { color:#fff; }
.contact-form { padding:28px; }
.form-row { display:grid; gap:8px; margin-bottom:18px; }
.form-row.two { grid-template-columns:repeat(2,1fr); gap:16px; }
label { color:var(--navy-950); font-weight:850; font-size:14px; }
input,textarea,select { width:100%; border:1px solid var(--line); border-radius:14px; padding:13px 14px; color:var(--ink); background:#fff; outline:none; transition:border-color .2s ease, box-shadow .2s ease; }
textarea { resize:vertical; }
input:focus,textarea:focus,select:focus { border-color:var(--cyan); box-shadow:0 0 0 4px rgba(22,123,154,.12); }
.form-btn { width:100%; border:none; }
.form-hint { color:var(--muted); font-size:13px; text-align:center; margin:14px 0 0; }

.site-footer { background:var(--navy-950); color:#fff; border-top:4px solid #0f5b74; padding:40px 0 34px; }
.footer-grid { display:grid; grid-template-columns:1.15fr .85fr; gap:28px; align-items:center; }
.site-footer img { width:220px; padding:10px 14px; background:#fff; border-radius:14px; }
.site-footer p { color:#c9d8f0; margin:16px 0 6px; }
.site-footer strong { color:#fff; }
.footer-links { display:grid; gap:10px; justify-items:end; color:#d9e6f8; }
.footer-links a:hover,.footer-bottom a:hover { color:#95d3e4; }
.footer-bottom { grid-column:1/-1; padding-top:26px; margin-top:10px; border-top:1px solid rgba(255,255,255,.12); display:flex; justify-content:space-between; gap:20px; color:#9fb3ce; font-size:14px; }

.reveal { opacity:0; transform:translateY(18px); transition:opacity .65s ease, transform .65s ease; }
.reveal.visible { opacity:1; transform:translateY(0); }

@media (max-width:1040px) {
  .main-nav { position:fixed; inset:76px 18px auto 18px; display:none; flex-direction:column; align-items:stretch; gap:4px; padding:18px; border-radius:22px; background:#fff; border:1px solid var(--line); box-shadow:var(--shadow-md); }
  .main-nav.open { display:flex; }
  .main-nav a { padding:12px; }
  .nav-toggle { display:flex; }
  .hero-grid,.cyber-grid,.local-grid,.contact-grid { grid-template-columns:1fr; }
  .hero::before { width:72%; height:110px; }
  .services-grid { grid-template-columns:repeat(2,1fr); }
  .process { grid-template-columns:repeat(2,1fr); }
  .process-step::after { display:none; }
}
@media (max-width:720px) {
  .container { width:min(100% - 28px,var(--container)); }
  .section-pad { padding:70px 0; }
  .brand img { width:202px; }
  .hero { padding-top:60px; min-height:auto; }
  .hero::before { right:-240px; width:100%; height:80px; opacity:.9; }
  .hero::after { right:30px; width:220px; }
  .hero-grid { gap:36px; }
  h1 { font-size:clamp(38px,13vw,54px); }
  .hero-lead { font-size:17px; }
  .hero-proof,.trust-grid,.services-grid,.process,.cyber-cards,.form-row.two,.footer-grid { grid-template-columns:1fr; }
  .trust-grid div,.trust-grid div:last-child { border:none; border-bottom:1px solid rgba(255,255,255,.12); }
  .score-card { grid-template-columns:1fr; }
  .mini-metrics { grid-template-columns:1fr; }
  .footer-links { justify-items:start; }
  .footer-bottom { flex-direction:column; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  .reveal,.btn,.service-card { transition:none; }
  .btn:hover,.service-card:hover { transform:none; }
}


/* ============================
   Ajustes v3 - Ley 21.719 y nuevo panel hero
   ============================ */

.diagnostic-panel {
  padding: 26px;
}

.diagnostic-panel::before {
  height: 4px;
  background: linear-gradient(90deg, var(--navy-900), #126b94);
}

.diagnostic-visual {
  position: relative;
  margin-top: 24px;
  padding: 22px;
  display: grid;
  grid-template-columns: 74px 1fr;
  gap: 18px;
  align-items: center;
  border-radius: 24px;
  background:
    radial-gradient(circle at 80% 0%, rgba(22,123,154,.16), transparent 36%),
    linear-gradient(135deg, #071b3a, #0b2854);
  color: #fff;
  overflow: hidden;
}

.diagnostic-visual::after {
  content: "";
  position: absolute;
  right: -46px;
  bottom: -54px;
  width: 160px;
  height: 160px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.03);
}

.visual-shield {
  width: 74px;
  height: 74px;
  display: grid;
  place-items: center;
  border-radius: 22px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.14);
}

.visual-shield .icon {
  width: 38px;
  height: 38px;
  color: #b9d9e4;
}

.visual-copy {
  position: relative;
  z-index: 1;
}

.visual-copy strong {
  display: block;
  color: #fff;
  font-size: 20px;
  line-height: 1.12;
  letter-spacing: -.02em;
}

.visual-copy p {
  margin: 8px 0 0;
  color: #c9d8f0;
  font-size: 14px;
}

.focus-list {
  margin-top: 16px;
  display: grid;
  gap: 10px;
}

.focus-list article {
  display: grid;
  grid-template-columns: 42px 1fr;
  gap: 12px;
  align-items: center;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
}

.focus-number {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  background: #eef4fa;
  color: var(--navy-900);
  font-weight: 900;
  font-size: 13px;
}

.focus-list strong {
  display: block;
  color: var(--navy-950);
  font-size: 15px;
}

.focus-list small {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 12.5px;
}

.law-note {
  margin-top: 16px;
  padding: 15px 16px;
  border-radius: 18px;
  background: linear-gradient(90deg, rgba(169,45,98,.08), rgba(22,123,154,.08));
  border: 1px solid rgba(22,123,154,.18);
}

.law-note span {
  display: inline-flex;
  padding: 5px 9px;
  border-radius: 999px;
  background: #fff;
  border: 1px solid var(--line);
  color: var(--navy-900);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.law-note p {
  margin: 8px 0 0;
  color: #445066;
  font-size: 13px;
  line-height: 1.42;
}

.law-strip {
  background: #fff;
  border-bottom: 1px solid var(--line);
}

.law-strip-grid {
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 28px;
  align-items: center;
  padding: 26px 0;
}

.law-strip-grid > div {
  display: grid;
  gap: 8px;
}

.law-badge {
  width: fit-content;
  display: inline-flex;
  align-items: center;
  padding: 6px 10px;
  border-radius: 999px;
  background: #eef4fa;
  color: var(--navy-900);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .08em;
  border: 1px solid var(--line);
}

.law-strip strong {
  color: var(--navy-950);
  font-size: 22px;
  line-height: 1.16;
  letter-spacing: -.025em;
}

.law-strip p {
  margin: 0;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.5;
}

/* Baja levemente el protagonismo del hero proof para que el nuevo panel respire mejor */
.hero-proof div {
  padding: 16px;
}

/* Ajuste móvil */
@media (max-width: 1040px) {
  .law-strip-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }
}

@media (max-width: 720px) {
  .diagnostic-visual {
    grid-template-columns: 1fr;
  }

  .visual-shield {
    width: 64px;
    height: 64px;
  }

  .law-strip-grid {
    padding: 22px 0;
  }
}


/* ============================
   Ajustes v4 - Home moderno + sección Ley 21.719
   ============================ */

.hero {
  isolation: isolate;
}

.particle-canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
  opacity: .55;
  pointer-events: none;
}

.tech-grid {
  z-index: 0;
}

.hero-grid {
  z-index: 2;
}

.hero::before,
.hero::after {
  z-index: 1;
}

.hero-copy,
.security-panel {
  position: relative;
  z-index: 3;
}

.diagnostic-panel .panel-top h2 {
  max-width: 330px;
}

.diagnostic-visual {
  background:
    radial-gradient(circle at 92% 0%, rgba(22,123,154,.18), transparent 36%),
    linear-gradient(135deg, #071b3a 0%, #0b2854 72%, #12366c 100%);
}

.visual-copy strong {
  font-size: 19px;
}

/* Nueva sección catálogo Ley 21.719 */
.data-law-section {
  position: relative;
  padding: 86px 0;
  background:
    radial-gradient(circle at 12% 22%, rgba(22,123,154,.10), transparent 30%),
    radial-gradient(circle at 90% 70%, rgba(169,45,98,.08), transparent 26%),
    #ffffff;
  border-bottom: 1px solid var(--line);
}

.data-law-section::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 6px;
  background: linear-gradient(180deg, var(--navy-900), var(--cyan));
  opacity: .95;
}

.data-law-grid {
  display: grid;
  grid-template-columns: .72fr 1.28fr;
  gap: 48px;
  align-items: start;
}

.data-law-copy {
  position: sticky;
  top: 104px;
}

.data-law-copy h2 {
  font-size: clamp(30px, 3.4vw, 46px);
}

.data-law-copy p {
  margin: 18px 0 26px;
  color: var(--muted);
  font-size: 16px;
}

.data-law-catalog {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 18px;
}

.data-law-catalog article {
  min-height: 190px;
  padding: 24px;
  border-radius: 22px;
  background: #fff;
  border: 1px solid var(--line);
  box-shadow: var(--shadow-sm);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.data-law-catalog article:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-md);
  border-color: rgba(22,123,154,.26);
}

.data-law-catalog .micro-icon {
  width: 36px;
  height: 36px;
  padding: 8px;
  border-radius: 14px;
  color: var(--navy-900);
  background: #eef4fa;
  border: 1px solid var(--line);
}

.data-law-catalog h3 {
  margin-top: 18px;
  font-size: 20px;
}

.data-law-catalog p {
  margin: 10px 0 0;
  color: var(--muted);
  font-size: 14px;
}

/* Reduce el strip anterior para que no compita con el catálogo */
.law-strip {
  display: none;
}

@media (max-width: 1040px) {
  .data-law-grid {
    grid-template-columns: 1fr;
  }

  .data-law-copy {
    position: static;
  }
}

@media (max-width: 720px) {
  .data-law-section {
    padding: 70px 0;
  }

  .data-law-catalog {
    grid-template-columns: 1fr;
  }

  .particle-canvas {
    opacity: .38;
  }
}

@media (prefers-reduced-motion: reduce) {
  .particle-canvas {
    display: none;
  }
}


/* ============================
   Ajustes v6 - Íconos más visibles, pero limpios
   ============================ */

/* Se corrige el intento anterior: menos decoración, mejor contraste y más aire */
.service-card .card-icon,
.local-cards .card-icon {
  width: 52px;
  height: 52px;
  padding: 12px;
  border-radius: 16px;
  color: var(--navy-900);
  background: #eef6f9;
  border: 1px solid rgba(22, 123, 154, .26);
  box-shadow: none;
}

/* Sin pestañas laterales ni efectos que ensucien el diseño */
.service-card .card-icon::after,
.local-cards .card-icon::after {
  display: none;
}

/* Un acento superior muy sutil en cada tarjeta, no en el ícono */
.service-card {
  background:
    linear-gradient(#ffffff, #ffffff) padding-box,
    linear-gradient(135deg, rgba(7, 27, 58, .10), rgba(22, 123, 154, .18)) border-box;
}

.service-card:hover .card-icon {
  background: #e8f3f7;
  border-color: rgba(22, 123, 154, .42);
}

/* Variaciones suaves por servicio: visibles, pero sobrias */
.service-card:nth-child(1) .card-icon {
  color: #0b2854;
  background: #edf3f8;
  border-color: rgba(11, 40, 84, .24);
}

.service-card:nth-child(2) .card-icon {
  color: #126b94;
  background: #eaf6fa;
  border-color: rgba(18, 107, 148, .28);
}

.service-card:nth-child(3) .card-icon {
  color: #071b3a;
  background: #eef2f8;
  border-color: rgba(7, 27, 58, .26);
}

.service-card:nth-child(4) .card-icon {
  color: #8d315f;
  background: #f8edf3;
  border-color: rgba(141, 49, 95, .22);
}

.service-card:nth-child(5) .card-icon {
  color: #0e5f73;
  background: #eaf5f7;
  border-color: rgba(14, 95, 115, .25);
}

.service-card:nth-child(6) .card-icon {
  color: #92572c;
  background: #f8f1ea;
  border-color: rgba(146, 87, 44, .22);
}

/* Íconos Ley 21.719: limpios, perceptibles y consistentes */
.data-law-catalog .micro-icon {
  width: 38px;
  height: 38px;
  padding: 9px;
  border-radius: 14px;
  color: var(--navy-900);
  background: #eef6f9;
  border: 1px solid rgba(22, 123, 154, .26);
  box-shadow: none;
}

/* La sección Ley 21.719 queda más equilibrada visualmente */
.data-law-catalog article {
  min-height: 178px;
}

.data-law-catalog h3 {
  margin-top: 16px;
}

/* Íconos sobre fondo oscuro: más contraste sin ruido */
.cyber-cards .micro-icon {
  color: #dff5fb;
  opacity: 1;
}

.cyber-cards article {
  background: rgba(255, 255, 255, .075);
}

@media (max-width: 720px) {
  .service-card .card-icon,
  .local-cards .card-icon {
    width: 50px;
    height: 50px;
  }
}


/* ============================
   Ajustes v7 - Íconos de alto contraste
   ============================ */

/* Corrección directa: los íconos ya no quedan gris claro. 
   Se usa fondo navy/teal sobrio y símbolo blanco para máxima lectura. */
.service-card .card-icon,
.local-cards .card-icon {
  width: 52px;
  height: 52px;
  padding: 12px;
  border-radius: 16px;
  color: #ffffff !important;
  background: #071b3a !important;
  border: 1px solid rgba(7, 27, 58, .12) !important;
  box-shadow: 0 10px 22px rgba(7, 27, 58, .14) !important;
  opacity: 1 !important;
}

/* Se eliminan decoraciones laterales que puedan distraer */
.service-card .card-icon::after,
.local-cards .card-icon::after {
  display: none !important;
}

/* Pequeña diferenciación por servicio, siempre con alto contraste */
.service-card:nth-child(1) .card-icon {
  background: #071b3a !important;
}

.service-card:nth-child(2) .card-icon {
  background: #0b4f6c !important;
}

.service-card:nth-child(3) .card-icon {
  background: #10294f !important;
}

.service-card:nth-child(4) .card-icon {
  background: #7a315d !important;
}

.service-card:nth-child(5) .card-icon {
  background: #0e5f73 !important;
}

.service-card:nth-child(6) .card-icon {
  background: #8a4a25 !important;
}

.service-card:hover .card-icon,
.local-cards article:hover .card-icon {
  transform: translateY(-2px);
  box-shadow: 0 14px 28px rgba(7, 27, 58, .18) !important;
}

/* Íconos Ley 21.719: también con contraste real, pero un poco más pequeños */
.data-law-catalog .micro-icon {
  width: 40px;
  height: 40px;
  padding: 9px;
  border-radius: 14px;
  color: #ffffff !important;
  background: #071b3a !important;
  border: 1px solid rgba(7, 27, 58, .12) !important;
  box-shadow: 0 8px 18px rgba(7, 27, 58, .12) !important;
  opacity: 1 !important;
}

.data-law-catalog article:nth-child(2) .micro-icon {
  background: #0b4f6c !important;
}

.data-law-catalog article:nth-child(3) .micro-icon {
  background: #10294f !important;
}

.data-law-catalog article:nth-child(4) .micro-icon {
  background: #7a315d !important;
}

.data-law-catalog article:nth-child(5) .micro-icon {
  background: #0e5f73 !important;
}

.data-law-catalog article:nth-child(6) .micro-icon {
  background: #8a4a25 !important;
}

/* Íconos en ciberseguridad ya están sobre fondo oscuro: se dejan claros y visibles */
.cyber-cards .micro-icon {
  color: #ffffff !important;
  opacity: 1 !important;
}


/* ============================
   Ajustes v8 - Fondo hero con más estilo
   ============================ */

/* Más presencia visual, manteniendo sobriedad */
.hero {
  background:
    radial-gradient(circle at 12% 18%, rgba(22,123,154,.18), transparent 30%),
    radial-gradient(circle at 82% 12%, rgba(169,45,98,.13), transparent 26%),
    radial-gradient(circle at 68% 72%, rgba(31,95,159,.10), transparent 24%),
    linear-gradient(180deg, #fbfdff 0%, #f4f8fc 100%);
}

.hero::before {
  background: linear-gradient(90deg, #071b3a 0%, #0b2854 72%, #12366c 100%);
  box-shadow: inset 0 -5px 0 rgba(22,123,154,.16);
}

.hero::after {
  width: 420px;
  height: 10px;
  background: linear-gradient(90deg, rgba(169,45,98,.9), rgba(183,103,45,.76) 38%, rgba(22,123,154,.92));
  opacity: .92;
  filter: drop-shadow(0 4px 10px rgba(22,123,154,.18));
}

.tech-grid {
  opacity: .46;
  background-size: 48px 48px;
}

.particle-canvas {
  opacity: .92;
  filter: saturate(1.06);
}

.hero-copy,
.security-panel {
  backdrop-filter: blur(1px);
}

/* Un leve brillo atmosférico detrás del contenido */
.hero-grid::before {
  content: "";
  position: absolute;
  right: 8%;
  top: 14%;
  width: 420px;
  height: 420px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(22,123,154,.11), rgba(22,123,154,0) 68%);
  z-index: 1;
  pointer-events: none;
}

.hero-grid {
  position: relative;
}

@media (max-width: 720px) {
  .particle-canvas {
    opacity: .72;
  }

  .hero-grid::before {
    width: 240px;
    height: 240px;
    right: -10%;
    top: 10%;
  }
}


/* ============================
   Ajustes v9 - Formulario PHP
   ============================ */

.hp-field {
  position: absolute !important;
  left: -9999px !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.form-status {
  display: none;
  margin-top: 12px;
  padding: 13px 14px;
  border-radius: 14px;
  font-size: 14px;
  font-weight: 750;
  line-height: 1.35;
}

.form-status.success {
  display: block;
  color: #0f5132;
  background: #eaf7f0;
  border: 1px solid #badbcc;
}

.form-status.error {
  display: block;
  color: #842029;
  background: #f8d7da;
  border: 1px solid #f1aeb5;
}

.form-status.info {
  display: block;
  color: var(--navy-900);
  background: #eef4fa;
  border: 1px solid var(--line);
}

.form-btn:disabled {
  opacity: .72;
  cursor: not-allowed;
  transform: none;
}

/* Estadísticas y verificación: respetan la paleta y tipografía del sitio. */
.form-verification { min-width: 0; margin-top: 6px; }
.form-verification .cf-turnstile { max-width: 100%; }
.form-hint a { color: inherit; text-decoration: underline; }
.form-btn:disabled { opacity: .65; cursor: not-allowed; }
.privacy-settings { padding: 0; border: 0; background: transparent; color: inherit; font: inherit; cursor: pointer; text-decoration: underline; }
.analytics-consent[hidden] { display: none !important; }
.analytics-consent { position: fixed; z-index: 1000; bottom: 18px; left: 18px; right: 18px; max-width: 880px; margin: auto; display: flex; align-items: center; gap: 24px; padding: 20px 24px; border: 1px solid #dfe5ee; border-radius: 16px; background: #fff; color: #071b3a; box-shadow: 0 10px 40px rgba(7,27,58,.18); }
.analytics-consent strong { font-size: 16px; }
.analytics-consent p { margin: 6px 0 0; font-size: 13px; line-height: 1.5; }
.analytics-consent a { color: #167b9a; text-decoration: underline; }
.consent-actions { display: flex; flex-shrink: 0; gap: 10px; }
.consent-actions button { border: 1px solid #071b3a; border-radius: 8px; padding: 10px 16px; background: #fff; color: #071b3a; font: inherit; font-size: 14px; cursor: pointer; }
.consent-actions button:focus-visible, .privacy-settings:focus-visible { outline: 3px solid #167b9a; outline-offset: 3px; }
@media (max-width: 600px) { .analytics-consent { bottom: 12px; left: 12px; right: 12px; padding: 16px; display: block; } .consent-actions { margin-top: 14px; } .consent-actions button { flex: 1; } }

/* Acceso flotante a WhatsApp, con separación del aviso de estadísticas. */
.whatsapp-float {
  position: fixed;
  right: max(24px, env(safe-area-inset-right));
  bottom: calc(24px + env(safe-area-inset-bottom));
  z-index: 900;
  width: 60px;
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 2px solid #fff;
  border-radius: 50%;
  background: #25d366;
  color: #fff;
  box-shadow: 0 5px 20px rgba(7, 27, 58, .24);
  text-decoration: none;
  transition: transform .18s ease, background .18s ease;
}
.whatsapp-float svg { width: 37px; height: 37px; display: block; }
.whatsapp-float:hover { background: #1db954; transform: translateY(-2px); }
.whatsapp-float:focus-visible { outline: 3px solid var(--navy-900); outline-offset: 4px; }
.whatsapp-float.is-editing { visibility: hidden; pointer-events: none; }
@media (max-width: 600px) {
  .whatsapp-float { right: max(16px, env(safe-area-inset-right)); bottom: calc(16px + env(safe-area-inset-bottom)); width: 56px; height: 56px; }
  .whatsapp-float svg { width: 35px; height: 35px; }
}
@media (prefers-reduced-motion: reduce) { .whatsapp-float { transition: none; } }