/* ZIFA Diaspora Connect — scoped styles only */
.diaspora-connect-page {
  --dc-green: #036f3c;
  --dc-green-dark: #014d2a;
  --dc-green-deep: #002f1b;
  --dc-yellow: #ffd100;
  --dc-red: #ed3237;
  --dc-ink: #111714;
  --dc-muted: #68736d;
  --dc-line: #e3e9e6;
  --dc-soft: #f3f7f5;
  --dc-white: #fff;
  color: var(--dc-ink);
  background: #fff;
}

.diaspora-connect-page h1,
.diaspora-connect-page h2,
.diaspora-connect-page h3,
.diaspora-connect-page p { margin-top: 0; }

.diaspora-connect-page h1,
.diaspora-connect-page h2,
.diaspora-connect-page h3 { letter-spacing: -0.025em; }

.diaspora-connect-page .container { position: relative; z-index: 2; }

.dc-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 720px;
  display: flex;
  align-items: center;
  padding: 96px 0 84px;
  background:
    radial-gradient(circle at 83% 22%, rgba(255, 209, 0, .14), transparent 25%),
    linear-gradient(112deg, rgba(0, 47, 27, .99) 0%, rgba(3, 111, 60, .96) 56%, rgba(0, 47, 27, .94) 100%),
    var(--dc-hero-image) center/cover no-repeat;
}

.dc-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  opacity: .18;
  background-image: linear-gradient(135deg, transparent 45%, rgba(255,255,255,.25) 46%, transparent 48%);
  background-size: 34px 34px;
  mask-image: linear-gradient(90deg, transparent 22%, #000 100%);
}

.dc-hero::after {
  content: "";
  position: absolute;
  width: 520px;
  height: 520px;
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 50%;
  right: -120px;
  top: 70px;
  box-shadow: 0 0 0 90px rgba(255,255,255,.035), 0 0 0 180px rgba(255,255,255,.02);
  z-index: -1;
}

.dc-hero__container {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(330px, .65fr);
  gap: 78px;
  align-items: center;
}

