/* Hero */
.post-hero.hero-wrap .text .breadcrumb{ font-size: 12px; text-transform: uppercase; font-family: var(--space); margin-bottom: 30px; font-weight: 600; letter-spacing: 1px; line-height: 1.3; }
.post-hero.hero-wrap .text .breadcrumb a{ color: rgba(242,244,241,0.45); text-decoration: none; transition: color 200ms; }
.post-hero.hero-wrap .text .breadcrumb a:hover{ color: var(--green); }
.post-hero.hero-wrap .text .breadcrumb .divider{ color: rgba(242,244,241,0.25); margin: 0 8px; }
.post-hero.hero-wrap .text .breadcrumb .green{ color: var(--green); }

.post-hero.hero-wrap .text .title{ font-size: 62px; }

.post-hero.hero-wrap .text .meta{ font-size: 15px; margin-top: 50px; display: flex; gap: 20px; line-height: 1.3; }
.post-hero.hero-wrap .text .meta .divider{ color: rgba(255,255,255,0.2); }
.post-hero.hero-wrap .text .meta span{ color: rgba(242,244,241,0.55); }
.post-hero.hero-wrap .text .meta span strong{ color: rgba(242,244,241,0.8); }
.post-hero.hero-wrap .text .meta span .separator-text{ font-weight: normal; }

.post-hero.hero-wrap.small-hero{ min-height: auto; padding: 220px 0 50px; }

/* Content */
.content-wrapper .content{ display: flex; justify-content: space-between; align-items: flex-start; position: relative; padding-right: 150px; }

.content-wrapper .article-toc{ width: 260px; position: sticky; top: 170px; left: 0; }
.content-wrapper .article-toc .toc-label{ font-family: var(--space); font-size: 11px; font-weight: 500; letter-spacing: 0.88px; text-transform: uppercase; color: rgba(242,244,241,0.4); margin-bottom: 16px; }
.content-wrapper .article-toc .toc-link{ display: block; font-size: 14px; font-weight: 400; color: rgba(242,244,241,0.45); line-height: 1.5; padding: 7px 0 7px 16px; border-left: 2px solid rgba(255,255,255,0.08); text-decoration: none; transition: color 150ms ease, border-color 150ms ease; }
.content-wrapper .article-toc .toc-link:hover{ color: var(--offwhite); border-color: rgba(255,255,255,0.3); }
.content-wrapper .article-toc .toc-link.is-active{ color: var(--green); border-color: var(--green); }

.content-wrapper .article-toc .toc-link.toc-link--h2{ }
.content-wrapper .article-toc .toc-link.toc-link--h3{ padding-left: 30px; }

.content-wrapper .article-content{ width: 750px; font-size: 20px; font-weight: 300; color: rgba(242, 244, 241, 0.75); line-height: 1.75; }
.content-wrapper .article-content p{ margin-bottom: 24px; word-break: break-word; }
.content-wrapper .article-content h2{ font-size: 32px; font-weight: 700; color: var(--offwhite); line-height: 1.15; letter-spacing: -0.02em; margin-top: 56px; margin-bottom: 20px; }
.content-wrapper .article-content h3{ font-size: 28px; font-weight: 700; color: var(--offwhite); line-height: 1.15; letter-spacing: -0.02em; margin-top: 56px; margin-bottom: 20px; }
.content-wrapper .article-content h4{ font-size: 24px; font-weight: 700; color: var(--offwhite); line-height: 1.15; letter-spacing: -0.02em; margin-top: 56px; margin-bottom: 20px; }
.content-wrapper .article-content h5{ font-size: 28px; font-weight: 700; color: var(--offwhite); line-height: 1.15; letter-spacing: -0.02em; margin-top: 56px; margin-bottom: 20px; }
.content-wrapper .article-content h6{ font-size: 18px; font-weight: 700; color: var(--offwhite); line-height: 1.15; letter-spacing: -0.02em; margin-top: 56px; margin-bottom: 20px; }

