    @font-face {
      font-family: "title-normal";
      src: url("../font/tt-norms-pro/TT_Norms_Pro_Trial_Black.woff2") format("woff2");
      font-display: swap;
    }
    
    @font-face {
      font-family: "heading-normal";
      src: url("../font/tt-norms-pro/TT_Norms_Pro_Trial_Bold.woff2")format("woff2");
      font-display: swap;
    }
    
    @font-face {
      font-family: "text-normal";
      src: url("../font/tt-norms-pro/TT_Norms_Pro_Trial_Normal.woff2")format("woff2");
      font-display: swap;
    }

    html{
      scroll-behavior:smooth;
    }

    *{
      margin:0;
      padding:0;
      box-sizing:border-box;
    }

    h1{
      font-family: "title-normal";
      text-transform: uppercase;
    }

    h2{
      font-family: "heading-normal";
    }

    h3{
      font-family: "heading-normal";
    }

    h4{
      font-family: "heading-normal";
    }

    span{
      font-family: "heading-normal";
    }

    body{
      font-family: "text-normal";
      background:#050505;
      color:#fff;
      line-height:1.5;
    }

    a{
      text-decoration:none;
      color:inherit;
    }

    img{
      width:100%;
      display:block;
    }

    /*================ GLOBAL CONTAINER ===================*/

    .container{
    width:100%;

    max-width:1600px;

    margin:0 auto;

    padding-left:72px;
    padding-right:72px;
    }

    /* LAPTOP */
    @media(max-width:1200px){
    .container{
        padding-left:48px;
        padding-right:48px;
    }
    }

    /* TABLET */
    @media(max-width:768px){
    .container{
        padding-left:24px;
        padding-right:24px;
    }
    }

    /* MOBILE */
    @media(max-width:480px){
    .container{
        padding-left:18px;
        padding-right:18px;
    }
    }


    /*==================== NAVBAR ====================*/
    .navbar{
    position:fixed;
    top:0;
    left:0;
    width:100%;

    z-index:9999;

    padding:22px 0;

    background:transparent;

    transition:
    background .4s ease,
    padding .4s ease,
    backdrop-filter .4s ease;
    }

    /* SCROLLED */
    .navbar.scrolled{
    background:rgba(8,8,8,.92);

    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);

    border-bottom:1px solid rgba(255,255,255,.06);

    padding:16px 0;
    }

    /* INNER */
    .navbar-inner{
    display:flex;
    justify-content:space-between;
    align-items:center;
    }

    /* LOGO */
    .navbar-logo{
    position:relative;
    display:flex;
    align-items:center;
    }

    /* BOTH LOGOS */
    .navbar-logo img{
    height:46px;
    width:auto;

    transition:
    opacity .35s ease,
    transform .35s ease;
    }

    /* DEFAULT LOGO */
    .logo-default{
    opacity:1;
    }

    /* SCROLL LOGO */
    .logo-scroll{
    position:absolute;
    left:0;

    opacity:0;
    }

    /* SCROLLED STATE */
    .navbar.scrolled .logo-default{
    opacity:0;
    }

    .navbar.scrolled .logo-scroll{
    opacity:1;
    }

    /* MENU */
    .nav-menu{
    display:flex;
    align-items:center;
    gap:34px;
    }

    .nav-menu a{
    position:relative;

    color:#ddd;
    font-size:13px;
    letter-spacing:.08em;
    text-transform:uppercase;

    transition:.3s ease;
    }

    /* ACTIVE MENU */
    .nav-menu a.active{
    color:#ff5a1f;
    }

    /* UNDERLINE ACTIVE */
    .nav-menu a.active::after{
    width:100%;
    }

    /* HOVER */
    .nav-menu a:hover{
    color:#fff;
    }

    /* UNDERLINE */
    .nav-menu a::after{
    content:"";

    position:absolute;
    left:0;
    bottom:-8px;

    width:0;
    height:1px;

    background:#ff5a1f;

    transition:.3s ease;
    }

    .nav-menu a:hover::after{
    width:100%;
    }

    /* MOBILE */
    @media(max-width:768px){
    .navbar{
        padding:18px 0;
    }
    .navbar-logo img{
        height:38px;
    }
    .nav-menu{
        gap:18px;
        flex-wrap:wrap;
        justify-content:flex-end;
    }
    .nav-menu a{
        font-size:11px;
    }
    }

    /* =========================
    NAVBAR DROPDOWN
    ========================= */

    .nav-dropdown{
      position:relative;
      display:flex;
      align-items:center;
    }

    .nav-dropdown-toggle{
      display:flex;
      align-items:center;
      gap:8px;
    }

    .dropdown-arrow{
      font-size:12px;
      transition:.3s;
    }

    /* MENU */
    .nav-dropdown-menu{
      position:absolute;

      top:calc(100% + 20px);
      left:0;

      min-width:220px;

      background:#111;

      border:1px solid rgba(255,255,255,.08);

      border-radius:18px;

      padding:12px;

      display:flex;
      flex-direction:column;
      gap:4px;

      opacity:0;
      visibility:hidden;

      transform:translateY(10px);

      transition:.3s;

      z-index:999;
    }

    /* SHOW ON HOVER */
    .nav-dropdown:hover .nav-dropdown-menu{

      opacity:1;
      visibility:visible;

      transform:translateY(0);

    }

    /* ROTATE ICON */
    .nav-dropdown:hover .dropdown-arrow{
      transform:rotate(45deg);
    }

    /* DROPDOWN LINKS */
    .nav-dropdown-menu a{

      padding:12px 14px;

      border-radius:12px;

      text-decoration:none;

      color:#fff;

      transition:.3s;
    }

    .nav-dropdown-menu a:hover{
      background:rgba(255,255,255,.08);
    }

    /*============== CORE SERVICES ===================*/
    .core-services-box{
      background:#101010;
      padding:42px;
      border:1px solid rgba(255,255,255,.05);
    }

    .core-services-title{
      color:#ff5a1f;
      font-size:11px;
      letter-spacing:.18em;
      margin-bottom:24px;
      text-transform:uppercase;
    }

    .core-services-list{
      display:flex;
      flex-direction:column;
      gap:26px;
    }

    .core-services-item{
      display:flex;
      justify-content:space-between;
      align-items:center;
      border-bottom:1px solid rgba(255,255,255,.06);
      padding-bottom:18px;
    }

    .core-services-item h3{
      font-size:28px;
      font-weight:700;
    }

    .plus{
      color:#ff5a1f;
      font-size:26px;
    }

    .section{
      padding:120px 0;
    }

    .section-header{
      display:flex;
      justify-content:space-between;
      align-items:flex-end;
      margin-bottom:60px;
      gap:20px;
    }

    .section-subtitle{
      color:#777;
      max-width:520px;
      margin-top:12px;
    }

    .section-title{
      font-size:54px;
      line-height:1;
      letter-spacing:-.04em;
      font-weight:800;
    }

    .archive-link{
      color:#ff5a1f;
      font-size:13px;
      letter-spacing:.08em;
      text-transform:uppercase;
    }

    /*=================== PRESS RELEASE CARD ===================*/
    .press-grid{
      display:grid;
      grid-template-columns:repeat(3,1fr);
      gap:24px;
    }

    .press-card{
      background:#101010;
      padding:34px;
      border:1px solid rgba(255,255,255,.05);
      min-height:260px;
      display:flex;
      flex-direction:column;
      justify-content:space-between;
      transition:.3s ease;
    }

    .press-card:hover{
      border-color:#ff5a1f;
      transform:translateY(-6px);
    }

    .press-category{
      color:#ff5a1f;
      font-size:11px;
      letter-spacing:.14em;
      margin-bottom:16px;
      text-transform:uppercase;
    }

    .press-card h3{
      font-size:24px;
      line-height:1.2;
      margin-bottom:18px;
    }

    .press-card p{
      color:#888;
      font-size:14px;
    }

    .press-bottom{
      display:flex;
      justify-content:space-between;
      align-items:center;
      margin-top:28px;
      color:#777;
      font-size:13px;
    }

    /* =========================
PRESS RELEASE LIST
========================= */

.press-filter-wrapper{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;

  margin-bottom:40px;
  flex-wrap:wrap;
}

.press-filters{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}

.press-filter{
  height:42px;
  padding:0 18px;

  border:1px solid rgba(255,255,255,.08);

  background:#111;
  color:#aaa;

  font-size:11px;
  letter-spacing:.14em;
  text-transform:uppercase;

  cursor:pointer;

  transition:.3s ease;
}

.press-filter:hover{
  border-color:#ff5a1f;
  color:#fff;
}

.press-filter.active{
  background:#ff5a1f;
  color:#fff;
  border-color:#ff5a1f;
}

#sortPress{
  height:42px;
  padding:0 16px;

  background:#111;
  color:#fff;

  border:1px solid rgba(255,255,255,.08);

  outline:none;
}

/* LIST */

.press-list{
  display:flex;
  flex-direction:column;
  gap:18px;
}

/* CARD */

.press-item{
  background:#101010;

  border:1px solid rgba(255,255,255,.05);

  padding:34px;

  transition:
  border-color .3s ease,
  transform .3s ease;
}

