/* Template: Corso - Free Training Course Landing Page Template
   Author: Inovatik
   Created: Nov 2019
   Description: Master CSS file
*/

/*****************************************
Table Of Contents:

01. General Styles
02. Preloader
03. Navigation
04. Header
05. Registration
06. Partners
07. Instructor
08. Description
09. Students
10. Details Lightbox
11. Video
12. Takeaways
13. Testimonials
14. Date
15. Newsletter
16. Contact
17. Footer
18. Copyright
19. Back To Top Button
20. Extra Pages
21. Media Queries
******************************************/

/*****************************************
Colors:
- Backgrounds - light gray #fbf9f5
- Backgrounds, buttons - yellow #ffbd50
- Headings text, navbar links - black #333
- Body text - dark gray #555
******************************************/


/******************************/
/*     01. General Styles     */
/******************************/

:root {

  /* Brand Colors */
  --primary-blue: #0B5ED7;
  --primary-blue-dark: #083B8C;

  --gold: #D4A017;
  --gold-light: #E8C34D;

  --navy: #12213A;

  --text-dark: #2C2C2C;
  --text-body: #5F6B7A;

  --white: #FFFFFF;
  --light-bg: #F7F9FC;
  --border: #E5E7EB;

  /* Shadows */
  --shadow-sm: 0 4px 12px rgba(0,0,0,.04);
  --shadow-md: 0 10px 30px rgba(0,0,0,.08);
  --shadow-lg: 0 20px 60px rgba(0,0,0,.12);

  /* Radius */
  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-xl: 32px;

  /* Animation */
  --transition: all .35s ease;
}


/******************************/
/*     Base Layout            */
/******************************/

html {
  width: 100%;
  height: 100%;
  scroll-behavior: smooth;
}

body {
  width: 100%;
  min-height: 100%;

  overflow-x: hidden;

  background: var(--white);

  color: var(--text-body);

  font-family: 'Inter', sans-serif;
  font-size: 1rem;
  line-height: 1.8;

  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}


/******************************/
/*       Typography           */
/******************************/

h1,
h2,
h3,
h4,
h5,
h6 {
  color: var(--navy);

  font-weight: 700;

  line-height: 1.2;

  letter-spacing: -.03em;

  margin-bottom: 1rem;
}

h1 {
  font-size: clamp(2.8rem, 6vw, 5rem);
  font-weight: 800;
}

h2 {
  font-size: clamp(2rem, 5vw, 3.5rem);
}

h3 {
  font-size: 1.85rem;
}

h4 {
  font-size: 1.35rem;
}

h5 {
  font-size: 1.1rem;
}

h6 {
  font-size: 1rem;
}

p {
  color: var(--text-body);
  margin-bottom: 1rem;
}

.p-large {
  font-size: 1.15rem;
  line-height: 1.9;
}

.p-small {
  font-size: .875rem;
  line-height: 1.7;
}

.p-heading {
  max-width: 760px;
  margin: 0 auto 4rem;
}

.white {
  color: #fff;
}

.text-gold {
  color: var(--gold);
}

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


/******************************/
/*         Lists              */
/******************************/

.li-space-lg li {
  margin-bottom: 1rem;
}

.indent {
  padding-left: 1.5rem;
}


/******************************/
/*           Links            */
/******************************/

a {
  color: var(--primary-blue);
  text-decoration: none;
  transition: var(--transition);
}

a:hover {
  color: var(--primary-blue-dark);
  text-decoration: none;
}


/******************************/
/*        Section Spacing     */
/******************************/

.section-padding {
  padding: 100px 0;
}

.section-padding-sm {
  padding: 70px 0;
}

.bg-light-section {
  background: var(--light-bg);
}


/******************************/
/*          Buttons           */
/******************************/

.btn-solid-reg,
.btn-solid-lg,
.btn-outline-reg,
.btn-outline-lg,
.btn-outline-sm {

  display: inline-flex;
  align-items: center;
  justify-content: center;

  gap: .5rem;

  text-decoration: none;

  font-weight: 700;

  transition: var(--transition);

  cursor: pointer;
}

.btn-solid-reg,
.btn-outline-reg {
  padding: 14px 28px;
}

.btn-solid-lg,
.btn-outline-lg {
  padding: 18px 36px;
}

.btn-outline-sm {
  padding: 10px 22px;
}


/******************************/
/*       Primary Button       */
/******************************/

.btn-solid-reg,
.btn-solid-lg {

  background: var(--gold);

  color: var(--navy);

  border: 2px solid var(--gold);

  border-radius: 999px;

  box-shadow: var(--shadow-sm);
}

.btn-solid-reg:hover,
.btn-solid-lg:hover {

  background: var(--gold-light);

  border-color: var(--gold-light);

  color: var(--navy);

  transform: translateY(-3px);

  box-shadow: var(--shadow-md);
}


/******************************/
/*      Outline Button        */
/******************************/

.btn-outline-reg,
.btn-outline-lg,
.btn-outline-sm {

  background: transparent;

  color: var(--navy);

  border: 2px solid var(--navy);

  border-radius: 999px;
}

.btn-outline-reg:hover,
.btn-outline-lg:hover,
.btn-outline-sm:hover {

  background: var(--primary-blue);

  border-color: var(--primary-blue);

  color: #fff;

  transform: translateY(-3px);
}


/******************************/
/*          Forms             */
/******************************/

.form-group {
  position: relative;
  margin-bottom: 1.5rem;
}

.label-control {

  position: absolute;

  top: 1rem;
  left: 1.25rem;

  color: var(--text-body);

  font-size: .875rem;

  pointer-events: none;

  transition: var(--transition);
}

.form-control-input,
.form-control-select,
.form-control-textarea {

  width: 100%;

  border: 1px solid var(--border);

  border-radius: 16px;

  background: #fff;

  color: var(--text-dark);

  transition: var(--transition);

  box-shadow: none;
}

.form-control-input,
.form-control-select {

  height: 60px;

  padding: 20px 20px 0;
}

.form-control-textarea {

  min-height: 180px;

  padding: 24px 20px;
}

.form-control-input:hover,
.form-control-select:hover,
.form-control-textarea:hover {

  border-color: var(--primary-blue);
}

.form-control-input:focus,
.form-control-select:focus,
.form-control-textarea:focus {

  outline: none;

  border-color: var(--primary-blue);

  box-shadow: 0 0 0 4px rgba(11,94,215,.12);
}

.form-control-input:focus + .label-control,
.form-control-input.notEmpty + .label-control,
.form-control-textarea:focus + .label-control,
.form-control-textarea.notEmpty + .label-control {

  top: 8px;

  font-size: .72rem;

  font-weight: 700;

  color: var(--primary-blue);
}


/******************************/
/*      Select Styling        */
/******************************/

select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;

  background-position: 96% center;
  background-repeat: no-repeat;
}

select::-ms-expand {
  display: none;
}


/******************************/
/*        Checkbox            */
/******************************/

.checkbox {
  font-size: .875rem;
  line-height: 1.8;
}

input[type='checkbox'] {
  margin-right: .5rem;
}


/******************************/
/*     Submit Buttons         */
/******************************/

.form-control-submit-button {

  width: 100%;
  height: 60px;

  border: none;

  border-radius: 999px;

  background: var(--gold);

  color: var(--navy);

  font-size: .95rem;
  font-weight: 700;

  cursor: pointer;

  transition: var(--transition);

  box-shadow: var(--shadow-sm);
}

.form-control-submit-button:hover {

  background: var(--gold-light);

  transform: translateY(-2px);

  box-shadow: var(--shadow-md);
}


/******************************/
/*       Card Utility         */
/******************************/

.card-modern {

  background: #fff;

  border-radius: 24px;

  box-shadow: var(--shadow-sm);

  transition: var(--transition);
}

.card-modern:hover {

  transform: translateY(-8px);

  box-shadow: var(--shadow-md);
}


/******************************/
/*        Helpers             */
/******************************/

.shadow-sm {
  box-shadow: var(--shadow-sm);
}

.shadow-md {
  box-shadow: var(--shadow-md);
}

.rounded-lg {
  border-radius: var(--radius-lg);
}

.rounded-xl {
  border-radius: var(--radius-xl);
}


/******************************/
/*      Form Messages         */
/******************************/

#rmsgSubmit,
#nmsgSubmit,
#cmsgSubmit,
#pmsgSubmit {

  display: block;

  color: var(--navy);

  font-weight: 700;

  font-size: 1rem;

  margin-top: 1rem;
}

.help-block.with-errors {
  color: #dc2626;
  font-size: .85rem;
}

.help-block.with-errors ul {
  margin-bottom: 0;
}


/*************************/
/*     02. Preloader     */
/*************************/

.spinner-wrapper {

  position: fixed;

  inset: 0;

  z-index: 999999;

  display: flex;
  align-items: center;
  justify-content: center;

  flex-direction: column;

  background: #ffffff;

  transition: opacity .5s ease,
              visibility .5s ease;
}


/* Logo Container */

.preloader-content {

  display: flex;
  flex-direction: column;

  align-items: center;
  justify-content: center;

  text-align: center;
}


/* Logo */

.preloader-logo {

  width: 90px;
  height: 90px;

  object-fit: contain;

  margin-bottom: 1.5rem;

  animation: logoFloat 3s ease-in-out infinite;
}


/* Brand Name */

.preloader-title {

  color: var(--navy);

  font-size: 1.2rem;

  font-weight: 700;

  letter-spacing: -.02em;

  margin-bottom: .4rem;
}


/* Tagline */

.preloader-subtitle {

  color: var(--text-body);

  font-size: .85rem;

  margin-bottom: 1.5rem;
}


/* Loading Bar */

.preloader-progress {

  width: 180px;
  height: 4px;

  overflow: hidden;

  border-radius: 50px;

  background: #e9eef5;

  position: relative;
}

.preloader-progress::after {

  content: '';

  position: absolute;

  top: 0;
  left: -40%;

  width: 40%;
  height: 100%;

  border-radius: 50px;

  background: linear-gradient(
    90deg,
    var(--gold),
    var(--primary-blue)
  );

  animation: loadingBar 1.5s infinite;
}


/*************************/
/*      Animations       */
/*************************/

@keyframes logoFloat {

  0% {
    transform: translateY(0px);
  }

  50% {
    transform: translateY(-8px);
  }

  100% {
    transform: translateY(0px);
  }
}

@keyframes loadingBar {

  0% {
    left: -40%;
  }

  100% {
    left: 100%;
  }
}

/**************************/
/*     03. Navigation     */
/**************************/

/* ========================================
   MODERN NAVBAR
======================================== */

.navbar-custom {
    padding: 20px 40px;
    background: transparent;
    transition: all .35s ease;
    z-index: 9999;
}

.navbar-custom.top-nav-collapse {
    padding: 12px 40px;

    background: rgba(255,255,255,0.98);

    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);

    box-shadow: 0 10px 40px rgba(0,0,0,.08);
}

.navbar-custom .navbar-brand img {
    height: 60px;
    width: auto;
}

.navbar-custom .nav-link {

    font-size: 14px;
    font-weight: 600;
    letter-spacing: .5px;
    text-transform: uppercase;

    position: relative;

    transition: all .3s ease;
}

.navbar-custom.top-nav-collapse .nav-link {
    color: #1a1a1a !important;
}

.navbar-custom .nav-link:hover {
    color: #ffbd50 !important;
}

.navbar-custom .nav-link::after {
    content: '';

    position: absolute;
    left: 50%;
    bottom: -5px;

    width: 0;
    height: 2px;

    background: #ffbd50;

    transform: translateX(-50%);

    transition: .3s ease;
}

.navbar-custom .nav-link:hover::after,
.navbar-custom .nav-link.active::after {
    width: 70%;
}

.btn-submit-event {
    display: inline-block;

    padding: 12px 24px;

    background: #ffbd50;
    color: #333 !important;

    border-radius: 50px;

    font-weight: 700;
    text-transform: uppercase;
    font-size: 13px;

    text-decoration: none;

    transition: all .3s ease;
}

.btn-submit-event:hover {
    transform: translateY(-3px);

    box-shadow: 0 12px 30px rgba(255,189,80,.4);

    text-decoration: none;
    color: #333 !important;
}

.navbar-custom {

  background: transparent;

  backdrop-filter: none;
  -webkit-backdrop-filter: none;

  border-bottom: none;

  box-shadow: none;

  padding: 1.5rem 2rem;

  transition: all .35s ease;

  z-index: 9999;
}


/* Sticky State */

.navbar-custom.top-nav-collapse {

  background: rgba(255,255,255,0.98);

  box-shadow: 0 12px 40px rgba(0,0,0,0.08);

  padding: .8rem 2rem;
}


