/* Hand of Giving editorial system. Loaded after legacy page styles. */
:root {
  --hog-canvas: #fff8ec;
  --hog-paper: #fbf7ef;
  --hog-surface: #ffffff;
  --hog-ink: #08261e;
  --hog-green: #0b3d2e;
  --hog-green-mid: #2f5d50;
  --hog-muted: #56615c;
  --hog-border: #d8cdb8;
  --hog-red: oklch(0.541 0.213 24.791);
  --hog-red-dark: oklch(0.492 0.192 24.677);
  --hog-red-soft: oklch(0.936 0.032 24.8);
  --hog-orange: var(--hog-red);
  --hog-orange-dark: var(--hog-red-dark);
  --hog-danger: var(--hog-red-dark);
  --hog-success: #3a7d44;
  --hog-radius: 8px;
  --hog-shadow: 0 18px 45px rgba(8, 38, 30, 0.1);
  --hog-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --hog-page-gutter: clamp(1rem, 3vw, 2rem);
  --hog-section-space: clamp(3.5rem, 6vw, 6rem);
  --hog-section-space-compact: clamp(2.5rem, 4vw, 4rem);
  --hog-content-max: 1400px;
}

html {
  background: var(--hog-canvas);
  color-scheme: light;
  scroll-behavior: smooth;
}

html,
body,
button,
input,
select,
textarea {
  letter-spacing: 0 !important;
}

body {
  background: var(--hog-canvas) !important;
  color: var(--hog-ink) !important;
  overflow-x: clip;
}

/* Shared page shell. Keeps one responsive gutter around normal-flow content;
   full-bleed sections can still break out with their existing viewport margins. */
#main > .site-shell {
  width: 100%;
  max-width: calc(var(--hog-content-max) + 4rem);
  padding-inline: var(--hog-page-gutter) !important;
}

#main > .site-shell > * {
  min-width: 0;
}

#impact {
  margin-top: var(--hog-section-space);
}

.min-h-screen {
  min-height: 100dvh !important;
}

.h-screen {
  height: 100dvh !important;
}

img,
video,
canvas,
iframe {
  max-width: 100%;
}

main article img,
main figure img {
  outline: 1px solid oklch(0 0 0 / 0.1);
  outline-offset: -1px;
}

.grid > *,
.flex > * {
  min-width: 0;
}

body::before {
  position: fixed;
  inset: 0;
  z-index: 100;
  pointer-events: none;
  content: "";
  opacity: 0.035;
  background-image: none;
  mix-blend-mode: multiply;
}

::selection {
  color: #fff;
  background: var(--hog-orange);
}

:focus-visible {
  outline: 3px solid var(--hog-orange) !important;
  outline-offset: 3px !important;
}

/* Shape lock: cards 8px, controls 8px, compact statuses 6px. */
.rounded-3xl,
.rounded-2xl,
.rounded-xl,
.sm\:rounded-3xl,
.sm\:rounded-2xl {
  border-radius: var(--hog-radius) !important;
}

a,
button,
input,
select,
textarea {
  border-radius: var(--hog-radius) !important;
}

.rounded-full {
  border-radius: 999px !important;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  color: var(--hog-ink);
  letter-spacing: 0 !important;
  text-wrap: balance;
}

p {
  text-wrap: pretty;
}

.text-gray-900,
.text-gray-800,
.text-slate-900,
.text-slate-800 {
  color: var(--hog-ink) !important;
}

.text-gray-700,
.text-gray-600,
.text-gray-500,
.text-slate-700,
.text-slate-600,
.text-slate-500 {
  color: var(--hog-muted) !important;
}

.text-purple-400,
.text-purple-500,
.text-purple-600,
.text-purple-700,
.text-pink-400,
.text-pink-500,
.text-pink-600,
.text-pink-700,
.text-rose-400,
.text-rose-500,
.text-rose-600,
.text-rose-700,
.text-teal-400,
.text-teal-500,
.text-teal-600,
.text-teal-700,
.text-cyan-400,
.text-cyan-500,
.text-cyan-600,
.text-cyan-700,
.text-blue-400,
.text-blue-500,
.text-blue-600,
.text-blue-700,
.text-indigo-400,
.text-indigo-500,
.text-indigo-600,
.text-indigo-700,
.text-amber-500,
.text-amber-600,
.text-amber-700 {
  color: var(--hog-green) !important;
}

.bg-purple-50,
.bg-purple-100,
.bg-pink-50,
.bg-pink-100,
.bg-rose-50,
.bg-rose-100,
.bg-teal-50,
.bg-teal-100,
.bg-cyan-50,
.bg-cyan-100,
.bg-blue-50,
.bg-blue-100,
.bg-indigo-50,
.bg-indigo-100,
.bg-amber-50,
.bg-amber-100,
.bg-gray-50,
.bg-gray-100 {
  background-color: rgba(216, 205, 184, 0.32) !important;
}

.bg-white {
  background-color: var(--hog-paper) !important;
}

.border-gray-100,
.border-gray-200,
.border-green-100,
.border-green-200,
.border-teal-100,
.border-teal-200,
.border-rose-100,
.border-rose-200,
.border-purple-100,
.border-purple-200,
.ring-green-100,
.ring-green-200,
.ring-teal-100,
.ring-teal-200,
.ring-purple-100,
.ring-purple-200 {
  border-color: var(--hog-border) !important;
  --tw-ring-color: var(--hog-border) !important;
}

/* Navigation */
#main-header {
  height: 64px;
}

#main-header > .relative > .flex,
#main-header + div {
  height: 64px !important;
}

@media (min-width: 1024px) {
  #main-header,
  #main-header > .relative > .flex,
  #main-header + div {
    height: 72px !important;
  }
}

#main-header > .relative > div > a,
#mobile-menu-btn {
  width: 44px;
  min-width: 44px;
  height: 44px;
  min-height: 44px;
}

@media (min-width: 640px) {
  #main-header > .relative > div > a {
    width: auto;
  }
}

#main-header > .absolute {
  border-color: rgba(216, 205, 184, 0.72) !important;
  background: rgba(255, 248, 236, 0.94) !important;
  box-shadow: 0 8px 28px rgba(8, 38, 30, 0.06);
  backdrop-filter: blur(16px);
}

#main-header img {
  border-radius: 6px !important;
  box-shadow: none !important;
}

#main-header a h1 {
  color: var(--hog-green) !important;
  background: none !important;
  -webkit-text-fill-color: currentColor !important;
}

#main-header .nav-link {
  position: relative;
  border-radius: 0 !important;
  color: var(--hog-muted) !important;
  background: transparent !important;
}

#main-header .nav-link::after {
  position: absolute;
  right: 1rem;
  bottom: 0.3rem;
  left: 1rem;
  height: 2px;
  content: "";
  background: var(--hog-orange);
  transform: scaleX(0);
  transform-origin: center;
  width: auto;
  transition: transform 220ms var(--hog-ease);
}

#main-header .nav-link:hover,
#main-header .nav-link:focus-visible {
  color: var(--hog-green) !important;
}

#main-header .nav-link:hover::after,
#main-header .nav-link:focus-visible::after {
  transform: scaleX(1);
}

