/* Blogs Page CSS - Extracted from base.css */

.blog-article { background: var(--color-bg);}
.blog-hero { background: linear-gradient(135deg, #4a61ff, #384df5); color: #ffffff; padding: clamp(88px, 12vw, 120px) 0 clamp(60px, 10vw, 96px); position: relative; overflow: hidden; }
.blog-hero::after { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 80% 20%, rgba(255,255,255,.18), transparent 55%); pointer-events: none;}
.blog-hero-inner { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: clamp(32px, 4vw, 60px); }
.blog-hero-copy { max-width: 720px; display: flex; flex-direction: column; gap: 20px;}
.blog-hero h1 { margin: 0; font-size: clamp(34px, 4.2vw, 58px); line-height: 1.05; }
.blog-hero-kicker { margin: 0; display: inline-flex; gap: 12px; align-items: center; font-size: 14px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: rgba(255,255,255,.72);}
.blog-hero-breadcrumb { color: rgba(255,255,255,.85); font-weight: 600; }
.blog-hero-breadcrumb:hover { color: #ffffff;}
.blog-hero-meta { display: inline-flex; gap: 18px; align-items: center; font-size: 15px; color: rgba(255,255,255,.78); }
.blog-hero-author { font-weight: 600; letter-spacing: -.01em;}
.blog-hero-dot { width: 6px; height: 6px; border-radius: 50%; background: rgba(255,255,255,.55); }
.blog-hero-visual { flex: 0 0 clamp(360px, 45vw, 640px); display: flex; align-items: center; justify-content: center;}
.blog-hero-illustration { width: 100%; aspect-ratio: 1; border-radius: 28px; background: linear-gradient(180deg, rgba(6,12,30,.45), rgba(6,12,30,.8)); border: 2px solid rgba(255,255,255,.18); box-shadow: 0 28px 60px rgba(0,0,0,.35); position: relative; overflow: hidden; }
.blog-hero-image { width: 100%; height: auto; display: block; border-radius: 28px; border: 2px solid rgba(255,255,255,.18); box-shadow: 0 28px 60px rgba(0,0,0,.35); background: rgba(6,12,30,.45);}
.blog-hero-illustration::before,
.blog-hero-illustration::after { content: ""; position: absolute; border-radius: 50%; background: rgba(255,255,255,.12); }
.blog-hero-illustration::before { width: 56%; height: 56%; top: 14%; left: 12%; backdrop-filter: blur(4px);}
.blog-hero-illustration::after { width: 42%; height: 42%; bottom: 12%; right: 10%; backdrop-filter: blur(3px); }
.blog-body { background: var(--color-surface-light); color: var(--color-text-dark); padding: clamp(60px, 9vw, 96px) 0; border-top: 1px solid var(--color-border-light);}
.blog-body a { color: var(--color-accent); font-weight: 600; }
.blog-body-grid { display: grid; grid-template-columns: minmax(220px, 260px) minmax(0, 1fr); gap: clamp(28px, 4vw, 48px); align-items: start;}
.blog-toc { position: sticky; top: 120px; }
.blog-toc-card { background: transparent; border-radius: 0; border: 0; box-shadow: none; padding: 0; display: flex; flex-direction: column; gap: 18px; max-height: calc(100vh - 180px); overflow: hidden;}
.blog-toc-title { margin: 0; font-size: 14px; letter-spacing: .12em; text-transform: uppercase; font-weight: 800; color: rgba(12,16,32,.65); }
.blog-toc-nav { flex: 1; overflow-y: auto; padding-right: 6px; margin-right: -6px; border-top: 1px solid rgba(12,18,40,.12); padding-top: 18px;}
.blog-toc-nav ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 14px; }
.blog-toc-nav li { display: flex; flex-direction: column; gap: 12px;}
.blog-toc-nav li ul { padding-left: 16px; gap: 8px; }
.blog-body .blog-toc-nav a,
.blog-body .blog-toc-nav a:link,
.blog-body .blog-toc-nav a:visited,
.blog-body .blog-toc-nav a:active { font-size: 15px; font-weight: 600; color: rgba(16,22,48,.9); line-height: 1.6; text-decoration: none; }
.blog-toc-nav a:hover,
.blog-toc-nav a:focus { color: var(--color-accent); }
.blog-toc-nav::-webkit-scrollbar { width: 6px;}
.blog-toc-nav::-webkit-scrollbar-thumb { background: rgba(32,46,88,.18); border-radius: 6px; }
.blog-toc-nav::-webkit-scrollbar-track { background: transparent;}
.blog-toc-share{ margin-top: 18px; padding-top: 18px; border-top: 1px solid rgba(12,18,40,.12); display:flex; flex-direction:column; gap: 10px; }
.blog-toc-share .blog-share-list{ gap: 10px; }
.blog-toc-share-label{ margin:0; font-size:14px; color: rgba(32,40,64,.82); }
.blog-content { display: flex; flex-direction: column; gap: clamp(28px, 4vw, 42px); }
.blog-content h2 { color: rgba(12,18,40,.92);}
.blog-content h3 { color: rgba(18,26,52,.9); }
.blog-content p { color: rgba(32,40,64,.82);}
.blog-content section { background: transparent; }
.blog-content section + section { margin-top: -8px;}
.blog-key-takeaways { background: #f4f6ff; border-radius: 24px; border: 1px solid rgba(58,96,255,.18); padding: clamp(24px, 4vw, 36px); box-shadow: 0 18px 32px rgba(32,40,120,.08); }
.blog-key-takeaways h2 { margin: 0 0 16px; font-size: 20px; color: rgba(16,22,48,.92);}
.blog-key-takeaways ul { margin: 0; padding-left: 20px; display: flex; flex-direction: column; gap: 12px; }
.blog-key-takeaways li { color: rgba(26,32,60,.82); font-size: 15px; line-height: 1.7;}
.blog-lead-section { background: var(--color-bg); padding: clamp(60px, 9vw, 96px) 0; border-top: 1px solid var(--color-border); }
.blog-lead { position: static; }
.blog-lead-card { background: #0b0d17; border-radius: 28px; padding: clamp(36px, 5vw, 56px); color: #f1f4ff; display: grid; grid-template-columns: 1fr 1fr; gap: clamp(28px, 4vw, 48px); align-items: start; box-shadow: 0 28px 52px rgba(5,8,20,.45); border: 1px solid rgba(255,255,255,.08);}
.blog-lead-copy { display: flex; flex-direction: column; gap: 20px; }
.blog-lead-card h2 { margin: 0; font-size: clamp(24px, 3.4vw, 36px); color: #ffffff; line-height: 1.25; }
.blog-lead-form { display: flex; flex-direction: column; gap: 14px;}
.blog-lead-form input,
.blog-lead-form textarea { width: 100%; border-radius: 14px; border: 1px solid rgba(255,255,255,.16); padding: 14px 16px; background: rgba(5,7,15,.65); color: #f1f4ff; font-size: 15px; font-family: inherit; }
.blog-lead-form textarea { resize: vertical; min-height: 120px;}
.blog-lead-form input::placeholder,
.blog-lead-form textarea::placeholder { color: rgba(235,237,255,.55); }
.blog-lead-form input:focus,
.blog-lead-form textarea:focus { outline: none; border-color: rgba(73,118,255,.65); box-shadow: 0 0 0 3px rgba(73,118,255,.25);}
.blog-lead-captcha { display: grid; grid-template-columns: auto 1fr; gap: 12px; align-items: center; font-size: 14px; color: rgba(235,237,255,.85); }
.blog-lead-form button { border: none; border-radius: 14px; padding: 14px 20px; background: linear-gradient(135deg, var(--color-accent), var(--color-accent-2)); color: #fff; font-weight: 700; cursor: pointer; transition: transform .2s ease, box-shadow .2s ease;}
.blog-lead-form button:hover { transform: translateY(-2px); box-shadow: 0 16px 32px rgba(var(--color-accent-rgb), .35); }
.blog-lead-benefits { margin: 0; padding-left: 20px; display: flex; flex-direction: column; gap: 10px; color: rgba(222,226,255,.72); font-size: 15px; line-height: 1.7;}
.blog-author { margin-top: clamp(20px, 4vw, 32px); }
.blog-author-card { border-radius: 28px; border: 1px solid rgba(42,63,120,.14); background: #ffffff; box-shadow: 0 22px 48px rgba(16,28,60,.08); padding: clamp(26px, 4vw, 36px); display: flex; flex-direction: column; gap: 20px; color: rgba(20,28,52,.92);}
.blog-author-meta { display: flex; align-items: center; gap: 18px; }
.blog-author-avatar { width: 72px; height: 72px; border-radius: 50%; background: linear-gradient(135deg, rgba(61,96,255,.18), rgba(37,58,180,.6)); color: rgba(12,16,40,.9); display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: 24px; letter-spacing: .02em; box-shadow: inset 0 0 0 2px rgba(255,255,255,.55);}
.blog-author-label { margin: 0 0 4px; text-transform: uppercase; font-size: 12px; font-weight: 700; letter-spacing: .16em; color: rgba(20,28,60,.48); }
.blog-author-name { margin: 0; font-size: clamp(20px, 2.8vw, 26px); font-weight: 700; letter-spacing: -.01em;}
.blog-author-role { margin: 4px 0 0; font-size: 15px; color: rgba(20,28,60,.6); }
.blog-author-bio { margin: 0; font-size: 15px; line-height: 1.8; color: rgba(30,40,72,.78);}
.blog-share-nav { display: flex; flex-direction: column; gap: clamp(24px, 4vw, 32px); padding-top: clamp(28px, 4vw, 40px); border-top: 1px solid rgba(32,46,88,.12); margin-top: clamp(32px, 6vw, 48px); }
.blog-share { display: flex; align-items: center; gap: 18px; flex-wrap: wrap;}
.blog-share-title { margin: 0; font-size: 14px; letter-spacing: .12em; text-transform: uppercase; font-weight: 700; color: rgba(20,28,52,.55); }
.blog-share-list { margin: 0; padding: 0; list-style: none; display: inline-flex; gap: 12px;}
.blog-share-icon { width: 42px; height: 42px; border-radius: 50%; background: rgba(30,44,88,.08); display: inline-flex; align-items: center; justify-content: center; transition: background .2s ease, transform .2s ease; color: rgba(34,52,108,.78); }
.blog-share-icon::before { content: ""; width: 18px; height: 18px; display: block; background: currentColor; mask-repeat: no-repeat; mask-position: center; mask-size: contain;}
.blog-share-icon--linkedin::before { mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23000' d='M4.98 3.5a2.5 2.5 0 11-.02 5 2.5 2.5 0 01.02-5zM3 9h4v12H3zM9 9h3.8v1.7h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.66 4.78 6.12V21H17v-5.6c0-1.33-.02-3.04-1.86-3.04-1.87 0-2.16 1.46-2.16 2.96V21H9z'/%3E%3C/svg%3E"); }
.blog-share-icon--twitter::before { mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23000' d='M21 5.92a5.44 5.44 0 01-1.54.42 2.68 2.68 0 001.18-1.48 5.38 5.38 0 01-1.7.66 2.68 2.68 0 00-4.56 2.45 7.6 7.6 0 01-5.52-2.8 2.68 2.68 0 00.83 3.58 2.66 2.66 0 01-1.22-.34v.03a2.68 2.68 0 002.15 2.63 2.7 2.7 0 01-1.21.05 2.68 2.68 0 002.5 1.86A5.38 5.38 0 015 17.12a7.58 7.58 0 004.1 1.2c4.92 0 7.62-4.08 7.62-7.62 0-.12 0-.24-.01-.35A5.44 5.44 0 0021 5.92z'/%3E%3C/svg%3E");}
.blog-share-icon--facebook::before { mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23000' d='M13.5 9H16V6h-2.5C11 6 10 7.58 10 9.75V12H8v3h2v7h3v-7h2.25l.75-3H13v-2.25c0-.72.24-1.25 1-1.25z'/%3E%3C/svg%3E"); }
.blog-share-icon:hover { background: rgba(var(--color-accent-rgb), .15); color: var(--color-accent); transform: translateY(-2px);}
.blog-post-nav { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; }
.blog-post-link { display: flex; flex-direction: column; gap: 6px; padding: 18px 20px; border-radius: 18px; border: 1px solid rgba(42,63,120,.12); background: rgba(248,249,255,.78); color: rgba(26,34,66,.88); font-weight: 600; transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;}
.blog-post-link:hover { transform: translateY(-3px); box-shadow: 0 16px 36px rgba(16,26,60,.12); border-color: rgba(var(--color-accent-rgb), .45); color: var(--color-accent); }
.blog-post-link-label { font-size: 12px; text-transform: uppercase; letter-spacing: .16em; color: rgba(34,42,82,.52);}
.blog-post-link-title { font-size: 15px; line-height: 1.6; color: inherit; }
.blog-post-link--prev { text-align: left;}
.blog-post-link--next { text-align: right; }
.blog-more { background: var(--color-bg); padding: clamp(72px, 12vw, 108px) 0; border-top: 1px solid var(--color-border);}
.blog-more-inner { display: flex; flex-direction: column; gap: clamp(36px, 6vw, 52px); }
.blog-more-head { display: flex; flex-direction: column; gap: 12px; color: var(--color-text-light);}
.blog-more-eyebrow { margin: 0; font-size: 13px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: rgba(233,238,249,.7); }
.blog-more-head h2 { margin: 0; color: #fff; font-size: clamp(32px, 5vw, 46px); letter-spacing: -0.01em; }
.blog-more-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: clamp(20px, 3vw, 28px);}
.blog-more-card { background: rgba(6,8,14,.92); border: 1px solid rgba(60,72,120,.18); border-radius: 24px; overflow: hidden; display: flex; flex-direction: column; transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.blog-more-card:hover { transform: translateY(-6px); border-color: rgba(var(--color-accent-rgb), .45); box-shadow: 0 26px 48px rgba(2,8,32,.45);}
.blog-more-media { display: block; padding: 0; position: relative; overflow: hidden; height: 190px; }
.blog-more-thumb { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block;}
.blog-more-graphic { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.blog-more-graphic--chatbot { background: linear-gradient(135deg, #4854ff, #5869ff);}
.blog-more-graphic--automation { background: linear-gradient(135deg, #4854ff, #9b61ff); }
.blog-more-graphic--rag { background: linear-gradient(135deg, #d3921c, #f0b942);}
.blog-more-content { padding: 24px; display: flex; flex-direction: column; gap: 12px; }
.blog-more-topic { margin: 0; font-size: 13px; letter-spacing: .14em; text-transform: uppercase; color: rgba(208,214,255,.55); font-weight: 700;}
.blog-more-title { color: #fff; font-size: 18px; font-weight: 700; line-height: 1.5; }
.blog-more-title:hover { color: var(--color-accent);}
.blog-more-summary { margin: 0; color: rgba(208,214,255,.78); font-size: 15px; line-height: 1.7; }
.blog-more-meta { margin: 8px 0 0; font-size: 13px; color: rgba(180,188,226,.65); display: flex; align-items: center; gap: 6px;}
.blog-inline-cta { margin: clamp(28px, 6vw, 48px) 0; }
.blog-inline-cta-card { background: linear-gradient(135deg, #6b5bff, #4f74ff); border-radius: 28px; padding: clamp(28px, 5vw, 44px); color: #fff; display: flex; flex-direction: column; gap: 16px; box-shadow: 0 26px 44px rgba(20,30,70,.35);}
.blog-inline-cta-eyebrow { margin: 0; font-size: 13px; letter-spacing: .18em; text-transform: uppercase; font-weight: 700; color: rgba(255,255,255,.75); }
.blog-inline-cta-card h3 { margin: 0; font-size: clamp(20px, 3.4vw, 30px); line-height: 1.3; color: #fff;}
.blog-inline-cta-copy { margin: 0; font-size: 15px; line-height: 1.7; color: rgba(240,244,255,.82); }
.blog-inline-cta-button { align-self: flex-start; display: inline-flex; align-items: center; justify-content: center; padding: 12px 24px; border-radius: 999px; background: #f9f9ff; color: #2b3cff; font-weight: 700; box-shadow: 0 16px 30px rgba(10,18,60,.28); transition: transform .2s ease, box-shadow .2s ease;}
.blog-inline-cta-button:hover { transform: translateY(-2px); box-shadow: 0 20px 36px rgba(10,18,60,.32); }
.blog-figure { margin: clamp(28px, 6vw, 48px) 0; display: flex; flex-direction: column; gap: 16px;}
.blog-figure-media { width: 100%; border-radius: 28px; background: rgba(79,94,130,.12); padding-top: 56%; position: relative; overflow: hidden; box-shadow: inset 0 0 0 1px rgba(79,94,130,.1); }
.blog-figure-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; z-index: 1; }
.blog-figure-media::after { content: ""; position: absolute; inset: 8%; border-radius: 22px; background: linear-gradient(135deg, rgba(255,255,255,.12), rgba(79,94,130,.08));}
.blog-figure figcaption { font-size: 14px; color: rgba(32,40,64,.68); }
.blog-figure-media--chart { background: linear-gradient(180deg, rgba(87,110,255,.12), rgba(63,85,240,.08));}
.blog-figure-media--chart::before { content: ""; position: absolute; inset: 18% 12%; border-radius: 16px; border: 1px solid rgba(45,62,120,.18); background: linear-gradient(180deg, rgba(255,255,255,.85), rgba(240,244,255,.65)); box-shadow: inset 0 -80px 120px rgba(79,104,255,.12); }
.blog-figure-media--chart::after { background: linear-gradient(135deg, rgba(255,255,255,.22), rgba(79,104,255,.18)); }
.blog-figure-media--checklist { background: linear-gradient(135deg, rgba(79,102,255,.18), rgba(124,98,255,.12)); }
.blog-figure-media--checklist::after { background: linear-gradient(160deg, rgba(255,255,255,.28), rgba(80,108,255,.14)); }
.blog-figure-media--orbit { background: linear-gradient(135deg, rgba(72,88,238,.2), rgba(46,60,201,.12)); }
.blog-figure-media--orbit::after { background: radial-gradient(60% 60% at 50% 40%, rgba(255,255,255,.28), rgba(46,60,201,.08)); }
.blog-case-cta { margin: clamp(32px, 6vw, 48px) 0 0; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px; background: linear-gradient(135deg, #5d73ff, #3a3fff); border-radius: 28px; padding: clamp(28px, 5vw, 40px); color: #fff; box-shadow: 0 28px 52px rgba(18,24,70,.35); }
.blog-case-cta-copy { max-width: 520px; display: flex; flex-direction: column; gap: 10px;}
.blog-case-cta-copy h3 { margin: 0; font-size: clamp(20px, 3vw, 28px); line-height: 1.3; }
.blog-case-cta-copy p { margin: 0; color: rgba(240,244,255,.8);}
.blog-case-cta-button { display: inline-flex; align-items: center; justify-content: center; padding: 12px 26px; border-radius: 14px; background: #f9faff; color: #3344ff; font-weight: 700; box-shadow: 0 18px 28px rgba(20,26,80,.22); transition: transform .2s ease, box-shadow .2s ease; }
.blog-case-cta-button:hover { transform: translateY(-2px); box-shadow: 0 22px 34px rgba(20,26,80,.26);}
.blog-newsletter { background: var(--color-bg); padding: clamp(60px, 10vw, 96px) 0 clamp(90px, 12vw, 110px); }
.blog-newsletter-inner { background: #ffffff; border: 1px solid rgba(17, 24, 39, 0.08); border-radius: 28px; padding: clamp(32px, 5vw, 56px); display: grid; grid-template-columns: minmax(260px, 0.95fr) minmax(0, 1.05fr); gap: clamp(28px, 6vw, 48px); align-items: center; box-shadow: 0 24px 50px rgba(15, 23, 42, 0.1);}
.blog-newsletter-graphic { border-radius: 24px; background: linear-gradient(155deg, rgba(37, 99, 235, 0.12), rgba(147, 197, 253, 0.24)); display: flex; align-items: center; justify-content: center; padding: clamp(18px, 5vw, 28px); min-height: clamp(220px, 30vw, 320px); }
.blog-newsletter-illustration { width: 100%; height: auto; border-radius: 20px; background: rgba(255,255,255,0.72); box-shadow: 0 18px 34px rgba(15, 23, 42, 0.12);}
.blog-newsletter-image { width: 100%; height: auto; border-radius: 20px; display: block; box-shadow: 0 18px 32px rgba(15, 23, 42, 0.12); object-fit: contain; }
.blog-newsletter-content { display: flex; flex-direction: column; gap: clamp(16px, 4vw, 24px); color: #0f172a;}
.blog-newsletter-eyebrow { margin: 0; font-size: 13px; letter-spacing: .22em; text-transform: uppercase; font-weight: 700; color: rgba(17, 24, 39, 0.5); }
.blog-newsletter-content h2 { margin: 0; font-size: clamp(30px, 5vw, 40px); line-height: 1.25; color: #0f172a;}
.blog-newsletter-content p { margin: 0; color: rgba(17, 24, 39, 0.65); font-size: 16px; line-height: 1.65; }
.blog-newsletter-form { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; padding: 6px; border-radius: 999px; background: #f1f5ff; border: 1px solid rgba(37, 99, 235, 0.22); box-shadow: inset 0 0 0 1px rgba(37, 99, 235, 0.12);}
.blog-newsletter-form input { border: none; background: transparent; padding: 12px 20px; color: #0f172a; font-size: 16px; font-family: inherit; }
.blog-newsletter-form input::placeholder { color: rgba(15, 23, 42, 0.5);}
.blog-newsletter-form input:focus:not(:focus-visible) { outline: none; }
.blog-newsletter-form input:focus-visible { outline: 2px solid var(--color-accent); outline-offset: 2px; }
.blog-newsletter-form button { border: none; padding: 12px 28px; border-radius: 999px; background: linear-gradient(135deg, #fb774a, #f64f6b); color: #fff; font-weight: 700; font-size: 16px; cursor: pointer; transition: transform .2s ease, box-shadow .2s ease, filter .2s ease;}
.blog-newsletter-form button:hover { transform: translateY(-2px); box-shadow: 0 14px 28px rgba(246, 79, 107, .32); filter: brightness(1.05); }
.blog-newsletter-note { margin: 0; font-size: 14px; color: rgba(15, 23, 42, 0.56);}
@media(max-width:1024px){
  .blog-body-grid { grid-template-columns: 1fr; }
  .blog-toc { display: none; }
  .blog-hero-inner { flex-direction: column; align-items: flex-start; }
  .blog-hero-visual { flex: none; width: 100%; max-width: 420px; }
}
@media(max-width:768px){
  .blog-newsletter-inner { grid-template-columns: 1fr; padding: 28px 20px; border-radius: 20px; }
  .blog-newsletter-graphic { min-height: 180px; border-radius: 16px; }
  .blog-newsletter-content h2 { font-size: 24px; }
  .blog-lead-card { grid-template-columns: 1fr; border-radius: 20px; }
}
@media(max-width:540px){
  .blog-newsletter-form { grid-template-columns: 1fr; border-radius: 22px; }
  .blog-newsletter-form button { width: 100%; }
}
.blogs-index { background: var(--color-surface-light); color: var(--color-text-dark); }
.blogs-index a { color: inherit; text-decoration: none;}
.blogs-index a:hover { color: var(--color-accent); }
.blogs-hero { padding: clamp(56px, 8vw, 84px) 0 clamp(28px, 6vw, 56px); background: linear-gradient(180deg, #f7f9ff 0%, #ffffff 75%); }
.blogs-hero-inner { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(28px, 4vw, 48px); align-items: start; }
.blogs-hero-primary { display: flex; flex-direction: column; gap: clamp(20px, 3vw, 32px);}
.blogs-hero-eyebrow { margin: 0; font-size: 14px; letter-spacing: .18em; text-transform: uppercase; font-weight: 800; color: rgba(16,24,48,.55); }
.blogs-filters { display: flex; flex-wrap: wrap; gap: 10px;}
.blogs-filter { border: none; padding: 10px 18px; border-radius: 999px; background: rgba(32,48,120,.08); color: rgba(16,30,60,.8); font-weight: 600; font-size: 14px; cursor: pointer; transition: background .2s ease, color .2s ease; }
.blogs-filter.is-active,
.blogs-filter:hover { background: rgba(47,112,255,.16); color: #2f70ff;}
.blogs-card { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); background: #ffffff; border-radius: 28px; border: 1px solid rgba(15,23,42,.08); box-shadow: 0 26px 52px rgba(20,30,60,.1); overflow: hidden; transition: transform .25s ease, box-shadow .25s ease; }
.blogs-card:hover { transform: translateY(-6px); box-shadow: 0 36px 66px rgba(16,24,60,.16);}
.blogs-card-media { position: relative; padding-top: 58%; background: linear-gradient(135deg, rgba(50,72,220,.12), rgba(94,118,255,.28)); }
.blogs-card-media::after { content: ""; position: absolute; inset: 18%; border-radius: 22px; background: rgba(255,255,255,.22); mix-blend-mode: screen;}
.blogs-card-body { padding: clamp(26px, 4vw, 40px); display: flex; flex-direction: column; gap: clamp(14px, 3vw, 20px); }
.blogs-card-topic { margin: 0; font-size: 13px; letter-spacing: .12em; text-transform: uppercase; font-weight: 800; color: rgba(18,28,60,.6);}
.blogs-card-title { margin: 0; font-size: clamp(26px, 4vw, 36px); line-height: 1.18; letter-spacing: -.01em; color: rgba(12,18,42,.95); }
.blogs-card-title a { display: inline-block;}
.blogs-card-excerpt { margin: 0; font-size: 16px; line-height: 1.7; color: rgba(24,32,60,.78); }
.blogs-card-meta { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; font-size: 14px; color: rgba(18,26,56,.72);}
.blogs-card-meta span,
.blogs-card-meta time { display: inline-flex; align-items: center; gap: 6px; }
.blogs-card-link { display: inline-flex; align-items: center; gap: 8px; font-weight: 700; color: var(--color-accent); font-size: 15px;}
.blogs-card-link span { transition: transform .2s ease; }
.blogs-card-link:hover span { transform: translateX(4px);}
.blogs-card--primary { grid-template-columns: minmax(0, .75fr) minmax(0, 1fr); min-height: clamp(320px, 48vw, 420px); }
.blogs-card--primary .blogs-card-media { padding-top: 0; min-height: 100%;}
.blogs-card--teaser { grid-template-columns: minmax(0, 1fr); min-height: 260px; }
.blogs-card--teaser .blogs-card-title { font-size: clamp(20px, 3vw, 26px);}
.blogs-teaser-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(18px, 3vw, 24px); }
.blogs-landing-hero { padding: clamp(56px, 8vw, 84px) 0; background: linear-gradient(180deg, #0b0c0d 0%, #12172d 55%, #ffffff 100%); color: #ffffff; }
.blogs-landing-hero-inner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 4vw, 48px); align-items: center; }
.blogs-landing-hero-media { border-radius: 28px; overflow: hidden; border: 1px solid rgba(255,255,255,.12); background: rgba(255,255,255,.06); box-shadow: 0 28px 54px rgba(0,0,0,.38); }
.blogs-landing-hero-media img { width: 100%; height: auto; display: block; }
.blogs-landing-hero-copy { display: flex; flex-direction: column; gap: 18px; }
.blogs-landing-hero-kicker { margin: 0; font-size: 13px; letter-spacing: .16em; text-transform: uppercase; font-weight: 800; color: rgba(255,255,255,.7); }
.blogs-landing-hero-title { margin: 0; font-size: clamp(34px, 4.8vw, 56px); line-height: 1.05; }
.blogs-landing-hero-title a { color: inherit; }
.blogs-landing-hero-excerpt { margin: 0; font-size: 16px; line-height: 1.75; color: rgba(255,255,255,.78); max-width: 60ch; }
.blogs-landing-hero-author { margin: 0; font-weight: 700; color: rgba(255,255,255,.72); }
.blogs-guide-hero-page { background: #0b0c0d; color: #ffffff; }
.blogs-guide-hero { padding: clamp(56px, 8vw, 96px) 0; padding-top: calc(72px + clamp(24px, 4vw, 48px)); }
.blogs-guide-hero-inner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: clamp(28px, 4vw, 56px); align-items: center; }
.blogs-guide-hero-media { border-radius: 30px; overflow: visible; border: 1px solid rgba(255,255,255,.14); background: rgba(255,255,255,.06); box-shadow: 0 30px 58px rgba(0,0,0,.42);margin-top: 20px; }
.blogs-guide-hero-media img { width: 100%; height: auto; display: block; }
.blogs-guide-hero-content { display: flex; flex-direction: column; gap: 18px; }
.blogs-guide-hero-kicker { margin: 0; font-size: 13px; letter-spacing: .16em; text-transform: uppercase; font-weight: 800; color: rgba(255,255,255,.7); }
.blogs-guide-hero-title { margin: 0; font-size: clamp(34px, 4.8vw, 58px); line-height: 1.05; }
.blogs-guide-hero-excerpt { margin: 0; font-size: 16px; line-height: 1.75; color: rgba(255,255,255,.78); max-width: 60ch; }
.blogs-guide-hero-author { margin: 0; font-weight: 700; color: rgba(255,255,255,.7); }
.blogs-guide-cards { padding: clamp(56px, 8vw, 88px) 0; background: #ffffff; color: var(--color-text-dark); }
.blogs-guide-cards-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(18px, 3vw, 28px); }
.blogs-guide-card { border-radius: 26px; overflow: hidden; border: 1px solid rgba(15,23,42,.08); background: #ffffff; box-shadow: 0 24px 44px rgba(16,26,60,.1); transition: transform .2s ease, box-shadow .2s ease; }
.blogs-guide-card:hover { transform: translateY(-6px); box-shadow: 0 34px 60px rgba(16,26,60,.14); }
.blogs-guide-card-media { display: block; position: relative; padding-top: 58%; background: rgba(32,48,120,.06); }
.blogs-guide-card-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: top; display: block; }
.blogs-guide-card-body { padding: 22px 22px 24px; display: flex; flex-direction: column; gap: 12px; }
.blogs-guide-card-kicker { margin: 0; font-size: 12px; letter-spacing: .16em; text-transform: uppercase; font-weight: 800; color: rgba(18,28,60,.55); }
.blogs-guide-card-title { margin: 0; font-size: 20px; line-height: 1.3; letter-spacing: -.01em; }
.blogs-guide-card-title a { color: inherit; text-decoration: none; }
.blogs-guide-card-title a:hover { color: var(--color-accent); }
.blogs-guide-card-excerpt { margin: 0; font-size: 15px; line-height: 1.7; color: rgba(24,32,60,.78); }
.blogs-guide-card-author { margin: 0; font-weight: 700; color: rgba(18,26,56,.7); }
.blogs-featured-grid { padding: clamp(56px, 8vw, 88px) 0; background: #0b0c0d; color: #ffffff; }
.blogs-featured-grid-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(18px, 3vw, 28px); }
.blogs-featured-card { border-radius: 26px; overflow: hidden; border: 1px solid rgba(255,255,255,.12); background: rgba(255,255,255,.06); box-shadow: 0 24px 44px rgba(0,0,0,.28); }
.blogs-featured-card-media { display: block; position: relative; padding-top: 56%; background: rgba(255,255,255,.06); }
.blogs-featured-card-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.blogs-featured-card-body { padding: 22px 22px 26px; display: flex; flex-direction: column; gap: 12px; }
.blogs-featured-card-kicker { margin: 0; font-size: 12px; letter-spacing: .16em; text-transform: uppercase; font-weight: 800; color: rgba(255,255,255,.7); }
.blogs-featured-card-title { margin: 0; font-size: 20px; line-height: 1.3; }
.blogs-featured-card-title a { color: inherit; text-decoration: none; }
.blogs-featured-card-title a:hover { text-decoration: underline; text-decoration-color: rgba(255,255,255,.4); }
.blogs-featured-card-excerpt { margin: 0; font-size: 15px; line-height: 1.7; color: rgba(255,255,255,.74); }
.blogs-featured-card-author { margin: 0; font-weight: 700; color: rgba(255,255,255,.68); }
.blogs-tabbed { padding: clamp(56px, 8vw, 88px) 0; background: #ffffff; color: var(--color-text-dark); border-top: 1px solid rgba(15,23,42,.06); }
.blogs-tabbed-inner { display: flex; flex-direction: column; gap: clamp(18px, 3vw, 28px); }
.blogs-tabbed-title { margin: 0; font-size: clamp(34px, 5vw, 56px); letter-spacing: -0.02em; }
.blogs-tabbed-tabs { display: flex; flex-wrap: wrap; gap: 32px; border-bottom: 1px solid rgba(15,23,42,.08); padding-bottom: 12px; }
.blogs-tabbed-tab { position: relative; display: inline-flex; align-items: center; padding: 10px 0; border: 0; background: transparent; border-radius: 0; font-weight: 700; cursor: pointer; transition: color .2s ease; color: rgba(12,18,40,.78); text-decoration: none; }
.blogs-tabbed-tab:hover { color: rgba(12,18,40,.92); }
.blogs-tabbed-tab::after { content: ""; position: absolute; left: 0; right: 0; bottom: -13px; height: 2px; background: transparent; }
.blogs-tabbed-tab.is-active { color: #1d4ed8; }
.blogs-tabbed-tab.is-active::after { background: #1d4ed8; }
.blogs-tabbed-panel { display: none; }
.blogs-tabbed-panel.is-active { display: block; }
.blogs-tabbed-grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(18px, 3vw, 34px); align-items: start; }
.blogs-tabbed-featured { border-radius: 22px; overflow: hidden; border: 0; background: transparent; box-shadow: none; }
.blogs-tabbed-featured-media { display: block; position: relative; padding-top: 56%; background: rgba(32,48,120,.06); }
.blogs-tabbed-featured-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.blogs-tabbed-featured-body { padding: 18px 0 0; display: flex; flex-direction: column; gap: 12px; }
.blogs-tabbed-kicker { margin: 0; font-size: 12px; letter-spacing: .16em; text-transform: uppercase; font-weight: 800; color: rgba(18,28,60,.55); }
.blogs-tabbed-featured-title { margin: 0; font-size: 34px; line-height: 1.15; letter-spacing: -0.02em; }
.blogs-tabbed-featured-title a { color: inherit; text-decoration: none; }
.blogs-tabbed-featured-title a:hover { color: var(--color-accent); }
.blogs-tabbed-featured-excerpt { margin: 0; font-size: 15px; line-height: 1.7; color: rgba(24,32,60,.78); }
.blogs-tabbed-author { margin: 0; font-weight: 700; color: rgba(18,26,56,.72); }
.blogs-tabbed-list { display: flex; flex-direction: column; gap: 0; border-top: 1px solid rgba(15,23,42,.08); }
.blogs-tabbed-item { display: grid; grid-template-columns: 180px minmax(0, 1fr); gap: 18px; align-items: center; padding: 18px 0; border-radius: 0; border: 0; border-bottom: 1px solid rgba(15,23,42,.08); background: transparent; box-shadow: none; }
.blogs-tabbed-item-media { border-radius: 14px; overflow: hidden; position: relative; aspect-ratio: 16 / 9; background: rgba(32,48,120,.06); }
.blogs-tabbed-item-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.blogs-tabbed-item-title { margin: 0; font-size: 20px; line-height: 1.25; }
.blogs-tabbed-item-title a { color: inherit; text-decoration: none; }
.blogs-tabbed-item-title a:hover { color: var(--color-accent); }
.blogs-newsletter-banner { padding: clamp(56px, 8vw, 88px) 0; background:#ffffff ; color: #ffffff; }
.blogs-newsletter-banner-inner { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(22px, 4vw, 40px); align-items: center; border-radius: 32px; padding: clamp(26px, 5vw, 56px); background: linear-gradient(135deg, #4b5fff, #3246ff); border: 1px solid rgba(255,255,255,.18); box-shadow: 0 34px 66px rgba(16,22,60,.28); }
.blogs-newsletter-banner-visual { border-radius: 26px; overflow: hidden; background: rgba(255,255,255,.14); padding: 18px;flex:1; }
.blogs-newsletter-banner-visual img { width: 100%; height: 240px; display: block; object-fit: contain; }
.blogs-newsletter-banner-content { display: flex; flex-direction: column; gap: 14px;flex:1 }
.blogs-newsletter-banner-eyebrow { margin: 0; font-size: 13px; letter-spacing: .18em; text-transform: uppercase; font-weight: 800; color: rgba(255,255,255,.75); }
.blogs-newsletter-banner-title { margin: 0; font-size: clamp(26px, 4.2vw, 38px); line-height: 1.2; }
.blogs-newsletter-banner-form { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; padding: 6px; border-radius: 999px; background: rgba(255,255,255,.2); backdrop-filter: blur(14px); border: 1px solid rgba(255,255,255,.35); }
.blogs-newsletter-banner-form input { border: none; background: transparent; color: #fff; padding: 12px 18px; font-size: 15px; font-family: inherit; }
.blogs-newsletter-banner-form input::placeholder { color: rgba(255,255,255,.75); }
.blogs-newsletter-banner-form input:focus:not(:focus-visible) { outline: none; }
.blogs-newsletter-banner-form input:focus-visible { outline: 2px solid var(--color-accent); outline-offset: 2px; }
.blogs-newsletter-banner-form button { border: none; padding: 12px 22px; border-radius: 999px; background: #f25759; color: #fff; font-weight: 800; cursor: pointer; transition: transform .2s ease, box-shadow .2s ease; }
.blogs-newsletter-banner-form button:hover { transform: translateY(-2px); box-shadow: 0 16px 28px rgba(242,87,89,.3); }
.blogs-newsletter-banner-note { margin: 0; font-size: 14px; color: rgba(255,255,255,.78); }
.blogs-dp-banner { padding: clamp(56px, 8vw, 88px) 0; background: #ffffff; }
.blogs-dp-banner-inner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 420px); gap: clamp(18px, 4vw, 40px); align-items: center; border-radius: 14px; padding: clamp(22px, 4vw, 44px); background: #25306c; color: #ffffff; overflow: hidden; }
.blogs-dp-banner-content { display: flex; flex-direction: column; gap: 18px; max-width: 520px; }
.blogs-dp-banner-title { margin: 0; font-size: clamp(24px, 3.6vw, 36px); line-height: 1.15; letter-spacing: -0.02em; white-space: pre-line; }
.blogs-dp-banner-cta { width: fit-content; display: inline-flex; align-items: center; justify-content: center; padding: 12px 18px; border-radius: 6px; background: #ff6a3c; color: #ffffff; font-weight: 800; font-size: 12px; text-decoration: none; box-shadow: 0 18px 34px rgba(0,0,0,.25); transition: transform .2s ease, filter .2s ease; }
.blogs-dp-banner-cta:hover { transform: translateY(-2px); filter: brightness(0.98); }
.blogs-dp-banner-visual { display: flex; align-items: center; justify-content: flex-end; }
.blogs-dp-banner-visual img { width: 100%; max-width: 360px; height: auto; display: block; }
.blogs-latest { padding: clamp(56px, 9vw, 88px) 0; background: linear-gradient(180deg, #ffffff 0%, #f8f9ff 100%); border-top: 1px solid rgba(15,23,42,.06);}
.blogs-latest-inner { display: flex; flex-direction: column; gap: clamp(24px, 4vw, 36px); }
.blogs-section-heading { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px;}
.blogs-section-heading h2 { margin: 0; font-size: clamp(30px, 4vw, 42px); line-height: 1.2; color: rgba(12,18,40,.95); }
.blogs-latest-list { display: flex; flex-direction: column; gap: clamp(18px, 3vw, 26px);}
.blogs-latest-item { display: grid; grid-template-columns: minmax(120px, 160px) minmax(0, 1fr) minmax(150px, 180px); align-items: stretch; gap: clamp(18px, 3vw, 26px); padding: clamp(20px, 3vw, 28px); border-radius: 24px; border: 1px solid rgba(15,23,42,.08); background: #ffffff; box-shadow: 0 20px 40px rgba(16,26,60,.08); transition: transform .2s ease, box-shadow .2s ease; }
.blogs-latest-item:hover { transform: translateY(-4px); box-shadow: 0 28px 56px rgba(16,26,60,.12);}
.blogs-latest-media { border-radius: 18px; background: rgba(50,72,220,.12); position: relative; overflow: hidden; aspect-ratio: 1 / 1; }
.blogs-latest-thumb { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block;}
.blogs-latest-media::after { content: ""; position: absolute; inset: 20%; border-radius: 16px; background: rgba(255,255,255,.22); mix-blend-mode: screen; }
.blogs-latest-content { display: flex; flex-direction: column; gap: 12px;}
.blogs-latest-content h3 { margin: 0; font-size: clamp(20px, 3vw, 26px); line-height: 1.3; color: rgba(15,22,45,.92); }
.blogs-latest-stats { margin: 0; padding: 0; display: grid; gap: 12px; align-content: center;}
.blogs-latest-stats div { display: flex; flex-direction: column; gap: 4px; padding: 10px 12px; border-radius: 16px; background: rgba(15,23,42,.05); text-align: center; }
.blogs-latest-stats dt { margin: 0; font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: rgba(18,26,54,.5);}
.blogs-latest-stats dd { margin: 0; font-size: 18px; font-weight: 700; color: rgba(12,18,38,.9); }
.blogs-latest-split { padding: clamp(56px, 9vw, 88px) 0; background: #ffffff; color: rgba(12,18,40,.92); }
.blogs-latest-split-inner { display: flex; flex-direction: column; gap: clamp(22px, 4vw, 32px); max-width: 1120px; margin: 0 auto; }
.blogs-latest-split-head { display: flex; align-items: center; justify-content: center; gap: 16px; }
.blogs-latest-split-title { margin: 0; font-size: clamp(30px, 4vw, 42px); line-height: 1.2;width: 75%; }
.blogs-latest-split-grid { display: grid; grid-template-columns: minmax(260px, 340px) minmax(0, 420px) minmax(220px, 280px); gap: 44px; align-items: start; justify-content: center; }
.blogs-latest-split-media { display: grid; gap: 12px; max-width: 420px; }
.blogs-latest-split-media-card { display: block; border-radius: 22px; overflow: hidden; border: 1px solid rgba(15,23,42,.1); background: #ffffff; box-shadow: none; height: 190px; }
.blogs-latest-split-media-card img { width: 100%; height: 100%; display: block; object-fit: cover; }
.blogs-latest-split-posts { display: flex; flex-direction: column; gap: 28px; }
.blogs-latest-split-item { padding: 0; border-radius: 0; border: 0; background: transparent; box-shadow: none; }
.blogs-latest-split-kicker { margin: 0 0 10px; font-size: 12px; letter-spacing: .16em; text-transform: uppercase; font-weight: 800; color: rgba(12,18,40,.6); }
.blogs-latest-split-h3 { margin: 0 0 10px; font-size: 22px; line-height: 1.25; }
.blogs-latest-split-h3 a { color: rgba(12,18,40,.92); text-decoration: none; }
.blogs-latest-split-h3 a:hover { color: rgba(12,18,40,.92); text-decoration: underline; text-decoration-color: rgba(12,18,40,.35); }
.blogs-latest-split-excerpt { margin: 0 0 14px; color: rgba(32,40,64,.74); font-size: 15px; line-height: 1.7; }
.blogs-latest-split-meta { margin: 0; display: inline-flex; align-items: center; gap: 10px; font-size: 14px; color: rgba(32,40,64,.62); }
.blogs-latest-split-dot { opacity: .65; }
.blogs-latest-split-pagination { display: flex; align-items: center; justify-content: center; gap: 10px; margin-top: 22px; flex-wrap: wrap; }
.blogs-latest-split-page { display: inline-flex; align-items: center; justify-content: center; min-width: 34px; height: 34px; padding: 0 12px; border-radius: 6px; border: 1px solid rgba(37,99,235,.35); background: #ffffff; color: rgba(12,18,40,.92); text-decoration: none; font-weight: 700; font-size: 13px; }
.blogs-latest-split-page:hover { border-color: rgba(37,99,235,.55); }
.blogs-latest-split-page.is-active { background: #1d4ed8; border-color: #1d4ed8; color: #ffffff; }
.blogs-latest-split-page--dots { border-color: transparent; background: transparent; min-width: auto; padding: 0 4px; }
.blogs-latest-split-page--next { padding: 0 14px; }
.blogs-latest-split-categories { position: sticky; top: 120px; }
.blogs-latest-split-categories-title { margin: 0 0 12px; font-size: 14px; letter-spacing: .14em; text-transform: uppercase; font-weight: 800; color: rgba(12,18,40,.7); }
.blogs-latest-split-pills { display: flex; flex-wrap: wrap; gap: 10px; border-top: 1px solid rgba(15,23,42,.1); padding-top: 14px; }
.blogs-latest-split-pill { display: inline-flex; align-items: center; justify-content: center; padding: 10px 14px; border-radius: 999px; border: 1px solid rgba(15,23,42,.12); background: rgba(15,23,42,.04); font-weight: 700; font-size: 13px; color: rgba(12,18,40,.82); }
.blogs-latest-split-pill:hover { background: rgba(15,23,42,.06); color: rgba(12,18,40,.92); }
.blogs-social { padding: 24px 0 12px;}
.blogs-social-inner { display: flex; align-items: center; justify-content: space-between; gap: 18px; border-top: 1px solid rgba(15,23,42,.08); border-bottom: 1px solid rgba(15,23,42,.08); padding: 16px 0; font-weight: 600; color: rgba(16,26,52,.68); }
.blogs-social ul { list-style: none; display: flex; gap: 18px; padding: 0; margin: 0;}
.blogs-social a { display: inline-flex; align-items: center; gap: 8px; font-weight: 700; color: var(--color-accent); }
.blogs-newsletter { padding: clamp(60px, 9vw, 96px) 0;}
.blogs-newsletter-inner { background: linear-gradient(135deg, #4b5fff, #3246ff); border-radius: 32px; padding: clamp(32px, 6vw, 60px); display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(24px, 4vw, 40px); align-items: center; box-shadow: 0 36px 68px rgba(16,22,60,.28); overflow: hidden; }
.blogs-newsletter-visual { position: relative; padding-top: 70%; border-radius: 26px; background: rgba(255,255,255,.14);}
.blogs-newsletter-illustration { position: absolute; inset: 16%; border-radius: 24px; background: radial-gradient(circle at 35% 25%, rgba(255,255,255,.32), rgba(255,255,255,.08) 60%, transparent 78%); box-shadow: inset 0 0 0 1px rgba(255,255,255,.18); }
.blogs-newsletter-content { display: flex; flex-direction: column; gap: clamp(16px, 4vw, 24px); color: #fff;}
.blogs-newsletter-eyebrow { margin: 0; font-size: 14px; letter-spacing: .18em; text-transform: uppercase; font-weight: 800; color: rgba(255,255,255,.7); }
.blogs-newsletter-content h2 { margin: 0; font-size: clamp(30px, 5vw, 40px); line-height: 1.2;}
.blogs-newsletter-copy { margin: 0; font-size: 16px; line-height: 1.7; color: rgba(255,255,255,.82); }
.blogs-newsletter-form { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; padding: 6px; border-radius: 999px; background: rgba(255,255,255,.2); backdrop-filter: blur(14px); border: 1px solid rgba(255,255,255,.35); box-shadow: inset 0 0 0 1px rgba(255,255,255,.12);}
.blogs-newsletter-form input { border: none; background: transparent; color: #fff; padding: 12px 18px; font-size: 15px; font-family: inherit; }
.blogs-newsletter-form input::placeholder { color: rgba(255,255,255,.7);}
.blogs-newsletter-form input:focus:not(:focus-visible) { outline: none; }
.blogs-newsletter-form input:focus-visible { outline: 2px solid var(--color-accent); outline-offset: 2px; }
.blogs-newsletter-form button { border: none; padding: 12px 26px; border-radius: 999px; background: #f25759; color: #fff; font-weight: 700; cursor: pointer; transition: transform .2s ease, box-shadow .2s ease;}
.blogs-newsletter-form button:hover { transform: translateY(-2px); box-shadow: 0 16px 28px rgba(242,87,89,.3); }
.blogs-newsletter-note { margin: 0; font-size: 14px; color: rgba(255,255,255,.75);}
.blogs-segment { padding: clamp(56px, 9vw, 88px) 0; border-top: 1px solid rgba(15,23,42,.06); background: #ffffff; }
.blogs-segment + .blogs-segment { margin-top: -12px; background: linear-gradient(180deg, #ffffff 0%, #f8f9ff 100%);}
.blogs-segment-inner { display: flex; flex-direction: column; gap: clamp(20px, 3vw, 32px); }
.blogs-segment-header { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px;}
.blogs-segment-header h2 { margin: 0; font-size: clamp(28px, 4vw, 38px); line-height: 1.2; color: rgba(12,18,40,.94); }
.blogs-segment-grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: clamp(24px, 4vw, 36px);}
.blogs-segment-posts ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: clamp(16px, 3vw, 22px); }
.blogs-segment-item { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 16px; padding: 20px 24px; border-radius: 22px; border: 1px solid rgba(15,23,42,.08); background: rgba(248,249,255,.75); box-shadow: 0 16px 28px rgba(18,26,60,.08); align-items: center; transition: transform .2s ease, box-shadow .2s ease;}
.blogs-segment-item:hover { transform: translateY(-4px); box-shadow: 0 24px 38px rgba(18,26,60,.12); }
.blogs-segment-tag { display: inline-flex; align-items: center; justify-content: center; padding: 8px 14px; border-radius: 999px; font-size: 12px; letter-spacing: .16em; text-transform: uppercase; font-weight: 800; color: rgba(15,22,42,.75); background: rgba(40,60,120,.16);}
.blogs-segment-text { display: flex; flex-direction: column; gap: 6px; }
.blogs-segment-text h3 { margin: 0; font-size: clamp(18px, 3vw, 24px); line-height: 1.35; color: rgba(14,22,44,.9);}
.blogs-segment-text time { font-size: 14px; color: rgba(20,28,56,.62); }
.blogs-segment-link { display: inline-flex; align-items: center; gap: 8px; margin-top: clamp(18px, 3vw, 24px); font-weight: 700; color: var(--color-accent);}
.blogs-segment-link span { transition: transform .2s ease; }
.blogs-segment-link:hover span { transform: translateX(4px);}
.blogs-segment-highlight { border-radius: 28px; background: #0b0f1f; color: #f3f4ff; padding: clamp(28px, 4vw, 36px); display: flex; flex-direction: column; gap: 16px; box-shadow: 0 26px 36px rgba(9,12,28,.4); }
.blogs-segment-highlight h3 { margin: 0; font-size: clamp(22px, 3.6vw, 28px); line-height: 1.25; color: #ffffff;}
.blogs-segment-highlight p { margin: 0; color: rgba(235,238,255,.78); font-size: 16px; line-height: 1.65; }
.blogs-segment-button { display: inline-flex; align-items: center; justify-content: center; padding: 12px 22px; border-radius: 14px; background: linear-gradient(135deg, #ff774a, #ff4d6d); font-weight: 700; color: #fff; box-shadow: 0 18px 32px rgba(255,77,109,.35); transition: transform .2s ease, box-shadow .2s ease;}
.blogs-segment-button:hover { transform: translateY(-2px); box-shadow: 0 22px 36px rgba(255,77,109,.38); }
.blogs-closing-cta { padding: clamp(70px, 11vw, 110px) 0 clamp(90px, 12vw, 120px); background: linear-gradient(135deg, #0b0d21, #142060); color: #fff; text-align: center;}
.blogs-closing-inner { display: flex; flex-direction: column; gap: 24px; align-items: center; }
.blogs-closing-inner h2 { margin: 0; font-size: clamp(32px, 4.8vw, 48px); line-height: 1.18; max-width: 760px;}
.blogs-closing-button { display: inline-flex; align-items: center; justify-content: center; padding: 16px 32px; border-radius: 16px; background: #ffffff; color: #0c1b50 !important; font-weight: 800; font-size: 16px; letter-spacing: .03em; box-shadow: 0 24px 40px rgba(12,18,60,.28); transition: transform .2s ease, box-shadow .2s ease; }
.blogs-closing-button:hover { transform: translateY(-4px); box-shadow: 0 30px 48px rgba(12,18,60,.34);}
.blog-card--coral .blogs-card-media,
.blog-card--coral .blogs-latest-media { background: linear-gradient(135deg, #ff7a66, #ff4d6d); }
.blog-card--coral .blogs-segment-tag { background: rgba(255,125,102,.18); color: #e33749;}
.blog-card--coral.blogs-card--primary,
.blog-card--coral.blogs-card--teaser,
.blog-card--coral.blogs-card--list,
.blog-card--coral.blogs-segment-item { box-shadow: 0 26px 52px rgba(255,90,90,.12); }
.blog-card--indigo .blogs-card-media,
.blog-card--indigo .blogs-latest-media { background: linear-gradient(135deg, #5864ff, #3246ff);}
.blog-card--indigo .blogs-segment-tag { background: rgba(88,100,255,.18); color: #3246ff; }
.blog-card--amber .blogs-card-media,
.blog-card--amber .blogs-latest-media { background: linear-gradient(135deg, #ffb042, #ff8d24);}
.blog-card--amber .blogs-segment-tag { background: rgba(255,176,66,.2); color: #d66b0a; }
.blog-card--violet .blogs-card-media,
.blog-card--violet .blogs-latest-media { background: linear-gradient(135deg, #a46bff, #7b4dff);}
.blog-card--violet .blogs-segment-tag { background: rgba(164,107,255,.22); color: #7b4dff; }
.blog-card--sky .blogs-card-media,
.blog-card--sky .blogs-latest-media { background: linear-gradient(135deg, #5ad5ff, #3da9ff);}
.blog-card--sky .blogs-segment-tag { background: rgba(90,213,255,.22); color: #1877ff; }
.blog-card--rose .blogs-card-media,
.blog-card--rose .blogs-latest-media { background: linear-gradient(135deg, #ff7ab3, #ff4d82);}
.blog-card--rose .blogs-segment-tag { background: rgba(255,122,179,.2); color: #e3266c; }
.blog-card--blue .blogs-card-media,
.blog-card--blue .blogs-latest-media { background: linear-gradient(135deg, #4c9dff, #2563eb);}
.blog-card--blue .blogs-segment-tag { background: rgba(76,157,255,.2); color: #2563eb; }
.blog-card--teal .blogs-card-media,
.blog-card--teal .blogs-latest-media { background: linear-gradient(135deg, #32d1b0, #0ca678);}
.blog-card--teal .blogs-segment-tag { background: rgba(50,209,176,.22); color: #0a8a63; }
.blogs-card--primary.blog-card--coral .blogs-card-meta span,
.blogs-card--primary.blog-card--coral .blogs-card-meta time { color: rgba(255,255,255,.78);}
.blogs-card--primary.blog-card--coral .blogs-card-body,
.blogs-card--primary.blog-card--coral { color: #ffffff; background: linear-gradient(135deg, #ff7a66, #ff4d6d); border: none; }
.blogs-card--primary.blog-card--coral .blogs-card-topic { color: rgba(255,255,255,.75);}
.blogs-card--primary.blog-card--coral .blogs-card-title { color: #ffffff; }
.blogs-card--primary.blog-card--coral .blogs-card-excerpt { color: rgba(255,255,255,.85);}
.blogs-card--primary.blog-card--coral .blogs-card-link { color: #fff; }
.blogs-card--primary.blog-card--coral .blogs-card-media { background: rgba(255,255,255,.18);}
.blogs-card--primary.blog-card--coral .blogs-card-media::after,
.blog-card--coral .blogs-latest-media::after,
.blog-card--coral .blogs-card-media::after { background: rgba(255,255,255,.28); }
.blogs-card--primary.blog-card--indigo .blogs-card-media,
.blogs-card--primary.blog-card--amber .blogs-card-media,
.blogs-card--primary.blog-card--violet .blogs-card-media,
.blogs-card--primary.blog-card--sky .blogs-card-media,
.blogs-card--primary.blog-card--rose .blogs-card-media,
.blogs-card--primary.blog-card--blue .blogs-card-media,
.blogs-card--primary.blog-card--teal .blogs-card-media { background: rgba(255,255,255,.18);}
.blogs-card--primary:not(.blog-card--coral) .blogs-card-body { background: #ffffff; }
.blogs-card--list { background: #ffffff;}
.blogs-segment-item.blog-card--coral,
.blogs-segment-item.blog-card--indigo,
.blogs-segment-item.blog-card--amber,
.blogs-segment-item.blog-card--violet,
.blogs-segment-item.blog-card--sky,
.blogs-segment-item.blog-card--rose,
.blogs-segment-item.blog-card--blue,
.blogs-segment-item.blog-card--teal { background: rgba(248,249,255,.82); }
.blogs-latest-item.blog-card--coral .blogs-latest-stats div { background: rgba(255,122,136,.18); color: #d53a52;}
.blogs-latest-item.blog-card--indigo .blogs-latest-stats div { background: rgba(88,100,255,.16); color: #3947ff; }
.blogs-latest-item.blog-card--amber .blogs-latest-stats div { background: rgba(255,176,66,.18); color: #d66b0a;}
.blogs-latest-item.blog-card--violet .blogs-latest-stats div { background: rgba(164,107,255,.18); color: #7542ff; }
.blogs-latest-item.blog-card--sky .blogs-latest-stats div { background: rgba(90,213,255,.16); color: #1877ff;}
.blogs-latest-item.blog-card--rose .blogs-latest-stats div { background: rgba(255,122,179,.16); color: #e3266c; }
.blogs-latest-item.blog-card--blue .blogs-latest-stats div { background: rgba(76,157,255,.16); color: #2563eb;}
.blogs-latest-item.blog-card--teal .blogs-latest-stats div { background: rgba(50,209,176,.16); color: #0a8a63; }
.blogs-latest-item.blog-card--coral .blogs-latest-stats dd,
.blogs-latest-item.blog-card--indigo .blogs-latest-stats dd,
.blogs-latest-item.blog-card--amber .blogs-latest-stats dd,
.blogs-latest-item.blog-card--violet .blogs-latest-stats dd,
.blogs-latest-item.blog-card--sky .blogs-latest-stats dd,
.blogs-latest-item.blog-card--rose .blogs-latest-stats dd,
.blogs-latest-item.blog-card--blue .blogs-latest-stats dd,
.blogs-latest-item.blog-card--teal .blogs-latest-stats dd { color: inherit;}
.blogs-latest-item.blog-card--coral .blogs-latest-stats dt,
.blogs-latest-item.blog-card--indigo .blogs-latest-stats dt,
.blogs-latest-item.blog-card--amber .blogs-latest-stats dt,
.blogs-latest-item.blog-card--violet .blogs-latest-stats dt,
.blogs-latest-item.blog-card--sky .blogs-latest-stats dt,
.blogs-latest-item.blog-card--rose .blogs-latest-stats dt,
.blogs-latest-item.blog-card--blue .blogs-latest-stats dt,
.blogs-latest-item.blog-card--teal .blogs-latest-stats dt { color: rgba(15,20,40,.6); }
.blogs-card--primary.blog-card--coral .blogs-card-meta span,
.blogs-card--primary.blog-card--coral .blogs-card-meta time,
.blogs-card--primary.blog-card--coral .blogs-card-topic { color: rgba(255,255,255,.75);}

/* Blog page mobile responsive */
@media (max-width: 1100px){
  .blogs-landing-hero-inner { grid-template-columns: 1fr; }
  .blogs-landing-hero-media { max-width: 400px; margin: 0 auto; }
  .blogs-guide-hero-inner { grid-template-columns: 1fr; }
  .blogs-guide-hero-media { border-radius: 0; margin-top: 0; max-width: 100%; margin-left: auto; margin-right: auto; overflow: visible !important; border: none; background: none; box-shadow: none; }
  .blogs-guide-hero-media img { width: 100%; max-width: 400px; height: auto; object-fit: contain; margin: 0 auto; display: block; }
  .blogs-guide-hero { padding: 96px 0 20px; }
  .blogs-guide-cards { padding: 24px 0 clamp(56px, 8vw, 88px); }
  .blogs-latest-split { padding: 24px 0 clamp(56px, 9vw, 88px); }
  .blogs-guide-cards-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .blogs-tabbed-grid { grid-template-columns: 1fr; }
  .blogs-newsletter-banner-inner { grid-template-columns: 1fr; }
  .blogs-dp-banner-inner { grid-template-columns: 1fr; }
  .blogs-latest-split-grid { grid-template-columns: 1fr; }
  .blogs-latest-split-categories { position: static; }
  .blogs-latest-item { grid-template-columns: 1fr; }
  .blogs-latest-media { aspect-ratio: 16/9; max-height: 200px; }
  .blogs-newsletter-inner { grid-template-columns: 1fr; }
  .blogs-segment-grid { grid-template-columns: 1fr; }
}
@media (max-width: 720px){
  .blogs-guide-cards-grid { grid-template-columns: 1fr; }
  .blogs-tabbed-item { grid-template-columns: 1fr; }
  .blogs-newsletter-banner-form { grid-template-columns: 1fr; border-radius: 22px; }
  .blogs-newsletter-banner-form button { width: 100%; }
  .blogs-latest-split-title { width: 100%; font-size: 26px; }
  .blogs-latest-split-head { flex-direction: column; align-items: flex-start; }
  .blogs-newsletter-form { grid-template-columns: 1fr; border-radius: 22px; }
  .blogs-newsletter-form button { width: 100%; }
  .blogs-segment-item { grid-template-columns: 1fr; }
}