/**************************/
/*        Logo            */
/**************************/

.navbar-custom .navbar-brand {

  display: flex;
  align-items: center;
}

.navbar-custom .navbar-brand.logo-image img {

  height: 55px;
  width: auto;

  transition: all .3s ease;
}

.navbar-custom.top-nav-collapse .navbar-brand.logo-image img {

  height: 48px;
}


/**************************/
/*       Navigation       */
/**************************/

.navbar-custom .navbar-nav {

  align-items: center;
}

.navbar-custom .nav-item {

  margin-left: .5rem;
  margin-right: .5rem;
}

.navbar-custom .nav-item .nav-link {

  position: relative;

  color: #fff;

  font-size: .9rem;

  font-weight: 600;

  letter-spacing: .04em;

  text-transform: uppercase;

  text-decoration: none;

  padding: .75rem 1rem;

  transition: all .3s ease;
}


/* Hover */

.navbar-custom .nav-item .nav-link:hover {

  color: #d4a72c;
}


/* Active */

.navbar-custom .nav-item .nav-link.active {

  color: #d4a72c;
}


/* Animated underline */

.navbar-custom .nav-item .nav-link::after {

  content: '';

  position: absolute;

  left: 50%;
  bottom: 0;

  width: 0;
  height: 2px;

  background: #d4a72c;

  transform: translateX(-50%);

  transition: all .3s ease;
}

.navbar-custom .nav-item .nav-link:hover::after,
.navbar-custom .nav-item .nav-link.active::after {

  width: 60%;
}


/**************************/
/*      CTA Button        */
/**************************/

.navbar-custom .nav-register {

  background: #d4a72c;

  color: #ffffff !important;

  border-radius: 40px;

  padding: .85rem 1.5rem !important;

  margin-left: 1rem;

  transition: all .3s ease;
}

.navbar-custom .nav-register:hover {

  background: #0f2747;

  color: #ffffff !important;

  transform: translateY(-2px);
}

.navbar-custom .nav-register::after {

  display: none;
}


/**************************/
/*      Dropdown          */
/**************************/

.navbar-custom .dropdown-menu {

  border: none;

  border-radius: 16px;

  padding: .75rem;

  background: #ffffff;

  box-shadow: 0 15px 40px rgba(0,0,0,0.08);

  margin-top: .75rem;
}

.navbar-custom .dropdown-item {

  padding: .75rem 1rem;

  border-radius: 10px;

  color: #0f2747;

  font-weight: 500;

  transition: all .3s ease;
}

.navbar-custom .dropdown-item:hover {

  background: #f4f7fb;

  color: #d4a72c;
}

.navbar-custom .dropdown-divider {

  margin: .5rem 0;

  background: rgba(0,0,0,0.08);
}


/**************************/
/*      Social Icons      */
/**************************/

.navbar-custom .social-icons {

  display: flex;
  align-items: center;

  margin-left: 1rem;
}

.navbar-custom .fa-stack {

  width: 2.5rem;
  height: 2.5rem;

  margin-left: .25rem;
}

.navbar-custom .fa-stack-2x {

  color: #f4f7fb;

  transition: all .3s ease;
}

.navbar-custom .fa-stack-1x {

  color: #0f2747;

  transition: all .3s ease;
}

.navbar-custom .fa-stack:hover .fa-stack-2x {

  color: #d4a72c;
}

.navbar-custom .fa-stack:hover .fa-stack-1x {

  color: #ffffff;
}


/**************************/
/*    Mobile Toggle       */
/**************************/

.navbar-custom .navbar-toggler {

  border: none;

  padding: 0;

  font-size: 1.8rem;

  color: #0f2747;

  outline: none;
}

.navbar-custom .navbar-toggler:focus {

  outline: none;
  box-shadow: none;
}

.navbar-custom button[aria-expanded='false'] .fa-times {

  display: none;
}

.navbar-custom button[aria-expanded='false'] .fa-bars {

  display: inline-block;
}

.navbar-custom button[aria-expanded='true'] .fa-bars {

  display: none;
}

.navbar-custom button[aria-expanded='true'] .fa-times {

  display: inline-block;
}


/**************************/
/*      Mobile Menu       */
/**************************/

@media (max-width: 991px) {

  .navbar-custom {

    padding: 1rem 1.25rem;

    background: #ffffff;
  }

  .navbar-custom .navbar-collapse {

    margin-top: 1rem;

    padding: 1rem;

    border-radius: 20px;

    background: #ffffff;

    box-shadow: 0 10px 30px rgba(0,0,0,0.06);
  }

  .navbar-custom .nav-item {

    margin: 0;
  }

  .navbar-custom .nav-link {

    padding: .9rem 0;
  }

  .navbar-custom .nav-register {

    margin-top: 1rem;
    margin-left: 0;

    text-align: center;
    display: inline-block;
  }

  .navbar-custom .social-icons {

    margin-top: 1rem;
    margin-left: 0;
  }
}


/*********************/
/*    04. Header     */
/*********************/

.header {

  position: relative;

  min-height: 100vh;

  display: flex;
  align-items: center;
  justify-content: center;

  overflow: hidden;

  padding: 10rem 0 7rem;

  background:
  linear-gradient(
    rgba(8, 25, 52, 0.80),
    rgba(8, 25, 52, 0.85)
  ),
  url('../images/header-background.jpg')
  center center no-repeat;

  background-size: cover;

  text-align: center;
}


/**************************/
/* Background Overlay     */
/**************************/

.header::before {

  content: '';

  position: absolute;

  top: 0;
  left: 0;

  width: 100%;
  height: 100%;

  background:
  radial-gradient(
    circle at top right,
    rgba(212,167,44,0.18),
    transparent 45%
  );

  pointer-events: none;
}


/**************************/
/* Content Container      */
/**************************/

.header .text-container {

  position: relative;

  z-index: 5;

  max-width: 900px;

  margin: 0 auto;
}


/**************************/
/* Kingdom Badge          */
/**************************/

.header-badge {

  display: inline-flex;

  align-items: center;

  gap: .6rem;

  padding: .75rem 1.5rem;

  margin-bottom: 2rem;

  border-radius: 100px;

  background: rgba(255,255,255,0.12);

  border: 1px solid rgba(255,255,255,0.15);

  backdrop-filter: blur(10px);

  color: #ffffff;

  font-size: .85rem;

  font-weight: 600;

  letter-spacing: .08em;

  text-transform: uppercase;
}


/**************************/
/* Heading                */
/**************************/

.header h1 {

  color: #ffffff;

  font-size: clamp(3rem, 6vw, 5.5rem);

  line-height: 1.1;

  font-weight: 700;

  margin-bottom: 1.5rem;
}


/**************************/
/* Highlight Text         */
/**************************/

.header h1 span {

  color: #d4a72c;
}


/**************************/
/* Description            */
/**************************/

.header .p-large {

  max-width: 760px;

  margin: 0 auto 2.5rem;

  color: rgba(255,255,255,0.90);

  font-size: 1.2rem;

  line-height: 1.9rem;
}


/**************************/
/* Buttons                */
/**************************/

.header .hero-buttons {

  display: flex;

  justify-content: center;

  flex-wrap: wrap;

  gap: 1rem;

  margin-bottom: 4rem;
}


.header .btn-solid-lg {

  background: #d4a72c;

  border-color: #d4a72c;

  color: #ffffff;

  min-width: 220px;
}

.header .btn-solid-lg:hover {

  background: transparent;

  border-color: #d4a72c;

  color: #d4a72c;
}


.header .btn-outline-lg {

  border-color: rgba(255,255,255,0.4);

  color: #ffffff;

  min-width: 220px;
}

.header .btn-outline-lg:hover {

  background: #ffffff;

  color: #0f2747;
}


/**************************/
/* Stats Section          */
/**************************/

.header-stats {

  display: flex;

  justify-content: center;

  flex-wrap: wrap;

  gap: 2rem;

  margin-top: 3rem;
}

.header-stat {

  min-width: 180px;
}

.header-stat h3 {

  margin-bottom: .25rem;

  color: #d4a72c;

  font-size: 2rem;
}

.header-stat p {

  margin: 0;

  color: rgba(255,255,255,0.8);

  font-size: .9rem;
}


/**************************/
/* Scroll Indicator       */
/**************************/

.scroll-indicator {

  position: absolute;

  bottom: 30px;

  left: 50%;

  transform: translateX(-50%);

  color: rgba(255,255,255,0.7);

  font-size: .8rem;

  letter-spacing: .15em;

  text-transform: uppercase;
}


/**************************/
/* Remove Old Elements    */
/**************************/

.header .countdown,
.header .outer-container,
.header .slider-container,
.header .swiper-container,
.header .swiper-button-prev,
.header .swiper-button-next {

  display: none !important;
}


/**************************/
/* Mobile                 */
/**************************/

@media (max-width: 768px) {

  .header {

    min-height: auto;

    padding: 8rem 1.5rem 5rem;
  }

  .header h1 {

    font-size: 2.8rem;
  }

  .header .p-large {

    font-size: 1rem;
    line-height: 1.7rem;
  }

  .header-stats {

    gap: 1.5rem;
  }

  .header-stat {

    min-width: 130px;
  }
}


/****************************/
/*     05. Submit Event     */
/****************************/

.form-1 {

  position: relative;

  padding: 8rem 0;

  background: #f7f9fc;

  overflow: hidden;
}


/**************************/
/* Background Accent      */
/**************************/

.form-1::before {

  content: '';

  position: absolute;

  top: -200px;
  right: -200px;

  width: 500px;
  height: 500px;

  border-radius: 50%;

  background:
  radial-gradient(
    rgba(212,167,44,0.08),
    transparent 70%
  );

  pointer-events: none;
}


/**************************/
/* Content Side           */
/**************************/

.form-1 .text-container {

  padding-right: 2rem;
}

.form-1 h2 {

  margin-bottom: 1.5rem;

  color: #0f2747;

  font-size: 2.5rem;
}

.form-1 p {

  color: #5b6675;

  margin-bottom: 1.75rem;

  line-height: 1.9rem;
}


/**************************/
/* Benefits List          */
/**************************/

.form-1 .list-unstyled {

  margin-top: 2rem;
}

.form-1 .list-unstyled li {

  display: flex;

  align-items: flex-start;

  margin-bottom: 1.25rem;
}

.form-1 .list-unstyled .fas {

  color: #d4a72c;

  font-size: .9rem;

  margin-top: .45rem;

  margin-right: 1rem;
}

.form-1 .list-unstyled .media-body {

  color: #4f5a69;

  line-height: 1.8rem;
}


/**************************/
/* Form Card             */
/**************************/

.form-1 .form-container {

  background: #ffffff;

  border-radius: 24px;

  padding: 2.5rem;

  box-shadow:
  0 10px 40px rgba(15,39,71,0.08);

  border: 1px solid rgba(15,39,71,0.05);
}


/**************************/
/* Form Inputs           */
/**************************/

.form-1 .form-control-input,
.form-1 .form-control-select,
.form-1 .form-control-textarea {

  border: 1px solid #dbe3ee;

  background: #ffffff;

  border-radius: 14px;

  transition: all .3s ease;
}

.form-1 .form-control-input:hover,
.form-1 .form-control-select:hover,
.form-1 .form-control-textarea:hover {

  border-color: #d4a72c;
}

.form-1 .form-control-input:focus,
.form-1 .form-control-select:focus,
.form-1 .form-control-textarea:focus {

  border-color: #0f2747;

  box-shadow:
  0 0 0 4px rgba(15,39,71,0.08);
}


/**************************/
/* Labels                */
/**************************/

.form-1 .label-control {

  color: #6c7683;
}


/**************************/
/* Checkbox              */
/**************************/

.form-1 .checkbox {

  color: #5b6675;

  line-height: 1.6rem;
}

.form-1 .checkbox a {

  color: #0f2747;

  font-weight: 600;

  text-decoration: none;
}

.form-1 .checkbox a:hover {

  color: #d4a72c;
}


/**************************/
/* Submit Button         */
/**************************/

.form-1 .form-control-submit-button {

  height: 56px;

  border: none;

  border-radius: 50px;

  background: #0f2747;

  color: #ffffff;

  font-weight: 600;

  letter-spacing: .03em;

  transition: all .3s ease;
}

.form-1 .form-control-submit-button:hover {

  background: #d4a72c;

  color: #ffffff;

  transform: translateY(-2px);
}


/**************************/
/* Form Messages         */
/**************************/

.form-1 .help-block,
.form-1 .checkbox,
.form-1 .checkbox a {

  color: #5b6675;
}