#main-header .dropdown-menu > div,
#mobile-menu {
  border: 1px solid var(--hog-border) !important;
  border-radius: var(--hog-radius) !important;
  background: var(--hog-paper) !important;
  box-shadow: var(--hog-shadow) !important;
}

/* Programs dropdown: bridge stays transparent; visible panel starts below header. */
#main-header #programs-menu {
  z-index: 20;
  margin-top: 0 !important;
  padding-top: 1.25rem;
  isolation: isolate;
  background: transparent !important;
}

/* #main-header #programs-menu::before {
  top: 0;
  height: 1.25rem;
  background: transparent;
} */

#main-header #programs-menu > div {
  background-color: var(--hog-paper) !important;
  background-image: none !important;
  opacity: 1;
  backdrop-filter: none;
}

#main-header .dropdown-menu a:hover,
#mobile-menu a:hover {
  background: rgba(216, 205, 184, 0.35) !important;
}

/* Shared controls */
a.bg-green-500,
a.bg-green-600,
a.bg-green-700,
a.bg-emerald-500,
a.bg-emerald-600,
a.bg-teal-500,
a.bg-teal-600,
a.bg-rose-500,
a.bg-blue-500,
a.bg-blue-600,
a.bg-cta-500,
button.bg-green-500,
button.bg-green-600,
button.bg-green-700,
button.bg-emerald-500,
button.bg-emerald-600,
button.bg-teal-500,
button.bg-teal-600,
button.bg-rose-500,
button.bg-blue-500,
button.bg-blue-600,
button.bg-cta-500,
.auth-btn,
.sponsor-btn,
.payment-tab.active {
  color: var(--hog-canvas) !important;
  border-color: var(--hog-orange) !important;
  background: var(--hog-orange) !important;
  background-image: none !important;
  box-shadow: 0 12px 28px oklch(0.541 0.213 24.791 / 0.2) !important;
}

a.bg-green-500:hover,
a.bg-green-600:hover,
a.bg-green-700:hover,
a.bg-cta-500:hover,
button.bg-green-500:hover,
button.bg-green-600:hover,
button.bg-green-700:hover,
button.bg-cta-500:hover,
.auth-btn:hover,
.sponsor-btn:hover,
.payment-tab.active:hover {
  color: var(--hog-canvas) !important;
  background: var(--hog-orange-dark) !important;
  transform: translateY(-1px);
}

button:active,
a[role="button"]:active,
a[class*="inline-flex"][class*="bg-"]:active,
a.ed-cta:active,
.site-editorial-hero__action:active {
  transform: scale(0.96) !important;
}

a[class*="transition"],
button[class*="transition"] {
  transition-property: color, background-color, border-color, box-shadow, transform, opacity !important;
}

button,
a[role="button"],
.site-editorial-hero__action,
.program-collage-hero__actions a,
.ed-cta,
.auth-btn,
.sponsor-btn {
  white-space: nowrap;
}

input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
select,
textarea {
  min-height: 44px;
  color: var(--hog-ink) !important;
  border: 1px solid var(--hog-border) !important;
  background: var(--hog-surface) !important;
  box-shadow: none !important;
}

input::placeholder,
textarea::placeholder {
  color: #69746f !important;
  opacity: 1;
}

input:focus,
select:focus,
textarea:focus {
  border-color: var(--hog-orange) !important;
  box-shadow: 0 0 0 3px oklch(0.541 0.213 24.791 / 0.18) !important;
}

/* Full-viewport editorial heroes */
.site-editorial-hero {
  position: relative;
  display: grid;
  min-height: calc(100dvh - 72px);
  margin-inline: calc(50% - 50vw);
  overflow: hidden;
  isolation: isolate;
  background: var(--hog-green);
}

.site-editorial-hero__media {
  position: absolute;
  inset: 0;
  z-index: -2;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: none;
}

html[dir="rtl"] .site-editorial-hero__media {
  transform: scaleX(-1);
}

.site-editorial-hero::after {
  position: absolute;
  inset: 0;
  z-index: -1;
  content: "";
  pointer-events: none;
  background: rgba(8, 38, 30, 0.9);
}

html[dir="rtl"] .site-editorial-hero::after {
  background: rgba(8, 38, 30, 0.9);
}

.site-editorial-hero__inner {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  align-items: center;
  width: min(1400px, calc(100% - 2rem));
  margin: auto;
  padding-block: clamp(4rem, 8vw, 7rem);
}

.site-editorial-hero__copy {
  max-width: 650px;
  color: var(--hog-canvas);
  text-shadow: 0 2px 4px oklch(0.18 0.025 160 / 0.72), 0 12px 32px oklch(0.18 0.025 160 / 0.48);
}

.site-editorial-hero__stamp {
  display: inline-block;
  margin-bottom: 1rem;
  color: var(--hog-red-soft);
  font-size: 0.76rem;
  font-weight: 800;
  text-transform: uppercase;
}

.site-editorial-hero__title {
  max-width: 10ch;
  margin: 0;
  color: var(--hog-canvas) !important;
  font-size: clamp(2.6rem, 5.4vw, 5.6rem) !important;
  font-weight: 800 !important;
  line-height: 1.02 !important;
  text-wrap: balance;
}

.site-editorial-hero__lede {
  max-width: 54ch;
  margin-top: 1.4rem;
  color: rgba(255, 248, 236, 0.86) !important;
  font-size: clamp(1rem, 1.3vw, 1.2rem);
  line-height: 1.72;
}

.site-editorial-hero__action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  margin-top: 1.8rem;
  padding: 0.8rem 1.4rem;
  color: white !important;
  font-weight: 800;
  white-space: nowrap;
  background: var(--hog-orange) !important;
  /* Deliberately flat: the hero action relies on contrast, not glow. */
  transition: transform 220ms var(--hog-ease), background-color 220ms ease;
}

.site-editorial-hero__action:hover {
  background: var(--hog-orange-dark) !important;
  transform: translateY(-2px);
}

.site-editorial-hero__action:active {
  transform: scale(0.96);
}

#hero .site-editorial-hero__inner {
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
}

#hero .site-editorial-hero__media {
  object-position: center;
}

#hero .site-editorial-hero__copy {
  grid-column: 1;
  justify-self: start;
  max-width: 34rem;
  text-align: start;
}

#hero .site-editorial-hero__lede {
  overflow-wrap: break-word;
  text-wrap: pretty;
}

#hero::after {
  background: rgba(8, 38, 30, 0.04);
}

html[dir="rtl"] #hero .site-editorial-hero__inner {
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
}

html[dir="rtl"] #hero .site-editorial-hero__copy {
  grid-column: 1;
  justify-self: start;
  text-align: start;
}

html[dir="rtl"] #hero .site-editorial-hero__title {
  max-width: 11ch;
  font-size: clamp(2.6rem, 4.8vw, 5rem) !important;
  line-height: 1.12 !important;
}

html[dir="rtl"] #hero::after {
  background: rgba(8, 38, 30, 0.04);
}