.dc-eyebrow,
.dc-section-kicker {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: var(--dc-green);
  font-size: .76rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.dc-eyebrow { color: #fff; margin-bottom: 26px; }
.dc-eyebrow__dot { width: 9px; height: 9px; border-radius: 50%; background: var(--dc-yellow); box-shadow: 0 0 0 6px rgba(255,209,0,.12); }
.dc-section-kicker--light { color: var(--dc-yellow); }

.dc-hero h1 {
  max-width: 860px;
  margin-bottom: 24px;
  color: #fff;
  font-size: clamp(3.2rem, 6vw, 6.8rem);
  line-height: .94;
  font-weight: 850;
}

.dc-hero h1 span { color: var(--dc-yellow); }

.dc-hero__lead {
  max-width: 730px;
  color: rgba(255,255,255,.82);
  font-size: clamp(1.05rem, 1.5vw, 1.28rem);
  line-height: 1.75;
  margin-bottom: 32px;
}

.dc-hero__actions { display: flex; gap: 24px; align-items: center; flex-wrap: wrap; }

/* Use the theme's global .btn.btn-primary styling exactly.
   Keep this class only as a layout hook for the Diaspora page. */
.diaspora-connect-page .dc-global-btn {
  white-space: nowrap;
}

.diaspora-connect-page .dc-global-btn:disabled {
  opacity: .45;
  cursor: not-allowed;
}

.diaspora-connect-page .dc-global-btn:disabled:hover {
  transform: none;
}

.dc-text-link { display: inline-flex; gap: 8px; align-items: center; color: #fff; font-weight: 750; }
.dc-text-link:hover { color: var(--dc-yellow); }

.dc-hero__note {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  max-width: 700px;
  margin: 28px 0 0;
  color: rgba(255,255,255,.64);
  font-size: .82rem;
  line-height: 1.55;
}
.dc-hero__note i { color: var(--dc-yellow); margin-top: 2px; }

.dc-hero__panel {
  position: relative;
  overflow: hidden;
  padding: 34px;
  background: rgba(2, 38, 22, .55);
  border: 1px solid rgba(255,255,255,.16);
  box-shadow: 0 35px 80px rgba(0,0,0,.27);
  backdrop-filter: blur(12px);
}
.dc-hero__panel::before { content:""; position:absolute; inset:0 auto 0 0; width:5px; background:var(--dc-yellow); }
.dc-hero__crest-wrap { width: 104px; height:104px; display:grid; place-items:center; border-radius:50%; background:#fff; padding:8px; margin-bottom:24px; box-shadow:0 12px 30px rgba(0,0,0,.2); }
.dc-hero__crest-wrap img { max-width:100%; height:auto; }
.dc-hero__panel-copy small { display:block; color:rgba(255,255,255,.58); font-size:.72rem; text-transform:uppercase; letter-spacing:.12em; font-weight:700; }
.dc-hero__panel-copy strong { display:block; color:#fff; font-size:1.55rem; line-height:1.15; margin-top:6px; }
.dc-hero__stats { display:grid; gap:0; margin-top:30px; border-top:1px solid rgba(255,255,255,.13); }
.dc-hero__stats div { display:grid; grid-template-columns:48px 1fr; gap:10px; align-items:center; padding:16px 0; border-bottom:1px solid rgba(255,255,255,.13); }
.dc-hero__stats span { color:var(--dc-yellow); font-weight:850; }
.dc-hero__stats p { margin:0; color:rgba(255,255,255,.8); font-size:.92rem; }

.dc-intro { padding: 102px 0; }
.dc-intro__grid { display:grid; grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr); gap:80px; align-items:start; }
.dc-intro h2, .dc-about h2, .dc-registration h2 { font-size:clamp(2.1rem,3.5vw,3.6rem); line-height:1.08; margin:13px 0 0; }
/* Keep the two-column intro visually level: heading and first paragraph begin on the same top line. */
.dc-intro__grid > div:first-child h2 { margin-top:0; }
.dc-intro__copy { color:var(--dc-muted); font-size:1.05rem; line-height:1.85; }
.dc-intro__copy p:first-child { margin-top:0; }
.dc-intro__copy p:last-child { margin-bottom:0; }
.dc-process { display:grid; grid-template-columns:repeat(3,1fr); margin-top:62px; border:1px solid var(--dc-line); }
.dc-process__item { position:relative; min-height:290px; padding:36px 34px; background:#fff; border-right:1px solid var(--dc-line); }
.dc-process__item:last-child { border-right:0; }
.dc-process__number { position:absolute; right:24px; top:22px; color:#dfe7e3; font-size:2.5rem; font-weight:850; }
.dc-process__icon { width:54px; height:54px; display:grid; place-items:center; border-radius:50%; background:var(--dc-soft); color:var(--dc-green); font-size:1.35rem; margin-bottom:46px; }
.dc-process__item h3 { font-size:1.25rem; margin-bottom:10px; }
.dc-process__item p { color:var(--dc-muted); line-height:1.7; margin-bottom:0; }

.dc-about { padding: 0 0 102px; }
.dc-about__grid { display:grid; grid-template-columns:1.05fr .95fr; min-height:570px; }
.dc-about__card { position:relative; overflow:hidden; padding:68px 62px; }
.dc-about__card--primary { background:var(--dc-green); color:#fff; }
.dc-about__card--primary::before { content:""; position:absolute; width:420px; height:420px; border:1px solid rgba(255,255,255,.12); border-radius:50%; right:-150px; bottom:-150px; box-shadow:0 0 0 75px rgba(255,255,255,.035); }
.dc-about__card h2 { color:#fff; max-width:600px; margin-bottom:25px; }
.dc-about__card p { position:relative; z-index:2; max-width:630px; color:rgba(255,255,255,.77); font-size:1rem; line-height:1.85; }
.dc-about__mark { position:absolute; right:42px; bottom:14px; color:rgba(255,255,255,.05); font-size:9rem; line-height:1; font-weight:900; letter-spacing:-.06em; }
.dc-leadership { padding:68px 56px; background:#f4f6f5; }
.dc-leadership__head h2 { font-size:2.2rem; margin:12px 0 12px; }
.dc-leadership__head > p { color:var(--dc-muted); }
.dc-leadership__list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-top:32px; }
.dc-leader { min-width:0; overflow:hidden; background:#fff; border:1px solid #d9e2dd; transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.dc-leader:hover { transform:translateY(-2px); border-color:#c6d5cd; box-shadow:0 12px 28px rgba(0,56,32,.08); }
.dc-leader__visual { aspect-ratio:3 / 2; min-height:0; display:grid; place-items:center; position:relative; overflow:hidden; background:linear-gradient(145deg,var(--dc-green-deep),var(--dc-green)); }
.dc-leader__visual::before { content:""; position:absolute; inset:0; background:linear-gradient(135deg,transparent 0 48%,rgba(255,255,255,.045) 48% 52%,transparent 52% 100%); background-size:22px 22px; opacity:.7; }
.dc-leader__initials { position:relative; z-index:1; width:58px; height:58px; display:grid; place-items:center; border-radius:50%; border:1px solid rgba(255,255,255,.22); background:rgba(0,47,27,.62); color:var(--dc-yellow); font-size:1rem; font-weight:850; letter-spacing:.05em; box-shadow:0 8px 20px rgba(0,0,0,.16); }
.dc-leader__visual img { position:absolute; inset:0; z-index:1; width:100%; height:100%; object-fit:cover; object-position:center top; display:block; }
.dc-leader--has-image .dc-leader__visual::before { z-index:2; opacity:.22; pointer-events:none; }
.dc-leader__info { padding:9px 14px 10px; }
.dc-leader h3 { margin:0 0 2px; font-size:.96rem; line-height:1.18; }
.dc-leader p { margin:0; color:var(--dc-muted); font-size:.8rem; line-height:1.2; }

.dc-eligibility-highlight { background:var(--dc-green-deep); color:#fff; }
.dc-eligibility-highlight__inner { display:flex; justify-content:center; padding:48px 0 42px; text-align:center; }
.dc-eligibility-highlight__content { width:min(100%,900px); min-width:0; margin:0 auto; }
.dc-eligibility-highlight h2 { color:#fff; font-size:1.8rem; margin:8px 0 8px; }
.dc-eligibility-highlight p { color:rgba(255,255,255,.68); margin:0 auto; max-width:860px; line-height:1.65; }

/* Lightweight scroll cue: intentionally not styled as a button. */
.dc-scroll-register { display:inline-flex; flex-direction:column; align-items:center; gap:7px; margin-top:22px; color:#fff; text-decoration:none; font-weight:800; letter-spacing:.02em; line-height:1; transition:color .2s ease; }
.dc-scroll-register:hover,
.dc-scroll-register:focus-visible { color:var(--dc-yellow); text-decoration:none; }
.dc-scroll-register:focus-visible { outline:2px solid var(--dc-yellow); outline-offset:7px; }
.dc-scroll-register__label { font-size:.82rem; text-transform:uppercase; letter-spacing:.09em; }
.dc-scroll-register__arrow { position:relative; display:block; width:24px; height:24px; }
.dc-scroll-register__arrow i { position:absolute; left:50%; width:10px; height:10px; border-right:2px solid currentColor; border-bottom:2px solid currentColor; transform:translateX(-50%) rotate(45deg); animation:dc-scroll-chevron 1.6s ease-in-out infinite; }
.dc-scroll-register__arrow i:first-child { top:0; }
.dc-scroll-register__arrow i:last-child { top:7px; animation-delay:.18s; }
@keyframes dc-scroll-chevron {
  0%, 100% { opacity:.25; transform:translate(-50%,-2px) rotate(45deg); }
  45%, 65% { opacity:1; transform:translate(-50%,4px) rotate(45deg); }
}
@media (prefers-reduced-motion: reduce) {
  .dc-scroll-register__arrow i { animation:none; opacity:1; }
}

.dc-registration { padding:104px 0 115px; background:var(--dc-soft); scroll-margin-top:30px; }
.dc-registration__heading {
  display:grid;
  grid-template-columns:1fr .75fr;
  column-gap:80px;
  row-gap:13px;
  align-items:start;
  margin-bottom:44px;
}
.dc-registration__heading > .dc-section-kicker { grid-column:1 / -1; }
.dc-registration__heading > h2 { grid-column:1; margin:0; }
.dc-registration__heading > p { grid-column:2; align-self:start; color:var(--dc-muted); line-height:1.7; margin:0; }
.dc-required, .dc-registration label > span, .dc-registration legend > span { color:var(--dc-red); }
.dc-alert { display:flex; align-items:flex-start; gap:13px; padding:18px 20px; margin:0 0 22px; border:1px solid; background:#fff; line-height:1.55; }
.dc-alert--success { border-color:#9fd4b6; color:#145a33; }
.dc-alert--error { border-color:#efb0b3; color:#8e2528; }
.dc-alert i { font-size:1.2rem; margin-top:2px; }

.dc-form-shell { display:grid; grid-template-columns:320px minmax(0,1fr); background:#fff; box-shadow:0 26px 70px rgba(16,43,30,.09); border:1px solid #e2e9e5; }
.dc-form-nav { background:var(--dc-green-deep); color:#fff; padding:30px 26px; }
.dc-form-nav__intro { display:flex; align-items:center; gap:13px; padding-bottom:24px; border-bottom:1px solid rgba(255,255,255,.12); }
.dc-form-nav__intro img { width:49px; height:49px; object-fit:contain; background:#fff; border-radius:50%; padding:3px; }
.dc-form-nav__intro small { display:block; color:rgba(255,255,255,.55); font-size:.65rem; text-transform:uppercase; letter-spacing:.12em; font-weight:700; }
.dc-form-nav__intro strong { display:block; color:#fff; font-size:.92rem; margin-top:3px; }
.dc-step-list { list-style:none; padding:10px 0 0; margin:0; }
.dc-step-list li { position:relative; display:grid; grid-template-columns:36px 1fr; gap:12px; align-items:center; min-height:66px; color:rgba(255,255,255,.52); }
.dc-step-list li::after { content:""; position:absolute; left:17px; top:50px; bottom:-16px; width:1px; background:rgba(255,255,255,.11); }
.dc-step-list li:last-child::after { display:none; }
.dc-step-list li > span { position:relative; z-index:2; width:35px; height:35px; display:grid; place-items:center; border-radius:50%; border:1px solid rgba(255,255,255,.18); background:var(--dc-green-deep); font-size:.75rem; font-weight:800; }
.dc-step-list li div { font-size:.84rem; font-weight:750; }
.dc-step-list li small { display:block; color:rgba(255,255,255,.38); font-size:.68rem; font-weight:500; margin-top:2px; }
.dc-step-list li.is-active { color:#fff; }
.dc-step-list li.is-active > span { background:var(--dc-yellow); border-color:var(--dc-yellow); color:#111; box-shadow:0 0 0 5px rgba(255,209,0,.09); }
.dc-step-list li.is-complete > span { background:var(--dc-green); border-color:var(--dc-green); color:#fff; }
.dc-form-nav__privacy { display:flex; gap:10px; align-items:flex-start; margin-top:30px; padding:16px; background:rgba(255,255,255,.055); color:rgba(255,255,255,.5); font-size:.69rem; line-height:1.55; }
.dc-form-nav__privacy i { color:var(--dc-yellow); }

.dc-form-main { min-width:0; padding:46px 48px 40px; }
.dc-mobile-progress { display:none; }
.dc-form-step { display:block; }
.dc-form-step[hidden] { display:none !important; }
.dc-js .dc-form-step { display:none; }
.dc-js .dc-form-step.is-active:not([hidden]) { display:block; animation:dcStepIn .28s ease; }
@keyframes dcStepIn { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:none; } }
.dc-form-step__head { display:flex; gap:18px; align-items:center; padding-bottom:26px; margin-bottom:30px; border-bottom:1px solid var(--dc-line); }
.dc-step-badge { flex:0 0 52px; width:52px; height:52px; display:grid; place-items:center; background:var(--dc-green); color:var(--dc-yellow); font-weight:850; }
.dc-form-step__head h3 { margin:0 0 5px; font-size:1.55rem; }
.dc-form-step__head p { margin:0; color:var(--dc-muted); line-height:1.55; }
.dc-important-note { display:flex; gap:12px; padding:16px 18px; margin:-8px 0 28px; background:#fff8d8; border-left:4px solid var(--dc-yellow); color:#5b4b00; }
.dc-important-note p { margin:0; font-size:.88rem; line-height:1.6; }
.dc-important-note i { color:#8d7300; margin-top:2px; }

.dc-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:23px 24px; }
.dc-field { min-width:0; margin:0; padding:0; border:0; }
.dc-field--full { grid-column:1 / -1; }
.dc-field label:not(.dc-consent):not(.dc-upload), .dc-field legend { display:block; width:100%; margin:0 0 8px; color:#25302a; font-size:.79rem; font-weight:750; }
.dc-field label small { color:var(--dc-muted); font-weight:500; }
.dc-field > small { display:block; margin-top:6px; color:#8a938e; font-size:.7rem; }
.dc-field input[type="text"], .dc-field input[type="email"], .dc-field input[type="tel"], .dc-field input[type="url"], .dc-field input[type="date"], .dc-field select, .dc-field textarea {
  width:100%; min-height:50px; border:1px solid #ccd6d1; border-radius:3px; background:#fff; padding:12px 14px; color:#17211c; font:inherit; font-size:.9rem; outline:none; transition:border .2s ease, box-shadow .2s ease;
}
.dc-field textarea { min-height:92px; resize:vertical; }
.dc-field input:focus, .dc-field select:focus, .dc-field textarea:focus { border-color:var(--dc-green); box-shadow:0 0 0 3px rgba(3,111,60,.08); }
.dc-field .is-invalid { border-color:var(--dc-red) !important; box-shadow:0 0 0 3px rgba(237,50,55,.07) !important; }
.dc-error-message { display:block; margin-top:5px; color:var(--dc-red); font-size:.69rem; font-weight:650; }

.dc-choice-row, .dc-choice-grid { display:flex; flex-wrap:wrap; gap:10px; }
.dc-choice-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); }
.dc-choice-row label, .dc-choice-grid label { cursor:pointer; }
.dc-choice-row input, .dc-choice-grid input { position:absolute; opacity:0; pointer-events:none; }
.dc-choice-row label span, .dc-choice-grid label span { display:flex; align-items:center; justify-content:center; min-height:44px; padding:9px 15px; border:1px solid #d3ddd8; border-radius:3px; background:#fff; color:#35423b; font-size:.79rem; font-weight:700; text-align:center; transition:.18s ease; }
.dc-choice-row input:checked + span, .dc-choice-grid input:checked + span { border-color:var(--dc-green); background:#eaf5ef; color:var(--dc-green-dark); box-shadow:inset 0 -2px 0 var(--dc-green); }
.dc-choice-row input:focus-visible + span, .dc-choice-grid input:focus-visible + span { outline:2px solid var(--dc-yellow); outline-offset:2px; }

.dc-upload-field > input[type="file"] { position:absolute; width:1px; height:1px; opacity:0; pointer-events:none; }
.dc-upload { display:grid !important; grid-template-columns:auto 1fr auto; gap:14px; align-items:center; min-height:84px; border:1px dashed #aebdb5; background:#f8faf9; padding:18px; cursor:pointer; }
.dc-upload > i { width:44px; height:44px; display:grid; place-items:center; border-radius:50%; background:#e4f1ea; color:var(--dc-green); font-size:1.25rem; }
.dc-upload span { color:#233029 !important; }
.dc-upload strong { display:block; font-size:.85rem; }
.dc-upload small { display:block; margin-top:3px; color:var(--dc-muted); font-size:.69rem; }
.dc-upload em { color:var(--dc-muted); font-size:.72rem; font-style:normal; max-width:180px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

.dc-js [data-dc-conditional] { display:none; }
.dc-js [data-dc-conditional].is-visible { display:block; }
.dc-js .dc-fields [data-dc-conditional].dc-field--full.is-visible { display:block; }
.dc-declaration { display:grid; gap:13px; }
.dc-consent { display:flex; align-items:flex-start; gap:12px; padding:15px 16px; border:1px solid #d9e1dd; background:#fff; cursor:pointer; font-size:.82rem; line-height:1.6; }
.dc-consent input { width:18px; height:18px; flex:0 0 18px; margin-top:2px; accent-color:var(--dc-green); }
.dc-consent span { color:#3b4741 !important; }
.dc-consent em { color:var(--dc-red); font-style:normal; }
.dc-final-note { display:flex; gap:14px; align-items:flex-start; margin-top:24px; padding:20px; background:var(--dc-soft); }
.dc-final-note i { color:var(--dc-green); font-size:1.35rem; }
.dc-final-note strong { display:block; margin-bottom:4px; }
.dc-final-note p { margin:0; color:var(--dc-muted); font-size:.8rem; line-height:1.6; }
.dc-form-actions { display:flex; justify-content:space-between; gap:14px; padding-top:32px; margin-top:34px; border-top:1px solid var(--dc-line); }
.dc-form-actions .dc-global-btn:last-child { margin-left:auto; }
.dc-honeypot { position:absolute !important; left:-99999px !important; width:1px !important; height:1px !important; overflow:hidden !important; }

.dc-bottom-cta { padding:75px 0; background:var(--dc-green); }
.dc-bottom-cta__inner { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:50px; align-items:center; }
.dc-bottom-cta h2 { max-width:850px; color:#fff; font-size:clamp(2rem,3.6vw,3.5rem); line-height:1.08; margin:10px 0 0; }

@media (max-width: 1199.98px) {
  .dc-hero__container { grid-template-columns:1fr .55fr; gap:45px; }
  .dc-form-shell { grid-template-columns:280px minmax(0,1fr); }
  .dc-form-main { padding:40px 34px 34px; }
  .dc-choice-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media (max-width: 991.98px) {
  .dc-hero { min-height:auto; padding:88px 0 70px; }
  .dc-hero__container { grid-template-columns:1fr; }
  .dc-hero__content { max-width:780px; }
  .dc-hero__panel { max-width:560px; }
  .dc-intro__grid, .dc-about__grid, .dc-registration__heading { grid-template-columns:1fr; gap:28px; }
  .dc-registration__heading > .dc-section-kicker,
  .dc-registration__heading > h2,
  .dc-registration__heading > p { grid-column:1; }
  .dc-registration__heading { row-gap:14px; }
  .dc-process { grid-template-columns:1fr; }
  .dc-process__item { min-height:0; border-right:0; border-bottom:1px solid var(--dc-line); }
  .dc-process__item:last-child { border-bottom:0; }
  .dc-about__card, .dc-leadership { padding:52px 42px; }
  .dc-form-shell { grid-template-columns:1fr; }
  .dc-form-nav { display:none; }
  .dc-mobile-progress { display:block; margin-bottom:30px; }
  .dc-mobile-progress__meta { display:flex; justify-content:space-between; gap:20px; color:#6a756f; font-size:.75rem; font-weight:700; }
  .dc-mobile-progress__bar { height:4px; margin-top:9px; background:#e4ebe7; overflow:hidden; }
  .dc-mobile-progress__bar span { display:block; height:100%; background:var(--dc-green); transition:width .25s ease; }
}

@media (max-width: 767.98px) {
  .dc-hero { padding:70px 0 58px; }
  .dc-hero h1 { font-size:clamp(2.8rem,14vw,4.6rem); }
  .dc-hero__panel { padding:26px 24px; }
  .dc-intro, .dc-registration { padding:72px 0; }
  .dc-about { padding-bottom:72px; }
  .dc-intro__grid { gap:22px; }
  .dc-process { margin-top:40px; }
  .dc-process__item { padding:30px 25px; }
  .dc-about__card, .dc-leadership { padding:42px 26px; }
  .dc-leadership__list { grid-template-columns:1fr; gap:16px; }
  /* Keep the same card structure on small screens: image on top, details below. */
  .dc-leader { display:block; }
  .dc-leader__visual { aspect-ratio:4 / 5; height:auto; }
  .dc-leader__initials { width:52px; height:52px; }
  .dc-leader__info { display:block; padding:10px 14px 11px; }
  .dc-about__mark { font-size:6.5rem; }
  .dc-eligibility-highlight__inner { padding:42px 0 38px; }
  .dc-eligibility-highlight__content { max-width:620px; }
  .dc-scroll-register { margin-top:20px; }
  .dc-registration__heading { margin-bottom:30px; }
  .dc-form-main { padding:30px 20px 24px; }
  .dc-fields { grid-template-columns:1fr; gap:20px; }
  .dc-field--full { grid-column:auto; }
  .dc-choice-grid { grid-template-columns:1fr; }
  .dc-choice-row label { flex:1 1 90px; }
  .dc-upload { grid-template-columns:auto 1fr; }
  .dc-upload em { grid-column:2; max-width:100%; }
  .dc-form-step__head { align-items:flex-start; }
  .dc-step-badge { flex-basis:44px; width:44px; height:44px; }
  .dc-form-step__head h3 { font-size:1.3rem; }
  .dc-form-actions { flex-wrap:wrap; }
  .dc-form-actions .dc-global-btn { flex:1 1 calc(50% - 7px); }
  .dc-form-actions .dc-submit { flex-basis:100%; margin-left:0 !important; }
  .dc-bottom-cta__inner { grid-template-columns:1fr; gap:26px; }
}

@media (max-width: 479.98px) {
  .dc-hero__actions { align-items:stretch; }
  .dc-hero__actions .dc-global-btn { width:100%; }
  .dc-text-link { width:100%; justify-content:center; }
  .dc-hero__crest-wrap { width:86px; height:86px; }
  .dc-hero__panel-copy strong { font-size:1.3rem; }
  .dc-form-main { padding-left:15px; padding-right:15px; }
  .dc-form-actions .dc-global-btn { width:100%; flex-basis:100%; }
}

/* ================================================================
   Diaspora Connect UX/UI polish v2
   IMPORTANT: header overrides are scoped to .zifa-diaspora-page only.
   Nothing below changes any other ZIFA page.
   ================================================================ */

/* Give the campaign page a calmer, premium header without changing the
   existing site header globally. The original header is fixed on desktop,
   so the hero is deliberately offset below it. */
body.zifa-diaspora-page .desktop-header {
  padding: 6px 0 5px;
  background: linear-gradient(180deg, rgba(0, 44, 25, .98) 0%, rgba(0, 49, 28, .94) 82%, rgba(0, 49, 28, .88) 100%);
  border-bottom: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 8px 28px rgba(0, 24, 14, .16);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}

body.zifa-diaspora-page .desktop-header img.desktop-logo {
  width: 118px;
}

body.zifa-diaspora-page .desktop-header img.desktop-logo:hover {
  opacity: 1;
  transform: none;
}

body.zifa-diaspora-page .desktop-header .header-links-wrap {
  border-bottom-color: rgba(255,255,255,.34);
}

body.zifa-diaspora-page nav.menu.external-menu > ul {
  margin-top: 12px;
}

body.zifa-diaspora-page .desktop-header .external-menu .menu-item {
  font-size: .89rem;
}

body.zifa-diaspora-page .desktop-header nav.menu > ul {
  font-size: .82rem;
}

body.zifa-diaspora-page .desktop-header nav.menu > ul > li > a {
  padding: 13px 8px;
}

body.zifa-diaspora-page .desktop-header nav.menu.external-menu > ul > li > a {
  padding: 8px 9px 10px;
}

/* Desktop hero: content starts beneath the fixed navigation instead of
   sitting behind it. */
body.zifa-diaspora-page .dc-hero {
  min-height: 860px;
  padding: 212px 0 82px;
  align-items: center;
}

body.zifa-diaspora-page .dc-hero__container {
  grid-template-columns: minmax(0, 1.18fr) minmax(360px, .72fr);
  gap: clamp(48px, 5vw, 82px);
}

body.zifa-diaspora-page .dc-hero__content {
  max-width: 800px;
}

body.zifa-diaspora-page .dc-eyebrow {
  margin-bottom: 18px;
}

body.zifa-diaspora-page .dc-hero h1 {
  max-width: 760px;
  margin-bottom: 25px;
  color: #fff;
  font-size: clamp(3.45rem, 5vw, 5.6rem);
  line-height: .98;
  letter-spacing: -.045em;
  text-wrap: balance;
}

body.zifa-diaspora-page .dc-hero h1 span {
  display: block;
  width: fit-content;
  margin-top: 5px;
  color: var(--dc-yellow);
}

body.zifa-diaspora-page .dc-hero__lead {
  max-width: 700px;
  margin-bottom: 30px;
  color: rgba(255,255,255,.86);
  line-height: 1.68;
}

body.zifa-diaspora-page .dc-hero__note {
  max-width: 675px;
  color: rgba(255,255,255,.70);
}

body.zifa-diaspora-page .dc-hero__panel {
  width: 100%;
  max-width: 450px;
  justify-self: end;
  padding: 32px 34px;
  background: rgba(0, 48, 27, .70);
  border-color: rgba(255,255,255,.20);
  box-shadow: 0 28px 65px rgba(0, 25, 14, .26);
}

body.zifa-diaspora-page .dc-hero__panel-copy strong {
  font-size: 1.7rem;
  line-height: 1.16;
}

body.zifa-diaspora-page .dc-hero__stats div {
  min-height: 64px;
}

/* Anchor and step scrolling should stop below the fixed desktop header. */
body.zifa-diaspora-page .dc-registration,
body.zifa-diaspora-page .dc-form-shell,
body.zifa-diaspora-page #how-it-works {
  scroll-margin-top: 190px;
}

/* Small interaction/accessibility improvements. */
body.zifa-diaspora-page .dc-global-btn:focus-visible,
body.zifa-diaspora-page .dc-text-link:focus-visible,
body.zifa-diaspora-page .dc-choice-row input:focus-visible + span,
body.zifa-diaspora-page .dc-choice-grid input:focus-visible + span {
  outline: 3px solid #fff;
  outline-offset: 4px;
}

body.zifa-diaspora-page .dc-field input:hover,
body.zifa-diaspora-page .dc-field select:hover,
body.zifa-diaspora-page .dc-field textarea:hover {
  border-color: #aebcb5;
}

body.zifa-diaspora-page .dc-step-list li.is-complete {
  cursor: pointer;
}

body.zifa-diaspora-page .dc-step-list li.is-complete:hover {
  color: #fff;
}

body.zifa-diaspora-page .dc-form-shell {
  border-radius: 2px;
  overflow: hidden;
}

/* The full desktop navigation is too dense at laptop widths. On this landing
   page only, use the theme's existing mobile header from 993–1199px. */
@media (min-width: 993px) and (max-width: 1199.98px) {
  body.zifa-diaspora-page .desktop-header {
    display: none;
  }

  body.zifa-diaspora-page .mobile-header {
    display: block;
  }

  body.zifa-diaspora-page .dc-hero {
    min-height: auto;
    padding: 82px 0 72px;
  }

  body.zifa-diaspora-page .dc-hero__container {
    grid-template-columns: minmax(0, 1.1fr) minmax(310px, .7fr);
    gap: 38px;
  }

  body.zifa-diaspora-page .dc-hero h1 {
    font-size: clamp(3.2rem, 6.5vw, 4.8rem);
  }

  body.zifa-diaspora-page .dc-registration,
  body.zifa-diaspora-page .dc-form-shell,
  body.zifa-diaspora-page #how-it-works {
    scroll-margin-top: 28px;
  }
}

@media (max-width: 991.98px) {
  body.zifa-diaspora-page .dc-hero {
    padding: 74px 0 66px;
  }

  body.zifa-diaspora-page .dc-hero__container {
    gap: 44px;
  }

  body.zifa-diaspora-page .dc-hero__panel {
    justify-self: start;
    max-width: 600px;
  }

  body.zifa-diaspora-page .dc-registration,
  body.zifa-diaspora-page .dc-form-shell,
  body.zifa-diaspora-page #how-it-works {
    scroll-margin-top: 24px;
  }
}

@media (max-width: 767.98px) {
  body.zifa-diaspora-page .dc-hero {
    padding: 58px 0 54px;
  }

  body.zifa-diaspora-page .dc-eyebrow {
    margin-bottom: 15px;
    font-size: .70rem;
  }

  body.zifa-diaspora-page .dc-hero h1 {
    max-width: 620px;
    margin-bottom: 20px;
    font-size: clamp(2.65rem, 13vw, 4.15rem);
    line-height: 1;
  }

  body.zifa-diaspora-page .dc-hero__lead {
    margin-bottom: 24px;
    font-size: 1rem;
    line-height: 1.65;
  }

  body.zifa-diaspora-page .dc-hero__actions {
    gap: 16px;
  }

  body.zifa-diaspora-page .dc-hero__note {
    margin-top: 22px;
  }

  body.zifa-diaspora-page .dc-hero__panel {
    padding: 25px 24px;
  }
}

@media (max-width: 479.98px) {
  body.zifa-diaspora-page .dc-hero h1 {
    font-size: clamp(2.55rem, 13.5vw, 3.55rem);
  }

  body.zifa-diaspora-page .dc-hero__panel-copy strong {
    font-size: 1.38rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.zifa-diaspora-page *,
  body.zifa-diaspora-page *::before,
  body.zifa-diaspora-page *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* ================================================================
   Diaspora Connect form validation UX
   Scoped to this page only. Makes missing required answers obvious and
   scrolls to the exact question rather than the top of the form.
   ================================================================ */
body.zifa-diaspora-page .dc-field.has-error > label,
body.zifa-diaspora-page .dc-field.has-error > legend {
  color: var(--dc-red);
}

body.zifa-diaspora-page .dc-field.has-error .dc-choice-row label span,
body.zifa-diaspora-page .dc-field.has-error .dc-choice-grid label span {
  border-color: #df777a;
  background: #fffafa;
}

body.zifa-diaspora-page .dc-field.has-error .dc-choice-row input:checked + span,
body.zifa-diaspora-page .dc-field.has-error .dc-choice-grid input:checked + span {
  border-color: var(--dc-green);
  background: #eaf5ef;
}

body.zifa-diaspora-page .dc-consent.has-error,
body.zifa-diaspora-page .dc-field.has-error .dc-consent {
  border-color: #df777a;
  background: #fffafa;
}

body.zifa-diaspora-page .dc-error-message {
  margin-top: 8px;
  color: #b42328;
  font-size: .76rem;
  font-weight: 750;
  line-height: 1.45;
}

body.zifa-diaspora-page .dc-field.has-error .dc-error-message::before {
  content: "!";
  display: inline-grid;
  place-items: center;
  width: 16px;
  height: 16px;
  margin-right: 6px;
  border-radius: 50%;
  background: #b42328;
  color: #fff;
  font-size: .65rem;
  font-weight: 900;
  vertical-align: 1px;
}

body.zifa-diaspora-page .dc-step-error-summary {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  margin: -8px 0 26px;
  padding: 14px 16px;
  border-left: 4px solid #b42328;
  background: #fff4f4;
  color: #7a2024;
}

body.zifa-diaspora-page .dc-step-error-summary__icon {
  flex: 0 0 24px;
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: #b42328;
  color: #fff;
  font-size: .75rem;
  font-weight: 900;
}

body.zifa-diaspora-page .dc-step-error-summary strong {
  display: block;
  color: #7a2024;
  font-size: .82rem;
  line-height: 1.4;
}

body.zifa-diaspora-page .dc-step-error-summary small {
  display: block;
  margin-top: 2px;
  color: #9b4a4d;
  font-size: .72rem;
  line-height: 1.4;
}

/* The actual radio inputs are visually hidden, so make the visible option
   the error target instead of outlining an invisible control. */
body.zifa-diaspora-page .dc-choice-row input.is-invalid,
body.zifa-diaspora-page .dc-choice-grid input.is-invalid {
  box-shadow: none !important;
}

/* ================================================================
   Diaspora Connect post-submission state
   Scoped to this landing page only. After a successful POST, show a clear
   confirmation at the registration anchor instead of re-rendering the form.
   ================================================================ */
body.zifa-diaspora-page #registration-status {
  scroll-margin-top: 190px;
}

body.zifa-diaspora-page .dc-success-card {
  max-width: 860px;
  margin: 0 auto;
  padding: clamp(34px, 5vw, 62px);
  background: #fff;
  border: 1px solid var(--dc-line);
  box-shadow: 0 24px 65px rgba(16,43,30,.09);
  text-align: center;
  outline: none;
}

body.zifa-diaspora-page .dc-success-card__icon {
  width: 70px;
  height: 70px;
  display: grid;
  place-items: center;
  margin: 0 auto 22px;
  border-radius: 50%;
  background: var(--dc-green);
  color: var(--dc-yellow);
  font-size: 1.75rem;
}

body.zifa-diaspora-page .dc-success-card .dc-section-kicker {
  justify-content: center;
}

body.zifa-diaspora-page .dc-success-card h3 {
  max-width: 680px;
  margin: 12px auto 16px;
  color: var(--dc-ink);
  font-size: clamp(2rem, 4vw, 3.25rem);
  line-height: 1.08;
}

body.zifa-diaspora-page .dc-success-card > p {
  max-width: 690px;
  margin: 0 auto;
  color: var(--dc-muted);
  font-size: 1rem;
  line-height: 1.75;
}

body.zifa-diaspora-page .dc-success-card .dc-success-card__note {
  max-width: 640px;
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid var(--dc-line);
  font-size: .86rem;
}

body.zifa-diaspora-page .dc-success-card__actions {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 24px;
  flex-wrap: wrap;
  margin-top: 30px;
}

body.zifa-diaspora-page .dc-text-link--green {
  color: var(--dc-green-dark);
}

body.zifa-diaspora-page .dc-text-link--green:hover {
  color: var(--dc-green);
}

@media (max-width: 1199.98px) {
  body.zifa-diaspora-page #registration-status {
    scroll-margin-top: 28px;
  }
}

@media (max-width: 767.98px) {
  body.zifa-diaspora-page .dc-success-card {
    text-align: left;
  }

  body.zifa-diaspora-page .dc-success-card__icon,
  body.zifa-diaspora-page .dc-success-card .dc-section-kicker,
  body.zifa-diaspora-page .dc-success-card h3,
  body.zifa-diaspora-page .dc-success-card > p {
    margin-left: 0;
    margin-right: 0;
  }

  body.zifa-diaspora-page .dc-success-card .dc-section-kicker {
    justify-content: flex-start;
  }

  body.zifa-diaspora-page .dc-success-card__actions {
    justify-content: flex-start;
    gap: 18px;
  }
}

/* ================================================================
   Diaspora Connect hero viewport fit
   Desktop-only and page-scoped. Keeps the complete campaign hero inside
   the first viewport on common laptop/desktop screen heights.
   ================================================================ */
@media (min-width: 1200px) {
  body.zifa-diaspora-page .dc-hero {
    box-sizing: border-box;
    min-height: 100vh;
    min-height: 100svh;
    padding: 158px 0 38px;
    align-items: flex-start;
  }

  body.zifa-diaspora-page .dc-hero__container {
    align-items: center;
    grid-template-columns: minmax(0, 1.16fr) minmax(350px, .70fr);
    gap: clamp(46px, 5vw, 78px);
  }

  body.zifa-diaspora-page .dc-hero__content {
    max-width: 760px;
  }

  body.zifa-diaspora-page .dc-hero h1 {
    max-width: 700px;
    margin-bottom: 20px;
    font-size: clamp(3.65rem, 4.35vw, 5rem);
    line-height: .96;
  }

  body.zifa-diaspora-page .dc-hero__lead {
    max-width: 680px;
    margin-bottom: 24px;
    font-size: clamp(1rem, 1.12vw, 1.15rem);
    line-height: 1.58;
  }

  body.zifa-diaspora-page .dc-hero__panel {
    max-width: 430px;
    padding: 28px 32px;
  }

  body.zifa-diaspora-page .dc-hero__panel-copy strong {
    font-size: 1.5rem;
  }

  body.zifa-diaspora-page .dc-hero__stats {
    margin-top: 24px;
  }

  body.zifa-diaspora-page .dc-hero__stats div {
    min-height: 0;
    padding: 14px 0;
  }
}

/* Short laptop screens need a tighter first fold. */
@media (min-width: 1200px) and (max-height: 780px) {
  body.zifa-diaspora-page .dc-hero {
    padding-top: 138px;
    padding-bottom: 24px;
  }

  body.zifa-diaspora-page .desktop-header img.desktop-logo {
    width: 106px;
  }

  body.zifa-diaspora-page nav.menu.external-menu > ul {
    margin-top: 8px;
  }

  body.zifa-diaspora-page .desktop-header nav.menu > ul > li > a {
    padding-top: 10px;
    padding-bottom: 10px;
  }

  body.zifa-diaspora-page .dc-hero h1 {
    max-width: 660px;
    margin-bottom: 17px;
    font-size: clamp(3.35rem, 4vw, 4.45rem);
  }

  body.zifa-diaspora-page .dc-hero__lead {
    max-width: 650px;
    margin-bottom: 20px;
    font-size: 1.02rem;
    line-height: 1.5;
  }

  body.zifa-diaspora-page .dc-hero__panel {
    max-width: 410px;
    padding: 24px 28px;
  }

  body.zifa-diaspora-page .dc-hero__panel-copy strong {
    font-size: 1.4rem;
  }

  body.zifa-diaspora-page .dc-hero__stats {
    margin-top: 20px;
  }

  body.zifa-diaspora-page .dc-hero__stats div {
    padding: 12px 0;
  }
}

/* ================================================================
   Diaspora Connect hero vertical centering
   Page-scoped: centers the two hero columns inside the first viewport
   without changing the shared ZIFA header or any other page.
   ================================================================ */
@media (min-width: 1200px) {
  body.zifa-diaspora-page .dc-hero {
    min-height: 100vh;
    min-height: 100svh;
    padding-top: 108px;
    padding-bottom: 28px;
    align-items: center;
  }

  body.zifa-diaspora-page .dc-hero__container {
    width: 100%;
    align-items: center;
  }

  body.zifa-diaspora-page .dc-hero__content,
  body.zifa-diaspora-page .dc-hero__panel {
    align-self: center;
  }
}

/* Keep the same centered composition on shorter laptop screens while
   preserving enough clearance for the fixed navigation. */
@media (min-width: 1200px) and (max-height: 780px) {
  body.zifa-diaspora-page .dc-hero {
    padding-top: 84px;
    padding-bottom: 20px;
  }
}


/* ================================================================
   Diaspora Connect — shared ZIFA banner artwork
   Uses the exact img/default/banner-image.jpg asset used by the theme's
   standard inner-page banners. Page-scoped so no other ZIFA page changes.
   ================================================================ */
body.zifa-diaspora-page .dc-hero {
  background:
    linear-gradient(90deg, rgba(0, 47, 27, .89) 0%, rgba(3, 111, 60, .78) 52%, rgba(0, 47, 27, .84) 100%),
    var(--dc-hero-image) center center / cover no-repeat;
}

/* The shared banner artwork already carries its own pattern, so avoid
   layering the Diaspora diagonal texture over it. */
body.zifa-diaspora-page .dc-hero::before {
  display: none;
}

/* ================================================================
   Diaspora Connect hero panel — scroll-linked yellow accent
   The vertical ZIFA-yellow stripe begins short and progressively fills
   as the visitor moves down the first part of the page. Scrolling back
   up reverses the motion. Scoped to Diaspora Connect only.
   ================================================================ */
body.zifa-diaspora-page .dc-hero__panel {
  --dc-panel-accent-progress: 22%;
}

body.zifa-diaspora-page .dc-hero__panel::before {
  inset: 0 auto auto 0;
  width: 5px;
  height: var(--dc-panel-accent-progress);
  background: var(--dc-yellow);
  box-shadow: 0 0 14px rgba(255, 209, 0, .20);
  will-change: height;
}

/* A very small glow at the moving end gives the fill a polished sense of motion. */
body.zifa-diaspora-page .dc-hero__panel::after {
  content: "";
  position: absolute;
  z-index: 2;
  left: 0;
  top: calc(var(--dc-panel-accent-progress) - 6px);
  width: 5px;
  height: 12px;
  background: var(--dc-yellow);
  box-shadow: 0 0 16px rgba(255, 209, 0, .48);
  pointer-events: none;
  will-change: top;
}

@media (prefers-reduced-motion: reduce) {
  body.zifa-diaspora-page .dc-hero__panel {
    --dc-panel-accent-progress: 100%;
  }

  body.zifa-diaspora-page .dc-hero__panel::after {
    display: none;
  }
}


/* Diaspora form refinements: position pairing + clearer field hints. */
body.zifa-diaspora-page .dc-field-hint {
  display: block;
  margin-top: 6px;
  color: #75807b;
  font-size: .72rem;
  line-height: 1.4;
}
body.zifa-diaspora-page .dc-field select option:disabled {
  color: #9ba39f;
}

/* ================================================================
   About + leadership balance refinement
   Desktop only: give leadership portraits a little more height and
   vertically balance both halves of the About ZIFA split section.
   Scoped to Diaspora Connect so shared ZIFA pages are unaffected.
   ================================================================ */
@media (min-width: 992px) {
  /* Keep both halves aligned from the top. The grid itself stretches the
     green About panel to the same height as Leadership, so we do not need
     to vertically center the shorter copy. */
  body.zifa-diaspora-page .dc-about__grid {
    align-items: stretch;
    min-height: 0;
  }

  body.zifa-diaspora-page .dc-about__card--primary,
  body.zifa-diaspora-page .dc-leadership {
    display: block;
  }

  body.zifa-diaspora-page .dc-leader__visual {
    aspect-ratio: 4 / 3;
  }
}

/* ================================================================
   About ZIFA vertical centering refinement
   Desktop only: center the About ZIFA copy inside the green panel so
   the equal-height split does not leave a large empty area below.
   Leadership remains top-aligned. Scoped to Diaspora Connect only.
   ================================================================ */
@media (min-width: 992px) {
  body.zifa-diaspora-page .dc-about__card--primary {
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
}