/**************************/
/* Mobile                */
/**************************/

@media (max-width: 991px) {

  .form-1 {

    padding: 5rem 0;
  }

  .form-1 .text-container {

    padding-right: 0;

    margin-bottom: 3rem;
  }

  .form-1 .form-container {

    padding: 2rem;
  }

  .form-1 h2 {

    font-size: 2rem;
  }
}


/************************/
/*     06. Partners     */
/************************/

.slider-1 {

  padding: 5rem 0;

  background: #ffffff;

  text-align: center;
}

.slider-1 .p-small {

  color: #0f2747;

  font-weight: 700;

  letter-spacing: .12em;

  text-transform: uppercase;

  margin-bottom: 1rem;
}

.slider-1 h2 {

  color: #0f2747;

  margin-bottom: 3rem;
}

.slider-1 .slider-container {

  margin: 0 auto;

  max-width: 1200px;
}

.slider-1 .swiper-slide {

  display: flex;

  align-items: center;

  justify-content: center;

  padding: 1.5rem;
}

.slider-1 .swiper-slide img {

  max-height: 80px;

  opacity: .75;

  transition: all .3s ease;

  filter: grayscale(100%);
}

.slider-1 .swiper-slide img:hover {

  opacity: 1;

  filter: grayscale(0%);
  transform: scale(1.05);
}


/**************************/
/*     07. About ZNN      */
/**************************/

.basic-1 {

  padding: 7rem 0;

  background: #f7f9fc;
}

.basic-1 img {

  width: 100%;

  border-radius: 24px;

  box-shadow:
  0 20px 60px rgba(15,39,71,0.08);
}

.basic-1 .text-container {

  padding-left: 2rem;
}

.basic-1 h2 {

  color: #0f2747;

  margin-bottom: 1.5rem;

  font-size: 2.5rem;
}

.basic-1 p {

  color: #5b6675;

  line-height: 1.9rem;

  margin-bottom: 1.5rem;
}


/***************************/
/*     08. Why ZNN         */
/***************************/

.basic-2 {

  padding: 7rem 0;

  background: #ffffff;
}

.basic-2 h2 {

  text-align: center;

  margin-bottom: 4rem;

  color: #0f2747;
}

.basic-2 .media {

  margin-bottom: 2rem;

  padding: 1.75rem;

  background: #f7f9fc;

  border-radius: 20px;

  transition: all .3s ease;
}

.basic-2 .media:hover {

  transform: translateY(-5px);

  box-shadow:
  0 15px 40px rgba(15,39,71,0.08);
}

.basic-2 .list-unstyled .bullet {

  width: 50px;

  height: 50px;

  min-width: 50px;

  border-radius: 50%;

  background: #d4a72c;

  color: #ffffff;

  font-size: 1rem;

  font-weight: 700;

  line-height: 50px;

  text-align: center;

  margin-right: 1rem;
}

.basic-2 h4 {

  color: #0f2747;

  margin-bottom: .5rem;
}

.basic-2 p {

  color: #5b6675;

  margin-bottom: 0;
}


/************************/
/* 09. Community       */
/************************/

.basic-3 {

  padding: 7rem 0;

  background: #f7f9fc;
}

.basic-3 .text-container {

  margin-bottom: 0;
}

.basic-3 h2 {

  color: #0f2747;

  margin-bottom: 1.5rem;
}

.basic-3 p {

  color: #5b6675;

  line-height: 1.9rem;

  margin-bottom: 1.5rem;
}

.basic-3 img {

  width: 100%;

  border-radius: 24px;

  box-shadow:
  0 20px 60px rgba(15,39,71,0.08);
}

.basic-3 .btn-solid-reg {

  background: #0f2747;

  border-color: #0f2747;

  color: #ffffff;
}

.basic-3 .btn-solid-reg:hover {

  background: #d4a72c;

  border-color: #d4a72c;

  color: #ffffff;
}


/************************/
/* Mobile Optimization  */
/************************/

@media (max-width: 991px) {

  .basic-1,
  .basic-2,
  .basic-3 {

    padding: 5rem 0;
  }

  .basic-1 .text-container {

    padding-left: 0;

    margin-top: 2rem;
  }

  .basic-2 h2 {

    margin-bottom: 3rem;
  }

  .basic-2 .media {

    padding: 1.5rem;
  }
}


/********************************/
/* 10. Featured Event Modal     */
/********************************/

.lightbox-basic {

  max-width: 1100px;

  margin: 2rem auto;

  padding: 2.5rem;

  border-radius: 24px;

  background: #ffffff;

  box-shadow:
  0 25px 80px rgba(15,39,71,0.15);

  text-align: left;
}

.lightbox-basic .container {

  padding: 0;
}

.lightbox-basic .image-container {

  max-width: 100%;

  margin-bottom: 0;
}

.lightbox-basic .image-container img {

  width: 100%;

  border-radius: 20px;
}

.lightbox-basic h3 {

  color: #0f2747;

  font-size: 2rem;

  margin-bottom: .5rem;
}

.lightbox-basic h4 {

  color: #d4a72c;

  margin-bottom: 1.25rem;

  font-size: 1rem;

  text-transform: uppercase;

  letter-spacing: .08em;
}

.lightbox-basic hr {

  width: 80px;

  height: 3px;

  border: 0;

  margin: 1rem 0 1.5rem;

  background: #d4a72c;
}

.lightbox-basic p {

  color: #5b6675;

  line-height: 1.9rem;
}

.lightbox-basic .list-unstyled li {

  margin-bottom: 1rem;
}

.lightbox-basic .list-unstyled .fas {

  color: #d4a72c;

  font-size: .85rem;

  margin-top: .45rem;
}

.lightbox-basic .media-body {

  color: #5b6675;
}


/**************************/
/* Modal Buttons          */
/**************************/

.lightbox-basic .btn-solid-reg {

  background: #0f2747;

  border-color: #0f2747;

  color: #ffffff;

  border-radius: 50px;
}

.lightbox-basic .btn-solid-reg:hover {

  background: #d4a72c;

  border-color: #d4a72c;
}

.lightbox-basic .btn-outline-reg {

  border-color: #0f2747;

  color: #0f2747;

  border-radius: 50px;
}

.lightbox-basic .btn-outline-reg:hover {

  background: #0f2747;

  color: #ffffff;
}


/**************************/
/* Close Button           */
/**************************/

.lightbox-basic button.mfp-close.x-button {

  top: 15px;

  right: 15px;

  width: 45px;

  height: 45px;

  border-radius: 50%;

  background: #f7f9fc;

  color: #0f2747;

  transition: all .3s ease;
}

.lightbox-basic button.mfp-close.x-button:hover {

  background: #d4a72c;

  color: #ffffff;
}


/*********************/
/* 11. Kingdom Media */
/*********************/

.basic-4 {

  padding: 7rem 0;

  background: #ffffff;
}

.basic-4 h2 {

  color: #0f2747;

  text-align: center;

  margin-bottom: 1rem;
}

.basic-4 .section-subtitle {

  max-width: 700px;

  margin: 0 auto 4rem;

  text-align: center;

  color: #5b6675;
}

.basic-4 .image-container {

  margin-bottom: 0;
}

.basic-4 .image-container img {

  width: 100%;

  border-radius: 24px;

  box-shadow:
  0 20px 60px rgba(15,39,71,0.08);
}

.basic-4 .video-wrapper {

  position: relative;

  overflow: hidden;

  border-radius: 24px;
}


/**************************/
/* Play Button            */
/**************************/

.basic-4 .video-play-button {

  position: absolute;

  top: 50%;
  left: 50%;

  transform: translate(-50%, -50%);

  width: 90px;

  height: 90px;

  z-index: 10;
}

.basic-4 .video-play-button:before {

  content: '';

  position: absolute;

  width: 90px;
  height: 90px;

  border-radius: 50%;

  background: rgba(212,167,44,0.25);

  animation: pulse-border 2s infinite;
}

.basic-4 .video-play-button:after {

  content: '';

  position: absolute;

  width: 75px;
  height: 75px;

  border-radius: 50%;

  background: #d4a72c;

  top: 7.5px;
  left: 7.5px;
}

.basic-4 .video-play-button span {

  position: absolute;

  z-index: 11;

  top: 50%;
  left: 50%;

  transform: translate(-40%, -50%);

  width: 0;
  height: 0;

  border-left: 20px solid #ffffff;

  border-top: 12px solid transparent;

  border-bottom: 12px solid transparent;
}


/**************************/
/* Video Hover            */
/**************************/

.basic-4 .video-wrapper:hover img {

  transform: scale(1.03);
}

.basic-4 .video-wrapper img {

  transition: all .5s ease;
}


/**************************/
/* Animation             */
/**************************/

@keyframes pulse-border {

  0% {

    transform: scale(1);

    opacity: 1;
  }

  100% {

    transform: scale(1.6);

    opacity: 0;
  }
}


/**************************/
/* Mobile                 */
/**************************/

@media (max-width: 991px) {

  .lightbox-basic {

    padding: 2rem;
  }

  .basic-4 {

    padding: 5rem 0;
  }

  .basic-4 .video-play-button {

    width: 70px;
    height: 70px;
  }

  .basic-4 .video-play-button:before {

    width: 70px;
    height: 70px;
  }

  .basic-4 .video-play-button:after {

    width: 58px;
    height: 58px;

    top: 6px;
    left: 6px;
  }
}


/*************************/
/* 12. Platform Benefits */
/*************************/

.cards {

  padding: 7rem 0;

  background: #ffffff;
}

.cards h2 {

  text-align: center;

  color: #0f2747;

  margin-bottom: 1rem;
}

.cards .p-heading {

  max-width: 800px;

  margin: 0 auto 4rem;

  text-align: center;

  color: #5b6675;

  line-height: 1.9rem;
}


/**************************/
/* Benefit Cards          */
/**************************/

.cards .card {

  height: 100%;

  border: none;

  border-radius: 24px;

  padding: 2.5rem 2rem;

  background: #f7f9fc;

  text-align: center;

  transition: all .35s ease;

  box-shadow:
  0 8px 30px rgba(15,39,71,0.04);
}

.cards .card:hover {

  transform: translateY(-8px);

  box-shadow:
  0 20px 50px rgba(15,39,71,0.10);
}


/**************************/
/* Icon Circle            */
/**************************/

.cards .card-image {

  width: 90px;

  height: 90px;

  margin: 0 auto 1.5rem;

  border-radius: 50%;

  background: rgba(212,167,44,0.10);

  display: flex;

  align-items: center;

  justify-content: center;
}

.cards .fas,
.cards .far {

  color: #d4a72c;

  font-size: 2rem;

  line-height: 1;
}


/**************************/
/* Card Content           */
/**************************/

.cards .card-title {

  color: #0f2747;

  margin-bottom: 1rem;

  font-size: 1.3rem;
}

.cards .card-body {

  padding: 0;
}

.cards .card-body p {

  color: #5b6675;

  line-height: 1.8rem;

  margin-bottom: 0;
}


/****************************/
/* 13. Kingdom Testimonials */
/****************************/

.slider-2 {

  padding: 7rem 0;

  background: #f7f9fc;
}

.slider-2 h3 {

  text-align: center;

  color: #0f2747;

  margin-bottom: 4rem;

  font-size: 2.3rem;
}


/**************************/
/* Slider Card            */
/**************************/

.slider-2 .swiper-slide {

  background: #ffffff;

  border-radius: 24px;

  padding: 2.5rem;

  box-shadow:
  0 10px 40px rgba(15,39,71,0.05);
}

.slider-2 .swiper-container {

  width: 92%;
}


/**************************/
/* Testimonial Image      */
/**************************/

.slider-2 .image-wrapper {

  width: 90px;

  height: 90px;

  margin: 0 auto 1.5rem;

  overflow: hidden;

  border-radius: 50%;

  border: 4px solid rgba(212,167,44,0.25);
}

.slider-2 .image-wrapper img {

  width: 100%;

  height: 100%;

  object-fit: cover;
}


/**************************/
/* Testimonial Content    */
/**************************/

.slider-2 .testimonial-text {

  color: #5b6675;

  line-height: 1.9rem;

  font-style: italic;

  margin-bottom: 1.25rem;
}

.slider-2 .testimonial-author {

  color: #0f2747;

  font-weight: 700;
}


/**************************/
/* Navigation Arrows      */
/**************************/

.slider-2 .swiper-button-prev,
.slider-2 .swiper-button-next {

  width: 50px;

  height: 50px;

  border-radius: 50%;

  background-color: #ffffff;

  box-shadow:
  0 10px 30px rgba(15,39,71,0.08);
}