/* Webinars */
.webinar-intro .intro-columns{ display: grid; grid-template-columns: 50% 50%; gap: 40px; align-items: center; padding: 100px 0 80px; }

.webinar-intro .intro-columns .left .video-wrap{ position: relative; width: 100%; aspect-ratio: 16/9; background: #000; overflow: hidden; cursor: pointer; }
.webinar-intro .intro-columns .left .video-wrap img{ width: 100%; height: 100%; object-fit: cover; filter: brightness(0.6); transition: filter 300ms ease; }
.webinar-intro .intro-columns .left .video-wrap:hover img{ filter: brightness(0.45); }
.webinar-intro .intro-columns .left .video-play-btn{ position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 16px; }
.webinar-intro .intro-columns .left .play-circle{ width: 80px; height: 80px; border-radius: 50%; background: rgba(0, 227, 122, 0.15); border: 2px solid rgba(0, 227, 122, 0.6); display: flex; align-items: center; justify-content: center; transition: background 200ms, transform 200ms; backdrop-filter: blur(4px); }
.webinar-intro .intro-columns .left .video-wrap:hover .play-circle{ background: rgba(0, 227, 122, 0.25); transform: scale(1.08); }
.webinar-intro .intro-columns .left .video-duration{ font-size: 13px; color: rgba(255, 255, 255, 0.6); letter-spacing: 0.04em; }

.webinar-intro .intro-columns .right{ font-size: 20px; font-weight: 300; color: #E0E0E0; line-height: 1.75; }
.webinar-intro .intro-columns .right p{ margin-bottom: 15px; }

.webinar-intro .speakers{ display: flex; gap: 30px; border-top: 1px solid var(--line); padding-top: 40px; margin-bottom: 20px; }
.webinar-intro .speakers .speaker-card{ display: flex; gap: 16px; align-items: center; }
.webinar-intro .speakers .speaker-avatar{ width: 48px; height: 48px; border-radius: 50%; overflow: hidden; flex-shrink: 0; background: rgba(0,227,122,0.12); display: flex; align-items: center; justify-content: center; border: 1px solid rgba(0,227,122,0.2); }
.webinar-intro .speakers .speaker-avatar img{ width: 100%; height: 100%; object-fit: cover; }
.webinar-intro .speakers .speaker-initials{ font-family: var(--space); font-size: 22px; font-weight: 700; color: var(--green); }
.webinar-intro .speakers .speaker-name{ font-family: var(--space); font-size: 18px; font-weight: 600; color: var(--offwhite); margin-bottom: 4px; }
.webinar-intro .speakers .speaker-role{ font-size: 13px; color: var(--green); margin-bottom: 0; font-weight: 500; line-height: 1.4; }
.webinar-intro .speakers .speaker-bio{ font-size: 15px; font-weight: 300; color: rgba(242,244,241,0.55); line-height: 1.65; }

/* Events */
.events-hero.hero-wrap{ min-height: 610px; }
.events-hero.hero-wrap .hero-image{ position: absolute; width: 100%; height: 100%; top: 0; left: 0; inset: 0; background-image: url('../img/temp/3d-particles.jpg'); background-size: cover; background-position: center; opacity: 0.45; }
.events-hero.hero-wrap .hero-overlay{ position: absolute; width: 100%; height: 100%; top: 0; left: 0; inset: 0; background: linear-gradient(160deg, rgba(5,7,10,0.85) 0%, rgba(2,17,10,0.75) 50%, rgba(5,7,10,0.90) 100%) !important; }
.events-hero.hero-wrap .text .description{ font-size: 25px; margin-bottom: 30px; }
.events-hero.hero-wrap .event-meta-list{ display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 28px; margin-bottom: 40px; }
.events-hero.hero-wrap .event-meta-item{ display: inline-flex; align-items: center; gap: 12px; font-family: var(--space); font-size: 16px; font-weight: 600; letter-spacing: -0.01em; color: var(--offwhite); }
.events-hero.hero-wrap .event-meta-item .icon-block{ width: 32px; height: 32px; border-radius: 6px; background: rgba(0,227,122,0.08); border: 1px solid rgba(0,227,122,0.28); display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; color: var(--green); }
.events-hero.hero-wrap .event-meta-item .icon-block svg{ display: block; }

/* Whitepapers */
.whitepaper-hero.hero-wrap{ min-height: 610px; }
.whitepaper-hero.post-hero.hero-wrap .text .meta{ margin: 30px 0; }
.whitepaper-content{ padding: 100px 0; }
.whitepaper-content .content{ max-width: 860px; }

.whitepaper-content .whitepaper-wrapper-columns{ display: flex; gap: 50px; align-items: center; }
.whitepaper-content .whitepaper-wrapper-columns .left{ min-width: 350px; }
.whitepaper-content .whitepaper-wrapper-columns .left figure{ border-radius: 10px; overflow: hidden; line-height: 0; }
.whitepaper-content .whitepaper-wrapper-columns .left figure img{ width: 100%; }
.whitepaper-content .whitepaper-wrapper-columns .right{ font-size: 24px; line-height: 1.5; font-weight: 300; }
.whitepaper-content .whitepaper-wrapper-columns .right h2{ font-size: 56px; letter-spacing: -1px; font-weight: 700; margin-bottom: 30px; }
.whitepaper-content .whitepaper-form{ margin-top: 100px; }


@media screen and (max-width: 1280px){

    .post-hero.hero-wrap .text .title{ font-size: 52px; }

    .content-wrapper .article-content{ padding-left: 30px; }

    .webinar-intro .intro-columns{ gap: 0; }
    .webinar-intro .intro-columns .right{ font-size: 18px; padding-left: 40px; }

}

@media screen and (max-width: 1023px){

    .content-wrapper .content{ padding-right: 20px; }
    .post-hero.hero-wrap .text .title{ font-size: 42px; }
    .post-hero.hero-wrap .text .meta{ flex-direction: column; gap: 8px; }
    .post-hero.hero-wrap .text .meta .divider{ display: none; }

    .content-wrapper .content{ flex-direction: column; }
    .content-wrapper .article-toc{ position: relative; top: 0; width: 100%; margin-bottom: 30px; }

    .content-wrapper .article-content{ width: 100%; font-size: 16px; padding-left: 0; }
    .content-wrapper .article-content .share-bar{ margin: 20px 0 0; }
    .content-wrapper .article-content > h2,
    .content-wrapper .article-content > h3{ margin-top: 0; }

    /* Webinars */
    .webinar-intro .intro-columns{ grid-template-columns: 100%; }
    .webinar-intro .intro-columns .right{ font-size: 16px; }
    .webinar-intro .speakers{ flex-direction: column; }
    .webinar-intro .intro-columns .right{ padding-left: 0; margin-top: 40px; }

    /* Whitepaper */
    .whitepaper-hero.hero-wrap{ min-height: 100px; padding: 120px 0 40px; }
    .whitepaper-content{ padding: 50px 0 0; }
    .whitepaper-content .whitepaper-wrapper-columns{ flex-direction: column; }
    .whitepaper-content .whitepaper-wrapper-columns .right h2{ font-size: 36px; }
    .whitepaper-content .whitepaper-wrapper-columns .right{ font-size: 17px; }
    .whitepaper-content .whitepaper-form{ margin-top: 50px; }


    /* Events */
    .events-hero.hero-wrap{ min-height: 100px; padding: 120px 0 50px; }
    .events-hero.hero-wrap .text .description{ font-size: 20px; }

    /* Post */
    .post-hero.hero-wrap.small-hero{ min-height: auto; padding: 120px 0 30px; }


}

@media screen and (max-width: 767px){

    .post-hero.hero-wrap .text .title{ font-size: 36px; }

    /* Events */
    .events-hero.hero-wrap .text .description{ font-size: 18px; }

}

@media screen and (max-width: 540px){

}