/* =====================================================================
   Oryvan Global blog: listing page, article page, homepage section.
   Loaded only on pages that show blog content.
   ===================================================================== */

/* Blog pages use the same light fixed header as the About page. */
.page-blog .navbar{position:fixed;background:#fff;backdrop-filter:none;border-bottom-color:rgba(10,17,40,.08);box-shadow:0 4px 20px rgba(10,17,40,.08);}
.page-blog .nav-links li a{color:rgba(10,17,40,.72);}
.page-blog .nav-links li a:hover{color:#0A1128;}
.page-blog .hamburger span{background:#0A1128;}
.page-blog .nav-cta-btn{background:#0A1128;color:#F8F9FB;}
.page-blog .nav-cta-btn i{background:#F8F9FB;color:#0A1128;}

/* ---------- Hero tweaks ---------- */
.blog-hero .about-hero-inner > span{margin-bottom:8px;}
.blog-hero .blog-btn{margin-top:26px;}
.blog-post-hero{padding-bottom:58px;}
.blog-post-hero .about-hero-inner > p a{color:inherit;border-bottom:1px solid rgba(240,208,122,.45);padding-bottom:1px;}
.blog-post-hero .about-hero-inner > p a:hover{border-bottom-color:#F0D07A;}
.blog-post-hero .about-hero-inner > p span{opacity:.6;margin:0 4px;}
.blog-post-hero h1{font-size:clamp(26px,3.9vw,44px);max-width:900px;line-height:1.22;}
.blog-post-meta{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 26px;margin-top:26px;font-size:14px;color:rgba(248,249,251,.74);}
.blog-post-meta i{margin-right:6px;color:#7DD3C7;}
.blog-preview-bar{padding:11px 20px;background:#F0D07A;color:#0A1128;font-size:14px;font-weight:600;text-align:center;}

/* ---------- Buttons ---------- */
.blog-btn{display:inline-flex;align-items:center;gap:10px;padding:13px 28px;border-radius:50px;background:#0A1128;color:#F8F9FB;font-family:var(--font-b,'Inter',sans-serif);font-size:14px;font-weight:600;letter-spacing:.2px;transition:transform .25s,box-shadow .25s,background .25s;}
.blog-btn i{font-size:12px;transition:transform .25s;}
.blog-btn:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(10,17,40,.22);}
.blog-btn:hover i{transform:translateX(4px);}
.blog-btn-gold{background:linear-gradient(135deg,#E2B07A,#F0D07A);color:#0A1128;}
.blog-btn-gold:hover{box-shadow:0 10px 26px rgba(226,176,122,.35);}

/* ---------- Listing ---------- */
.blog-list-section{background:#F8F9FB;color:#0A1128;padding:68px 0 88px;}
.blog-filters{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-bottom:40px;}
.blog-filters a{padding:9px 20px;border-radius:50px;border:1px solid rgba(10,17,40,.14);background:#fff;color:rgba(10,17,40,.74);font-size:13.5px;font-weight:500;transition:all .25s;}
.blog-filters a:hover{border-color:#4B3DFF;color:#4B3DFF;}
.blog-filters a.active{background:#0A1128;border-color:#0A1128;color:#F8F9FB;}

.blog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;}
.blog-card{display:flex;flex-direction:column;background:#fff;border:1px solid rgba(10,17,40,.08);border-radius:18px;overflow:hidden;transition:transform .3s,box-shadow .3s,border-color .3s;}
.blog-card:hover{transform:translateY(-5px);border-color:rgba(75,61,255,.28);box-shadow:0 18px 40px rgba(10,17,40,.12);}
.blog-card-media{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;background:linear-gradient(135deg,#0A1128 0%,#2a2399 55%,#0F766E 100%);}
.blog-card-media img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .5s ease;}
.blog-card:hover .blog-card-media img{transform:scale(1.04);}
.blog-card-mark{position:absolute;inset:0;display:grid;place-items:center;color:rgba(248,249,251,.3);font-size:44px;}
.blog-chip{position:absolute;left:14px;top:14px;padding:5px 12px;border-radius:50px;background:rgba(10,17,40,.82);color:#F0D07A;font-size:11px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;line-height:1.5;}
.blog-card-body{display:flex;flex-direction:column;flex:1;padding:22px 24px 24px;}
.blog-card-meta{display:flex;flex-wrap:wrap;gap:6px 0;margin:0 0 10px;font-size:12.5px;font-weight:500;color:rgba(10,17,40,.55);}
.blog-card-meta span + span::before{content:'\2022';margin:0 9px;color:rgba(10,17,40,.3);}
.blog-card-title{margin:0 0 10px;font-family:var(--font-h,'Inter',sans-serif);font-size:19px;font-weight:700;line-height:1.35;color:#0A1128;text-align:left;}
.blog-card-title a{color:inherit;transition:color .25s;}
.blog-card:hover .blog-card-title a{color:#4B3DFF;}
.blog-card-excerpt{margin:0 0 18px;font-size:14.5px;line-height:1.7;color:rgba(10,17,40,.68);}
.blog-card-link{display:inline-flex;align-items:center;gap:8px;margin-top:auto;font-size:14px;font-weight:600;color:#4B3DFF;}
.blog-card-link i{font-size:12px;transition:transform .25s;}
.blog-card:hover .blog-card-link i{transform:translateX(4px);}

.blog-pagination{display:flex;align-items:center;justify-content:center;gap:22px;margin-top:46px;font-size:14px;color:rgba(10,17,40,.6);}
.blog-pagination a{display:inline-flex;align-items:center;gap:8px;padding:10px 20px;border-radius:50px;border:1px solid rgba(10,17,40,.16);background:#fff;color:#0A1128;font-weight:600;transition:all .25s;}
.blog-pagination a:hover{border-color:#4B3DFF;color:#4B3DFF;}

.blog-empty{max-width:560px;margin:0 auto;padding:54px 34px;border:1px dashed rgba(10,17,40,.18);border-radius:20px;background:#fff;text-align:center;}
.blog-empty > i{display:inline-grid;place-items:center;width:58px;height:58px;border-radius:50%;background:rgba(75,61,255,.1);color:#4B3DFF;font-size:22px;margin-bottom:18px;}
.blog-empty h2{font-family:var(--font-h,'Inter',sans-serif);font-size:24px;line-height:1.3;color:#0A1128;margin:0 0 10px;}
.blog-empty p{font-size:15px;line-height:1.7;color:rgba(10,17,40,.66);margin:0 0 24px;}

/* ---------- Article ---------- */
.blog-post-section{background:#fff;color:#0A1128;padding:54px 0 70px;}
.blog-post-wrap{display:block;max-width:800px;margin:0 auto;padding:0 24px;}
.blog-post-cover{margin:0 0 36px;border-radius:18px;overflow:hidden;box-shadow:0 18px 44px rgba(10,17,40,.14);}
.blog-post-cover img{display:block;width:100%;height:auto;}
.blog-post-lead{margin:0 0 30px;padding-left:20px;border-left:4px solid #E2B07A;font-size:19px;line-height:1.65;font-weight:500;color:#0A1128;}

.blog-content{font-size:17px;line-height:1.8;color:#2a3350;overflow-wrap:break-word;}
.blog-content > *:first-child{margin-top:0;}
.blog-content > *:last-child{margin-bottom:0;}
.blog-content p{margin:0 0 1.25em;}
.blog-content h2{margin:1.9em 0 .6em;font-family:var(--font-h,'Inter',sans-serif);font-size:27px;font-weight:700;line-height:1.3;color:#0A1128;}
.blog-content h3{margin:1.7em 0 .5em;font-family:var(--font-h,'Inter',sans-serif);font-size:21px;font-weight:700;line-height:1.35;color:#0A1128;}
.blog-content h4{margin:1.5em 0 .5em;font-size:18px;font-weight:700;color:#0A1128;}
.blog-content strong,.blog-content b{font-weight:700;color:#0A1128;}
.blog-content em,.blog-content i{font-style:italic;}
.blog-content u{text-decoration:underline;text-underline-offset:3px;}
.blog-content a{color:#4B3DFF;text-decoration:underline;text-decoration-color:rgba(75,61,255,.4);text-underline-offset:3px;transition:text-decoration-color .2s;}
.blog-content a:hover{text-decoration-color:#4B3DFF;}
.blog-content ul,.blog-content ol{margin:0 0 1.25em;padding-left:1.5em;}
.blog-content ul{list-style:disc;}
.blog-content ol{list-style:decimal;}
.blog-content li{margin:.4em 0;padding-left:.2em;}
.blog-content li::marker{color:#4B3DFF;font-weight:600;}
.blog-content blockquote{margin:1.7em 0;padding:6px 0 6px 22px;border-left:4px solid #E2B07A;font-size:19px;line-height:1.65;font-style:italic;color:#0A1128;}
.blog-content img{display:block;max-width:100%;height:auto;margin:1.7em auto;border-radius:14px;}
.blog-content pre{margin:1.5em 0;padding:18px 20px;border-radius:12px;background:#0A1128;color:#F8F9FB;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:14px;line-height:1.65;overflow-x:auto;white-space:pre;}
.blog-content code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.92em;}
.blog-content hr{margin:2.2em 0;border:0;border-top:1px solid rgba(10,17,40,.12);}

.blog-post-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px;margin-top:46px;padding-top:26px;border-top:1px solid rgba(10,17,40,.1);}
.blog-back{display:inline-flex;align-items:center;gap:9px;font-size:14.5px;font-weight:600;color:#0A1128;transition:color .25s;}
.blog-back:hover{color:#4B3DFF;}
.blog-back i{font-size:12px;}
.blog-share{display:flex;align-items:center;gap:9px;}
.blog-share > span{margin-right:4px;font-size:12.5px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;color:rgba(10,17,40,.5);}
.blog-share a,.blog-share button{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;border:1px solid rgba(10,17,40,.14);background:#fff;color:#0A1128;font-size:15px;cursor:pointer;transition:all .25s;}
.blog-share a:hover,.blog-share button:hover{background:#0A1128;border-color:#0A1128;color:#F8F9FB;transform:translateY(-2px);}
.blog-share button.copied{background:#0F766E;border-color:#0F766E;color:#fff;}

.blog-more-section{padding-top:64px;border-top:1px solid rgba(10,17,40,.06);}
.blog-more-kicker{margin:0 0 10px;font-size:13px;font-weight:800;letter-spacing:3px;text-transform:uppercase;text-align:center;color:#4B3DFF;}
.blog-more-title{margin:0 0 36px;font-family:var(--font-h,'Inter',sans-serif);font-size:clamp(24px,3vw,34px);font-weight:700;line-height:1.25;text-align:center;color:#0A1128;}

/* ---------- Call to action band ---------- */
.blog-cta{position:relative;overflow:hidden;padding:62px 0;background:#0A1128;color:#F8F9FB;}
.blog-cta::before{content:'';position:absolute;right:-120px;top:-160px;width:460px;height:460px;border-radius:50%;background:radial-gradient(circle,rgba(75,61,255,.42),transparent 68%);pointer-events:none;}
.blog-cta .container{position:relative;display:flex;align-items:center;justify-content:space-between;gap:30px;flex-wrap:wrap;}
.blog-cta-kicker{margin:0 0 8px;font-size:13px;font-weight:800;letter-spacing:3px;text-transform:uppercase;color:#F0D07A;}
.blog-cta h2{margin:0 0 8px;font-family:var(--font-h,'Inter',sans-serif);font-size:clamp(24px,3vw,34px);font-weight:700;line-height:1.25;color:#fff;}
.blog-cta p:not(.blog-cta-kicker){margin:0;font-size:15.5px;color:rgba(248,249,251,.72);}

/* ---------- Homepage section ---------- */
.blog-home-section{padding:76px 0 84px;background:#F8F9FB;}
.blog-home-section .sec-eyebrow{color:#4B3DFF;}
.blog-home-section .sec-h2{color:#0A1128;}
.blog-home-section .sec-h2 span{color:#0F766E;}
.blog-home-intro{max-width:620px;margin:0 auto 40px;text-align:center;font-size:15.5px;line-height:1.7;color:rgba(10,17,40,.66);}
.blog-home-more{margin-top:40px;text-align:center;}

/* Up to three cards in one centred row (homepage and "more articles"). */
.blog-home-section .blog-grid,.blog-more-section .blog-grid{display:flex;flex-wrap:wrap;justify-content:center;}
.blog-home-section .blog-card,.blog-more-section .blog-card{flex:0 1 calc((100% - 56px) / 3);min-width:0;}

/* ---------- Responsive ---------- */
@media (max-width:980px){
  .blog-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;}
  .blog-home-section .blog-card,.blog-more-section .blog-card{flex-basis:calc((100% - 22px) / 2);}
}
@media (max-width:640px){
  .blog-grid{grid-template-columns:1fr;}
  .blog-home-section .blog-card,.blog-more-section .blog-card{flex-basis:100%;}
  .blog-list-section{padding:48px 0 60px;}
  .blog-filters{justify-content:flex-start;margin-bottom:28px;}
  .blog-post-section{padding:36px 0 52px;}
  .blog-post-wrap{padding:0 20px;}
  .blog-post-cover{margin-bottom:26px;border-radius:14px;}
  .blog-post-lead{font-size:17px;}
  .blog-content{font-size:16px;}
  .blog-content h2{font-size:23px;}
  .blog-content h3{font-size:19px;}
  .blog-content blockquote{font-size:17px;}
  .blog-post-meta{gap:8px 18px;font-size:13px;}
  .blog-cta{padding:48px 0;}
  .blog-cta .container{flex-direction:column;align-items:flex-start;}
  .blog-home-section{padding:56px 0 62px;}
  .blog-preview-bar{font-size:13px;}
}