.slider-2 .swiper-button-prev:hover,
.slider-2 .swiper-button-next:hover {

  background-color: #d4a72c;
}

.slider-2 .swiper-button-prev {

  left: -20px;
}

.slider-2 .swiper-button-next {

  right: -20px;
}


/**************************/
/* Mobile                 */
/**************************/

@media (max-width: 991px) {

  .cards,
  .slider-2 {

    padding: 5rem 0;
  }

  .cards .card {

    margin-bottom: 2rem;
  }

  .slider-2 .swiper-slide {

    padding: 2rem;
  }

  .slider-2 .swiper-container {

    width: 100%;
  }
}


/********************/
/* 14. FEATURED EVENT */
/********************/

.basic-5 {

  padding: 2rem 0 7rem;

  background: #ffffff;
}

.basic-5 .text-container {

  padding: 6rem 2rem;

  border-radius: 32px;

  background:
  linear-gradient(
    rgba(15,39,71,0.82),
    rgba(15,39,71,0.82)
  ),
  url('../images/featured-event.jpg')
  center center / cover no-repeat;

  text-align: center;

  overflow: hidden;

  box-shadow:
  0 25px 70px rgba(15,39,71,0.15);
}

.basic-5 h2 {

  max-width: 900px;

  margin: 0 auto 1.75rem;

  color: #ffffff;

  font-size: 2.8rem;

  line-height: 1.3;
}

.basic-5 p {

  max-width: 760px;

  margin: 0 auto 2.5rem;

  color: rgba(255,255,255,0.88);

  line-height: 2rem;

  font-size: 1.05rem;
}

.basic-5 .btn-solid-lg {

  background: #d4a72c;

  border-color: #d4a72c;

  color: #0f2747;
}

.basic-5 .btn-solid-lg:hover {

  background: transparent;

  border-color: #ffffff;

  color: #ffffff;
}



/****************************/
/* 15. JOIN THE COMMUNITY   */
/****************************/

.form-2 {

  padding: 7rem 0;

  background: #f7f9fc;
}

.form-2 h3 {

  max-width: 900px;

  margin: 0 auto 3rem;

  text-align: center;

  color: #0f2747;

  font-size: 2.2rem;

  line-height: 1.4;
}

.form-2 form {

  max-width: 700px;

  margin: 0 auto 4rem;
}

.form-2 .form-control-input {

  border: 1px solid #dbe5ef;

  background: #ffffff;
}

.form-2 .form-control-input:focus {

  border-color: #0f4c81;
}

.form-2 .form-control-submit-button {

  border: 2px solid #0f4c81;

  background: #0f4c81;

  color: #ffffff;
}

.form-2 .form-control-submit-button:hover {

  background: #d4a72c;

  border-color: #d4a72c;

  color: #0f2747;
}


/**************************/
/* SOCIAL ICONS           */
/**************************/

.form-2 .icon-container {

  text-align: center;
}

.form-2 .fa-stack {

  width: 2.5em;

  margin: 0 .4rem .8rem;

  font-size: 1.5rem;
}

.form-2 .fa-stack .fa-stack-2x {

  color: #0f4c81;

  transition: all .3s ease;
}

.form-2 .fa-stack .fa-stack-1x {

  color: #ffffff;

  transition: all .3s ease;
}

.form-2 .fa-stack:hover .fa-stack-2x {

  color: #d4a72c;
}



/************************/
/* 16. CONTACT SECTION  */
/************************/

.form-3 {

  padding: 7rem 0;

  background: #ffffff;
}

.form-3 .text-container {

  margin-bottom: 3rem;
}

.form-3 h2 {

  color: #0f2747;

  margin-bottom: 1.25rem;
}

.form-3 h3 {

  color: #0f4c81;

  margin-bottom: 1rem;
}

.form-3 p {

  color: #5b6675;

  line-height: 1.9rem;

  margin-bottom: 2rem;
}


/************************/
/* CONTACT DETAILS      */
/************************/

.form-3 .list-unstyled {

  color: #5b6675;
}

.form-3 .list-unstyled a {

  color: #0f4c81;

  text-decoration: none;
}

.form-3 .list-unstyled a:hover {

  color: #d4a72c;
}

.form-3 .list-unstyled .fas {

  color: #d4a72c;

  font-size: 1rem;

  margin-top: .2rem;
}

.form-3 .list-unstyled .media-body {

  margin-left: .9rem;
}

.form-3 .list-unstyled .media-body .fa-globe {

  margin-left: 1rem;

  margin-right: .6rem;
}


/************************/
/* CONTACT FORM         */
/************************/

.form-3 .form-control-input,
.form-3 .form-control-textarea {

  border: 1px solid #dbe5ef;

  background: #ffffff;
}

.form-3 .form-control-input:hover,
.form-3 .form-control-textarea:hover {

  border-color: #0f4c81;
}

.form-3 .form-control-input:focus,
.form-3 .form-control-textarea:focus {

  border-color: #0f4c81;
}

.form-3 .label-control {

  color: #5b6675;
}

.form-3 .help-block,
.form-3 .checkbox,
.form-3 .checkbox a {

  color: #5b6675;
}

.form-3 .checkbox a {

  color: #0f4c81;
}

.form-3 .checkbox a:hover {

  color: #d4a72c;
}

.form-3 .form-control-submit-button {

  border: 2px solid #0f4c81;

  background: #0f4c81;

  color: #ffffff;
}

.form-3 .form-control-submit-button:hover {

  background: #d4a72c;

  border-color: #d4a72c;

  color: #0f2747;
}


/************************/
/* MOBILE               */
/************************/

@media (max-width: 991px) {

  .basic-5 h2 {

    font-size: 2rem;
  }

  .basic-5 .text-container {

    padding: 4rem 1.5rem;
  }

  .form-2,
  .form-3 {

    padding: 5rem 0;
  }

  .form-2 h3 {

    font-size: 1.8rem;
  }
}


/**********************/
/*     17. Footer     */
/**********************/

.footer {

  padding-top: 5.5rem;

  padding-bottom: 3rem;

  background:
  linear-gradient(
    rgba(15,39,71,0.96),
    rgba(15,39,71,0.96)
  );

  position: relative;

  overflow: hidden;
}

.footer::before {

  content: "";

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 4px;

  background: #d4a72c;
}

.footer .footer-col {

  margin-bottom: 2.5rem;
}

.footer h5 {

  color: #ffffff;

  font-size: 1.1rem;

  margin-bottom: 1.25rem;

  font-weight: 700;
}

.footer p {

  color: rgba(255,255,255,0.75);

  line-height: 1.9rem;
}

.footer a {

  color: rgba(255,255,255,0.75);

  text-decoration: none;

  transition: all .3s ease;
}

.footer a:hover {

  color: #d4a72c;
}

.footer .list-unstyled .media {

  margin-bottom: .75rem;
}

.footer .list-unstyled .fas {

  color: #d4a72c;

  font-size: .55rem;

  margin-top: .55rem;
}

.footer .list-unstyled .media-body {

  margin-left: .75rem;
}

.footer .fab {

  width: 42px;

  height: 42px;

  line-height: 42px;

  text-align: center;

  border-radius: 50%;

  background: rgba(255,255,255,0.08);

  color: #ffffff;

  margin-right: .5rem;

  transition: all .3s ease;
}

.footer .fab:hover {

  background: #d4a72c;

  color: #0f2747;

  transform: translateY(-3px);
}



/*************************/
/*     18. Copyright     */
/*************************/

.copyright {

  padding: 1.5rem 0;

  background: #08172b;

  text-align: center;

  border-top: 1px solid rgba(255,255,255,0.08);
}

.copyright .p-small {

  margin-bottom: .25rem;

  color: rgba(255,255,255,0.6);

  font-size: .85rem;

  line-height: 1.8;
}

.copyright a {

  color: #d4a72c;

  text-decoration: none;
}

.copyright a:hover {

  color: #ffffff;
}



/**********************************/
/*     19. Back To Top Button     */
/**********************************/

a.back-to-top {

  position: fixed;

  z-index: 999;

  right: 1rem;

  bottom: 1rem;

  display: none;

  width: 52px;

  height: 52px;

  border-radius: 50%;

  background-color: #0f4c81;

  background-image: url("../images/system/up-arrow.png");

  background-repeat: no-repeat;

  background-position: center;

  background-size: 16px;

  box-shadow:
  0 10px 25px rgba(15,76,129,0.3);

  transition: all .3s ease;

  text-indent: -9999px;
}

a:hover.back-to-top {

  background-color: #d4a72c;

  transform: translateY(-3px);
}



/***************************/
/*     20. Extra Pages     */
/***************************/

.ex-header {

  padding-top: 10rem;

  padding-bottom: 6rem;

  background:
  linear-gradient(
    rgba(15,39,71,0.85),
    rgba(15,39,71,0.85)
  ),
  url('../images/header-background.jpg')
  center center no-repeat;

  background-size: cover;

  text-align: center;
}

.ex-header h1 {

  color: #ffffff;
}

.ex-basic-1 {

  padding-top: 1.5rem;

  padding-bottom: 1rem;

  background: #f7f9fc;

  border-bottom: 1px solid #e6edf5;
}

.ex-basic-1 .breadcrumbs {

  margin-bottom: 0;
}

.ex-basic-1 .breadcrumbs a {

  color: #0f4c81;

  text-decoration: none;
}

.ex-basic-1 .breadcrumbs .fa {

  color: #d4a72c;

  margin: 0 .6rem;

  font-size: .8rem;
}

.ex-basic-2 {

  padding-top: 5rem;

  padding-bottom: 5rem;

  background: #ffffff;
}

.ex-basic-2 h3 {

  color: #0f2747;

  margin-bottom: 1rem;
}

.ex-basic-2 .text-container {

  margin-bottom: 3rem;
}

.ex-basic-2 .text-container.last {

  margin-bottom: 0;
}

.ex-basic-2 .text-container.dark {

  padding: 2rem;

  border-radius: 20px;

  background: #f7f9fc;

  border-left: 4px solid #d4a72c;
}

.ex-basic-2 .image-container-large {

  margin-bottom: 4rem;
}

.ex-basic-2 .image-container-large img,
.ex-basic-2 .image-container-small img {

  border-radius: 16px;

  box-shadow:
  0 15px 40px rgba(15,39,71,0.08);
}

.ex-basic-2 .list-unstyled .fas {

  color: #d4a72c;

  font-size: .55rem;

  margin-top: .5rem;
}

.ex-basic-2 .list-unstyled .media-body {

  margin-left: .75rem;
}

.ex-basic-2 .form-container {

  margin-top: 3rem;
}

.ex-basic-2 .btn-solid-reg {

  margin-top: 1.5rem;
}


/*****************************/
/*     21. Media Queries     */
/*****************************/


/* ========================================
   TABLET
======================================== */
@media (min-width: 768px) {

  /* General */

  .p-heading {

    width: 85%;

    margin-left: auto;

    margin-right: auto;
  }


  /* Hero */

  .header {

    padding-top: 10rem;

    padding-bottom: 1rem;
  }

  .header h1 {

    font-size: 4.5rem;

    line-height: 1.15;
  }

  .header .p-large {

    max-width: 700px;

    margin-left: auto;

    margin-right: auto;
  }

  .header .outer-container {

    bottom: -4rem;
  }

  .header .swiper-button-prev {

    left: 2rem;
  }

  .header .swiper-button-next {

    right: 2rem;
  }


  /* Featured Event */

  .basic-5 h2 {

    max-width: 700px;
  }


  /* Community Form */

  .form-2 form {

    max-width: 600px;

    margin-left: auto;

    margin-right: auto;
  }


  /* Extra Pages */

  .ex-header {

    padding-top: 11rem;

    padding-bottom: 8rem;
  }

  .ex-basic-2 .text-container.dark {

    padding: 2.5rem;
  }
}