/* Program hero artwork: centered type over a slowly moving Palestinian palette. */
.program-collage-hero {
  --program-hero-base: #061d17;
  --program-hero-mid: #0b3d2e;
  --program-hero-light: rgba(255, 248, 236, 0.2);
  --program-hero-accent: oklch(0.541 0.213 24.791 / 0.72);
  --program-hero-shadow: rgba(2, 17, 12, 0.82);
  --program-hero-sage: rgba(76, 126, 106, 0.54);
  isolation: isolate;
  min-height: 100dvh !important;
  border-radius: 0 !important;
  background:
    radial-gradient(ellipse at 76% 18%, rgba(255, 248, 236, 0.16) 0%, transparent 32%),
    radial-gradient(ellipse at 14% 88%, oklch(0.541 0.213 24.791 / 0.2) 0%, transparent 38%),
    radial-gradient(ellipse at 54% 58%, var(--program-hero-sage) 0%, transparent 42%),
    linear-gradient(132deg, #03150f 0%, var(--program-hero-base) 24%, var(--program-hero-mid) 51%, #1f6552 73%, #071f18 100%) !important;
  box-shadow: none !important;
}

.program-collage-hero--orphan {
  --program-hero-base: #08231b;
  --program-hero-mid: #124737;
  --program-hero-light: rgba(255, 248, 236, 0.18);
  --program-hero-shadow: rgba(3, 20, 15, 0.84);
  --program-hero-sage: rgba(93, 142, 121, 0.48);
}

.program-collage-hero::before {
  position: absolute;
  inset: -42%;
  z-index: 0;
  content: "";
  pointer-events: none;
  background:
    radial-gradient(circle at 25% 48%, var(--program-hero-accent) 0%, transparent 21%),
    radial-gradient(circle at 72% 31%, var(--program-hero-light) 0%, transparent 22%),
    radial-gradient(circle at 55% 76%, rgba(47, 93, 80, 0.94) 0%, transparent 29%),
    conic-gradient(from 215deg at 52% 48%, transparent 0 18%, rgba(255, 248, 236, 0.1) 28%, transparent 41% 61%, oklch(0.541 0.213 24.791 / 0.17) 72%, transparent 84% 100%);
  filter: blur(64px);
  opacity: 0.9;
  transform: translate3d(-4%, -2%, 0) rotate(-6deg) scale(1.04);
  will-change: transform, opacity;
}

.program-collage-hero::after {
  position: absolute;
  inset: 0;
  z-index: 0;
  content: "";
  pointer-events: none;
  background:
    linear-gradient(112deg, transparent 0 58%, oklch(0.541 0.213 24.791 / 0.11) 65%, transparent 73%),
    linear-gradient(180deg, rgba(3, 18, 13, 0.34) 0%, transparent 25%, transparent 68%, rgba(3, 18, 13, 0.58) 100%),
    radial-gradient(ellipse at center, transparent 25%, var(--program-hero-shadow) 112%);
  box-shadow: inset 0 0 180px rgba(2, 16, 12, 0.46);
}

.program-collage-hero__content {
  z-index: 2 !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  place-items: center;
  width: min(1400px, calc(100% - 2rem)) !important;
  padding: clamp(5rem, 9vw, 8rem) 1rem !important;
}

.program-collage-hero__copy {
  display: flex;
  width: min(100%, 64rem);
  flex-direction: column;
  align-items: center;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--hog-canvas) !important;
  text-align: center;
  backdrop-filter: none !important;
}

.program-collage-hero__badge {
  padding: 0.7rem 0 0 !important;
  color: var(--hog-red-soft) !important;
  border: 0 !important;
  border-top: 2px solid var(--hog-red) !important;
  border-radius: 0 !important;
  background: transparent !important;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.08em !important;
  line-height: 1.2;
  text-transform: uppercase;
  white-space: nowrap;
  backdrop-filter: none !important;
}

.program-collage-hero__title {
  max-width: 14ch;
  margin-top: clamp(1.25rem, 2.5vw, 2rem) !important;
  color: var(--hog-canvas) !important;
  font-size: clamp(3rem, 7vw, 7rem) !important;
  font-weight: 850;
  letter-spacing: -0.045em !important;
  line-height: 0.94 !important;
  text-transform: none !important;
  text-shadow: 0 4px 32px rgba(5, 25, 19, 0.42);
  text-wrap: balance;
}

.program-collage-hero__description {
  max-width: 50ch;
  margin-top: clamp(1.25rem, 2vw, 1.75rem) !important;
  color: rgba(255, 248, 236, 0.88) !important;
  font-size: clamp(1rem, 1.45vw, 1.2rem);
  line-height: 1.6;
  text-shadow: 0 2px 18px rgba(5, 25, 19, 0.48);
  text-wrap: pretty;
}

.program-collage-hero__actions {
  justify-content: center;
}

.program-collage-hero__art-word {
  position: absolute;
  inset: 50% auto auto 50%;
  z-index: 1;
  width: max-content;
  max-width: none;
  margin: 0;
  color: rgba(255, 248, 236, 0.075);
  font-size: clamp(8rem, 22vw, 22rem);
  font-weight: 900;
  letter-spacing: -0.075em !important;
  line-height: 0.78;
  text-align: center;
  text-transform: uppercase;
  text-shadow: none;
  white-space: nowrap;
  transform: translate(-50%, -50%);
  user-select: none;
}

html[dir="rtl"] .program-collage-hero__title {
  max-width: 16ch;
  letter-spacing: 0 !important;
  line-height: 1.08 !important;
}

html[dir="rtl"] .program-collage-hero__art-word {
  letter-spacing: 0 !important;
  line-height: 0.95;
}

.program-collage-hero__side {
  display: none !important;
}

.program-collage-hero__secondary {
  display: none !important;
}

.impact-map-controls {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
  justify-content: center;
  margin-top: 1rem;
}

.impact-map-control {
  min-height: 40px;
  padding: .5rem .75rem;
  color: var(--hog-green);
  border: 1px solid var(--hog-border);
  border-radius: 6px !important;
  background: rgba(255, 248, 236, .88);
  font-size: .72rem;
  font-weight: 800;
  transition: color 180ms ease, background-color 180ms ease, transform 180ms var(--hog-ease);
}

.impact-map-control:hover,
.impact-map-control.is-active {
  color: var(--hog-ink);
  border-color: var(--hog-orange);
  background: var(--hog-orange);
}

.impact-map-control:active {
  transform: translateY(1px);
}

.impact-map-live-status {
  margin-top: .55rem;
  color: var(--hog-muted);
  font-size: .76rem;
  text-align: center;
}

/* Open section rhythm */
/* main > div > section:not(.site-editorial-hero):not(.program-collage-hero) {
  margin-top: clamp(3.5rem, 7vw, 6.5rem);
} */

.mission-card,
.impact-stat-card,
.campaign-card,
.family-card,
.auth-card,
.message-card,
article[class*="shadow"],
aside[class*="shadow"] {
  border: 1px solid var(--hog-border) !important;
  border-radius: var(--hog-radius) !important;
  background-color: var(--hog-paper) !important;
  background-image: none !important;
  box-shadow: none !important;
}

.mission-card:hover,
.impact-stat-card:hover,
.campaign-card:hover,
.family-card:hover {
  border-color: rgba(47, 93, 80, 0.5) !important;
  box-shadow: var(--hog-shadow) !important;
  transform: translateY(-3px) !important;
}

@media (min-width: 768px) {
  #mission .mission-card:first-child {
    grid-column: span 2;
    grid-row: span 2;
  }

  #mission .mission-card:nth-child(2) {
    transform: none !important;
  }
}

