/* ===== Fuentes (alojadas en el sitio, sin servicios externos) ===== */
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/plus-jakarta-sans-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/plus-jakarta-sans-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/plus-jakarta-sans-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/plus-jakarta-sans-latin-700-normal.woff2) format('woff2')}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:800;font-display:swap;src:url(/assets/fonts/plus-jakarta-sans-latin-800-normal.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/ibm-plex-mono-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/ibm-plex-mono-latin-500-normal.woff2) format('woff2')}

/* ===== Base ===== */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:16px}
body{margin:0;background:#F2F5F9;color:#0A1430;font-family:'Plus Jakarta Sans',system-ui,-apple-system,'Segoe UI',sans-serif;overflow-x:hidden}
img{max-width:100%}
a{color:#1748D6;text-decoration:none}
a:hover{color:#0B2E9E}
a:focus-visible,button:focus-visible{outline:2px solid #4CC9F0;outline-offset:3px;border-radius:2px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:absolute;left:16px;top:-60px;z-index:100;background:#FFFFFF;color:#040B24;padding:10px 16px;font-weight:600;border-radius:2px}
.skip-link:focus{top:12px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none !important}}

/* ===== Home: filas de casos ===== */
.case-row{transition:background-color .25s ease,padding .25s ease}
.case-row:hover{background-color:#FFFFFF;padding-left:16px !important;padding-right:16px !important}
.case-row:hover .case-go{color:#1748D6}
.navlink:hover,.lang-link:hover{color:#FFFFFF !important}

/* ===== Home: línea de tiempo ===== */
.tl>div{min-width:0}
@media (max-width:640px){.tl{grid-template-columns:16px minmax(0,1fr) !important;row-gap:4px}.tl>div{grid-column:2}}

/* ===== Home: marcas ===== */
@media (max-width:640px){.brand-row{justify-content:center !important;gap:36px 44px !important}.brand-logo{transform:scale(.88)}}

/* ===== Caso Mastercard: esquema DCO ===== */
.flow{display:grid;grid-template-columns:minmax(0,1fr) 28px minmax(0,1fr) 28px minmax(0,1fr) 28px minmax(0,1fr);align-items:stretch}
.flow .arr{display:flex;align-items:center;justify-content:center;color:#9DB3E0;font-size:20px}
@media (max-width:760px){.flow{grid-template-columns:minmax(0,1fr)}.flow .arr{transform:rotate(90deg);height:28px}}

/* ===== Menú principal (mobile) ===== */
.nav-toggle{display:none;align-items:center;justify-content:center;width:44px;height:44px;margin-left:auto;background:transparent;border:1px solid rgba(255,255,255,.35);border-radius:2px;color:#FFFFFF;cursor:pointer}
.nav-toggle-bars,.nav-toggle-bars::before,.nav-toggle-bars::after{display:block;width:18px;height:2px;background:currentColor;position:relative;transition:transform .2s ease,background-color .2s ease}
.nav-toggle-bars::before,.nav-toggle-bars::after{content:"";position:absolute;left:0}
.nav-toggle-bars::before{top:-6px}
.nav-toggle-bars::after{top:6px}
.site-nav[data-open] .nav-toggle-bars{background:transparent}
.site-nav[data-open] .nav-toggle-bars::before{transform:translateY(6px) rotate(45deg)}
.site-nav[data-open] .nav-toggle-bars::after{transform:translateY(-6px) rotate(-45deg)}
@media (max-width:820px){
  .site-nav{flex-wrap:wrap !important;row-gap:0 !important}
  .nav-toggle{display:inline-flex}
  .site-nav .nav-menu{display:none !important;width:100%;flex-direction:column;align-items:stretch !important;gap:0 !important;padding:12px 0 20px;border-top:1px solid rgba(201,213,240,.2);margin-top:16px}
  .site-nav[data-open] .nav-menu{display:flex !important}
  .site-nav .nav-menu>a{padding:14px 0;font-size:17px !important;border-bottom:1px solid rgba(201,213,240,.12)}
  .site-nav .nav-menu>a:last-child{margin-top:16px;text-align:center;border-bottom:1px solid rgba(255,255,255,.35)}
  .site-nav .nav-menu .lang-switch{padding:8px 0}
}