/*
 * Saber de Ciencias — custom Joomla 6 site template
 * Visual language adapted from the original Artisteer design:
 * pale blue-grey canvas, white sheet, blue gradient navigation,
 * compact three-column magazine layout and blue module headings.
 */

:root {
    --sdc-page-bg: #dbe5eb;
    --sdc-white: #ffffff;
    --sdc-blue: #6cace0;
    --sdc-blue-light: #8dbfe7;
    --sdc-blue-mid: #4e9bda;
    --sdc-blue-dark: #206297;
    --sdc-link: #287abd;
    --sdc-link-strong: #256fad;
    --sdc-text: #0e2b43;
    --sdc-muted: #5d7989;
    --sdc-border: #9ec8ea;
    --sdc-panel: #f8fafb;
    --sdc-font: Arial, Helvetica, sans-serif;
    --sdc-content-width: 1250px;
}

* { box-sizing: border-box; }
html { min-height: 100%; scroll-behavior: smooth; }
body.sdc-body {
    min-height: 100vh;
    margin: 0;
    background: var(--sdc-page-bg);
    color: var(--sdc-text);
    font: 14px/1.5 var(--sdc-font);
    -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; height: auto; }
a { color: var(--sdc-link); text-decoration: none; }
a:hover, a:focus { color: var(--sdc-blue-dark); text-decoration: underline; }
button, input, select, textarea { font: inherit; }
.visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

