/* Shared styles for UNOMAS dynamic pages, landings and editorial content */

.unomas-header .unomas-navbar-inner{
    min-height:84px;
    display:flex;
    align-items:center;
}
.unomas-header .unomas-nav-panel{
    display:flex;
    align-items:center;
    margin-left:auto;
    gap:24px;
}
.unomas-header .unomas-nav-links{
    list-style:none;
    display:flex;
    align-items:center;
    gap:3px;
    margin:0;
    padding:0;
}
.unomas-header .unomas-nav-links .nav-link.active:after{
    transform:scaleX(1);
}
.unomas-nav-dropdown{
    position:relative;
}
.unomas-nav-dropdown>.nav-link i{
    margin-left:5px;
    font-size:9px;
    transition:.2s;
}
.unomas-dropdown-menu{
    position:absolute;
    top:calc(100% - 10px);
    left:0;
    width:330px;
    margin:0;
    padding:9px;
    list-style:none;
    background:#0a141f;
    border:1px solid rgba(255,255,255,.1);
    border-radius:12px;
    box-shadow:0 24px 60px rgba(0,0,0,.32);
    opacity:0;
    visibility:hidden;
    transform:translateY(10px);
    transition:.2s ease;
}
.unomas-dropdown-menu-right{
    left:auto;
    right:0;
}
.unomas-nav-dropdown:hover>.unomas-dropdown-menu,
.unomas-nav-dropdown.is-open>.unomas-dropdown-menu{
    opacity:1;
    visibility:visible;
    transform:translateY(0);
}
.unomas-nav-dropdown:hover>.nav-link i,
.unomas-nav-dropdown.is-open>.nav-link i{
    transform:rotate(180deg);
}
.unomas-dropdown-menu li+li{
    margin-top:4px;
}
.unomas-dropdown-menu a{
    display:flex;
    align-items:center;
    gap:13px;
    padding:12px;
    border-radius:8px;
    text-decoration:none!important;
    color:#fff!important;
    transition:.2s;
}
.unomas-dropdown-menu a:hover{
    background:rgba(255,255,255,.055);
}
.unomas-dropdown-icon{
    width:38px;
    height:38px;
    flex:0 0 38px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:9px;
    background:#111f2d;
    color:var(--um-red);
}
.unomas-dropdown-menu b{
    display:block;
    font-size:13px;
}
.unomas-dropdown-menu small{
    display:block;
    margin-top:3px;
    color:#8795a4;
    font-size:10px;
    line-height:1.4;
}

/* generic dynamic pages */
.um-dynamic-page{
    background:#fff;
    color:#111922;
    min-height:55vh;
    padding-top:84px;
}
.um-dynamic-page img{
    max-width:100%;
    height:auto;
}
.um-dynamic-page a{
    transition:.2s;
}

/* landing bridge */
.unomas-landing-body{
    background:#fff!important;
}
.unomas-landing-shell{
    min-height:100vh;
    background:#fff;
}
.unomas-landing-shell .unomas-header{
    position:absolute;
}
.unomas-landing-main{
    min-height:45vh;
}
.unomas-landing-main img{
    max-width:100%;
}
.unomas-landing-main>.landing-main{
    margin:0;
}
.unomas-landing-shell #page-content-wrapper,
.unomas-landing-shell .page-content{
    margin:0;
    padding:0;
}

