:root{
--azul-900:#0a1433;
--azul-800:#0f2966;
--azul-700:#1a47a5;
--azul-600:#2466e3;
--celeste:#35c6ff;
--verde:#00c389;
--texto:#0b1430;
--muted:#6b78a6;
--borde:#e3e9ff;
--chip:#f2f6ff;
--bg-hero: radial-gradient(1200px 800px at 80% -10%,rgba(255,255,255,.14),transparent 60%),
linear-gradient(135deg,var(--azul-900) 0%, var(--azul-700) 55%, var(--azul-600) 100%);
}
html,body{
height:100%
}
body{
font-family:system-ui,-apple-system,"Segoe UI",Inter,Roboto,Arial,sans-serif;
background:#f7f9ff;
color:var(--texto)
}
.topbar{
background:#07122b;
color:#cfe1ff;
font-size:.9rem
}
.navbar{
background:#0a173b
}
.navbar .nav-link{
color:#dfe8ff!important;
opacity:.92
}
.navbar .nav-link:hover,.navbar .nav-link:focus{
opacity:1
}
.btn-primary{
--bs-btn-bg:var(--azul-600);
--bs-btn-border-color:var(--azul-600)
}
.btn-primary:hover{
--bs-btn-bg:#1a56c7;
--bs-btn-border-color:#1a56c7
}
.btn-success{
--bs-btn-bg:var(--verde);
--bs-btn-border-color:var(--verde)
}
.underline{
position:relative
}
.underline::after{
content:"";
position:absolute;
left:0;
bottom:-6px;
width:42px;
height:4px;
border-radius:4px;
background:linear-gradient(90deg,var(--celeste),transparent)
}

/* ===== Hero ===== */
header.hero{
background:var(--bg-hero);
color:#fff;
position:relative;
overflow:hidden
}
.search-wrap{
background:#fff;
border-radius:16px;
box-shadow:0 22px 55px rgba(10,30,80,.25)
}
.search-wrap input{
border:none;
height:58px;
font-size:18px
}
.tlds .badge{
background:var(--chip);
color:var(--azul-700);
border:1px solid var(--borde);
font-weight:600
}

