/* HERO
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

.home-hero {
   position: relative;
   background-color: var(--color-background);
}

.hero-swiper {
   position: relative;
   width: 100%;
   overflow: hidden;
   background-color: var(--color-primary-deep);
}

.hero-slide-image {
   display: block;
   width: 100%;
   height: auto;
}


/* HERO NAVIGATION
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

.hero-nav {
   position: absolute;
   top: 50%;
   z-index: 10;
   display: flex;
   align-items: center;
   justify-content: center;
   width: 46px;
   height: 46px;
   padding: 0;
   border: var(--border-width) solid rgba(255, 255, 255, 0.35);
   border-radius: 50%;
   color: var(--color-white);
   background-color: rgba(23, 25, 71, 0.55);
   opacity: 0;
   backdrop-filter: blur(6px);
   transform: translateY(-50%);
   transition: opacity var(--transition-normal), background-color var(--transition-normal), transform var(--transition-normal);
}

.hero-nav-prev { left: 1.5rem; }
.hero-nav-next { right: 1.5rem; }

.hero-swiper:hover .hero-nav { opacity: 1; }

.hero-nav:hover {
   color: var(--color-white);
   background-color: var(--color-primary);
   transform: translateY(-50%) scale(1.05);
}

.hero-pagination {
   bottom: 1rem !important;
}

.hero-pagination .swiper-pagination-bullet {
   width: 9px;
   height: 9px;
   margin: 0 4px !important;
   background-color: var(--color-white);
   opacity: 0.55;
   transition: width var(--transition-normal), border-radius var(--transition-normal), opacity var(--transition-normal);
}

.hero-pagination .swiper-pagination-bullet-active {
   width: 28px;
   border-radius: var(--border-radius-pill);
   opacity: 1;
}

@media (max-width: 767.98px) {
   .hero-nav {
      width: 38px;
      height: 38px;
      font-size: 0.8rem;
      opacity: 1;
   }

   .hero-nav-prev { left: 0.75rem; }
   .hero-nav-next { right: 0.75rem; }

   .hero-pagination { bottom: 0.6rem !important; }
}


/* CONFERENCE BAR
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

.conference-bar {
   position: relative;
   padding: 2rem 0;
   overflow: hidden;
   color: var(--color-white);
   background: linear-gradient(110deg, var(--color-primary-deep), var(--color-primary));
}

.conference-bar::before, .conference-bar::after {
   content: "";
   position: absolute;
   border: 28px solid rgba(255, 255, 255, 0.035);
   border-radius: 50%;
   pointer-events: none;
}

.conference-bar::before {
   width: 220px;
   height: 220px;
   left: -80px;
   bottom: -155px;
}

.conference-bar::after {
   width: 250px;
   height: 250px;
   top: -190px;
   right: 30%;
}

.conference-bar .container {
   position: relative;
   z-index: 1;
}

@media (max-width: 991.98px) {
   .conference-bar { padding: 1.75rem 0; }
}


/* JOIN INFO
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

.join-info {
   display: flex;
   align-items: center;
   gap: 1rem;
   width: 100%;
   min-height: 96px;
}

.join-icon {
   display: flex;
   align-items: center;
   justify-content: center;
   flex: 0 0 58px;
   width: 58px;
   height: 58px;
   border: 2px solid rgba(255, 255, 255, 0.60);
   border-radius: 50%;
   color: var(--color-white);
}

@media (max-width: 991.98px) {
   .join-info {
      justify-content: center;
      min-height: auto;
   }
}

@media (max-width: 575.98px) {
   .join-info {
      flex-direction: column;
      text-align: center;
   }
}


/* JOIN ACTIONS
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

.join-actions {
   display: flex;
   align-items: center;
   justify-content: center;
   gap: 0.75rem;
   width: 100%;
   min-height: 96px;
}

@media (max-width: 991.98px) {
   .join-actions { min-height: auto; }
}

@media (max-width: 575.98px) {
   .join-actions {
      display: grid;
      grid-template-columns: 1fr 1fr;
   }

   .join-actions a { width: 100%; }
}

@media (max-width: 399.98px) {
   .join-actions { grid-template-columns: 1fr; }
}


/* COUNTER
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

.counter {
   display: flex;
   flex-direction: column;
   justify-content: center;
   width: 100%;
   min-height: 96px;
}

.counter-label {
   margin-bottom: 0.65rem;
   font-weight: var(--font-weight-semibold);
   color: rgba(255, 255, 255, 0.85);
}

.counter-values {
   display: grid;
   grid-template-columns: repeat(4, 1fr);
   align-items: center;
}

.counter-item {
   position: relative;
   text-align: center;
}

.counter-item + .counter-item::before {
   content: "";
   position: absolute;
   top: 8%;
   left: 0;
   width: 1px;
   height: 84%;
   background-color: rgba(255, 255, 255, 0.28);
}

.counter-item strong {
   display: block;
   font-family: var(--font-heading);
   font-size: 1.8rem;
   font-weight: var(--font-weight-extrabold);
   line-height: 1;
   color: var(--color-white);
}

.counter-item span {
   display: block;
   margin-top: 0.35rem;
   font-weight: var(--font-weight-semibold);
   text-transform: uppercase;
   color: rgba(255, 255, 255, 0.68);
}

@media (max-width: 991.98px) {
   .counter {
      min-height: auto;
      text-align: center;
   }

   .counter-label { text-align: center; }
}

@media (max-width: 575.98px) {
   .counter-item strong { font-size: 1.5rem; }
}


/* INTRO
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

.intro-section {
   position: relative;
   padding: 5rem 0 8rem;
   overflow: hidden;
   background-color: var(--color-white);
}

.intro-section::before {
   content: "";
   position: absolute;
   left: 0;
   bottom: 0;
   z-index: 0;
   width: 100%;
   height: 230px;
   background: url('../../images/website/intro-skyline.png') center bottom / 100% auto no-repeat;
   opacity: 0.38;
   pointer-events: none;

   -webkit-mask-image: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.25) 18%, #000 55%, #000 100%);
   mask-image: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.25) 18%, #000 55%, #000 100%);
}

.intro-section::after {
   content: "";
   position: absolute;
   left: -5%;
   bottom: -115px;
   z-index: 1;
   width: 110%;
   height: 170px;
   border-radius: 50% 50% 0 0 / 100% 100% 0 0;
   background-color: var(--color-white);
   pointer-events: none;
}

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

@media (max-width: 991.98px) {
   .intro-section { padding: 4rem 0 7rem; }

   .intro-section::before {
      height: 200px;
      background-size: auto 200px;
      opacity: 0.32;
   }

   .intro-section::after {
      bottom: -125px;
      height: 165px;
   }
}

@media (max-width: 575.98px) {
   .intro-section { padding: 3.5rem 0 6rem; }

   .intro-section::before {
      height: 165px;
      background-position: 65% bottom;
      background-size: auto 165px;
      opacity: 0.28;
   }

   .intro-section::after {
      bottom: -125px;
      height: 155px;
   }
}


/* INTRO FEATURES
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

.intro-feature-icon {
   display: flex;
   align-items: center;
   justify-content: center;
   margin-bottom: 1rem;
   color: var(--color-teal);
   font-size: 3rem;
}

.intro-feature h5 { margin: 0; color: var(--color-primary); }

@media (max-width: 575.98px) {
   .intro-feature-icon { font-size: 2.5rem; }
}


/* ORGANISER MESSAGES
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

.messages-section {
   padding: 5rem 0 6rem;
   background-color: var(--color-white);
}

@media (max-width: 991.98px) {
   .messages-section { padding: 4rem 0 5rem; }
}

@media (max-width: 575.98px) {
   .messages-section { padding: 3.5rem 0 4rem; }
}


/* MESSAGE CARD
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

.message-card {
   position: relative;
   min-height: 365px;
   margin-bottom: 72px;
   padding: 2rem 2rem 5rem;
   overflow: visible;
   border-radius: 1.5rem 1.5rem 1.5rem 3.5rem;
   color: var(--color-text);
   transition: color var(--transition-normal), border-color var(--transition-normal), box-shadow var(--transition-normal), transform var(--transition-normal);
}

.message-card::before {
   content: "";
   position: absolute;
   top: 0;
   right: 0;
   width: 110px;
   height: 100%;
   border-radius: 0 1.5rem 1.5rem 0;
   opacity: 0.08;
   background-image: radial-gradient(circle, var(--color-primary) 2px, transparent 2px);
   background-size: 14px 14px;
   pointer-events: none;
}

.message-card:hover {
   color: var(--color-white);
   border-color: transparent;
   background: linear-gradient(135deg, var(--color-primary-deep) 0%, var(--color-primary) 55%, #a621d8 100%);
   box-shadow: 0 18px 42px rgba(23, 25, 71, 0.18);
   transform: translateY(-6px);
}

.message-card:hover::before {
   opacity: 0.14;
   background-image: radial-gradient(circle, var(--color-white) 2px, transparent 2px);
}

.message-content {
   position: relative;
   z-index: 1;
}

.message-name {
   margin-bottom: 0.25rem;
   color: var(--color-text-dark);
   transition: color var(--transition-normal);
}

.message-title {
   color: var(--color-text);
   transition: color var(--transition-normal);
}

.message-organisation {
   margin-bottom: 1.75rem;
   color: var(--color-text-muted);
   transition: color var(--transition-normal);
}

.message-card:hover .message-name,
.message-card:hover .message-title { color: var(--color-white); }

.message-card:hover .message-organisation { color: rgba(255, 255, 255, 0.75); }

@media (max-width: 575.98px) {
   .message-card {
      min-height: 350px;
      margin-bottom: 62px;
      padding: 1.75rem 1.5rem 4.5rem;
   }
}


/* MESSAGE EXCERPT & QUOTE
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

.message-excerpt {
   position: relative;
   z-index: 1;
   line-height: 1.8;
}

.message-excerpt::after {
   content: "";
   display: table;
   clear: both;
}

.message-excerpt p { margin: 0; }

.message-quote {
   float: right;
   margin: 0.15rem 0 0.4rem 1rem;
   color: var(--color-primary);
   font-size: 2.75rem;
   line-height: 1;
   transition: color var(--transition-normal), transform var(--transition-normal);
}

.message-card:hover .message-quote {
   color: rgba(255, 255, 255, 0.9);
   transform: scale(1.08);
}

@media (max-width: 575.98px) {
   .message-quote {
      margin-left: 0.75rem;
      font-size: 2.4rem;
   }
}


/* MESSAGE PHOTO
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

.message-photo {
   position: absolute;
   left: 2rem;
   bottom: -72px;
   z-index: 3;
   width: 145px;
   height: 145px;
   padding: 5px;
   border-radius: 50%;
   background-color: var(--color-white);
   box-shadow: 0 10px 24px rgba(23, 25, 71, 0.14);
   transition: background-color var(--transition-normal);
}

.message-photo img {
   width: 100%;
   height: 100%;
   border-radius: 50%;
   object-fit: cover;
}

.message-card:hover .message-photo { background-color: var(--color-accent); }

@media (max-width: 575.98px) {
   .message-photo {
      left: 1.5rem;
      bottom: -62px;
      width: 125px;
      height: 125px;
   }
}


/* MESSAGE LINK
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

.message-link {
   position: absolute;
   right: 1.75rem;
   bottom: 1.5rem;
   z-index: 3;
   display: flex;
   align-items: center;
   justify-content: center;
   width: 46px;
   height: 46px;
   padding: 0;
   border: 0;
   border-radius: 50%;
   color: var(--color-white);
   background-color: var(--color-primary);
   box-shadow: 0 6px 16px rgba(23, 25, 71, 0.18);
   cursor: pointer;
   transition: color var(--transition-normal), background-color var(--transition-normal), transform var(--transition-normal);
}

.message-link:hover {
   color: var(--color-white);
   background-color: var(--color-secondary);
   transform: translateX(3px);
}

.message-card:hover .message-link {
   color: var(--color-primary);
   background-color: var(--color-white);
}

.message-card:hover .message-link:hover {
   color: var(--color-white);
   background-color: var(--color-secondary);
}

@media (max-width: 575.98px) {
   .message-link {
      right: 1.5rem;
      width: 42px;
      height: 42px;
   }
}


/* MESSAGE MODAL
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

.message-modal-photo {
   flex: 0 0 auto;
   width: 120px;
   height: 120px;
   object-fit: cover;
   box-shadow: 0 6px 18px rgba(23, 25, 71, 0.12);
}

@media (max-width: 575.98px) {
   .message-modal-photo {
      width: 88px;
      height: 88px;
   }
}


/* IMPORTANT DATES
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

.dates-section {
   position: relative;
   padding: 4.5rem 0;
   overflow: hidden;
   color: var(--color-white);
   background: linear-gradient(135deg, var(--color-primary-deep), var(--color-primary));
}

.dates-section::before, .dates-section::after {
   content: "";
   position: absolute;
   width: 280px;
   height: 280px;
   border: 1px solid rgba(255, 255, 255, 0.07);
   border-radius: 50%;
   pointer-events: none;
}

.dates-section::before { top: -150px; left: -100px; }
.dates-section::after { right: -120px; bottom: -170px; }

.dates-section .container { position: relative; z-index: 1; }
.dates-section .section-title { margin-bottom: 1rem; color: var(--color-white); }
.dates-section p { color: rgba(255, 255, 255, 0.68); }

@media (max-width: 991.98px) {
   .dates-section { padding: 4rem 0; }
}

@media (max-width: 575.98px) {
   .dates-section { padding: 3.5rem 0; }
}


/* DATE ITEMS
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

.dates-list {
   --date-icon-size: 72px;
   position: relative;
}

.dates-list::before {
   content: "";
   position: absolute;
   top: calc(var(--date-icon-size) / 2);
   left: 16.6667%;
   right: 16.6667%;
   z-index: 0;
   height: 1px;
   background-color: rgba(255, 255, 255, 0.35);
   transform: translateY(-50%);
}

.dates-list > [class*="col-"] { position: relative; }

.dates-list > [class*="col-"]:not(:last-child)::after {
   content: "";
   position: absolute;
   top: calc(var(--date-icon-size) / 2);
   right: -4px;
   z-index: 2;
   width: 8px;
   height: 8px;
   border: 2px solid rgba(255, 255, 255, 0.45);
   border-radius: 50%;
   background-color: var(--color-white);
   transform: translateY(-50%);
}

.date-item {
   position: relative;
   z-index: 1;
   height: 100%;
   text-align: center;
}

.date-icon {
   position: relative;
   z-index: 2;
   display: flex;
   align-items: center;
   justify-content: center;
   width: var(--date-icon-size);
   height: var(--date-icon-size);
   margin: 0 auto 1.25rem;
   border: 4px solid rgba(255, 255, 255, 0.16);
   border-radius: 50%;
   color: var(--color-primary);
   background-color: var(--color-white);
   font-size: 1.6rem;
   box-shadow: 0 10px 28px rgba(0, 0, 0, 0.18);
}

.date-value {
   margin-bottom: 0.4rem;
   font-weight: var(--font-weight-bold);
   color: var(--color-accent-light);
}

.date-item h5 {
   margin: 0 auto;
   color: var(--color-white);
}

@media (max-width: 767.98px) {
   .dates-list::before, .dates-list > [class*="col-"]::after { display: none; }
   .date-item { padding: 0.5rem 0 1rem; }
}












/* VENUE & CONTACT
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

.venue-section {
   position: relative;
   padding: 5rem 0;
   overflow: hidden;
   background-color: var(--color-white);
}

.venue-subtitle {
   margin-bottom: 1.25rem;
   color: var(--color-primary);
}

.venue-address {
   display: flex;
   align-items: flex-start;
   gap: 0.75rem;
   margin-top: 1.5rem;
   font-weight: var(--font-weight-semibold);
   color: var(--color-primary-deep);
}

.venue-address i {
   margin-top: 0.25rem;
   color: var(--color-secondary);
}

@media (max-width: 991.98px) {
   .venue-section { padding: 4rem 0; }
}

@media (max-width: 575.98px) {
   .venue-section { padding: 3.5rem 0; }
}


/* VENUE IMAGE
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

.venue-image {
   overflow: hidden;
   border-radius: 1.25rem;
   box-shadow: 0 16px 38px rgba(23, 25, 71, 0.14);
}

.venue-image img {
   display: block;
   width: 100%;
   aspect-ratio: 4 / 4;
   object-fit: cover;
}


/* VENUE CONTACT
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

.venue-contact {
   padding-left: 0.5rem;
}

.venue-contact h4 {
   margin-bottom: 0.75rem;
   color: var(--color-primary-deep);
}

.venue-contact > p {
   margin-bottom: 1.75rem;
   color: var(--color-text-muted);
}

.venue-contact-item {
   display: flex;
   align-items: flex-start;
   gap: 0.85rem;
   margin-bottom: 1.35rem;
   color: var(--color-primary-deep);
   text-decoration: none;
}

.venue-contact-item:hover { color: var(--color-primary); }

.venue-contact-icon {
   display: flex;
   align-items: center;
   justify-content: center;
   flex: 0 0 38px;
   width: 38px;
   height: 38px;
   border-radius: 50%;
   color: var(--color-white);
   background-color: var(--color-primary);
}

.venue-contact-item span:last-child {
   min-width: 0;
   font-weight: var(--font-weight-semibold);
}

.venue-contact-item small {
   display: block;
   margin-bottom: 0.15rem;
   font-weight: var(--font-weight-regular);
   color: var(--color-text-muted);
}

@media (max-width: 991.98px) {
   .venue-contact { padding-left: 0; }
}