/* editorial hero */
.um-content-hero{
    padding:170px 0 92px;
    color:#fff;
    background:
        radial-gradient(circle at 80% 30%,rgba(229,57,53,.13),transparent 25%),
        linear-gradient(120deg,#050b12,#0a1723);
    position:relative;
    overflow:hidden;
}
.um-content-hero:after{
    content:"";
    position:absolute;
    width:580px;
    height:580px;
    border:1px solid rgba(255,255,255,.06);
    border-radius:50%;
    right:-120px;
    top:-190px;
}
.um-content-hero h1{
    max-width:850px;
    font-size:58px;
    line-height:1.05;
    letter-spacing:-.04em;
    margin:13px 0 20px;
}
.um-content-hero h1 strong{
    color:var(--um-red-2);
}
.um-content-hero p{
    max-width:700px;
    color:#b9c4cf;
    font-size:17px;
    line-height:1.75;
}

/* blog */
.um-blog-page{
    background:#f5f6f8;
    color:#131b24;
    padding:88px 0 100px;
}
.um-blog-page-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:25px;
}
.um-blog-page-card{
    background:#fff;
    border:1px solid #e1e6eb;
    border-radius:15px;
    overflow:hidden;
    box-shadow:0 12px 35px rgba(8,18,28,.055);
    display:flex;
    flex-direction:column;
    min-width:0;
}
.um-blog-page-media{
    display:block;
    position:relative;
    aspect-ratio:16/9;
    overflow:hidden;
    background:#09131e;
}
.um-blog-page-media img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:.4s;
}
.um-blog-page-card:hover .um-blog-page-media img{
    transform:scale(1.035);
}
.um-media-type{
    position:absolute;
    inset:50% auto auto 50%;
    transform:translate(-50%,-50%);
    width:50px;
    height:50px;
    border-radius:50%;
    display:grid;
    place-items:center;
    background:var(--um-red);
    color:#fff;
}
.um-blog-placeholder{
    height:100%;
    display:grid;
    place-items:center;
    color:var(--um-red);
    font-size:34px;
    background:
        radial-gradient(circle at 75% 30%,rgba(229,57,53,.12),transparent 25%),
        #0a1520;
}
.um-blog-page-content{
    padding:26px;
    display:flex;
    flex-direction:column;
    flex:1;
}
.um-blog-meta{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    color:#87919b;
    font-size:11px;
}
.um-blog-meta>span{
    color:var(--um-red);
    font-size:10px;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.08em;
}
.um-blog-page-content h2{
    font-size:21px;
    line-height:1.3;
    margin:14px 0 11px;
}
.um-blog-page-content h2 a{
    color:#101922;
    text-decoration:none;
}
.um-blog-page-content p{
    color:#65707b;
    line-height:1.7;
    font-size:14px;
    margin:0 0 18px;
}
.um-content-link{
    color:var(--um-red)!important;
    text-decoration:none!important;
    font-size:13px;
    font-weight:800;
    margin-top:auto;
}
.um-content-link i{
    margin-left:8px;
}
.um-pagination{
    display:flex;
    justify-content:center;
    margin-top:50px;
}
.um-pagination .pagination{
    margin:0;
}
.um-empty-content{
    max-width:650px;
    margin:auto;
    padding:70px 30px;
    background:#fff;
    border:1px solid #e0e5ea;
    border-radius:16px;
    text-align:center;
}
.um-empty-content>span{
    width:70px;
    height:70px;
    display:grid;
    place-items:center;
    margin:0 auto 18px;
    border-radius:50%;
    background:#07101a;
    color:var(--um-red);
    font-size:25px;
}
.um-empty-content h3{
    font-size:24px;
}
.um-empty-content p{
    color:#69747f;
}
.um-content-cta{
    background:#fff;
    padding:0 0 80px;
}
.um-content-cta-box{
    padding:38px 44px;
    border-radius:15px;
    background:#07101a;
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:30px;
}
.um-content-cta-box h2{
    margin:7px 0;
    font-size:28px;
}
.um-content-cta-box p{
    color:#aab5c0;
    margin:0;
}