.press-item:hover{
  transform:translateY(-4px);
  border-color:rgba(255,90,31,.25);
}

.press-top{
  display:flex;
  align-items:center;
  gap:14px;

  margin-bottom:18px;
}

.press-category{
  color:#ff5a1f;

  font-size:10px;
  letter-spacing:.14em;

  text-transform:uppercase;
}

.press-date{
  color:#777;
  font-size:12px;
}

.press-item h2{
  font-size:34px;
  line-height:1.1;

  margin-bottom:16px;

  letter-spacing:-.03em;
}

.press-item p{
  color:#8f8f8f;

  max-width:900px;

  line-height:1.8;

  margin-bottom:22px;
}

.press-link{
  color:#ff5a1f;

  font-size:11px;
  letter-spacing:.14em;

  text-transform:uppercase;
}

/* RESPONSIVE */

@media(max-width:768px){

  .press-item{
    padding:24px;
  }

  .press-item h2{
    font-size:26px;
  }

}

/* SORT DROPDOWN */

.press-sort-dropdown{
  position:relative;
}

.press-sort-trigger{
  height:48px;
  padding:0 22px;

  background:#111;
  border:1px solid rgba(255,255,255,.08);

  color:#fff;

  font-size:11px;
  letter-spacing:.14em;
  text-transform:uppercase;

  cursor:pointer;

  display:flex;
  align-items:center;
  gap:12px;

  transition:.3s ease;
}

.press-sort-trigger:hover{
  border-color:#ff5a1f;
}

.press-sort-trigger span{
  color:#ff5a1f;
  font-size:18px;
}

/* MENU */

.press-sort-menu{
  position:absolute;

  top:58px;
  right:0;

  width:180px;

  background:#111;

  border:1px solid rgba(255,255,255,.08);

  display:flex;
  flex-direction:column;

  opacity:0;
  visibility:hidden;
  transform:translateY(10px);

  transition:.3s ease;

  z-index:100;
}

.press-sort-menu.active{
  opacity:1;
  visibility:visible;
  transform:translateY(0);
}

/* OPTION */

.sort-option{
  background:none;
  border:none;

  color:#bbb;

  text-align:left;

  padding:16px 18px;

  font-size:12px;
  letter-spacing:.12em;
  text-transform:uppercase;

  cursor:pointer;

  transition:.3s ease;
}

.sort-option:hover{
  background:#181818;
  color:#fff;
}

