@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

:root {
    --blue: #2B58A9;
    --green: #009DA6;
    --ink: #111827;
    --ink-2: #374151;
    --bg: #fff;
    --bg-2: #f5f7fb;
    --glass: rgba(255,255,255,.75);
    --ring: color-mix(in oklab,var(--green)55%,white);
    --radius: 16px;
    --shadow: 4px 10px 10px rgba(16,24,40,.12);
    --headerbar-h: 0px;
    --headerbar-offset: 0px
}

* {
    box-sizing: border-box,
}

html, body {
    margin: 0;
    padding: 0;
    background: var(--bg);
    color: var(--ink) !important;
    font: 16px/1.5 "Inter",system-ui,-apple-system,Segoe UI,Roboto,sans-serif
}

a {
    color: inherit;
    text-decoration: none
}

img {
    max-width: 100%;
    display: block
}

.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
}

.container {
    max-width: 1200px;
    margin-inline: auto;
    padding-inline: clamp(16px,3vw,24px)
}

a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
    outline: 2px solid var(--ring);
    outline-offset: 2px;
    border-radius: 10px
}

.skip-link {
    position: absolute;
    left: -999px;
    top: auto;
    width: 1px;
    height: 1px;
    overflow: hidden
}

    .skip-link:focus {
        left: 12px;
        top: 12px;
        width: auto;
        height: auto;
        padding: .5rem .75rem;
        border-radius: 10px;
        background: #fff;
        box-shadow: var(--shadow);
        z-index: 2000
    }

.nav-link {
    color: #2B58A9 !important;
    font-size: 1.2rem;
}

@media(max-width:440px) {
    .site-header .container, #contenido > .container, .site-footer .container {
        margin: 0px 16px;
        width: calc( 100% - 32px );
    }
}