.ed-title,
.impact-title {
  color: var(--hog-ink) !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

.ed-eyebrow {
  letter-spacing: 0 !important;
  text-transform: none !important;
}

.ed-eyebrow::before {
  background: var(--hog-orange) !important;
}

.priority-cases-section .inline-flex.items-center.justify-center.mb-6 {
  display: none !important;
}

/* Entity card system shared by families and orphans. */
.hog-entity-card {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--hog-border);
  border-radius: var(--hog-radius);
  background: var(--hog-paper);
  transition: transform 260ms var(--hog-ease), box-shadow 260ms var(--hog-ease), border-color 260ms ease;
}

.hog-entity-card:hover {
  border-color: rgba(47, 93, 80, 0.55);
  box-shadow: var(--hog-shadow);
  transform: translateY(-4px);
}

.hog-entity-card__link {
  display: grid;
  height: 100%;
  color: inherit;
  text-decoration: none;
  grid-template-rows: 13rem 1fr;
}

.hog-entity-card__media {
  position: relative;
  overflow: hidden;
  background: var(--hog-green);
}

.hog-entity-card__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 500ms var(--hog-ease);
}

.hog-entity-card:hover .hog-entity-card__media img {
  transform: scale(1.025);
}

.hog-entity-card__placeholder {
  display: grid;
  width: 100%;
  height: 100%;
  place-items: center;
  color: var(--hog-canvas);
  font-size: clamp(2rem, 5vw, 3.5rem);
  font-weight: 800;
}

.hog-entity-card__body {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  padding: 1.25rem;
}

.hog-entity-card__status-row,
.hog-entity-card__meta,
.hog-entity-card__progress-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem;
}

.hog-entity-card__status {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0.25rem 0.55rem;
  color: var(--hog-green);
  font-size: 0.74rem;
  font-weight: 800;
  border: 1px solid rgba(47, 93, 80, 0.25);
  border-radius: 6px;
  background: rgba(47, 93, 80, 0.08);
}

.hog-entity-card__status--complete {
  color: var(--hog-success);
}

.hog-entity-card__amount {
  color: var(--hog-orange-dark);
  font-size: 0.82rem;
  font-weight: 800;
}

.hog-entity-card__title {
  margin: 0;
  color: var(--hog-ink);
  font-size: 1.35rem;
  font-weight: 800;
  line-height: 1.22;
}

.hog-entity-card__meta,
.hog-entity-card__story,
.hog-entity-card__progress-row {
  color: var(--hog-muted);
  font-size: 0.88rem;
  line-height: 1.55;
}

.hog-entity-card__story {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.hog-entity-card__progress {
  height: 6px;
  overflow: hidden;
  border-radius: 6px;
  background: rgba(47, 93, 80, 0.14);
}

.hog-entity-card__progress span {
  display: block;
  width: var(--entity-progress, 0%);
  max-width: 100%;
  height: 100%;
  border-radius: inherit;
  background: var(--hog-orange);
}

.hog-entity-card__cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 44px;
  margin-top: auto;
  padding-top: 0.75rem;
  color: var(--hog-green);
  font-weight: 800;
  border-top: 1px solid var(--hog-border);
}

/* Functional surfaces */
.auth-card,
main form[class*="space-y"],
main article[class*="p-"],
main aside[class*="p-"] {
  color: var(--hog-ink);
}

body:has(.auth-card) main {
  position: relative;
  margin-inline: calc(50% - 50vw);
  padding-block: clamp(3rem, 7vw, 6rem);
  overflow: hidden;
  background: var(--hog-green);
}

body:has(.auth-card) main::before {
  position: absolute;
  inset: 0;
  content: "";
  background: rgba(8, 38, 30, 0.58);
}

body:has(.auth-card) main > div {
  position: relative;
}

.auth-card {
  max-width: 680px;
  margin-inline: auto;
  border-color: rgba(216, 205, 184, 0.78) !important;
  box-shadow: var(--hog-shadow) !important;
}

.checkout-template {
  position: relative;
  isolation: isolate;
}

.checkout-template::before {
  position: absolute;
  inset: -2rem;
  z-index: -1;
  content: "";
  opacity: 0.08;
  border-radius: var(--hog-radius);
  background: var(--hog-paper);
}

@media (max-width: 67rem) {
  .checkout-template {
    overflow: clip;
  }
}

@media (max-width: 767px) {
  .checkout-template::before {
    inset: 0;
  }
}

.checkout-template > article,
.checkout-template > aside {
  border-color: var(--hog-border) !important;
  background: rgba(251, 247, 239, 0.96) !important;
  box-shadow: var(--hog-shadow) !important;
}

.message-card,
main:has(.message-card) > div > div,
main:has(#compose-form) > div > div {
  border-color: var(--hog-border) !important;
  background-color: var(--hog-paper) !important;
  background-image: none !important;
  box-shadow: none !important;
}

.message-card:hover {
  border-color: rgba(47, 93, 80, 0.55) !important;
  box-shadow: var(--hog-shadow) !important;
}

.auth-card::before,
.auth-card > .absolute,
.impact-stat-card::before,
.mission-card::before {
  display: none !important;
}

.auth-icon,
.impact-stat-card [class*="h-14"][class*="w-14"],
.mission-card [class*="h-16"][class*="w-16"],
.family-profile-template [class*="h-10"][class*="w-10"] {
  color: var(--hog-canvas) !important;
  background: var(--hog-green) !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* Footer */
footer[role="contentinfo"] {
  color: var(--hog-canvas) !important;
  border-top: 1px solid rgba(255, 248, 236, 0.18);
  background: var(--hog-green) !important;
  background-image: none !important;
}

footer[role="contentinfo"] > .absolute {
  opacity: 0.2;
  background: rgba(255, 255, 255, 0.08) !important;
  mix-blend-mode: soft-light;
}

footer[role="contentinfo"] h3,
footer[role="contentinfo"] h4,
footer[role="contentinfo"] p,
footer[role="contentinfo"] a,
footer[role="contentinfo"] span {
  color: inherit !important;
}

footer[role="contentinfo"] li > a > span:first-child {
  display: none;
}

footer[role="contentinfo"] input {
  color: var(--hog-ink) !important;
  background: var(--hog-canvas) !important;
}

footer[role="contentinfo"] a {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
}

button[onclick^="togglePassword"],
button[onclick^="shareCampaign"] {
  min-width: 44px;
  min-height: 44px;
  justify-content: center;
}

a[class*="inline-flex"][class*="bg-"],
.program-collage-hero__actions a {
  min-height: 44px;
}

.auth-card a {
  position: relative;
}

.auth-card a::after {
  position: absolute;
  top: 50%;
  left: 50%;
  width: calc(100% + 16px);
  min-width: 44px;
  height: 44px;
  content: "";
  transform: translate(-50%, -50%);
}

.prog-dot {
  position: relative;
  display: flex;
  width: 44px;
  min-width: 44px;
  height: 44px;
  min-height: 44px;
  align-items: center;
  justify-content: flex-end;
  border-radius: var(--hog-radius) !important;
  background: transparent !important;
  opacity: 0.8;
  transition-property: opacity, transform;
  transition-duration: 180ms;
}

.prog-dot::before {
  width: 24px;
  height: 8px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.55);
  content: "";
  transform: scaleX(0.3333);
  transform-origin: right center;
  transition-property: background-color, transform;
  transition-duration: 180ms;
  transition-timing-function: var(--hog-ease);
}