.sort-option.active{
  color:#ff5a1f;
}

    /*================= FOOTER =====================*/
    footer{
      padding:100px 0 50px;
      border-top:1px solid rgba(255,255,255,.05);
    }

    .footer-grid{
      display:grid;
      grid-template-columns:2fr 1fr 1fr 1fr;
      gap:40px;
    }

    .footer-brand h3{
      color:#ff5a1f;
      margin-bottom:14px;
      font-size:28px;
    }

    .footer-brand p{
      color:#777;
      max-width:320px;
      margin-bottom:28px;
    }

    .footer-social{
      display:flex;
      gap:14px;
    }

    .footer-social span{
      width:34px;
      height:34px;
      border:1px solid rgba(255,255,255,.1);
      display:flex;
      align-items:center;
      justify-content:center;
      color:#999;
      border-radius:50%;
    }

    .footer-column h4{
      margin-bottom:18px;
      font-size:15px;
    }

    .footer-column a{
      display:block;
      color:#777;
      margin-bottom:12px;
      font-size:14px;
    }

    .footer-column a:hover{
      color:#fff;
    }

    
    @media(max-width:768px){
      .nav-menu{
        gap:16px;
        font-size:12px;
      }
      .hero{
        min-height:900px;
      }
      .hero h1{
        font-size:56px;
      }
      .core-services-box{
        padding:28px;
      }
      .core-services-item h3{
        font-size:22px;
      }
      .section{
        padding:90px 0;
      }
      .section-title{
        font-size:34px;
      }
    }

    /* CORE SERVICES SECTION */
    .core-services-section{
      position:relative;
      z-index:5;
      background:#050505;

      padding:120px 0;
    }

    .core-services-wrapper{
    display:grid;
    grid-template-columns:1.2fr .8fr;
    gap:40px;
    align-items:start;
    }

    /* LEFT */
    .core-services-left{
    background:#111;
    padding:50px;
    border:1px solid rgba(255,255,255,.05);
    }

    .core-services-heading{
    font-size:48px;
    line-height:1;
    font-weight:800;
    margin-bottom:12px;
    letter-spacing:-.04em;
    }

    .core-services-desc{
    color:#777;
    margin-bottom:40px;
    max-width:500px;
    }

    /* ACCORDION */
    .accordion-item{
    border-top:1px solid rgba(255,255,255,.08);
    }

    .accordion-header{
    width:100%;
    background:none;
    border:none;
    color:#fff;
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:28px 0;
    cursor:pointer;
    text-align:left;
    }

    .accordion-header h3{
    font-size:28px;
    font-weight:700;
    margin-bottom:6px;
    }

    .accordion-header span{
    font-size:11px;
    letter-spacing:.12em;
    color:#ff5a1f;
    text-transform:uppercase;
    }

    .accordion-icon{
    font-size:34px;
    color:#ff5a1f;
    transition:.3s ease;
    }

    .accordion-content{
    max-height:0;
    overflow:hidden;
    transition:max-height .4s ease;
    }

    .accordion-content p{
    color:#999;
    padding-bottom:28px;
    max-width:90%;
    }

    .accordion-item.active .accordion-content{
    max-height:300px;
    }

    .accordion-item.active .accordion-icon{
    transform:rotate(45deg);
    }

    /* RIGHT */
    .core-services-right{
    background:#151515;
    padding:50px;
    border:1px solid rgba(255,255,255,.05);
    min-height:100%;
    }

    .core-services-label{
    color:#ff5a1f;
    font-size:11px;
    letter-spacing:.18em;
    margin-bottom:40px;
    text-transform:uppercase;
    }

    .stat-item{
    display:flex;
    gap:24px;
    padding:24px 0;
    border-top:1px solid rgba(255,255,255,.08);
    }

    .stat-item:first-of-type{
    border-top:none;
    padding-top:0;
    }

    .stat-item h2{
    font-size:54px;
    color:#ff5a1f;
    line-height:1;
    }

    .stat-item h4{
    font-size:18px;
    margin-bottom:8px;
    }

    .stat-item p{
    color:#777;
    font-size:14px;
    }

    /* programs section */
    .quick-nav-grid{
      padding-top: 50px;

    display:grid;

    grid-template-columns:
    repeat(2,1fr);

    gap:30px;
    }

    .quick-nav-card{

        padding:50px;

        border-radius:24px;

        background:
        linear-gradient(
            135deg,
            #111,
            #1c1c1c
        );

        color:white;

        text-decoration:none;

        transition:.4s;
    }

    .quick-nav-card:hover{

        transform:
        translateY(-8px);

        box-shadow:
        0 25px 50px rgba(0,0,0,.25);
    }

    .quick-nav-card h3{

        font-size:32px;

        margin-bottom:15px;
    }

    .quick-nav-card span{

        display:inline-block;

        margin-top:20px;

        color:#ff5a1f;
    }

    .quick-nav-card:hover img{
    transform:scale(1.08);
    }

    /* =========================
    RESPONSIVE
    ========================= */

    @media(max-width:992px){
    .core-services-wrapper{
        grid-template-columns:1fr;
    }

    .core-services-heading{
        font-size:40px;
    }

    .accordion-header h3{
        font-size:22px;
    }
    }

    /* ========= Hero Slider ========== */
    .hero-slider{
    position:relative;
    width:100%;
    height:100vh;
    min-height:850px;
    overflow:hidden;
    background:#000;
    }

    .hero-slide{
    position:absolute;
    inset:0;
    opacity:0;
    visibility:hidden;
    transition:1s ease;
    }

    .hero-slide.active{
    opacity:1;
    visibility:visible;
    }

    .hero-slide img{
    width:100%;
    height:100%;
    object-fit:cover;
    }

    /* OVERLAY */

    .hero-overlay{
    position:absolute;
    inset:0;
    background:
    linear-gradient(to bottom, rgba(0,0,0,.55), rgba(0,0,0,.45)),
    linear-gradient(to top, #050505 0%, transparent 35%);
    z-index:1;
    }

    /* CONTENT */
    .hero-content{
    position:absolute;
    inset:0;
    z-index:5;

    display:flex;
    align-items:center;

    pointer-events:none;
    }

    .hero-inner{
    width:100%;
    transform:translateY(-20px);
    }

    .hero-text{
    max-width:600px;
    }

    .hero-eyebrow{
    display:inline-block;
    color:#ff5a1f;
    font-size:20px;
    margin-bottom:10px;
    margin-top: 200px;
    }

    .hero-text h1{
    font-size: 40px;
    line-height:.95;
    font-weight:800;
    letter-spacing:-.05em;
    color:#fff;

    max-width:850px;
    }

    /* ARROWS */
    .hero-arrow{
    position:absolute;

    bottom:40px;
    top:auto;

    width:58px;
    height:58px;

    border:none;
    background:rgba(255,255,255,.08);
    backdrop-filter:blur(12px);

    color:#fff;
    font-size:24px;

    cursor:pointer;
    z-index:20;

    transition:.3s ease;
    }

    .hero-arrow:hover{
    background:#ff5a1f;
    }

    /* PREV */
    .hero-arrow.prev{
    right:110px;
    left:auto;
    }

    /* NEXT */
    .hero-arrow.next{
    right:40px;
    }

    /* DOTS */
    .hero-dots{
    position:absolute;
    bottom:35px; /* sebelumnya 50px */

    left:50%;
    transform:translateX(-50%);

    display:flex;
    gap:12px;
    z-index:20;
    }

    .dot{
    width:11px;
    height:11px;
    border-radius:50%;
    background:rgba(255,255,255,.4);
    cursor:pointer;
    transition:.3s ease;
    }

    .dot.active{
    background:#fff;
    transform:scale(1.2);
    }

  /* =========================
  ABOUT HERO
  ========================= */

  .about-hero{
    position:relative;

    min-height:100vh;

    display:flex;
    align-items:center;

    overflow:hidden;

    padding-top:180px;
    padding-bottom:120px;

    z-index:1;
  }

  /* FULL BG */
  .about-bg{
    position:absolute;
    inset:0;

    z-index:-2;
  }

  .about-bg img{
    width:100%;
    height:100%;

    object-fit:cover;

    position:fixed;
    top:0;
    left:0;

    z-index:-3;
  }


  /* OVERLAY */

  .about-bg-overlay{
    position:absolute;
    inset:0;

    background:
    linear-gradient(
      to bottom,
      rgba(0,0,0,.45),
      rgba(0,0,0,.7)
    );

    z-index:-2;
  }

  .about-hero::after{
    content:"";

    position:absolute;

    left:0;
    bottom:-1px;

    width:100%;
    height:240px;

    background:
    linear-gradient(
      to bottom,
      transparent,
      #050505 70%
    );

    z-index:3;

    pointer-events:none;
  }

  /* CONTAINER */

  .about-hero .container{
    position:relative;
    z-index:5;
  }

  /* FLOATING CARD */
  .about-hero-card{
  position:relative;

  display:grid;
  grid-template-columns:1fr 1fr;
  gap:70px;

  padding:72px;

  border-radius:32px;

  overflow:hidden;

  background:
  linear-gradient(
    135deg,
    rgba(255,255,255,.08),
    rgba(255,255,255,.02)
  );

  backdrop-filter:blur(22px);
  -webkit-backdrop-filter:blur(22px);

  border:1px solid rgba(255,255,255,.12);

  box-shadow:
  0 10px 40px rgba(0,0,0,.35),
  inset 0 1px 1px rgba(255,255,255,.08);

  isolation:isolate;
}

  .about-hero-card:hover{
  transform:none;
  box-shadow:
  0 10px 40px rgba(0,0,0,.35),
  inset 0 1px 1px rgba(255,255,255,.08);
  }

  /* GLOW */
  .about-hero-card::before{
    content:"";

    position:absolute;
    inset:0;

    background:
    radial-gradient(
      circle at top left,
      rgba(255,90,31,.18),
      transparent 32%
    ),

    radial-gradient(
      circle at bottom right,
      rgba(255,255,255,.06),
      transparent 28%
    );

    pointer-events:none;

    z-index:0;
  }

  .about-hero-card::after{
    content:"";

    position:absolute;

    top:-120%;
    left:-40%;

    width:50%;
    height:300%;

    background:
    linear-gradient(
      to right,
      transparent,
      rgba(255,255,255,.08),
      transparent
    );

    transform:rotate(25deg);

    pointer-events:none;
  }

  /* CONTENT */

  .about-hero-content{
    position:relative;
    z-index:2;
  }

  .about-eyebrow{
    display:inline-block;

    color:#ff5a1f;

    font-size:12px;

    letter-spacing:.16em;

    text-transform:uppercase;

    margin-bottom:24px;
  }

  .about-hero-content h1{
    font-size:clamp(58px,6vw,100px);

    line-height:.92;

    letter-spacing:-.05em;

    margin-bottom:28px;

    font-weight:800;
  }

  .about-hero-content p{
    color:#a1a1a1;

    max-width:520px;

    line-height:1.9;

    font-size:15px;

    margin-bottom:40px;
  }

  /* BUTTON */

  .about-button{
    display:inline-flex;

    align-items:center;
    justify-content:center;

    padding:16px 34px;

    border:1px solid rgba(255,255,255,.12);

    color:#fff;

    font-size:12px;

    letter-spacing:.14em;

    text-transform:uppercase;

    transition:.3s ease;
  }

  .about-button:hover{
    background:#ff5a1f;

    border-color:#ff5a1f;
  }

  /* IMAGE */
  .about-hero-image{
    position:relative;

    min-height:620px;

    border-radius:24px;

    overflow:hidden;

    border:1px solid rgba(255,255,255,.08);

    box-shadow:
    0 10px 30px rgba(0,0,0,.35);
  }

  .about-hero-image img{
    width:100%;
    height:100%;

    object-fit:cover;
  }

  .about-hero-image::after{
    content:"";

    position:absolute;
    inset:0;

    background:
    linear-gradient(to right,
    rgba(0,0,0,.45),
    transparent 40%);
  }


  .section,
  .vision-section,
  .organization-section,
  .contact-section,
  .program-section,
  .incentive-section{
    position:relative;
    z-index:5;
    background:#050505;
  }

  .vision-section,
  .organization-section,
  .contact-section,
  .program-section,
  .incentive-section,
  .section,

  footer{
    position:relative;

    z-index:10;

    background:#050505;
  }
  
  /* =========================
  RESPONSIVE
  ========================= */

  @media(max-width:1100px){

    .about-hero-card{
      grid-template-columns:1fr;
    }

    .about-hero-image{
      min-height:500px;
    }

  }

  @media(max-width:768px){

    .about-hero{
      padding-top:140px;
    }

    .about-hero-card{
      padding:36px;
    }

    .about-hero-content h1{
      font-size:58px;
    }

  }

  /* =========================
  VISION
  ========================= */

  .vision-section{
    /* margin-top:-80px; */

    padding-top:50px;
    padding-bottom:80px;

    /* box-shadow:
    0 -80px 120px rgba(5,5,5,1); */
  }

  .vision-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:28px;
  }

  .vision-card{
    background:#101010;

    border:1px solid rgba(255,255,255,.05);

    padding:42px;

    transition:.3s ease;
  }

  .vision-card:hover{
    transform:translateY(-6px);

    border-color:rgba(255,90,31,.3);
  }

  .vision-icon{
    width:42px;
    height:42px;

    display:flex;
    align-items:center;
    justify-content:center;

    border:1px solid rgba(255,90,31,.25);

    color:#ff5a1f;

    margin-bottom:24px;
  }

  .vision-card h3{
    font-size:28px;

    margin-bottom:18px;
  }

  .vision-card p,
  .vision-card li{
    color:#888;

    line-height:1.8;

    font-size:15px;
  }

  .vision-card ul{
    display:flex;
    flex-direction:column;
    gap:14px;

    padding-left:18px;
  }

  /* =========================
  ORGANIZATION
  ========================= */

  .organization-section{
    padding-bottom:140px;
  }

  .section-center{
    text-align:center;

    margin-bottom:70px;
  }

  .section-label{
    display:inline-block;

    color:#ff5a1f;

    font-size:12px;

    letter-spacing:.16em;

    text-transform:uppercase;

    margin-bottom:16px;
  }

  .section-title-center{
    font-size:54px;

    font-weight:800;

    letter-spacing:-.04em;
  }

  .org-chart{
    display:flex;
    flex-direction:column;
    align-items:center;
  }

  .org-level{
    display:flex;
    justify-content:center;
  }

  .org-line{
    width:1px;
    height:55px;

    background:rgba(255,90,31,.3);
  }

  .org-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:24px;

    width:100%;
  }

  .org-box{
    background:#111;

    border:1px solid rgba(255,255,255,.06);

    padding:28px 34px;

    text-align:center;

    min-width:260px;
  }

  .org-box.active{
    border-color:#ff5a1f;
  }

  .org-box span{
    display:inline-block;

    color:#ff5a1f;

    font-size:10px;

    letter-spacing:.14em;

    margin-bottom:10px;

    text-transform:uppercase;
  }

  .org-box h4{
    font-size:22px;

    margin-bottom:8px;
  }

  .org-box p{
    color:#777;

    font-size:14px;
  }

  .org-box.small h4{
    font-size:16px;
  }

  /* =========================
  CONTACT
  ========================= */

  .contact-section{
    padding-bottom:120px;
  }

  .contact-wrapper{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:40px;

    background:#0f0f0f;

    border:1px solid rgba(255,255,255,.05);

    padding:60px;
  }

  .contact-info h2{
    font-size:52px;

    line-height:1;

    margin-bottom:24px;
  }

  .contact-info p{
    color:#888;

    max-width:480px;

    line-height:1.8;

    margin-bottom:36px;
  }

  .contact-list{
    display:flex;
    flex-direction:column;
    gap:18px;
  }

  .contact-item{
    color:#999;

    font-size:15px;
  }

  .contact-form{
    background:#121212;

    padding:40px;
  }

  .form-group{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:16px;
  }

  .contact-form input,
  .contact-form textarea{
    width:100%;

    background:#0c0c0c;

    border:1px solid rgba(255,255,255,.06);

    padding:16px 18px;

    color:#fff;

    margin-bottom:16px;

    outline:none;
  }

  .contact-form textarea{
    height:150px;

    resize:none;
  }

  .contact-form button{
    width:100%;

    height:56px;

    border:none;

    background:#ff5a1f;

    color:#fff;

    font-size:12px;

    letter-spacing:.14em;

    text-transform:uppercase;

    cursor:pointer;

    transition:.3s ease;
  }

  .contact-form button:hover{
    opacity:.85;
  }

  /* =========================
  RESPONSIVE
  ========================= */

  @media(max-width:1100px){

    .about-hero-card,
    .vision-grid,
    .contact-wrapper{
      grid-template-columns:1fr;
    }

    .org-grid{
      grid-template-columns:1fr;
    }

    .about-hero-image{
      min-height:500px;
    }

  }

  @media(max-width:768px){

    .about-hero{
      padding-top:140px;
    }

    .about-hero-card{
      padding:36px;
    }

    .about-hero-content h1{
      font-size:58px;
    }

    .section-title-center{
      font-size:40px;
    }

    .contact-wrapper{
      padding:30px;
    }

    .contact-info h2{
      font-size:40px;
    }

    .form-group{
      grid-template-columns:1fr;
    }

  }