/* Header — original laboratory photo and centered blue title. */
.sdc-header-shell {
    max-width: var(--sdc-content-width);
    margin: 0 auto;
    background: var(--sdc-white);
    border-right: 1px solid #7aa0b8;
    border-left: 1px solid #7aa0b8;
    box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, .16);
}
.sdc-header {
    position: relative;
    height: 200px;
    overflow: hidden;
    background: #fff;
}
.sdc-header__brand {
    display: block;
    cursor: pointer;
    position: absolute;
    z-index: 2;
    top: 0;
    bottom: 0;
    left: 0;
    width: 72%;
    color: #398fd5;
}
.sdc-header__brand:hover,
.sdc-header__brand:focus { color: #398fd5; text-decoration: none; }
.sdc-header__title {
    position: absolute;
    top: 68px;
    left: 28%;
    display: block;
    width: 62%;
    color: #398fd5;
    font-size: clamp(25px, 3vw, 36px);
    font-weight: 700;
    line-height: 1.12;
    text-align: center;
    text-shadow: 0 2px 3px rgba(0, 0, 0, .28);
    white-space: normal;
}
.sdc-header__lab {
    position: absolute;
    top: 0;
    right: 0;
    width: 512px;
    max-width: 45%;
    height: 200px;
    overflow: hidden;
    pointer-events: none;
}
.sdc-header__lab img {
    display: block;
    width: 512px;
    max-width: none;
    height: 200px;
    object-fit: contain;
    object-position: right top;
}
.sdc-header__search-module {
    position: absolute;
    z-index: 4;
    bottom: 8px;
    left: 14px;
}
.sdc-search {
    position: absolute;
    z-index: 4;
    bottom: 15px;
    left: 21px;
    display: flex;
    width: 202px;
    height: 28px;
    margin: 0;
    border: 1px dotted #6cace0;
    background: #fff;
}
.sdc-search input[type="search"] {
    display: block;
    min-width: 0;
    width: 100%;
    height: 26px;
    padding: 2px 7px;
    border: 0;
    outline: 0;
    color: var(--sdc-text);
    background: transparent;
    font-size: 12px;
    box-shadow: none;
}
.sdc-search input[type="search"]::-webkit-search-cancel-button { display: none; }
.sdc-search button {
    display: grid;
    flex: 0 0 28px;
    width: 28px;
    height: 26px;
    padding: 0;
    place-items: center;
    border: 0;
    background: transparent;
    cursor: pointer;
}
.sdc-search button img { width: 16px; height: 16px; }

/* Full-width blue menu band; menu module normally stays in legacy user3. */
.sdc-nav-band {
    width: 100%;
    min-height: 39px;
    border-top: 6px solid var(--sdc-blue-dark);
    border-bottom: 1px dotted var(--sdc-blue-dark);
    background: linear-gradient(to bottom, var(--sdc-blue-light) 0%, var(--sdc-blue-mid) 100%);
}
.sdc-nav {
    max-width: var(--sdc-content-width);
    min-height: 32px;
    margin: 0 auto;
    padding: 0 8px;
}
.sdc-nav__inner { min-height: 32px; }
.sdc-nav .mod-menu,
.sdc-nav ul.mod-list,
.sdc-nav ul.nav {
    display: flex;
    flex-wrap: nowrap;
    align-items: stretch;
    min-height: 32px;
    margin: 0;
    padding: 0;
    list-style: none;
}
.sdc-nav .mod-menu > li,
.sdc-nav ul.nav > li {
    position: relative;
    display: flex;
    align-items: stretch;
    margin: 0;
    padding: 0;
    border: 0;
    list-style: none;
}
.sdc-nav .mod-menu > li + li::before,
.sdc-nav ul.nav > li + li::before {
    position: absolute;
    top: 9px;
    bottom: 8px;
    left: 0;
    width: 1px;
    background: rgba(255,255,255,.72);
    content: "";
}
.sdc-nav .mod-menu > li > a,
.sdc-nav .mod-menu > li > span,
.sdc-nav ul.nav > li > a,
.sdc-nav ul.nav > li > span {
    display: flex;
    align-items: center;
    min-height: 32px;
    padding: 0 23px;
    color: #fff;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.2;
    text-decoration: none;
    text-transform: uppercase;
}
.sdc-nav .mod-menu > li.current > a,
.sdc-nav .mod-menu > li.active > a,
.sdc-nav .mod-menu > li > a[aria-current="page"],
.sdc-nav ul.nav > li.active > a {
    color: #173d59;
}
.sdc-nav .mod-menu > li > a:hover,
.sdc-nav .mod-menu > li > a:focus,
.sdc-nav ul.nav > li > a:hover,
.sdc-nav ul.nav > li > a:focus { color: #173d59; text-decoration: none; }
.sdc-nav .mod-menu li ul,
.sdc-nav .mod-menu li > .mod-menu__sub,
.sdc-nav ul.nav li ul {
    position: absolute;
    z-index: 1000;
    top: 100%;
    left: 0;
    display: none;
    min-width: 220px;
    margin: 0;
    padding: 5px 0;
    border: 1px solid #b8d4e8;
    background: #fff;
    box-shadow: 0 4px 12px rgba(0,0,0,.15);
    list-style: none;
}
.sdc-nav .mod-menu li:hover > ul,
.sdc-nav .mod-menu li:focus-within > ul,
.sdc-nav ul.nav li:hover > ul,
.sdc-nav ul.nav li:focus-within > ul { display: block; }
.sdc-nav .mod-menu li ul li,
.sdc-nav ul.nav li ul li { display: block; }
.sdc-nav .mod-menu li ul a,
.sdc-nav ul.nav li ul a {
    display: block;
    padding: 8px 12px;
    color: #245b82;
    font-size: 13px;
    text-transform: none;
}

/* White central sheet and 3-column magazine structure. */
.sdc-content-shell {
    max-width: var(--sdc-content-width);
    min-height: 380px;
    margin: 0 auto 20px;
    padding: 10px 7px 0;
    border: 1px solid #7aa0b8;
    border-top: 0;
    border-radius: 0 0 5px 5px;
    background: #fff;
    box-shadow: 1px 1px 3px 2px rgba(0, 0, 0, .2);
}
.sdc-top-modules,
.sdc-bottom-modules {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin: 0 0 9px;
}
.sdc-breadcrumbs { margin: 0 4px 8px; color: var(--sdc-muted); font-size: 12px; }
.sdc-pre-content { margin: 0 2px; }
.sdc-layout {
    display: grid;
    grid-template-columns: minmax(205px, 240px) minmax(0, 1fr) minmax(205px, 240px);
    align-items: start;
    gap: 10px;
    width: 100%;
    margin: 0 auto;
}
.sdc-layout--no-left { grid-template-columns: minmax(0, 1fr) minmax(205px, 240px); }
.sdc-layout--no-right { grid-template-columns: minmax(205px, 240px) minmax(0, 1fr); }
.sdc-layout--no-left.sdc-layout--no-right { grid-template-columns: minmax(0, 1fr); }
.sdc-sidebar { min-width: 0; }
.sdc-main { min-width: 0; padding: 0 1px 10px; }
.sdc-component { min-width: 0; color: var(--sdc-text); }
.sdc-component > h1,
.sdc-component > .page-header h1,
.sdc-component .page-header h1 {
    margin: 5px 0 13px;
    color: var(--sdc-link-strong);
    font-size: 23px;
    font-weight: 600;
    line-height: 1.25;
}
.sdc-component h2,
.sdc-component h3 { color: var(--sdc-link-strong); }

/* Module chrome — blue header, fine dotted frame, very pale content field. */
.sdc-module {
    min-width: 0;
    margin: 3px 0 11px;
    padding: 7px;
    border: 1px dotted var(--sdc-border);
    background: #fff;
}
.sdc-module__title {
    margin: 0 0 2px;
    padding: 7px 10px 6px;
    background: linear-gradient(to bottom, #6cace0 0%, #70aee1 45%, #529dda 100%);
    color: #fff;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.35;
    text-transform: uppercase;
}
.sdc-module__body {
    min-width: 0;
    padding: 7px 8px;
    border: 1px dotted var(--sdc-border);
    background: var(--sdc-panel);
    color: var(--sdc-text);
    font-size: 13px;
    line-height: 1.55;
    overflow-wrap: anywhere;
}
.sdc-module__body p { margin: 0 0 8px; }
.sdc-module__body p:last-child { margin-bottom: 0; }
.sdc-module__body a { color: var(--sdc-link); }
.sdc-module__body ul,
.sdc-module__body ol { margin: 0 0 5px 17px; padding: 0; }
.sdc-module__body ul { list-style: none; }
.sdc-module__body ul > li { position: relative; margin: 0 0 4px; padding-left: 1px; }
.sdc-module__body ul > li::before {
    display: inline-block;
    width: 6px;
    height: 5px;
    margin: 0 7px 2px -13px;
    background: url('../images/blockbullets.png') no-repeat center;
    content: "";
}
.sdc-module__body .mod-menu,
.sdc-module__body ul.mod-list { margin: 0; padding: 0; list-style: none; }
.sdc-module__body .mod-menu > li,
.sdc-module__body ul.mod-list > li { margin: 0 0 5px; }
.sdc-module__body .mod-menu > li::before,
.sdc-module__body ul.mod-list > li::before { display: none; }
.sdc-module__body .mod-menu a,
.sdc-module__body ul.mod-list a { color: var(--sdc-link); }
.sdc-module__body img { max-width: 100%; height: auto; }
.sdc-module__body input[type="text"],
.sdc-module__body input[type="email"],
.sdc-module__body input[type="password"],
.sdc-module__body input[type="search"],
.sdc-module__body select,
.sdc-module__body textarea {
    max-width: 100%;
    border: 1px solid #b7d2e5;
    border-radius: 2px;
    background: #fff;
    color: var(--sdc-text);
}

/* Joomla component output — featured/category pages become two editorial columns. */
.sdc-component .blog-featured > .items-leading,
.sdc-component .blog-featured > .items-row,
.sdc-component .blog-featured .items-row,
.sdc-component .blog-items,
.sdc-component .com-content-blog__items,
.sdc-component .com-content-featured__items,
.sdc-component .com-content-category-blog__items {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
    gap: 18px 18px;
}
.sdc-component .blog-featured .items-leading > *,
.sdc-component .blog-featured .items-row > *,
.sdc-component .blog-items > *,
.sdc-component .com-content-blog__items > *,
.sdc-component .com-content-featured__items > *,
.sdc-component .com-content-category-blog__items > * {
    min-width: 0;
    margin: 0 0 9px;
}
.sdc-component article,
.sdc-component .item,
.sdc-component .com-content-blog__item,
.sdc-component .com-content-featured__article { min-width: 0; }
.sdc-component .page-header { margin: 0 0 8px; padding: 0; border: 0; }
.sdc-component .page-header h2,
.sdc-component .page-header h2 a,
.sdc-component .item-title,
.sdc-component .item-title a,
.sdc-component .com-content-blog__item-title,
.sdc-component .com-content-blog__item-title a,
.sdc-component .com-content-featured__article-title,
.sdc-component .com-content-featured__article-title a {
    margin: 4px 0 8px;
    color: var(--sdc-link-strong);
    font-size: 17px;
    font-weight: 400;
    line-height: 1.25;
    text-decoration: none;
    text-transform: uppercase;
}
.sdc-component .page-header h2 a:hover,
.sdc-component .item-title a:hover,
.sdc-component .com-content-blog__item-title a:hover,
.sdc-component .com-content-featured__article-title a:hover { color: #174f7c; text-decoration: underline; }
.sdc-component .article-info,
.sdc-component .com-content-category-blog__item-info,
.sdc-component .com-content-article__info {
    margin: 0 0 7px;
    color: var(--sdc-muted);
    font-size: 11px;
}
.sdc-component .item-image,
.sdc-component .com-content-category-blog__image,
.sdc-component .com-content-featured__image,
.sdc-component figure.item-image {
    float: left;
    width: 44%;
    max-width: 170px;
    margin: 2px 9px 6px 0;
}
.sdc-component .item-image img,
.sdc-component .com-content-category-blog__image img,
.sdc-component .com-content-featured__image img,
.sdc-component figure.item-image img {
    display: block;
    width: 100%;
    height: auto;
    border: 1px solid #c7dce9;
}
.sdc-component .sdc-article-image,
.sdc-component .pull-left.item-image { float: left; }
.sdc-component .item-content,
.sdc-component .com-content-category-blog__description,
.sdc-component .com-content-featured__description { min-width: 0; }
.sdc-component p,
.sdc-component .item-content,
.sdc-component .com-content-category-blog__description {
    color: #18384f;
    font-size: 14px;
    line-height: 1.5;
    text-align: justify;
}
.sdc-component p { margin: 0 0 9px; }
.sdc-component .readmore,
.sdc-component .com-content-blog__item-readmore { clear: both; margin-top: 8px; }
.sdc-component .readmore a,
.sdc-component a.readmore,
.sdc-component .btn-secondary,
.sdc-component .com-content-blog__item-readmore a {
    display: inline-block;
    padding: 5px 11px;
    border: 1px solid #b9d4e8;
    border-radius: 3px;
    background: linear-gradient(to bottom, #fff 0%, #e5f0f8 100%);
    color: #245b82;
    font-size: 12px;
    text-decoration: none;
}
.sdc-component .readmore a:hover,
.sdc-component a.readmore:hover,
.sdc-component .com-content-blog__item-readmore a:hover { background: #d8eaf7; }
.sdc-component .pagination {
    display: flex;
    flex-wrap: wrap;
    gap: 3px;
    clear: both;
    margin: 16px 0 8px;
    padding: 5px;
    border: 1px solid #9ec8ea;
    background: linear-gradient(to bottom, #fff 0%, #dcecf8 100%);
}
.sdc-component .pagination .page-link,
.sdc-component .pagination a,
.sdc-component .pagination span { color: #245b82; }
.sdc-component .pagination .active > span,
.sdc-component .pagination .active > a { background: #6cace0; color: #fff; }
.sdc-component .com-content-article,
.sdc-component .item-page { max-width: 100%; }
.sdc-component .com-content-article__body,
.sdc-component .item-page .article-body { line-height: 1.65; }
.sdc-component .com-content-article img,
.sdc-component .item-page img { max-width: 100%; height: auto; }

/* Homepage/featured-blog images: old Joomla articles can render intro text
   without the modern item-content wrapper classes. Apply a reliable gutter to
   floated images and floated image wrappers inside each blog item. */
.sdc-component .blog-featured .item img[style*="float"],
.sdc-component .blog-featured .item [style*="float: left"],
.sdc-component .blog-featured .item [style*="float:left"],
.sdc-component .blog-featured .item img[align="left"],
.sdc-component .blog-featured .item .pull-left,
.sdc-component .blog-featured .item .float-start,
.sdc-component .blog-items .item img[style*="float"],
.sdc-component .blog-items .item [style*="float: left"],
.sdc-component .blog-items .item [style*="float:left"],
.sdc-component .blog-items .item img[align="left"],
.sdc-component .blog-items .item .pull-left,
.sdc-component .blog-items .item .float-start {
    margin-right: 13px !important;
    margin-bottom: 9px !important;
}
.sdc-component .blog-featured .item img[style*="float: right"],
.sdc-component .blog-featured .item img[style*="float:right"],
.sdc-component .blog-featured .item [style*="float: right"],
.sdc-component .blog-featured .item [style*="float:right"],
.sdc-component .blog-featured .item img[align="right"],
.sdc-component .blog-featured .item .pull-right,
.sdc-component .blog-featured .item .float-end,
.sdc-component .blog-items .item img[style*="float: right"],
.sdc-component .blog-items .item img[style*="float:right"],
.sdc-component .blog-items .item [style*="float: right"],
.sdc-component .blog-items .item [style*="float:right"],
.sdc-component .blog-items .item img[align="right"],
.sdc-component .blog-items .item .pull-right,
.sdc-component .blog-items .item .float-end {
    margin-right: 0 !important;
    margin-bottom: 9px !important;
    margin-left: 13px !important;
}

/* Editorial images inserted inside article text: keep a clear gutter
   between floated photographs and the surrounding text. */
.sdc-component .com-content-article__body img[style*="float: left"],
.sdc-component .com-content-article__body img[style*="float:left"],
.sdc-component .com-content-blog__item-content img[style*="float: left"],
.sdc-component .com-content-blog__item-content img[style*="float:left"],
.sdc-component .com-content-featured__article img[style*="float: left"],
.sdc-component .com-content-featured__article img[style*="float:left"],
.sdc-component img[align="left"],
.sdc-component img.pull-left,
.sdc-component img.float-left {
    margin: 3px 13px 9px 0 !important;
}
.sdc-component .com-content-article__body img[style*="float: right"],
.sdc-component .com-content-article__body img[style*="float:right"],
.sdc-component .com-content-blog__item-content img[style*="float: right"],
.sdc-component .com-content-blog__item-content img[style*="float:right"],
.sdc-component .com-content-featured__article img[style*="float: right"],
.sdc-component .com-content-featured__article img[style*="float:right"],
.sdc-component img[align="right"],
.sdc-component img.pull-right,
.sdc-component img.float-right {
    margin: 3px 0 9px 13px !important;
}
.sdc-component table { max-width: 100%; border-collapse: collapse; }
.sdc-component th,
.sdc-component td { padding: 5px 7px; border: 1px solid #d4e2ec; }
.sdc-component blockquote {
    margin: 10px 0;
    padding: 10px 14px;
    border-left: 4px solid var(--sdc-blue);
    background: #edf5fb;
}
.sdc-component .tags a,
.sdc-component .com-content-article__tags a {
    display: inline-block;
    margin: 2px;
    padding: 2px 7px;
    border: 1px solid #c8dce9;
    border-radius: 2px;
    background: #f4f9fc;
    font-size: 11px;
}

/* Footer — blue band like the original site. */
.sdc-footer {
    min-height: 68px;
    margin: 10px 0 0;
    padding: 22px 18px;
    border-top: 1px dotted #3d91d6;
    border-radius: 4px;
    background: #6cace0;
    color: #0a1e2e;
    font-size: 13px;
    line-height: 1.7;
    text-align: center;
}
.sdc-footer__text { color: #0a1e2e; }
.sdc-footer a { color: #fff; }
.sdc-footer .sdc-module { display: inline-block; margin: 0 8px; padding: 0; border: 0; background: transparent; }
.sdc-footer .sdc-module__title { display: none; }
.sdc-footer .sdc-module__body { padding: 0; border: 0; background: transparent; }

/* Forms, system messages and accessibility details. */
.sdc-component .alert,
.sdc-component .alert-message,
.sdc-component .joomla-alert { margin: 0 0 12px; }
.sdc-component input,
.sdc-component select,
.sdc-component textarea { max-width: 100%; }
.sdc-component button,
.sdc-component input[type="submit"],
.sdc-component .btn { cursor: pointer; }
.sdc-body :focus-visible { outline: 2px solid #1d6ca5; outline-offset: 2px; }

/* Responsive behaviour: preserve the editorial grid on tablets and stack on phones. */
@media (max-width: 1080px) {
    .sdc-content-shell { margin-right: 10px; margin-left: 10px; }
    .sdc-layout { grid-template-columns: minmax(180px, 220px) minmax(0, 1fr) minmax(180px, 220px); gap: 8px; }
    .sdc-layout--no-left { grid-template-columns: minmax(0, 1fr) minmax(180px, 220px); }
    .sdc-layout--no-right { grid-template-columns: minmax(180px, 220px) minmax(0, 1fr); }
    .sdc-header-shell { margin-right: 10px; margin-left: 10px; }
}
@media (max-width: 820px) {
    .sdc-layout,
    .sdc-layout--no-left,
    .sdc-layout--no-right,
    .sdc-layout--no-left.sdc-layout--no-right { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    .sdc-main { grid-column: 1 / -1; grid-row: 1; }
    .sdc-sidebar--left { grid-column: 1; grid-row: 2; }
    .sdc-sidebar--right { grid-column: 2; grid-row: 2; }
    .sdc-nav { overflow-x: auto; }
    .sdc-nav .mod-menu,
    .sdc-nav ul.mod-list,
    .sdc-nav ul.nav { width: max-content; min-width: 100%; }
    .sdc-nav .mod-menu > li > a,
    .sdc-nav ul.nav > li > a { padding-right: 16px; padding-left: 16px; font-size: 14px; }
}
@media (max-width: 600px) {
    .sdc-header-shell { margin: 0; border-right: 0; border-left: 0; }
    .sdc-header { height: 176px; }
    .sdc-header__lab { width: 250px; max-width: 55%; height: 98px; opacity: .86; }
    .sdc-header__lab img { width: 251px; height: 98px; object-fit: cover; object-position: right top; }
    .sdc-header__brand { width: 100%; }
    .sdc-header__title {
        top: 43px;
        left: 4%;
        width: 72%;
        font-size: clamp(22px, 6vw, 29px);
        text-align: center;
    }
    .sdc-search { bottom: 12px; left: 12px; width: 190px; }
    .sdc-content-shell { margin: 0; padding: 9px 8px 0; border-right: 0; border-left: 0; border-radius: 0; }
    .sdc-layout,
    .sdc-layout--no-left,
    .sdc-layout--no-right,
    .sdc-layout--no-left.sdc-layout--no-right { grid-template-columns: minmax(0, 1fr); gap: 4px; }
    .sdc-main { grid-column: 1; grid-row: 1; }
    .sdc-sidebar--left { grid-column: 1; grid-row: 2; }
    .sdc-sidebar--right { grid-column: 1; grid-row: 3; }
    .sdc-component .blog-featured > .items-leading,
    .sdc-component .blog-featured > .items-row,
    .sdc-component .blog-featured .items-row,
    .sdc-component .blog-items,
    .sdc-component .com-content-blog__items,
    .sdc-component .com-content-featured__items,
    .sdc-component .com-content-category-blog__items { grid-template-columns: minmax(0, 1fr); gap: 14px; }
    .sdc-component .page-header h2,
    .sdc-component .page-header h2 a,
    .sdc-component .item-title,
    .sdc-component .item-title a,
    .sdc-component .com-content-blog__item-title,
    .sdc-component .com-content-blog__item-title a { font-size: 16px; }
    .sdc-top-modules,
    .sdc-bottom-modules { grid-template-columns: minmax(0, 1fr); }
    .sdc-footer { margin-top: 7px; padding: 17px 12px; }
}


/* Joomla 6 pagination: keep every page control spaced and clearly clickable. */
.sdc-component .pagination__wrapper {
    display: block;
    clear: both;
    width: 100%;
    margin: 16px 0 10px;
}
.sdc-component .pagination {
    display: block;
    width: 100%;
    clear: both;
    margin: 0;
    padding: 8px 10px;
    border: 1px solid #9ec8ea;
    border-radius: 2px;
    background: linear-gradient(to bottom, #fff 0%, #dcecf8 100%);
}
.sdc-component ul.pagination,
.sdc-component .pagination > ul,
.sdc-component .pagination ul.pagination-list,
.sdc-component ul.pagination-list {
    display: flex !important;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    gap: 4px;
    width: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
}
.sdc-component .pagination li,
.sdc-component .pagination-list li {
    display: block;
    float: none;
    flex: 0 0 auto;
    margin: 0 !important;
    padding: 0;
    list-style: none;
}
.sdc-component .pagination a,
.sdc-component .pagination .page-link,
.sdc-component .pagination-list a,
.sdc-component .pagination-list span:not([class*="icon-"]) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 29px;
    min-height: 29px;
    margin: 0;
    padding: 4px 8px;
    border: 1px solid #b9d4e8;
    border-radius: 3px;
    background: linear-gradient(to bottom, #fff 0%, #e5f0f8 100%);
    color: #245b82;
    font-size: 12px;
    line-height: 1.2;
    text-decoration: none;
    white-space: nowrap;
}
.sdc-component .pagination a:hover,
.sdc-component .pagination .page-link:hover,
.sdc-component .pagination-list a:hover {
    border-color: #6cace0;
    background: #d8eaf7;
    text-decoration: none;
}
.sdc-component .pagination .active > span,
.sdc-component .pagination .active > a,
.sdc-component .pagination .page-item.active .page-link {
    border-color: #4e9bda;
    background: #6cace0;
    color: #fff;
}
.sdc-component .pagination .disabled > span,
.sdc-component .pagination .page-item.disabled .page-link {
    opacity: .55;
    cursor: default;
}
.sdc-component .pagination p.counter,
.sdc-component .pagination__wrapper p.counter {
    margin: 0 0 6px;
    color: #5d7989;
    font-size: 12px;
}

/* Joomla core outputs empty icon spans for Start/Previous/Next/End.
   Supply visible glyphs without requiring an icon-font asset. */
.sdc-component .pagination .icon-angle-double-left,
.sdc-component .pagination .icon-angle-left,
.sdc-component .pagination .icon-angle-right,
.sdc-component .pagination .icon-angle-double-right {
    display: inline-block;
    width: auto;
    min-width: 0;
    min-height: 0;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: inherit;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 18px;
    font-weight: 700;
    line-height: 1;
}
.sdc-component .pagination .icon-angle-double-left::before { content: "\00AB"; }
.sdc-component .pagination .icon-angle-left::before { content: "\2039"; }
.sdc-component .pagination .icon-angle-right::before { content: "\203A"; }
.sdc-component .pagination .icon-angle-double-right::before { content: "\00BB"; }
html[dir="rtl"] .sdc-component .pagination .icon-angle-double-left::before { content: "\00BB"; }
html[dir="rtl"] .sdc-component .pagination .icon-angle-left::before { content: "\203A"; }
html[dir="rtl"] .sdc-component .pagination .icon-angle-right::before { content: "\2039"; }
html[dir="rtl"] .sdc-component .pagination .icon-angle-double-right::before { content: "\00AB"; }

/* Homepage markup confirmed in the live DOM inspector:
   .sdc-component .blog-featured > .blog-items.columns-2 > .blog-item
   > .item-content > p > img[style="float: left"].
   Previous rules targeted .item / .items-row, but this template outputs
   .blog-item, so those rules did not match the featured homepage images. */
.sdc-component .blog-featured .blog-items .blog-item .item-content p > img[style*="float: left"],
.sdc-component .blog-featured .blog-items .blog-item .item-content p > img[style*="float:left"] {
    margin: 2px 14px 10px 0 !important;
}
.sdc-component .blog-featured .blog-items .blog-item .item-content p > img[style*="float: right"],
.sdc-component .blog-featured .blog-items .blog-item .item-content p > img[style*="float:right"] {
    margin: 2px 0 10px 14px !important;
}

/* Front-page article text images: provide a visible gap even when legacy
   article HTML uses a plain paragraph image without Joomla alignment classes.
   Keep module thumbnails and the header image outside this rule. */
.sdc-component .blog-featured .items-leading p img,
.sdc-component .blog-featured .items-row p img,
.sdc-component .blog-featured .leading-0 p img,
.sdc-component .blog-featured .item p img,
.sdc-component .items-leading p img,
.sdc-component .items-row p img,
.sdc-component .com-content-featured__article p img,
.sdc-component .com-content-blog__item-content p img {
    margin-right: 14px !important;
    margin-bottom: 10px !important;
}

/* Preserve the correct gutter for right-floated pictures in article text. */
.sdc-component .blog-featured p img[style*="float: right"],
.sdc-component .blog-featured p img[style*="float:right"],
.sdc-component .items-leading p img[style*="float: right"],
.sdc-component .items-leading p img[style*="float:right"],
.sdc-component .items-row p img[style*="float: right"],
.sdc-component .items-row p img[style*="float:right"],
.sdc-component .com-content-featured__article p img[style*="float: right"],
.sdc-component .com-content-blog__item-content p img[style*="float: right"] {
    margin-right: 0 !important;
    margin-left: 14px !important;
}

/* Category/blog cards and legacy Joomla menu views.
   Confirmed live markup:
   .sdc-component .com-content-category-blog__item.blog-item
     > .item-content > p > img[style="float: left;"]
   The previous homepage rules were scoped to .blog-featured and therefore
   did not cover category blog pages reached from the menus. */
.sdc-component .blog-item .item-content p img[style*="float: left"],
.sdc-component .blog-item .item-content p img[style*="float:left"],
.sdc-component .com-content-category-blog__item .item-content p img[style*="float: left"],
.sdc-component .com-content-category-blog__item .item-content p img[style*="float:left"] {
    margin: 2px 14px 10px 0 !important;
}
.sdc-component .blog-item .item-content p img[style*="float: right"],
.sdc-component .blog-item .item-content p img[style*="float:right"],
.sdc-component .com-content-category-blog__item .item-content p img[style*="float: right"],
.sdc-component .com-content-category-blog__item .item-content p img[style*="float:right"] {
    margin: 2px 0 10px 14px !important;
}

/* Standard article view: handle legacy inline-floated images inside text. */
.sdc-component .com-content-article__body p img[style*="float: left"],
.sdc-component .com-content-article__body p img[style*="float:left"],
.sdc-component .item-page .article-body p img[style*="float: left"],
.sdc-component .item-page .article-body p img[style*="float:left"] {
    margin: 2px 14px 10px 0 !important;
}
.sdc-component .com-content-article__body p img[style*="float: right"],
.sdc-component .com-content-article__body p img[style*="float:right"],
.sdc-component .item-page .article-body p img[style*="float: right"],
.sdc-component .item-page .article-body p img[style*="float:right"] {
    margin: 2px 0 10px 14px !important;
}