.prog-dot.is-active {
  opacity: 1;
}

.prog-dot.is-active::before {
  background: var(--hog-orange);
  transform: scaleX(1);
}

.prog-dot.is-active:active::before {
  transform: scaleX(0.96) scaleY(0.96);
}

.prog-dot:not(.is-active):active::before {
  transform: scaleX(0.32) scaleY(0.96);
}

#donate button[hx-get],
.campaign-dot {
  min-width: 44px !important;
  min-height: 44px !important;
}

.campaign-dot {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--hog-radius) !important;
  background: transparent !important;
}

.campaign-dot::before {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: rgba(47, 93, 80, 0.42);
  content: "";
  transform: scaleX(1);
  transition-property: background-color, transform;
  transition-duration: 180ms;
  transform-origin: center;
}

.campaign-dot.active::before {
  background: var(--hog-orange);
  transform: scaleX(2.4);
}

@media (max-width: 767px) {
  body::before {
    opacity: 0.02;
  }

  .site-editorial-hero,
  .program-collage-hero {
    min-height: calc(100dvh - 64px) !important;
  }

  .site-editorial-hero__inner,
  .program-collage-hero__content {
    display: grid !important;
    grid-template-columns: 1fr !important;
    align-content: end;
    width: min(100% - 2rem, 680px) !important;
    padding-block: 3rem !important;
  }

  .site-editorial-hero__title,
  .program-collage-hero__title {
    max-width: 12ch;
    font-size: clamp(2.35rem, 11vw, 4rem) !important;
  }

  .site-editorial-hero__lede,
  .program-collage-hero__description {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
  }

  /* .site-editorial-hero::after,
  .program-collage-hero::after,
  html[dir="rtl"] .site-editorial-hero::after,
  html[dir="rtl"] .program-collage-hero::after {
    background: rgba(8, 38, 30, 0.74) !important;
  } */

  #hero .site-editorial-hero__inner,
  html[dir="rtl"] #hero .site-editorial-hero__inner {
    grid-template-columns: 1fr;
  }

  #hero .site-editorial-hero__copy,
  html[dir="rtl"] #hero .site-editorial-hero__copy {
    grid-column: 1;
    justify-self: start;
    width: min(78%, 30rem);
    max-width: none;
    text-align: start;
  }

  #hero .site-editorial-hero__media {
    object-position: 35% center;
  }

  html[dir="rtl"] #hero .site-editorial-hero__media {
    object-position: 65% center;
  }

  #hero::after {
    background: linear-gradient(90deg, rgba(8, 38, 30, 0.92) 0%, rgba(8, 38, 30, 0.76) 48%, rgba(8, 38, 30, 0.16) 82%);
  }

  html[dir="rtl"] #hero::after {
    background: linear-gradient(270deg, rgba(8, 38, 30, 0.92) 0%, rgba(8, 38, 30, 0.76) 48%, rgba(8, 38, 30, 0.16) 82%);
  }

  .hog-entity-card__link {
    grid-template-rows: 12rem 1fr;
  }

  .orphan-list-page .age-chip,
  .orphan-list-page #orphans-grid-container nav a {
    min-width: 44px;
    min-height: 44px;
  }
}

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

/* Homepage programs: the same text-led editorial ledger used by Home impact. */
.home-programs {
  width: min(var(--hog-content-max), 100%);
  margin: var(--hog-section-space) auto 0;
  scroll-margin-top: 6rem;
}

.home-programs__header {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: clamp(1rem, 2vw, 1.5rem);
  align-items: start;
  margin-bottom: clamp(2.5rem, 6vw, 5rem);
}

.home-programs__header-meta {
  grid-column: 1 / span 3;
  padding-top: 0.65rem;
  border-top: 2px solid var(--hog-red);
  color: var(--hog-red);
  font-size: 0.78rem;
  line-height: 1.4;
}

.home-programs__header-meta p {
  margin: 0;
}

.home-programs__eyebrow {
  color: var(--hog-red);
  font-weight: 800;
}

.home-programs__header-copy {
  grid-column: 5 / -1;
  max-width: 52rem;
}

.home-programs__header h2 {
  max-width: 14ch;
  margin: 0;
  color: var(--hog-ink);
  font-size: clamp(2.35rem, 5vw, 4.75rem);
  font-weight: 800;
  line-height: 1.02;
  letter-spacing: 0;
  text-wrap: balance;
}

.home-programs__header-copy > p {
  max-width: 58ch;
  margin: 1.25rem 0 0;
  color: var(--hog-muted);
  font-size: clamp(1rem, 1.4vw, 1.15rem);
  line-height: 1.72;
  text-wrap: pretty;
}

.home-programs__routes {
  background: var(--hog-green);
}

.home-programs__item {
  position: relative;
  display: grid;
  min-height: clamp(38rem, 55vw, 49rem);
  padding: clamp(7.5rem, 12vw, 11rem) clamp(1rem, 5vw, 5rem) clamp(2rem, 5vw, 4rem);
  overflow: hidden;
  border-bottom: 1px solid oklch(0.96 0.018 85 / 0.12);
}

.home-programs__word {
  position: absolute;
  inset-block-start: clamp(1rem, 2vw, 2rem);
  inset-inline: 0;
  width: 100%;
  margin: 0;
  color: oklch(0.96 0.018 85 / 0.1);
  font-size: clamp(6.5rem, 18vw, 17rem);
  font-weight: 900;
  letter-spacing: -0.08em;
  line-height: 0.72;
  text-align: center;
  text-transform: uppercase;
  white-space: nowrap;
  user-select: none;
}

.home-programs__panel {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
  width: min(100%, 76rem);
  min-height: clamp(27rem, 39vw, 35rem);
  margin-inline: auto;
  padding: clamp(2rem, 4.5vw, 4rem);
  border-top: 6px solid var(--hog-red);
  background: var(--hog-paper);
  box-shadow: 0 28px 70px oklch(0.12 0.03 160 / 0.28);
  transition: transform 220ms var(--hog-ease), box-shadow 220ms ease;
}

.home-programs__item:hover .home-programs__panel {
  transform: translateY(-3px);
  box-shadow: 0 34px 82px oklch(0.12 0.03 160 / 0.34);
}

.home-programs__content {
  grid-column: 1 / span 6;
  min-width: 0;
}

.home-programs__evidence {
  grid-column: 8 / -1;
  min-width: 0;
  padding-inline-start: clamp(1.5rem, 3vw, 3rem);
  border-inline-start: 1px solid var(--hog-border);
}

.home-programs__meta {
  margin-bottom: clamp(1.5rem, 3vw, 2.5rem);
  padding-inline-start: 0.85rem;
  border-inline-start: 3px solid var(--hog-red);
  color: var(--hog-red-dark);
  font-size: 0.82rem;
  font-weight: 800;
  line-height: 1.35;
}

.home-programs__meta p,
.home-programs__program-name {
  margin: 0;
}

.home-programs__program-name {
  margin-bottom: 0.7rem;
  color: var(--hog-green-mid);
  font-size: 0.9rem;
  font-weight: 700;
  line-height: 1.4;
}

