:root{
  --mandiri-navy:#00285E;
  --mandiri-blue:#003D79;
  --mandiri-blue-2:#0A5CA8;
  --mandiri-blue-light:#3F86D6;
  --mandiri-gold:#FFC72C;
  --mandiri-gold-deep:#E8A400;
  --ink:#0A2540;
  --bg-cream:#F4F8FC;
  --white:#ffffff;
  --radius:14px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-family:'Inter',sans-serif;
  color:var(--ink);
  background:var(--bg-cream);
  padding-top:76px;
}
h1,h2,h3,h4,.display-font{font-family:'Poppins',sans-serif;font-weight:700;}
.eyebrow{
  font-family:'Oswald',sans-serif;
  letter-spacing:.18em;
  text-transform:uppercase;
  font-size:.78rem;
  font-weight:600;
  color:var(--mandiri-gold-deep);
}
.scoreboard-num{font-family:'Oswald',sans-serif;font-weight:700;}
a{text-decoration:none;}
.btn-gold{
  background:var(--mandiri-gold);
  border:none;
  color:var(--mandiri-navy);
  font-weight:700;
  border-radius:50px;
  padding:.7rem 1.9rem;
  transition:.25s;
}
.btn-gold:hover{background:var(--mandiri-gold-deep);color:var(--mandiri-navy);transform:translateY(-2px);}
.btn-outline-light-custom{
  border:2px solid rgba(255,255,255,.75);
  color:#fff;
  border-radius:50px;
  padding:.65rem 1.8rem;
  font-weight:600;
  transition:.25s;
}
.btn-outline-light-custom:hover{background:#fff;color:var(--mandiri-blue);}

/* ===== NAVBAR ===== */
.navbar-mandiri{
  background:var(--mandiri-navy);
  box-shadow:0 2px 18px rgba(0,20,50,.25);
}
.navbar-mandiri .navbar-brand{font-family:'Poppins',sans-serif;font-weight:800;color:#fff;font-size:1.25rem;}
.navbar-mandiri .navbar-brand span{color:var(--mandiri-gold);}
.navbar-mandiri .nav-link{color:rgba(255,255,255,.85)!important;font-weight:500;font-size:.94rem;margin:0 .1rem;}
.navbar-mandiri .nav-link:hover, .navbar-mandiri .nav-link.active{color:var(--mandiri-gold)!important;}

/* ===== HERO / SLIDER ===== */
.hero-slide{
  /*height:100vh;
  min-height:560px;*/
  position:relative;
  display:flex;
  align-items:center;
  background-size:cover;
  background-position:center;
  overflow:hidden;
  aspect-ratio: 16/9;
}
.hero-slide::before{
  content:"";
  position:absolute;inset:0;
  background-color: rgba(0,61,121,.85);
  /*background:linear-gradient(120deg, rgba(0,40,94,.94) 0%, rgba(0,61,121,.85) 45%, rgba(10,92,168,.55) 100%);*/
}
.hero-slide-1{background-image:url('/assets/images/hero-maf-landscape-3.jpg');}
.hero-slide-2{background-image:url('/assets/images/hero-maf-landscape-3.jpg');}
.hero-slide-3{background-image:url('/assets/images/hero-maf-landscape-3.jpg');}
.hero-content{position:relative;z-index:2;color:#fff;}
.hero-content h1{font-size:clamp(2rem,5vw,3.6rem);line-height:1.08;}
.hero-content p.lead{color:rgba(255,255,255,.88);max-width:560px;}
.hero-ribbon{
  position:absolute;
  right:-60px;top:60px;
  width:260px;height:70px;
  background:var(--mandiri-gold);
  transform:rotate(35deg);
  box-shadow:0 10px 30px rgba(0,0,0,.25);
  z-index:1;
}
.carousel-indicators [data-bs-target]{
  background-color:var(--mandiri-gold);
  width:34px;height:4px;border-radius:2px;
}
.hero-stat-strip{
  background:var(--mandiri-gold);
  color:var(--mandiri-navy);
}
.hero-stat-strip .stat-num{font-family:'Oswald',sans-serif;font-weight:700;font-size:2rem;}
.hero-stat-strip .stat-label{font-size:.8rem;font-weight:600;letter-spacing:.03em;}

/* ===== SECTION GENERIC ===== */
section{scroll-margin-top:0px;}
.section-pad{padding:5.5rem 0;}
.bg-navy{background:var(--mandiri-navy);color:#fff;}
.bg-blue-soft{background:linear-gradient(180deg,#eef5fc 0%, var(--bg-cream) 100%);}
.divider-gold{width:64px;height:5px;background:var(--mandiri-gold);border-radius:3px;}

/* ===== ABOUT ===== */
.about-figure{
  border-radius:var(--radius);
  overflow:hidden;
  box-shadow:0 20px 45px rgba(0,40,94,.18);
}
.icon-chip{
  width:52px;height:52px;border-radius:12px;
  background:rgba(10,92,168,.1);
  color:var(--mandiri-blue-2);
  display:flex;align-items:center;justify-content:center;
  font-size:1.4rem;
}

/* ===== SYARAT ===== */
.accordion-mandiri .accordion-button{
  font-weight:600;color:var(--mandiri-navy);
  background:#fff;
}
.accordion-mandiri .accordion-button:not(.collapsed){
  background:var(--mandiri-blue);color:#fff;
}
.accordion-mandiri .accordion-button:not(.collapsed)::after{
  filter:brightness(0) invert(1);
}
.accordion-mandiri .accordion-button:focus{box-shadow:none;border-color:var(--mandiri-blue);}

/* ===== CABANG OLAHRAGA/SENI ===== */
.branch-card{
  background:#fff;
  border-radius:var(--radius);
  padding:1.8rem 1.4rem;
  text-align:center;
  height:100%;
  border:1px solid #e6edf5;
  transition:.25s;
  cursor: pointer;
}
.branch-card:hover{transform:translateY(-6px);box-shadow:0 16px 34px rgba(0,40,94,.14);border-color:transparent;background: #c7e5f7;}
.branch-icon{
  width:64px;
  display:flex;align-items:center;justify-content:center;
  font-size:1.7rem;margin:0 auto 1rem;
}
.branch-card.seni .branch-icon{background:var(--mandiri-gold);color:var(--mandiri-navy);}
.branch-tag{font-size:.72rem;letter-spacing:.08em;font-weight:600;color:#7a8aa0;text-transform:uppercase;}

/* ===== SCOREBOARD (Signature element) ===== */
.scoreboard-wrap{
  background:var(--mandiri-navy);
  border-radius:20px;
  padding:0;
  overflow:hidden;
  box-shadow:0 25px 60px rgba(0,20,50,.35);
  position:relative;
}
.scoreboard-wrap::after{
  content:"";position:absolute;top:0;right:0;width:140px;height:100%;
  background:linear-gradient(120deg, transparent 40%, rgba(255,199,44,.08) 100%);
  pointer-events:none;
}
.scoreboard-header{
  background:var(--mandiri-gold);
  color:var(--mandiri-navy);
  padding:.9rem 1.6rem;
  font-family:'Oswald',sans-serif;
  letter-spacing:.12em;
  font-weight:600;
  font-size:.85rem;
  text-transform:uppercase;
}
.score-table{width:100%;color:#fff;border-collapse:collapse;}
.score-table th{
  font-family:'Oswald',sans-serif;
  font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;
  color:rgba(255,255,255,.55);
  padding:1rem 1.4rem .5rem;
  text-align:center;
  border-bottom:1px solid rgba(255,255,255,.1);
}
.score-table th:first-child, .score-table td:first-child{text-align:left;}
.score-table td{padding:1rem 1.4rem;border-bottom:1px solid rgba(255,255,255,.07);vertical-align:middle;}
.score-table tr:last-child td{border-bottom:none;}
.rank-badge{
  width:34px;height:34px;border-radius:8px;
  display:inline-flex;align-items:center;justify-content:center;
  font-family:'Oswald',sans-serif;font-weight:700;
  background:rgba(255,255,255,.08);color:#fff;
}
.rank-badge.rank-1{background:var(--mandiri-gold);color:var(--mandiri-navy);}
.rank-badge.rank-2{background:#C8D3E0;color:var(--mandiri-navy);}
.rank-badge.rank-3{background:#CD8A4E;color:#fff;}
.medal-count{font-family:'Oswald',sans-serif;font-weight:600;font-size:1.15rem;}
.medal-dot{width:10px;height:10px;border-radius:50%;display:inline-block;margin-right:6px;}
.dot-gold{background:var(--mandiri-gold);}
.dot-silver{background:#C8D3E0;}
.dot-bronze{background:#CD8A4E;}
.scoreboard-updated{
  font-size:.78rem;color:rgba(255,255,255,.45);padding:.9rem 1.6rem;
  border-top:1px solid rgba(255,255,255,.08);
}

/* ===== INFO LOMBA ===== */
.info-card{
  background:#fff;border-radius:var(--radius);
  padding:1.8rem;height:100%;
  border-left:5px solid var(--mandiri-gold);
  box-shadow:0 10px 30px rgba(0,40,94,.06);
}

/* ===== JADWAL (tabs) ===== */
.nav-jadwal .nav-link{
  border-radius:50px;font-weight:600;color:var(--mandiri-navy);
  padding:.55rem 1.4rem;border:1px solid #d7e3f0;margin-right:.5rem;margin-bottom:.5rem;
}
.nav-jadwal .nav-link.active{background:var(--mandiri-blue);color:#fff;border-color:var(--mandiri-blue);}
.table-jadwal thead{background:var(--mandiri-blue);color:#fff;}
.table-jadwal{border-radius:var(--radius);overflow:hidden;}
.badge-cabang{background:rgba(10,92,168,.1);color:var(--mandiri-blue-2);font-weight:600;padding:.4em .7em;}

/* ===== KONTAK ===== */
.contact-panel{
  background:var(--mandiri-blue);
  color:#fff;border-radius:var(--radius);
  padding:2.2rem;
}
.contact-item i{color:var(--mandiri-gold);font-size:1.25rem;width:32px;}
.form-control-mandiri{border-radius:10px;border:1px solid #d7e3f0;padding:.7rem 1rem;}
.form-control-mandiri:focus{border-color:var(--mandiri-blue-2);box-shadow:0 0 0 .2rem rgba(10,92,168,.15);}

/* ===== FOOTER ===== */
footer{background:var(--mandiri-navy);color:rgba(255,255,255,.7);}
footer a{color:rgba(255,255,255,.7);}
footer a:hover{color:var(--mandiri-gold);}
footer h6{color:#fff;font-family:'Poppins',sans-serif;}

@media (max-width:767.98px){
  .hero-slide{height:auto;padding:4rem 0;}
  .section-pad{padding:3.5rem 0;}
  .score-table th, .score-table td{padding:.7rem .8rem;font-size:.9rem;}
}