/* ==========================================================================
   GAZA DEMOCRATIC FRONT - 04 HOME PAGE
   Rhythm: black hero > red election > black facts > paper about (photo to
   the edge) > photographic dark band > paper news > charcoal media > paper
   vision > black involve (photo to the edge) > gold donate > green
   Opportunity Ground. Each band has one job.
   ========================================================================== */
.gdf-section { padding: var(--s9) 0; }
.gdf-sechead { display: flex; justify-content: space-between; align-items: flex-end; gap: var(--s4); border-bottom: 1px solid var(--gdf-rule); padding-bottom: var(--s4); margin-bottom: var(--s6); }
.gdf-sechead h2 { margin: 0; }
.gdf-sechead--light { border-bottom-color: var(--gdf-gold-line); }
.gdf-sechead--light h2 { color: #fff; }
.gdf-meta { font: 500 .8125rem/1.3 var(--gdf-head); letter-spacing: .1em; text-transform: uppercase; color: var(--gdf-muted); margin: 0 0 var(--s2); }
.gdf-kicker { font: italic 400 1.0625rem/1.4 var(--gdf-body); color: var(--gdf-gold-light); margin: 0 0 var(--s3); }
.gdf-pull { margin: var(--s5) 0; padding: 0; font: italic 400 clamp(1.3rem, 1.1rem + .8vw, 1.7rem)/1.35 var(--gdf-body); color: var(--gdf-gold-dark); }

/* The left/right edge of the content column, for full-bleed layouts. */
:root { --gdf-edge: max(var(--gdf-gutter), calc((100vw - var(--gdf-max)) / 2 + var(--gdf-gutter))); }

/* --------------------------------------------------------------------------
   1. HERO MOSAIC, full bleed
   -------------------------------------------------------------------------- */
.gdf-hero { background: var(--gdf-night); }
.gdf-mosaic { display: grid; grid-template-columns: 2.1fr 1fr; grid-template-rows: 1fr 1fr; gap: 4px; height: clamp(580px, 80vh, 820px); }
.gdf-mosaic__main { grid-row: 1 / 3; position: relative; overflow: hidden; background: var(--gdf-charcoal); }
.gdf-mosaic__photo { position: absolute; inset: 0; }
.gdf-slides, .gdf-slide { position: absolute; inset: 0; }
.gdf-slide { opacity: 0; transition: opacity 1s ease; }
.gdf-slide.is-active { opacity: 1; }
.gdf-slide img, img.gdf-slide { width: 100%; height: 100%; object-fit: cover; }
/* A slow push-in on the active photograph gives the hero life without
   moving any content. Off for reduced motion. */
.gdf-mosaic__main .gdf-slide.is-active img { animation: gdf-push 12s ease-out both; }
@keyframes gdf-push { from { transform: scale(1.06); } to { transform: scale(1); } }
@media (prefers-reduced-motion: reduce) { .gdf-slide { transition: none; } .gdf-mosaic__main .gdf-slide.is-active img { animation: none; } }

/* Legibility wash: only where the text sits (bottom left). */
.gdf-mosaic__photo::after {
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(to top, rgba(8, 8, 7, .92) 0%, rgba(8, 8, 7, .55) 38%, rgba(8, 8, 7, 0) 70%),
              linear-gradient(to right, rgba(8, 8, 7, .55) 0%, rgba(8, 8, 7, 0) 60%);
}
.gdf-mosaic__copy { position: absolute; z-index: 2; left: var(--gdf-edge); right: 30%; bottom: clamp(40px, 7vh, 80px); color: #e9e5db; }
.gdf-mosaic__copy h1 { font-size: var(--gdf-display); color: #fff; margin-bottom: var(--s4); max-width: 13ch; }
.gdf-mosaic__copy h1 span { color: var(--gdf-gold); }
.gdf-mosaic__sub { font-size: 1.1875rem; line-height: 1.55; max-width: 44ch; margin: 0; }
.gdf-mosaic__copy .gdf-actions { margin-top: var(--s5); }

.gdf-slidectl { position: absolute; z-index: 3; right: var(--s5); bottom: var(--s5); display: flex; gap: 4px; }
.gdf-slidectl button {
  width: 32px; height: 32px; padding: 0; border: 1px solid rgba(255, 255, 255, .45); border-radius: var(--gdf-radius);
  background: rgba(0, 0, 0, .45); color: #fff; font: 500 .8125rem/1 var(--gdf-head); cursor: pointer;
}
.gdf-slidectl button:hover { border-color: var(--gdf-gold); }
.gdf-slidectl button[aria-current="true"] { background: var(--gdf-gold); border-color: var(--gdf-gold); color: var(--gdf-black); }

.gdf-mosaic__og { position: relative; overflow: hidden; display: flex; align-items: flex-end; color: #e3eee5; text-decoration: none; background: var(--gdf-green-deep); }
.gdf-mosaic__ogbg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 70% 40%; transition: transform .6s ease; }
.gdf-mosaic__og::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(to top, rgba(10, 52, 20, .97) 25%, rgba(10, 52, 20, .55) 70%, rgba(10, 52, 20, .2)); }
.gdf-mosaic__og:hover .gdf-mosaic__ogbg { transform: scale(1.04); }
.gdf-mosaic__ogbody { position: relative; z-index: 2; display: grid; gap: var(--s3); padding: var(--s5) clamp(var(--s5), var(--gdf-edge), var(--s7)) var(--s5) var(--s5); }
.gdf-mosaic__oglogo { width: 210px; }
.gdf-mosaic__ogtext { font-size: 1rem; line-height: 1.45; max-width: 34ch; }
.gdf-mosaic__ogcta { font: 500 .9375rem/1 var(--gdf-head); letter-spacing: .1em; text-transform: uppercase; color: var(--gdf-gold-light); }
.gdf-mosaic__ogcta::after { content: " \2192"; }

.gdf-mosaic__community { position: relative; overflow: hidden; display: block; color: #fff; text-decoration: none; }
.gdf-mosaic__community::after { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(to top, rgba(0, 0, 0, .6), transparent 45%); }
.gdf-mosaic__caption {
  position: absolute; z-index: 2; left: var(--s5); bottom: var(--s4);
  font: 500 1rem/1.2 var(--gdf-head); letter-spacing: .12em; text-transform: uppercase;
  border-bottom: 2px solid var(--gdf-gold); padding-bottom: 4px;
}

@media (max-width: 900px) {
  .gdf-mosaic { grid-template-columns: 1fr 1fr; grid-template-rows: auto 260px; height: auto; }
  .gdf-mosaic__main { grid-column: 1 / 3; grid-row: auto; min-height: 560px; }
  .gdf-mosaic__copy { left: var(--gdf-gutter); right: var(--gdf-gutter); }
  .gdf-mosaic__ogbody { padding: var(--s4) var(--gdf-gutter); }
}
@media (max-width: 640px) {
  .gdf-mosaic { grid-template-columns: 1fr; grid-template-rows: auto; }
  .gdf-mosaic__main { grid-column: auto; min-height: 0; height: 88svh; max-height: 720px; }
  .gdf-mosaic__copy h1 { font-size: 2.6rem; }
  .gdf-mosaic__sub { font-size: 1.0625rem; }
  .gdf-mosaic__og { min-height: 300px; }
  .gdf-mosaic__community { aspect-ratio: 3 / 2; }
  .gdf-slidectl { top: var(--s4); bottom: auto; right: var(--gdf-gutter); }
}

/* --------------------------------------------------------------------------
   RIBBON WAVE (no longer used on the home page; kept for build.py's wave())
   -------------------------------------------------------------------------- */
.gdf-wave { position: relative; height: clamp(70px, 10vw, 150px); background: var(--gdf-night); margin-top: -1px; }
.gdf-wave svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.gdf-wave__base { fill: var(--gdf-paper); }
.gdf-wave__red { fill: var(--gdf-red); }
.gdf-wave__gold { fill: var(--gdf-gold); }
.gdf-wave__green { fill: var(--gdf-green); }
.gdf-wave--tored .gdf-wave__base { fill: var(--gdf-red); }
.gdf-wave--tored .gdf-wave__red { fill: #fff; }

/* --------------------------------------------------------------------------
   2. ELECTION
   -------------------------------------------------------------------------- */
.gdf-election { background: var(--gdf-red); color: #fff; padding: var(--s8) 0; }
.gdf-election .gdf-container { display: grid; grid-template-columns: minmax(200px, 340px) 1fr; gap: var(--s7); align-items: center; }
.gdf-election__mark { filter: drop-shadow(0 14px 22px rgba(0, 0, 0, .35)); }
.gdf-election h2 { color: #fff; font-size: var(--gdf-t1); margin-bottom: var(--s5); }
.gdf-label--light { color: #fff; }
.gdf-election .gdf-btn--black:hover { background: #000; }

.gdf-count { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; max-width: 680px; }
.gdf-count__box { background: var(--gdf-black); color: #fff; text-align: center; padding: var(--s4) 4px var(--s3); border-bottom: 3px solid var(--gdf-gold); }
.gdf-count__box span { display: block; font: 500 clamp(2.2rem, 1.3rem + 3vw, 4rem)/1 var(--gdf-head); font-variant-numeric: tabular-nums; }
.gdf-count__box small { display: block; margin-top: 8px; font: 500 .75rem/1 var(--gdf-head); letter-spacing: .2em; text-transform: uppercase; color: var(--gdf-gold-light); }
.gdf-count[hidden] { display: none; }
.gdf-count__done { font: 600 1.6rem/1.2 var(--gdf-head); text-transform: uppercase; margin: 0; }
@media (max-width: 760px) {
  .gdf-election { padding-bottom: var(--s7); }
  .gdf-election .gdf-container { grid-template-columns: 1fr; gap: var(--s4); }
  .gdf-election__mark { width: 190px; }
  .gdf-count { gap: 5px; }
  .gdf-count__box small { letter-spacing: .08em; font-size: .6875rem; }
}

/* --------------------------------------------------------------------------
   3. FACTS
   -------------------------------------------------------------------------- */
.gdf-factband { background: var(--gdf-black); color: #cfcabf; padding: var(--s7) 0; }
.gdf-facts { display: grid; grid-template-columns: repeat(4, 1fr); }
.gdf-facts > div { padding: 0 var(--s5); border-left: 1px solid var(--gdf-gold-line); }
.gdf-facts > div:first-child { padding-left: 0; border-left: 0; }
.gdf-facts strong { display: block; font: 600 clamp(2.6rem, 1.8rem + 2.4vw, 4rem)/1 var(--gdf-head); color: var(--gdf-gold); margin-bottom: var(--s2); }
.gdf-facts span { font-size: .975rem; line-height: 1.45; }
@media (max-width: 860px) {
  .gdf-facts { grid-template-columns: 1fr 1fr; row-gap: var(--s6); }
  .gdf-facts > div:nth-child(3) { padding-left: 0; border-left: 0; }
}

/* --------------------------------------------------------------------------
   4. ABOUT: photograph to the left edge
   -------------------------------------------------------------------------- */
.gdf-about { display: grid; grid-template-columns: 1fr 1fr; align-items: stretch; }
.gdf-about__photo { position: relative; min-height: 560px; }
.gdf-about__photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

.gdf-about__text { padding: var(--s9) var(--gdf-edge) var(--s9) var(--s8); max-width: calc(var(--gdf-max) / 2 + var(--gdf-edge)); }
@media (max-width: 900px) {
  .gdf-about { grid-template-columns: 1fr; }
  .gdf-about__photo { min-height: 0; aspect-ratio: 3 / 2; }
  .gdf-about__photo::after { display: none; }
  .gdf-about__text { padding: var(--s7) var(--gdf-gutter); }
}

/* --------------------------------------------------------------------------
   5. WHAT WE FIGHT FOR: photographic dark band
   -------------------------------------------------------------------------- */
.gdf-fightband { position: relative; overflow: hidden; background: var(--gdf-black); color: #d6d1c6; padding: var(--s9) 0; }
.gdf-fightband__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .28; }
.gdf-fightband::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(to right, rgba(11, 11, 10, .95) 25%, rgba(11, 11, 10, .55)); }
.gdf-fightband .gdf-container { position: relative; z-index: 2; }
.gdf-fightband h2 { color: #fff; }
.gdf-fight { list-style: none; padding: 0; margin: var(--s6) 0; display: grid; grid-template-columns: repeat(5, 1fr); border-top: 1px solid var(--gdf-gold-line); }
.gdf-fight li { padding: var(--s5) var(--s4) var(--s5) 0; border-bottom: 1px solid var(--gdf-gold-line); font-size: 1.0625rem; }
.gdf-fight li + li { padding-left: var(--s4); border-left: 1px solid var(--gdf-gold-line); }
.gdf-fight strong { display: block; font: 600 clamp(1.8rem, 1.3rem + 1.4vw, 2.6rem)/1.05 var(--gdf-head); text-transform: uppercase; color: var(--gdf-gold); margin-bottom: var(--s2); }
.gdf-against { max-width: 72ch; color: #fff; font-size: 1.0625rem; }
.gdf-against span { font: 600 1rem/1 var(--gdf-head); letter-spacing: .1em; text-transform: uppercase; color: #ff7b82; margin-right: 6px; }
@media (max-width: 900px) {
  .gdf-fight { grid-template-columns: 1fr; }
  .gdf-fight li, .gdf-fight li + li { padding: var(--s3) 0; border-left: 0; display: flex; gap: var(--s3); align-items: baseline; }
  .gdf-fight strong { min-width: 5em; margin: 0; font-size: 1.7rem; }
}

/* --------------------------------------------------------------------------
   6. NEWS: lead story and list
   -------------------------------------------------------------------------- */
.gdf-front { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--s7); }
.gdf-lead-story img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; margin-bottom: var(--s4); }
.gdf-lead-story h3 { font: 600 clamp(1.5rem, 1.2rem + 1vw, 2rem)/1.2 var(--gdf-body); }
.gdf-front h3 a, .gdf-stories h3 a { text-decoration: none; }
.gdf-front h3 a:hover, .gdf-stories h3 a:hover { color: var(--gdf-red); }
.gdf-stories { list-style: none; padding: 0; margin: 0; }
.gdf-story { padding: var(--s5) 0; border-bottom: 1px solid var(--gdf-rule); }
.gdf-front .gdf-story:first-child { padding-top: 0; }
.gdf-story p:last-child { margin: 0; color: var(--gdf-muted); }
.gdf-story .gdf-meta { color: var(--gdf-red); }
.gdf-lead-story .gdf-meta { color: var(--gdf-red); }
.gdf-story--img { display: grid; grid-template-columns: 240px 1fr; gap: var(--s5); align-items: start; }
.gdf-story--img img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
@media (max-width: 860px) { .gdf-front { grid-template-columns: 1fr; gap: var(--s4); } .gdf-front .gdf-story:first-child { padding-top: var(--s5); border-top: 1px solid var(--gdf-rule); } }
@media (max-width: 560px) { .gdf-story--img { grid-template-columns: 1fr; gap: var(--s3); } }

/* --------------------------------------------------------------------------
   7. WATCH & FOLLOW (charcoal)
   -------------------------------------------------------------------------- */
.gdf-watch { background: var(--gdf-charcoal); color: #d6d1c6; }
.gdf-watch__grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: var(--s6); align-items: start; }
@media (max-width: 960px) { .gdf-watch__grid { grid-template-columns: 1fr; } }

/* Video: local thumbnail and a play button; the player loads on click. */
.gdf-video { margin: 0; }
.gdf-video__frame, .gdf-video__iframe { display: block; width: 100%; aspect-ratio: 16 / 9; border: 0; background: #000; }
.gdf-video__frame { position: relative; padding: 0; cursor: pointer; overflow: hidden; }
.gdf-video__frame img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.gdf-video__frame:hover img { transform: scale(1.03); }
.gdf-video__play {
  position: absolute; left: 50%; top: 50%; width: 76px; height: 76px; margin: -38px 0 0 -38px; border-radius: 50%;
  background: var(--gdf-red); box-shadow: 0 8px 24px rgba(0, 0, 0, .4);
}
.gdf-video__play::after { content: ""; position: absolute; left: 31px; top: 24px; border-style: solid; border-width: 14px 0 14px 22px; border-color: transparent transparent transparent #fff; }
.gdf-video__frame:hover .gdf-video__play { background: var(--gdf-red-dark); }
.gdf-video figcaption { padding-top: var(--s3); }
.gdf-video figcaption time { display: block; font: 500 .8125rem/1.3 var(--gdf-head); letter-spacing: .1em; text-transform: uppercase; color: var(--gdf-gold); }
.gdf-video figcaption strong { font-weight: 600; font-size: 1.125rem; }
.gdf-video-list { list-style: none; padding: 0; margin: var(--s4) 0 0; border-top: 1px solid var(--gdf-gold-line); }
.gdf-video-list button { width: 100%; text-align: left; padding: var(--s3) 0; background: none; border: 0; border-bottom: 1px solid var(--gdf-rule-dark); color: inherit; cursor: pointer; font: 400 1rem/1.4 var(--gdf-body); }
.gdf-video-list button::before { content: "\25B6"; color: var(--gdf-red); margin-right: 10px; font-size: .75rem; }
.gdf-video-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s5); margin: var(--s4) 0; }
.gdf-video-grid .gdf-video--feature { grid-column: 1 / -1; }
.gdf-prose .gdf-video figcaption time { color: var(--gdf-red); }
@media (max-width: 640px) { .gdf-video-grid { grid-template-columns: 1fr; } }

/* No videos yet: a branded panel, not an empty box. */
.gdf-video-empty { position: relative; overflow: hidden; background: #000; color: #e9e5db; min-height: 360px; display: flex; align-items: flex-end; }
.gdf-video-empty > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .45; }
.gdf-video-empty::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(to top, rgba(0, 0, 0, .9) 30%, rgba(0, 0, 0, .2)); }
.gdf-video-empty__body { position: relative; z-index: 2; padding: var(--s6); max-width: 560px; }
.gdf-video-empty h3 { color: #fff; font: 600 1.75rem/1.15 var(--gdf-head); text-transform: uppercase; }
.gdf-prose .gdf-video-empty a.gdf-btn { color: #fff; }

/* Facebook: a consent gate, then the page plugin. */
.gdf-fb { background: var(--gdf-black); border-top: 3px solid var(--gdf-gold); }
.gdf-fb.is-loaded { min-height: 620px; }
.gdf-prose .gdf-fb a:not(.gdf-btn) { color: var(--gdf-gold-light); }
.gdf-fb.is-loaded { background: #fff; border-top-color: #1877f2; }
.gdf-fb__gate { padding: var(--s6) var(--s5); display: grid; gap: var(--s3); justify-items: start; color: #cfcabf; }
.gdf-fb__gate img { width: 64px; height: 64px; }
.gdf-fb__name { margin: 0; font: 600 1.35rem/1.2 var(--gdf-head); text-transform: uppercase; color: #fff; }
.gdf-fb__name span { display: block; font: italic 400 1rem/1.4 var(--gdf-body); text-transform: none; color: var(--gdf-gold-light); }
.gdf-fb__note { margin: 0; font-size: .9375rem; }
.gdf-fb__iframe { display: block; width: 100%; height: 620px; border: 0; }
.gdf-fb-wrap { max-width: 520px; margin: var(--s4) 0 var(--s5); }

/* --------------------------------------------------------------------------
   8. VISION
   -------------------------------------------------------------------------- */
.gdf-vision { padding-top: var(--s9); overflow: hidden; }
.gdf-vision__grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: var(--s7); align-items: end; }
.gdf-vision__text { padding-bottom: var(--s9); max-width: var(--gdf-text-max); }
.gdf-vision blockquote { margin: 0 0 var(--s5); padding: 0; }
.gdf-vision blockquote p { font: italic 400 1.5rem/1.45 var(--gdf-body); margin: 0 0 var(--s2); }
.gdf-vision blockquote footer { font-size: var(--gdf-ts); color: var(--gdf-muted); }
.gdf-mission { padding-left: 1.2em; margin-bottom: var(--s5); }
.gdf-mission li { margin-bottom: var(--s2); }
.gdf-mission li::marker { font-family: var(--gdf-head); color: var(--gdf-red); }
.gdf-vision__media { position: relative; margin: 0; align-self: stretch; display: flex; align-items: flex-end; min-height: 520px; }
.gdf-vision__media::before { content: ""; position: absolute; top: 0; bottom: 0; left: 18%; right: -60vw; background: var(--gdf-red); clip-path: polygon(22% 0, 100% 0, 100% 100%, 0 100%); }
.gdf-vision__media::after { content: ""; position: absolute; top: 0; bottom: 0; left: 48%; right: -60vw; background: var(--gdf-black); clip-path: polygon(30% 0, 100% 0, 100% 100%, 0 100%); }
.gdf-vision__media img { position: relative; z-index: 1; width: min(86%, 400px); }
.gdf-vision__media figcaption { position: absolute; z-index: 2; left: 0; bottom: var(--s6); background: var(--gdf-black); color: #cfcabf; padding: var(--s3) var(--s4); font-size: var(--gdf-ts); }
.gdf-vision__media figcaption strong { display: block; font: 600 1.1rem/1.2 var(--gdf-head); text-transform: uppercase; color: #fff; }
@media (max-width: 860px) {
  .gdf-vision__grid { grid-template-columns: 1fr; gap: 0; }
  .gdf-vision__text { padding-bottom: var(--s6); }
  .gdf-vision__media { min-height: 400px; }
}

/* --------------------------------------------------------------------------
   9. GET INVOLVED: photograph to the right edge
   -------------------------------------------------------------------------- */
.gdf-involve { display: grid; grid-template-columns: 1fr 1fr; background: var(--gdf-black); color: #cfcabf; }
.gdf-involve__text { padding: var(--s9) var(--s8) var(--s9) var(--gdf-edge); }
.gdf-involve h2 { color: #fff; }
.gdf-involve__list { list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--gdf-gold-line); }
.gdf-involve__list a { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: var(--s4); padding: var(--s4) 0; border-bottom: 1px solid var(--gdf-rule-dark); text-decoration: none; }
.gdf-involve__list strong { font: 500 1.2rem/1.25 var(--gdf-head); letter-spacing: .04em; text-transform: uppercase; color: #fff; }
.gdf-involve__list span { font-size: .975rem; }
.gdf-involve__list a:hover strong { color: var(--gdf-gold); }
.gdf-involve__photo { position: relative; min-height: 560px; }
.gdf-involve__photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 960px) {
  .gdf-involve { grid-template-columns: 1fr; }
  .gdf-involve__text { padding: var(--s7) var(--gdf-gutter); }
  .gdf-involve__photo { min-height: 0; aspect-ratio: 3 / 2; order: -1; }
  .gdf-involve__list a { grid-template-columns: 1fr; gap: 4px; }
}

/* --------------------------------------------------------------------------
   10. DONATE: the one gold band on the page
   -------------------------------------------------------------------------- */
.gdf-donate { background: var(--gdf-gold); color: var(--gdf-black); padding: var(--s7) 0; }
.gdf-donate__row { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: var(--s6); align-items: center; }
.gdf-donate h2 { margin-bottom: var(--s2); }
.gdf-donate p { margin: 0; max-width: 54ch; }
.gdf-amounts { display: flex; flex-wrap: wrap; gap: var(--s2); }
.gdf-amounts button {
  min-height: 52px; padding: 10px 20px; background: transparent; border: 2px solid var(--gdf-black); border-radius: var(--gdf-radius);
  font: 500 1.125rem/1 var(--gdf-head); letter-spacing: .03em; color: var(--gdf-black); cursor: pointer;
}
.gdf-amounts button:hover, .gdf-amounts button[aria-pressed="true"] { background: var(--gdf-black); color: var(--gdf-gold); }
@media (max-width: 860px) { .gdf-donate__row { grid-template-columns: 1fr; gap: var(--s4); } }

/* --------------------------------------------------------------------------
   11. OPPORTUNITY GROUND (green belongs to this product)
   -------------------------------------------------------------------------- */
.gdf-og { background: var(--gdf-green-deep); color: #e3eee5; }
.gdf-og__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: stretch; max-width: none; padding: 0; }
.gdf-og__text { padding: var(--s8) var(--s7) var(--s8) var(--gdf-edge); }
.gdf-og__text > img { width: 250px; margin-bottom: var(--s5); }
.gdf-og__lead { font: 500 1.5rem/1.35 var(--gdf-body); color: #fff; }
.gdf-og__photo { width: 100%; height: 100%; object-fit: cover; object-position: 72% 50%; }
@media (max-width: 860px) {
  .gdf-og__grid { grid-template-columns: 1fr; }
  .gdf-og__text { padding: var(--s7) var(--gdf-gutter); }
  .gdf-og__photo { aspect-ratio: 3 / 2; height: auto; }
}

/* --------------------------------------------------------------------------
   HERO ELECTION TILE (top right of the mosaic)
   An event card: black panel, red rule, the gold X as a badge, the date as
   the main element, a quiet countdown and one clear action.
   -------------------------------------------------------------------------- */
.gdf-mosaic__vote {
  display: flex; align-items: center; background: var(--gdf-charcoal); color: #fff;
  border-top: 4px solid var(--gdf-red); padding: var(--s5) clamp(var(--s5), var(--gdf-edge), var(--s7)) var(--s5) var(--s6);
}
.gdf-ev { width: 100%; max-width: 420px; }
.gdf-ev__head { display: flex; align-items: center; gap: var(--s4); padding-bottom: var(--s4); border-bottom: 1px solid var(--gdf-rule-dark); }
.gdf-ev__mark { width: 64px; height: auto; flex: 0 0 64px; }
.gdf-ev__label { margin: 0 0 2px; font: 500 .75rem/1.3 var(--gdf-head); letter-spacing: .16em; text-transform: uppercase; color: var(--gdf-gold); }
.gdf-ev__title { margin: 0; color: #fff; font-size: 1.75rem; line-height: 1; }
.gdf-ev__date { margin: var(--s4) 0 var(--s4); font: 600 clamp(1.6rem, 1.2rem + 1vw, 2.1rem)/1.05 var(--gdf-head); text-transform: uppercase; letter-spacing: .01em; color: #fff; }
.gdf-ev__date span { display: block; margin-bottom: 4px; font: 400 .9375rem/1.3 var(--gdf-body); text-transform: none; letter-spacing: 0; color: var(--gdf-on-dark); }

/* Countdown: numerals with hairline dividers, no boxes. */
.gdf-mosaic__vote .gdf-count { grid-template-columns: repeat(4, 1fr); gap: 0; max-width: none; }
.gdf-mosaic__vote .gdf-count__box { background: none; border: 0; border-left: 1px solid var(--gdf-rule-dark); padding: 2px 0 2px var(--s3); text-align: left; }
.gdf-mosaic__vote .gdf-count__box:first-child { border-left: 0; padding-left: 0; }
.gdf-mosaic__vote .gdf-count__box span { font: 500 clamp(1.7rem, 1.3rem + 1vw, 2.3rem)/1 var(--gdf-head); color: #fff; }
.gdf-mosaic__vote .gdf-count__box small { margin-top: 6px; font: 400 .75rem/1 var(--gdf-ui); letter-spacing: .02em; text-transform: none; color: var(--gdf-on-dark); }
.gdf-mosaic__vote .gdf-count__done { font: 600 1.15rem/1.3 var(--gdf-head); text-transform: uppercase; color: #fff; }

.gdf-ev__cta {
  display: flex; align-items: center; justify-content: space-between; gap: var(--s3); margin-top: var(--s5);
  padding: 13px 18px; background: var(--gdf-red); color: #fff; text-decoration: none; border-radius: var(--gdf-radius);
  font: 500 .9375rem/1.2 var(--gdf-head); letter-spacing: .06em; text-transform: uppercase; transition: background-color .15s;
}
.gdf-ev__cta::after { content: "\2192"; font-size: 1.1rem; }
.gdf-ev__cta:hover { background: var(--gdf-red-dark); }

@media (max-width: 1200px) and (min-width: 901px) {
  .gdf-mosaic__vote { padding-left: var(--s5); }
  .gdf-ev__mark { width: 52px; flex-basis: 52px; }
}
@media (max-width: 900px) { .gdf-mosaic__vote { padding: var(--s6) var(--gdf-gutter); } .gdf-ev { max-width: 460px; } }

/* --------------------------------------------------------------------------
   GAZA ON YOUTUBE STRIP (below the hero)
   -------------------------------------------------------------------------- */
.gdf-vstrip { background: var(--gdf-black); color: var(--gdf-on-dark); padding: var(--s7) 0 var(--s8); }
.gdf-vstrip__head { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: var(--s5); margin-bottom: var(--s5); }
.gdf-vstrip__head .gdf-label { flex-basis: 100%; margin-bottom: var(--s2); }
.gdf-vstrip__head h2 { color: #fff; margin: 0 auto 0 0; }
.gdf-vstrip__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s5); }
.gdf-vstrip .gdf-video figcaption strong { color: #fff; }
.gdf-vstrip__empty {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: var(--s5); align-items: center;
  padding: var(--s5) var(--s6); background: var(--gdf-charcoal); border-radius: 6px;
}
.gdf-vstrip__empty h3 { color: #fff; font: 600 1.35rem/1.2 var(--gdf-head); text-transform: uppercase; margin-bottom: 4px; }
.gdf-vstrip__empty p { margin: 0; max-width: 60ch; }
.gdf-vstrip__icon { position: relative; width: 64px; height: 46px; border-radius: 12px; background: var(--gdf-red); }
.gdf-vstrip__icon::after { content: ""; position: absolute; left: 26px; top: 14px; border-style: solid; border-width: 9px 0 9px 15px; border-color: transparent transparent transparent #fff; }
@media (max-width: 860px) {
  .gdf-vstrip__grid { grid-template-columns: 1fr; }
  .gdf-vstrip__empty { grid-template-columns: 1fr; padding: var(--s5); }
  .gdf-vstrip__empty .gdf-btn { justify-self: start; }
}

/* --------------------------------------------------------------------------
   FOLLOW (Facebook and social)
   -------------------------------------------------------------------------- */
.gdf-follow { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: var(--s8); align-items: start; }
.gdf-follow h2 { color: #fff; }
.gdf-follow .gdf-social { margin: var(--s5) 0; gap: var(--s3); }
.gdf-follow .gdf-social a { display: inline-block; padding: 10px 18px; border: 1px solid var(--gdf-gold-line); color: #fff; font: 500 .9375rem/1 var(--gdf-head); letter-spacing: .08em; text-transform: uppercase; }
.gdf-follow .gdf-social a:hover { border-color: var(--gdf-gold); color: var(--gdf-gold); text-decoration: none; }
.gdf-follow__more { margin: 0; }
@media (max-width: 960px) { .gdf-follow { grid-template-columns: 1fr; gap: var(--s6); } }

/* --------------------------------------------------------------------------
   FULL-WIDTH HERO (no side cards)
   -------------------------------------------------------------------------- */
.gdf-mosaic--full { grid-template-columns: 1fr; grid-template-rows: 1fr; width: 100%; gap: 0;
  /* Fill the screen below the sticky header (red line 36px + bar 82px) and leave the gold strip just in view. */
  height: max(560px, calc(100svh - 118px - 112px)); }
.gdf-mosaic--full .gdf-mosaic__main { grid-row: auto; grid-column: auto; }
.gdf-mosaic--full .gdf-mosaic__copy { right: auto; max-width: 720px; }
@media (max-width: 900px) { .gdf-mosaic--full { height: auto; } .gdf-mosaic--full .gdf-mosaic__main { grid-column: auto; min-height: 600px; } }
@media (max-width: 640px) { .gdf-mosaic--full .gdf-mosaic__main { min-height: 0; } }

/* --------------------------------------------------------------------------
   ELECTION STRIP (directly below the hero)
   Gold field, black type: identity | countdown | action.
   -------------------------------------------------------------------------- */
.gdf-elect { background: var(--gdf-gold); color: var(--gdf-black); border-bottom: 1px solid #b8922f; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25); }
.gdf-elect__row { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: var(--s6); min-height: 112px; padding-top: var(--s4); padding-bottom: var(--s4); }
.gdf-elect__id { display: flex; align-items: center; gap: var(--s4); }
.gdf-elect__id { gap: var(--s5); }
.gdf-elect__id img { width: 88px; height: 88px; flex: 0 0 88px; border-radius: 50%; box-shadow: 0 0 0 2px rgba(11, 11, 10, .55), 0 6px 16px rgba(60, 44, 6, .35); }
@media (max-width: 640px) { .gdf-elect__id img { width: 76px; height: 76px; flex-basis: 76px; } }
.gdf-elect__label { margin: 0 0 4px; font: 500 .75rem/1.2 var(--gdf-head); letter-spacing: .18em; text-transform: uppercase; color: #4a3a0c; }
.gdf-elect__title { margin: 0; font: 600 1.875rem/1 var(--gdf-head); text-transform: uppercase; letter-spacing: .01em; }
.gdf-elect__title em { display: block; margin-top: 6px; font: italic 400 1rem/1.2 var(--gdf-body); text-transform: none; letter-spacing: 0; color: #3a2d0a; }

.gdf-elect__count { text-align: center; }
.gdf-elect__countlabel { margin: 0 0 6px; font: 500 .6875rem/1 var(--gdf-head); letter-spacing: .2em; text-transform: uppercase; color: #4a3a0c; }
.gdf-elect .gdf-count { display: flex; justify-content: center; gap: 0; max-width: none; }
.gdf-elect .gdf-count__box { background: none; border: 0; border-left: 1px solid rgba(11, 11, 10, .2); padding: 0 var(--s5); min-width: 0; text-align: center; color: var(--gdf-black); }
.gdf-elect .gdf-count__box:first-child { border-left: 0; }
.gdf-elect .gdf-count__box span { font: 600 2.5rem/1 var(--gdf-head); color: var(--gdf-black); font-variant-numeric: tabular-nums; }
.gdf-elect .gdf-count__box small { margin-top: 4px; font: 400 .8125rem/1 var(--gdf-ui); letter-spacing: 0; text-transform: none; color: #3a2d0a; }
.gdf-elect .gdf-count__done { font: 600 1.35rem/1.2 var(--gdf-head); text-transform: uppercase; margin: 0; }

.gdf-elect__cta {
  justify-self: end; display: inline-flex; align-items: center; gap: var(--s3); padding: 15px 26px; background: var(--gdf-black); color: #fff;
  text-decoration: none; border-radius: var(--gdf-radius); white-space: nowrap;
  font: 500 1rem/1 var(--gdf-head); letter-spacing: .08em; text-transform: uppercase; transition: background-color .15s;
}
.gdf-elect__cta::after { content: "\2192"; color: var(--gdf-gold); font-size: 1.1rem; }
.gdf-elect__cta:hover { background: var(--gdf-coal); }

@media (max-width: 1100px) {
  .gdf-elect__row { grid-template-columns: 1fr auto; }
  .gdf-elect__count { grid-column: 1 / -1; grid-row: 2; }
}
@media (max-width: 640px) {
  .gdf-elect__row { grid-template-columns: 1fr; justify-items: center; text-align: center; gap: var(--s4); padding-top: var(--s5); padding-bottom: var(--s5); }
  .gdf-elect__id { flex-direction: column; gap: var(--s2); }
  .gdf-elect__count { grid-column: auto; grid-row: auto; }
  .gdf-elect .gdf-count__box { padding: 0 var(--s3); }
  .gdf-elect .gdf-count__box span { font-size: 2.1rem; }
  .gdf-elect__cta { justify-self: stretch; justify-content: center; }
}

/* --------------------------------------------------------------------------
   HERO TEXT: one row along the bottom of the photograph, aligned to the
   page column. Headline left; paragraph and actions right, on a baseline.
   -------------------------------------------------------------------------- */
.gdf-mosaic--full .gdf-mosaic__photo::after {
  background: linear-gradient(to top, rgba(8, 8, 7, .94) 0%, rgba(8, 8, 7, .7) 26%, rgba(8, 8, 7, .15) 55%, rgba(8, 8, 7, 0) 70%);
}
.gdf-mosaic--full .gdf-mosaic__copy {
  left: var(--gdf-edge); right: var(--gdf-edge); bottom: clamp(36px, 6vh, 64px); max-width: none;
  display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: var(--s7); align-items: end;
}
.gdf-mosaic--full .gdf-mosaic__copy h1 { font-size: clamp(2.4rem, 1.5rem + 3.2vw, 4.6rem); max-width: 15ch; margin: 0; }
.gdf-mosaic--full .gdf-kicker { margin-bottom: var(--s3); }
.gdf-mosaic__side { padding-left: 0; }
.gdf-mosaic--full .gdf-mosaic__sub { font-size: 1.125rem; max-width: 40ch; }
.gdf-mosaic--full .gdf-mosaic__copy .gdf-actions { margin-top: var(--s4); }
.gdf-mosaic--full .gdf-slidectl { top: var(--s5); bottom: auto; right: var(--gdf-edge); }

@media (max-width: 960px) {
  .gdf-mosaic--full .gdf-mosaic__copy { grid-template-columns: 1fr; gap: var(--s4); left: var(--gdf-gutter); right: var(--gdf-gutter); }
  .gdf-mosaic__side { padding-left: 0; border-left: 0; }
  .gdf-mosaic--full .gdf-slidectl { right: var(--gdf-gutter); }
}
@media (max-width: 640px) {
  .gdf-mosaic--full .gdf-mosaic__copy { bottom: var(--s6); }
  .gdf-mosaic--full .gdf-mosaic__copy h1 { font-size: 2.5rem; }
  .gdf-mosaic--full .gdf-mosaic__sub { font-size: 1rem; }
  .gdf-mosaic--full .gdf-mosaic__photo::after { background: linear-gradient(to top, rgba(8, 8, 7, .95) 0%, rgba(8, 8, 7, .75) 40%, rgba(8, 8, 7, .1) 75%); }
}

/* --------------------------------------------------------------------------
   HERO (light panel + brush-blended photographs)
   The message sits on a warm paper panel with a faint grey copy of a crowd
   photograph behind it. The rotating photographs fill the right side and
   meet the panel along a painted, splattered brush edge (an SVG mask).
   -------------------------------------------------------------------------- */
.gdf-hero2 { position: relative; overflow: hidden; background: #f6f3ec; min-height: max(560px, calc(100svh - 118px - 112px)); display: flex; align-items: center; }
.gdf-hero2__ghost { position: absolute; inset: 0; pointer-events: none; }
.gdf-hero2__ghost img { width: 100%; height: 100%; object-fit: cover; object-position: 30% 50%; filter: grayscale(1) contrast(.9) brightness(1.1); opacity: .16; }
.gdf-hero2__ghost::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to right, rgba(246, 243, 236, .55) 0%, rgba(246, 243, 236, 0) 55%); }

.gdf-hero2__photo {
  position: absolute; top: 0; right: 0; bottom: 0; width: 64%;
  -webkit-mask-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 1000" preserveAspectRatio="none"%3E%3Cdefs%3E%3Cfilter id="b" x="-20%" y="-20%" width="140%" height="140%"%3E%3CfeTurbulence type="fractalNoise" baseFrequency="0.035 0.012" numOctaves="3" seed="5"/%3E%3CfeDisplacementMap in="SourceGraphic" scale="55" xChannelSelector="R" yChannelSelector="G"/%3E%3CfeGaussianBlur stdDeviation="1.4"/%3E%3C/filter%3E%3C/defs%3E%3Cg filter="url(%23b)"%3E%3Cpolygon points="261,0 269,10 279,20 277,30 280,40 283,50 278,60 281,70 281,80 281,90 270,100 270,110 266,120 274,130 273,140 266,150 280,160 283,170 283,180 288,190 287,200 291,210 302,220 300,230 305,240 307,250 305,260 310,270 307,280 308,290 298,300 294,310 285,320 280,330 271,340 262,350 265,360 260,370 255,380 251,390 245,400 244,410 245,420 244,430 254,440 251,450 257,460 252,470 259,480 256,490 243,500 242,510 245,520 234,530 233,540 219,550 209,560 209,570 204,580 193,590 187,600 188,610 195,620 193,630 187,640 192,650 195,660 199,670 213,680 211,690 220,700 223,710 223,720 231,730 225,740 231,750 224,760 226,770 221,780 219,790 226,800 222,810 215,820 223,830 216,840 221,850 231,860 234,870 234,880 253,890 251,900 260,910 274,920 275,930 281,940 284,950 287,960 296,970 292,980 296,990 292,1000 1000,1000 1000,0" fill="white"/%3E%3Crect x="114" y="453" width="172" height="25" rx="13" fill="white" fill-opacity="0.59"/%3E%3Crect x="177" y="867" width="109" height="10" rx="5" fill="white" fill-opacity="0.80"/%3E%3Crect x="155" y="818" width="116" height="11" rx="5" fill="white" fill-opacity="0.69"/%3E%3Crect x="48" y="940" width="261" height="10" rx="5" fill="white" fill-opacity="0.78"/%3E%3Crect x="149" y="604" width="100" height="14" rx="7" fill="white" fill-opacity="0.27"/%3E%3Crect x="101" y="963" width="214" height="11" rx="5" fill="white" fill-opacity="0.40"/%3E%3Crect x="137" y="824" width="136" height="18" rx="9" fill="white" fill-opacity="0.36"/%3E%3Crect x="126" y="720" width="123" height="7" rx="4" fill="white" fill-opacity="0.59"/%3E%3Crect x="148" y="852" width="133" height="18" rx="9" fill="white" fill-opacity="0.80"/%3E%3Crect x="204" y="204" width="131" height="6" rx="3" fill="white" fill-opacity="0.52"/%3E%3Crect x="159" y="60" width="150" height="10" rx="5" fill="white" fill-opacity="0.59"/%3E%3Crect x="77" y="132" width="249" height="13" rx="7" fill="white" fill-opacity="0.84"/%3E%3Crect x="54" y="657" width="191" height="20" rx="10" fill="white" fill-opacity="0.33"/%3E%3Crect x="48" y="35" width="253" height="6" rx="3" fill="white" fill-opacity="0.67"/%3E%3Crect x="114" y="963" width="201" height="6" rx="3" fill="white" fill-opacity="0.54"/%3E%3Crect x="-19" y="730" width="270" height="12" rx="6" fill="white" fill-opacity="0.30"/%3E%3Crect x="8" y="546" width="251" height="21" rx="10" fill="white" fill-opacity="0.69"/%3E%3Crect x="-7" y="704" width="254" height="22" rx="11" fill="white" fill-opacity="0.46"/%3E%3Crect x="0" y="685" width="246" height="24" rx="12" fill="white" fill-opacity="0.50"/%3E%3Crect x="74" y="791" width="189" height="23" rx="12" fill="white" fill-opacity="0.62"/%3E%3Crect x="112" y="382" width="196" height="18" rx="9" fill="white" fill-opacity="0.30"/%3E%3Crect x="-2" y="639" width="247" height="26" rx="13" fill="white" fill-opacity="0.69"/%3E%3Crect x="116" y="388" width="190" height="21" rx="10" fill="white" fill-opacity="0.51"/%3E%3Crect x="54" y="838" width="223" height="8" rx="4" fill="white" fill-opacity="0.27"/%3E%3Crect x="125" y="601" width="124" height="16" rx="8" fill="white" fill-opacity="0.67"/%3E%3Crect x="17" y="497" width="255" height="18" rx="9" fill="white" fill-opacity="0.40"/%3E%3Crect x="85" y="11" width="209" height="12" rx="6" fill="white" fill-opacity="0.37"/%3E%3Crect x="127" y="170" width="205" height="24" rx="12" fill="white" fill-opacity="0.52"/%3E%3Crect x="87" y="892" width="207" height="13" rx="6" fill="white" fill-opacity="0.37"/%3E%3Crect x="39" y="431" width="254" height="22" rx="11" fill="white" fill-opacity="0.78"/%3E%3Crect x="167" y="384" width="140" height="18" rx="9" fill="white" fill-opacity="0.33"/%3E%3Crect x="31" y="496" width="241" height="23" rx="11" fill="white" fill-opacity="0.68"/%3E%3Crect x="200" y="950" width="112" height="12" rx="6" fill="white" fill-opacity="0.52"/%3E%3Crect x="173" y="275" width="159" height="10" rx="5" fill="white" fill-opacity="0.63"/%3E%3Crect x="34" y="494" width="239" height="12" rx="6" fill="white" fill-opacity="0.84"/%3E%3Crect x="200" y="452" width="86" height="7" rx="4" fill="white" fill-opacity="0.77"/%3E%3Crect x="115" y="41" width="188" height="20" rx="10" fill="white" fill-opacity="0.44"/%3E%3Crect x="158" y="792" width="106" height="6" rx="3" fill="white" fill-opacity="0.52"/%3E%3Crect x="173" y="25" width="125" height="23" rx="11" fill="white" fill-opacity="0.33"/%3E%3Crect x="140" y="47" width="165" height="19" rx="9" fill="white" fill-opacity="0.63"/%3E%3Crect x="-17" y="655" width="262" height="22" rx="11" fill="white" fill-opacity="0.66"/%3E%3Crect x="221" y="199" width="114" height="16" rx="8" fill="white" fill-opacity="0.26"/%3E%3Crect x="166" y="472" width="114" height="20" rx="10" fill="white" fill-opacity="0.41"/%3E%3Crect x="139" y="346" width="179" height="20" rx="10" fill="white" fill-opacity="0.62"/%3E%3Crect x="25" y="756" width="230" height="14" rx="7" fill="white" fill-opacity="0.79"/%3E%3Crect x="99" y="87" width="217" height="25" rx="12" fill="white" fill-opacity="0.33"/%3E%3Ccircle cx="109" cy="454" r="2" fill="white" fill-opacity="0.69"/%3E%3Ccircle cx="35" cy="569" r="4" fill="white" fill-opacity="0.73"/%3E%3Ccircle cx="140" cy="651" r="2" fill="white" fill-opacity="0.61"/%3E%3Ccircle cx="60" cy="900" r="4" fill="white" fill-opacity="0.77"/%3E%3Ccircle cx="139" cy="791" r="2" fill="white" fill-opacity="0.67"/%3E%3Ccircle cx="170" cy="83" r="7" fill="white" fill-opacity="0.71"/%3E%3Ccircle cx="105" cy="275" r="3" fill="white" fill-opacity="0.90"/%3E%3Ccircle cx="104" cy="64" r="3" fill="white" fill-opacity="0.77"/%3E%3Ccircle cx="20" cy="687" r="5" fill="white" fill-opacity="0.57"/%3E%3Ccircle cx="74" cy="517" r="5" fill="white" fill-opacity="0.97"/%3E%3Ccircle cx="42" cy="493" r="2" fill="white" fill-opacity="0.88"/%3E%3Ccircle cx="125" cy="439" r="7" fill="white" fill-opacity="0.82"/%3E%3Ccircle cx="51" cy="523" r="7" fill="white" fill-opacity="0.63"/%3E%3Ccircle cx="13" cy="671" r="7" fill="white" fill-opacity="0.60"/%3E%3Ccircle cx="46" cy="851" r="7" fill="white" fill-opacity="0.64"/%3E%3Ccircle cx="132" cy="498" r="2" fill="white" fill-opacity="0.75"/%3E%3Ccircle cx="174" cy="605" r="2" fill="white" fill-opacity="0.76"/%3E%3Ccircle cx="96" cy="401" r="7" fill="white" fill-opacity="0.56"/%3E%3C/g%3E%3C/svg%3E'); mask-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 1000" preserveAspectRatio="none"%3E%3Cdefs%3E%3Cfilter id="b" x="-20%" y="-20%" width="140%" height="140%"%3E%3CfeTurbulence type="fractalNoise" baseFrequency="0.035 0.012" numOctaves="3" seed="5"/%3E%3CfeDisplacementMap in="SourceGraphic" scale="55" xChannelSelector="R" yChannelSelector="G"/%3E%3CfeGaussianBlur stdDeviation="1.4"/%3E%3C/filter%3E%3C/defs%3E%3Cg filter="url(%23b)"%3E%3Cpolygon points="261,0 269,10 279,20 277,30 280,40 283,50 278,60 281,70 281,80 281,90 270,100 270,110 266,120 274,130 273,140 266,150 280,160 283,170 283,180 288,190 287,200 291,210 302,220 300,230 305,240 307,250 305,260 310,270 307,280 308,290 298,300 294,310 285,320 280,330 271,340 262,350 265,360 260,370 255,380 251,390 245,400 244,410 245,420 244,430 254,440 251,450 257,460 252,470 259,480 256,490 243,500 242,510 245,520 234,530 233,540 219,550 209,560 209,570 204,580 193,590 187,600 188,610 195,620 193,630 187,640 192,650 195,660 199,670 213,680 211,690 220,700 223,710 223,720 231,730 225,740 231,750 224,760 226,770 221,780 219,790 226,800 222,810 215,820 223,830 216,840 221,850 231,860 234,870 234,880 253,890 251,900 260,910 274,920 275,930 281,940 284,950 287,960 296,970 292,980 296,990 292,1000 1000,1000 1000,0" fill="white"/%3E%3Crect x="114" y="453" width="172" height="25" rx="13" fill="white" fill-opacity="0.59"/%3E%3Crect x="177" y="867" width="109" height="10" rx="5" fill="white" fill-opacity="0.80"/%3E%3Crect x="155" y="818" width="116" height="11" rx="5" fill="white" fill-opacity="0.69"/%3E%3Crect x="48" y="940" width="261" height="10" rx="5" fill="white" fill-opacity="0.78"/%3E%3Crect x="149" y="604" width="100" height="14" rx="7" fill="white" fill-opacity="0.27"/%3E%3Crect x="101" y="963" width="214" height="11" rx="5" fill="white" fill-opacity="0.40"/%3E%3Crect x="137" y="824" width="136" height="18" rx="9" fill="white" fill-opacity="0.36"/%3E%3Crect x="126" y="720" width="123" height="7" rx="4" fill="white" fill-opacity="0.59"/%3E%3Crect x="148" y="852" width="133" height="18" rx="9" fill="white" fill-opacity="0.80"/%3E%3Crect x="204" y="204" width="131" height="6" rx="3" fill="white" fill-opacity="0.52"/%3E%3Crect x="159" y="60" width="150" height="10" rx="5" fill="white" fill-opacity="0.59"/%3E%3Crect x="77" y="132" width="249" height="13" rx="7" fill="white" fill-opacity="0.84"/%3E%3Crect x="54" y="657" width="191" height="20" rx="10" fill="white" fill-opacity="0.33"/%3E%3Crect x="48" y="35" width="253" height="6" rx="3" fill="white" fill-opacity="0.67"/%3E%3Crect x="114" y="963" width="201" height="6" rx="3" fill="white" fill-opacity="0.54"/%3E%3Crect x="-19" y="730" width="270" height="12" rx="6" fill="white" fill-opacity="0.30"/%3E%3Crect x="8" y="546" width="251" height="21" rx="10" fill="white" fill-opacity="0.69"/%3E%3Crect x="-7" y="704" width="254" height="22" rx="11" fill="white" fill-opacity="0.46"/%3E%3Crect x="0" y="685" width="246" height="24" rx="12" fill="white" fill-opacity="0.50"/%3E%3Crect x="74" y="791" width="189" height="23" rx="12" fill="white" fill-opacity="0.62"/%3E%3Crect x="112" y="382" width="196" height="18" rx="9" fill="white" fill-opacity="0.30"/%3E%3Crect x="-2" y="639" width="247" height="26" rx="13" fill="white" fill-opacity="0.69"/%3E%3Crect x="116" y="388" width="190" height="21" rx="10" fill="white" fill-opacity="0.51"/%3E%3Crect x="54" y="838" width="223" height="8" rx="4" fill="white" fill-opacity="0.27"/%3E%3Crect x="125" y="601" width="124" height="16" rx="8" fill="white" fill-opacity="0.67"/%3E%3Crect x="17" y="497" width="255" height="18" rx="9" fill="white" fill-opacity="0.40"/%3E%3Crect x="85" y="11" width="209" height="12" rx="6" fill="white" fill-opacity="0.37"/%3E%3Crect x="127" y="170" width="205" height="24" rx="12" fill="white" fill-opacity="0.52"/%3E%3Crect x="87" y="892" width="207" height="13" rx="6" fill="white" fill-opacity="0.37"/%3E%3Crect x="39" y="431" width="254" height="22" rx="11" fill="white" fill-opacity="0.78"/%3E%3Crect x="167" y="384" width="140" height="18" rx="9" fill="white" fill-opacity="0.33"/%3E%3Crect x="31" y="496" width="241" height="23" rx="11" fill="white" fill-opacity="0.68"/%3E%3Crect x="200" y="950" width="112" height="12" rx="6" fill="white" fill-opacity="0.52"/%3E%3Crect x="173" y="275" width="159" height="10" rx="5" fill="white" fill-opacity="0.63"/%3E%3Crect x="34" y="494" width="239" height="12" rx="6" fill="white" fill-opacity="0.84"/%3E%3Crect x="200" y="452" width="86" height="7" rx="4" fill="white" fill-opacity="0.77"/%3E%3Crect x="115" y="41" width="188" height="20" rx="10" fill="white" fill-opacity="0.44"/%3E%3Crect x="158" y="792" width="106" height="6" rx="3" fill="white" fill-opacity="0.52"/%3E%3Crect x="173" y="25" width="125" height="23" rx="11" fill="white" fill-opacity="0.33"/%3E%3Crect x="140" y="47" width="165" height="19" rx="9" fill="white" fill-opacity="0.63"/%3E%3Crect x="-17" y="655" width="262" height="22" rx="11" fill="white" fill-opacity="0.66"/%3E%3Crect x="221" y="199" width="114" height="16" rx="8" fill="white" fill-opacity="0.26"/%3E%3Crect x="166" y="472" width="114" height="20" rx="10" fill="white" fill-opacity="0.41"/%3E%3Crect x="139" y="346" width="179" height="20" rx="10" fill="white" fill-opacity="0.62"/%3E%3Crect x="25" y="756" width="230" height="14" rx="7" fill="white" fill-opacity="0.79"/%3E%3Crect x="99" y="87" width="217" height="25" rx="12" fill="white" fill-opacity="0.33"/%3E%3Ccircle cx="109" cy="454" r="2" fill="white" fill-opacity="0.69"/%3E%3Ccircle cx="35" cy="569" r="4" fill="white" fill-opacity="0.73"/%3E%3Ccircle cx="140" cy="651" r="2" fill="white" fill-opacity="0.61"/%3E%3Ccircle cx="60" cy="900" r="4" fill="white" fill-opacity="0.77"/%3E%3Ccircle cx="139" cy="791" r="2" fill="white" fill-opacity="0.67"/%3E%3Ccircle cx="170" cy="83" r="7" fill="white" fill-opacity="0.71"/%3E%3Ccircle cx="105" cy="275" r="3" fill="white" fill-opacity="0.90"/%3E%3Ccircle cx="104" cy="64" r="3" fill="white" fill-opacity="0.77"/%3E%3Ccircle cx="20" cy="687" r="5" fill="white" fill-opacity="0.57"/%3E%3Ccircle cx="74" cy="517" r="5" fill="white" fill-opacity="0.97"/%3E%3Ccircle cx="42" cy="493" r="2" fill="white" fill-opacity="0.88"/%3E%3Ccircle cx="125" cy="439" r="7" fill="white" fill-opacity="0.82"/%3E%3Ccircle cx="51" cy="523" r="7" fill="white" fill-opacity="0.63"/%3E%3Ccircle cx="13" cy="671" r="7" fill="white" fill-opacity="0.60"/%3E%3Ccircle cx="46" cy="851" r="7" fill="white" fill-opacity="0.64"/%3E%3Ccircle cx="132" cy="498" r="2" fill="white" fill-opacity="0.75"/%3E%3Ccircle cx="174" cy="605" r="2" fill="white" fill-opacity="0.76"/%3E%3Ccircle cx="96" cy="401" r="7" fill="white" fill-opacity="0.56"/%3E%3C/g%3E%3C/svg%3E');
  -webkit-mask-size: 100% 100%; mask-size: 100% 100%; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
}
.gdf-hero2__photo .gdf-slide img { width: 100%; height: 100%; object-fit: cover; object-position: 60% 40%; }
.gdf-hero2__photo .gdf-slide.is-active img { animation: gdf-push 12s ease-out both; }
.gdf-hero2__photo .gdf-slidectl { right: var(--gdf-edge); bottom: var(--s5); top: auto; }

.gdf-hero2__inner { position: relative; z-index: 2; width: 100%; }
.gdf-hero2__copy { max-width: 520px; padding: var(--s8) 0; color: #3a3833; }
.gdf-hero2__brand { display: flex; align-items: center; gap: 10px; margin: 0 0 var(--s7); font: 600 1rem/1 var(--gdf-head); letter-spacing: .1em; text-transform: uppercase; color: var(--gdf-black); }
.gdf-hero2__brand img { width: 40px; height: 40px; }
.gdf-hero2__brand b { color: var(--gdf-red); font-weight: 600; }
.gdf-hero2__kicker { margin: 0 0 var(--s2); font: 500 clamp(1.15rem, 1rem + .6vw, 1.6rem)/1.15 var(--gdf-head); letter-spacing: .04em; text-transform: uppercase; color: #3a3833; }
.gdf-hero2__kicker::first-line { color: inherit; }
.gdf-hero2__title { margin: 0 0 var(--s4); font: 700 clamp(2.8rem, 1.6rem + 4vw, 5.2rem)/.95 var(--gdf-head); letter-spacing: -.01em; text-transform: uppercase; color: #3a3833; }
.gdf-hero2__title span { display: block; color: var(--gdf-red); }
.gdf-hero2__sub { margin: 0; max-width: 42ch; font-size: 1.0625rem; line-height: 1.55; color: #4d4a43; }

.gdf-hero2__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s4) var(--s5); margin-top: var(--s6); }
.gdf-tagbtn {
  display: inline-flex; align-items: center; min-height: 48px; padding: 12px 40px 12px 24px; background: var(--gdf-red); color: #fff; text-decoration: none;
  font: 500 1rem/1 var(--gdf-head); letter-spacing: .1em; text-transform: uppercase;
  clip-path: polygon(0 0, 100% 0, calc(100% - 16px) 100%, 0 100%); transition: background-color .15s;
}
.gdf-tagbtn:hover { background: var(--gdf-red-dark); }
.gdf-hero2__link { color: var(--gdf-black); font: 500 .9375rem/1 var(--gdf-head); letter-spacing: .08em; text-transform: uppercase; text-decoration: underline; text-decoration-color: var(--gdf-red); text-decoration-thickness: 2px; text-underline-offset: 6px; }

.gdf-hero2__contact { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s3); margin-top: var(--s7); }
.gdf-hero2__icons { display: flex; gap: 8px; }
.gdf-hero2__icons a { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; background: #3a3833; color: #fff; transition: background-color .15s; }
.gdf-hero2__icons a:hover { background: var(--gdf-red); }
.gdf-hero2__icons svg { width: 16px; height: 16px; fill: currentColor; }
.gdf-hero2__site { display: inline-flex; align-items: center; min-height: 34px; padding: 0 16px; border-radius: 17px; background: var(--gdf-red); color: #fff; text-decoration: none; font: 500 .875rem/1 var(--gdf-ui); }
.gdf-hero2__site:hover { background: var(--gdf-red-dark); }

@media (max-width: 1100px) and (min-width: 761px) {
  .gdf-hero2__photo { width: 58%; }
  .gdf-hero2__copy { max-width: 440px; }
  .gdf-hero2__title { font-size: clamp(2.6rem, 1.4rem + 3.6vw, 4rem); }
}
/* Phones: photograph on top with the painted edge along its bottom,
   message below on the paper panel. */
@media (max-width: 760px) {
  .gdf-hero2 { display: block; min-height: 0; }
  .gdf-hero2__photo {
    position: relative; width: 100%; height: 62vw; min-height: 260px;
    -webkit-mask-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 1000" preserveAspectRatio="none"%3E%3Cdefs%3E%3Cfilter id="b" x="-20%25" y="-20%25" width="140%25" height="140%25"%3E%3CfeTurbulence type="fractalNoise" baseFrequency="0.035 0.012" numOctaves="3" seed="5"/%3E%3CfeDisplacementMap in="SourceGraphic" scale="55" xChannelSelector="R" yChannelSelector="G"/%3E%3CfeGaussianBlur stdDeviation="1.4"/%3E%3C/filter%3E%3C/defs%3E%3Cg filter="url(%23b)"%3E%3Cg transform="matrix(0,-1,1,0,0,1000)"%3E%3Cpolygon points="261,0 269,10 279,20 277,30 280,40 283,50 278,60 281,70 281,80 281,90 270,100 270,110 266,120 274,130 273,140 266,150 280,160 283,170 283,180 288,190 287,200 291,210 302,220 300,230 305,240 307,250 305,260 310,270 307,280 308,290 298,300 294,310 285,320 280,330 271,340 262,350 265,360 260,370 255,380 251,390 245,400 244,410 245,420 244,430 254,440 251,450 257,460 252,470 259,480 256,490 243,500 242,510 245,520 234,530 233,540 219,550 209,560 209,570 204,580 193,590 187,600 188,610 195,620 193,630 187,640 192,650 195,660 199,670 213,680 211,690 220,700 223,710 223,720 231,730 225,740 231,750 224,760 226,770 221,780 219,790 226,800 222,810 215,820 223,830 216,840 221,850 231,860 234,870 234,880 253,890 251,900 260,910 274,920 275,930 281,940 284,950 287,960 296,970 292,980 296,990 292,1000 1000,1000 1000,0" fill="white"/%3E%3Crect x="114" y="453" width="172" height="25" rx="13" fill="white" fill-opacity="0.59"/%3E%3Crect x="177" y="867" width="109" height="10" rx="5" fill="white" fill-opacity="0.80"/%3E%3Crect x="155" y="818" width="116" height="11" rx="5" fill="white" fill-opacity="0.69"/%3E%3Crect x="48" y="940" width="261" height="10" rx="5" fill="white" fill-opacity="0.78"/%3E%3Crect x="149" y="604" width="100" height="14" rx="7" fill="white" fill-opacity="0.27"/%3E%3Crect x="101" y="963" width="214" height="11" rx="5" fill="white" fill-opacity="0.40"/%3E%3Crect x="137" y="824" width="136" height="18" rx="9" fill="white" fill-opacity="0.36"/%3E%3Crect x="126" y="720" width="123" height="7" rx="4" fill="white" fill-opacity="0.59"/%3E%3Crect x="148" y="852" width="133" height="18" rx="9" fill="white" fill-opacity="0.80"/%3E%3Crect x="204" y="204" width="131" height="6" rx="3" fill="white" fill-opacity="0.52"/%3E%3Crect x="159" y="60" width="150" height="10" rx="5" fill="white" fill-opacity="0.59"/%3E%3Crect x="77" y="132" width="249" height="13" rx="7" fill="white" fill-opacity="0.84"/%3E%3Crect x="54" y="657" width="191" height="20" rx="10" fill="white" fill-opacity="0.33"/%3E%3Crect x="48" y="35" width="253" height="6" rx="3" fill="white" fill-opacity="0.67"/%3E%3Crect x="114" y="963" width="201" height="6" rx="3" fill="white" fill-opacity="0.54"/%3E%3Crect x="-19" y="730" width="270" height="12" rx="6" fill="white" fill-opacity="0.30"/%3E%3Crect x="8" y="546" width="251" height="21" rx="10" fill="white" fill-opacity="0.69"/%3E%3Crect x="-7" y="704" width="254" height="22" rx="11" fill="white" fill-opacity="0.46"/%3E%3Crect x="0" y="685" width="246" height="24" rx="12" fill="white" fill-opacity="0.50"/%3E%3Crect x="74" y="791" width="189" height="23" rx="12" fill="white" fill-opacity="0.62"/%3E%3Crect x="112" y="382" width="196" height="18" rx="9" fill="white" fill-opacity="0.30"/%3E%3Crect x="-2" y="639" width="247" height="26" rx="13" fill="white" fill-opacity="0.69"/%3E%3Crect x="116" y="388" width="190" height="21" rx="10" fill="white" fill-opacity="0.51"/%3E%3Crect x="54" y="838" width="223" height="8" rx="4" fill="white" fill-opacity="0.27"/%3E%3Crect x="125" y="601" width="124" height="16" rx="8" fill="white" fill-opacity="0.67"/%3E%3Crect x="17" y="497" width="255" height="18" rx="9" fill="white" fill-opacity="0.40"/%3E%3Crect x="85" y="11" width="209" height="12" rx="6" fill="white" fill-opacity="0.37"/%3E%3Crect x="127" y="170" width="205" height="24" rx="12" fill="white" fill-opacity="0.52"/%3E%3Crect x="87" y="892" width="207" height="13" rx="6" fill="white" fill-opacity="0.37"/%3E%3Crect x="39" y="431" width="254" height="22" rx="11" fill="white" fill-opacity="0.78"/%3E%3Crect x="167" y="384" width="140" height="18" rx="9" fill="white" fill-opacity="0.33"/%3E%3Crect x="31" y="496" width="241" height="23" rx="11" fill="white" fill-opacity="0.68"/%3E%3Crect x="200" y="950" width="112" height="12" rx="6" fill="white" fill-opacity="0.52"/%3E%3Crect x="173" y="275" width="159" height="10" rx="5" fill="white" fill-opacity="0.63"/%3E%3Crect x="34" y="494" width="239" height="12" rx="6" fill="white" fill-opacity="0.84"/%3E%3Crect x="200" y="452" width="86" height="7" rx="4" fill="white" fill-opacity="0.77"/%3E%3Crect x="115" y="41" width="188" height="20" rx="10" fill="white" fill-opacity="0.44"/%3E%3Crect x="158" y="792" width="106" height="6" rx="3" fill="white" fill-opacity="0.52"/%3E%3Crect x="173" y="25" width="125" height="23" rx="11" fill="white" fill-opacity="0.33"/%3E%3Crect x="140" y="47" width="165" height="19" rx="9" fill="white" fill-opacity="0.63"/%3E%3Crect x="-17" y="655" width="262" height="22" rx="11" fill="white" fill-opacity="0.66"/%3E%3Crect x="221" y="199" width="114" height="16" rx="8" fill="white" fill-opacity="0.26"/%3E%3Crect x="166" y="472" width="114" height="20" rx="10" fill="white" fill-opacity="0.41"/%3E%3Crect x="139" y="346" width="179" height="20" rx="10" fill="white" fill-opacity="0.62"/%3E%3Crect x="25" y="756" width="230" height="14" rx="7" fill="white" fill-opacity="0.79"/%3E%3Crect x="99" y="87" width="217" height="25" rx="12" fill="white" fill-opacity="0.33"/%3E%3Ccircle cx="109" cy="454" r="2" fill="white" fill-opacity="0.69"/%3E%3Ccircle cx="35" cy="569" r="4" fill="white" fill-opacity="0.73"/%3E%3Ccircle cx="140" cy="651" r="2" fill="white" fill-opacity="0.61"/%3E%3Ccircle cx="60" cy="900" r="4" fill="white" fill-opacity="0.77"/%3E%3Ccircle cx="139" cy="791" r="2" fill="white" fill-opacity="0.67"/%3E%3Ccircle cx="170" cy="83" r="7" fill="white" fill-opacity="0.71"/%3E%3Ccircle cx="105" cy="275" r="3" fill="white" fill-opacity="0.90"/%3E%3Ccircle cx="104" cy="64" r="3" fill="white" fill-opacity="0.77"/%3E%3Ccircle cx="20" cy="687" r="5" fill="white" fill-opacity="0.57"/%3E%3Ccircle cx="74" cy="517" r="5" fill="white" fill-opacity="0.97"/%3E%3Ccircle cx="42" cy="493" r="2" fill="white" fill-opacity="0.88"/%3E%3Ccircle cx="125" cy="439" r="7" fill="white" fill-opacity="0.82"/%3E%3Ccircle cx="51" cy="523" r="7" fill="white" fill-opacity="0.63"/%3E%3Ccircle cx="13" cy="671" r="7" fill="white" fill-opacity="0.60"/%3E%3Ccircle cx="46" cy="851" r="7" fill="white" fill-opacity="0.64"/%3E%3Ccircle cx="132" cy="498" r="2" fill="white" fill-opacity="0.75"/%3E%3Ccircle cx="174" cy="605" r="2" fill="white" fill-opacity="0.76"/%3E%3Ccircle cx="96" cy="401" r="7" fill="white" fill-opacity="0.56"/%3E%3C/g%3E%3C/g%3E%3C/svg%3E');
    -webkit-mask-position: center; transform: none; mask-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 1000" preserveAspectRatio="none"%3E%3Cdefs%3E%3Cfilter id="b" x="-20%25" y="-20%25" width="140%25" height="140%25"%3E%3CfeTurbulence type="fractalNoise" baseFrequency="0.035 0.012" numOctaves="3" seed="5"/%3E%3CfeDisplacementMap in="SourceGraphic" scale="55" xChannelSelector="R" yChannelSelector="G"/%3E%3CfeGaussianBlur stdDeviation="1.4"/%3E%3C/filter%3E%3C/defs%3E%3Cg filter="url(%23b)"%3E%3Cg transform="matrix(0,-1,1,0,0,1000)"%3E%3Cpolygon points="261,0 269,10 279,20 277,30 280,40 283,50 278,60 281,70 281,80 281,90 270,100 270,110 266,120 274,130 273,140 266,150 280,160 283,170 283,180 288,190 287,200 291,210 302,220 300,230 305,240 307,250 305,260 310,270 307,280 308,290 298,300 294,310 285,320 280,330 271,340 262,350 265,360 260,370 255,380 251,390 245,400 244,410 245,420 244,430 254,440 251,450 257,460 252,470 259,480 256,490 243,500 242,510 245,520 234,530 233,540 219,550 209,560 209,570 204,580 193,590 187,600 188,610 195,620 193,630 187,640 192,650 195,660 199,670 213,680 211,690 220,700 223,710 223,720 231,730 225,740 231,750 224,760 226,770 221,780 219,790 226,800 222,810 215,820 223,830 216,840 221,850 231,860 234,870 234,880 253,890 251,900 260,910 274,920 275,930 281,940 284,950 287,960 296,970 292,980 296,990 292,1000 1000,1000 1000,0" fill="white"/%3E%3Crect x="114" y="453" width="172" height="25" rx="13" fill="white" fill-opacity="0.59"/%3E%3Crect x="177" y="867" width="109" height="10" rx="5" fill="white" fill-opacity="0.80"/%3E%3Crect x="155" y="818" width="116" height="11" rx="5" fill="white" fill-opacity="0.69"/%3E%3Crect x="48" y="940" width="261" height="10" rx="5" fill="white" fill-opacity="0.78"/%3E%3Crect x="149" y="604" width="100" height="14" rx="7" fill="white" fill-opacity="0.27"/%3E%3Crect x="101" y="963" width="214" height="11" rx="5" fill="white" fill-opacity="0.40"/%3E%3Crect x="137" y="824" width="136" height="18" rx="9" fill="white" fill-opacity="0.36"/%3E%3Crect x="126" y="720" width="123" height="7" rx="4" fill="white" fill-opacity="0.59"/%3E%3Crect x="148" y="852" width="133" height="18" rx="9" fill="white" fill-opacity="0.80"/%3E%3Crect x="204" y="204" width="131" height="6" rx="3" fill="white" fill-opacity="0.52"/%3E%3Crect x="159" y="60" width="150" height="10" rx="5" fill="white" fill-opacity="0.59"/%3E%3Crect x="77" y="132" width="249" height="13" rx="7" fill="white" fill-opacity="0.84"/%3E%3Crect x="54" y="657" width="191" height="20" rx="10" fill="white" fill-opacity="0.33"/%3E%3Crect x="48" y="35" width="253" height="6" rx="3" fill="white" fill-opacity="0.67"/%3E%3Crect x="114" y="963" width="201" height="6" rx="3" fill="white" fill-opacity="0.54"/%3E%3Crect x="-19" y="730" width="270" height="12" rx="6" fill="white" fill-opacity="0.30"/%3E%3Crect x="8" y="546" width="251" height="21" rx="10" fill="white" fill-opacity="0.69"/%3E%3Crect x="-7" y="704" width="254" height="22" rx="11" fill="white" fill-opacity="0.46"/%3E%3Crect x="0" y="685" width="246" height="24" rx="12" fill="white" fill-opacity="0.50"/%3E%3Crect x="74" y="791" width="189" height="23" rx="12" fill="white" fill-opacity="0.62"/%3E%3Crect x="112" y="382" width="196" height="18" rx="9" fill="white" fill-opacity="0.30"/%3E%3Crect x="-2" y="639" width="247" height="26" rx="13" fill="white" fill-opacity="0.69"/%3E%3Crect x="116" y="388" width="190" height="21" rx="10" fill="white" fill-opacity="0.51"/%3E%3Crect x="54" y="838" width="223" height="8" rx="4" fill="white" fill-opacity="0.27"/%3E%3Crect x="125" y="601" width="124" height="16" rx="8" fill="white" fill-opacity="0.67"/%3E%3Crect x="17" y="497" width="255" height="18" rx="9" fill="white" fill-opacity="0.40"/%3E%3Crect x="85" y="11" width="209" height="12" rx="6" fill="white" fill-opacity="0.37"/%3E%3Crect x="127" y="170" width="205" height="24" rx="12" fill="white" fill-opacity="0.52"/%3E%3Crect x="87" y="892" width="207" height="13" rx="6" fill="white" fill-opacity="0.37"/%3E%3Crect x="39" y="431" width="254" height="22" rx="11" fill="white" fill-opacity="0.78"/%3E%3Crect x="167" y="384" width="140" height="18" rx="9" fill="white" fill-opacity="0.33"/%3E%3Crect x="31" y="496" width="241" height="23" rx="11" fill="white" fill-opacity="0.68"/%3E%3Crect x="200" y="950" width="112" height="12" rx="6" fill="white" fill-opacity="0.52"/%3E%3Crect x="173" y="275" width="159" height="10" rx="5" fill="white" fill-opacity="0.63"/%3E%3Crect x="34" y="494" width="239" height="12" rx="6" fill="white" fill-opacity="0.84"/%3E%3Crect x="200" y="452" width="86" height="7" rx="4" fill="white" fill-opacity="0.77"/%3E%3Crect x="115" y="41" width="188" height="20" rx="10" fill="white" fill-opacity="0.44"/%3E%3Crect x="158" y="792" width="106" height="6" rx="3" fill="white" fill-opacity="0.52"/%3E%3Crect x="173" y="25" width="125" height="23" rx="11" fill="white" fill-opacity="0.33"/%3E%3Crect x="140" y="47" width="165" height="19" rx="9" fill="white" fill-opacity="0.63"/%3E%3Crect x="-17" y="655" width="262" height="22" rx="11" fill="white" fill-opacity="0.66"/%3E%3Crect x="221" y="199" width="114" height="16" rx="8" fill="white" fill-opacity="0.26"/%3E%3Crect x="166" y="472" width="114" height="20" rx="10" fill="white" fill-opacity="0.41"/%3E%3Crect x="139" y="346" width="179" height="20" rx="10" fill="white" fill-opacity="0.62"/%3E%3Crect x="25" y="756" width="230" height="14" rx="7" fill="white" fill-opacity="0.79"/%3E%3Crect x="99" y="87" width="217" height="25" rx="12" fill="white" fill-opacity="0.33"/%3E%3Ccircle cx="109" cy="454" r="2" fill="white" fill-opacity="0.69"/%3E%3Ccircle cx="35" cy="569" r="4" fill="white" fill-opacity="0.73"/%3E%3Ccircle cx="140" cy="651" r="2" fill="white" fill-opacity="0.61"/%3E%3Ccircle cx="60" cy="900" r="4" fill="white" fill-opacity="0.77"/%3E%3Ccircle cx="139" cy="791" r="2" fill="white" fill-opacity="0.67"/%3E%3Ccircle cx="170" cy="83" r="7" fill="white" fill-opacity="0.71"/%3E%3Ccircle cx="105" cy="275" r="3" fill="white" fill-opacity="0.90"/%3E%3Ccircle cx="104" cy="64" r="3" fill="white" fill-opacity="0.77"/%3E%3Ccircle cx="20" cy="687" r="5" fill="white" fill-opacity="0.57"/%3E%3Ccircle cx="74" cy="517" r="5" fill="white" fill-opacity="0.97"/%3E%3Ccircle cx="42" cy="493" r="2" fill="white" fill-opacity="0.88"/%3E%3Ccircle cx="125" cy="439" r="7" fill="white" fill-opacity="0.82"/%3E%3Ccircle cx="51" cy="523" r="7" fill="white" fill-opacity="0.63"/%3E%3Ccircle cx="13" cy="671" r="7" fill="white" fill-opacity="0.60"/%3E%3Ccircle cx="46" cy="851" r="7" fill="white" fill-opacity="0.64"/%3E%3Ccircle cx="132" cy="498" r="2" fill="white" fill-opacity="0.75"/%3E%3Ccircle cx="174" cy="605" r="2" fill="white" fill-opacity="0.76"/%3E%3Ccircle cx="96" cy="401" r="7" fill="white" fill-opacity="0.56"/%3E%3C/g%3E%3C/g%3E%3C/svg%3E');
    -webkit-mask-position: center; transform: none;
  }
  .gdf-hero2__photo .gdf-slidectl { top: var(--s4); bottom: auto; right: var(--gdf-gutter); }
  .gdf-hero2__copy { max-width: none; padding: var(--s4) 0 var(--s7); }
  .gdf-hero2__brand { margin-bottom: var(--s5); }
  .gdf-hero2__title { font-size: 2.9rem; }
  .gdf-hero2__contact { margin-top: var(--s6); }
}

/* --------------------------------------------------------------------------
   HERO: PEELING SHEET
   The photograph is a printed sheet (masked to a curved right edge); an SVG
   draws the folded-back paper and its shadow; the panel behind carries the
   campaign details. All shapes share one 100x100 coordinate system.
   -------------------------------------------------------------------------- */
.gdf-peel { position: relative; overflow: hidden; background: linear-gradient(180deg, #f1efea 0%, #e7e4dd 100%); min-height: max(580px, calc(100svh - 118px - 112px)); }
.gdf-peel__sheet { position: absolute; inset: 0; z-index: 1;
  -webkit-mask-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" preserveAspectRatio="none"%3E%3Cpath d="M0 0 L64 0 C61 35 57 70 51 100 L0 100 Z" fill="white"/%3E%3C/svg%3E'); mask-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" preserveAspectRatio="none"%3E%3Cpath d="M0 0 L64 0 C61 35 57 70 51 100 L0 100 Z" fill="white"/%3E%3C/svg%3E'); -webkit-mask-size: 100% 100%; mask-size: 100% 100%; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; }
.gdf-peel__sheet .gdf-slide img { width: 100%; height: 100%; object-fit: cover; object-position: 35% 45%; }
.gdf-peel__sheet .gdf-slide.is-active img { animation: gdf-push 12s ease-out both; }
.gdf-peel__shade { position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(100deg, rgba(8, 8, 7, .78) 0%, rgba(8, 8, 7, .5) 32%, rgba(8, 8, 7, .08) 58%, rgba(8, 8, 7, 0) 70%),
              linear-gradient(to top, rgba(8, 8, 7, .45), rgba(8, 8, 7, 0) 35%); }
.gdf-peel__sheet .gdf-slidectl { left: var(--gdf-edge); right: auto; bottom: var(--s5); top: auto; z-index: 3; }

.gdf-peel__curl { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 2; pointer-events: none; }
.gdf-peel__cast { fill: rgba(30, 26, 18, .32); }

.gdf-peel__copy { position: relative; z-index: 3; width: min(540px, 44%); margin-left: var(--gdf-edge); padding: clamp(56px, 10vh, 110px) 0 120px; color: #ece8df; }
.gdf-peel__kicker { display: flex; align-items: center; gap: 12px; margin: 0 0 var(--s4); font: 500 .8125rem/1 var(--gdf-head); letter-spacing: .24em; text-transform: uppercase; color: var(--gdf-gold-light); }
.gdf-peel__kicker::before { content: ""; width: 34px; height: 2px; background: var(--gdf-gold); }
.gdf-peel__title { margin: 0 0 var(--s4); font: 700 clamp(2.8rem, 1.6rem + 4vw, 5.2rem)/.95 var(--gdf-head); letter-spacing: -.005em; text-transform: uppercase; color: #fff; text-shadow: 0 2px 24px rgba(0, 0, 0, .35); }
.gdf-peel__title span { display: block; color: var(--gdf-gold); }
.gdf-peel__sub { margin: 0; max-width: 42ch; font-size: 1.125rem; line-height: 1.55; }
.gdf-peel__actions { display: flex; flex-wrap: wrap; gap: var(--s3); margin-top: var(--s6); }

/* The panel the sheet peels away from */
.gdf-peel__panel { position: absolute; z-index: 0; right: max(var(--s5), 4vw); top: 50%; transform: translateY(-50%); width: min(20vw, 320px); color: #4b4840; text-align: left; }
.gdf-peel__panel > img { width: 64px; height: 64px; margin-bottom: var(--s3); }
.gdf-peel__script { margin: 0; font: italic 400 clamp(1.9rem, 1.4rem + 1.3vw, 2.6rem)/1 var(--gdf-body); color: var(--gdf-gold-dark); }
.gdf-peel__slogan { margin: 6px 0 var(--s4); font: 500 .75rem/1.4 var(--gdf-head); letter-spacing: .14em; text-transform: uppercase; color: #6b675e; }
.gdf-peel__facts { margin: 0 0 var(--s4); border-top: 1px solid #cdc9bf; }
.gdf-peel__facts > div { display: grid; grid-template-columns: 4.2em 1fr; gap: var(--s2); padding: 8px 0; border-bottom: 1px solid #cdc9bf; font: 400 .875rem/1.35 var(--gdf-ui); }
.gdf-peel__facts dt { font: 500 .6875rem/1.9 var(--gdf-head); letter-spacing: .14em; text-transform: uppercase; color: var(--gdf-red); }
.gdf-peel__facts dd { margin: 0; color: #2f2d28; }
.gdf-peel__facts a { color: inherit; text-decoration: none; }
.gdf-peel__facts a:hover { color: var(--gdf-red); }
.gdf-peel .gdf-hero2__icons a { width: 30px; height: 30px; background: #3a3833; }
.gdf-peel .gdf-hero2__icons svg { width: 14px; height: 14px; }

@media (max-width: 1100px) and (min-width: 861px) {
  .gdf-peel__copy { width: 46%; }
  .gdf-peel__panel { width: 21vw; right: var(--s4); }
  .gdf-peel__script { font-size: 1.6rem; }
  .gdf-peel__facts > div { grid-template-columns: 1fr; gap: 0; }
}
/* Tablet and phone: the sheet fills the width with a small corner curl;
   the panel's details move below it. */
@media (max-width: 860px) {
  .gdf-peel { display: flex; flex-direction: column; min-height: 0; }
  .gdf-peel__sheet { position: relative; inset: auto; order: 1; min-height: 560px; -webkit-mask-image: none; mask-image: none; }
  .gdf-peel__curl { display: none; }
  .gdf-peel__sheet { min-height: 0; height: 64vw; max-height: 460px; }
  .gdf-peel__shade { background: linear-gradient(to top, rgba(8, 8, 7, .35), rgba(8, 8, 7, 0) 45%); }
  .gdf-peel__copy { position: relative; order: 2; z-index: 3; width: auto; margin: 0; padding: var(--s6) var(--gdf-gutter) var(--s6); background: var(--gdf-night); }
  .gdf-peel__sheet .gdf-slidectl { top: var(--s4); bottom: auto; left: auto; right: var(--gdf-gutter); }
  .gdf-peel__panel { position: relative; order: 3; transform: none; top: auto; right: auto; bottom: auto; width: auto; padding: var(--s6) var(--gdf-gutter) var(--s6); display: grid; grid-template-columns: auto 1fr; column-gap: var(--s4); align-items: center; }
  .gdf-peel__panel > img { grid-row: span 2; margin: 0; }
  .gdf-peel__facts, .gdf-peel .gdf-hero2__icons { grid-column: 1 / -1; }
  .gdf-peel__facts { margin-top: var(--s4); }
}
@media (max-width: 520px) {
  .gdf-peel__title { font-size: 2.6rem; }
  .gdf-peel__sub { font-size: 1rem; }
}

/* --------------------------------------------------------------------------
   PAGE TURN
   Each change of photograph turns the old one away like a book page: it
   hinges on the left, swings toward the reader and darkens as it folds,
   while the corner curl lifts. On first load the curl peels open.
   Reduced motion: photographs simply change, the curl stays still.
   -------------------------------------------------------------------------- */
.gdf-peel__sheet .gdf-slides { perspective: 2400px; perspective-origin: 0% 50%; }
.gdf-peel__sheet .gdf-slide { opacity: 1; visibility: hidden; transition: none; }
.gdf-peel__sheet .gdf-slide.is-active { visibility: visible; z-index: 1; }
.gdf-peel__sheet .gdf-slide.is-leaving {
  visibility: visible; z-index: 2; transform-origin: 0% 50%; backface-visibility: hidden;
  animation: gdf-pageturn 1.1s cubic-bezier(.5, .05, .3, 1) forwards;
}
.gdf-peel__sheet .gdf-slide.is-leaving::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(to left, rgba(0, 0, 0, .55), rgba(0, 0, 0, .15) 45%, rgba(255, 255, 255, .08) 70%, rgba(0, 0, 0, 0));
  opacity: 0; animation: gdf-pageshade 1.1s ease-in forwards;
}
@keyframes gdf-pageturn {
  0%   { transform: rotateY(0deg); }
  70%  { transform: rotateY(-78deg); opacity: 1; }
  100% { transform: rotateY(-96deg); opacity: 0; }
}
@keyframes gdf-pageshade { to { opacity: 1; } }

.gdf-peel__lift { transform-box: view-box; transform-origin: 57px 50px; transition: transform .55s cubic-bezier(.3, .7, .3, 1); animation: gdf-curlin 1.3s .2s cubic-bezier(.2, .8, .2, 1) both; }
.is-turning .gdf-peel__lift { transform: scaleX(1.22) skewY(-1deg); }
@keyframes gdf-curlin { from { transform: scaleX(.05); opacity: 0; } 30% { opacity: 1; } to { transform: scaleX(1); } }
@media (prefers-reduced-motion: reduce) {
  .gdf-peel__lift { animation: none; transition: none; }
  .is-turning .gdf-peel__lift { transform: none; }
}

/* Panel: pinned between the curl and the screen edge so it always fits. */
.gdf-peel__panel { left: 75.5%; right: max(16px, 3vw); width: auto; }
.gdf-peel__script { font-size: clamp(1.5rem, 2.1vw, 2.6rem); }
.gdf-peel__slogan { font-size: clamp(.625rem, .75vw, .75rem); }
.gdf-peel__facts > div { grid-template-columns: minmax(3.6em, auto) 1fr; }
.gdf-peel__facts dd { overflow-wrap: anywhere; font-size: clamp(.8125rem, .95vw, .875rem); }
@media (max-width: 1100px) and (min-width: 861px) { .gdf-peel__panel { left: 75%; right: 16px; width: auto; } }
@media (max-width: 860px) { .gdf-peel__panel { left: auto; right: auto; } }

/* --------------------------------------------------------------------------
   MAYORAL CANDIDATES
   The candidate cards are finished artwork (name, municipality and crest
   are part of the image), so they sit untouched on black: one line on
   desktop, three per row on tablet, a swipeable row on phones.
   -------------------------------------------------------------------------- */
.gdf-cands { position: relative; overflow: hidden; background: var(--gdf-black); color: #fff; padding: var(--s9) 0 var(--s8); }
.gdf-cands::before {
  content: ""; position: absolute; left: 50%; top: 0; width: min(1100px, 90vw); height: 420px; transform: translateX(-50%); pointer-events: none;
  background: radial-gradient(ellipse at 50% 0%, rgba(212, 173, 69, .14), rgba(212, 173, 69, 0) 70%);
}
.gdf-cands__wrap { position: relative; width: 100%; max-width: 1480px; margin: 0 auto; padding: 0 var(--gdf-gutter); }
.gdf-cands__head { text-align: center; margin-bottom: var(--s7); }
.gdf-cands__eyebrow { display: inline-flex; align-items: center; gap: 14px; margin: 0 0 var(--s3); font: 500 .875rem/1 var(--gdf-head); letter-spacing: .26em; text-transform: uppercase; color: var(--gdf-gold); }
.gdf-cands__eyebrow::before, .gdf-cands__eyebrow::after { content: ""; width: 40px; height: 1px; background: var(--gdf-gold); opacity: .7; }
.gdf-cands h2 { margin: 0 auto; max-width: 20ch; color: #fff; font-size: clamp(2rem, 1.3rem + 2.6vw, 3.6rem); line-height: 1.02; }
.gdf-cands h2::after { content: ""; display: block; width: 64px; height: 3px; margin: var(--s4) auto 0; background: var(--gdf-red); }

.gdf-cands__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: clamp(10px, 1.4vw, 22px); align-items: end; }
.gdf-cands__item img { display: block; width: 100%; height: auto; filter: drop-shadow(0 18px 28px rgba(0, 0, 0, .55)); transition: transform .25s ease; }
.gdf-cands__item:hover img { transform: translateY(-4px); }

@media (max-width: 1100px) {
  .gdf-cands__list { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: var(--s6); max-width: 820px; margin: 0 auto; }
}
@media (max-width: 700px) {
  .gdf-cands { padding: var(--s8) 0 var(--s7); }
  .gdf-cands__wrap { padding: 0; }
  .gdf-cands__head { padding: 0 var(--gdf-gutter); }
  .gdf-cands__list {
    display: flex; gap: 14px; max-width: none; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding: 0 var(--gdf-gutter);
    padding: 0 var(--gdf-gutter) var(--s4); -webkit-overflow-scrolling: touch; scrollbar-width: thin; scrollbar-color: var(--gdf-gold) transparent;
  }
  .gdf-cands__item { flex: 0 0 62%; scroll-snap-align: start; }
}
@media (prefers-reduced-motion: reduce) { .gdf-cands__item img { transition: none; } .gdf-cands__item:hover img { transform: none; } }

/* Hero headline: calmer size along the bottom of the photograph */
.gdf-mosaic--full .gdf-mosaic__copy h1 { font-size: clamp(2rem, 1.3rem + 2.2vw, 3.4rem); line-height: 1.02; max-width: 16ch; }
.gdf-mosaic--full .gdf-mosaic__sub { font-size: 1.0625rem; }
.gdf-mosaic--full .gdf-kicker { font-size: 1rem; }
@media (max-width: 640px) { .gdf-mosaic--full .gdf-mosaic__copy h1 { font-size: 2.1rem; } }