.home-programs__item h3 {
  max-width: 14ch;
  margin: 0;
  color: var(--hog-ink);
  font-size: clamp(2.25rem, 4.4vw, 4.25rem);
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.045em;
  text-wrap: balance;
}

.home-programs__summary {
  max-width: 46ch;
  margin: 1.25rem 0 0;
  color: var(--hog-muted);
  font-size: 1rem;
  line-height: 1.7;
  text-wrap: pretty;
}

.home-programs__impact {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(1rem, 2vw, 1.5rem);
  margin: 0 0 clamp(2rem, 4vw, 3rem);
}

.home-programs__impact > div {
  padding-block-start: 1rem;
  border-block-start: 1px solid var(--hog-border);
}

.home-programs__impact dt,
.home-programs__impact dd {
  margin: 0;
}

.home-programs__impact dt {
  color: var(--hog-muted);
  font-size: 0.72rem;
  font-weight: 700;
  line-height: 1.35;
}

.home-programs__impact dd {
  margin-top: 0.5rem;
  overflow-wrap: anywhere;
  color: var(--hog-ink);
  font-size: clamp(1.75rem, 3.25vw, 3.25rem);
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.045em;
  line-height: 0.95;
}

.home-programs__impact dd span {
  color: var(--hog-muted);
  font-size: 0.58em;
  font-weight: 700;
}

.home-programs__action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 1.5rem;
  min-width: min(100%, 15rem);
  min-height: 48px;
  padding: 0.8rem 1.25rem;
  color: var(--hog-canvas) !important;
  background: var(--hog-red);
  font-size: 0.9rem;
  font-weight: 800;
  line-height: 1.2;
  text-decoration: none;
  transition: background-color 220ms ease, transform 220ms var(--hog-ease);
}

.home-programs__action svg {
  width: 1.15rem;
  height: 1.15rem;
  flex: 0 0 auto;
  transition: transform 220ms var(--hog-ease);
}

.home-programs__action:hover,
.home-programs__action:focus-visible {
  color: var(--hog-canvas) !important;
  background: var(--hog-red-dark);
  transform: translateY(-2px);
}

.home-programs__action:hover svg,
.home-programs__action:focus-visible svg {
  transform: translateX(3px);
}

html[dir="rtl"] .home-programs__action:hover svg,
html[dir="rtl"] .home-programs__action:focus-visible svg {
  transform: translateX(-3px);
}

.home-programs__action:active {
  transform: scale(0.96);
}

html[dir="rtl"] .home-programs__header h2,
html[dir="rtl"] .home-programs__item h3 {
  line-height: 1.2;
  letter-spacing: 0;
}

@media (max-width: 980px) {
  .home-programs__header-meta {
    grid-column: 1 / span 4;
  }

  .home-programs__header-copy {
    grid-column: 5 / -1;
  }

  .home-programs__item {
    min-height: 0;
    padding: clamp(7rem, 18vw, 10rem) clamp(1rem, 4vw, 2rem) 2rem;
  }

  .home-programs__panel {
    grid-template-columns: minmax(0, 1fr);
    min-height: 0;
  }

  .home-programs__content,
  .home-programs__evidence {
    grid-column: 1;
  }

  .home-programs__evidence {
    padding-block-start: 2rem;
    padding-inline-start: 0;
    border-block-start: 1px solid var(--hog-border);
    border-inline-start: 0;
  }
}

@media (max-width: 767px) {
  .home-programs {
    width: 100%;
    margin-top: var(--hog-section-space);
  }

  .home-programs__header {
    grid-template-columns: minmax(0, 1fr);
    gap: 1.5rem;
    margin-bottom: 2.5rem;
  }

  .home-programs__header-meta,
  .home-programs__header-copy {
    grid-column: 1;
  }

  .home-programs__header-meta {
    max-width: 15rem;
  }

  .home-programs__header h2 {
    font-size: clamp(2.15rem, 10vw, 3rem);
  }

  .home-programs__item {
    padding: 5.5rem 1rem 1rem;
  }

  .home-programs__word {
    font-size: clamp(5.25rem, 28vw, 9rem);
    line-height: 0.76;
  }

  .home-programs__panel {
    gap: 2rem;
    padding: 2.25rem 1.25rem;
  }

  .home-programs__item h3 {
    font-size: clamp(2.15rem, 10vw, 3.25rem);
  }

  .home-programs__impact {
    gap: 0.75rem;
  }

  .home-programs__action {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .home-programs__panel,
  .home-programs__action,
  .home-programs__action svg {
    transition: none;
  }

  .home-programs__item:hover .home-programs__panel,
  .home-programs__action:hover,
  .home-programs__action:focus-visible {
    transform: none;
  }
}

.hog-action-dock {
  position: fixed;
  inset: auto 50% 1rem auto;
  z-index: 48;
  display: flex;
  gap: 0.35rem;
  padding: 0.35rem;
  border: 1px solid oklch(1 0 0 / 0.18);
  border-radius: calc(var(--hog-radius) + 6px) !important;
  background: oklch(0.18 0.025 160 / 0.94);
  box-shadow: 0 16px 42px oklch(0.18 0.025 160 / 0.28);
  backdrop-filter: blur(16px);
  transform: translateX(50%);
}

.hog-action-dock a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0.7rem 1rem;
  color: var(--hog-canvas) !important;
  border-radius: var(--hog-radius) !important;
  font-size: 0.84rem;
  font-weight: 800;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
  transition: transform 180ms var(--hog-ease), background-color 180ms ease;
}

.hog-action-dock__primary {
  background: var(--hog-red);
}

.hog-action-dock__primary:hover,
.hog-action-dock__primary:focus-visible {
  background: var(--hog-red-dark);
}

.hog-action-dock__secondary {
  background: oklch(1 0 0 / 0.1);
}

.hog-action-dock__secondary:hover,
.hog-action-dock__secondary:focus-visible {
  background: oklch(1 0 0 / 0.18);
}

.hog-action-dock a:active {
  transform: scale(0.96);
}

