/* ==========================================================================
   GAZA DEMOCRATIC FRONT - 03 HEADER & FOOTER
   Header: a slim charcoal utility line (election date, contacts, Donate),
   then a white bar - crest and wordmark left, one calm navigation row with
   described dropdown panels, and the slanted red Join button. On scroll the
   utility line tucks away and the bar slims, gaining a soft shadow.
   ========================================================================== */
.gdf-header { position: sticky; top: 0; z-index: 100; background: #fff; transition: box-shadow .2s; }
.gdf-header.is-condensed { box-shadow: 0 6px 24px rgba(0, 0, 0, .1); }

/* ---- Utility line ---- */
.gdf-util { background: #161614; color: #c9c5bb; font: 400 .8125rem/1 var(--gdf-ui); max-height: 40px; overflow: hidden; transition: max-height .25s ease; }
.gdf-header.is-condensed .gdf-util { max-height: 0; }
.gdf-util__row { display: flex; align-items: center; justify-content: space-between; gap: var(--s5); min-height: 38px; }
.gdf-util a { color: #e9e6df; text-decoration: none; }
.gdf-util a:hover { color: #fff; }
.gdf-util__vote { display: inline-flex; align-items: center; gap: 8px; }
.gdf-util__vote strong { color: var(--gdf-gold); font-weight: 600; }
.gdf-util__dot { width: 7px; height: 7px; border-radius: 50%; background: var(--gdf-red); box-shadow: 0 0 0 3px rgba(198, 7, 18, .25); }
.gdf-util__sep { color: #6f6b62; }
.gdf-util .gdf-topbar__days { color: #c9c5bb; }
.gdf-util .gdf-topbar__days::before { content: "\00b7"; margin: 0 8px; color: #6f6b62; }
.gdf-util__right { display: flex; align-items: center; gap: var(--s5); }
.gdf-util .gdf-hero2__icons { gap: 6px; }
.gdf-util .gdf-hero2__icons a { width: 24px; height: 24px; background: transparent; color: #c9c5bb; }
.gdf-util .gdf-hero2__icons a:hover { color: #fff; background: rgba(255, 255, 255, .08); }
.gdf-util .gdf-hero2__icons svg { width: 13px; height: 13px; }
.gdf-util__donate { color: var(--gdf-gold) !important; font-weight: 600; padding-left: var(--s5); border-left: 1px solid #34332f; }

/* ---- Main bar ---- */
.gdf-bar { border-bottom: 1px solid #e6e2d8; }
.gdf-bar__row { display: flex; align-items: center; gap: var(--s5); min-height: 84px; transition: min-height .2s ease; }
.gdf-header.is-condensed .gdf-bar__row { min-height: 66px; }

.gdf-brand { display: flex; align-items: center; gap: 12px; margin-right: auto; text-decoration: none; color: var(--gdf-black); }
.gdf-brand img { width: 56px; height: 56px; transition: width .2s, height .2s; }
.gdf-header.is-condensed .gdf-brand img { width: 46px; height: 46px; }
.gdf-brand__text { display: flex; flex-direction: column; gap: 3px; }
.gdf-brand__text strong { font: 600 1.1875rem/1 var(--gdf-head); letter-spacing: .03em; text-transform: uppercase; white-space: nowrap; }
.gdf-brand__text em { font: italic 400 .9375rem/1 var(--gdf-body); color: var(--gdf-red); }

.gdf-nav__list { display: flex; align-items: center; list-style: none; margin: 0; padding: 0; }
.gdf-nav__item { position: relative; }
.gdf-nav__link {
  position: relative; display: flex; align-items: center; gap: 6px; padding: 30px 13px; white-space: nowrap;
  font: 500 .9375rem/1 var(--gdf-ui); color: #2f2d29; text-decoration: none; transition: color .15s, padding .2s;
}
.gdf-header.is-condensed .gdf-nav__link { padding-top: 22px; padding-bottom: 22px; }
.gdf-nav__link::after { content: ""; position: absolute; left: 13px; right: 13px; bottom: 20px; height: 2px; background: var(--gdf-gold); transform: scaleX(0); transform-origin: left; transition: transform .2s; }
.gdf-header.is-condensed .gdf-nav__link::after { bottom: 14px; }
.gdf-nav__link:hover { color: var(--gdf-black); }
.gdf-nav__link:hover::after { transform: scaleX(1); }
.gdf-nav__link[aria-current], .gdf-nav__link[data-active] { color: var(--gdf-black); font-weight: 600; }
.gdf-nav__link[aria-current]::after, .gdf-nav__link[data-active]::after { background: var(--gdf-red); transform: scaleX(1); }
.gdf-nav__caret { width: 8px; height: 5px; fill: currentColor; opacity: .5; }

/* Dropdown panel: described links + a featured election card */
.gdf-mega {
  position: absolute; top: 100%; left: -16px; display: grid; grid-template-columns: minmax(0, 1fr) 200px; gap: var(--s4);
  width: 560px; padding: var(--s4); background: #fff; border: 1px solid #e6e2d8; border-top: 2px solid var(--gdf-red);
  box-shadow: 0 22px 48px rgba(0, 0, 0, .14); opacity: 0; visibility: hidden; transform: translateY(6px);
  transition: opacity .15s, transform .15s, visibility .15s;
}
.gdf-nav__item:nth-last-child(-n+3) .gdf-mega { left: auto; right: -16px; }
.gdf-mega__links { display: grid; gap: 2px; }
.gdf-mega__link { display: block; padding: 10px 12px; border-radius: 3px; text-decoration: none; color: var(--gdf-black); }
.gdf-mega__link strong { display: block; font: 600 .9375rem/1.3 var(--gdf-ui); }
.gdf-mega__link span { display: block; margin-top: 2px; font: 400 .8125rem/1.35 var(--gdf-ui); color: var(--gdf-muted); }
.gdf-mega__link:hover { background: #f6f3ec; }
.gdf-mega__link:hover strong { color: var(--gdf-red); }
.gdf-mega__link[aria-current] { background: #f6f3ec; }
.gdf-mega__link[aria-current] strong { color: var(--gdf-red); }
.gdf-mega__feature { display: flex; flex-direction: column; justify-content: flex-end; gap: 4px; padding: var(--s4); background: #161614; color: #fff; text-decoration: none; border-radius: 3px; }
.gdf-mega__feature img { width: 64px; margin-bottom: auto; }
.gdf-mega__flabel { font: 500 .625rem/1.3 var(--gdf-head); letter-spacing: .16em; text-transform: uppercase; color: var(--gdf-gold); }
.gdf-mega__feature strong { font: 600 1.125rem/1.15 var(--gdf-head); text-transform: uppercase; }
.gdf-mega__fcta { margin-top: 6px; font: 500 .8125rem/1 var(--gdf-ui); color: #e9e6df; text-decoration: underline; text-underline-offset: 3px; }
.gdf-nav__item:hover .gdf-mega, .gdf-nav__item:focus-within .gdf-mega { opacity: 1; visibility: visible; transform: none; }
.gdf-no-hover .gdf-nav__item:hover .gdf-mega, .gdf-nav__item.is-dismissed .gdf-mega { opacity: 0; visibility: hidden; }

.gdf-bar__join { flex: 0 0 auto; }

/* ---- Menu button + mobile panel ---- */
.gdf-menubtn {
  display: none; align-items: center; gap: 10px; min-height: 44px; padding: 8px 14px;
  border: 1px solid #d8d3c7; border-radius: var(--gdf-radius); background: #fff; color: var(--gdf-black); cursor: pointer;
  font: 600 .875rem/1 var(--gdf-ui);
}
.gdf-menubtn__bars { width: 18px; display: grid; gap: 4px; }
.gdf-menubtn__bars span { height: 2px; background: var(--gdf-black); }

.gdf-mobile {
  position: fixed; left: 0; right: 0; bottom: 0; top: var(--gdf-mobile-top, 110px); z-index: 99; overflow-y: auto;
  background: #fff; color: var(--gdf-black); padding: var(--s3) var(--gdf-gutter) var(--s7); display: none; border-top: 1px solid #e6e2d8;
}
.gdf-mobile.is-open { display: block; }
.gdf-mobile__group { border-bottom: 1px solid #ece8de; }
.gdf-mobile__top {
  display: flex; width: 100%; justify-content: space-between; align-items: center; min-height: 56px; padding: 0;
  background: none; border: 0; color: var(--gdf-black); text-decoration: none; cursor: pointer; text-align: left;
  font: 600 1.0625rem/1.2 var(--gdf-ui);
}
.gdf-mobile__top svg { width: 11px; height: 7px; fill: var(--gdf-red); }
.gdf-mobile__top[aria-expanded="true"] svg { transform: rotate(180deg); }
.gdf-mobile__sub { display: none; padding: 0 0 var(--s3); }
.gdf-mobile__sub.is-open { display: block; }
.gdf-mobile__sub a { display: block; padding: 10px 0 10px var(--s4); color: var(--gdf-muted); text-decoration: none; font-family: var(--gdf-ui); }
.gdf-mobile__cta { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s3); margin: var(--s5) 0; }
.gdf-mobile__cta .gdf-tagbtn { justify-content: center; }
.gdf-mobile__contact { color: var(--gdf-muted); font-family: var(--gdf-ui); line-height: 2; }
.gdf-mobile__contact a { color: var(--gdf-black); }
.gdf-mobile .gdf-social a { color: var(--gdf-red); }

@media (max-width: 1280px) { .gdf-nav__link { padding-left: 9px; padding-right: 9px; } .gdf-nav__link::after { left: 9px; right: 9px; } }
@media (max-width: 1160px) {
  .gdf-nav { display: none; }
  .gdf-menubtn { display: inline-flex; }
  .gdf-bar__row { min-height: 70px; }
}
@media (max-width: 760px) {
  .gdf-util__right a:not(.gdf-util__donate), .gdf-util .gdf-hero2__icons { display: none; }
  .gdf-util__donate { border-left: 0; padding-left: 0; }
  .gdf-bar .gdf-bar__join { display: none; }
  .gdf-brand img { width: 44px; height: 44px; }
  .gdf-brand__text strong { font-size: 1rem; }
  .gdf-brand__text em { font-size: .8125rem; }
}
@media (max-width: 480px) { .gdf-util .gdf-wd, .gdf-util .gdf-topbar__days { display: none; } }

/* ==========================================================================
   FOOTER
   ========================================================================== */
.gdf-footer { background: var(--gdf-black); color: #bdb8ad; font: 400 .9375rem/1.6 var(--gdf-ui); }
.gdf-footer a { color: #f1eee6; text-decoration: none; }
.gdf-footer a:hover { color: var(--gdf-gold); }

.gdf-footer__top {
  display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: var(--s5);
  padding: var(--s7) 0 var(--s6); border-bottom: 1px solid var(--gdf-gold-line);
}
.gdf-footer__top > img { width: 88px; height: 88px; }
.gdf-footer__name { margin: 0; font: 600 1.75rem/1.1 var(--gdf-head); text-transform: uppercase; color: #fff; letter-spacing: .02em; }
.gdf-footer__slogan { margin: 6px 0 0; color: var(--gdf-gold); font: italic 400 1.0625rem/1.4 var(--gdf-body); }
.gdf-footer__vote { display: flex; align-items: center; gap: var(--s3); color: #fff; font: 500 1rem/1.25 var(--gdf-head); text-transform: uppercase; letter-spacing: .08em; }
.gdf-footer__vote img { width: 96px; }
.gdf-footer__vote strong { display: block; color: var(--gdf-gold); font-size: 1.35rem; font-weight: 600; }

.gdf-footer__cols { display: grid; grid-template-columns: repeat(3, 1fr) 1.25fr; gap: var(--s6); padding: var(--s7) 0 var(--s6); }
.gdf-footer__title {
  display: flex; width: 100%; justify-content: space-between; align-items: center; padding: 0; margin: 0 0 var(--s4);
  background: none; border: 0; text-align: left; cursor: default; color: var(--gdf-gold);
  font: 500 .875rem/1.2 var(--gdf-head); letter-spacing: .18em; text-transform: uppercase;
}
.gdf-footer__title svg { display: none; width: 12px; height: 8px; fill: none; stroke: currentColor; stroke-width: 2; }
.gdf-footer__list { list-style: none; padding: 0; margin: 0; }
.gdf-footer__list li { margin-bottom: 8px; }
.gdf-footer__contact p { margin: 0 0 var(--s3); }
.gdf-footer .gdf-social a { color: var(--gdf-gold); }

.gdf-footer__bar {
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--s2) var(--s5);
  padding: var(--s4) 0 var(--s5); border-top: 1px solid var(--gdf-rule-dark); font-size: .8125rem; color: #8f8a80;
}

@media (max-width: 960px) { .gdf-footer__cols { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) {
  .gdf-footer__top { grid-template-columns: auto 1fr; }
  .gdf-footer__top > img { width: 64px; height: 64px; }
  .gdf-footer__vote { grid-column: 1 / -1; }
  .gdf-footer__cols { grid-template-columns: 1fr; gap: 0; padding: var(--s3) 0 var(--s5); }
  .gdf-footer__cols > div { border-bottom: 1px solid var(--gdf-rule-dark); }
  .gdf-footer__title { min-height: 52px; margin: 0; cursor: pointer; }
  .gdf-footer__title svg { display: block; }
  .gdf-footer__title[aria-expanded="true"] svg { transform: rotate(180deg); }
  .gdf-footer__title + .gdf-footer__list { display: none; padding-bottom: var(--s3); }
  .gdf-footer__title[aria-expanded="true"] + .gdf-footer__list { display: block; }
  .gdf-footer__title--static { padding-top: var(--s4); margin-bottom: var(--s2); min-height: 0; }
  .gdf-footer__contact { padding-bottom: var(--s4); }
}