/* =========================
INCENTIVE HERO
========================= */

.incentive-hero{
  position:relative;

  min-height:78vh;

  display:flex;
  align-items:center;
  justify-content:center;

  overflow:hidden;

  padding-top:180px;
  padding-bottom:120px;
}

.incentive-hero .container{
  position:relative;
  z-index:10;
}

/* BG */

.incentive-bg{
  position:absolute;
  inset:0;

  z-index:1;
}

.incentive-bg img{
  width:100%;
  height:100%;

  object-fit:cover;
}

/* OVERLAY */

.incentive-overlay{
  position:absolute;
  inset:0;

  background:
  linear-gradient(to bottom,
  rgba(0,0,0,.55),
  rgba(0,0,0,.75)),

  linear-gradient(to top,
  #050505 0%,
  transparent 35%);
}

/* CONTENT */

.incentive-content{
  position:relative;
  z-index:10;

  text-align:center;

  max-width:980px;

  margin:auto;
}

.incentive-eyebrow{
  display:inline-block;

  color:#ff5a1f;

  font-size:12px;

  letter-spacing:.16em;

  text-transform:uppercase;

  margin-bottom:22px;
}

.incentive-content h1{
  font-size:clamp(58px,6vw,96px);

  line-height:.95;

  letter-spacing:-.05em;

  font-weight:800;

  margin-bottom:26px;
}

.incentive-content p{
  max-width:760px;

  margin:auto;

  color:#b0b0b0;

  line-height:1.9;

  font-size:15px;
}

/* =========================
INCENTIVE SECTION
========================= */

.incentive-section{
  padding-bottom:120px;
}

.incentive-wrapper{
  display:flex;
  flex-direction:column;
  gap:24px;
}


/* =========================
PROGRAM SECTION
========================= */

.program-section{
  padding:120px 0;
}

.program-wrapper{
  display:flex;
  flex-direction:column;
  gap:24px;
}

/* CARD */
.program-card{
  background:#111;

  border:1px solid rgba(255,255,255,.06);

  overflow:hidden;

  transition:
  border-color .4s ease,
  transform .4s ease;
}

.program-card:hover{
  transform:translateY(-4px);

  border-color:rgba(255,90,31,.18);
}

.program-card.active{
  border-color:rgba(255,90,31,.35);
}

/* HEADER */

.program-header{
  width:100%;

  background:none;
  border:none;

  color:#fff;

  display:flex;
  align-items:center;
  justify-content:space-between;

  padding:34px 40px;

  cursor:pointer;
}

.program-title{
  display:flex;
  align-items:center;
  gap:20px;
}

.program-title span{
  color:#ff5a1f;

  font-size:12px;

  letter-spacing:.15em;
}

.program-title h2{
  font-size:42px;

  line-height:1;

  letter-spacing:-.04em;
}

.program-icon{
  font-size:36px;

  color:#ff5a1f;

  transition:
  transform .4s ease,
  color .3s ease;
}

.program-card.active .program-icon{
  transform:rotate(135deg);
}

/* CONTENT */
.program-content{
  max-height:0;

  overflow:hidden;

  opacity:0;

  transition:
  max-height .55s ease,
  opacity .35s ease;
}

.program-card.active .program-content{
  max-height:900px;

  opacity:1;
}

/* GRID */

.program-grid{
  display:grid;

  grid-template-columns:1fr 420px;

  gap:60px;

  padding:0 40px 40px;
}

/* TEXT */
.program-text{
  transform:translateY(30px);

  opacity:0;

  transition:
  transform .6s ease,
  opacity .5s ease;
}

.program-card.active .program-text{
  transform:translateY(0);

  opacity:1;
}

.program-text p{
  color:#999;

  line-height:1.9;

  margin-bottom:28px;
}

.program-text ul{
  padding-left:18px;

  display:flex;
  flex-direction:column;
  gap:14px;

  margin-bottom:34px;
}

.program-text li{
  color:#ddd;
}

/* BUTTON */

.program-button{
  display:inline-flex;

  align-items:center;
  justify-content:center;

  padding:15px 26px;

  border:1px solid rgba(255,255,255,.08);

  font-size:11px;

  letter-spacing:.14em;

  text-transform:uppercase;

  transition:.3s ease;
}

.program-button:hover{
  background:#ff5a1f;

  border-color:#ff5a1f;
}

/* IMAGE */

.program-image{
  height:280px;

  border-radius:14px;

  overflow:hidden;
}

.program-image img{
  width:100%;
  height:100%;

  object-fit:cover;

  transform:scale(1.08);

  transition:
  transform 1s ease,
  opacity .6s ease;

  opacity:.7;
}

.program-card.active .program-image img{
  transform:scale(1);

  opacity:1;
}
.program-card:hover .program-image img{
  transform:scale(1.05);
}


/* =========================
RESPONSIVE
========================= */

@media(max-width:992px){

  .program-grid{
    grid-template-columns:1fr;
  }
}

@media(max-width:768px){

  .program-header{
    padding:28px;
  }

  .program-title h2{
    font-size:30px;
  }

  .program-grid{
    padding:0 28px 28px;
  }

}

/* =========================
PROGRAM SHOWCASE SECTION
========================= */

.program-showcase-section{
  position:relative;
  z-index:5;

  padding-top: 10px;
  padding-bottom: 50px;

  background:#050505;
}

.program-showcase-heading{
  text-align:center;

  margin-bottom:70px;
}

.program-showcase-heading span{
  display:inline-block;

  color:#ff5a1f;

  font-size:12px;

  letter-spacing:.16em;

  text-transform:uppercase;

  margin-bottom:18px;
}

.program-showcase-heading h2{
  font-size:64px;

  line-height:.95;

  letter-spacing:-.05em;

  margin-bottom:24px;
}

.program-showcase-heading p{
  max-width:700px;

  margin:auto;

  color:#8f8f8f;

  line-height:1.9;
}

/* WRAPPER */

.program-showcase-wrapper{
  display:flex;
  flex-direction:column;

  gap:34px;
}

/* CARD */

.showcase-card{
  position:relative;

  min-height:320px;

  overflow:hidden;

  border:1px solid rgba(255,255,255,.08);

  transition:
  transform .5s ease,
  border-color .4s ease;
}

.showcase-card:hover{
  transform:translateY(-6px);

  border-color:rgba(255,90,31,.35);
}

/* BG */

.showcase-bg{
  position:absolute;
  inset:0;
}

.showcase-bg img{
  width:100%;
  height:100%;

  object-fit:cover;

  transition:transform 1.2s ease;
}

.showcase-card:hover .showcase-bg img{
  transform:scale(1.06);
}

/* OVERLAY */

.showcase-overlay{
  position:absolute;
  inset:0;

  background:
  linear-gradient(
    to right,
    rgba(0,0,0,.88),
    rgba(0,0,0,.45)
  );
}

/* CONTENT */

.showcase-content{
  position:relative;
  z-index:3;

  min-height:320px;

  display:flex;
  align-items:center;
  justify-content:space-between;

  gap:40px;

  padding:60px;
}

.showcase-left{
  max-width:560px;
}

.showcase-label{
  display:inline-block;

  color:#ff5a1f;

  font-size:11px;

  letter-spacing:.16em;

  text-transform:uppercase;

  margin-bottom:18px;
}

.showcase-left h3{
  font-size:58px;

  line-height:.95;

  letter-spacing:-.05em;

  margin-bottom:22px;
}