/* ========================================
   DESKTOP
======================================== */
@media (min-width: 992px) {

  /* Navigation */

  .navbar-custom {

    padding: 1.5rem 2rem;
  }

  .navbar-custom.top-nav-collapse {

    padding: 0.8rem 2rem;
  }

  .navbar-custom .navbar-nav {

    margin-top: 0;

    margin-bottom: 0;
  }

  .navbar-custom .social-icons {

    display: flex;

    align-items: center;
  }


  /* Hero */

  .header h1 {

    max-width: 900px;

    margin-left: auto;

    margin-right: auto;
  }

  .header .p-large {

    max-width: 800px;
  }

  .header .swiper-button-prev {

    left: 3rem;
  }

  .header .swiper-button-next {

    right: 3rem;
  }


  /* About Section */

  .basic-1 {

    padding-top: 6rem;

    padding-bottom: 6rem;
  }

  .basic-1 img {

    margin-bottom: 0;
  }

  .basic-1 .text-container {

    padding-left: 3rem;
  }


  /* Description */

  .basic-2 {

    padding-top: 6rem;

    padding-bottom: 5rem;
  }

  .basic-2 h2 {

    max-width: 750px;

    margin-left: auto;

    margin-right: auto;
  }


  /* Students */

  .basic-3 {

    padding-top: 5rem;

    padding-bottom: 6rem;
  }

  .basic-3 .text-container {

    margin-bottom: 0;

    padding-right: 3rem;
  }


  /* Lightbox */

  .lightbox-basic {

    max-width: 1100px;

    padding: 3rem;
  }

  .lightbox-basic .image-container {

    margin-bottom: 0;

    margin-right: 2rem;
  }


  /* Video */

  .basic-4 {

    padding-top: 6rem;

    padding-bottom: 6rem;
  }


  /* Cards */

  .cards {

    padding-top: 6rem;

    padding-bottom: 5rem;
  }

  .cards .card {

    height: 100%;
  }


  /* Testimonials */

  .slider-2 {

    padding-top: 5rem;

    padding-bottom: 6rem;
  }

  .slider-2 h3 {

    max-width: 700px;

    margin-left: auto;

    margin-right: auto;
  }

  .slider-2 .swiper-container {

    width: 92%;
  }

  .slider-2 .image-wrapper {

    float: left;

    width: 6rem;

    margin-bottom: 0;
  }

  .slider-2 .text-wrapper {

    margin-left: 8rem;
  }


  /* Featured Event */

  .basic-5 h2 {

    max-width: 900px;
  }

  .basic-5 p {

    max-width: 800px;
  }


  /* Contact */

  .form-3 .text-container {

    margin-bottom: 0;

    padding-right: 3rem;
  }


  /* Footer */

  .footer {

    padding-top: 6rem;
  }

  .footer .footer-col {

    margin-bottom: 0;
  }


  /* Extra Pages */

  .ex-basic-2 {

    padding-bottom: 6rem;
  }
}



/* ========================================
   LARGE DESKTOP
======================================== */
@media (min-width: 1200px) {

  /* Hero */

  .header {

    padding-top: 10rem;

    padding-bottom: 1rem;
  }

  .header h1 {

    font-size: 5.5rem;
  }

  .header .outer-container {

    width: 75rem;

    bottom: -6rem;
  }

  .header .swiper-container {

    width: 100%;
  }

  .header .swiper-button-prev {

    left: -3rem;
  }

  .header .swiper-button-next {

    right: -3rem;
  }


  /* Registration */

  .form-1 .text-container {

    margin-right: 4rem;
  }


  /* About */

  .basic-1 .text-container {

    margin-top: 2rem;
  }


  /* Description */

  .basic-2 .list-unstyled.first {

    margin-right: 2rem;
  }

  .basic-2 .list-unstyled.second {

    margin-left: 2rem;
  }


  /* Students */

  .basic-3 .text-container {

    margin-top: 2rem;
  }


  /* Testimonials */

  .slider-2 .swiper-container {

    width: 88%;
  }


  /* Footer */

  .footer .footer-col.first {

    padding-right: 2rem;
  }

  .footer .footer-col.second {

    padding-left: 2rem;
  }

  .footer .footer-col.third {

    padding-left: 2rem;
  }

  .footer .footer-col.fourth {

    padding-left: 2rem;
  }


  /* Extra Pages */

  .ex-header h1 {

    max-width: 900px;

    margin-left: auto;

    margin-right: auto;
  }

  .ex-basic-2 .form-container {

    margin-left: 2rem;
  }

  .ex-basic-2 .image-container-small {

    margin-left: 2rem;
  }
}



/* ========================================
   MOBILE IMPROVEMENTS
======================================== */
@media (max-width: 767px) {

  .header {

    padding-top: 8rem;

    padding-bottom: 12rem;
  }

  .header h1 {

    font-size: 2.5rem;

    line-height: 1.2;
  }

  .header .p-large {

    font-size: 1rem;
  }

  .header .btn-solid-lg,
  .header .btn-outline-lg {

    width: 100%;

    margin: 0.5rem 0;
  }

  .cards .card {

    margin-bottom: 2rem;
  }

  .basic-5 .text-container {

    padding: 4rem 1.5rem;
  }

  .basic-5 h2 {

    font-size: 2rem;
  }

  .form-2,
  .form-3 {

    padding-top: 5rem;

    padding-bottom: 5rem;
  }

  .footer {

    text-align: center;
  }

  .footer .fab {

    margin-bottom: 1rem;
  }
}

/****************************************/
/*     22. SECTION GLOBAL STYLES        */
/****************************************/

.section-header {
  text-align: center;
  margin-bottom: 4rem;
}

.section-tag {
  display: inline-block;
  margin-bottom: 1rem;
  padding: 0.65rem 1.4rem;
  border-radius: 50px;
  background: rgba(15, 76, 129, 0.08);
  color: #0F4C81;
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.section-header h2 {
  margin-bottom: 1rem;
  color: #0B1F3A;
}

.section-header p {
  max-width: 700px;
  margin: 0 auto;
  color: #5d6b82;
}


/*********************************/
/*     23. FEATURED EVENTS       */
/*********************************/

.featured-events {
  padding: 7rem 0;
  background: #ffffff;
}

.event-card {
  overflow: hidden;
  margin-bottom: 2rem;
  border-radius: 20px;
  background: #ffffff;
  box-shadow: 0 15px 40px rgba(11, 31, 58, 0.08);
  transition: all 0.35s ease;
}

.event-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 25px 60px rgba(11, 31, 58, 0.12);
}

.event-image {
  position: relative;
  overflow: hidden;
}

.event-image img {
  width: 100%;
  height: 260px;
  object-fit: cover;
  transition: transform 0.6s ease;
}

.event-card:hover .event-image img {
  transform: scale(1.08);
}

.event-date {
  position: absolute;
  top: 20px;
  right: 20px;
  padding: 0.75rem 1rem;
  border-radius: 12px;
  background: #D4AF37;
  color: #fff;
  font-size: 0.85rem;
  font-weight: 700;
}

.event-content {
  padding: 2rem;
}

.event-category {
  display: inline-block;
  margin-bottom: 1rem;
  color: #0F4C81;
  font-size: 0.85rem;
  font-weight: 700;
  text-transform: uppercase;
}

.event-content h4 {
  margin-bottom: 1rem;
  color: #0B1F3A;
}

.event-meta {
  margin-bottom: 1.5rem;
}

.event-meta span {
  display: block;
  margin-bottom: 0.5rem;
  color: #6f7d93;
  font-size: 0.9rem;
}

.event-meta i {
  width: 20px;
  color: #D4AF37;
}


/*********************************/
/*     24. EVENT CATEGORIES      */
/*********************************/

.event-categories {
  padding: 7rem 0;
  background: #F7F9FC;
}

.category-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 220px;
  margin-bottom: 30px;
  border-radius: 20px;
  background: #ffffff;
  box-shadow: 0 10px 30px rgba(11, 31, 58, 0.08);
  text-decoration: none;
  transition: all 0.35s ease;
}

.category-card:hover {
  transform: translateY(-8px);
  background: #0F4C81;
  text-decoration: none;
}

.category-card i {
  margin-bottom: 1rem;
  color: #D4AF37;
  font-size: 3rem;
  transition: all 0.3s ease;
}

.category-card span {
  color: #0B1F3A;
  font-size: 1rem;
  font-weight: 700;
  transition: all 0.3s ease;
}

.category-card:hover span {
  color: #ffffff;
}


/*********************************/
/*     25. MINISTRIES            */
/*********************************/

.featured-ministries {
  padding: 7rem 0;
  background: #ffffff;
}

.ministry-card {
  padding: 2rem;
  margin-bottom: 30px;
  border-radius: 20px;
  background: #ffffff;
  text-align: center;
  box-shadow: 0 12px 35px rgba(11, 31, 58, 0.08);
  transition: all 0.35s ease;
}

.ministry-card:hover {
  transform: translateY(-8px);
}

.ministry-card img {
  width: 90px;
  height: 90px;
  margin-bottom: 1.5rem;
  border-radius: 50%;
  object-fit: cover;
}

.ministry-card h5 {
  margin-bottom: 0.4rem;
  color: #0B1F3A;
}

.ministry-card span {
  color: #6f7d93;
}


/*********************************/
/*     26. KINGDOM STATS         */
/*********************************/

.kingdom-stats {
  padding: 7rem 0;
  background:
    linear-gradient(
      135deg,
      #0B1F3A,
      #0F4C81
    );
}

.stat-box {
  padding: 2rem;
}

.stat-box h2 {
  margin-bottom: 0.5rem;
  color: #D4AF37;
  font-size: 3rem;
  font-weight: 800;
}

.stat-box p {
  color: rgba(255,255,255,0.85);
  font-size: 1rem;
  font-weight: 600;
}


/*********************************/
/*     27. PROVINCES             */
/*********************************/

.province-section {
  padding: 7rem 0;
  background: #F7F9FC;
}

.province-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 1rem;
}

.province-grid a {
  padding: 1.2rem;
  border-radius: 15px;
  background: #ffffff;
  color: #0B1F3A;
  font-weight: 700;
  text-align: center;
  text-decoration: none;
  box-shadow: 0 10px 25px rgba(11, 31, 58, 0.08);
  transition: all 0.3s ease;
}

.province-grid a:hover {
  background: #0F4C81;
  color: #ffffff;
  text-decoration: none;
}


/*********************************/
/*     28. TESTIMONIALS          */
/*********************************/

.testimonials-section {
  padding: 7rem 0;
  background: #ffffff;
}

.testimonial-card {
  height: 100%;
  padding: 2.5rem;
  border-radius: 20px;
  background: #ffffff;
  box-shadow: 0 12px 35px rgba(11, 31, 58, 0.08);
  transition: all 0.35s ease;
}

.testimonial-card:hover {
  transform: translateY(-8px);
}

.testimonial-card p {
  margin-bottom: 1.5rem;
  color: #5d6b82;
  font-style: italic;
}

.testimonial-card h5 {
  margin-bottom: 0.25rem;
  color: #0B1F3A;
}

.testimonial-card span {
  color: #D4AF37;
  font-weight: 600;
}


/*********************************/
/*     29. WHATSAPP CTA          */
/*********************************/

.whatsapp-section {
  padding: 7rem 0;
  background: #fff;
}

.whatsapp-box {
  max-width: 900px;
  margin: 0 auto;
  padding: 4rem;
  border-radius: 24px;
  background:
    linear-gradient(
      135deg,
      #0F4C81,
      #0B1F3A
    );
  text-align: center;
}

.whatsapp-box i {
  margin-bottom: 1.5rem;
  color: #D4AF37;
  font-size: 4rem;
}

.whatsapp-box h2 {
  margin-bottom: 1rem;
  color: #ffffff;
}

.whatsapp-box p {
  max-width: 650px;
  margin: 0 auto 2rem;
  color: rgba(255,255,255,0.85);
}


/*********************************/
/*     30. FINAL CTA             */
/*********************************/

.final-cta {
  padding: 8rem 0;
  background:
    linear-gradient(
      rgba(11,31,58,0.90),
      rgba(11,31,58,0.90)
    ),
    url('../images/cta-bg.jpg')
    center center
    no-repeat;
  background-size: cover;
  text-align: center;
}

.final-cta h2 {
  margin-bottom: 1rem;
  color: #ffffff;
}

.final-cta p {
  margin-bottom: 2rem;
  color: rgba(255,255,255,0.85);
}

.cta-buttons a {
  margin: 0.5rem;
}


/*********************************/
/*     31. INTERACTIVE EFFECTS   */
/*********************************/

.event-card,
.ministry-card,
.category-card,
.testimonial-card,
.province-grid a {
  will-change: transform;
}

.event-card::before,
.ministry-card::before,
.testimonial-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 4px;
  background: linear-gradient(
    90deg,
    #D4AF37,
    #F2D675
  );
  transition: all 0.4s ease;
}

.event-card:hover::before,
.ministry-card:hover::before,
.testimonial-card:hover::before {
  left: 0;
}

.event-card,
.ministry-card,
.testimonial-card {
  position: relative;
}


/*********************************/
/*     32. RESPONSIVE            */
/*********************************/

@media (max-width: 991px) {

  .province-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .whatsapp-box {
    padding: 3rem 2rem;
  }

}

