@import url('https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300;0,400;0,500;0,700;0,900;1,300;1,400;1,500;1,700;1,900&display=swap');

*:not([class^="ti-"], [class*=" ti-"], .fas, .fab, .fa) {
  font-family: 'Rubik' !important;
}

@media (max-width: 768px) {
  .footer-section h4 {
    margin-top: 30px;
    margin-bottom: 12px;
  }

  .btn.primary-solid-btn.animated-btn {
    margin-top: 12px;
  }

  .single-pricing-pack,
  .single-service-plane {
    margin-bottom: 15px !important;
  }

  .contact-us-promo .card {
    margin-bottom: 15px !important;
  }

  .single-promo-2.card {
    margin-bottom: 15px !important;
  }
}

.hero-equal-height.gradient-overlay:before {
  background-image: -webkit-gradient(linear, left top, right top, from(#8cd5ee), to(#367dd1));
  background-image: linear-gradient(90deg, #8cd5ee, #367dd1);
}

.green-overlay.gradient-overlay:before {
  background: #119084;
}

.light-blue-overlay.gradient-overlay:before {
  background-image: -webkit-gradient(linear, left top, right top, from(#8cd5ee), to(#367dd1));
  background-image: linear-gradient(90deg, #8cd5ee, #367dd1);
}

#pagesSubMenu {
  height: auto;
}

.outline-btn,
.secondary-solid-btn,
.primary-solid-btn,
.solid-white-btn,
.outline-white-btn,
.secondary-outline-btn {
  -webkit-transition: none;
  transition: none;
}

.menu-item-icon i {
  color: #2862b7;
}

.login-signup-form .form-group .input-group.input-group-merge>.form-control {
  text-indent: 0;
}

.speaker-inner-border{
  background: linear-gradient(180deg, #54bced,  #052da0);
  padding: 7px;
  border: 5px solid white;

}
.speaker-outer-border{
  background: linear-gradient(180deg, #052da0, #54bced);
  padding: 7px;
}

.banner-h1{
  font-size: 60px;
}

.webinar-speaker{ 
  width: 50%;
}

.gap-between-speakers{
  gap: 3rem;
}

.list-item-webinar{
  font-size: 1.4rem;
}
 
  
.missing-field-input  {
  border-color : #f80630;
}


@media (min-width: 768px) and (max-width: 992px) {
  .container {
    max-width: 95%;
  }

  .navbar-expand-md .main-navbar-nav .custom-nav-link {
    padding-top: 1.75rem;
    padding-bottom: 1.75rem;
    padding-right: 0.400rem;
    padding-left: 0.400rem;
  }
  .speaker-name{
    font-size: 20px;
    }
}

.pricing-feature-list li {
  display: block;
  width: 100%;
}

@media  (max-width: 768px) {
  .banner-h1{
    font-size: 2.5rem;
  }
  .webinar-speaker{ 
    width: 50%;
  }
  .gap-between-speakers{
    gap: 10px;
  }
  .speaker-name{
  font-size: 20px;
  }
  .list-item-webinar{
    font-size: 1.2em;
  }
}


/* radios + panes: keep yours unchanged */
input[name="vtab"] { display: none; } 

.pane { display: none; }
.container:has(#t1:checked) .panes #p1 { display: block; }
.container:has(#t2:checked) .panes #p2 { display: block; }
.container:has(#t3:checked) .panes #p3 { display: block; }
.container:has(#t4:checked) .panes #p4 { display: block; }

.tabs{
  display:flex;
  justify-content:center;   
  width: 100%;
  align-items:center;
  gap:clamp(12px, 4vw, 64px);                    /* responsive spacing */
  background:transparent;                        /* no pill */
  padding:0 40px;
  border-radius:0;
  white-space:nowrap;
  max-width:100%;
  overflow-x:auto;                               /* mobile: swipe if needed */
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;

}
.tabs::-webkit-scrollbar{ display:none; }


.tabs > * {
  flex: 1 1 auto;
  text-align: center;
  max-width: 180px;  /* prevents super-wide stretching */
  padding: 0 12px;
}

/* labels = plain text */
.tabs label{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:8px 4px;                               /* tight around text */
  height:auto;                                   /* remove fixed 44px */
  border:0;                                      /* no borders */
  border-radius:0;
  background:transparent;
  color:#2b2b2b;
  font-weight:400;
  font-size:clamp(16px, 2vw, 22px);
  cursor:pointer;
  transition:color .15s ease;
}

/* the underline (hidden by default) */
.tabs label::after{
  content:"";
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  bottom:-4px;                                   /* space under text */
  width:10%;
  height:2px;
  background:currentColor;
  opacity:0;
  border-radius:1px;
  transition:opacity .3s ease, width .3s ease;
}

/* active state: just color + show underline */
#t1:checked ~ .tabs label[for="t1"],
#t2:checked ~ .tabs label[for="t2"],
#t3:checked ~ .tabs label[for="t3"],
#t4:checked ~ .tabs label[for="t4"]{
  color:#111;    
}
#t1:checked ~ .tabs label[for="t1"]::after,
#t2:checked ~ .tabs label[for="t2"]::after,
#t3:checked ~ .tabs label[for="t3"]::after,
#t4:checked ~ .tabs label[for="t4"]::after{
  opacity:1;
  width:100%;
}

/* keyboard focus */
.tabs label:focus-visible{
  outline:2px solid #93c5fd;
  outline-offset:2px;
}

/* optional: slightly smaller on very small screens */
@media (max-width:520px){
  .tabs label{ font-size:15px; }
}

/* base underline (hidden) */
.tabs label::after{
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: -6px;
  width: 0;                  /* hidden by default */
  height: 1px;               /* delicate line */
  opacity: 0;
  border-radius: 1px;
  transition: width .6s ease, opacity .3s ease;
}

/* hover: small, subtle underline */
.tabs label:hover::after{
  width: 60%;                /* shorter than active */
  opacity: .6;
}

/* active: full, bolder underline */
#t1:checked ~ .tabs label[for="t1"]::after,
#t2:checked ~ .tabs label[for="t2"]::after,
#t3:checked ~ .tabs label[for="t3"]::after,
#t4:checked ~ .tabs label[for="t4"]::after{
  width: 100%;
  height: 2px;               /* a touch thicker */
  opacity: 1;
  background: currentColor;  /* solid for active */
}