/* UniLoud article library and reading layout — September 2026. */

/* Homepage cards use the same topic covers as the article library. */
.home .homepage-news__wrapper {grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:1fr;align-items:stretch;gap:20px}
.home .homepage-news .ul-article-card {width:100%;height:100%;margin:0;min-width:0}
.home .homepage-news .ul-article-cover {flex-shrink:0;width:100%}
.home .homepage-news .ul-article-card__body {padding:20px}
.home .homepage-news .ul-article-card .news-card__title {font-size:18px}
.home .homepage-news .ul-cover-brand {top:16px;left:20px}
.home .homepage-news .ul-cover-icon {width:56px;height:56px;right:20px;top:16px}
.home .homepage-news .ul-cover-title {font-size:22px;left:20px;right:20px;bottom:30px}
.home .homepage-news .ul-cover-rule {left:20px;bottom:18px}
.home .homepage-news .ul-article-card .news-card__excerpt {margin-top:auto}
@media(max-width:1240px) {
 .home .homepage-news__wrapper {grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:640px) {
 .home .homepage-news__wrapper {grid-template-columns:minmax(0,1fr);gap:24px}
 .home .homepage-news .ul-article-card .news-card__title {font-size:20px}
}



/* Article navigation and full-size figure links. */
body.single-post .ul-reading-nav {margin:0 0 32px;padding:0 22px;border:1px solid #36505b;border-radius:12px;background:#101d24}
body.single-post .ul-reading-nav[hidden] {display:none}
body.single-post .ul-reading-nav summary {cursor:pointer;padding:19px 0;color:#99e0e6;font-size:16px;font-weight:600;line-height:1.5}
body.single-post .ul-reading-nav ol {margin:0 0 22px;padding-left:22px}
body.single-post .ul-reading-nav li {font-size:15px!important;line-height:1.65!important;margin-bottom:12px}
body.single-post .ul-reading-nav a {text-decoration:none;color:#dae9ed}
body.single-post .ul-reading-nav a:hover {color:#83dce3;text-decoration:underline}
body.single-post .ul-article-figure {margin:0}
body.single-post .ul-article-figure>a {display:block;cursor:zoom-in}
body.single-post .ul-article-figure figcaption {margin:12px 0 0;font-size:13px;line-height:1.6;color:#abbfc8;text-align:center}
body.single-post .entry-content__main h2 {scroll-margin-top:110px}
body.single-post .entry-content__main h2:focus {outline:2px solid #77cdd6;outline-offset:8px}
body.single-post .single-blog-hero .hero-wrapper {height:auto!important;min-height:0!important;max-height:none!important;padding:100px 32px 52px!important}
body.single-post .single-blog-hero .hero-wrapper>.theme-grid {min-height:0!important;height:auto!important}
body.single-post .single-blog-hero .hero-content {position:relative!important;inset:auto!important;transform:none!important;width:calc(100% - 280px)!important;max-width:840px;margin:0 0 0 auto;text-align:left}
body.single-post .single-blog-hero .hero-title-wrapper {margin-bottom:0}
body.single-post .single-blog-hero .hero-subtitle,body.blog .single-blog-hero .hero-subtitle {text-transform:none!important;letter-spacing:0}
body.single-post .single-blog-hero .hero-bottom.center {position:relative!important;inset:auto!important;transform:none!important;width:calc(100% - 280px)!important;max-width:840px;margin:24px 0 0 auto;text-align:left}
body.single-post .single-blog-hero .hero-scroll-indicator {display:none}
body.single-post .single-blog-hero .hero-post-meta {justify-content:flex-start;font-size:13px;gap:12px}
@media(max-width:1000px) {
 body.single-post .single-blog-hero .hero-content,body.single-post .single-blog-hero .hero-bottom.center {width:100%!important;margin-inline:auto}
 body.single-post .single-blog-hero .hero-wrapper {padding:48px 24px 38px!important}
}
@media(max-width:640px) {
 body.single-post .single-blog-hero .hero-wrapper {padding:32px 20px 28px!important}
 body.single-post .single-blog-hero .hero-title {font-size:27px!important}
 body.single-post .single-blog-hero .hero-subtitle {font-size:16px!important;margin-top:18px}
 body.single-post .ul-reading-nav {padding:0 18px}
}

body.blog .single-blog-hero .hero-wrapper {height:auto!important;min-height:0!important;max-height:none!important;padding:100px 32px 62px!important}
body.blog .single-blog-hero .hero-wrapper>.theme-grid {min-height:0!important;height:auto!important}
body.blog .single-blog-hero .hero-content {position:relative!important;inset:auto!important;transform:none!important;width:calc(100% - 280px)!important;max-width:840px;margin:0 0 0 auto;text-align:left}
body.blog .single-blog-hero .hero-title {font-size:clamp(30px,3.4vw,48px)!important;line-height:1.18!important;text-transform:none!important;letter-spacing:-.025em}
body.blog .single-blog-hero .hero-subtitle {font-size:17px!important;line-height:1.75!important;max-width:680px;margin:22px 0 0}
body.blog .single-blog-hero .hero-posts,body.blog .single-blog-hero .hero-bottom {display:none}
body.blog .single-blog-hero .hero-title-wrapper {margin-bottom:0}
.uniloud-journal {padding:24px 24px 80px}
.uniloud-journal__inner {width:100%;max-width:1240px;margin:0 auto}
.uniloud-blog-about {border-block:1px solid #263239;margin-bottom:44px}
.uniloud-blog-about summary {cursor:pointer;padding:20px 0;color:#bdcbd1;font-size:15px;line-height:1.5}
.uniloud-blog-about summary:hover {color:#77d8df}
.uniloud-blog-about .uniloud-blog-copy {max-width:800px;margin:0;padding:8px 0 28px}
.uniloud-blog-about .uniloud-blog-copy :is(p,li) {font-size:16px;line-height:1.8;color:#c2ccd1}
.uniloud-blog-about .uniloud-blog-copy h2 {font-size:22px;line-height:1.4;letter-spacing:0;text-transform:none}
.uniloud-blog-about .uniloud-blog-copy ul {padding-left:24px;margin-left:0}
.uniloud-journal__heading {display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:24px}
.uniloud-journal__heading h2,.uniloud-editor-picks>h2 {font-size:clamp(25px,3vw,34px);line-height:1.25;letter-spacing:-.02em;text-transform:none;margin:0}
#article-count {font-size:14px;color:#a5b5bd;white-space:nowrap}
.uniloud-journal .category-filters {display:flex;justify-content:flex-start;flex-wrap:wrap;gap:10px;margin:0 0 30px}
.uniloud-journal .filter-btn {display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 18px;border:1px solid #34434a;border-radius:999px;font-size:14px;line-height:1.5;letter-spacing:0;text-transform:none;color:#c9d4d9;transition:background .18s,color .18s}
.uniloud-journal .filter-btn:before {display:none}
.uniloud-journal .filter-btn.active,.uniloud-journal .filter-btn:hover {background:#70d4de;border-color:#70d4de;color:#07191f}
.uniloud-journal .post-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;justify-content:stretch;margin:0}
.uniloud-journal .post-grid[aria-busy="true"] {opacity:.55}
.ul-article-card.news-card {min-width:0;padding:0;background:#111a20;border:1px solid #2a3942;border-radius:16px;overflow:hidden;transition:border-color .2s,transform .2s;display:flex}
.ul-article-card.news-card:before {display:none}
.ul-article-card.news-card:hover {background:#152129;border-color:#6cbcc8;transform:translateY(-3px)}
.ul-article-card>.news-card__link {display:flex;flex-direction:column;width:100%;height:100%;color:inherit;text-decoration:none}
.ul-article-card__body {display:flex;flex-direction:column;flex:1;min-width:0;padding:24px}
.ul-article-card__meta {display:flex;justify-content:space-between;gap:12px;align-items:center;font-size:12px;line-height:1.5;margin-bottom:14px;color:#a7b9c2}
.ul-article-card__category {color:#83dce3;font-weight:600}
.ul-article-card .news-card__title {font-size:20px;line-height:1.45!important;text-transform:none!important;letter-spacing:-.015em;color:#f5f8fa;margin:0 0 14px;overflow-wrap:break-word}
.ul-article-card .news-card__excerpt {font-size:15px;line-height:1.75;color:#b8c6ce;margin:0 0 24px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.ul-article-card__footer {margin-top:auto;padding-top:18px;border-top:1px solid #30404a;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;color:#8fe1e7;font-size:13px;line-height:1.5}
.ul-article-card__time {font-size:12px;color:#adbdc6;white-space:nowrap}
.ul-article-cover {--cover-bg:#123840;--cover-accent:#8fe3e0;position:relative;aspect-ratio:1.9;overflow:hidden;background:var(--cover-bg);color:var(--cover-accent);isolation:isolate}
.ul-article-cover:before {content:"";position:absolute;width:260px;height:260px;border:1px solid currentColor;border-radius:50%;opacity:.12;right:-25px;top:-62px}
.ul-article-cover:after {content:"";position:absolute;width:200px;height:200px;border:1px solid currentColor;border-radius:50%;opacity:.15;right:5px;top:-32px}
.ul-article-cover--msp {--cover-bg:#173044;--cover-accent:#8bcdf3}
.ul-article-cover--security {--cover-bg:#153c37;--cover-accent:#97e3c8}
.ul-article-cover--communications {--cover-bg:#223249;--cover-accent:#a3c4fc}
.ul-article-cover--ai {--cover-bg:#353526;--cover-accent:#e5d78e}
.ul-cover-brand {position:absolute;top:23px;left:24px;font-size:13px;font-weight:700;letter-spacing:.01em;color:#e1edf0;z-index:1}
.ul-cover-brand>span {color:var(--cover-accent)}
.ul-cover-icon {position:absolute;width:90px;height:90px;right:30px;top:24px;opacity:.92;z-index:1}
.ul-cover-title {position:absolute;left:24px;right:22px;bottom:35px;font-size:clamp(21px,2vw,28px);font-weight:700;letter-spacing:-.025em;line-height:1.2;z-index:1;color:#f3fafb}
.ul-cover-rule {position:absolute;left:24px;bottom:22px;width:38px;height:3px;border-radius:2px;background:currentColor}
.ul-article-cover--photo img {display:block;width:100%;height:100%;object-fit:cover}
.ul-article-cover--photo:before,.ul-article-cover--photo:after {display:none}
.uniloud-blog-pagination {display:flex;justify-content:center}
.uniloud-journal .load-more {display:inline-flex;align-items:center;justify-content:center;gap:25px;margin:42px 0 0;min-height:50px;border:1px solid #537782;border-radius:999px;padding:13px 24px;text-transform:none;letter-spacing:0;font-size:15px;color:#dceef2}
.uniloud-journal .load-more:hover {background:#15333b;border-color:#83dce3}
.uniloud-blog-status {font-size:14px;line-height:1.6;color:#afdce3}
.uniloud-blog-status:empty {display:none}
.uniloud-editor-picks {margin-bottom:48px}
.uniloud-editor-picks>h2 {margin-bottom:24px}
.uniloud-journal :is(a,summary):focus-visible {outline:3px solid #83dce3;outline-offset:5px}
.ul-article-card:focus-within {outline:3px solid #83dce3;outline-offset:4px}
.ul-article-card>.news-card__link:focus-visible {outline-offset:-4px}
#articles {scroll-margin-top:110px}
/* Reading view: a readable measure and intact diagrams, scoped to blog posts. */
body.single-post .entry-content {display:flex!important;flex-direction:column;gap:0!important;width:100%;max-width:820px;margin:42px auto 0!important}
body.single-post .entry-content__main {padding:0!important;width:100%;max-width:100%!important;min-width:0}
body.single-post .entry-content__main :is(p,li) {font-size:18px!important;line-height:1.85!important;color:#d3dce1;margin-bottom:1.2em;overflow-wrap:break-word}
body.single-post .entry-content__main :is(p,li) strong {font-size:inherit!important;color:#f1f6f8}
body.single-post .entry-content__main :is(h2,h3,h4) {text-transform:none!important;letter-spacing:-.015em;line-height:1.4!important;max-width:100%;overflow-wrap:break-word}
body.single-post .entry-content__main h2 {font-size:28px;margin:2.2em 0 .8em!important;padding-bottom:14px;border-bottom:1px solid #293b44}
body.single-post .entry-content__main h3 {font-size:23px;margin:1.8em 0 .7em!important}
body.single-post .entry-content__main h4 {font-size:20px;margin:1.5em 0 .6em!important}
body.single-post .entry-content__main>h2:first-child {margin-top:0!important}
body.single-post .entry-content__main :is(ul,ol) {padding-left:26px;margin:1em 0 1.7em}
body.single-post .entry-content__main li {padding-left:6px;margin-bottom:.6em}
body.single-post .entry-content__main a {color:#88dce5;text-decoration:underline;text-underline-offset:4px}
body.single-post .entry-content__main :is(img,video) {max-width:100%;height:auto;object-fit:contain}
body.single-post .entry-content__main figure {margin:32px 0;max-width:100%}
body.single-post .entry-content__main figcaption {font-size:14px;line-height:1.7;color:#b3c1c9;margin-top:12px}
body.single-post .entry-content__main blockquote {margin:32px 0;padding:20px 26px;border-left:3px solid #70d4de;background:#101e25;border-radius:0 10px 10px 0}
body.single-post .entry-content__main .wp-block-table {overflow-x:auto;max-width:100%;-webkit-overflow-scrolling:touch}
body.single-post .entry-content__main table {width:100%;font-size:15px;line-height:1.65;border-collapse:collapse}
body.single-post .entry-content__main :is(th,td) {padding:14px;border:1px solid #35454f;vertical-align:top}
body.single-post .entry-content__main th {background:#17303a;color:#eaf4f7;text-align:left}
body.single-post .entry-content__image {order:-1;width:100%;max-height:none!important;height:auto!important;overflow:visible!important;margin:0 0 36px;border-radius:12px}
body.single-post .entry-content__image:empty {display:none}
body.single-post .entry-content__image .post-thumbnail {display:block;width:100%;height:auto!important}
body.single-post .entry-content__image img {display:block;width:100%;height:auto!important;max-height:none;object-fit:contain!important;border-radius:12px}
body.single-post .single-blog-hero .hero-title {text-transform:none!important;letter-spacing:-.025em;font-size:clamp(28px,3.1vw,46px)!important;line-height:1.25!important}
body.single-post .single-blog-hero .hero-subtitle {font-size:17px!important;line-height:1.8!important}
body.single-post .post-breadcrumb {max-width:820px;margin:28px auto;font-size:14px;line-height:1.6}
body.single-post .post-navigation {max-width:1100px;margin:64px auto 90px;padding:0 24px}
body.single-post .post-navigation .nav-links {padding:0;display:flex;gap:40px}
body.single-post .post-navigation .nav-links>div {flex:1;min-width:0}
body.single-post .post-navigation .nav-links a {display:block;font-size:15px;line-height:1.6;text-transform:none}
body.single-post .post-navigation .nav-subtitle {display:block;color:#83dce3;font-size:13px;margin-bottom:8px}
@media(max-width:1000px) {
 .uniloud-journal .post-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
 body.blog .single-blog-hero .hero-content {width:100%!important;margin:auto}
 body.blog .single-blog-hero .hero-wrapper {padding:52px 24px 40px!important}
 body.single-post .entry-content {max-width:740px}
}
@media(max-width:640px) {
 .uniloud-journal {padding:12px 20px 56px}
 .uniloud-blog-about {margin-bottom:30px}
 .uniloud-blog-about summary {font-size:14px}
 .uniloud-journal .post-grid {grid-template-columns:minmax(0,1fr);gap:24px}
 .uniloud-journal__heading {margin-bottom:22px;align-items:center}
 .uniloud-journal__heading h2 {font-size:26px}
 .uniloud-journal .category-filters {gap:8px;margin-bottom:26px}
 .uniloud-journal .filter-btn {font-size:13px;padding:9px 14px}
 .ul-article-card__body {padding:21px}
 .ul-article-card .news-card__title {font-size:20px;line-height:1.45!important}
 .ul-article-card .news-card__excerpt {font-size:15px;-webkit-line-clamp:2;margin-bottom:20px}
 .ul-article-cover {aspect-ratio:1.9}
 .ul-cover-title {font-size:26px}
 .ul-cover-icon {width:76px;height:76px;right:26px;top:22px}
 body.blog .single-blog-hero .hero-wrapper {padding:32px 20px 28px!important}
 body.blog .single-blog-hero .hero-title {font-size:29px!important}
 body.blog .single-blog-hero .hero-subtitle {font-size:16px!important;margin-top:18px}
 body.single-post .entry-content {margin-top:28px!important}
 body.single-post .entry-content__main :is(p,li) {font-size:17px!important;line-height:1.85!important}
 body.single-post .entry-content__main h2 {font-size:23px}
 body.single-post .entry-content__main h3 {font-size:20px}
 body.single-post .entry-content__main h4 {font-size:18px}
 body.single-post .entry-content__main :is(ul,ol) {padding-left:21px}
 body.single-post .entry-content__main :is(th,td) {padding:10px;min-width:125px}
 body.single-post .entry-content__image {margin-bottom:28px}
 body.single-post .post-navigation .nav-links {flex-direction:column;gap:24px}
 body.single-post .post-navigation .nav-links>div {text-align:left;padding-top:20px;border-top:1px solid #293b44}
}
@media(prefers-reduced-motion:reduce) {
 .ul-article-card.news-card,.uniloud-journal .filter-btn {transition:none}
 .ul-article-card.news-card:hover {transform:none}
}

/* Reserve space below the overlaid header at the tablet breakpoint. */
@media(min-width:761px) and (max-width:1100px) {
 body.blog .single-blog-hero .hero-wrapper,
 body.single-post .single-blog-hero .hero-wrapper {padding-top:156px!important}
}
@media(max-width:360px) {
 .ul-cover-icon {width:60px;height:60px;top:18px;right:24px}
 .ul-cover-title {font-size:22px;bottom:31px}
 .ul-cover-rule {bottom:18px}
}
body.single-post .entry-content__main .ul-reading-nav li {font-size:15px!important;line-height:1.65!important}

/* Align article headers with their reading content. */
body.single-post .single-blog-hero .hero-subtitle {text-align:left!important;padding:0!important;margin:22px 0 0!important;max-width:740px!important}
body.single-post .single-blog-hero .hero-post-meta {display:flex!important;text-align:left!important;justify-content:flex-start!important;flex-wrap:wrap}
body.single-post .single-blog-hero .hero-title,body.blog .single-blog-hero .hero-title {font-weight:700!important}
/* Let the desktop navigation determine its own height within the hero. */
@media(min-width:1101px) {
 body.blog .single-blog-hero .hero-wrapper>.theme-grid,
 body.single-post .single-blog-hero .hero-wrapper>.theme-grid {display:grid;grid-template-columns:240px minmax(0,1fr);gap:24px clamp(32px,5vw,96px);align-items:start}
 body.blog .single-blog-hero .hero-nav,
 body.single-post .single-blog-hero .hero-nav {position:relative;inset:auto!important;grid-column:1;grid-row:1 / span 2;width:100%;height:auto;max-height:none!important;overflow:visible;transform:none!important;padding-right:0}
 body.blog .single-blog-hero .hero-content,
 body.single-post .single-blog-hero .hero-content,
 body.single-post .single-blog-hero .hero-bottom.center {grid-column:2;width:100%!important;min-width:0;margin:0;justify-self:end}
}
@media(max-width:1100px) {
 body.blog .single-blog-hero .hero-content,
 body.single-post .single-blog-hero .hero-content,
 body.single-post .single-blog-hero .hero-bottom.center {width:100%!important;margin-inline:auto}
}
body.single-post .post-breadcrumb {font-size:14px!important}
body.single-post .post-breadcrumb>a {font-size:14px!important;line-height:1.7;color:#8edbe3;text-decoration:none}
body.single-post .post-breadcrumb>a:hover {text-decoration:underline}

/* Keep the blog contact panel below pagination instead of pulling it upward. */
body.blog .prefooter {margin-top:0}