:root{
  --burgundy: #7b001c;
  --orange: #ff7a00;
  --sea: #0077b6;
}

.site-header { width: 100%; position: relative; z-index: 30; }
.site-header--overlap { margin-bottom: -28px; }
.site-navbar {
  background: var(--burgundy);
  min-height: 138px;
  padding-top: 8px;
  padding-bottom: 14px;
  overflow: visible;
  box-shadow: 0 12px 28px rgba(0,0,0,.18);
}

.site-logo,
.site-logo2{
  max-height: 156px;
  max-width: 320px;
  height: auto;
  width: auto;
  display: block;
}

.site-navbar-wrap{ align-items:center; }
.site-brand{ position:relative; z-index:3; }
.site-brand img,
.site-brand--right img{ transform: translateY(18px); }
.site-nav-menu{
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 999px;
  padding: 8px 12px;
  backdrop-filter: blur(6px);
  box-shadow: 0 10px 24px rgba(0,0,0,.12);
}
.navbar .nav-link {
  color: rgba(255,255,255,.96);
  font-weight: 700;
  padding: 10px 18px;
  border-radius: 999px;
  white-space: nowrap;
  transition: background .2s ease, color .2s ease, transform .2s ease;
}
.navbar .nav-link:hover,
.navbar .nav-link:focus {
  color: #fff;
  text-decoration: none;
  background: rgba(255,255,255,.16);
  transform: translateY(-1px);
}
.navbar .nav-link.active {
  color: #fff;
  background: rgba(255,255,255,.2);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.12);
}

.hero-slider { background: #fff; }
.hero-img { height: 500px; object-fit: cover; background: #fff; }

.section-bar{ padding: 10px 14px; border-radius: 12px; font-weight: 800; letter-spacing: .2px; color: #fff; text-align: center; }
.section-bar--orange{ background: var(--orange); }
.section-bar--burgundy{ background: var(--burgundy); }

.tile { border-radius: 14px; overflow: hidden; }
.tile--imageonly { background: transparent; }
.tile--imageonly img{ width: 100%; height: auto; display: block; object-fit: contain; background: transparent; }
.tile-link { display: block; text-decoration: none; }

.feature-img { border-radius: 14px; display:block; width:100%; height:auto; }

.banner-img { border-radius: 14px; height: 220px; object-fit: cover; display:block; width:100%; }
.banner-img--plain { background: transparent; }
.member-banner-img { width: 460px; max-width: 100%; margin: 0 auto; height: auto; object-fit: contain; }

.sube-section { background: var(--sea); padding: 18px 0; }
.sube-img { height: 420px; object-fit: cover; display:block; margin: 0 auto; max-width: 100%; }

.footer-main { background: #000; color: rgba(255,255,255,.85); }
.footer-title { color: #fff; font-weight: 800; }
.footer-logo { max-height: 90px; max-width: 260px; height: auto; width: auto; display: block; }
.footer-text { font-size: 14px; line-height: 1.6; }
.footer-links a { color: rgba(255,255,255,.85); text-decoration: none; }
.footer-links a:hover { color: #fff; text-decoration: underline; }
.social { color: rgba(255,255,255,.85); }
.social:hover { color: #fff; }
.footer-bottom { border-top: 1px solid rgba(255,255,255,.12); }
.sdm { color: rgba(255,255,255,.85); text-decoration: none; }
.sdm:hover { color: #fff; text-decoration: underline; }

.detail-hero{ max-height: 560px; object-fit: cover; }

.wa-float{
  position:fixed; right:22px; bottom:22px; width:62px; height:62px; border-radius:50%; display:grid; place-items:center;
  background:#25D366; color:#fff; font-size:2rem; box-shadow:0 18px 35px rgba(37,211,102,.35); z-index:999; text-decoration:none;
  transition:transform .2s ease, box-shadow .2s ease;
}
.wa-float:hover{transform:translateY(-3px) scale(1.03); color:#fff; box-shadow:0 22px 40px rgba(37,211,102,.45);}


.contact-info-card{ height: 100%; }
.contact-info-list{ display:flex; flex-direction:column; gap:14px; }
.contact-info-item{ display:flex; align-items:flex-start; gap:14px; padding:12px 14px; border-radius:14px; background:#f8f9fa; }
.contact-info-icon{ width:38px; height:38px; border-radius:50%; display:grid; place-items:center; background:var(--burgundy); color:#fff; flex:0 0 38px; }
.contact-info-item a{ color:inherit; text-decoration:none; }
.contact-info-item a:hover{ text-decoration:underline; }

.detail-image-wrap{ display:flex; justify-content:center; align-items:center; padding:24px 24px 8px; }
.detail-inline-image{ display:block; max-width:100%; width:auto; height:auto; object-fit:contain; }
.detail-image-wrap--post .detail-inline-image{ max-width:100%; }

@media (max-width: 991.98px){
  .site-navbar{ min-height:auto; padding-bottom:10px; }
  .site-brand img,
  .site-brand--right img{ transform:none; }
  .site-nav-menu{ border-radius:24px; margin-top:12px; }
}