@media (max-width: 767px) {

  .featured-events,
  .event-categories,
  .featured-ministries,
  .kingdom-stats,
  .province-section,
  .testimonials-section,
  .whatsapp-section,
  .final-cta {
    padding: 5rem 0;
  }

  .province-grid {
    grid-template-columns: 1fr;
  }

  .stat-box h2 {
    font-size: 2.3rem;
  }

  .whatsapp-box {
    padding: 2.5rem 1.5rem;
  }

  .category-card {
    height: 180px;
  }

  .event-image img {
    height: 220px;
  }

}

/****************************************/
/*     33. HERO ENHANCEMENTS            */
/****************************************/

.header {
  position: relative;
  overflow: hidden;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;

  background:
    linear-gradient(
      rgba(11,31,58,0.82),
      rgba(11,31,58,0.82)
    ),
    url('../images/home-page/hero-bg.jpg')
    center center no-repeat;

  background-size: cover;
}

.header::before {
  content: '';
  position: absolute;
  inset: 0;

  background:
    radial-gradient(
      circle at top right,
      rgba(212,175,55,0.18),
      transparent 40%
    );

  pointer-events: none;
}

.hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 10px;

  padding: 0.8rem 1.5rem;

  margin-bottom: 2rem;

  border-radius: 100px;

  background: rgba(255,255,255,0.12);

  backdrop-filter: blur(10px);

  color: #fff;
}

.hero-subtitle {
  margin-bottom: 1rem;
  letter-spacing: 3px;
  text-transform: uppercase;
}

.hero-tagline {
  margin-bottom: 2rem;
  color: #D4AF37;
  font-weight: 600;
}

.hero-buttons {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 15px;
}


/****************************************/
/*     34. ABOUT PREVIEW                */
/****************************************/

.about-preview {
  padding: 8rem 0;
  background: #ffffff;
}

.about-preview img {
  border-radius: 24px;
  box-shadow: 0 20px 60px rgba(11,31,58,0.12);
}

.about-preview h2 {
  margin-top: 1rem;
  margin-bottom: 1.5rem;
  color: #0B1F3A;
}

.about-preview p {
  margin-bottom: 1.25rem;
  color: #5d6b82;
  line-height: 1.9;
}


/****************************************/
/*     35. PHOTO GALLERY                */
/****************************************/

.photo-gallery {
  padding: 7rem 0;
  background: #f7f9fc;
}

.gallery-grid {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 20px;
}

.gallery-item {
  overflow: hidden;
  border-radius: 20px;
}

.gallery-item img {
  width: 100%;
  height: 320px;
  object-fit: cover;

  transition: all 0.5s ease;
}

.gallery-item:hover img {
  transform: scale(1.08);
}


/****************************************/
/*     36. SUBMIT EVENT FORM            */
/****************************************/

.form-1 {
  background:
    linear-gradient(
      135deg,
      #0F4C81,
      #0B1F3A
    );
}

.form-1 h2,
.form-1 p,
.form-1 .media-body {
  color: #ffffff;
}

.form-1 .fas {
  color: #D4AF37;
}

.form-container {
  padding: 2.5rem;
  border-radius: 24px;

  background: rgba(255,255,255,0.08);

  backdrop-filter: blur(20px);
}

.form-control-input {
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.15);
  color: #ffffff;
}

.label-control {
  color: rgba(255,255,255,0.8);
}

.form-control-submit-button {
  background: #D4AF37;
  border: none;
  color: #fff;
}

.form-control-submit-button:hover {
  background: #c29a24;
}


/****************************************/
/*     38. BUTTONS                      */
/****************************************/

.btn-solid-lg,
.btn-solid-reg {
  background: #D4AF37;
  border-color: #D4AF37;
}

.btn-solid-lg:hover,
.btn-solid-reg:hover {
  background: #c29a24;
  border-color: #c29a24;
}

.btn-outline-lg {
  border-color: #ffffff;
}

.btn-outline-lg:hover {
  background: #ffffff;
  color: #0B1F3A;
}


/****************************************/
/*     39. FOOTER                       */
/****************************************/

.footer {
  background:
    linear-gradient(
      rgba(11,31,58,0.95),
      rgba(11,31,58,0.95)
    ),
    url('../images/footer-bg.jpg')
    center center no-repeat;

  background-size: cover;
}

.footer h5 {
  color: #ffffff;
}

.footer a:hover {
  color: #D4AF37;
}

.footer .fab {
  width: 45px;
  height: 45px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  border-radius: 50%;

  background: rgba(255,255,255,0.08);

  transition: all 0.3s ease;
}

.footer .fab:hover {
  transform: translateY(-5px);
  background: #D4AF37;
  color: #fff;
}


/****************************************/
/*     40. SCROLL ANIMATIONS            */
/****************************************/

.reveal {
  opacity: 0;
  transform: translateY(40px);
  transition: all 0.8s ease;
}

.reveal.active {
  opacity: 1;
  transform: translateY(0);
}


/****************************************/
/*     41. FLOATING WHATSAPP            */
/****************************************/

.whatsapp-float {
  position: fixed;
  right: 25px;
  bottom: 90px;

  width: 60px;
  height: 60px;

  display: flex;
  align-items: center;
  justify-content: center;

  border-radius: 50%;

  background: #25D366;

  color: #fff;
  font-size: 28px;

  box-shadow: 0 10px 25px rgba(0,0,0,0.2);

  z-index: 999;
}

.whatsapp-float:hover {
  color: #fff;
  transform: scale(1.08);
}


/****************************************/
/*     42. RESPONSIVE                   */
/****************************************/

@media (max-width: 991px) {

  .gallery-grid {
    grid-template-columns: repeat(2,1fr);
  }

  .about-preview {
    text-align: center;
  }

  .about-preview img {
    margin-bottom: 2rem;
  }
}

@media (max-width: 767px) {

  .gallery-grid {
    grid-template-columns: 1fr;
  }

  .hero-buttons {
    flex-direction: column;
  }

  .hero-buttons a {
    width: 100%;
  }

  .hero-tagline {
    font-size: 1.25rem;
  }

  .form-container {
    padding: 1.5rem;
  }

  .gallery-item img {
    height: 250px;
  }
}

/****************************************/
/*     FEATURED EVENT BANNER            */
/****************************************/

.featured-event-banner {

  padding: 6rem 0;

  background: #f7f9fc;
}

.featured-content {

  padding: 5rem;

  border-radius: 30px;

  background:
    linear-gradient(
      rgba(15,39,71,0.85),
      rgba(15,39,71,0.85)
    ),
    url('../images/events/featured-event.jpg')
    center center no-repeat;

  background-size: cover;

  text-align: center;
}

.featured-label {

  display: inline-block;

  margin-bottom: 1rem;

  padding: .6rem 1.2rem;

  border-radius: 50px;

  background: #D4AF37;

  color: #ffffff;

  font-size: .8rem;

  font-weight: 700;

  text-transform: uppercase;
}

.featured-content h2 {

  color: #ffffff;

  margin-bottom: 1rem;
}

.featured-content p {

  max-width: 700px;

  margin: 0 auto 2rem;

  color: rgba(255,255,255,0.85);
}

/****************************************/
/*     FEATURED EVENT BANNER            */
/****************************************/

.featured-event-banner {

  padding: 6rem 0;

  background: #f7f9fc;
}

.featured-content {

  padding: 5rem;

  border-radius: 30px;

  background:
    linear-gradient(
      rgba(15,39,71,0.85),
      rgba(15,39,71,0.85)
    ),
    url('../images/events/featured-event.jpg')
    center center no-repeat;

  background-size: cover;

  text-align: center;
}

.featured-label {

  display: inline-block;

  margin-bottom: 1rem;

  padding: .6rem 1.2rem;

  border-radius: 50px;

  background: #D4AF37;

  color: #ffffff;

  font-size: .8rem;

  font-weight: 700;

  text-transform: uppercase;
}

.featured-content h2 {

  color: #ffffff;

  margin-bottom: 1rem;
}

.featured-content p {

  max-width: 700px;

  margin: 0 auto 2rem;

  color: rgba(255,255,255,0.85);
}

/****************************************/
/*     EVENTS SECTION                   */
/****************************************/

.events-section {

  padding: 6rem 0;

  background: #ffffff;
}

.events-toolbar {

  display: flex;

  justify-content: space-between;

  align-items: center;

  flex-wrap: wrap;

  gap: 20px;

  margin-bottom: 3rem;
}

.view-switch {

  display: flex;

  border-radius: 50px;

  overflow: hidden;

  border: 1px solid #e4e7eb;
}

.view-switch button {

  border: none;

  padding: .9rem 1.5rem;

  background: #ffffff;

  color: #0B1F3A;

  font-weight: 600;

  cursor: pointer;

  transition: all .3s ease;
}

.view-switch button.active {

  background: #0F4C81;

  color: #ffffff;
}

/****************************************/
/*     EVENT CARDS                      */
/****************************************/

.events-grid {

  display: grid;

  grid-template-columns: repeat(3, 1fr);

  gap: 30px;
}

.event-card {

  overflow: hidden;

  border-radius: 24px;

  background: #ffffff;

  box-shadow:
    0 12px 35px rgba(11,31,58,0.08);

  transition: all .35s ease;
}

.event-card:hover {

  transform: translateY(-8px);

  box-shadow:
    0 20px 60px rgba(11,31,58,0.12);
}

.event-poster {

  position: relative;
}

.event-poster img {

  width: 100%;

  height: 320px;

  object-fit: cover;
}

.event-date-badge {

  position: absolute;

  top: 15px;
  right: 15px;

  padding: .75rem;

  border-radius: 12px;

  background: #D4AF37;

  color: #ffffff;

  text-align: center;

  font-weight: 700;
}

.event-content {

  padding: 2rem;
}

.event-content h3 {

  margin-bottom: 1rem;

  color: #0B1F3A;
}

.event-meta {

  margin-bottom: 1.5rem;
}

.event-meta span {

  display: flex;

  align-items: center;

  margin-bottom: .7rem;

  color: #5d6b82;

  font-size: .95rem;
}

.event-meta i {

  width: 22px;

  color: #D4AF37;
}

.event-actions {

  display: flex;

  gap: 10px;

  flex-wrap: wrap;
}

/****************************************/
/*     CALENDAR VIEW                    */
/****************************************/

.calendar-wrapper {

  background: #ffffff;

  border-radius: 24px;

  overflow: hidden;

  box-shadow:
    0 10px 30px rgba(11,31,58,0.08);
}

.calendar-header {

  display: flex;

  justify-content: space-between;

  align-items: center;

  padding: 1.5rem 2rem;

  background: #0F4C81;
}

.calendar-header h3 {

  color: #ffffff;

  margin: 0;
}

.calendar-header button {

  border: none;

  background: transparent;

  color: #ffffff;

  font-size: 1.2rem;

  cursor: pointer;
}

.calendar-grid {

  display: grid;

  grid-template-columns: repeat(7, 1fr);
}

.day-name {

  padding: 1rem;

  background: #f7f9fc;

  text-align: center;

  font-weight: 700;

  color: #0B1F3A;
}

.calendar-day {

  min-height: 140px;

  padding: 10px;

  border: 1px solid #edf1f5;

  background: #ffffff;
}

.day-number {

  display: block;

  margin-bottom: 10px;

  font-weight: 700;
}

.has-event {

  background: rgba(15,76,129,0.03);
}

.calendar-event {

  padding: .4rem .6rem;

  margin-bottom: 5px;

  border-radius: 8px;

  background: #D4AF37;

  color: #ffffff;

  font-size: .8rem;

  font-weight: 600;
}

/****************************************/
/*     UPCOMING EVENTS TIMELINE         */
/****************************************/

.events-timeline {

  margin-top: 5rem;
}

.timeline-item {

  display: flex;

  gap: 25px;

  margin-bottom: 2rem;
}

.timeline-date {

  min-width: 90px;

  padding: 1rem;

  border-radius: 16px;

  background: #0F4C81;

  color: #ffffff;

  text-align: center;

  font-weight: 700;
}

.timeline-content {

  flex: 1;

  padding: 1.5rem;

  border-radius: 20px;

  background: #ffffff;

  box-shadow:
    0 8px 25px rgba(11,31,58,0.08);
}

/****************************************/
/*     EMPTY STATE                      */
/****************************************/

.no-events {

  padding: 5rem 2rem;

  text-align: center;
}

.no-events i {

  margin-bottom: 1rem;

  color: #D4AF37;

  font-size: 4rem;
}

.no-events h3 {

  color: #0B1F3A;
}

/****************************************/
/*     RESPONSIVE                       */
/****************************************/

@media (max-width: 991px) {

  .events-grid {

    grid-template-columns: repeat(2, 1fr);
  }

  .featured-content {

    padding: 3rem 2rem;
  }

  .calendar-grid {

    overflow-x: auto;
  }
}