/* ===== Mega menú ===== */
.dropdown.position-static{
position:static
}/* ancho completo en desktop */
.mega-menu{
left:0;
right:0;
top:100%;
border:0;
border-top:1px solid var(--borde);
border-radius:0;
padding:1.25rem 0;
background:#fff;
box-shadow:0 24px 60px rgba(12,20,60,.18);
}
.mega-title{
text-transform:uppercase;
letter-spacing:.04em;
font-size:.78rem;
color:#7b8ab7;
font-weight:700;
margin-bottom:.5rem
}
.mega-item{
display:flex;
gap:12px;
align-items:start;
padding:10px 10px;
border-radius:12px;
text-decoration:none;
color:var(--texto);
}
.mega-item:hover{
background:#f5f8ff
}
.mega-ico{
width:44px;
height:44px;
border-radius:12px;
display:grid;
place-items:center;
flex:0 0 44px;
background:linear-gradient(135deg,#e9f1ff,#ffffff);
box-shadow:inset 0 0 0 1px var(--borde);
font-size:18px;
color:#1a47a5;
}
.mega-item small{
display:block;
color:var(--muted)
}

/* Desktop: hover abre; Mobile: lo maneja JS (accordion dentro del menú) */
@media (min-width: 992px){
.navbar .dropdown:hover>.dropdown-menu{
display:block;
}
.navbar .dropdown-toggle::after{
transform:translateY(1px)
}
}
/* Mobile: mega como bloque apilado */
@media (max-width: 991.98px){
.mega-menu{
position:static;
box-shadow:none;
border-top:1px solid var(--borde);
padding:.75rem 0
}
.mega-col{
margin-bottom:.75rem
}
.nav-accordion .accordion-button{
background:#0f1f4a;
color:#dfe8ff
}
.nav-accordion .accordion-body{
background:#fff
}
}

/* ===== Planes ===== */
.plan{
border:1px solid var(--borde);
border-radius:18px;
background:#fff;
box-shadow:0 10px 30px rgba(13,32,84,.06);
transition:.2s
}
.plan:hover{
transform:translateY(-4px);
box-shadow:0 18px 44px rgba(13,32,84,.12)
}
.plan.pop{
border-color:var(--azul-600);
box-shadow:0 18px 44px rgba(34,102,227,.18)
}
.price{
font-weight:800;
font-size:40px;
color:var(--azul-800)
}
.features li{
margin:.35rem 0
}

/* Toggle precios */
.toggle{
display:inline-flex;
gap:4px;
padding:4px;
border:1px solid var(--borde);
border-radius:999px;
background:#f5f8ff
}
.toggle button{
border:0;
border-radius:999px;
padding:.4rem .9rem;
font-weight:700
}
.toggle .on{
background:#fff;
color:#0a1a3f;
box-shadow:0 2px 10px rgba(0,0,0,.08)
}

/* ===== Features ===== */
.feature{
border:1px solid var(--borde);
border-radius:16px;
background:#fff;
padding:24px;
height:100%
}
.iconbox{
width:48px;
height:48px;
border-radius:12px;
display:grid;
place-items:center;
background:linear-gradient(135deg,#e8f1ff,#ffffff);
color:#1847a8;
box-shadow:inset 0 0 0 1px var(--borde)
}
.check{
color:#00b67a
}

/* ===== Footer ===== */
footer{
background:#0a1330;
color:#bcd2ff
}
footer a{
color:#e7f0ff;
text-decoration:none
}
footer a:hover{
text-decoration:underline
}
/* Quita el recuadro/halo de foco azul en los links del nav */
.navbar .dropdown-toggle:focus,
.navbar .dropdown-toggle:focus-visible,
.navbar .nav-link:focus,
.navbar .nav-link:focus-visible {
outline: 0 !important;
box-shadow: none !important;
}
/* ==== Mejora visual precios (anual + mensual) ==== */
.plan .price {
line-height: 1.05;
letter-spacing: -.3px;
}

/* Anual: arriba, sólido y claro */
.plan .price:first-of-type{
font-size: 34px;
font-weight: 800;
color: var(--azul-800);
margin-bottom: 8px;
}
.plan .price:first-of-type .small{
display: block;
margin-top: 6px;
font-size: 14px;
font-weight: 700;
text-transform: uppercase;
color: var(--muted);
letter-spacing: .4px;
}

/* Mensual: tarjeta destacada en verde */
.plan .price + .price{
font-size: 36px;
font-weight: 900;
color: var(--verde);
margin-top: 14px;
padding: 14px 16px;
border-radius: 14px;
background: linear-gradient(180deg,#f4fff9, #ffffff);
box-shadow: inset 0 0 0 1px var(--borde), 0 10px 24px rgba(0,0,0,.05);
}
.plan .price + .price .small{
font-size: 16px;
font-weight: 700;
color: var(--azul-800);
}

/* Símbolo AR$ consistente (si usás .simbolo) */
.plan .price .simbolo::before{
content:"AR$ ";
font-weight: 900;
margin-right: 2px;
}
/* ==== Estilos bloque beneficios premium ==== */
.beneficios-premium{
--bp-bg: #0b1537;
--bp-card: rgba(255,255,255,.04);
--bp-border: rgba(255,255,255,.10);
--bp-ico: #7fb3ff;
--bp-text: #e8efff;
--bp-muted: #9fb0d9;
background: radial-gradient(900px 600px at 10% -10%, rgba(255,255,255,.08), transparent 60%), var(--bp-bg);
border-top: 1px solid rgba(255,255,255,.06);
border-bottom: 1px solid rgba(0,0,0,.2);
}
.beneficios-premium .bp-image img{
display:block;
}
.beneficios-premium .text-white{
color: var(--bp-text)!important;
}
.beneficios-premium .text-bp-muted{
color: var(--bp-muted)!important;
}

.beneficios-premium .benef-card{
display:flex;
gap:12px;
align-items:flex-start;
padding:14px 16px;
border-radius:16px;
background: var(--bp-card);
border: 1px solid var(--bp-border);
box-shadow: 0 10px 28px rgba(0,0,0,.18);
}
.beneficios-premium .benef-card .ico{
width:42px;
height:42px;
flex:0 0 42px;
display:grid;
place-items:center;
border-radius:12px;
background: linear-gradient(135deg, rgba(127,179,255,.22), rgba(255,255,255,.06));
box-shadow: inset 0 0 0 1px rgba(127,179,255,.25);
color: var(--bp-ico);
font-size:18px;
}
.beneficios-premium .benef-card .tit{
color: var(--bp-text);
font-weight:800;
letter-spacing:.2px;
}
.beneficios-premium .benef-card .sub{
color: var(--bp-muted);
font-size:.95rem;
margin-top:2px;
}
/* Igualar alto de cards en Beneficios */
.beneficios-premium .col-sm-6{
display:flex;
}
.beneficios-premium .benef-card{
flex:1;
height:100%;
min-height: 92px;
}
/* ===== Banner Garantía 15 días ===== */
.g15{
background:
radial-gradient(900px 500px at -10% 10%, rgba(255,255,255,.09), transparent 60%),
linear-gradient(135deg, var(--azul-900), var(--azul-700));
border-radius: 20px;
color:#eaf1ff;
}
.g15-body{
display:flex;
align-items:center;
gap:18px;
padding:24px;
}
.g15-ico{
width:64px;
height:64px;
flex:0 0 64px;
display:grid;
place-items:center;
border-radius:16px;
background:linear-gradient(135deg, rgba(255,255,255,.18), rgba(255,255,255,.06));
box-shadow: inset 0 0 0 1px rgba(255,255,255,.25);
font-size:28px;
color:#bfe0ff;
}
.g15-text{
line-height:1.25
}
.g15-badge{
display:inline-block;
font-size:.8rem;
font-weight:700;
letter-spacing:.4px;
padding:4px 10px;
border-radius:999px;
color:#0b1537;
background:#7fd0ff;
margin-bottom:6px;
}
.g15-title{
margin:0;
font-size:1.4rem;
font-weight:800;
color:#ffffff;
}
.g15-title strong{
color:#7fd0ff;
}
.g15-sub{
margin:.25rem 0 0;
color:#cfe2ff;
font-weight:600;
}
.g15-legal{
margin:.35rem 0 0;
color:#9fb0d9;
font-size:.9rem;
}

/* Responsive */
@media (max-width: 575.98px){
.g15-body{
padding:18px;
}
.g15-ico{
width:56px;
height:56px;
font-size:24px;
}
.g15-title{
font-size:1.15rem;
}
}
.site-footer{
--sf-bg:#0b1321;
--sf-card:#0f1828;
--sf-text:#dbe6ff;
--sf-muted:#9fb0d9;
--sf-border:#1f2a3e;
--sf-chip:#0f2237;
--sf-accent:#14c3a1
}
.site-footer{
background:radial-gradient(900px 600px at -10% -20%,rgba(255,255,255,.06),transparent 60%),var(--sf-bg);
color:var(--sf-text);
border-top:1px solid rgba(255,255,255,.06)
}
.site-footer a{
color:var(--sf-text);
text-decoration:none
}
.site-footer a:hover{
opacity:.9;
text-decoration:underline
}
.sf-col h6{
font-weight:800;
letter-spacing:.3px;
margin-bottom:.6rem
}
.sf-list{
list-style:none;
padding:0;
margin:0
}
.sf-list li{
margin:.45rem 0
}
.sf-list i{
opacity:.9;
margin-right:.55rem
}
.sf-chip{
display:inline-flex;
align-items:center;
gap:.45rem;
background:var(--sf-chip);
border:1px solid var(--sf-border);
color:var(--sf-text);
border-radius:999px;
padding:.45rem .75rem;
font-weight:600
}
.sf-badge{
display:inline-flex;
align-items:center;
gap:.45rem;
background:rgba(20,195,161,.12);
border:1px solid rgba(20,195,161,.35);
color:var(--sf-accent);
border-radius:.6rem;
padding:.5rem .7rem;
font-weight:700
}
.sf-social a{
display:inline-grid;
place-items:center;
width:38px;
height:38px;
border-radius:50%;
background:var(--sf-card);
border:1px solid var(--sf-border);
margin-right:.35rem
}
.sf-muted{
color:var(--sf-muted)
}
.sf-card{
background:var(--sf-card);
border:1px solid var(--sf-border);
border-radius:14px;
padding:.6rem .8rem;
display:inline-flex;
gap:.5rem;
align-items:center
}
.sf-bottom{
border-top:1px solid var(--sf-border)
}
.pay-ico{
opacity:.7;
filter:grayscale(30%)
}

/* Hero Section */
.hero-section-int {
    padding: 60px 0;
    background: linear-gradient(135deg, #cfe2ff 0%, #e5efff 100%);
    border-bottom: 1px solid #b3ccf2;
}

.hero-section-int .breadcrumb {
    background: transparent;
    padding: 0;
    margin-bottom: 12px;
}

.hero-section-int .breadcrumb-item + .breadcrumb-item::before {
    color: #497ac7;
}

.hero-section-int .breadcrumb a {
    color: #2361c6;
    font-weight: 600;
    text-decoration: none;
}

.hero-section-int .breadcrumb a:hover {
    color: #0e3e8a;
}

.titulo-sec {
    font-size: 2.2rem;
    font-weight: 800;
    color: #0a2a55;
    margin-bottom: 8px;
}

.sub-sec {
    color: #345b89;
    font-size: 1.05rem;
    max-width: 620px;
}