/* =====================================================================
   site.css · Asesor Landero · sistema de diseño (chat de diseño, 24 oct 2026)
   Tokens, fuentes, base, encabezado, barra de cotizaciones, botones y pie.
   Gesto gráfico único: la diagonal de la flecha del logo (58 grados), usada como barra "/".
   No poner estilos dentro del HTML. Cambios de HTML: los hace el chat de blog (GEO).
   ===================================================================== */

/* ---------- Fuentes alojadas en el sitio (licencia OFL, ver /fonts/) ---------- */
@font-face{font-family:"Public Sans";src:url("/fonts/public-sans-latin-wght-normal.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"Newsreader";src:url("/fonts/newsreader-latin-wght-normal.woff2") format("woff2");font-weight:200 800;font-style:normal;font-display:swap}
@font-face{font-family:"Newsreader";src:url("/fonts/newsreader-latin-wght-italic.woff2") format("woff2");font-weight:200 800;font-style:italic;font-display:swap}

/* ---------- Tokens ---------- */
:root{
  --navy:#0F153F; --navy-hondo:#090C28; --navy-luz:#2A3A8F;
  --verde:#27AE60; --verde-claro:#9FE3BC; --verde-texto:#1C7D45;
  --papel:#FFFFFF; --papel-2:#F3F5F9;
  --texto:#1C2238; --texto-2:#4A5270; --texto-claro:#C9CFE3; --texto-tenue:#8E97B8;
  --linea:#DCE1EB; --linea-oscura:rgba(255,255,255,.12);
  --tinta:#0F153F; --fondo-pie:#090C28; --sombra:rgba(15,21,63,.12);
  --i-whatsapp:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 00-3.48-8.413Z'/%3E%3C/svg%3E");
  --i-x:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M14.234 10.162 22.977 0h-2.072l-7.591 8.824L7.251 0H.258l9.168 13.343L.258 24H2.33l8.016-9.318L16.749 24h6.993zm-2.837 3.299-.929-1.329L3.076 1.56h3.182l5.965 8.532.929 1.329 7.754 11.09h-3.182z'/%3E%3C/svg%3E");
  --i-facebook:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M9.101 23.691v-7.98H6.627v-3.667h2.474v-1.58c0-4.085 1.848-5.978 5.858-5.978.401 0 .955.042 1.468.103a8.68 8.68 0 0 1 1.141.195v3.325a8.623 8.623 0 0 0-.653-.036 26.805 26.805 0 0 0-.733-.009c-.707 0-1.259.096-1.675.309a1.686 1.686 0 0 0-.679.622c-.258.42-.374.995-.374 1.752v1.297h3.919l-.386 2.103-.287 1.564h-3.246v8.245C19.396 23.238 24 18.179 24 12.044c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.628 3.874 10.35 9.101 11.647Z'/%3E%3C/svg%3E");
  --i-threads:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M18.263 11.097c-.03-3.486-1.92-5.586-5.111-5.586-2.13 0-3.922.963-4.863 2.499l2.062 1.438c.535-.843 1.272-1.543 2.628-1.543 1.528 0 2.318.85 2.544 2.431a15 15 0 0 0-2.236-.173c-4.125 0-6.068 1.867-6.068 4.336s1.943 3.99 4.804 3.99c3.139 0 5.013-2.115 5.781-4.735.798.361 1.348 1.204 1.348 2.47 0 3.387-3.907 5.232-7.22 5.232-4.885 0-8.077-3.207-8.077-8.424 0-6.392 4.223-10.487 9.9-10.487 3.808 0 5.69 1.671 6.97 3.914l2.108-1.475C21.44 2.078 18.331 0 13.663 0 6.227 0 1.168 5.277 1.168 12.934c0 7 4.953 11.066 10.856 11.066 4.878 0 9.809-2.846 9.809-7.716 0-2.545-1.46-4.231-3.569-5.187m-6.33 4.855c-1.077 0-2.026-.512-2.026-1.453 0-1.483 1.822-1.934 3.606-1.934.678 0 1.34.045 1.927.173-.422 1.927-1.671 3.215-3.508 3.214Z'/%3E%3C/svg%3E");
  --i-linkedin:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M22.22 0H1.77C.79 0 0 .77 0 1.73v20.54C0 23.23.79 24 1.77 24h20.45c.98 0 1.78-.77 1.78-1.73V1.73C24 .77 23.2 0 22.22 0zM7.12 20.45H3.56V9h3.56v11.45zM5.34 7.43a2.06 2.06 0 1 1 0-4.13 2.06 2.06 0 0 1 0 4.13zm15.11 13.02h-3.56v-5.57c0-1.33-.02-3.04-1.85-3.04-1.85 0-2.14 1.45-2.14 2.94v5.67H9.35V9h3.41v1.56h.05c.48-.9 1.64-1.85 3.37-1.85 3.6 0 4.27 2.37 4.27 5.46v6.28z'/%3E%3C/svg%3E");
  --i-correo:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linejoin='round' stroke-linecap='round'%3E%3Crect x='2.5' y='4.5' width='19' height='15' rx='2.5'/%3E%3Cpath d='M3.5 6.5l8.5 6.5 8.5-6.5'/%3E%3C/svg%3E");
  --i-enlace:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 13.5a4.5 4.5 0 0 0 6.4.4l3-3a4.5 4.5 0 0 0-6.4-6.4l-1.6 1.6'/%3E%3Cpath d='M14 10.5a4.5 4.5 0 0 0-6.4-.4l-3 3a4.5 4.5 0 0 0 6.4 6.4l1.6-1.6'/%3E%3C/svg%3E");
  --i-luna:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.5 14.3A8.5 8.5 0 1 1 9.7 3.5a6.8 6.8 0 0 0 10.8 10.8z'/%3E%3C/svg%3E");
  --i-sol:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='4.2'/%3E%3Cpath d='M12 2.5v2.2M12 19.3v2.2M2.5 12h2.2M19.3 12h2.2M5.3 5.3l1.6 1.6M17.1 17.1l1.6 1.6M5.3 18.7l1.6-1.6M17.1 6.9l1.6-1.6'/%3E%3C/svg%3E");
  --aviso-fondo:#FFF6E0; --aviso-texto:#6B4A00; --error:#A12A1F;
  --sans:"Public Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --serif:"Newsreader",Georgia,"Times New Roman",serif;
  --r:3px;
  --ancho:1200px; --lectura:680px;
  --gl:max(16px,env(safe-area-inset-left,0px)); --gr:max(16px,env(safe-area-inset-right,0px));
  --curva:cubic-bezier(.2,.7,.2,1);
  --flecha-navy:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5.5 16.5 L14 2.9 M8.2 3.6 L14 2.9 L15.1 8.6' fill='none' stroke='%230F153F' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  --flecha-verde:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5.5 16.5 L14 2.9 M8.2 3.6 L14 2.9 L15.1 8.6' fill='none' stroke='%2327AE60' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  --flecha-verde-texto:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5.5 16.5 L14 2.9 M8.2 3.6 L14 2.9 L15.1 8.6' fill='none' stroke='%231C7D45' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* ---------- Base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--papel);color:var(--texto);font-family:var(--sans);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3{text-wrap:balance}
:focus-visible{outline:2px solid var(--verde);outline-offset:3px}
.wrap{max-width:var(--ancho);margin:0 auto;padding-left:var(--gl);padding-right:var(--gr)}
main.wrap{max-width:var(--ancho)}

/* ---------- Encabezado (banda navy en todas las páginas) ---------- */
.site-header{position:relative;background:var(--navy);color:#fff;isolation:isolate;overflow:hidden}
.site-header::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(40% 160% at 95% 0%,rgba(42,58,143,.85),transparent 70%)}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 20px;min-height:72px}
.site-header .wrap > a:first-child{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:#fff;font-weight:800;font-size:17px;letter-spacing:-.015em;min-height:44px}
.site-header .wrap > a:first-child::after{content:"Asesor Landero";content:"Asesor Landero" / ""}
.site-header img{height:32px;width:auto}
/* Logo actual (lienzo de 4951 px con margen transparente): se compensa hasta cambiarlo por /images/marca/isotipo-blanco.png */
.site-header img[src$="ISOLOGO_BLANCO.png"]{height:64px;width:64px;max-width:none;margin:-15px -17px -14px -20px}
/* Menú: enlaces con la barra diagonal */
.menu ul{list-style:none;display:flex;gap:6px 22px;margin:0;padding:0;flex-wrap:wrap}
.menu ul a{display:inline-flex;align-items:center;min-height:44px;text-decoration:none;font-size:14px;font-weight:600;letter-spacing:.02em;color:var(--texto-claro);position:relative}
.menu ul a::before{content:"";width:1.5px;height:12px;background:var(--verde);transform:rotate(32deg);margin-right:9px}
.menu ul a:hover{color:#fff}
.site-header .menu{display:flex;align-items:center;margin-left:auto}
@media (max-width:860px){
  /* En el teléfono el menú baja a una segunda fila deslizable: sin código, sin errores */
  .site-header .menu{order:3;width:100%;border-top:1px solid var(--linea-oscura);overflow-x:auto;scrollbar-width:none}
  .site-header .menu::-webkit-scrollbar{display:none}
  .site-header .menu ul{flex-wrap:nowrap;white-space:nowrap}
  .site-header .menu ul a{font-size:13px;letter-spacing:.1em;text-transform:uppercase;min-height:46px}
}

/* ---------- Botones ---------- */
/* Botón con cuña: texto + cuña diagonal con la flecha del logo. Variante cristal para "Agendar asesoría". */
.cta,.boton-primario,.boton-secundario,.boton,.pie-contacto a{position:relative;display:inline-flex;align-items:center;min-height:52px;padding:0 74px 0 20px;border-radius:var(--r);overflow:hidden;isolation:isolate;text-decoration:none;font:700 15px/1.2 var(--sans);letter-spacing:.01em;white-space:nowrap;cursor:pointer;border:0}
.cta::after,.boton-primario::after,.boton-secundario::after,.boton::after,.pie-contacto a::after{content:"";position:absolute;top:0;right:0;bottom:0;width:58px;clip-path:polygon(30px 0,100% 0,100% 100%,0 100%);background-repeat:no-repeat;background-size:18px 18px;background-position:calc(50% + 8px) 50%;transition:width .35s var(--curva),background-position .35s var(--curva)}
.cta:hover::after,.boton-primario:hover::after,.boton-secundario:hover::after,.boton:hover::after,.pie-contacto a:hover::after{width:70px;background-position:calc(50% + 11px) calc(50% - 3px)}
/* Principal: verde sólido, cuña navy */
.boton-primario,.boton{background:var(--verde);color:var(--navy)}
.boton-primario::after,.boton::after{background-color:var(--navy);background-image:var(--flecha-verde)}
/* Cristal: Agendar asesoría */
.cta,.boton-secundario,.pie-contacto a{color:#fff;background:linear-gradient(135deg,rgba(255,255,255,.20),rgba(255,255,255,.05) 55%,rgba(159,227,188,.12));-webkit-backdrop-filter:blur(14px) saturate(150%);backdrop-filter:blur(14px) saturate(150%);box-shadow:inset 0 1px 0 rgba(255,255,255,.45),inset 0 0 0 1px rgba(255,255,255,.22),inset 0 -10px 18px rgba(39,174,96,.10),0 10px 28px rgba(39,174,96,.18)}
.cta::after,.boton-secundario::after,.pie-contacto a::after{background-color:rgba(39,174,96,.9);background-image:var(--flecha-navy);box-shadow:inset 1px 0 0 rgba(255,255,255,.35)}
.cta::before,.boton-secundario::before,.pie-contacto a::before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(122deg,transparent 30%,rgba(255,255,255,.38) 45%,transparent 58%);transform:translateX(-120%);transition:transform .8s var(--curva)}
.cta:hover::before,.boton-secundario:hover::before,.pie-contacto a:hover::before{transform:translateX(120%)}
/* Cristal sobre fondo claro */
.fondo-claro .cta,.lateral-cta .cta,.cuerpo .cta{background:linear-gradient(135deg,rgba(42,58,143,.92),rgba(15,21,63,.94) 60%,rgba(27,120,80,.85));box-shadow:inset 0 1px 0 rgba(255,255,255,.30),inset 0 0 0 1px rgba(255,255,255,.12),0 10px 26px rgba(15,21,63,.22),0 4px 16px rgba(39,174,96,.20)}
.site-header .cta{min-height:44px;font-size:14px;padding:0 62px 0 16px}
.site-header .cta::after{width:50px;clip-path:polygon(26px 0,100% 0,100% 100%,0 100%);background-position:calc(50% + 7px) 50%}
.site-header .cta:hover::after{width:58px}
@media (max-width:430px){.site-header .wrap{column-gap:8px}.site-header .wrap > a:first-child{font-size:15px;gap:8px}.site-header .cta{padding:0 54px 0 12px;font-size:13px}}
@media (max-width:359px){.site-header .wrap > a:first-child::after{content:none}}
/* Enlace con flecha */
.ver-todo,.enlace-flecha{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-weight:700;color:var(--tinta);text-decoration:none;background:linear-gradient(var(--verde),var(--verde)) 0 calc(100% - 10px)/0 2px no-repeat;transition:background-size .35s var(--curva)}
.ver-todo::after,.enlace-flecha::after{content:"";width:16px;height:16px;background:var(--flecha-verde-texto) no-repeat center/16px;transition:transform .35s var(--curva)}
.ver-todo:hover,.enlace-flecha:hover{background-size:calc(100% - 24px) 2px}
.ver-todo:hover::after,.enlace-flecha:hover::after{transform:translate(2px,-3px)}

/* ---------- Barra de cotizaciones (TradingView) ---------- */
.barra-precios{min-height:46px;background:var(--navy);border-top:1px solid var(--linea-oscura);border-bottom:1px solid var(--linea-oscura)}
.barra-precios .tradingview-widget-container{min-height:46px}
.barra-precios-nota{margin:0;padding:4px var(--gr) 6px var(--gl);font-size:11px;color:var(--texto-tenue);background:var(--navy);max-width:none}
.barra-precios-nota a{color:var(--texto-claro)}

/* ---------- Pie ---------- */
.site-footer{position:relative;background:var(--fondo-pie);color:var(--texto-claro);overflow:hidden;isolation:isolate;font-size:14px}
.site-footer::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(45% 60% at 100% 0%,rgba(39,174,96,.22),transparent 70%)}
.site-footer .wrap{padding-block:40px calc(28px + env(safe-area-inset-bottom,0px))}
.site-footer a{color:var(--texto-claro)}
.site-footer a:hover{color:#fff}
.site-footer h2{font-size:11.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#fff;margin:0 0 10px;display:flex;align-items:center}
.site-footer h2::before{content:"";width:1.5px;height:11px;background:var(--verde);transform:rotate(32deg);margin-right:9px}
.site-footer ul{list-style:none;margin:0;padding:0}
.site-footer ul a{display:inline-flex;align-items:center;min-height:40px;text-decoration:none}
.site-footer ul a:hover{text-decoration:underline;text-underline-offset:4px}
.site-footer::after{content:"Asesor Landero";content:"Asesor Landero" / "";display:block;max-width:var(--ancho);margin:0 auto;padding:0 var(--gr) 0 var(--gl);font-size:clamp(40px,12.2vw,158px);font-weight:800;letter-spacing:-.06em;line-height:.8;white-space:nowrap;color:transparent;background:linear-gradient(180deg,rgba(255,255,255,.16),rgba(255,255,255,.02));-webkit-background-clip:text;background-clip:text;user-select:none;pointer-events:none;transform:translateY(12%)}

/* ---------- Avisos ---------- */
.aviso{margin:28px 0;background:var(--aviso-fondo);color:var(--aviso-texto);border-radius:var(--r);padding:14px 16px;font-size:13.5px;line-height:1.55}


@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important}.cta::before,.boton-secundario::before{display:none}}

/* Imágenes optimizadas (WebP con <picture>): el contenedor no altera el diseño */
picture{display:contents}
/* Menú con 5 secciones (31 oct 2026): en pantallas medianas se compacta para que el botón de agendar no baje a otra línea */
@media (min-width:861px) and (max-width:1020px){.menu ul{gap:6px 14px}.menu ul a::before{display:none}}