@import url('../fonts/stylesheet.css');

:root {
    --primaryRgb: 40, 97, 178;
    --secondaryRgb: 64, 122, 204;
    --contrastRgb: 255, 255, 255;

    --primaryColor: rgba(var(--primaryRgb), 1);
    --secondaryColor: rgba(var(--secondaryRgb), 1);
    --contrast: rgba(var(--contrastRgb), 1);

    --primary-font: 'Roboto';
    --secondary-font: 'Bacasime Antique';
}

html {
    scroll-behavior: smooth;
    scroll-padding-top: 120px;
}

section {
    scroll-margin-top: 120px;
}

html,
body {
    height: 100%;
    margin: 0;
}

* {
    box-sizing: border-box;
}

a {
    text-decoration: none;
    color: var(--primaryColor);
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin-top: 0px;
    padding: 0px;
}

img {
    width: auto;
    max-width: 100%;
    height: auto;
}

p {
    margin: 0;
}

p:not(:last-of-type) {
    margin: 0 0 20px;
}

body {
    display: flex;
    flex-direction: column;
    /* min-height: 100vh; */
    font-family: var(--primary-font), sans-serif;
    background: #000E22;
    color: var(--contrast);
    margin: 0px;
    padding: 0px;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -webkit-backface-visibility: hidden;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    font-display: swap;
    font-size: 18px;
    line-height: 1.55;

}

.container {
    width: 100%;
    max-width: 1680px;
    padding: 0 20px;
    margin: 0 auto;
}

.headerSpacing {
    height: 175px;
    padding: 11px;
    display: flex;
    width: 100%;
    flex: 0 0 auto;
}

.headerMain {
    padding: 20px 0;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 99;
    top: 0;
    transition: 0.3s ease-in-out all;
}

.headerMain.hide:has(.menu-toggle:not(.open)) {
    /* top: -160px; */
}

.headerMain.scrolled {
    background: rgba(var(--primaryRgb), 0.4);
    backdrop-filter: blur(8px);
}

.headerMain__wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.headerMain__left {
    display: flex;
    align-items: center;
    gap: 60px;
}

.logo a {
    color: #fff;
    font-size: 28px;
    text-decoration: none;
    font-weight: bold;
}