/* article */
.um-article-hero{
    padding:150px 0 75px;
    color:#fff;
    background:
        radial-gradient(circle at 76% 20%,rgba(229,57,53,.12),transparent 28%),
        linear-gradient(120deg,#050b12,#0a1723);
}
.um-article-back{
    color:#9ca9b6!important;
    text-decoration:none!important;
    font-size:12px;
    display:inline-flex;
    align-items:center;
    gap:8px;
    margin-bottom:45px;
}
.um-article-hero-inner{
    max-width:950px;
}
.um-article-hero h1{
    font-size:56px;
    line-height:1.06;
    letter-spacing:-.04em;
    margin:12px 0 18px;
}
.um-article-hero p{
    color:#b7c2cd;
    max-width:780px;
    font-size:17px;
    line-height:1.7;
}
.um-article-meta{
    display:flex;
    gap:25px;
    color:#8492a0;
    font-size:12px;
    margin-top:27px;
}
.um-article-meta i{
    margin-right:7px;
    color:var(--um-red);
}
.um-article-section{
    padding:75px 0 100px;
    background:#f5f6f8;
    color:#17212a;
}
.um-article-layout{
    display:grid;
    grid-template-columns:minmax(0,1fr) 310px;
    gap:32px;
    align-items:start;
}
.um-article-card{
    min-width:0;
    background:#fff;
    border:1px solid #e1e6eb;
    border-radius:16px;
    overflow:hidden;
}
.um-article-media img{
    display:block;
    width:100%;
    height:auto;
}
.um-article-slider{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:2px;
}
.um-article-slider img{
    width:100%;
    aspect-ratio:16/10;
    object-fit:cover;
}
.um-article-video{
    aspect-ratio:16/9;
    background:#050b12;
}
.um-article-video iframe,
.um-article-video .player{
    width:100%;
    height:100%;
    border:0;
}
.um-article-audio{
    padding:25px;
    background:#0a1520;
}
.um-article-quote{
    padding:65px;
    background:#07101a;
    color:#fff;
}
.um-article-quote>i{
    color:var(--um-red);
    font-size:28px;
}
.um-article-quote blockquote{
    font-size:27px;
    line-height:1.5;
    margin:20px 0;
    border:0;
    padding:0;
}
.um-article-quote span{
    color:#9da9b5;
}
.um-article-body{
    padding:50px 58px;
    font-size:16px;
    line-height:1.82;
    color:#3d4853;
}
.um-article-body h2,
.um-article-body h3,
.um-article-body h4{
    color:#111922;
    line-height:1.25;
    margin-top:1.5em;
}
.um-article-body h2{font-size:30px}
.um-article-body h3{font-size:24px}
.um-article-body a{color:var(--um-red)}
.um-article-body img{
    max-width:100%;
    border-radius:9px;
    height:auto;
}
.um-article-body blockquote{
    border-left:3px solid var(--um-red);
    background:#f5f6f8;
    padding:22px 25px;
    color:#303b45;
}
.um-article-navigation{
    display:grid;
    grid-template-columns:1fr 1fr;
    border-top:1px solid #e5e9ee;
}
.um-article-nav-item{
    min-height:120px;
    padding:27px 35px;
    display:flex;
    align-items:center;
    color:#1a232c!important;
    text-decoration:none!important;
}
.um-article-nav-item+.um-article-nav-item{
    border-left:1px solid #e5e9ee;
}
.um-article-nav-item span{
    display:flex;
    flex-direction:column;
}
.um-article-nav-item small{
    color:var(--um-red);
    font-size:10px;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.08em;
    margin-bottom:7px;
}
.um-article-nav-item b{
    line-height:1.35;
    font-size:14px;
}
.um-article-nav-next{
    text-align:right;
    justify-content:flex-end;
}
.um-article-sidebar{
    position:sticky;
    top:110px;
    display:grid;
    gap:18px;
}
.um-sidebar-card,
.um-sidebar-dark{
    border-radius:13px;
    padding:27px;
}
.um-sidebar-card{
    background:#fff;
    border:1px solid #e1e6eb;
}
.um-sidebar-card h3,
.um-sidebar-dark h3{
    font-size:19px;
    margin:8px 0 16px;
}
.um-share{
    display:flex;
    gap:9px;
}
.um-share a{
    width:40px;
    height:40px;
    border-radius:50%;
    display:grid;
    place-items:center;
    background:#07101a;
    color:#fff!important;
    text-decoration:none!important;
}
.um-share a:hover{
    background:var(--um-red);
}
.um-tags{
    display:flex;
    flex-wrap:wrap;
    gap:7px;
}
.um-tags a{
    padding:7px 10px;
    border:1px solid #e0e5e9;
    border-radius:6px;
    color:#56616c!important;
    text-decoration:none!important;
    font-size:11px;
}
.um-sidebar-dark{
    background:#07101a;
    color:#fff;
}
.um-sidebar-dark p{
    color:#9fabbb;
    font-size:13px;
    line-height:1.7;
}
.um-sidebar-dark>a{
    display:inline-flex;
    align-items:center;
    gap:8px;
    color:var(--um-red)!important;
    text-decoration:none!important;
    font-size:12px;
    font-weight:800;
}

/* mobile */
@media(max-width:1100px){
    .unomas-header .unomas-nav-panel{
        position:fixed;
        inset:84px 0 auto 0;
        display:none;
        max-height:calc(100vh - 84px);
        overflow:auto;
        background:#07101a;
        border-top:1px solid rgba(255,255,255,.08);
        padding:22px 28px 30px;
        margin:0;
    }
    .unomas-header .unomas-nav-panel.is-open{
        display:block;
    }
    .unomas-header .unomas-nav-links{
        display:block;
    }
    .unomas-header .unomas-nav-links .nav-link{
        display:flex;
        justify-content:space-between;
        padding:15px 0!important;
        border-bottom:1px solid rgba(255,255,255,.07);
    }
    .unomas-header .unomas-nav-links .nav-link:after{
        display:none;
    }
    .unomas-header .unomas-nav-actions{
        margin-top:20px;
    }
    .unomas-header .unomas-nav-actions .unomas-btn{
        width:100%;
    }
    .unomas-toggler{
        display:block!important;
        margin-left:auto;
    }
    .unomas-dropdown-menu,
    .unomas-dropdown-menu-right{
        position:static;
        width:100%;
        display:none;
        opacity:1;
        visibility:visible;
        transform:none;
        box-shadow:none;
        border:0;
        border-radius:0;
        background:rgba(255,255,255,.025);
        margin:4px 0 10px;
    }
    .unomas-nav-dropdown.is-open>.unomas-dropdown-menu{
        display:block;
    }
    .um-blog-page-grid{
        grid-template-columns:repeat(2,1fr);
    }
    .um-article-layout{
        grid-template-columns:1fr;
    }
    .um-article-sidebar{
        position:static;
        grid-template-columns:repeat(2,1fr);
    }
}
@media(max-width:700px){
    .unomas-container{
        width:calc(100% - 30px);
    }
    .um-content-hero{
        padding:140px 0 68px;
    }
    .um-content-hero h1,
    .um-article-hero h1{
        font-size:38px;
    }
    .um-blog-page{
        padding:60px 0 75px;
    }
    .um-blog-page-grid{
        grid-template-columns:1fr;
    }
    .um-content-cta-box{
        padding:30px 23px;
        align-items:flex-start;
        flex-direction:column;
    }
    .um-article-hero{
        padding:135px 0 58px;
    }
    .um-article-back{
        margin-bottom:28px;
    }
    .um-article-section{
        padding:45px 0 70px;
    }
    .um-article-body{
        padding:31px 23px;
        font-size:15px;
    }
    .um-article-slider{
        grid-template-columns:1fr;
    }
    .um-article-quote{
        padding:40px 25px;
    }
    .um-article-quote blockquote{
        font-size:21px;
    }
    .um-article-navigation{
        grid-template-columns:1fr;
    }
    .um-article-nav-item+.um-article-nav-item{
        border-left:0;
        border-top:1px solid #e5e9ee;
    }
    .um-article-sidebar{
        grid-template-columns:1fr;
    }
}