.showcase-left p{
  color:#b0b0b0;

  line-height:1.9;

  max-width:520px;
}

/* BUTTON */

.showcase-button{
  display:inline-flex;

  align-items:center;
  justify-content:center;

  height:64px;

  padding:0 34px;

  background:#ff5a1f;

  color:#fff;

  font-size:11px;

  letter-spacing:.16em;

  text-transform:uppercase;

  transition:.3s ease;
}

.showcase-card:hover .showcase-button{
  background:#ff7440;
}

/* RESPONSIVE */

@media(max-width:992px){

  .showcase-content{
    flex-direction:column;
    align-items:flex-start;
  }

  .showcase-left h3{
    font-size:44px;
  }

}

@media(max-width:768px){

  .program-showcase-section{
    padding:80px 0;
  }

  .program-showcase-heading h2{
    font-size:42px;
  }

  .showcase-content{
    padding:36px 28px;
  }

  .showcase-left h3{
    font-size:36px;
  }

  .showcase-card{
    min-height:auto;
  }

}

/* =========================
CONTACT
========================= */

.contact-section{
  padding-bottom:120px;
}

.contact-wrapper{
  display:grid;
  grid-template-columns:1fr 480px;

  gap:60px;

  background:
  linear-gradient(180deg,
  rgba(255,255,255,.02),
  rgba(255,255,255,.01));

  border:1px solid rgba(255,255,255,.05);

  padding:60px;
}

/* LEFT */
.contact-info h2{
  font-size:64px;
  line-height:.95;
  letter-spacing:-.05em;
  margin-bottom:24px;
}

.contact-info p{
  color:#9b9b9b;
  line-height:1.9;
  max-width:520px;
  margin-bottom:40px;
}

.contact-list{
  display:flex;
  flex-direction:column;

  gap:18px;
}

.contact-item{
  display:flex;
  align-items:center;
  gap:14px;
  color:#d0d0d0;
  font-size:15px;
}

/* FORM */
.contact-form{
  background:#121212;
  border:1px solid rgba(255,255,255,.04);
  padding:36px;
}

.form-group{
  display:grid;
  grid-template-columns:1fr 1fr;

  gap:16px;
}

.contact-form input,
.contact-form textarea{
  width:100%;

  background:#0d0d0d;
  border:1px solid rgba(255,255,255,.06);
  color:#fff;

  padding:16px 18px;
  outline:none;
  margin-bottom:16px;
  font-size:14px;
}

.contact-form textarea{
  height:150px;
  resize:none;
}

.contact-form button{
  width:100%;
  height:58px;
  border:none;
  background:#ff5a1f;
  color:#fff;

  font-size:12px;
  letter-spacing:.16em;
  text-transform:uppercase;
  cursor:pointer;
  transition:.3s ease;
}

.contact-form button:hover{
  opacity:.85;
}


/* =========================
RESPONSIVE
========================= */

@media(max-width:1100px){
  .support-inner,
  .contact-wrapper{
    grid-template-columns:1fr;
  }

  .support-image{
    min-height:320px;
  }

}

@media(max-width:768px){

  .incentive-hero{
    min-height:70vh;
    padding-top:140px;
  }

  .incentive-content h1{
    font-size:56px;
  }

  .support-header{
    padding:28px;
  }

  .support-title h2{
    font-size:30px;
  }

  .support-card.active .support-content{
    padding:
    0 28px 28px 28px;
  }

  .support-card.active .support-inner{
  max-height:1000px;
  opacity:1;
  padding:0 40px 40px;
}

  .contact-wrapper{
    padding:30px;
  }

  .contact-info h2{
    font-size:46px;
  }

  .form-group{
    grid-template-columns:1fr;
  }

}


/* =========================
EVENT HERO
========================= */

.event-hero{
  position:relative;

  min-height:100vh;

  display:flex;
  align-items:flex-end;

  overflow:hidden;

  padding-top:180px;
  padding-bottom:120px;
}

/* BG */

.event-hero-bg{
  position:absolute;
  inset:0;

  z-index:1;
}

.event-hero-bg img{
  width:100%;
  height:100%;

  object-fit:cover;
}

.event-hero-overlay{
  position:absolute;
  inset:0;

  background:
  linear-gradient(
    to right,
    rgba(0,0,0,.78),
    rgba(0,0,0,.28)
  ),

  linear-gradient(
    to top,
    #050505 0%,
    transparent 35%
  );
}

/* CONTENT */
.event-hero .container{
  position:relative;
  z-index:5;
}

.event-hero-content{
  max-width:760px;

  padding-left:40px;
  padding-right:40px;
}

.event-hero-label{
  display:inline-block;

  background:#ff5a1f;

  color:#fff;

  padding:8px 14px;

  font-size:11px;

  letter-spacing:.12em;

  text-transform:uppercase;

  margin-bottom:24px;
}

.event-hero-content h1{
  font-size:clamp(64px,7vw,120px);

  line-height:.9;

  letter-spacing:-.06em;

  margin-bottom:24px;

  font-weight:800;
}

.event-hero-content p{
  max-width:560px;

  color:#b5b5b5;

  line-height:1.9;

  font-size:15px;

  margin-bottom:40px;
}

.event-hero-button{
  display:inline-flex;

  align-items:center;
  justify-content:center;

  height:56px;

  padding:0 34px;

  background:#ff5a1f;

  color:#fff;

  font-size:11px;

  letter-spacing:.14em;

  text-transform:uppercase;

  transition:.3s ease;
}

.event-hero-button:hover{
  background:#ff7440;
}

/* =========================
EVENT SECTION
========================= */

.events-section{
  position:relative;
  z-index:5;

  padding:140px 0;

  background:#050505;
}

/* HEADER */

.events-header{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;

  gap:30px;

  margin-bottom:60px;
}

.events-label{
  display:block;

  color:#7d7d7d;

  font-size:13px;

  letter-spacing:.08em;

  margin-bottom:14px;

  text-transform:uppercase;
}

.events-title{
  font-size:64px;

  line-height:.95;

  letter-spacing:-.05em;

  text-transform:uppercase;
}

.events-filter{
  display:inline-flex;

  align-items:center;
  justify-content:center;

  height:48px;

  padding:0 22px;

  border:1px solid rgba(255,255,255,.08);

  font-size:11px;

  letter-spacing:.14em;

  text-transform:uppercase;

  transition:.3s ease;
}

.events-filter:hover{
  background:#ff5a1f;

  border-color:#ff5a1f;
}

/* GRID */

.events-grid{
  display:grid;

  grid-template-columns:repeat(3, minmax(0,1fr));

  gap:28px;
}

/* CARD */

.event-card{
  background:#101010;

  border:1px solid rgba(255,255,255,.06);

  overflow:hidden;

  transition:
  transform .35s ease,
  border-color .35s ease;
}

.event-card:hover{
  transform:translateY(-6px);

  border-color:rgba(255,90,31,.25);
}

/* IMAGE */

.event-image{
  position:relative;

  overflow:hidden;

  aspect-ratio: 4/3;
}

.event-image img{
  width:100%;
  height:100%;

  object-fit:cover;

  transition:transform 1s ease;
}

.event-card:hover .event-image img{
  transform:scale(1.06);
}

/* DARK OVERLAY */

.event-image::after{
  content:"";

  position:absolute;
  inset:0;

  background:
  linear-gradient(
    to top,
    rgba(0,0,0,.65),
    transparent 55%
  );
}

/* CATEGORY */

.event-category{
  position:absolute;

  top:16px;
  left:16px;

  z-index:3;

  padding:7px 12px;

  background:rgba(0,0,0,.55);

  backdrop-filter:blur(10px);

  border:1px solid rgba(255,255,255,.08);

  color:#ff5a1f;

  font-size:10px;

  letter-spacing:.14em;

  text-transform:uppercase;
}

/* FILTER */
.events-filter{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-bottom:40px;
}

.filter-btn{
  padding:10px 18px;
  border:none;
  background:#111;
  color:#fff;
  border-radius:999px;
  cursor:pointer;
  transition:.3s;
  font-size:14px;
}

.filter-btn:hover{
  opacity:.8;
}

.filter-btn.active{
  background:#c8ff00;
  color:#000;
}

/* CONTENT */

.event-content{
  padding:28px;
}

.event-date{
  color:#ff5a1f;

  font-size:11px;

  letter-spacing:.12em;

  margin-bottom:16px;

  text-transform:uppercase;
}

.event-card h3{
  font-size:34px;

  line-height:1.05;

  margin-bottom:18px;

  letter-spacing:-.03em;
}

.event-card p{
  color:#8f8f8f;

  font-size:15px;

  line-height:1.8;

  margin-bottom:32px;
}

/* FOOTER */

.event-footer{
  display:flex;

  align-items:center;
  justify-content:space-between;

  gap:20px;

  padding-top:22px;

  border-top:1px solid rgba(255,255,255,.06);
}

.event-footer span{
  color:#777;

  font-size:13px;
}

.event-footer a{
  color:#ff5a1f;

  font-size:11px;

  letter-spacing:.12em;

  text-transform:uppercase;
}

