/* ============================================================
   CMS OBJECT: Webinar Block
   Views: _WebinarBlock.cshtml, _Webinars.cshtml
   Dependencies: Bootstrap 5, cmscontainermanagement.js filtering and video modal
   ============================================================ */

.cms-webinar-block {
    overflow: hidden;
}

.cms-webinar-block section {
    width: min(1200px, 100%);
    height: auto;
    margin: 50px auto;
    padding: 0 30px 0 15px;
    position: relative;
}

.cms-webinar-block h2 {
    padding-bottom: 15px;
    color: #f58025;
    font-size: 42px;
    font-weight: 300;
    line-height: 42px;
}

.cms-webinar-block h4 {
    margin: 50px 0 30px;
    padding-bottom: 8px;
    border-bottom: 1px solid #f58025;
    color: #f58025;
    font-size: 28px;
    font-weight: 400;
}

/* Bootstrap owns the card structure; these rules provide the branded reveal. */
.cms-webinar-block .cms-webinar-block__primary:hover .cms-webinar-block__overlay {
    opacity: 1;
}

.cms-webinar-block .cms-webinar-block__primary:hover .cms-webinar-block__overlay-content,
.cms-webinar-block .cms-webinar-block__primary:hover .cms-webinar-block__overlay-action {
    transform: none;
}

.cms-webinar-block .cms-webinar-block__primary:hover .cms-webinar-block__media {
    transform: scale3d(1.1, 1.1, 1.1);
}

.cms-webinar-block .cms-webinar-block__overlay {
    z-index: 9;
    background: rgba(245, 128, 37, .9);
    opacity: 0;
    transition: all .35s ease;
}

.cms-webinar-block .cms-webinar-block__overlay-content {
    transform: translateY(-8px);
    transition: all .35s ease;
}

.cms-webinar-block .cms-webinar-block__overlay h3 {
    margin-top: 70px;
    font-size: 22px;
    font-weight: 400;
}

.cms-webinar-block .cms-webinar-block__overlay p {
    color: #fff;
    font-size: 15px;
    font-weight: 600;
}

.cms-webinar-block .cms-webinar-block__overlay-action {
    font-size: 12px;
    letter-spacing: .8px;
    transform: translateY(8px);
    transition: all .35s ease;
}

.cms-webinar-block .cms-webinar-block__media {
    height: 240px;
    background: linear-gradient(0deg, rgb(220, 220, 220) 0, rgba(220, 220, 220, 0) 100%) center / contain no-repeat;
    transition: all .35s ease;
}

.cms-webinar-block .cms-webinar-block__media img {
    max-width: 90%;
    max-height: 90%;
}

.cms-webinar-block .cms-webinar-block__content {
    min-height: 250px;
    overflow: hidden;
    font-size: 20px;
}

.cms-webinar-block .cms-webinar-block__content--compact,
.cms-webinar-block .cms-webinar-block__content--standard {
    min-height: 150px;
}

.cms-webinar-block .cms-webinar-block__content h3,
.cms-webinar-block .cms-webinar-block__content h5,
.cms-webinar-block .cms-webinar-block__content p {
    color: #444;
    text-align: left;
    text-decoration: none;
}

.cms-webinar-block .cms-webinar-block__content h3,
.cms-webinar-block .cms-webinar-block__content h5 {
    font-size: 20px;
}

.cms-webinar-block .cms-webinar-block__content h3 {
    margin: 0 0 10px;
}

.cms-webinar-block .cms-webinar-block__content p {
    margin: 0;
    font-size: 16px;
}

.cms-webinar-block .cms-webinar-block__action {
    overflow: hidden;
    font-size: 15px;
    text-decoration: none;
}

.cms-webinar-block__webinar {
    min-width: 280px;
}

.cms-webinar-block__webinar .cms-webinar-block__media img {
    min-height: 180px;
    object-fit: cover;
}

.cms-webinar-block--preview .cms-webinar-block__actions .btn {
    min-width: 160px;
    text-decoration: none !important;
}

.cms-webinar-block--preview .cms-webinar-block__actions .btn:hover,
.cms-webinar-block--preview .cms-webinar-block__actions .btn:focus {
    text-decoration: none !important;
}