/* ==========================================================================
   TDSA PUBLIC WEBSITE — PROFESSIONAL DESIGN SYSTEM
   Tanzania Dental Students' Association
   Deep Blue / Gold / White / Soft Gray
   Bootstrap 5.3 compatible
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Poppins:wght@500;600;700;800&display=swap');

:root {
  --tdsa-blue-deep: #082844;
  --tdsa-blue: #0f3d68;
  --tdsa-blue-light: #eaf3f9;
  --tdsa-blue-mid: #185987;
  --tdsa-gold: #d6a62a;
  --tdsa-gold-dark: #b88716;
  --tdsa-gold-light: #f8edc9;
  --tdsa-ink: #172331;
  --tdsa-gray: #667585;
  --tdsa-gray-light: #f7f9fb;
  --tdsa-border: #e4eaf0;
  --tdsa-white: #fff;
  --tdsa-success: #247a55;
  --tdsa-danger: #b43a3a;
  --tdsa-shadow-xs: 0 2px 8px rgba(8,40,68,.05);
  --tdsa-shadow-sm: 0 8px 24px rgba(8,40,68,.07);
  --tdsa-shadow-md: 0 16px 42px rgba(8,40,68,.10);
  --tdsa-shadow-lg: 0 24px 65px rgba(8,40,68,.14);
  --tdsa-radius-sm: 8px;
  --tdsa-radius: 14px;
  --tdsa-radius-lg: 20px;
  --font-display: 'Poppins', sans-serif;
  --font-body: 'Inter', sans-serif;
  --tdsa-transition: 220ms cubic-bezier(.2,.7,.2,1);
}

/* ============================== BASE ============================== */
html { scroll-behavior: smooth; scroll-padding-top: 90px; }
body {
  margin: 0;
  font-family: var(--font-body);
  color: var(--tdsa-ink);
  background: var(--tdsa-white);
  font-size: 15px;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
img { max-width: 100%; height: auto; }
a { color: var(--tdsa-blue); text-decoration: none; transition: color var(--tdsa-transition); }
a:hover { color: var(--tdsa-gold-dark); }
::selection { color: #fff; background: var(--tdsa-blue); }
h1,h2,h3,h4,h5,h6 { margin-top: 0; color: var(--tdsa-blue-deep); font-family: var(--font-display); font-weight: 700; line-height: 1.2; letter-spacing: -.025em; }
p:last-child { margin-bottom: 0; }
.text-gold { color: var(--tdsa-gold) !important; }
.text-light-50 { color: rgba(255,255,255,.72) !important; }
.text-muted { color: var(--tdsa-gray) !important; }
.bg-light-section { background: var(--tdsa-gray-light); }
.bg-surface { background: var(--tdsa-gray-light) !important; }
.bg-primary-section { background: linear-gradient(135deg,var(--tdsa-blue-deep),var(--tdsa-blue)); }
.bg-gold { background: var(--tdsa-gold) !important; }

/* ============================== TOP BAR ============================== */
.top-strip {
  min-height: 36px;
  display: flex;
  align-items: center;
  background: var(--tdsa-blue-deep);
  color: rgba(255,255,255,.82);
  font-size: .76rem;
}
.top-strip .container { min-height: 36px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.top-strip i { color: var(--tdsa-gold); }
.top-strip a { color: rgba(255,255,255,.86); }
.top-strip a:hover { color: var(--tdsa-gold); }

/* ============================== HEADER ============================== */
.site-header {
  position: sticky;
  top: 0;
  z-index: 1030;
  width: 100%;
  min-height: 82px;
  background: rgba(255,255,255,.97);
  border-bottom: 1px solid rgba(8,40,68,.08);
  box-shadow: 0 5px 24px rgba(8,40,68,.055);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}
.site-header > .container { min-height:82px; display:flex; align-items:center; }
.site-header .tdsa-brand { display:inline-flex; align-items:center; gap:12px; margin:0; padding:0; flex:0 0 auto; color:var(--tdsa-blue-deep); text-decoration:none; }
.site-header .tdsa-logo { width:54px; height:54px; max-width:54px; max-height:54px; flex:0 0 54px; display:block; object-fit:contain; }
.tdsa-brand-text { display:flex; flex-direction:column; justify-content:center; line-height:1.05; }
.tdsa-acronym { margin-bottom:3px; color:var(--tdsa-gold-dark); font-family:var(--font-display); font-size:.62rem; font-weight:800; letter-spacing:.18em; text-transform:uppercase; }
.tdsa-full-name { color:var(--tdsa-blue-deep); font-family:var(--font-display); font-size:.94rem; font-weight:700; line-height:1.25; white-space:nowrap; }
.navbar-brand .brand-text,.brand-name { color:var(--tdsa-blue-deep); font-family:var(--font-display); font-weight:700; }
.tdsa-logo-badge { width:44px; height:44px; display:inline-flex; align-items:center; justify-content:center; border-radius:10px; background:linear-gradient(135deg,var(--tdsa-blue-deep),var(--tdsa-blue-mid)); color:var(--tdsa-gold); font-family:var(--font-display); font-weight:800; font-size:.8rem; }
.site-header .navbar-collapse { margin-left:auto; }
.site-header .navbar-nav { display:flex; align-items:center; gap:2px; }
.site-header .nav-link { position:relative; min-height:82px; display:flex; align-items:center; padding:0 .62rem !important; color:var(--tdsa-blue-deep) !important; font-size:.79rem; font-weight:600; white-space:nowrap; transition:color var(--tdsa-transition),background var(--tdsa-transition); }
.site-header .nav-link:hover { color:var(--tdsa-gold-dark) !important; }
.site-header .nav-link.active { color:var(--tdsa-gold-dark) !important; }
.site-header .nav-link.active::after { content:""; position:absolute; left:50%; bottom:12px; width:22px; height:3px; border-radius:20px; background:var(--tdsa-gold); transform:translateX(-50%); }
.site-header .dropdown-menu { min-width:225px; margin-top:4px; padding:7px; border:1px solid var(--tdsa-border); border-radius:12px; background:#fff; box-shadow:var(--tdsa-shadow-md); }
.site-header .dropdown-item { padding:.62rem .75rem; border-radius:8px; color:var(--tdsa-blue-deep); font-size:.79rem; font-weight:500; }
.site-header .dropdown-item:hover,.site-header .dropdown-item:focus { color:var(--tdsa-gold-dark); background:var(--tdsa-gray-light); }
.tdsa-nav-cta { margin-left:9px; }
.tdsa-join-btn { min-height:42px; display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:0 16px; border:1px solid var(--tdsa-gold); border-radius:8px; background:var(--tdsa-gold); color:var(--tdsa-blue-deep) !important; font-size:.77rem; font-weight:800; white-space:nowrap; box-shadow:0 7px 18px rgba(214,166,42,.18); transition:transform var(--tdsa-transition),background var(--tdsa-transition),box-shadow var(--tdsa-transition); }
.tdsa-join-btn:hover { background:var(--tdsa-gold-dark); border-color:var(--tdsa-gold-dark); color:#fff !important; transform:translateY(-2px); box-shadow:0 11px 24px rgba(8,40,68,.13); }
.tdsa-join-btn i { transition:transform var(--tdsa-transition); }
.tdsa-join-btn:hover i { transform:translateX(3px); }
.site-header .navbar-toggler { padding:.45rem .6rem; border:1px solid var(--tdsa-border); border-radius:8px; box-shadow:none !important; }
.site-header .navbar-toggler:focus { box-shadow:0 0 0 3px rgba(15,61,104,.10) !important; }

/* ============================== BUTTONS ============================== */
.btn { min-height:42px; display:inline-flex; align-items:center; justify-content:center; gap:8px; border-radius:8px; font-weight:700; transition:transform var(--tdsa-transition),background var(--tdsa-transition),border-color var(--tdsa-transition),color var(--tdsa-transition),box-shadow var(--tdsa-transition); }
.btn:hover { transform:translateY(-1px); }
.btn-gold { background:var(--tdsa-gold); border-color:var(--tdsa-gold); color:var(--tdsa-blue-deep); box-shadow:0 7px 18px rgba(214,166,42,.15); }
.btn-gold:hover { background:var(--tdsa-gold-dark); border-color:var(--tdsa-gold-dark); color:#fff; }
.btn-primary { background:var(--tdsa-blue); border-color:var(--tdsa-blue); }
.btn-primary:hover { background:var(--tdsa-blue-deep); border-color:var(--tdsa-blue-deep); }
.btn-outline-primary { color:var(--tdsa-blue); border-color:var(--tdsa-blue); }
.btn-outline-primary:hover { color:#fff; background:var(--tdsa-blue); border-color:var(--tdsa-blue); }

/* ============================== HERO ============================== */
.hero-section { position:relative; overflow:hidden; min-height:540px; display:flex; align-items:center; padding:72px 0; color:#fff; background:radial-gradient(circle at 88% 18%,rgba(214,166,42,.18),transparent 22%),radial-gradient(circle at 12% 85%,rgba(24,89,135,.45),transparent 30%),linear-gradient(135deg,#071f37 0%,var(--tdsa-blue-deep) 46%,var(--tdsa-blue) 100%); }
.hero-section::before { content:""; position:absolute; inset:0; opacity:.30; background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px); background-size:42px 42px; pointer-events:none; }
.hero-section > * { position:relative; z-index:1; }
.hero-section h1,.hero-section h2,.hero-section h3 { color:#fff; }
.hero-section p { color:rgba(255,255,255,.78); max-width:680px; }
.hero-section .btn { min-height:50px; padding-left:1.25rem; padding-right:1.25rem; }
.hero-stats-card { padding:1.35rem; border:1px solid rgba(255,255,255,.14); border-radius:var(--tdsa-radius-lg); background:rgba(255,255,255,.075); box-shadow:0 22px 55px rgba(0,0,0,.13); backdrop-filter:blur(12px); }
.stat-item { position:relative; padding:.75rem 1rem; }
.stat-item + .stat-item::before { content:""; position:absolute; left:0; top:15%; width:1px; height:70%; background:rgba(255,255,255,.13); }
.stat-num { margin-bottom:3px; color:var(--tdsa-gold); font-family:var(--font-display); font-size:clamp(1.7rem,3vw,2.5rem); font-weight:800; line-height:1; }
.stat-label { color:rgba(255,255,255,.68); font-size:.73rem; font-weight:500; }
.page-hero { padding:72px 0; color:#fff; background:radial-gradient(circle at 85% 20%,rgba(214,166,42,.16),transparent 25%),linear-gradient(135deg,var(--tdsa-blue-deep),var(--tdsa-blue)); }
.page-hero h1 { color:#fff; }
.page-hero p { color:rgba(255,255,255,.72); max-width:720px; }

/* ============================== SECTIONS ============================== */
.section-padding { padding:88px 0; }
.section-padding-sm { padding:64px 0; }
.section-kicker { display:inline-flex; align-items:center; gap:9px; margin-bottom:12px; color:var(--tdsa-gold-dark); font-size:.72rem; font-weight:800; letter-spacing:.13em; text-transform:uppercase; }
.section-kicker::before { content:""; width:26px; height:2px; background:var(--tdsa-gold); }
.section-title { margin-bottom:14px; color:var(--tdsa-blue-deep); font-size:clamp(1.75rem,3vw,2.55rem); font-weight:800; }
.section-title::after { content:""; display:block; width:44px; height:3px; margin-top:13px; border-radius:20px; background:var(--tdsa-gold); }
.section-title.text-center::after { margin-left:auto; margin-right:auto; }
.section-lead { max-width:720px; color:var(--tdsa-gray); font-size:1rem; }

/* ============================== CARDS ============================== */
.card,.tdsa-card { border:1px solid var(--tdsa-border); border-radius:var(--tdsa-radius); box-shadow:var(--tdsa-shadow-xs); transition:transform var(--tdsa-transition),box-shadow var(--tdsa-transition),border-color var(--tdsa-transition); }
.card:hover,.tdsa-card:hover { border-color:rgba(15,61,104,.12); box-shadow:var(--tdsa-shadow-sm); }
.card { overflow:hidden; }
.card-header { padding:1rem 1.2rem; border-bottom:1px solid var(--tdsa-border); background:var(--tdsa-gray-light); color:var(--tdsa-blue-deep); font-family:var(--font-display); font-weight:700; }
.card-body { padding:1.35rem; }
.card-title { color:var(--tdsa-blue-deep); font-weight:700; }
.card-text { color:var(--tdsa-gray); }
.value-card { height:100%; padding:1.6rem; text-align:center; border:1px solid var(--tdsa-border); border-radius:var(--tdsa-radius); background:#fff; box-shadow:var(--tdsa-shadow-xs); transition:transform var(--tdsa-transition),border-color var(--tdsa-transition),box-shadow var(--tdsa-transition); }
.value-card:hover { transform:translateY(-5px); border-color:rgba(214,166,42,.45); box-shadow:var(--tdsa-shadow-sm); }
.value-card .icon,.value-icon { width:54px; height:54px; margin:0 auto 1rem; display:inline-flex; align-items:center; justify-content:center; border-radius:14px; background:var(--tdsa-blue-light); color:var(--tdsa-blue); font-size:1.3rem; }
.value-card h3,.value-card h4 { margin-bottom:.55rem; font-size:1.05rem; }
.value-card p { color:var(--tdsa-gray); font-size:.88rem; }

/* ============================== NEWS ============================== */
.news-card { height:100%; overflow:hidden; border:1px solid var(--tdsa-border); border-radius:var(--tdsa-radius); background:#fff; box-shadow:var(--tdsa-shadow-xs); transition:transform var(--tdsa-transition),box-shadow var(--tdsa-transition); }
.news-card:hover { transform:translateY(-5px); box-shadow:var(--tdsa-shadow-md); }
.news-card img { width:100%; height:210px; display:block; object-fit:cover; transition:transform 500ms cubic-bezier(.2,.7,.2,1); }
.news-card:hover img { transform:scale(1.035); }
.news-card .card-body { padding:1.35rem; }
.news-card h3,.news-card h4,.news-card .card-title { margin-bottom:.6rem; font-size:1.08rem; }
.news-meta { color:#8a97a4; font-size:.73rem; font-weight:600; }
.news-excerpt { color:var(--tdsa-gray); font-size:.86rem; }

/* ============================== EVENTS ============================== */
.event-card { height:100%; padding:1.25rem; border:1px solid var(--tdsa-border); border-radius:var(--tdsa-radius); background:#fff; box-shadow:var(--tdsa-shadow-xs); transition:transform var(--tdsa-transition),box-shadow var(--tdsa-transition); }
.event-card:hover { transform:translateY(-4px); box-shadow:var(--tdsa-shadow-sm); }
.event-date-badge { display:inline-flex; align-items:center; justify-content:center; min-width:86px; padding:.38rem .7rem; border-radius:8px; background:var(--tdsa-blue-deep); color:var(--tdsa-gold); font-size:.7rem; font-weight:800; letter-spacing:.03em; text-transform:uppercase; }
.event-card h3,.event-card h4 { margin-top:.8rem; margin-bottom:.5rem; font-size:1.04rem; }
.event-card p { color:var(--tdsa-gray); font-size:.85rem; }

/* ============================== LEADERS / INSTITUTIONS ============================== */
.leader-card { height:100%; padding:1.4rem; text-align:center; border:1px solid var(--tdsa-border); border-radius:var(--tdsa-radius); background:#fff; box-shadow:var(--tdsa-shadow-xs); transition:transform var(--tdsa-transition),box-shadow var(--tdsa-transition); }
.leader-card:hover { transform:translateY(-5px); box-shadow:var(--tdsa-shadow-md); }
.leader-photo { width:112px; height:112px; margin:0 auto 1rem; display:block; object-fit:cover; border:3px solid var(--tdsa-gold); border-radius:50%; box-shadow:0 6px 20px rgba(8,40,68,.10); }
.leader-card h3,.leader-card h4 { margin-bottom:.3rem; font-size:1rem; }
.leader-role { color:var(--tdsa-gold-dark); font-size:.72rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase; }
.institution-card { height:100%; min-height:150px; padding:1.5rem; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; border:1px solid var(--tdsa-border); border-radius:var(--tdsa-radius); background:#fff; transition:transform var(--tdsa-transition),border-color var(--tdsa-transition),box-shadow var(--tdsa-transition); }
.institution-card:hover { transform:translateY(-4px); border-color:rgba(214,166,42,.45); box-shadow:var(--tdsa-shadow-sm); }
.institution-logo { width:auto; max-width:150px; max-height:64px; object-fit:contain; filter:grayscale(12%); transition:filter var(--tdsa-transition),transform var(--tdsa-transition); }
.institution-card:hover .institution-logo { filter:grayscale(0); transform:scale(1.03); }
.institution-name { margin-top:.8rem; color:var(--tdsa-blue-deep); font-size:.78rem; font-weight:700; }

/* ============================== STATS ============================== */
.stat-card { height:100%; padding:1.35rem; border:1px solid var(--tdsa-border); border-radius:var(--tdsa-radius); background:#fff; box-shadow:var(--tdsa-shadow-xs); }
.stat-card .stat-icon { width:44px; height:44px; margin-bottom:1rem; display:inline-flex; align-items:center; justify-content:center; border-radius:12px; background:var(--tdsa-blue-light); color:var(--tdsa-blue); }
.stat-card .number { display:block; color:var(--tdsa-blue-deep); font-family:var(--font-display); font-size:2rem; font-weight:800; line-height:1; }
.stat-card .label { display:block; margin-top:.45rem; color:var(--tdsa-gray); font-size:.76rem; font-weight:600; }

/* ============================== GALLERY ============================== */
.gallery-item { position:relative; overflow:hidden; border-radius:var(--tdsa-radius); background:var(--tdsa-gray-light); box-shadow:var(--tdsa-shadow-xs); }
.gallery-item img { width:100%; height:250px; display:block; object-fit:cover; transition:transform 550ms cubic-bezier(.2,.7,.2,1); }
.gallery-item:hover img { transform:scale(1.045); }
.gallery-overlay { position:absolute; inset:auto 0 0; padding:2.5rem 1rem 1rem; color:#fff; background:linear-gradient(transparent,rgba(0,0,0,.72)); }
.gallery-overlay h3,.gallery-overlay h4 { margin:0; color:#fff; font-size:.95rem; }

/* ============================== FORMS / TABLES ============================== */
.form-label { margin-bottom:.4rem; color:var(--tdsa-blue-deep); font-size:.8rem; font-weight:700; }
.form-control,.form-select { min-height:46px; padding:.65rem .85rem; border:1px solid #dce4eb; border-radius:8px; color:var(--tdsa-ink); font-size:.88rem; box-shadow:none; transition:border-color var(--tdsa-transition),box-shadow var(--tdsa-transition); }
textarea.form-control { min-height:130px; }
.form-control::placeholder { color:#9aa6b2; }
.form-control:focus,.form-select:focus { border-color:var(--tdsa-blue-mid); box-shadow:0 0 0 3px rgba(24,89,135,.10); }
.table { margin-bottom:0; color:var(--tdsa-ink); font-size:.84rem; }
.table thead th { padding:.85rem .8rem; border-bottom:1px solid var(--tdsa-blue-deep); color:var(--tdsa-blue-deep); background:var(--tdsa-gray-light); font-size:.72rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase; }
.table tbody td { padding:.85rem .8rem; border-color:var(--tdsa-border); vertical-align:middle; }
.table-hover tbody tr:hover { background:rgba(15,61,104,.025); }

/* ============================== CONTACT / RESOURCES ============================== */
.contact-card { height:100%; padding:1.5rem; border:1px solid var(--tdsa-border); border-radius:var(--tdsa-radius); background:#fff; box-shadow:var(--tdsa-shadow-xs); }
.contact-icon,.resource-icon { width:48px; height:48px; margin-bottom:1rem; display:inline-flex; align-items:center; justify-content:center; border-radius:12px; color:var(--tdsa-blue); background:var(--tdsa-blue-light); font-size:1.15rem; }
.contact-card h3,.contact-card h4 { margin-bottom:.45rem; font-size:1rem; }
.contact-card p,.contact-card address { color:var(--tdsa-gray); font-size:.83rem; }
.resource-item { display:flex; align-items:center; gap:14px; padding:1rem; border:1px solid var(--tdsa-border); border-radius:10px; background:#fff; transition:transform var(--tdsa-transition),box-shadow var(--tdsa-transition); }
.resource-item:hover { transform:translateY(-2px); box-shadow:var(--tdsa-shadow-sm); }
.resource-icon { width:42px; height:42px; flex:0 0 42px; margin:0; }
.resource-title { margin:0; color:var(--tdsa-blue-deep); font-family:var(--font-display); font-size:.9rem; font-weight:700; }
.resource-meta { color:#8a97a4; font-size:.72rem; }

/* ============================== FOOTER ============================== */
.site-footer { position:relative; padding-top:64px; color:rgba(255,255,255,.72); background:linear-gradient(180deg,#082844 0%,#061e34 100%); }
.site-footer::before { content:""; position:absolute; top:0; left:0; right:0; height:3px; background:linear-gradient(90deg,var(--tdsa-gold),rgba(214,166,42,.25),var(--tdsa-gold)); }
.site-footer h3,.site-footer h4,.site-footer h5 { color:#fff; font-size:.9rem; }
.site-footer p { color:rgba(255,255,255,.66); font-size:.8rem; }
.site-footer a { color:rgba(255,255,255,.68); }
.site-footer a:hover { color:var(--tdsa-gold); }
.footer-links { margin:0; padding:0; list-style:none; }
.footer-links li { margin-bottom:.48rem; }
.footer-links a { font-size:.79rem; }
.footer-brand-logo { max-width:92px; max-height:92px; object-fit:contain; }
.footer-bottom { margin-top:50px; padding:18px 0; border-top:1px solid rgba(255,255,255,.09); color:rgba(255,255,255,.48); font-size:.72rem; }
.social-links { display:flex; align-items:center; gap:7px; }
.social-links a { width:36px; height:36px; display:inline-flex; align-items:center; justify-content:center; border:1px solid rgba(255,255,255,.13); border-radius:50%; color:rgba(255,255,255,.72); }
.social-links a:hover { color:var(--tdsa-blue-deep); background:var(--tdsa-gold); border-color:var(--tdsa-gold); }

/* ============================== UTILITIES ============================== */
.badge { padding:.45em .7em; border-radius:6px; font-weight:700; }
.badge.bg-primary-subtle { color:var(--tdsa-blue) !important; background:var(--tdsa-blue-light) !important; }
.badge-gold { color:var(--tdsa-gold-dark); background:var(--tdsa-gold-light); }
.icon-circle { width:44px; height:44px; display:inline-flex; align-items:center; justify-content:center; border-radius:50%; color:var(--tdsa-blue); background:var(--tdsa-blue-light); }
.gold-line { width:44px; height:3px; border-radius:20px; background:var(--tdsa-gold); }
.hover-lift { transition:transform var(--tdsa-transition),box-shadow var(--tdsa-transition); }
.hover-lift:hover { transform:translateY(-4px); box-shadow:var(--tdsa-shadow-sm); }
.article-content { color:#334352; font-size:.95rem; }
.article-content h2,.article-content h3,.article-content h4 { margin-top:2rem; margin-bottom:.75rem; }
.article-content blockquote { margin:1.5rem 0; padding:1rem 1.25rem; border-left:4px solid var(--tdsa-gold); border-radius:0 8px 8px 0; background:var(--tdsa-gray-light); color:var(--tdsa-blue-deep); font-family:var(--font-display); font-weight:600; }

/* ============================== RESPONSIVE ============================== */
@media (max-width:1199.98px) {
  .site-header .nav-link { padding-left:.45rem !important; padding-right:.45rem !important; font-size:.73rem; }
  .tdsa-full-name { font-size:.83rem; }
}
@media (max-width:991.98px) {
  .site-header,.site-header > .container { min-height:70px; }
  .site-header .navbar-collapse { margin-top:12px; padding:8px 0 18px; border-top:1px solid var(--tdsa-border); }
  .site-header .navbar-nav { align-items:stretch !important; gap:0; }
  .site-header .nav-link { min-height:auto; padding:.78rem 0 !important; border-bottom:1px solid var(--tdsa-border); font-size:.84rem; }
  .site-header .nav-link.active::after { display:none; }
  .site-header .dropdown-menu { min-width:100%; margin:0; padding:5px; border:0; box-shadow:none; background:var(--tdsa-gray-light); }
  .tdsa-nav-cta { margin:14px 0 0; }
  .tdsa-join-btn { width:100%; }
  .section-padding { padding:68px 0; }
  .hero-section { min-height:auto; padding:64px 0; text-align:center; }
  .hero-section p { margin-left:auto; margin-right:auto; }
  .hero-stats-card { margin-top:30px; }
  .stat-item + .stat-item::before { display:none; }
  .page-hero { padding:58px 0; text-align:center; }
}
@media (max-width:575.98px) {
  body { font-size:14px; }
  .top-strip .container { justify-content:center; text-align:center; }
  .top-strip .container > span:first-child { display:none; }
  .site-header .tdsa-logo { width:46px; height:46px; max-width:46px; max-height:46px; flex-basis:46px; }
  .tdsa-brand { gap:9px !important; }
  .tdsa-acronym { font-size:.55rem; }
  .tdsa-full-name { max-width:220px; font-size:.72rem; white-space:normal; }
  .section-padding { padding:56px 0; }
  .hero-section { padding:52px 0; }
  .news-card img { height:190px; }
  .gallery-item img { height:210px; }
  .leader-photo { width:96px; height:96px; }
  .footer-bottom { margin-top:35px; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
}


/* ==========================================================================
   TDSA HOMEPAGE — PROFESSIONAL IMAGE & HERO SYSTEM
   ========================================================================== */

.homepage-hero {
  position: relative;
  overflow: hidden;
  background: var(--tdsa-blue-deep);
}

.homepage-hero .carousel,
.homepage-hero .carousel-inner,
.homepage-hero .carousel-item {
  height: 100%;
}

.hero-slide {
  position: relative;
  min-height: 650px;

  display: flex;
  align-items: center;

  overflow: hidden;

  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

.hero-overlay {
  position: absolute;
  inset: 0;
  z-index: 0;

  background:
    linear-gradient(
      90deg,
      rgba(4,24,43,.95) 0%,
      rgba(7,32,55,.84) 40%,
      rgba(7,32,55,.48) 68%,
      rgba(7,32,55,.28) 100%
    );
}

.hero-content {
  position: relative;
  z-index: 2;
  padding: 76px 0;
}

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

  margin-bottom: 20px;
  padding: 8px 14px;

  border: 1px solid rgba(255,255,255,.18);
  border-radius: 30px;

  color: rgba(255,255,255,.90);
  background: rgba(255,255,255,.08);

  font-size: .67rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;

  backdrop-filter: blur(8px);
}

.hero-badge i {
  color: var(--tdsa-gold);
}

.hero-title {
  max-width: 850px;
  margin-bottom: 20px;

  color: #fff !important;

  font-family: var(--font-display);
  font-size: clamp(2.7rem, 5.1vw, 5rem);
  font-weight: 800;
  line-height: 1.03;
  letter-spacing: -.045em;
}

.hero-title .text-gold {
  color: var(--tdsa-gold) !important;
}

.hero-subtitle {
  max-width: 700px;
  margin-bottom: 0;

  color: rgba(255,255,255,.77) !important;

  font-size: clamp(.94rem, 1.35vw, 1.08rem);
  line-height: 1.75;
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 30px;
}

.hero-actions .btn {
  min-height: 50px;
  padding: 0 20px;
}

.hero-highlights {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  margin-top: 34px;
}

.hero-highlight {
  display: inline-flex;
  align-items: center;
  gap: 8px;

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

  font-size: .74rem;
  font-weight: 600;
}

.hero-highlight i {
  color: var(--tdsa-gold);
  font-size: .95rem;
}

.hero-side-card {
  position: relative;
  z-index: 2;

  width: min(100%, 310px);
  margin-left: auto;
  padding: 28px;

  border: 1px solid rgba(255,255,255,.18);
  border-radius: 18px;

  background: rgba(5,30,51,.54);

  box-shadow: 0 25px 60px rgba(0,0,0,.20);

  backdrop-filter: blur(14px);
}

.hero-side-label {
  display: block;
  margin-bottom: 12px;

  color: var(--tdsa-gold);

  font-size: .67rem;
  font-weight: 800;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.hero-side-card strong {
  display: block;

  color: #fff;

  font-family: var(--font-display);
  font-size: 1.55rem;
  line-height: 1.15;
}

.hero-side-line {
  display: block;

  width: 38px;
  height: 3px;

  margin: 18px 0;

  border-radius: 20px;

  background: var(--tdsa-gold);
}

.hero-side-card small {
  display: block;

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

  font-size: .74rem;
  line-height: 1.6;
}

.homepage-hero .carousel-indicators {
  z-index: 5;
  bottom: 24px;
}

.homepage-hero .carousel-indicators button {
  width: 26px;
  height: 3px;
  margin: 0 4px;

  border: 0;
  border-radius: 10px;

  background: rgba(255,255,255,.45);
}

.homepage-hero .carousel-indicators .active {
  background: var(--tdsa-gold);
}

.homepage-hero .carousel-control-prev,
.homepage-hero .carousel-control-next {
  z-index: 4;
  width: 7%;
  opacity: .65;
}

.homepage-hero .carousel-control-prev:hover,
.homepage-hero .carousel-control-next:hover {
  opacity: 1;
}


/* Professional image panel for the About section */

.about-visual {
  position: relative;
  min-height: 500px;
  overflow: hidden;

  border-radius: 22px;

  background: var(--tdsa-blue-deep);
  box-shadow: var(--tdsa-shadow-lg);
}

.about-visual-image {
  position: absolute;
  inset: 0;

  width: 100%;
  height: 100%;

  display: block;
  object-fit: cover;

  transition: transform 700ms cubic-bezier(.2,.7,.2,1);
}

.about-visual:hover .about-visual-image {
  transform: scale(1.035);
}

.about-visual-overlay {
  position: absolute;
  inset: 0;

  background:
    linear-gradient(
      180deg,
      rgba(5,29,49,.03) 18%,
      rgba(5,29,49,.35) 46%,
      rgba(5,29,49,.95) 100%
    );
}

.about-visual-caption {
  position: absolute;
  z-index: 2;

  left: 28px;
  right: 28px;
  bottom: 28px;
}

.caption-kicker {
  display: inline-block;
  margin-bottom: 9px;

  color: var(--tdsa-gold);

  font-size: .67rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.about-visual-caption h3 {
  margin-bottom: 9px;

  color: #fff;
  font-size: 1.45rem;
  line-height: 1.2;
}

.about-visual-caption p {
  max-width: 560px;
  color: rgba(255,255,255,.72);
  font-size: .82rem;
}

.about-visual-badge {
  position: absolute;
  z-index: 3;

  top: 22px;
  right: 22px;

  display: inline-flex;
  align-items: center;
  gap: 8px;

  padding: 9px 12px;

  border: 1px solid rgba(255,255,255,.18);
  border-radius: 8px;

  color: #fff;
  background: rgba(5,29,49,.55);

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

  backdrop-filter: blur(10px);
}

.about-visual-badge i {
  color: var(--tdsa-gold);
}


/* News / events image treatment */

.card-image-wrapper {
  position: relative;
  overflow: hidden;
  height: 220px;
}

.card-feature-image {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;

  transition: transform 550ms cubic-bezier(.2,.7,.2,1);
}

.content-card:hover .card-feature-image {
  transform: scale(1.035);
}

.card-image-placeholder,
.event-visual {
  height: 220px;

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

  background:
    radial-gradient(circle at 80% 20%, rgba(214,166,42,.18), transparent 25%),
    linear-gradient(135deg, var(--tdsa-blue-deep), var(--tdsa-blue));

  color: var(--tdsa-gold);
}

.event-visual {
  flex-direction: column;
}

.event-month {
  color: rgba(255,255,255,.68);
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.event-visual strong {
  color: #fff;
  font-family: var(--font-display);
  font-size: 3rem;
  line-height: 1;
}

.content-badge {
  display: inline-flex;

  padding: 5px 9px;

  border-radius: 6px;

  color: var(--tdsa-gold-dark);
  background: var(--tdsa-gold-light);

  font-size: .65rem;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.content-link {
  display: inline-flex;
  align-items: center;
  gap: 7px;

  color: var(--tdsa-blue);
  font-size: .78rem;
  font-weight: 800;
}

.event-date {
  color: var(--tdsa-gold-dark);
  font-size: .72rem;
  font-weight: 800;
}


/* Community impact photography */

.impact-card {
  position: relative;
  height: 360px;

  overflow: hidden;
  border-radius: 18px;

  background: var(--tdsa-blue-deep);
  box-shadow: var(--tdsa-shadow-sm);
}

.impact-image {
  width: 100%;
  height: 100%;

  display: block;
  object-fit: cover;

  transition: transform 600ms cubic-bezier(.2,.7,.2,1);
}

.impact-card:hover .impact-image {
  transform: scale(1.045);
}

.impact-overlay {
  position: absolute;
  inset: auto 0 0;

  padding: 70px 22px 22px;

  background: linear-gradient(transparent, rgba(5,29,49,.94));
}

.impact-overlay > span {
  color: var(--tdsa-gold);

  font-size: .67rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.impact-overlay h4 {
  margin: 7px 0 12px;
  color: #fff;
  font-size: 1.15rem;
}


/* Gallery photography */

.gallery-preview {
  position: relative;
  display: block;

  height: 230px;
  overflow: hidden;

  border-radius: 12px;
  background: var(--tdsa-blue-deep);
}

.gallery-preview img {
  width: 100%;
  height: 100%;

  display: block;
  object-fit: cover;

  transition: transform 600ms cubic-bezier(.2,.7,.2,1);
}

.gallery-preview:hover img {
  transform: scale(1.05);
}

.gallery-preview-overlay {
  position: absolute;
  inset: auto 0 0;

  padding: 40px 14px 13px;

  background: linear-gradient(transparent, rgba(0,0,0,.72));
}

.gallery-preview-overlay span {
  color: #fff;
  font-size: .7rem;
  font-weight: 700;
}


/* Responsive */

@media (max-width: 991.98px) {
  .hero-slide {
    min-height: 590px;
  }

  .hero-overlay {
    background:
      linear-gradient(
        90deg,
        rgba(4,24,43,.93),
        rgba(7,32,55,.70)
      );
  }

  .hero-content {
    padding: 58px 0 76px;
  }

  .about-visual {
    min-height: 430px;
  }
}

@media (max-width: 575.98px) {
  .hero-slide {
    min-height: 650px;
  }

  .hero-title {
    font-size: 2.55rem;
  }

  .hero-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .hero-actions .btn {
    width: 100%;
  }

  .hero-highlights {
    gap: 12px 18px;
  }

  .hero-highlight {
    font-size: .68rem;
  }

  .about-visual {
    min-height: 440px;
    border-radius: 16px;
  }

  .about-visual-caption {
    left: 20px;
    right: 20px;
    bottom: 20px;
  }

  .about-visual-caption h3 {
    font-size: 1.2rem;
  }

  .about-visual-badge {
    top: 15px;
    right: 15px;
  }

  .gallery-preview {
    height: 190px;
  }
}