/* BUTTON */

.events-load{
  display:flex;
  justify-content:center;

  margin-top:70px;
}

.events-button{
  display:inline-flex;

  align-items:center;
  justify-content:center;

  height:56px;

  padding:0 34px;

  border:1px solid rgba(255,255,255,.12);

  font-size:11px;

  letter-spacing:.18em;

  text-transform:uppercase;

  transition:.3s ease;
}

.events-button:hover{
  background:#ff5a1f;

  border-color:#ff5a1f;
}

/* =========================
RESPONSIVE
========================= */

@media(max-width:1200px){

  .events-grid{
    grid-template-columns:repeat(2, minmax(0,1fr));
  }

}

@media(max-width:992px){

  .events-header{
    flex-direction:column;
    align-items:flex-start;
  }

}

@media(max-width:768px){

  .event-hero{
    min-height:850px;

    padding-top:140px;
  }

  .event-hero-content,
  .events-header,
  .events-grid{
    padding-left:0;
    padding-right:0;
  }

  .event-hero-content h1{
    font-size:56px;
  }

  .events-grid{
    grid-template-columns:1fr;
  }

  .event-content h3{
    font-size:30px;
  }

}

@media(max-width:768px){

  .events-section{
    padding:100px 0;
  }

  .events-header{
    flex-direction:column;
    align-items:flex-start;
  }

  .events-title{
    font-size:42px;
  }

  .events-grid{
    grid-template-columns:1fr;
  }

  .event-card h3{
    font-size:28px;
  }

}


/* =========================
EVENT DETAIL HERO
========================= */

.event-detail-hero{
  position:relative;

  min-height:80vh;

  display:flex;
  align-items:center;

  overflow:hidden;

  padding-top:180px;
  padding-bottom:120px;
}

/* BG */

.event-detail-bg{
  position:absolute;
  inset:0;

  z-index:1;
}

.event-detail-bg img{
  width:100%;
  height:100%;

  object-fit:cover;
}

/* OVERLAY */

.event-detail-overlay{
  position:absolute;
  inset:0;

  background:
  linear-gradient(to bottom,
  rgba(0,0,0,.45),
  rgba(0,0,0,.75)),

  linear-gradient(to top,
  #050505 0%,
  transparent 35%);
}

/* CONTENT */

.event-detail-content{
  position:relative;
  z-index:5;

  max-width:700px;
}

.event-detail-label{
  display:inline-block;

  color:#ff5a1f;

  font-size:12px;

  letter-spacing:.18em;

  text-transform:uppercase;

  margin-bottom:24px;
}

.event-detail-content h1{
  font-size:clamp(58px,6vw,100px);

  line-height:.92;

  letter-spacing:-.05em;

  margin-bottom:28px;
}

.event-meta-row{
  display:flex;
  flex-wrap:wrap;

  gap:28px;

  margin-bottom:42px;
}

.event-meta-item{
  color:#d0d0d0;

  font-size:14px;
}

/* BUTTONS */

.event-hero-buttons{
  display:flex;
  gap:18px;
}

.event-primary-btn,
.event-secondary-btn{
  height:56px;

  display:inline-flex;
  align-items:center;
  justify-content:center;

  padding:0 28px;

  font-size:11px;

  letter-spacing:.14em;

  text-transform:uppercase;

  transition:.3s ease;
}

.event-primary-btn{
  background:#ff5a1f;
}

.event-primary-btn:hover{
  opacity:.85;
}

.event-secondary-btn{
  border:1px solid rgba(255,255,255,.12);
}

.event-secondary-btn:hover{
  background:#fff;
  color:#000;
}


/* =========================
EVENT DETAIL SECTION
========================= */

.event-detail-section{
  position:relative;
  z-index:5;

  background:#050505;

  padding-bottom:140px;
}

.event-layout{
  display:grid;

  grid-template-columns:minmax(0,1fr) 360px;

  gap:60px;
}

/* MAIN */

.event-main{
  display:flex;
  flex-direction:column;

  gap:70px;
}

.event-block h2{
  font-size:42px;

  letter-spacing:-.04em;

  margin-bottom:28px;
}

.event-block p{
  color:#999;

  line-height:1.9;

  margin-bottom:18px;

  max-width:760px;
}

/* =========================
SCHEDULE
========================= */

.schedule-list{
  display:flex;
  flex-direction:column;

  gap:14px;
}

.schedule-item{
  display:grid;

  grid-template-columns:120px 1fr;

  background:#101010;

  border:1px solid rgba(255,255,255,.06);

  transition:.3s ease;
}

.schedule-item:hover{
  border-color:rgba(255,90,31,.3);
}

.schedule-time{
  padding:28px;

  color:#ff5a1f;

  font-size:14px;

  letter-spacing:.12em;

  border-right:1px solid rgba(255,255,255,.06);
}

.schedule-content{
  padding:28px;
}

.schedule-content h3{
  font-size:28px;

  margin-bottom:10px;
}

.schedule-content p{
  margin:0;
}

/* =========================
GALLERY
========================= */

.event-gallery{
  display:grid;

  grid-template-columns:repeat(3,1fr);

  gap:18px;
}

.gallery-item{
  overflow:hidden;

  aspect-ratio:1/1;
}

.gallery-item img{
  width:100%;
  height:100%;

  object-fit:cover;

  transition:transform .8s ease;
}

.gallery-item:hover img{
  transform:scale(1.08);
}

/* =========================
SIDEBAR
========================= */

.event-sidebar{
  display:flex;
  flex-direction:column;

  gap:24px;

  position:sticky;
  top:120px;

  height:max-content;
}

.sidebar-card{
  background:#111;

  border:1px solid rgba(255,255,255,.06);

  padding:32px;
}

.sidebar-card.active{
  border-color:rgba(255,90,31,.25);
}

.sidebar-label{
  display:block;

  color:#ff5a1f;

  font-size:11px;

  letter-spacing:.16em;

  margin-bottom:18px;

  text-transform:uppercase;
}

.sidebar-card h3{
  font-size:32px;

  line-height:1.1;

  margin-bottom:12px;
}

.sidebar-card p{
  color:#8c8c8c;

  line-height:1.8;
}

.sidebar-link{
  display:inline-block;

  margin-top:16px;

  color:#ff5a1f;

  font-size:12px;

  letter-spacing:.12em;

  text-transform:uppercase;
}

.invite-badge{
  display:inline-flex;

  align-items:center;
  justify-content:center;

  height:42px;

  padding:0 18px;

  background:#1a1a1a;

  border:1px solid rgba(255,90,31,.2);

  color:#ff5a1f;

  font-size:11px;

  letter-spacing:.12em;

  text-transform:uppercase;

  margin-bottom:22px;
}

/* =========================
RESPONSIVE
========================= */

@media(max-width:1100px){

  .event-layout{
    grid-template-columns:1fr;
  }

  .event-sidebar{
    position:relative;
    top:auto;
  }

}

@media(max-width:768px){

  .event-detail-hero{
    min-height:70vh;

    padding-top:140px;
  }

  .event-detail-content h1{
    font-size:58px;
  }

  .event-layout{
    gap:40px;
  }

  .event-block h2{
    font-size:34px;
  }

  .schedule-item{
    grid-template-columns:1fr;
  }

  .schedule-time{
    border-right:none;

    border-bottom:1px solid rgba(255,255,255,.06);
  }

  .event-gallery{
    grid-template-columns:1fr;
  }

  .event-hero-buttons{
    flex-direction:column;
  }

}


/* =========================
PRESS RELEASE HERO
========================= */

.press-release-hero{
  position:relative;

  min-height:55vh;

  display:flex;
  align-items:center;
  justify-content:center;

  overflow:hidden;

  padding-top:140px;
  padding-bottom:80px;
}

/* BG */

.press-release-bg{
  position:absolute;
  inset:0;

  z-index:1;
}

.press-release-bg img{
  width:100%;
  height:100%;
  filter: brightness(60%);

  object-fit:cover;
}

/* OVERLAY */

.press-release-overlay{
  position:absolute;
  inset:0;

  background:
  linear-gradient(to bottom,
  rgba(0,0,0,.35),
  rgba(0,0,0,.72)),

  linear-gradient(to top,
  #050505 0%,
  transparent 35%);
}

/* CONTENT */

.press-release-hero-content{
  position:relative;
  z-index:5;

  text-align:center;
}

.press-release-label{
  display:inline-block;

  color:#ff5a1f;

  font-size:12px;

  letter-spacing:.18em;

  text-transform:uppercase;

  margin-bottom:18px;
}

.press-release-hero-content h1{
  font-size:clamp(54px,6vw,92px);

  line-height:.95;

  letter-spacing:-.05em;

  text-transform:uppercase;
}


/* =========================
press-release SECTION
========================= */

.press-release-section{
  position:relative;
  z-index:5;

  background:#050505;

  padding:120px 0 140px;
}

/* WRAPPER */

.press-release-wrapper{
  max-width:980px;
}

/* TITLE */

.press-release-heading{
  display:flex;
  align-items:flex-start;

  gap:22px;

  margin-bottom:42px;
}

