/* Ocoos Web Consulting - site-wide styles. Footer, blog list, blog posts. */
/* ---- Footer ---- */
footer .page-section[data-section-id="6a72b783d46e43364b7a7101"]{display:none!important}
.ocf p,.ocf li,.ocf div,.ocf h4,.ocf .band .in{text-align:left!important}
footer .page-section[data-section-id="6a72b783d46e43364b7a7101"]{display:none!important}
.ocf{--blue:#155387;--blue-l:#9fd0ff;--dark:#2a2829;--darker:#201e1f;--txt:#e9e9e9;--mut:#b9b9b9;width:100vw;margin-left:calc(50% - 50vw);font-family:Poppins,system-ui,sans-serif;font-size:16px;line-height:1.6;color:var(--txt);background:var(--dark);text-align:left;overflow:hidden}
.ocf *{box-sizing:border-box}
.ocf .band{background:linear-gradient(135deg,#155387,#0e3c63);padding:34px 24px}
.ocf .band .in{max-width:1180px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.ocf .band p{margin:0;font-size:22px;font-weight:600;color:#fff;line-height:1.3}
.ocf .band small{display:block;font-size:15px;font-weight:400;color:#d6e4f2;margin-top:4px}
.ocf .btns{display:flex;gap:12px;flex-wrap:wrap}
.ocf .btn{display:inline-flex;align-items:center;justify-content:center;font:600 15px Poppins,sans-serif;border-radius:10px;padding:13px 22px;text-decoration:none!important;border:2px solid transparent;border-bottom:2px solid transparent!important;line-height:1.2;transition:transform .18s,background .18s}
.ocf .btn:hover{transform:translateY(-2px)}
.ocf .btn-l{background:#fff;color:#155387!important}
.ocf .btn-g{border-color:rgba(255,255,255,.7)!important;color:#fff!important}
.ocf .btn-g:hover{background:rgba(255,255,255,.12)}
.ocf .main{max-width:1180px;margin:0 auto;padding:56px 24px 36px;display:grid;grid-template-columns:1.3fr 1fr 1fr 1.1fr;gap:40px}
.ocf h4{margin:0 0 14px!important;padding:0!important;font:600 14px Poppins,sans-serif!important;letter-spacing:.12em;text-transform:uppercase!important;color:var(--blue-l)!important}
.ocf p{margin:0 0 10px;color:var(--mut);font-size:15px}
.ocf .brand{font:700 20px Poppins,sans-serif;color:#fff;margin-bottom:10px}
.ocf ul{list-style:none;margin:0;padding:0}
.ocf li{margin:0 0 8px}
.ocf a{color:var(--txt)!important;text-decoration:none!important;border-bottom:0!important;font-size:15px}
.ocf li a:hover,.ocf .ph:hover{color:#fff!important;text-decoration:underline!important}
.ocf .ph{font-size:18px;font-weight:600;color:#fff!important;display:inline-block;margin:2px 0 8px}
.ocf .soc{display:flex;gap:10px;margin-top:16px}
.ocf .soc a{width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.1);display:grid;place-items:center;transition:background .18s,transform .18s}
.ocf .soc a:hover{background:var(--blue);transform:translateY(-2px)}
.ocf .soc svg{width:18px;height:18px;fill:#fff}
.ocf .bar{border-top:1px solid rgba(255,255,255,.14);background:var(--darker)}
.ocf .bar .in{max-width:1180px;margin:0 auto;padding:18px 24px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:14px;color:var(--mut)}
.ocf .bar a{font-size:14px;color:var(--mut)!important;margin-left:18px}
.ocf .bar a:first-child{margin-left:0}
.ocf *:focus-visible{outline:3px solid #f2b705;outline-offset:3px}
@media(max-width:1000px){.ocf .main{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.ocf .main{grid-template-columns:1fr;gap:30px;padding:44px 18px 28px}.ocf .band{padding:30px 18px}.ocf .band .btns,.ocf .btn{width:100%}.ocf .bar .in{padding:16px 18px;flex-direction:column}.ocf .bar a{margin:0 18px 0 0}}
/* ---- Blog list ---- */
.page-section.ocb-banner{background:radial-gradient(circle at 85% 20%,rgba(159,208,255,.35) 0,rgba(159,208,255,0) 45%),linear-gradient(120deg,#0b2d4d 0%,#155387 55%,#2a85c9 100%)!important}
.page-section.ocb-banner .section-border,.page-section.ocb-banner .section-background{background:transparent!important;background-color:transparent!important}
.page-section.ocb-banner .content-wrapper{padding-top:70px!important;padding-bottom:70px!important}
.page-section.ocb-banner h1{font-size:clamp(40px,6vw,64px)!important;font-weight:700!important;letter-spacing:-.02em!important;color:#fff!important;text-align:center!important;margin:0!important}
.ocb-sub{color:#d6e4f2;font-size:19px;line-height:1.6;max-width:640px;margin:14px auto 0;text-align:center;font-weight:400}
.blog-basic-grid.collection-content-wrapper{gap:32px!important}
.blog-basic-grid--container.blog-item,.blog-basic-grid--container.blog-item *{box-sizing:border-box}
.blog-basic-grid--container.blog-item{background:#fff;border:1px solid #dbe3ec;border-radius:16px;overflow:hidden;box-shadow:0 2px 10px rgba(21,83,135,.06);transition:transform .25s ease,box-shadow .25s ease,border-color .25s;display:flex!important;flex-direction:column;height:100%}
.blog-basic-grid--container.blog-item:hover{transform:translateY(-6px);box-shadow:0 22px 44px rgba(21,83,135,.18);border-color:#b8cfe4}
.blog-basic-grid--container.blog-item .image-wrapper{display:block;overflow:hidden;margin:0!important;position:relative!important;padding:0!important;height:auto!important;aspect-ratio:16/10}
.blog-basic-grid--container.blog-item .image-wrapper img{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;transition:transform .5s ease}
.blog-basic-grid--container.blog-item:hover .image-wrapper img{transform:scale(1.06)}
.blog-basic-grid--container.blog-item .blog-article-spacer{display:none}
.blog-basic-grid--container.blog-item .blog-basic-grid--text{padding:22px 24px 26px!important;display:flex;flex-direction:column;flex:1;width:100%;min-width:0;opacity:1!important}
.blog-basic-grid--container.blog-item .blog-meta-section{order:-1;margin-bottom:12px;opacity:1!important}
.blog-basic-grid--container.blog-item .blog-meta-secondary,.blog-basic-grid--container.blog-item .blog-meta-delimiter,.blog-basic-grid--container.blog-item .blog-author,.blog-basic-grid--container.blog-item .blog-more-link{display:none!important}
.blog-basic-grid--container.blog-item .blog-categories-list{display:inline-flex;flex-wrap:wrap;gap:6px}
.blog-basic-grid--container.blog-item .blog-categories{display:inline-block;background:#e8f0f7;color:#155387!important;font-size:12px!important;font-weight:600;letter-spacing:.08em;text-transform:uppercase;padding:5px 11px;border-radius:99px;text-decoration:none!important}
.blog-basic-grid--container.blog-item .blog-categories--comma{display:none}
.blog-basic-grid--container.blog-item .blog-date{display:inline-block;margin-left:8px;font-size:13px;color:#5a6676}
.blog-basic-grid--container.blog-item .blog-title,.blog-basic-grid--container.blog-item h1,.blog-basic-grid--container.blog-item h2,.blog-basic-grid--container.blog-item h3{font-size:22px!important;line-height:1.25!important;font-weight:600!important;margin:0 0 10px!important}
.blog-basic-grid--container.blog-item .blog-title a,.blog-basic-grid--container.blog-item h1 a,.blog-basic-grid--container.blog-item h2 a,.blog-basic-grid--container.blog-item h3 a{color:#1d2430!important;text-decoration:none!important}
.blog-basic-grid--container.blog-item:hover .blog-title a,.blog-basic-grid--container.blog-item:hover h1 a,.blog-basic-grid--container.blog-item:hover h2 a,.blog-basic-grid--container.blog-item:hover h3 a{color:#155387!important}
.blog-basic-grid--container.blog-item .blog-excerpt,.blog-basic-grid--container.blog-item .blog-excerpt p{color:#5a6676;font-size:16px!important;line-height:1.6!important;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;max-width:100%;overflow-wrap:anywhere}
.blog-basic-grid--container.blog-item .blog-basic-grid--text::after{content:"Read article \2192";margin-top:auto;padding-top:16px;font-weight:600;font-size:15px;color:#155387;transition:letter-spacing .2s}
.blog-basic-grid--container.blog-item:hover .blog-basic-grid--text::after{letter-spacing:.03em}
@media(min-width:1000px){.blog-basic-grid.collection-content-wrapper>.blog-basic-grid--container.blog-item:first-child{grid-column:1/-1;flex-direction:row}
.blog-basic-grid.collection-content-wrapper>.blog-basic-grid--container.blog-item:first-child>div:first-child{flex:1.25}
.blog-basic-grid.collection-content-wrapper>.blog-basic-grid--container.blog-item:first-child .image-wrapper{height:100%!important;min-height:360px;aspect-ratio:auto}
.blog-basic-grid.collection-content-wrapper>.blog-basic-grid--container.blog-item:first-child .blog-basic-grid--text{flex:1;justify-content:center;padding:40px!important}
.blog-basic-grid.collection-content-wrapper>.blog-basic-grid--container.blog-item:first-child .blog-title,.blog-basic-grid.collection-content-wrapper>.blog-basic-grid--container.blog-item:first-child h2{font-size:32px!important}
.blog-basic-grid.collection-content-wrapper>.blog-basic-grid--container.blog-item:first-child .blog-basic-grid--text::before{content:"Latest";order:-2;align-self:flex-start;background:#f2b705;color:#2a2829;font-weight:700;font-size:12px;letter-spacing:.1em;text-transform:uppercase;padding:5px 12px;border-radius:99px;margin-bottom:14px}}
@media(prefers-reduced-motion:reduce){.blog-basic-grid--container.blog-item,.blog-basic-grid--container.blog-item img{transition:none!important}}
/* ---- Blog post ---- */
/* Ocoos blog post */
.blog-item-wrapper .blog-item-top-wrapper{max-width:860px;margin:0 auto;text-align:center}
.blog-item-wrapper h1.entry-title{font-size:clamp(34px,4.6vw,54px)!important;line-height:1.1!important;font-weight:700!important;letter-spacing:-.02em!important;color:#0f2a47!important;margin:14px 0 18px!important}
.blog-item-wrapper .blog-item-meta-wrapper,.blog-item-wrapper .blog-item-author-date-wrapper{justify-content:center;text-align:center}
.blog-item-wrapper .blog-item-category{display:inline-block;background:#e8f0f7;color:#155387!important;font-size:12px!important;font-weight:600;letter-spacing:.08em;text-transform:uppercase;padding:5px 12px;border-radius:99px;text-decoration:none!important;margin:0 4px}
.blog-item-wrapper .blog-item-category:hover{background:#155387;color:#fff!important}
.blog-item-wrapper .blog-meta-item--date,.blog-item-wrapper .blog-author-name{color:#5a6676!important;font-size:14px!important}
.blog-item-wrapper .blog-item-content{max-width:780px;margin:0 auto;font-size:19px;line-height:1.8;color:#2b3340}
.blog-item-wrapper .blog-item-content p{font-size:19px;line-height:1.8;color:#2b3340;margin:0 0 1.15em}
.blog-item-wrapper .blog-item-content h2{font-size:clamp(26px,3.2vw,34px)!important;line-height:1.2!important;font-weight:600!important;color:#155387!important;margin:2em 0 .6em!important;padding-left:16px;border-left:5px solid #f2b705;text-transform:none!important}
.blog-item-wrapper .blog-item-content h3{font-size:clamp(21px,2.4vw,26px)!important;line-height:1.3!important;font-weight:600!important;color:#1d2430!important;margin:1.6em 0 .5em!important;text-transform:none!important}
.blog-item-wrapper .blog-item-content a:not(.sqs-block-button-element):not(.ocb-btn){color:#155387!important;text-decoration:underline!important;text-decoration-thickness:2px;text-underline-offset:3px;text-decoration-color:rgba(242,183,5,.8);transition:text-decoration-color .2s,color .2s}
.blog-item-wrapper .blog-item-content a:not(.sqs-block-button-element):not(.ocb-btn):hover{color:#0f3f67!important;text-decoration-color:#155387}
.blog-item-wrapper .blog-item-content ul,.blog-item-wrapper .blog-item-content ol{margin:0 0 1.3em 1.2em;padding:0}
.blog-item-wrapper .blog-item-content li{margin:0 0 .5em;font-size:19px;line-height:1.7}
.blog-item-wrapper .blog-item-content li::marker{color:#155387;font-weight:700}
.blog-item-wrapper .blog-item-content blockquote{background:#e8f0f7;border-left:5px solid #155387;border-radius:0 14px 14px 0;padding:22px 26px;margin:1.8em 0;font-size:20px;line-height:1.6;color:#0f2a47}
.blog-item-wrapper .blog-item-content blockquote p{margin:0;font-size:inherit}
.blog-item-wrapper .blog-item-content img{border-radius:14px}
.blog-item-wrapper .blog-item-content .sqs-block-image img{box-shadow:0 14px 34px rgba(15,42,71,.16)}
.blog-item-wrapper .blog-item-content .image-block-outer-wrapper{margin-bottom:1.6em}
#ocb-progress{position:fixed;top:0;left:0;height:4px;width:0;background:linear-gradient(90deg,#155387,#2a85c9,#f2b705);z-index:9999;transition:width .1s linear}
.blog-item-wrapper .blog-item-content .ocb-cta{max-width:780px;margin:3em auto 1em;padding:36px 34px;border-radius:18px;text-align:center;color:#fff;background:radial-gradient(circle at 85% 15%,rgba(159,208,255,.4) 0,rgba(159,208,255,0) 45%),linear-gradient(120deg,#0b2d4d 0%,#155387 55%,#2a85c9 100%);box-shadow:0 20px 44px rgba(15,42,71,.25)}
.blog-item-wrapper .blog-item-content .ocb-cta h3{margin:0 0 10px!important;color:#fff!important;font-size:clamp(24px,3vw,30px)!important;line-height:1.2!important;font-weight:700!important}
.blog-item-wrapper .blog-item-content .ocb-cta p{margin:0 auto 22px!important;max-width:540px;color:#d6e4f2!important;font-size:18px!important;line-height:1.6!important}
.ocb-cta .row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.ocb-btn{display:inline-flex;align-items:center;justify-content:center;font:600 16px Poppins,sans-serif;border-radius:10px;padding:14px 24px;text-decoration:none!important;border:2px solid transparent;line-height:1.2;transition:transform .18s}
.ocb-btn:hover{transform:translateY(-2px)}
.ocb-btn.l{background:#fff;color:#155387!important}
.ocb-btn.g{border-color:rgba(255,255,255,.7);color:#fff!important}
@media(max-width:600px){.blog-item-wrapper .blog-item-content,.blog-item-wrapper .blog-item-content p,.blog-item-wrapper .blog-item-content li{font-size:17px}.blog-item-wrapper .blog-item-content .ocb-cta{padding:28px 20px;margin-left:16px;margin-right:16px}.ocb-btn{width:100%}}
