:root {
    --site-ink: #1d2533;
    --site-muted: #667085;
    --site-blue: #086f9c;
    --site-blue-dark: #0b3552;
    --site-green: #4f861f;
    --site-orange: #d97706;
    --site-border: #e7edf2;
    --site-surface: #ffffff;
}

html { scroll-behavior: smooth; }

body {
    background: #eef3f6;
    color: var(--site-ink);
    font-family: 'Open Sans', sans-serif;
    min-width: 320px;
    overflow-x: hidden;
}

body a { transition: color .2s ease, background-color .2s ease, border-color .2s ease; }
.back { display: none; }
.site-container { max-width: 1440px; padding: 1.5rem 1rem; }
.site-main { background: var(--site-surface); border: 1px solid var(--site-border); border-radius: 1rem; box-shadow: 0 1rem 3rem rgba(11, 53, 82, .08); overflow: hidden; padding: 0; }

.site-header { background: var(--site-surface); }
.site-header-top { align-items: flex-start; display: flex; gap: 1rem; justify-content: space-between; padding: 1.5rem clamp(1rem, 3vw, 2.5rem) 1.25rem; }
.site-brand-wrap { min-width: 0; }
.site-brand { color: var(--site-blue-dark); display: inline-block; font-family: 'Roboto Condensed', sans-serif; font-size: clamp(1.65rem, 3vw, 2.6rem); font-weight: 700; line-height: 1.05; text-decoration: none; }
.site-brand span { color: var(--site-blue); display: block; font-size: .52em; letter-spacing: .06em; margin-top: .35rem; text-transform: uppercase; }
.site-brand small { color: var(--site-muted); display: block; font-family: 'Open Sans', sans-serif; font-size: .38em; font-weight: 600; letter-spacing: .03em; margin-top: .4rem; }
.site-promo-links { display: flex; flex-wrap: wrap; gap: .35rem 1.25rem; margin-top: .9rem; }
.site-promo-links a { color: var(--site-muted); font-size: .82rem; text-decoration: none; }
.site-promo-links a strong { color: #b42318; }
.site-promo-links a:hover { color: var(--site-blue); }
.site-social-link { background: #1877f2; border-radius: 999px; color: #fff; flex: 0 0 auto; font-size: .8rem; font-weight: 700; padding: .5rem .85rem; text-decoration: none; }
.site-social-link:hover { background: #0e5dcc; color: #fff; }

.site-nav { background: var(--site-blue-dark); padding: 0 clamp(1rem, 3vw, 2.5rem); }
.site-nav .navbar-nav { gap: .3rem; }
.site-nav .nav-item { float: none; }
.site-nav .nav-link { border-radius: .4rem; color: rgba(255,255,255,.9); font-family: 'Roboto Condensed', sans-serif; font-size: .96rem; font-weight: 700; letter-spacing: .03em; padding: .85rem .8rem; text-transform: uppercase; }
.site-nav .nav-link:hover, .site-nav .nav-link:focus { background: rgba(255,255,255,.12); color: #fff; }
.site-nav .nav-link-blog { background: var(--site-blue); }
.site-nav .nav-link-green { background: var(--site-green); }
.site-nav .nav-link-orange { background: var(--site-orange); }
.site-nav .dropdown-menu { background: var(--site-blue-dark); border: 0; border-radius: .5rem; box-shadow: 0 .75rem 2rem rgba(11, 53, 82, .2); padding: .45rem; }
.site-nav .dropdown-item { border-radius: .3rem; color: #fff; font-size: .9rem; padding: .55rem .7rem; }
.site-nav .dropdown-item:hover, .site-nav .dropdown-item:focus { background: rgba(255,255,255,.12); color: #fff; }

.site-main > .gallery, .site-main > .content, .site-main > .magazine { padding-left: clamp(1rem, 3vw, 2.5rem); padding-right: clamp(1rem, 3vw, 2.5rem); }
.site-main > .gallery { padding-top: 1.75rem; }
.site-main > .content, .site-main > .magazine { padding-bottom: 1.5rem; padding-top: 1.5rem; }
.site-main .content { display: flex; flex-wrap: wrap; margin-left: 0; margin-right: 0; }
.site-main .content > [class*='col-'] { padding-left: .75rem; padding-right: .75rem; }
.site-main .content-top, .site-main .content-bottom, .site-main .sin-bottom { min-width: 0; }
.site-main .gallery h1, .site-main .magazine h1 { color: var(--site-blue); font-family: 'Roboto Condensed', sans-serif; font-size: clamp(1.45rem, 2vw, 2rem); letter-spacing: .02em; }
.site-main .number { border-bottom: 1px solid var(--site-border); padding-bottom: 1.25rem; }
.site-main .number h3 { font-family: 'Roboto Condensed', sans-serif; font-size: clamp(1.45rem, 2vw, 2.1rem); line-height: 1.2; }
.site-main .number h3 a { color: var(--site-ink); }
.site-main .number h3 a:hover, .site-main .magazine-grid h3 a:hover { color: var(--site-blue); }
.site-main .number p, .site-main .caption p, .site-main .magazine-grid p { color: #475467; line-height: 1.75; }
.site-main img, .site-main .img-responsive { display: block; height: auto; max-width: 100%; }
.site-main .owl-carousel img { width: 100%; }
.site-main .content-bottom, .site-main .sin-bottom { border-left: 1px solid var(--site-border); }
.site-main .stories span, .site-main .might h4, .site-main .grid-top h4, .site-main .grid-top-in h4 { background: var(--site-blue-dark); }
.site-main .stories span { max-width: 100%; }
.site-main .magazine { display: flex; flex-wrap: wrap; }
.site-main .magazine > h1 { flex: 0 0 100%; }
.site-main .magazine-top { margin-left: -.75rem; margin-right: -.75rem; }
.site-main .site-category-promos, .site-main .site-category-pagination { flex: 0 0 100%; }
.site-main .site-category-promos { display: flex; flex-wrap: wrap; }
.site-main .site-category-row { display: contents; }
.site-main .site-category-row > .top-magazine { flex: 0 0 33.333333%; max-width: 33.333333%; padding-left: .75rem; padding-right: .75rem; }
.site-main .site-category-row > .clearfix { display: none; }
.site-main .magazine-grid h3 { font-family: 'Roboto Condensed', sans-serif; line-height: 1.25; }
.site-main .line, .site-main .line-in { background: var(--site-border); height: 1px; }

.site-footer { background: var(--site-surface); padding: 0 clamp(1rem, 3vw, 2.5rem) 1.5rem; }
.site-footer-rule { background: var(--site-border); height: 1px; }
.site-footer .footer-class { color: var(--site-muted); font-size: .9rem; line-height: 1.7; padding: 1.25rem 0 0; }
.site-footer .footer-class a { color: var(--site-blue); }
.site-to-top { background: var(--site-blue-dark); border-radius: 999px; bottom: 1.25rem; color: #fff; font-size: .75rem; padding: .65rem .85rem; position: fixed; right: 1.25rem; text-decoration: none; z-index: 20; }
.site-to-top:hover { background: var(--site-blue); color: #fff; }

@media (max-width: 991.98px) {
    .site-nav .navbar-nav { gap: 0; padding: .5rem 0; }
    .site-nav .nav-link { margin: .15rem 0; }
    .site-nav .dropdown-menu { box-shadow: none; }
    .site-main .content-bottom, .site-main .sin-bottom { border-left: 0; border-top: 1px solid var(--site-border); margin-top: 1rem; padding-top: 1.25rem; }
    .site-main .site-category-row > .top-magazine { flex-basis: 50%; max-width: 50%; }
}

@media (max-width: 575.98px) {
    .site-container { padding: 0; }
    .site-main { border-radius: 0; border-left: 0; border-right: 0; }
    .site-header-top { padding: 1.25rem 1rem 1rem; }
    .site-promo-links { display: block; }
    .site-promo-links a { display: block; margin-top: .35rem; }
    .site-social-link { font-size: 0; padding: .7rem; }
    .site-social-link::before { content: 'f'; font-size: 1rem; }
    .site-main > .gallery, .site-main > .content, .site-main > .magazine { padding-left: 1rem; padding-right: 1rem; }
    .site-main .content > [class*='col-'] { padding-left: 0; padding-right: 0; }
    .site-main .site-category-row > .top-magazine { flex-basis: 100%; max-width: 100%; }
    .site-main .in-left { float: none; width: 100%; }
    .site-footer { padding-left: 1rem; padding-right: 1rem; }
}