.btnHolder {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.tag {
    font-weight: 600;
    font-size: 12px;
    line-height: 18px;
    letter-spacing: 0px;
    text-align: center;
    vertical-align: middle;
    color: var(--contrast);
    padding: 3px 8px;
    border-radius: 42px;
    display: inline-block;
    text-transform: uppercase;
}

.tag.tag-primary {
    background: var(--primaryColor);

}

li.btn.btn-primary.menu-item {
    border: 0;
    padding: 0;
    background: transparent;
}


.btn,
ul#menu-book-now-button li a,
li.btn.btn-primary.menu-item a {
    display: inline-block;
    padding: 17px 44px;
    text-decoration: none;
    border-radius: 4px;
    transition: all 0.2s ease-in-out;
    color: var(--contrast);
    border: 1px solid transparent;
    border-radius: 14px;
    font-weight: 500;
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
}

.btn.btn-primary,
ul#menu-book-now-button li a,
li.btn.btn-primary.menu-item a {
    background: var(--primaryColor);
    color: var(--contrast);
    border-color: var(--primaryColor);
}

.btn.btn-primary:hover,
ul#menu-book-now-button li a:hover,
li.btn.btn-primary.menu-item a:hover {
    background: rgba(var(--secondaryRgb), 0.1);
    color: var(--contrast);
    border-color: var(--secondaryColor);
}

.btn.btn-white-outline {
    background-color: transparent;
    border-color: var(--contrast);
    color: var(--contrast)
}

.btn.btn-white-outline:hover {
    background-color: var(--contrast);
    border-color: var(--contrast);
    color: var(--primaryColor);
}

.btn.btn-text {
    padding: 0;
    background: transparent;
    border: 0;
    color: var(--contrast)
}

.btn.btn-text.btn-primary {
    color: var(--primaryColor);
}

.btn.btn-text.btn-primary:hover {
    background: transparent;
    color: var(--secondaryColor);
}


.text-eyebrow {
    font-weight: 400;
    font-size: 20px;
    line-height: 100%;
    text-transform: uppercase;
    color: var(--secondaryColor);
}

.section-heading .text-eyebrow {
    margin-bottom: 20px;
}

.section-heading {
    margin-bottom: 28px;
}

.section-heading h2 {
    font-size: 60px;
    line-height: 1;
    font-weight: 600;
    margin-bottom: 18px;
    color: var(--contrast);
}

.section-heading p:not(.text-eyebrow) {
    font-weight: 400;
    font-size: 20px;
    line-height: 1.4;
    color: var(--contrast);
    opacity: 0.7;

}


.main-navigation ul {
    display: flex;
    align-items: center;
    gap: 44px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.main-navigation ul li a {
    color: #fff;
    text-decoration: none;
    font-weight: 400;
    font-size: 18px;
    line-height: 1;
    text-transform: uppercase;
}

.main-navigation ul li.active a {
    color: var(--secondaryColor);
}

.main-navigation .btn.btn-primary a {
    font-weight: 500;
}

ul#menu-book-now-button {
    list-style: none;
    padding: 0;
}

.menu-toggle {
    display: none;
    color: #fff;
    font-size: 28px;
    cursor: pointer;
}

.site-main {
    flex: 1;
}

.logo a {
    display: block;
    max-width: 205px;
    width: 100%;
    transition: max-width 0.2s ease-in-out;
}

.headerMain.scrolled .logo a {
    max-width: 135px;
}

.logo a img {
    display: block;
    width: 100%;
    height: auto
}


/* banner */
.bannerSection {
    /* overflow-x: clip; */
}

.bannerSection__row {
    --size: 660px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

.bannerSection__left {
    width: var(--size);
    flex: 0 0 auto;
    position: relative;
    max-width: 50%;
    margin-bottom: 136px;
}

.bannerSection__right {
    text-align: center;
    flex: 0 0 auto;
    width: calc(100% - var(--size));
}

.bannerSection__left:after {
    content: "";
    background: linear-gradient(180deg, rgba(0, 14, 34, 0) 90%, rgba(0, 14, 34, 0.7) 95%, #000E22 100%);
    position: absolute;
    inset: 0;
    z-index: 12;
    display: block;
}


.bannerSection__anchor {
    display: block;
    position: absolute;
    left: 50%;
    bottom: 75px;
    transform: translateX(-50%);
    user-select: none;
}

.bannerSection__right ul {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 30px;
    padding: 0;
    margin: 0;
    list-style: none;
    margin: 0 0 60px;
}

.bannerSection__right ul li {
    font-size: 28px;
    text-transform: uppercase;
    color: var(--primaryColor);
    font-weight: 400;
    line-height: 100%;
    letter-spacing: 10%;
    text-transform: uppercase;
    padding-left: 30px;
    position: relative;
}

.bannerSection__right ul li::before {
    content: '';
    background: var(--primaryColor);
    position: absolute;
    left: 0;
    top: 0;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    position: absolute;
    left: 0;
    top: 11px;
}

.bannerSection__right ul li:first-child:before {
    display: none;
}

.bannerSection__right .btnHolder {
    justify-content: center;
}

.bannerSection__signature img {
    width: 192px;
}

.bannerSection__right h1 {
    font-family: var(--secondary-font);
    font-weight: 400;
    font-size: 100px;
    line-height: 1;
    letter-spacing: 4%;
    margin-bottom: 12px;

    font-size: clamp(34px, 100px, 5.6vw);
}


.bannerSection__right p {
    font-weight: 400;
    font-size: 40px;
    line-height: 1.425;
    text-align: center;
    max-width: 700px;
    margin-inline: auto;
    margin-bottom: 40px;
}

.bannerSection .container {
    position: relative;
}

.bannerSection__row {
    position: relative;
    z-index: 1;
}

.bannerSection .container:before {
    content: "JP";
    font-family: var(--secondary-font);
    font-weight: 400;
    font-size: 1000px;
    line-height: 100%;
    letter-spacing: -6%;
    position: absolute;
    opacity: 0.05;
    z-index: 0;
    top: -150px;
    left: -126px;
}

.leadingSection {
    position: relative;
    padding-bottom: 136px;
    padding-top: 264px;
    overflow-x: clip;
}

.leadingSection .section-heading {
    max-width: 900px;
    margin-bottom: 60px;
}

.leadingSection__row {
    --count: 3;
    display: grid;
    grid-template-columns: repeat(var(--count), 1fr);
    gap: 40px;
}

.bannerSection__card {
    padding: 60px 44px;
    border-radius: 40px;
    background-color: rgba(var(--primaryRgb), 0.1);
}

.bannerSection__card h3 {
    font-weight: 400;
    font-size: 36px;
    line-height: 100%;
    margin-bottom: 20px;
}

.bannerSection__card p {
    font-weight: 400;
    font-size: 18px;
    line-height: 1.5;
    color: rgba(255, 255, 255, 0.502);
    margin-bottom: 60px;
}

.speakingSection {
    background: rgba(0, 0, 0, 0.278);
    /* overflow-x: clip; */
}

.speakingSection .container {
    position: relative;
    padding-top: 120px;
}


.speakingSection__row {
    --size: 759px;
    display: flex;
    justify-content: space-between;
}

.speakingSection__image {
    position: relative;
    max-width: var(--size);
    display: flex;
    align-items: flex-end;
    margin-left: -50px;
    width: 100%;
}

.speakingSection__image img {
    max-width: 650px;
    width: 100%;
    margin: 0 auto;
}

.speakingSection__content {
    --space: 75px;
    max-width: calc(100% - var(--size) + var(--space));
    display: flex;
    flex-direction: column;
    gap: 80px;
    margin-left: calc(var(--space) * -1);
    padding-block: 32px;
}

.speakingSection__image:after {
    content: "";
    position: absolute;
    inset: 0;
    bottom: -1px;
    z-index: 2;
    display: block;
    background: linear-gradient(180deg, rgba(0, 10, 24, 0) 86%, rgba(0, 10, 24, 0.8) 94%, #000A18 100%);
}

.speakingSection__content ul {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 15px;
    list-style: none;
    padding: 0;
    margin: 0 0 48px;
    max-width: 602px;
    width: 100%;
}

.speakingSection__content ul li {
    padding-left: 36px;
    position: relative;
    font-weight: 400;
    font-size: 18px;
    line-height: 1;
    color: rgba(var(--contrastRgb), 0.5);
}

.speakingSection__content ul li::before {
    content: "";
    background-image: url("data:image/svg+xml,%3Csvg width='20' height='19' viewBox='0 0 20 19' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9.65341 0C10.0737 0.0489833 10.4964 0.0740924 10.9134 0.153124C12.5858 0.470075 14.0644 1.18424 15.3474 2.30304C15.4528 2.39483 15.4495 2.45575 15.3396 2.5426C14.9424 2.85667 14.5476 3.17403 14.1599 3.49963C14.0463 3.59513 13.9751 3.56014 13.8783 3.48234C12.8089 2.61875 11.5901 2.07994 10.2289 1.91405C8.09994 1.65391 6.17889 2.18655 4.52293 3.56508C3.03285 4.8053 2.15568 6.40323 1.91282 8.32592C1.53454 11.3238 3.01062 14.2216 5.66354 15.7026C6.93587 16.4127 8.30411 16.7021 9.7522 16.6177C13.1337 16.4213 16.0418 13.7581 16.5461 10.4071C16.7231 9.23067 16.6453 8.07524 16.2756 6.94245C16.2353 6.81856 16.2443 6.728 16.3333 6.62592C16.6967 6.20771 17.0503 5.78044 17.4113 5.35976C17.5475 5.20128 17.5661 5.20746 17.6537 5.40216C18.2473 6.72141 18.5396 8.10488 18.4848 9.55009C18.3185 13.9388 15.1807 17.5401 10.978 18.3045C7.6381 18.9121 4.75879 17.9299 2.43064 15.459C1.0517 13.996 0.285667 12.2252 0.0621553 10.2215C0.0316951 9.94937 0.0584506 9.67399 0 9.4052C0 9.29571 0 9.18622 0 9.07673C0.00905573 9.00922 0.0251091 8.94213 0.0255207 8.87462C0.0292253 8.31769 0.0954968 7.76653 0.235037 7.23018C1.22623 3.42471 3.63999 1.07228 7.47222 0.179468C7.91924 0.0753272 8.37779 0.054746 8.83181 0H9.65341Z' fill='%23407ACC' fill-opacity='0.7'/%3E%3Cpath d='M9.56048 9.41066C9.94124 8.97023 10.2829 8.5619 10.6385 8.16632C12.4871 6.1115 14.4423 4.1711 16.7318 2.59993C17.6296 1.98414 18.6018 1.51736 19.672 1.27738C19.7054 1.26997 19.7387 1.26133 19.7725 1.25598C19.8445 1.24445 19.9371 1.19012 19.9828 1.26256C20.0404 1.35353 19.9363 1.40745 19.8828 1.46097C16.7347 4.59548 13.9455 8.02431 11.4708 11.7116C11.1584 12.1772 10.8686 12.6596 10.5027 13.0877C10.1005 13.5582 9.62964 13.9171 8.98956 13.9892C8.49149 14.0451 8.07246 13.8945 7.74892 13.5039C7.56781 13.2853 7.44268 13.0346 7.33977 12.7724C6.75321 11.2757 6.16623 9.77948 5.58378 8.28117C5.46235 7.96916 5.36027 7.65138 5.31499 7.3155C5.19356 6.41075 5.86492 5.55539 6.77502 5.50394C7.23769 5.4776 7.64849 5.65007 7.98437 5.97525C8.50467 6.47867 8.79198 7.12245 9.0546 7.77899C9.26041 8.2931 9.41394 8.82492 9.56007 9.41108L9.56048 9.41066Z' fill='%23407ACC' fill-opacity='0.7'/%3E%3C/svg%3E%0A");
    width: 20px;
    height: 20px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    position: absolute;
    left: 0;
    top: 0;
}

.testimonail__box {
    padding: 50px 60px;
    border-radius: 28px;
    background: rgba(var(--primaryRgb), 0.1);
    position: relative;
    background-image: url(../images/quotes.svg);
    background-repeat: no-repeat;
    background-position: 28px 28px;
    background-size: 100px;
}

.testimonail__box p {
    font-weight: 400;
    font-size: 20px;
    line-height: 1.8;
    letter-spacing: 0%;
    color: var(--contrastRgb);
    margin-bottom: 30px;
}

.testimonail__user {
    display: flex;
    align-items: center;
    gap: 18px;
}

.testimonail__userImg {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    overflow: hidden;
    flex: 0 0 60px;
    border: 2px solid var(--contrast);
}

.testimonail__userImg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.testimonail__userDetail {
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.testimonail__userName {
    font-weight: 600;
    font-size: 24px;
    line-height: 100%;
    letter-spacing: 0px;
    color: var(--contrast);
}

.testimonail__userDesignation {
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0px;
    vertical-align: middle;
    color: rgba(var(--contrastRgb), 0.8);
}

.performingSection {
    /* background-image: url(../images/performingBg.svg);
    background-repeat: no-repeat;
    background-size: 105%;
    background-position: -23px 80px; */
    /* overflow-x: clip; */
}

.performingSection .container {
    padding-block-start: 136px;
    padding-block-end: 128px;
    position: relative;
}

.performingSection__row {
    display: flex;
    align-items: center;
    gap: 18%;
}

.performingSection__content {
    width: 100%;
    max-width: 800px;
    flex: 0 0 auto;
}

.performanceList {
    display: flex;
    flex-direction: column;
    gap: 32px;
    max-width: 668px;
}

.performanceBox {
    color: var(--contrast);
    padding-bottom: 24px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    border-bottom: 1px solid #1E293B;
}

.performanceBox__top {
    display: flex;
    justify-content: space-between;
}

.performanceBox__body p {
    font-weight: 400;
    font-size: 18px;
    line-height: 28px;
    color: rgba(var(--contrastRgb), 0.5);
}


.performanceBox__top i {
    color: #64748B;
}

.performanceBox__topLeft {
    display: flex;
    gap: 18px;
}

.performingSection__img {
    width: 100%;
    /* max-width: 533px; */
    max-width: 31.727%;
    flex: 0 0 auto;
    transform: rotate(8deg);
}

.performanceBox__top h3 {
    margin: 0;
    font-weight: 400;
    font-size: 24px;
    line-height: 100%;
    color: #E2E8F0;
}

.performingSection__img img {
    border-radius: 18px;
}

.contactSection {
    padding: 136px 0 128px;
    position: relative;
    background-color: #071022;
    background-image: url(../images/contactSectionBg-trial.webp);
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center;
}

.contactSection .section-heading {
    text-align: center;
    margin-bottom: 40px;
}

.contactSection .section-heading p {
    max-width: 910px;
    margin-inline: auto;
}

.jsc-contact-form {
    max-width: 100%;
    width: 825px;
    margin: 0 auto;
}

.jsc-form-row {
    margin-bottom: 22px;
}

.jsc-contact-form .two-col {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
}

.jsc-form-group label {
    display: block;
    color: #fff;
    font-size: 18px;
    margin-bottom: 12px;
    font-weight: 400;
    font-size: 18px;
    line-height: 1;
}

.jsc-form-group input,
.jsc-form-group textarea,
.jsc-form-group select {
    width: 100%;
    height: 60px;
    padding: 0 18px;
    border: 0;
    border-radius: 14px;
    background: rgba(var(--contrastRgb), .06);
    color: #fff;
    font-size: 16px;
    outline: none;
}

.jsc-form-group select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: none;
    padding-right: 55px;
    cursor: pointer;
    background-image: url("data:image/svg+xml,%3Csvg width='16' height='9' viewBox='0 0 16 9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0.0179414 0.544976C0.13914 0.0291998 0.849471 -0.168545 1.24997 0.216009C1.66414 0.614232 2.06555 1.02521 2.47243 1.43118C4.25487 3.20906 6.03685 4.9874 7.81929 6.76482C7.87715 6.82223 7.93775 6.87736 8.04892 6.98261C8.10633 6.89878 8.14734 6.81403 8.21022 6.75115C10.3654 4.59737 12.5232 2.44679 14.6775 0.292556C14.8766 0.093444 15.0935 -0.0341332 15.3823 0.00732941C15.9332 0.0870651 16.1893 0.736798 15.8421 1.1742C15.7815 1.25075 15.7077 1.31727 15.6379 1.38699C13.3315 3.68839 11.026 5.9907 8.71552 8.28846C8.55832 8.44474 8.36422 8.56457 8.18744 8.70126H7.82384C7.64706 8.56411 7.45387 8.44428 7.29622 8.28754C5.00211 6.00665 2.71119 3.72119 0.42391 1.43209C0.243024 1.25075 0.0211309 1.02293 0.00199428 0.755934C-0.00347331 0.680755 0.00244991 0.610132 0.0179414 0.544976Z' fill='%232861B2' fill-opacity='0.6'/%3E%3C/svg%3E%0A");
    background-repeat: no-repeat;
    background-position: right 28px center;
    background-size: 16px;
}


.jsc-form-group textarea {
    height: 150px;
    padding: 18px;
    resize: none;
}

.jsc-form-group input::placeholder,
.jsc-form-group textarea::placeholder {
    color: rgba(255, 255, 255, .55);
}

.submit-row {
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 0;
}

.submit-row p {
    position: relative;
}

span.wpcf7-spinner {
    position: absolute;
    margin: 0;
    left: 50%;
    z-index: 1111;
    top: 50%;
    transform: translate(-50%, -50%);
}

.wpcf7-response-output {
    text-align: center;
}

/* footer */

.mainFooter {
    color: #fff;
    padding: 55px 0 38px;
    text-align: center;
    margin-top: auto;
}

.mainFooter__logo a {
    display: block;
    width: 293px;
}

.mainFooter__logo a img {
    display: block;
    width: 100%;
}

.mainFooter .container {
    align-items: center;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
}

.mainFooter__social ul {
    display: flex;
    justify-content: center;
    align-items: center;
    list-style: none;
    gap: 28px;
    padding: 0;
    margin: 0;
}

.mainFooter p {
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    text-align: right;
    text-transform: uppercase;
    color: rgba(var(--contrastRgb), 0.5);

}

.mainFooter__social ul li a {
    font-size: 0;
    text-decoration: none;
    color: var(--contrast);
    transition: 0.2s ease-in-out all;
    opacity: 0.8;
    display: block;
}

.mainFooter__social ul li a:hover {
    opacity: 1;
}

.mainFooter__social ul li a::before {
    font-size: 24px;
}

.speakingSection .section-heading p:not(.text-eyebrow) {
    max-width: 800px;
}

.resourcesBox {
    padding: 60px 44px 30px;
    border-radius: 40px;
    background-color: rgba(var(--primaryRgb), 0.1);
    z-index: 2;
    position: relative;
}

.resourcesBox__header h3 {
    font-weight: 600;
    font-size: 36px;
    line-height: 100%;
    margin-bottom: 10px;
}

.resourcesBox__header p {
    font-weight: 400;
    font-size: 18px;
    line-height: 1.5;
    color: rgba(255, 255, 255, 0.502);
}

.resourcesBox__header {
    margin-bottom: 40px;
}

.resourcesBox__link {
    font-weight: 400;
    font-size: 16px;
    line-height: 1.8;
    letter-spacing: 0%;
    color: var(--contrastRgb);
    margin-bottom: 10px;
    display: flex;
    gap: 12px;
    padding: 10px 0;
    border-bottom: 1px solid rgba(var(--primaryRgb), 0.5);
    transition: 0.2s ease-in-out all;
    position: relative;
}

.resourcesBox__link:last-child {
    border-bottom: 0;
}

.resourcesBox__link:last-child:before {
    display: none;
}

.resourcesBox__link:hover {
    padding-left: 3px;
}

.resourcesBox__link:before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    display: block;
    background: rgba(var(--primaryRgb), 1);
    width: 0;
    transition: 0.3s ease-in-out all;
    height: 2px;
}

.resourcesBox__link:hover:before {
    width: 100%;
}


.resourcesBox__content h4 {
    margin: 0;
    font-weight: 600;
    font-size: 18px;
    line-height: 1.5;
}

.resourcesBox__content p {
    color: rgba(var(--contrastRgb), 0.5);
}

/* footer */

.streamingServices {
    width: 100%;
    margin-top: 4rem;
    padding-top: 4rem;
    border-top: 1px solid rgba(var(--contrastRgb), 0.1);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

.streamingServices h4 {
    color: var(--contrast);
    font-size: 24px;
    line-height: 1;
    font-weight: 600;
    margin-bottom: 18px;
}

.streamingServices__row {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 2.5rem;
    flex-wrap: wrap;
}

.streamingServices__link {
    display: inline-block;
    transition: opacity 0.3s ease, transform 0.3s ease;
}

.streamingServices__link img,
.streamingServices__link svg {
    width: auto;
    height: 50px;
    display: block;
}

.streamingServices__link:hover {
    opacity: 1;
    transform: translateY(-2px);
}




.leadingSection::before {
    content: attr(data-bg_text);
    background-size: 101%;
    background-repeat: no-repeat;
    background-position: top;
    position: absolute;
    top: 0;
    left: -14px;
    width: 106%;
    height: 100%;
    z-index: -1;
    right: 0;
    max-width: 1984px;
    margin: 0 auto;
    font-family: var(--secondary-font);
    font-weight: 400;
    font-size: 19vw;
    opacity: 0.03;
    color: var(--contrast);
    font-weight: 500;
    -webkit-text-stroke: 11px;
    -webkit-text-stroke: 11px var(--contrast);
    text-stroke: 11px var(--contrast);
    text-shadow: -1px -1px 0 var(--contrast), 1px -1px 0 var(--contrast), -1px 1px 0 var(--contrast), 1px 1px 0 var(--contrast);
}

.speakingSection .container::before {
    content: "WORK";
    content: attr(data-bg_text);
    position: absolute;
    /* background-image: url("../images/speaking-icon.svg"); */
    top: 0;
    bottom: 0;
    left: -154px;
    width: 200px;
    /* background-repeat: no-repeat; */
    /* background-size: contain; */
    /* background-position: center center; */
    z-index: 3;
    font-family: var(--secondary-font);
    font-weight: 400;
    font-size: 15.5vw;
    opacity: 0.03;
    color: var(--contrast);
    font-weight: 500;
    -webkit-text-stroke: 11px;
    -webkit-text-stroke: 11px var(--contrast);
    text-stroke: 11px var(--contrast);
    text-shadow: -1px -1px 0 var(--contrast), 1px -1px 0 var(--contrast), -1px 1px 0 var(--contrast), 1px 1px 0 var(--contrast);
    writing-mode: sideways-lr;
    /* font-size: 17em; */
    text-align: center;
    line-height: 1;
}

.performingSection {
    overflow-x: hidden;
    position: relative;
}

.performingSection:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0; 
    height: 40%;
    z-index: 1;
    display: block; 
    background: #061223;
    background: -webkit-gradient(linear, left bottom, left top, from(rgba(6, 18, 35, 1)), to(rgba(237, 221, 83, 0)));
    background: linear-gradient(0deg, rgba(6, 18, 35, 1) 0%, rgba(237, 221, 83, 0) 100%);
 
}

.performingSection .container {
    position: relative;
    z-index: 2;
}

.performingSection:before {
    content: attr(data-bg_text);
    position: absolute;
    top: 0;
    left: -14px;
    width: 106%;
    z-index: 0;
    right: 0;
    max-width: 1984px;
    margin: 0 auto;
    font-family: var(--secondary-font);
    font-weight: 400;
    font-size: 19vw;
    line-height: 1;
    opacity: 0.03;
    color: var(--contrast);
    font-weight: 500;
    -webkit-text-stroke: 11px;
    -webkit-text-stroke: 11px var(--contrast);
    text-stroke: 11px var(--contrast);
    text-shadow: -1px -1px 0 var(--contrast), 1px -1px 0 var(--contrast), -1px 1px 0 var(--contrast), 1px 1px 0 var(--contrast);
    text-align: center;
}



#yt-popup {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 9999;
    background: rgba(0, 0, 0, 0.85);
    align-items: center;
    justify-content: center;
}

#yt-popup-inner {
    position: relative;
    width: 90%;
    max-width: 900px;
    aspect-ratio: 16/9;
}

#yt-frame {
    width: 100%;
    height: 100%;
    border-radius: 6px;
}

#yt-close {
    position: absolute;
    top: -40px;
    right: 0;
    background: none;
    border: none;
    color: #fff;
    font-size: 32px;
    cursor: pointer;
    line-height: 1;
}

.captcha .cf7sr-g-recaptcha {
    display: flex;
    justify-content: center;
    align-items: center;
}

.captcha .cf7sr-g-recaptcha>div {
    margin: 0 auto;
}

.jsc-form-group input::placeholder,
.jsc-form-group textarea::placeholder,
.jsc-form-group select::placeholder {
    font-family: var(--primary-font);
}