@media (max-width: 767px) {

  .events-grid {

    grid-template-columns: 1fr;
  }

  .events-toolbar {

    flex-direction: column;

    align-items: stretch;
  }

  .events-filters {

    flex-direction: column;
  }

  .events-filters input,
  .events-filters select {

    width: 100%;
  }

  .timeline-item {

    flex-direction: column;
  }

  .calendar-day {

    min-height: 100px;
  }

  .featured-content {

    padding: 2.5rem 1.5rem;
  }
}

.countdown-box {

  display: flex;

  justify-content: center;

  gap: 20px;

  margin-top: 30px;
}

.countdown-item {

  min-width: 100px;

  padding: 20px;

  border-radius: 20px;

  background: rgba(255,255,255,.12);

  text-align: center;
}

.countdown-item span {

  display: block;

  font-size: 2rem;

  font-weight: 800;

  color: #ffffff;
}

.countdown-item small {

  color: rgba(255,255,255,.8);
}

.quick-categories {

  padding: 60px 0;

  background: #f7f9fc;
}

.categories-grid {

  display: grid;

  grid-template-columns: repeat(5,1fr);

  gap: 20px;
}

.category-card {

  padding: 35px;

  border-radius: 20px;

  background: #ffffff;

  text-align: center;

  text-decoration: none;

  color: #0F4C81;

  font-weight: 700;

  transition: .3s;
}

.category-card:hover {

  transform: translateY(-5px);

  color: #D4AF37;
}

.category-card i {

  display: block;

  margin-bottom: 15px;

  font-size: 2rem;
}

.event-past {

  opacity: .65;

  pointer-events: none;

  filter: grayscale(100%);
}

@media (max-width:991px){

  .categories-grid{

    grid-template-columns:repeat(2,1fr);
  }
}

@media (max-width:767px){

  .categories-grid{

    grid-template-columns:1fr;
  }

  .countdown-box{

    flex-wrap:wrap;
  }
}

/****************************************/
/*     EVENTS HERO                      */
/****************************************/

.events-header {

  position: relative;

  padding: 180px 0 120px;

  background:
    linear-gradient(
      rgba(11,31,58,0.82),
      rgba(11,31,58,0.82)
    ),
    url('../images/home-page/hero-bg.jpg')
    center center no-repeat;

  background-size: cover;

  overflow: hidden;
}

.hero-overlay {

  position: absolute;

  inset: 0;

  background:
    radial-gradient(
      circle at top right,
      rgba(212,175,55,0.18),
      transparent 40%
    );
}

.events-hero-content {

  position: relative;

  z-index: 2;

  max-width: 950px;

  margin: 0 auto;

  text-align: center;
}

.events-hero-content h1 {

  color: #ffffff;

  margin-bottom: 1.5rem;
}

.events-hero-content p {

  max-width: 760px;

  margin: 0 auto 3rem;

  color: rgba(255,255,255,.85);

  font-size: 1.15rem;
}

.hero-badge {

  display: inline-flex;

  align-items: center;

  gap: 10px;

  margin-bottom: 2rem;

  padding: .85rem 1.5rem;

  border-radius: 50px;

  background: rgba(255,255,255,.12);

  backdrop-filter: blur(12px);

  color: #ffffff;

  font-weight: 600;
}

.events-stats {
  padding: 80px 0;
  background: #ffffff;
}

.stats-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 30px;
}

.stat-card {
  background: #fff;
  border-radius: 20px;
  padding: 40px 25px;
  text-align: center;
  box-shadow: 0 15px 40px rgba(0,0,0,0.06);
  transition: all 0.3s ease;
}

.stat-card:hover {
  transform: translateY(-8px);
}

.stat-card i {
  font-size: 2rem;
  color: #c9a96e;
  margin-bottom: 15px;
}

.stat-card h2 {
  font-size: 3rem;
  font-weight: 800;
  color: #0f2347;
  margin-bottom: 10px;
}

.stat-card span {
  color: #6b7280;
  font-size: 1rem;
}

.monthly-highlights {
  padding: 100px 0;
  background: #f8fafc;
}

.highlights-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
  margin-top: 60px;
}

.highlight-card {
  background: #fff;
  border-radius: 24px;
  padding: 40px;
  text-align: center;
  box-shadow: 0 20px 50px rgba(0,0,0,0.06);
  transition: all .3s ease;
}

.highlight-card:hover {
  transform: translateY(-10px);
}

.highlight-card i {
  width: 80px;
  height: 80px;
  line-height: 80px;
  border-radius: 50%;
  background: #f8f3e7;
  color: #c9a96e;
  font-size: 2rem;
  margin-bottom: 25px;
}

.highlight-card h3 {
  color: #0f2347;
  font-size: 1.7rem;
  font-weight: 700;
  margin-bottom: 15px;
}

.highlight-card p {
  color: #6b7280;
}

.featured-ministries {
  padding: 100px 0;
  background: #fff;
}

.ministries-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 30px;
  margin-top: 60px;
}

.ministry-card {
  background: #fff;
  border-radius: 24px;
  overflow: hidden;
  text-align: center;
  box-shadow: 0 15px 40px rgba(0,0,0,0.06);
  transition: all 0.3s ease;
}

.ministry-card:hover {
  transform: translateY(-10px);
}

.ministry-card img {
  width: 100%;
  height: 240px;
  object-fit: cover;
  display: block;
}

.ministry-card h5 {
  font-size: 1.4rem;
  font-weight: 700;
  color: #0f2347;
  margin-top: 25px;
}

.ministry-card span {
  display: block;
  color: #6b7280;
  margin-bottom: 25px;
}

.past-events {
  padding: 100px 0;
  background: #f8fafc;
}

.event-past {
  position: relative;
}

.event-past .event-overlay {
  position: absolute;
  top: 20px;
  right: 20px;
  z-index: 2;

  background: #dc2626;
  color: white;

  padding: 8px 18px;
  border-radius: 30px;
  font-size: 0.85rem;
  font-weight: 600;
}

.event-past .event-poster img {
  width: 100%;
  height: 260px;
  object-fit: cover;
}

.btn-disabled {
  border: none;
  background: #e5e7eb;
  color: #6b7280;
  border-radius: 10px;
  padding: 12px 18px;
  font-weight: 600;
}

.submit-event-cta {
  padding: 100px 0;
}

.cta-box {
  background: linear-gradient(
      135deg,
      #0f2347,
      #1b3c6d
  );

  border-radius: 30px;

  padding: 80px;

  text-align: center;

  color: white;

  position: relative;

  overflow: hidden;
}

.cta-box h2 {
  font-size: 3rem;
  font-weight: 800;
  margin-bottom: 20px;
}

.cta-box p {
  font-size: 1.2rem;
  color: rgba(255,255,255,0.85);
  max-width: 700px;
  margin: 0 auto 40px;
}

.cta-box .btn-solid-lg {
  background: #c9a96e;
  color: #0f2347;
  border: none;
}

.section-header {
  text-align: center;
  margin-bottom: 70px;
}

.section-tag {
  display: inline-block;

  background: #edf2f7;

  color: #0f4c81;

  padding: 12px 24px;

  border-radius: 100px;

  font-size: 0.85rem;

  font-weight: 700;

  text-transform: uppercase;

  letter-spacing: 2px;

  margin-bottom: 25px;
}

.section-header h2 {
  font-size: 4rem;
  font-weight: 800;
  color: #0f2347;
  margin-bottom: 20px;
}

.section-header p {
  max-width: 700px;
  margin: auto;
  color: #6b7280;
  font-size: 1.15rem;
}

@media (max-width: 991px) {

  .stats-grid,
  .highlights-grid,
  .ministries-grid {
    grid-template-columns: repeat(2, 1fr);
  }

}

@media (max-width: 767px) {

  .stats-grid,
  .highlights-grid,
  .ministries-grid {
    grid-template-columns: 1fr;
  }

  .section-header h2 {
    font-size: 2.5rem;
  }

  .cta-box {
    padding: 50px 30px;
  }

}

/* HERO STATS */
.hero-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5rem;
  max-width: 950px;
  margin: 4rem auto 0;
}

.hero-stat {
  position: relative;

  padding: 2rem 1.5rem;

  text-align: center;

  border-radius: 20px;

  background: rgba(255, 255, 255, 0.08);

  backdrop-filter: blur(15px);
  -webkit-backdrop-filter: blur(15px);

  border: 1px solid rgba(255, 255, 255, 0.15);

  transition: all 0.35s ease;

  overflow: hidden;
}

.hero-stat::before {
  content: '';

  position: absolute;

  top: 0;
  left: 0;

  width: 100%;
  height: 4px;

  background: linear-gradient(
    90deg,
    #d4af37,
    #f5d76e
  );
}

.hero-stat:hover {
  transform: translateY(-8px);

  background: rgba(255, 255, 255, 0.12);

  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2);
}

.hero-stat h3 {
  margin: 0 0 0.5rem;

  font-size: 2.6rem;
  font-weight: 800;
  line-height: 1;

  color: #ffffff;
}

.hero-stat span {
  display: block;

  font-size: 0.95rem;
  font-weight: 500;

  color: rgba(255, 255, 255, 0.85);
}

/* Responsive */
@media (max-width: 991px) {

  .hero-stats {
    grid-template-columns: repeat(2, 1fr);
  }

}

@media (max-width: 576px) {

  .hero-stats {
    grid-template-columns: 1fr;
    gap: 1rem;
  }

  .hero-stat {
    padding: 1.5rem;
  }

  .hero-stat h3 {
    font-size: 2rem;
  }

}

/* SEARCH SECTION */
.events-search-section {
  position: relative;
  margin-top: -60px;
  z-index: 10;
  padding-bottom: 40px;
}

.search-card {
  background: #ffffff;
  border-radius: 24px;
  padding: 30px;
  box-shadow: 0 20px 60px rgba(15, 35, 71, 0.12);
  border: 1px solid rgba(15, 35, 71, 0.06);
}

/* FORM CONTROLS */
.search-card .form-control {
  height: 58px;
  border: 2px solid #edf2f7;
  border-radius: 14px;
  font-size: 0.95rem;
  font-weight: 500;
  color: #0f2347;
  padding: 0 18px;
  transition: all 0.3s ease;
  box-shadow: none;
}

.search-card .form-control:focus {
  border-color: #c9a96e;
  box-shadow: 0 0 0 4px rgba(201, 169, 110, 0.15);
}

/* SELECTS */
.search-card select.form-control {
  cursor: pointer;
}

/* SEARCH BUTTON */
.search-card .btn-solid-reg {
  width: 100%;
  height: 58px;

  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;

  border: none;
  border-radius: 14px;

  background: linear-gradient(
    135deg,
    #c9a96e,
    #d9b978
  );

  color: #0f2347;
  font-weight: 700;

  transition: all 0.3s ease;
}

.search-card .btn-solid-reg:hover {
  transform: translateY(-2px);

  box-shadow: 0 12px 25px rgba(201, 169, 110, 0.35);
}

/* SPACING */
.search-card .row {
  align-items: center;
}

.search-card .col-lg-4,
.search-card .col-lg-2 {
  margin-bottom: 0;
}

/* ==========================================
   ABOUT SECTIONS
========================================== */

.about-section,
.vision-mission-section,
.quick-categories {
  position: relative;
  padding: 100px 0;
}


/* ==========================================
   SECTION HEADER
========================================== */

.section-header {
  text-align: center;
  margin-bottom: 60px;
}

.section-tag {
  display: inline-block;

  padding: 12px 24px;

  border-radius: 50px;

  background: rgba(212, 175, 55, 0.12);

  border: 1px solid rgba(212, 175, 55, 0.25);

  color: #c9a227;

  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;

  margin-bottom: 20px;
}

.section-header h2 {
  font-size: 3rem;
  font-weight: 800;
  color: #0f2342;
  margin-bottom: 20px;
}

.section-header p {
  max-width: 750px;
  margin: 0 auto;

  color: #6b7280;

  line-height: 1.8;
}


/* ==========================================
   GLASS CARD
========================================== */

.glass-card {
  position: relative;

  padding: 40px;

  background: rgba(255, 255, 255, 0.72);

  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);

  border: 1px solid rgba(255, 255, 255, 0.5);

  border-radius: 30px;

  box-shadow:
    0 20px 50px rgba(0, 0, 0, 0.08);

  overflow: hidden;
}

.glass-card::before {
  content: '';

  position: absolute;

  top: 0;
  left: 0;

  width: 100%;
  height: 1px;

  background: linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,0.9),
    transparent
  );
}