.press-release-line{
  width:3px;
  height:48px;

  background:#ff5a1f;

  margin-top:10px;
}

.press-release-heading h2{
  font-size:52px;

  line-height:1.08;

  letter-spacing:-.04em;

  max-width:760px;
}

/* HIGHLIGHT */

.press-release-highlight{
  color:#ff5a1f;

  font-size:28px;

  line-height:1.6;

  margin-bottom:48px;

  max-width:920px;
}

/* CONTENT */

.press-release-content{
  display:flex;
  flex-direction:column;

  gap:30px;
}

.press-release-content p{
  color:#a0a0a0;

  font-size:17px;

  line-height:2;

  max-width:920px;
}

/* BLOCKQUOTE */

.press-release-content blockquote{
  position:relative;

  padding-left:28px;

  margin-top:20px;

  color:#d5d5d5;

  font-size:20px;

  line-height:1.9;

  border-left:2px solid rgba(255,90,31,.5);

  max-width:920px;
}

/* =========================
RESPONSIVE
========================= */

@media(max-width:992px){

  .press-release-heading h2{
    font-size:42px;
  }

  .press-release-highlight{
    font-size:22px;
  }

}

@media(max-width:768px){

  .press-release-hero{
    min-height:42vh;

    padding-top:120px;
  }

  .press-release-hero-content h1{
    font-size:52px;
  }

  .press-release-section{
    padding:90px 0 120px;
  }

  .press-release-heading{
    gap:16px;
  }

  .press-release-heading h2{
    font-size:34px;
  }

  .press-release-highlight{
    font-size:19px;

    line-height:1.8;
  }

  .press-release-content p{
    font-size:15px;
  }

  .press-release-content blockquote{
    font-size:17px;
  }

}

/* =========================
FILMS HERO
========================= */

.films-hero{
  position:relative;

  min-height:78vh;

  display:flex;
  align-items:flex-end;

  overflow:hidden;

  padding-top:180px;
  padding-bottom:100px;
}

/* BG */

.films-hero-bg{
  position:absolute;
  inset:0;

  z-index:1;
}

.films-hero-bg img{
  width:100%;
  height:100%;

  object-fit:cover;
}

/* OVERLAY */

.films-hero-overlay{
  position:absolute;
  inset:0;

  background:
  linear-gradient(
    to right,
    rgba(0,0,0,.82),
    rgba(0,0,0,.35)
  ),

  linear-gradient(
    to top,
    #050505 0%,
    transparent 35%
  );

  z-index:2;
}

/* CONTENT */

.films-hero .container{
  position:relative;
  z-index:5;
}

.films-hero-content{
  max-width:760px;
}

.films-label{
  display:inline-block;

  color:#ff5a1f;

  font-size:12px;

  letter-spacing:.18em;

  text-transform:uppercase;

  margin-bottom:22px;
}

.films-hero-content h1{
  font-size:clamp(68px,8vw,140px);

  line-height:.88;

  letter-spacing:-.07em;

  margin-bottom:28px;

  font-weight:800;

  text-transform:uppercase;
}

.films-hero-content p{
  max-width:620px;

  color:#b5b5b5;

  line-height:1.9;

  font-size:15px;
}

/* RESPONSIVE */

@media(max-width:768px){

  .films-hero{
    min-height:68vh;

    padding-top:140px;
    padding-bottom:80px;
  }

  .films-hero-content h1{
    font-size:58px;
  }

}

/* =========================
SUPPORTED FILMS
========================= */

.film-grid{

    display:grid;

    grid-template-columns:
    repeat(6,1fr);

    gap:20px;

}

.film-card{
  background:#101010;
  border:1px solid rgba(255,255,255,.05);
  overflow:hidden;
  position:relative;

  transition:
  transform .4s ease,
  border-color .4s ease,
  box-shadow .4s ease;
}

.film-card:hover{
  transform:translateY(-8px);

  border-color:rgba(255,90,31,.3);

  box-shadow:
  0 18px 40px rgba(0,0,0,.45);
}

/* IMAGE */
.film-poster{
  position:relative;
  overflow:hidden;
  border-radius:14px;
  aspect-ratio:2 / 3;
}

.film-poster img{
  width:100%;
  height:100%;

  object-fit:cover;

  transition:transform 1s ease;
}

.film-card:hover .film-poster img{
  transform:scale(1.05);
}

/* OVERLAY */
.film-poster::after{
  content:"";

  position:absolute;
  inset:0;

  background:
  linear-gradient(
    to top,
    rgba(0,0,0,.88) 0%,
    rgba(0,0,0,.25) 45%,
    transparent 70%
  );
}

/* INFO */
.film-info{
  position:absolute;

  left:0;
  bottom:0;

  width:100%;

  padding:24px;

  z-index:5;
}

.film-title{
  font-size:28px;
  line-height:1;

  letter-spacing:-.03em;

  margin-bottom:10px;

  color:#fff;
}

.film-meta{
  color:#d0d0d0;

  font-size:13px;

  margin-bottom:14px;
}

.film-status{
  color:#ff5a1f;

  font-size:11px;

  letter-spacing:.14em;

  text-transform:uppercase;
}

/* BUTTON */
.film-button-wrap{
  display:flex;
  justify-content:center;

  margin-top:60px;
}

.film-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  height:54px;
  padding:0 32px;

  border:1px solid rgba(255,255,255,.08);

  font-size:11px;
  letter-spacing:.16em;

  text-transform:uppercase;

  transition:.3s ease;

  cursor:pointer;
}

.film-button:hover{
  background:#ff5a1f;
  border-color:#ff5a1f;
}

/* RESPONSIVE */

@media(max-width:992px){

  .film-grid{
    grid-template-columns:repeat(3,1fr);
  }

}

@media(max-width:768px){

  .film-grid{
    grid-template-columns:repeat(2,1fr);
    gap:18px;
  }

  .film-title{
    font-size:18px;
  }

}

@media(max-width:520px){

  .film-grid{
    grid-template-columns:1fr;
  }

}

#loadMoreBtn{
  margin-top:20px;
  cursor:pointer;
}


.film-card:hover{
  transform:translateY(-8px);

  border-color:rgba(255,90,31,.3);

  box-shadow:
  0 18px 40px rgba(0,0,0,.45);
}

@media(max-width:768px){

  .film-grid{
    grid-template-columns:1fr 1fr;
    gap:18px;
  }

  .film-title{
    font-size:15px;
  }

}

@media(max-width:520px){

  .film-grid{
    grid-template-columns:1fr;
  }

}

/* loading screen */
#loader{
    position:fixed;
    inset:0;
    background:#0a0a0a;
    z-index:99999;

    display:flex;
    align-items:center;
    justify-content:center;

    transition:.6s;
}

#loader.hide{
    opacity:0;
    visibility:hidden;
}

.loader-content{
    text-align:center;
    color:white;
}

.loader-content h2{
    margin-top:20px;
    letter-spacing:3px;
}

.loader-content p{
    opacity:.7;
}

.film-reel{

    width:90px;
    height:90px;

    border:8px solid #fff;
    border-radius:50%;

    position:relative;

    animation:spin 2s linear infinite;
}

.film-reel::before,
.film-reel::after{
    content:"";
    position:absolute;
    width:16px;
    height:16px;
    background:white;
    border-radius:50%;
}

.film-reel::before{
    top:10px;
    left:10px;
}

.film-reel::after{
    bottom:10px;
    right:10px;
}

@keyframes spin{

    from{
        transform:rotate(0deg);
    }

    to{
        transform:rotate(360deg);
    }

}

/* whatsapp floating */
.wa-widget{

    position:fixed;

    right:30px;
    bottom:30px;

    z-index:9999;

    opacity:0;
    transform:translateY(40px);

    transition:.5s ease;
}

.wa-widget.show{

    opacity:1;
    transform:translateY(0);

}

.wa-button{

    display:flex;
    align-items:center;
    gap: 5px;

    background:#ffffff;

    padding:14px 18px;

    border-radius:50px;

    text-decoration:none;

    color:#111;

    box-shadow:
    0 20px 60px rgba(0,0,0,.15);

    overflow:hidden;

    position:relative;

    transition:.3s ease;
}

.wa-button:hover{

    transform:
    translateY(-4px)
    scale(1.02);

}

.wa-icon{

    width:40px;
    height:40px;

    border-radius:25%;

    background:#25D366;

    color:white;

    display:flex;
    justify-content:center;
    align-items:center;

    position:relative;

    flex-shrink:0;
}

.wa-icon::before{

    content:"";

    position:absolute;

    inset:-10px;

    border-radius:25%;

    border:2px solid
    rgba(37,211,102,.4);

    animation:
    whatsappPulse 2s infinite;
}

@keyframes whatsappPulse{

    0%{

        transform:scale(.8);
        opacity:1;

    }

    100%{

        transform:scale(1.6);
        opacity:0;

    }

}

.wa-content{

    display:flex;
    flex-direction:column;
}

.wa-content span{

    font-size:.5rem;
    color:#777;
}

.wa-content strong{

    font-size:.70rem;
    color:#111;
}