@media (max-width: 767px) {
  .hog-action-dock {
    inset: auto 0.75rem 3.75rem;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    transform: none;
  }

  .hog-action-dock a {
    padding-inline: 0.65rem;
    font-size: 0.78rem;
  }

  footer {
    padding-bottom: 5rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hog-action-dock a {
    transition: none;
  }
}

@keyframes program-hero-gradient-drift {
  0% {
    opacity: 0.76;
    transform: translate3d(-4%, -2%, 0) rotate(-6deg) scale(1.04);
  }

  52% {
    opacity: 0.92;
    transform: translate3d(3%, 4%, 0) rotate(4deg) scale(1.11);
  }

  100% {
    opacity: 0.8;
    transform: translate3d(6%, -3%, 0) rotate(8deg) scale(1.06);
  }
}

@media (prefers-reduced-motion: no-preference) {
  .program-collage-hero::before {
    animation: program-hero-gradient-drift 20s cubic-bezier(0.45, 0, 0.2, 1) infinite alternate;
  }
}

@media (max-width: 767px) {
  .program-collage-hero .program-collage-hero__content {
    place-items: center;
    align-content: center;
    width: min(100% - 2rem, 680px) !important;
    padding: 5rem 0 3.5rem !important;
  }

  .program-collage-hero__copy {
    width: 100%;
  }

  .program-collage-hero__title {
    max-width: 14ch;
    font-size: clamp(2.7rem, 12vw, 4.8rem) !important;
  }

  .program-collage-hero__description {
    max-width: 34rem;
    font-size: 1rem;
    -webkit-line-clamp: 4;
  }

  .program-collage-hero__art-word {
    font-size: clamp(5.5rem, 25vw, 9rem);
  }
}

@media (prefers-reduced-motion: reduce) {
  .program-collage-hero::before {
    animation: none;
    opacity: 0.82;
    transform: none;
    will-change: auto;
  }
}

/* AUN family program hero: oversized poster type with one tactile media crop. */
.aun-hero {
  position: relative;
  display: grid;
  min-height: calc(100dvh - 72px);
  margin-inline: calc(50% - 50vw);
  padding: clamp(1rem, 2.6vw, 2.5rem);
  overflow: hidden;
  isolation: isolate;
  color: var(--hog-ink);
  border-bottom: 1px solid var(--hog-border);
  background:
    linear-gradient(118deg, rgba(11, 61, 46, 0.035), transparent 34%),
    var(--hog-canvas);
  grid-template-rows: auto minmax(0, 1fr) auto;
}

.aun-hero--food,
.aun-hero--orphan {
  grid-template-rows: minmax(0, 1fr) auto;
}

.aun-hero::before {
  position: absolute;
  inset: 0;
  z-index: -1;
  content: "";
  pointer-events: none;
  background-image: repeating-radial-gradient(circle at 0 0, rgba(8, 38, 30, 0.16) 0 0.7px, transparent 0.8px 4px);
  opacity: 0.1;
  mix-blend-mode: multiply;
}

.aun-hero__masthead {
  display: flex;
  width: min(28rem, 100%);
  min-height: 64px;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  margin-inline: auto;
  padding: 0.8rem 1rem;
  color: var(--hog-canvas);
  border-radius: var(--hog-radius);
  background: var(--hog-ink);
}

.aun-hero__masthead p,
.aun-hero__masthead span {
  margin: 0;
  line-height: 1.2;
  white-space: nowrap;
}

.aun-hero__masthead p {
  overflow: hidden;
  font-size: 1rem;
  font-weight: 850;
  text-overflow: ellipsis;
}

.aun-hero__masthead span {
  flex: 0 0 auto;
  padding: 0.65rem 0.8rem;
  color: var(--hog-ink);
  border-radius: calc(var(--hog-radius) - 2px);
  background: var(--hog-canvas);
  font-size: 0.72rem;
  font-weight: 800;
}

.aun-hero__stage {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
  width: min(100%, 94rem);
  min-height: clamp(22rem, 62vh, 46rem);
  margin-inline: auto;
  place-items: center;
  padding-block: clamp(3rem, 7vh, 6rem);
}

.aun-hero__title {
  position: relative;
  z-index: 4;
  grid-column: 1;
  width: min(100%, 78rem);
  min-width: 0;
  margin-inline: auto;
  padding-inline: clamp(0rem, 4vw, 4rem);
  color: var(--hog-ink) !important;
  font-weight: 800 !important;
  font-synthesis: none;
  letter-spacing: 0 !important;
  text-align: start;
  text-transform: none;
  text-wrap: balance;
}

.aun-hero__title-line {
  display: block;
  overflow-wrap: break-word;
  white-space: normal;
}

.aun-hero__title-line--name {
  max-width: 11ch;
  color: var(--hog-ink);
  font-size: clamp(4.75rem, 12vw, 11.5rem);
  font-weight: 850;
  line-height: 0.85;
  letter-spacing: -0.065em;
  text-transform: uppercase;
  text-wrap: balance;
}

.aun-hero__title-line--program {
  max-width: 20ch;
  margin-block-start: clamp(1.5rem, 3vw, 2.5rem);
  margin-inline-start: clamp(1rem, 8vw, 8rem);
  padding-block-start: clamp(0.9rem, 1.5vw, 1.25rem);
  border-block-start: clamp(3px, 0.35vw, 5px) solid var(--hog-red);
  color: var(--hog-green-mid);
  font-size: clamp(1.95rem, 3.8vw, 4.1rem);
  font-weight: 700;
  line-height: 1.12;
  letter-spacing: -0.035em;
  text-align: start;
  text-transform: none;
  text-wrap: balance;
}

.aun-hero__spark {
  position: absolute;
  z-index: 3;
  display: block;
  width: clamp(2.8rem, 4vw, 4.6rem);
  aspect-ratio: 1;
  background: var(--hog-ink);
  clip-path: polygon(50% 0, 62% 36%, 100% 50%, 62% 64%, 50% 100%, 38% 64%, 0 50%, 38% 36%);
}

.aun-hero__spark--start {
  inset: 24% auto auto 8%;
  box-shadow: 5px 5px 0 var(--hog-red);
  transform: rotate(10deg);
}

.aun-hero__spark--end {
  inset: auto 8% 17% auto;
  background: var(--hog-red);
  transform: rotate(-13deg) scale(0.82);
}

.aun-hero__identity-icon {
  position: absolute;
  z-index: 3;
  display: block;
  height: auto;
  pointer-events: none;
  filter: drop-shadow(0 14px 12px rgba(8, 38, 30, 0.18));
  user-select: none;
  will-change: transform;
}

.aun-hero__identity-icon--bread {
  inset-block-start: 8%;
  inset-inline-start: 5%;
  width: clamp(4.75rem, 7vw, 7.5rem);
  transform: rotate(-11deg);
}

.aun-hero__identity-icon--parcel {
  inset-block-start: 8%;
  inset-inline-end: 4%;
  width: clamp(5.75rem, 8.5vw, 9.5rem);
  transform: rotate(8deg);
}

.aun-hero__identity-icon--olive {
  inset-inline-end: 10%;
  inset-block-end: 10%;
  width: clamp(4.25rem, 6.5vw, 7rem);
  transform: rotate(-8deg);
}

.aun-hero--orphan .aun-hero__title-line--name {
  max-width: 12ch;
  font-size: clamp(3.75rem, 7.5vw, 7.6rem);
}

.aun-hero--orphan .aun-hero__title-line--program {
  max-width: 22ch;
  font-size: clamp(1.85rem, 3.6vw, 3.8rem);
}

.aun-hero__identity-icon--education {
  inset-block-start: 8%;
  inset-inline-start: 5%;
  width: clamp(4.75rem, 7vw, 7.5rem);
  transform: rotate(-9deg);
}

.aun-hero__identity-icon--shelter {
  inset-block-start: 8%;
  inset-inline-end: 4%;
  width: clamp(5.5rem, 8vw, 9rem);
  transform: rotate(7deg);
}

.aun-hero__identity-icon--care {
  inset-inline-end: 10%;
  inset-block-end: 8%;
  width: clamp(4.5rem, 6.8vw, 7.25rem);
  transform: rotate(-7deg);
}

.aun-hero__footer {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 2rem;
  padding-top: 1rem;
}

.aun-hero__footer p {
  max-width: 50ch;
  margin: 0;
  color: var(--hog-muted);
  font-size: clamp(0.9rem, 1.15vw, 1.05rem);
  line-height: 1.55;
  text-align: start;
  text-wrap: pretty;
}

.aun-hero__footer a {
  display: inline-flex;
  min-height: 48px;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  padding: 0.85rem 1.35rem;
  color: var(--hog-canvas) !important;
  border-radius: var(--hog-radius) !important;
  background: var(--hog-red);
  font-size: 0.9rem;
  font-weight: 850;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
  transition: transform 180ms var(--hog-ease), background-color 180ms ease;
}

.aun-hero__footer a:hover,
.aun-hero__footer a:focus-visible {
  background: var(--hog-red-dark);
  transform: translateY(-2px);
}

.aun-hero__footer a:active {
  transform: scale(0.97);
}

html[dir="rtl"] .aun-hero__title {
  letter-spacing: 0 !important;
}

html[dir="rtl"] .aun-hero__title-line--name {
  line-height: 1;
  letter-spacing: 0;
}

html[dir="rtl"] .aun-hero__title-line--program {
  font-size: clamp(2rem, 4vw, 4.1rem);
  line-height: 1.25;
  letter-spacing: 0;
}

@keyframes food-aid-icon-bread-float {
  from { transform: translate3d(0, 0, 0) rotate(-11deg); }
  to { transform: translate3d(0, -10px, 0) rotate(-6deg); }
}

@keyframes food-aid-icon-parcel-float {
  from { transform: translate3d(0, 0, 0) rotate(8deg); }
  to { transform: translate3d(-4px, -13px, 0) rotate(3deg); }
}

@keyframes food-aid-icon-olive-float {
  from { transform: translate3d(0, 0, 0) rotate(-8deg); }
  to { transform: translate3d(5px, -8px, 0) rotate(-2deg); }
}

@keyframes orphan-icon-education-float {
  from { transform: translate3d(0, 0, 0) rotate(-9deg); }
  to { transform: translate3d(3px, -10px, 0) rotate(-4deg); }
}

@keyframes orphan-icon-shelter-float {
  from { transform: translate3d(0, 0, 0) rotate(7deg); }
  to { transform: translate3d(-4px, -12px, 0) rotate(2deg); }
}

@keyframes orphan-icon-care-float {
  from { transform: translate3d(0, 0, 0) rotate(-7deg); }
  to { transform: translate3d(5px, -9px, 0) rotate(-1deg); }
}

@media (prefers-reduced-motion: no-preference) {
  .aun-hero__identity-icon--bread {
    animation: food-aid-icon-bread-float 5.8s ease-in-out infinite alternate;
  }

  .aun-hero__identity-icon--parcel {
    animation: food-aid-icon-parcel-float 7.2s ease-in-out infinite alternate;
  }

  .aun-hero__identity-icon--olive {
    animation: food-aid-icon-olive-float 6.4s ease-in-out -1.6s infinite alternate;
  }

  .aun-hero__identity-icon--education {
    animation: orphan-icon-education-float 6.1s ease-in-out infinite alternate;
  }

  .aun-hero__identity-icon--shelter {
    animation: orphan-icon-shelter-float 7.4s ease-in-out -1.2s infinite alternate;
  }

  .aun-hero__identity-icon--care {
    animation: orphan-icon-care-float 6.7s ease-in-out -2s infinite alternate;
  }
}

@media (max-width: 767px) {
  .aun-hero {
    width: 100vw;
    max-width: 100vw;
    min-height: 0;
    padding: clamp(0.875rem, 4vw, 1.125rem);
    row-gap: clamp(0.75rem, 2.5vh, 1.25rem);
  }

  .aun-hero__masthead {
    min-height: 56px;
  }

  .aun-hero__masthead span {
    padding: 0.55rem 0.65rem;
    font-size: 0.65rem;
  }

  .aun-hero__stage {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto;
    width: 100%;
    min-width: 0;
    min-height: clamp(19rem, 54svh, 28rem);
    padding-block: clamp(3.75rem, 9vh, 5rem);
    overflow: hidden;
  }

  .aun-hero__title {
    grid-column: 1;
    grid-row: 1;
    width: min(100%, 34rem);
    min-width: 0;
    max-width: 100%;
    padding-inline: 0.25rem;
  }

  .aun-hero__title-line {
    max-width: 100%;
  }

  .aun-hero__title-line--name {
    max-width: 11ch;
    font-size: clamp(4rem, 22vw, 6.5rem);
    line-height: 0.9;
    letter-spacing: -0.055em;
  }

  .aun-hero__title-line--program {
    max-width: 21ch;
    margin-block-start: 1.1rem;
    margin-inline-start: clamp(0.75rem, 7vw, 1.5rem);
    padding-block-start: 0.75rem;
    border-block-start-width: 3px;
    font-size: clamp(1.3rem, 6.2vw, 1.85rem);
    line-height: 1.2;
  }

  .aun-hero__spark--start {
    inset: 18% auto auto 2%;
  }

  .aun-hero__spark--end {
    inset: auto 2% 18% auto;
  }

  .aun-hero__identity-icon--bread {
    inset-block-start: 2.5%;
    inset-inline-start: 0;
    width: clamp(3.25rem, 15vw, 4.25rem);
  }

  .aun-hero__identity-icon--parcel {
    inset-block-start: 2.5%;
    inset-inline-end: 0;
    width: clamp(3.75rem, 17vw, 4.875rem);
  }

  .aun-hero__identity-icon--olive {
    inset-inline-end: 0.25rem;
    inset-block-end: 2.5%;
    width: clamp(2.75rem, 12vw, 3.5rem);
  }

  .aun-hero--orphan .aun-hero__title-line--name {
    max-width: 12ch;
    font-size: clamp(2.35rem, 11vw, 3.5rem);
  }

  .aun-hero--orphan .aun-hero__title-line--program {
    font-size: clamp(1.25rem, 5.8vw, 1.7rem);
  }

  .aun-hero__identity-icon--education {
    inset-block-start: 2.5%;
    inset-inline-start: 0;
    width: clamp(3.25rem, 15vw, 4.25rem);
  }

  .aun-hero__identity-icon--shelter {
    inset-block-start: 2.5%;
    inset-inline-end: 0;
    width: clamp(3.75rem, 17vw, 4.875rem);
  }

  .aun-hero__identity-icon--care {
    inset-inline-end: 0.25rem;
    inset-block-end: 2.5%;
    width: clamp(2.875rem, 12.5vw, 3.625rem);
  }

  .aun-hero__footer {
    width: 100%;
    min-width: 0;
    align-items: stretch;
    flex-direction: column;
    gap: 0.875rem;
    padding-top: 0;
    padding-inline: 0.25rem;
  }

  .aun-hero__footer p {
    display: block;
    width: 100%;
    max-width: none;
    overflow-wrap: anywhere;
  }

  .aun-hero__footer a {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }

  html[dir="rtl"] .aun-hero__title-line--name {
    font-size: clamp(3.25rem, 16vw, 4.75rem);
    line-height: 1;
  }

  html[dir="rtl"] .aun-hero__title-line--program {
    font-size: clamp(1.2rem, 5.8vw, 1.7rem);
    line-height: 1.28;
  }

  html[dir="rtl"] .aun-hero--orphan .aun-hero__title-line--name {
    font-size: clamp(2.35rem, 11vw, 3.35rem);
  }
}

@media (prefers-reduced-motion: reduce) {
  .aun-hero__identity-icon {
    animation: none;
    will-change: auto;
  }
}