.glass-card h3 {
  font-size: 2rem;
  font-weight: 700;

  color: #0f2342;

  margin-bottom: 20px;
}

.glass-card p {
  color: #5f6c80;

  line-height: 1.9;
  margin-bottom: 15px;
}


/* ==========================================
   HIGHLIGHT QUOTE
========================================== */

.highlight-quote {
  margin-top: 30px;

  padding: 25px;

  border-left: 5px solid #d4af37;

  border-radius: 20px;

  background: rgba(212,175,55,0.08);

  color: #0f2342;

  line-height: 1.9;
}

.highlight-quote strong {
  color: #b88b0d;
}


/* ==========================================
   VISION + MISSION
========================================== */

.vision-mission-section .glass-card {
  transition: all 0.3s ease;
}

.vision-mission-section .glass-card:hover {
  transform: translateY(-8px);
}

.icon-box {
  width: 85px;
  height: 85px;

  display: flex;
  align-items: center;
  justify-content: center;

  margin-bottom: 25px;

  border-radius: 24px;

  background: rgba(212,175,55,0.12);

  border: 1px solid rgba(212,175,55,0.25);
}

.icon-box i {
  font-size: 2rem;
  color: #d4af37;
}


/* ==========================================
   MISSION LIST
========================================== */

.glass-card ul {
  padding: 0;
  margin: 0;

  list-style: none;
}

.glass-card ul li {
  position: relative;

  padding-left: 30px;

  margin-bottom: 15px;

  color: #5f6c80;

  line-height: 1.8;
}

.glass-card ul li::before {
  content: '\f00c';

  font-family: "Font Awesome 5 Free";
  font-weight: 900;

  position: absolute;

  left: 0;
  top: 0;

  color: #d4af37;
}


/* ==========================================
   WHAT WE DO
========================================== */

.categories-grid {
  display: grid;

  grid-template-columns:
    repeat(auto-fit, minmax(250px, 1fr));

  gap: 25px;
}

.category-card {
  padding: 35px 25px;

  text-align: center;

  background: rgba(255,255,255,0.72);

  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);

  border: 1px solid rgba(255,255,255,0.5);

  border-radius: 24px;

  color: #0f2342;

  font-weight: 600;

  box-shadow:
    0 15px 35px rgba(0,0,0,0.06);

  transition: all 0.3s ease;
}

.category-card:hover {
  transform: translateY(-8px);

  border-color: rgba(212,175,55,0.5);

  box-shadow:
    0 25px 50px rgba(0,0,0,0.12);
}

.category-card i {
  display: block;

  font-size: 2.5rem;

  color: #d4af37;

  margin-bottom: 15px;
}


/* ==========================================
   MOBILE
========================================== */

@media (max-width: 991px) {

  .about-section,
  .vision-mission-section,
  .quick-categories {
    padding: 70px 0;
  }

  .glass-card {
    padding: 30px;
  }

  .section-header h2 {
    font-size: 2rem;
  }

  .categories-grid {
    grid-template-columns: 1fr;
  }

}

/* ==========================================
   CONTACT HERO
========================================== */

.contact-header {

  position: relative;

  overflow: hidden;

  padding: 350px 0 120px;

  text-align: center;

  background:

    linear-gradient(

      rgba(5, 15, 35, 0.75),

      rgba(5, 15, 35, 0.85)

    ),

    url('../images/home-page/hero-bg.jpg');

  background-size: cover;

  background-position: center;

  background-attachment: fixed;

}

.contact-header::before {

  content: '';

  position: absolute;

  inset: 0;

  background:

    radial-gradient(

      circle at top right,

      rgba(212,175,55,0.18),

      transparent 40%

    );

  pointer-events: none;

}

.contact-hero-content {

  position: relative;

  z-index: 2;

  max-width: 900px;

  margin: 0 auto;

}

.contact-hero-content h1 {

  color: #ffffff;

  font-size: 4rem;

  font-weight: 800;

  margin-bottom: 1.5rem;

}

.contact-hero-content p {

  color: rgba(255,255,255,0.92);

  font-size: 1.15rem;

  line-height: 1.9;

  max-width: 800px;

  margin: 0 auto;

}


/* ==========================================
   CONTACT SECTIONS
========================================== */

.contact-section,
.contact-form-section {
  position: relative;
  padding: 100px 0;
}


/* ==========================================
   CONTACT CARD
========================================== */

.contact-card {
  height: 100%;

  text-align: center;

  padding: 2.5rem 2rem;

  background: rgba(255,255,255,0.55);

  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);

  border: 1px solid rgba(255,255,255,0.65);

  border-radius: 28px;

  box-shadow:
    0 10px 30px rgba(0,0,0,0.08);

  transition: all .35s ease;
}

.contact-card:hover {
  transform: translateY(-8px);

  border-color: rgba(212,175,55,0.45);

  box-shadow:
    0 20px 40px rgba(0,0,0,0.12);
}

.contact-card i {
  width: 85px;
  height: 85px;

  display: flex;
  align-items: center;
  justify-content: center;

  margin: 0 auto 1.5rem;

  border-radius: 22px;

  background:
    linear-gradient(
      135deg,
      rgba(212,175,55,0.20),
      rgba(212,175,55,0.08)
    );

  color: #d4af37;

  font-size: 2rem;
}

.contact-card h4 {
  color: #14324f;

  font-size: 1.3rem;
  font-weight: 700;

  margin-bottom: .8rem;
}

.contact-card p {
  color: #5d6b7b;

  line-height: 1.8;

  margin: 0;
}


/* ==========================================
   CONTACT INFO PANEL
========================================== */

.contact-info-panel {
  height: 100%;

  padding: 3rem;

  background: rgba(255,255,255,0.55);

  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);

  border: 1px solid rgba(255,255,255,0.65);

  border-radius: 30px;

  box-shadow:
    0 10px 30px rgba(0,0,0,0.08);
}

.contact-info-panel h2 {
  color: #14324f;

  font-size: 2.5rem;
  font-weight: 800;

  margin: 1rem 0;
}

.contact-info-panel p {
  color: #5d6b7b;

  line-height: 1.9;

  margin-bottom: 2rem;
}


/* ==========================================
   CONTACT FEATURES
========================================== */

.contact-feature {
  display: flex;
  align-items: center;

  gap: 15px;

  margin-bottom: 1.25rem;
}

.contact-feature i {
  width: 50px;
  height: 50px;

  display: flex;
  align-items: center;
  justify-content: center;

  border-radius: 14px;

  background: rgba(212,175,55,0.15);

  color: #d4af37;
}

.contact-feature span {
  color: #14324f;

  font-weight: 600;
}


/* ==========================================
   CONTACT FORM CARD
========================================== */

.contact-form-card {
  padding: 3rem;

  background: rgba(255,255,255,0.55);

  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);

  border: 1px solid rgba(255,255,255,0.65);

  border-radius: 30px;

  box-shadow:
    0 10px 30px rgba(0,0,0,0.08);
}


/* ==========================================
   FORM CONTROLS
========================================== */

.contact-form-card .form-control {
  height: 58px;

  margin-bottom: 1.2rem;

  background: rgba(255,255,255,0.75);

  border: 1px solid rgba(20,50,79,0.12);

  color: #14324f;

  border-radius: 16px;

  box-shadow: none;
}

.contact-form-card textarea.form-control {
  min-height: 180px;

  height: auto;

  resize: vertical;

  padding-top: 1rem;
}

.contact-form-card .form-control::placeholder {
  color: #7f8b98;
}

.contact-form-card .form-control:focus {
  background: rgba(255,255,255,0.95);

  border-color: #d4af37;

  box-shadow:
    0 0 0 4px rgba(212,175,55,0.12);
}


/* ==========================================
   SOCIAL SECTION
========================================== */

.categories-grid {
  display: grid;

  grid-template-columns:
    repeat(auto-fit, minmax(250px, 1fr));

  gap: 25px;
}

.category-card {
  padding: 2rem;

  text-align: center;

  background: rgba(255,255,255,0.55);

  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);

  border: 1px solid rgba(255,255,255,0.65);

  border-radius: 24px;

  color: #14324f;

  font-weight: 600;

  transition: all .35s ease;
}

.category-card:hover {
  transform: translateY(-8px);

  color: #14324f;

  text-decoration: none;

  border-color: rgba(212,175,55,0.45);

  box-shadow:
    0 15px 35px rgba(0,0,0,0.10);
}

.category-card i {
  display: block;

  margin-bottom: 1rem;

  font-size: 2.5rem;

  color: #d4af37;
}


/* ==========================================
   SECTION HEADER
========================================== */

.section-header {
  text-align: center;

  margin-bottom: 3rem;
}

.section-header h2 {
  color: #14324f;

  font-size: 2.8rem;
  font-weight: 800;

  margin-bottom: 1rem;
}

.section-header p {
  color: #5d6b7b;

  max-width: 700px;
  margin: 0 auto;

  line-height: 1.8;
}

.section-tag {
  display: inline-block;

  padding: .7rem 1.5rem;

  border-radius: 50px;

  background: rgba(255,255,255,0.55);

  backdrop-filter: blur(20px);

  border: 1px solid rgba(255,255,255,0.65);

  color: #d4af37;

  font-size: .85rem;
  font-weight: 700;

  text-transform: uppercase;
  letter-spacing: 1px;

  margin-bottom: 1rem;
}


/* ==========================================
   FLOATING GLOWS
========================================== */

.contact-section::before,
.contact-form-section::before {
  content: '';

  position: absolute;

  width: 350px;
  height: 350px;

  border-radius: 50%;

  background: rgba(212,175,55,0.10);

  filter: blur(120px);

  top: 0;
  right: -100px;

  z-index: -1;
}

.contact-section::after,
.contact-form-section::after {
  content: '';

  position: absolute;

  width: 300px;
  height: 300px;

  border-radius: 50%;

  background: rgba(15,76,129,0.10);

  filter: blur(120px);

  bottom: 0;
  left: -100px;

  z-index: -1;
}


/* ==========================================
   RESPONSIVE
========================================== */

@media (max-width: 991px) {

  .contact-header {
    padding: 140px 0 90px;
  }

  .contact-hero-content h1 {
    font-size: 2.8rem;
  }

  .contact-info-panel,
  .contact-form-card {
    padding: 2rem;
  }

  .contact-card {
    margin-bottom: 25px;
  }

  .contact-section,
  .contact-form-section {
    padding: 70px 0;
  }

}

@media (max-width: 768px) {

  .contact-hero-content h1 {
    font-size: 2.2rem;
  }

  .contact-hero-content p {
    font-size: 1rem;
  }

  .section-header h2 {
    font-size: 2rem;
  }

}

/****************************************/
/*     CALENDAR EVENT TYPES             */
/****************************************/

.calendar-event {

  display: block;

  padding: .45rem .65rem;

  margin-bottom: 6px;

  border-radius: 8px;

  color: #ffffff;

  font-size: .75rem;

  font-weight: 600;

  line-height: 1.3;

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;
}

/* Worship Night */

.calendar-event.worship {
  background: #7c3aed;
}

/* Revival */

.calendar-event.revival {
  background: #dc2626;
}

/* Conference */

.calendar-event.conference {
  background: #0F4C81;
}

/* Youth */

.calendar-event.youth {
  background: #10b981;
}

/* Featured Event */

.calendar-event.featured {
  background: #D4AF37;
  color: #ffffff;
}

/****************************************/
/*     CALENDAR LEGEND                  */
/****************************************/

.calendar-legend {

  display: flex;

  justify-content: center;

  flex-wrap: wrap;

  gap: 20px;

  margin-top: 30px;

  padding: 20px;

  border-radius: 20px;

  background: #f7f9fc;
}

.legend-item {

  display: flex;

  align-items: center;

  gap: 10px;

  color: #0B1F3A;

  font-size: .9rem;

  font-weight: 600;
}

.legend-color {

  width: 14px;

  height: 14px;

  border-radius: 50%;

  flex-shrink: 0;
}

/* Worship */

.worship-color {
  background: #7c3aed;
}

/* Revival */

.revival-color {
  background: #dc2626;
}

/* Conference */

.conference-color {
  background: #0F4C81;
}

/* Youth */

.youth-color {
  background: #10b981;
}

.calendar-event {
  cursor: pointer;
  transition: all 0.25s ease;
}

.calendar-event:hover {
  transform: translateY(-2px);
  opacity: 0.9;
}

#eventModal .modal-content {
  border: none;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 25px 60px rgba(0,0,0,0.2);
}

#eventModal .modal-header {
  background: #0F4C81;
  color: #fff;
  border-bottom: none;
}

#eventModal .close {
  color: #fff;
  opacity: 1;
}