@media(max-width:768px){

    .wa-content{
        display:none;
    }

    .wa-button{

        width:70px;
        height:70px;

        padding:0;

        justify-content:center;
    }

}
.wa-widget{

    animation:
    floatWhatsapp
    4s ease-in-out infinite;

}
@keyframes floatWhatsapp{

    0%{
        transform:translateY(0);
    }

    50%{
        transform:translateY(-10px);
    }

    100%{
        transform:translateY(0);
    }

}

/* Contact Navbar */
.contact-btn{
    position:relative;
    overflow:hidden;
    background:#111;
    color:#fff !important;
    padding:12px 28px;
    border-radius:8px;
    font-weight:600;
    border:1px solid #ff5a1f;
    transition:.4s;
}

.contact-btn::before{
    content:"";
    position:absolute;
    top:0;
    left:-100%;
    width:100%;
    height:100%;
    background:linear-gradient(
        90deg,
        transparent,
        rgba(255,255,255,.3),
        transparent
    );
    transition:.6s;
}

.contact-btn:hover::before{
    left:100%;
}

.contact-btn:hover{
    background:#ff5a1f;
    color:#111 !important;
}

/* Hamburger Menu Mobile View */
.mobile-toggle{
    display:none;
    flex-direction:column;
    gap:5px;
    background:none;
    border:none;
    cursor:pointer;
}

.mobile-toggle span{
    width:28px;
    height:3px;
    background:#fff;
    border-radius:10px;
    transition:.3s;
}
@media(max-width:992px){

    .mobile-toggle{
        display:flex;
    }

    .nav-menu{

        position:fixed;

        top:0;
        right:-100%;

        width:320px;
        height:100vh;

        background:#111;

        flex-direction:column;

        align-items:flex-start;

        padding:120px 30px;

        transition:.4s ease;

        z-index:9999;
    }

    .nav-menu.active{
        right:0;
    }

}
.menu-overlay{

    position:fixed;
    inset:0;

    background:rgba(0,0,0,.6);

    opacity:0;
    visibility:hidden;

    transition:.3s;

    z-index:9998;
}

.menu-overlay.active{

    opacity:1;
    visibility:visible;

}
.mobile-toggle.active span:nth-child(1){
    transform:
    rotate(45deg)
    translate(6px,6px);
}

.mobile-toggle.active span:nth-child(2){
    opacity:0;
}

.mobile-toggle.active span:nth-child(3){
    transform:
    rotate(-45deg)
    translate(6px,-6px);
}


/* program hero button */
.hero-menu-wrapper{

    position:relative;

    display:flex;
    justify-content:center;
    align-items:center;

    margin-top:50px;

    min-height:120px;
}

.hero-main-btn{
    z-index:10;

    padding:16px 36px;

    border:none;

    border-radius:999px;

    background:#fff;
    color:#111;

    font-weight:700;

    cursor:pointer;

    transition:.4s ease;
}

.hero-main-btn:hover{

    transform:translateY(-3px);

}

.hero-sub-btn{

    position:absolute;

    padding:14px 28px;

    border-radius:999px;

    text-decoration:none;

    color:white;

    background:rgba(255,255,255,.1);

    backdrop-filter:blur(10px);

    border:1px solid rgba(255,255,255,.2);

    opacity:0;

    pointer-events:none;

    transition:.5s ease;

}

/* saat aktif */
.hero-menu-wrapper.active .hero-sub-btn{
    opacity:1;
    pointer-events:auto;

}
.hero-menu-wrapper.active .left{
    transform:
    translateX(-240px);

}

.hero-menu-wrapper.active .center{
    transform:
    translateY(70px);

}

.hero-menu-wrapper.active .right{
    transform:
    translateX(240px);

}
.hero-menu-wrapper.active .hero-main-btn{
    opacity:0;

    transform:scale(.8);

    pointer-events:none;

}

.hero-program-button-wrap{
  position:relative;
    width:900px;
    height:70px;
    margin:50px auto 0;
}

.hero-program-main-btn{
    position:absolute;
    left:50%;
    top:0;
    transform:translateX(-50%);
    z-index:5;

    padding:16px 34px;
    border:none;
    border-radius:999px;

    height:48px;
    min-width:160px;
    padding:0 20px;

    font-size:14px;
    letter-spacing:.5px;

    background:#ff5a1f;
    color:#000;

    font-weight:700;
    cursor:pointer;

    transition:.4s;
}

.hero-program-links{
    position:relative;
    width:100%;
    height:100%;
}

.program-link{
    position:absolute;
    top:0;

    display:flex;
    align-items:center;
    justify-content:center;

    height:48px;
    min-width:160px;

    padding:0 20px;

    border-radius:100px;

    text-decoration:none;

    color:#fff;

    font-size:14px;
    font-weight:600;
    letter-spacing:.5px;

    background:
    rgba(255,255,255,.08);

    border:
    1px solid rgba(255,255,255,.18);

    backdrop-filter:blur(14px);

    box-shadow:
    0 8px 30px rgba(0,0,0,.25);

    opacity:0;
    pointer-events:none;

    transition:
    .6s cubic-bezier(.22,.61,.36,1);
}

.program-link:hover{
    transform:
    translateY(-6px)
    scale(1.05);

    background:
    rgba(255,255,255,.15);

    border-color:
    rgba(255,255,255,.4);

    box-shadow:
    0 20px 40px rgba(0,0,0,.35),
    0 0 20px rgba(255,255,255,.15);

}

/* posisi awal semua menumpuk */
.program-link.left,
.program-link.center,
.program-link.right{

    left:50%;
    transform:translateX(-50%) scale(.8);
}

/* saat aktif */
.hero-program-button-wrap.active .program-link{

    opacity:1;
    pointer-events:auto;
}

/* kiri */
.hero-program-button-wrap.active .left{
    transform:
    translateX(-520px)
    scale(1);
}
/* tengah */
.hero-program-button-wrap.active .center{
    transform:
    translateX(-50%)
    scale(1);
}
/* kanan */
.hero-program-button-wrap.active .right{
    transform:
    translateX(320px)
    scale(1);
}

/* sembunyikan tombol utama */
.hero-program-button-wrap.active .hero-program-main-btn{
    opacity:0;
    pointer-events:none;
    transform:translateX(-50%) scale(.8);
}

.hero-program-main-btn{
    background:
    linear-gradient(
        135deg,
         #EF4525,
         #662316
    );

    color:#111;

    font-weight:700;

    border:none;

    box-shadow:
    0 15px 35px
    #98331f50;

}
.hero-program-main-btn:hover{

    transform:
    translateX(-50%)
    translateY(-4px);

    box-shadow:
    0 25px 50px
    #ef472572;

}

.services-expand{

    display:flex;

    height:650px;

    overflow:hidden;
}

.service-panel{

    flex:1;

    position:relative;

    cursor:pointer;

    transition:
    flex .7s cubic-bezier(.22,.61,.36,1);
}

.service-panel.active{

    flex:3;
}

.service-bg{
    position:absolute;
    inset:0;
    overflow:hidden;
}

.service-bg img{

    width:100%;
    height:100%;

    object-fit:cover;
}

.service-overlay{

    position:absolute;
    inset:0;

    background:
    linear-gradient(
        180deg,
        rgba(0,0,0,.2),
        rgba(0,0,0,.75)
    );
}

.service-label{

    position:absolute;

    top:50%;
    left:50%;

    transform:
    translate(-50%,-50%)
    rotate(-90deg);

    color:white;

    font-size:26px;
    font-weight:800;

    letter-spacing:2px;

    transition:.4s;
}

.service-content{

    position:absolute;

    left:60px;
    bottom:60px;

    max-width:500px;

    color:white;

    opacity:0;

    transform:
    translateY(30px);

    transition:.5s;
}

.service-panel.active .service-content{

    opacity:1;

    transform:
    translateY(0);
}

.service-panel.active .service-label{

    opacity:0;
}
.service-panel:hover .service-bg img{

    transform:scale(1.08);
}

.service-bg img{

    transition:1.5s ease;
}
.service-content h2{

    font-size:48px;
    line-height:1.1;
}
.service-content a{
    display:inline-flex;

    padding:14px 28px;

    border-radius:999px;

    background:#EF4525;

    color:black;

    text-decoration:none;

    font-weight:700;
}

.featured-event{

    position:relative;

    height:700px;

    overflow:hidden;
}

.featured-event-bg{

    position:absolute;

    inset:0;
}

.featured-event-bg img{

    width:100%;
    height:100%;

    object-fit:cover;
}

.featured-event-overlay{

    position:absolute;

    inset:0;

    background:
    linear-gradient(
        90deg,
        rgba(0,0,0,.85),
        rgba(0,0,0,.3)
    );
}
.featured-event-content{

    position:relative;

    z-index:5;

    max-width:650px;

    padding-top:180px;

    color:white;
}

.featured-event-content span{

    color:#EF4525;

    text-transform:uppercase;

    letter-spacing:4px;
}

.featured-event-content h2{

    font-size:72px;

    line-height:1.1;

    margin:20px 0;
}

.featured-event-content p{

    font-size:20px;

    opacity:.85;
}