/* UmmahCauses redesign r2505 (card 7kbvYXoH): Alisha's "Sunshine and Peace" prototype.
   Homepage, Browse Charities and the shared redesign header. Plain CSS, no build step.
   Values come from UmmahCauses+Style+Guide.md. Font: Plus Jakarta Sans (Bunny Fonts, loaded
   by the layout). No pills, no uppercase labels, no text arrows. */

.ucr-body { font-family: 'Plus Jakarta Sans', system-ui, sans-serif; font-weight: 500; color: #17231e; -webkit-font-smoothing: antialiased; }
.ucr-page, .ucr-page * { box-sizing: border-box; }
.ucr-page { font-family: 'Plus Jakarta Sans', system-ui, sans-serif; font-weight: 500; color: #17231e; background: #fff; }
.ucr-page a { color: #14855f; text-decoration: none; }
.ucr-page a:hover { color: #0f6e4f; }
.ucr-page input, .ucr-page button, .ucr-page select { font-family: inherit; font-weight: 500; }
.ucr-page h1, .ucr-page h2, .ucr-page h3 { font-family: 'Plus Jakarta Sans', system-ui, sans-serif; text-wrap: balance; margin: 0; }
.ucr-page p { margin: 0; }
.ucr-wrap { max-width: 1200px; margin: 0 auto; padding: 0 32px; }
.ucr-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- Header ---------- */
.ucr-header { position: sticky; top: 0; z-index: 50; background: rgba(255,255,255,.9); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); border-bottom: 1px solid #eeebe3; font-family: 'Plus Jakarta Sans', system-ui, sans-serif; }
.ucr-header-in { max-width: 1200px; margin: 0 auto; padding: 0 32px; height: 72px; display: flex; align-items: center; justify-content: space-between; gap: 24px; position: relative; }
.ucr-logo { font-size: 23px; font-weight: 700; letter-spacing: -.02em; display: inline-flex; align-items: baseline; min-height: 44px; align-items: center; text-decoration: none; }
.ucr-logo span:first-of-type { color: #14855f; }
.ucr-logo-mark { width: 32px; height: 32px; margin-right: 8px; flex: none; display: block; }
/* Phones (Nov 4 2026, measured): the mark must not push the menu button past the edge. 360 px had about 7 px
   spare without it, so phones trade a little padding, gap and wordmark size for the mark. At 340 px and under the
   mark hides and Donate narrows, which also ends the 320 px overflow the header had before the mark. */
@media (max-width: 400px) { .ucr-header-in { padding: 0 12px !important; gap: 12px; } .ucr-header-right { gap: 6px; }
  .ucr-logo { font-size: 21px; } .ucr-logo-mark { width: 24px; height: 24px; margin-right: 5px; } }
@media (max-width: 340px) { .ucr-logo-mark { display: none; } a.ucr-donate { padding: 0 12px !important; } }
.ucr-logo span:last-child { color: #b8892e; }
.ucr-nav { display: none; gap: 8px; white-space: nowrap; position: absolute; left: 50%; transform: translateX(-50%); }
.ucr-nav a { font-size: 15px; color: #3d4a44; padding: 0 12px; min-height: 44px; display: inline-flex; align-items: center; text-decoration: none; }
.ucr-nav a:hover, .ucr-nav a.is-active { color: #14855f; }
.ucr-nav a.is-active { font-weight: 700; }
.ucr-header-right { display: flex; align-items: center; gap: 12px; white-space: nowrap; }
.ucr-login { font-size: 15px; color: #3d4a44; min-height: 44px; display: none; align-items: center; padding: 0 8px; text-decoration: none; }
.ucr-login:hover { color: #14855f; }
a.ucr-donate, .ucr-donate { font-size: 18px; font-weight: 700; color: #fff !important; background: #14855f; padding: 0 26px; min-height: 48px; display: inline-flex; align-items: center; border-radius: 12px; text-decoration: none; }
a.ucr-donate:hover { background: #0f6e4f; }
.ucr-burger { width: 44px; height: 44px; display: inline-flex; align-items: center; justify-content: center; background: transparent; border: 0; border-radius: 10px; color: #3d4a44; cursor: pointer; }
.ucr-burger .ucr-ico-close { display: none; }
.ucr-burger[aria-expanded="true"] .ucr-ico-open { display: none; }
.ucr-burger[aria-expanded="true"] .ucr-ico-close { display: block; }
.ucr-mobile { border-top: 1px solid #eeebe3; background: #fff; padding: 8px 24px 16px; }
.ucr-mobile[hidden] { display: none; }
.ucr-mobile a { display: flex; align-items: center; min-height: 48px; font-size: 17px; font-weight: 600; color: #17231e; text-decoration: none; border-bottom: 1px solid #f4f0e6; }
@media (min-width: 1000px) { .ucr-nav { display: flex; } .ucr-burger, .ucr-mobile { display: none !important; } .ucr-login { display: inline-flex; } }
@media (max-width: 520px) { .ucr-header-in { padding: 0 16px; } a.ucr-donate { padding: 0 18px; font-size: 16px; } }

/* ---------- Buttons ---------- */
.ucr-btn { display: inline-flex; align-items: center; justify-content: center; text-align: center; font-weight: 700; border-radius: 13px; cursor: pointer; border: 0; text-decoration: none; transition: background .2s ease, transform .2s ease; }
.ucr-page a.ucr-btn-lg, .ucr-btn-lg { font-size: 21px; padding: 22px 44px; border-radius: 14px; min-height: 44px; color: #fff; background: #14855f; box-shadow: 0 10px 28px rgba(20,133,95,.25); }
.ucr-page a.ucr-btn-md, .ucr-btn-md { font-size: 19px; padding: 17px 30px; color: #fff; background: #14855f; box-shadow: 0 6px 16px rgba(20,133,95,.2); min-height: 44px; }
.ucr-page a.ucr-btn-lg:hover, .ucr-page a.ucr-btn-md:hover, .ucr-page button.ucr-btn-md:hover { background: #0f6e4f; color: #fff; }
.ucr-page a.ucr-btn-2nd { color: #14855f; background: rgba(255,255,255,.75); border: 1px solid rgba(20,133,95,.2); box-shadow: none; }
.ucr-page a.ucr-btn-2nd:hover { background: #fff; color: #0f6e4f; }
.ucr-link { font-size: 15px; font-weight: 600; display: inline-flex; align-items: center; gap: 6px; min-height: 44px; }

/* ---------- Hero ---------- */
.ucr-hero { position: relative; overflow: hidden; background: #fdf6df; }
.ucr-hero-bg { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.ucr-hero-bg img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 60%; }
.ucr-hero-veil { position: absolute; inset: 0; background: radial-gradient(ellipse 50% 55% at 50% 45%, rgba(255,253,246,.7) 0%, rgba(255,253,246,.35) 60%, rgba(255,253,246,0) 100%); }
.ucr-hero-fade { position: absolute; left: 0; right: 0; bottom: 0; height: 90px; background: linear-gradient(to bottom, rgba(255,255,255,0), #fff); }
.ucr-hero-in { position: relative; max-width: 920px; margin: 0 auto; padding: 128px 32px 120px; text-align: center; display: flex; flex-direction: column; align-items: center; }
.ucr-h1 { font-weight: 700; font-size: clamp(46px, 6.4vw, 84px); line-height: 1.02; letter-spacing: -.035em; color: #14855f; }
.ucr-h1 em { font-style: normal; color: #b07f1c; } /* large text, 3:1 floor */
.ucr-lead { margin-top: 28px !important; max-width: 580px; font-size: 21px; line-height: 1.6; color: #3a4640; text-wrap: pretty; }
.ucr-lead strong, .ucr-strong { color: #17231e; font-weight: 700; }
.ucr-hero-btns { display: flex; gap: 12px; margin-top: 40px; flex-wrap: wrap; justify-content: center; }
.ucr-trust { margin-top: 48px; max-width: 860px; display: flex; flex-wrap: wrap; justify-content: center; gap: 14px 32px; font-size: 17px; color: #3a4640; }
.ucr-trust > div { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: baseline; gap: 8px; text-align: left; max-width: 100%; }
.ucr-trust b { font-weight: 800; color: #14855f; }
.ucr-trust b.gold { color: #8a6516; }
.ucr-hero-note { margin-top: 28px !important; font-size: 17px; color: #3a4640; text-wrap: balance; }
.ucr-hero-note strong { color: #14855f; font-weight: 700; }

/* ---------- Section heads ---------- */
.ucr-h2 { font-weight: 700; font-size: clamp(34px, 4vw, 46px); letter-spacing: -.03em; line-height: 1.08; color: #14855f; }
.ucr-sec-lead { margin-top: 14px !important; font-size: 19px; line-height: 1.6; color: #46524c; }

/* ---------- Causes ---------- */
.ucr-causes { scroll-margin-top: 80px; }
.ucr-causes-in { max-width: 1200px; margin: 0 auto; padding: 104px 32px 96px; }
.ucr-causes-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; flex-wrap: wrap; margin-bottom: 40px; }
.ucr-causes-head > div { max-width: 560px; }
.ucr-picker { background: #fff8e4; border-radius: 20px; padding: 24px 28px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 32px; margin-bottom: 20px; }
.ucr-picker-t { font-size: 24px; font-weight: 800; letter-spacing: -.02em; color: #17231e; }
.ucr-picker-s { font-size: 17px; color: #3a4640; margin-top: 4px; }
.ucr-picker-r { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.ucr-picked { font-size: 24px; font-weight: 700; min-width: 0; text-align: right; }
.ucr-page a.ucr-picked:hover { text-decoration: underline; }
.ucr-bism { position: relative; font-size: 19px; font-weight: 700; color: #fff; border: 0; padding: 17px 30px; border-radius: 13px; cursor: pointer; white-space: nowrap; text-shadow: 0 1px 2px rgba(60,40,0,.4); background: #b07f1c; min-height: 44px; }
.ucr-bism:hover { filter: brightness(1.08); }
.ucr-spark { position: absolute; pointer-events: none; background: #fff; clip-path: polygon(50% 0, 61% 39%, 100% 50%, 61% 61%, 50% 100%, 39% 61%, 0 50%, 39% 39%); animation: ucrTwinkle 2.4s ease-in-out infinite; }
@keyframes ucrTwinkle { 0%, 100% { opacity: 0; transform: scale(.3) rotate(0deg); } 50% { opacity: 1; transform: scale(1) rotate(45deg); } }
.ucr-feature { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); background: linear-gradient(160deg, #dcefe2 0%, #e8f3d2 35%, #f4f8dc 52%, #e5f1d0 75%, #d9edc9 100%); border-radius: 24px; overflow: hidden; color: #17231e; margin-bottom: 20px; transition: transform .25s ease, box-shadow .25s ease; text-decoration: none; }
.ucr-page a.ucr-feature { color: #17231e; }
.ucr-feature:hover { transform: translateY(-3px); box-shadow: 0 20px 44px rgba(20,133,95,.14); }
.ucr-feature-ph { position: relative; min-height: 340px; background: #e5f1d0; }
.ucr-feature-ph img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.ucr-feature-tx { padding: 48px; display: flex; flex-direction: column; justify-content: center; gap: 16px; }
.ucr-feature-k { font-size: 15px; font-weight: 600; color: #8a6516; }
.ucr-feature-h { font-weight: 700; font-size: 40px; line-height: 1.05; letter-spacing: -.02em; color: #14855f; }
.ucr-feature-p { font-size: 17px; line-height: 1.6; color: #3a4640; max-width: 420px; text-wrap: pretty; }
.ucr-raised { font-size: 22px; font-weight: 700; color: #14855f; }
.ucr-raised small { font-size: 16px; font-weight: 500; color: #46524c; }
.ucr-feature-tx .ucr-btn { align-self: flex-start; margin-top: 8px; color: #fff; background: #14855f; padding: 17px 30px; font-size: 19px; }
.ucr-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); gap: 20px; }
.ucr-card { display: flex; flex-direction: column; background: #fff; border: 1px solid #eeebe3; border-radius: 20px; overflow: hidden; color: #17231e; transition: transform .25s ease, box-shadow .25s ease; text-decoration: none; outline: 0 solid transparent; outline-offset: 4px; }
.ucr-page a.ucr-card { color: #17231e; }
.ucr-card:hover { transform: translateY(-4px); box-shadow: 0 18px 40px rgba(23,35,30,.10); }
.ucr-card.is-picked, .ucr-feature.is-picked { outline: 3px solid #e6b84d; }
.ucr-card-ph { position: relative; aspect-ratio: 4/3; background: #f4f8f5; }
.ucr-card-ph img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.ucr-card-bd { padding: 20px 22px 22px; display: flex; flex-direction: column; flex: 1; }
.ucr-card-t { font-size: 21px; font-weight: 700; line-height: 1.2; }
.ucr-card-n { font-size: 14px; color: #56605a; margin-top: 6px; }
.ucr-card-row { margin-top: auto; padding-top: 20px; display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.ucr-logos { display: flex; align-items: center; min-height: 28px; }
.ucr-logos span { width: 28px; height: 28px; border-radius: 50%; overflow: hidden; background: #fff; box-shadow: 0 0 0 2px #fff, 0 0 0 3px #eeebe3; position: relative; display: block; }
.ucr-logos span + span { margin-left: -8px; }
.ucr-logos img { width: 100%; height: 100%; object-fit: contain; display: block; }
.ucr-amt { font-size: 17px; font-weight: 700; color: #14855f; white-space: nowrap; }
.ucr-amt small { font-size: 14px; font-weight: 500; color: #56605a; }
.ucr-amt.first { font-size: 15px; font-weight: 600; color: #8a6516; white-space: normal; text-align: right; }
.ucr-card-btn { margin-top: 18px; text-align: center; font-size: 19px; font-weight: 700; color: #fff; background: #14855f; padding: 17px 30px; border-radius: 13px; box-shadow: 0 6px 16px rgba(20,133,95,.2); min-height: 44px; }
.ucr-card:hover .ucr-card-btn { background: #0f6e4f; }

/* ---------- Doors band ---------- */
.ucr-band { background: linear-gradient(180deg, #fff 0%, #fffaf0 22%, #fffaf0 78%, #fff 100%); }
.ucr-band-in { max-width: 1200px; margin: 0 auto; padding: 104px 32px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); gap: 56px 80px; align-items: center; }
.ucr-band p.big { margin-top: 20px; font-size: 20px; line-height: 1.65; color: #3a4640; max-width: 480px; text-wrap: pretty; }
.ucr-facts { display: flex; flex-direction: column; gap: 14px; }
.ucr-fact { background: #fff; border-radius: 18px; padding: 26px 28px; display: grid; grid-template-columns: auto 1fr; gap: 20px; align-items: center; box-shadow: 0 1px 0 #f0e8d4; }
.ucr-fact-n { font-size: 44px; font-weight: 700; color: #14855f; line-height: 1; min-width: 96px; }
.ucr-fact-t { font-size: 19px; font-weight: 700; }
.ucr-fact-d { font-size: 17px; color: #3a4640; margin-top: 4px; line-height: 1.5; }

/* ---------- How: reach strip + sunrise ---------- */
.ucr-how { scroll-margin-top: 80px; overflow: hidden; }
.ucr-how-in { max-width: 1200px; margin: 0 auto; padding: 104px 24px 112px; }
.ucr-reach { background: linear-gradient(160deg, #dcefe2 0%, #e8f3d2 35%, #f4f8dc 52%, #e5f1d0 75%, #d9edc9 100%); box-shadow: 0 30px 60px -30px rgba(159,216,176,.55); border-radius: 28px; padding: 48px 0 8px; overflow: hidden; }
.ucr-reach h3 { font-size: clamp(22px, 2.6vw, 28px); font-weight: 700; letter-spacing: -.02em; color: #b07f1c; text-align: center; padding: 0 24px; }
.ucr-reach-row { display: flex; gap: 40px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding: 0 36px; padding: 32px 36px 44px; scrollbar-width: none; }
.ucr-reach-row::-webkit-scrollbar { display: none; }
.ucr-reach-item { flex: 0 0 calc((100% - 40px) / 2); min-width: 0; scroll-snap-align: start; display: flex; flex-direction: column; align-items: center; gap: 18px; background: #fff; border-radius: 24px; padding: 24px 14px; box-shadow: 0 8px 24px rgba(23,35,30,.07); color: #17231e; transition: transform .25s ease, box-shadow .25s ease; text-decoration: none; }
.ucr-page a.ucr-reach-item { color: #17231e; }
.ucr-reach-item:hover { transform: translateY(-4px); box-shadow: 0 14px 28px rgba(23,35,30,.10); }
@media (min-width: 600px) { .ucr-reach-item { flex-basis: calc((100% - 80px) / 3); } }
@media (min-width: 900px) { .ucr-reach-item { flex-basis: calc((100% - 120px) / 4); } }
.ucr-heart { position: relative; width: 100%; aspect-ratio: 1.108/1; }
.ucr-heart-clip { position: absolute; inset: 0; background: #fff; clip-path: polygon(50% 100%, 42.5% 97.8%, 33.5% 91%, 24% 82.1%, 15.1% 72.4%, 8.3% 62.9%, 3.2% 52.3%, .6% 42.3%, 0 33.7%, .5% 26.8%, 2.7% 18.6%, 6.8% 11.2%, 12.5% 5.4%, 19.5% 1.5%, 27.1% 0%, 34.8% 1%, 41.7% 5%, 45.8% 10.2%, 50% 14.8%, 54.2% 10.2%, 58.3% 5%, 65.2% 1%, 72.9% 0%, 80.5% 1.5%, 87.5% 5.4%, 93.2% 11.2%, 97.3% 18.6%, 99.5% 26.8%, 100% 33.7%, 99.4% 42.3%, 96.8% 52.3%, 91.7% 62.9%, 84.9% 72.4%, 76% 82.1%, 66.5% 91%, 57.5% 97.8%); background: #eef6ea; display: flex; align-items: center; justify-content: center; }
.ucr-heart-clip img { width: 100%; height: 100%; object-fit: contain; padding: 12%; display: block; }
.ucr-heart-clip span { font-size: 40px; font-weight: 700; color: #14855f; }
.ucr-reach-name { text-align: center; font-size: 17px; font-weight: 700; line-height: 1.35; letter-spacing: -.01em; color: #17231e; text-wrap: balance; }

.ucr-sun { margin-top: 64px; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 24px 56px; background: linear-gradient(180deg, #ffefc2 0%, #fff7df 38%, #fff 100%); border-radius: 28px; padding: clamp(40px, 6vw, 72px) clamp(20px, 4vw, 56px); }
.ucr-sun-art { position: relative; flex: 1 1 440px; min-width: 0; max-width: 720px; aspect-ratio: 16/10; }
.ucr-sun-glow { position: absolute; left: 50%; top: 52%; width: 70%; height: 90%; transform: translate(-50%, -50%); border-radius: 50%; background: radial-gradient(circle, #ffeab0 0%, rgba(255,234,176,.45) 38%, rgba(255,234,176,0) 70%); filter: blur(20px); pointer-events: none; }
.ucr-sun-art img { position: absolute; height: auto; }
.ucr-sun-art img.small { width: 12%; left: 50%; top: 50%; opacity: .15; transform: translate(-50%, -50%) scale(.45); filter: drop-shadow(0 6px 12px rgba(176,127,28,.22)); will-change: left, top, transform; }
.ucr-sun-art img.big { left: 50%; top: 50%; width: 32%; transform: translate(-50%, -50%); filter: drop-shadow(0 18px 32px rgba(176,127,28,.3)); }
.ucr-sun-tx { flex: 1 1 400px; min-width: 0; max-width: 540px; display: flex; flex-direction: column; align-items: center; text-align: center; }
.ucr-sun-h { font-weight: 700; font-size: clamp(32px, 4.4vw, 52px); letter-spacing: -.035em; line-height: 1.08; color: #14855f; }
.ucr-sun-h em { font-style: normal; color: #b07f1c; }
.ucr-sun-p { margin-top: 18px !important; max-width: 580px; font-size: 20px; line-height: 1.6; color: #3a4640; text-wrap: pretty; }
.ucr-amts { margin-top: 36px; display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; }
.ucr-amt-b { font-size: 17px; font-weight: 700; min-width: 76px; min-height: 48px; padding: 14px 18px; border-radius: 12px; cursor: pointer; border: 1.5px solid rgba(20,133,95,.35); background: #fff; color: #14855f; }
.ucr-amt-b[aria-pressed="true"] { background: #14855f; border-color: #14855f; color: #fff; }
.ucr-amt-line { margin-top: 14px !important; font-size: 17px; color: #46524c; }
.ucr-sun-tx .ucr-btn-lg { margin-top: 28px; }
.ucr-sun-note { margin-top: 16px !important; font-size: 15px; color: #56605a; }
@media (min-width: 960px) { .ucr-sun-tx { align-items: flex-start; text-align: left; } .ucr-amts { justify-content: flex-start; } .ucr-sun-art { order: 1; max-width: 560px; } }

/* ---------- Narration panels (scripture sits alone: never under a call to action) ---------- */
.ucr-narr { max-width: 1200px; margin: 0 auto; padding: 56px 24px 24px; }
.ucr-narr-in { max-width: 760px; margin: 0 auto; background: #fff; border: 1px solid #f1ead6; border-radius: 20px; padding: 32px 36px; text-align: center; }
.ucr-quote { font-style: italic; font-weight: 600; font-size: clamp(22px, 2.6vw, 28px); line-height: 1.4; color: #14855f; text-wrap: balance; margin: 0; }
.ucr-ref { margin-top: 14px !important; font-size: 15px; color: #6b4e0f; font-weight: 500; }

/* ---------- Closing ---------- */
.ucr-close { padding: 0 24px 40px; scroll-margin-top: 80px; }
.ucr-close-panel { position: relative; overflow: hidden; max-width: 1200px; margin: 0 auto; border-radius: 32px; background: linear-gradient(160deg, #dcefe2 0%, #e8f3d2 35%, #f4f8dc 52%, #e5f1d0 75%, #d9edc9 100%); }
.ucr-close-glow { position: absolute; left: 25%; top: -40%; width: 50%; height: 80%; border-radius: 50%; background: radial-gradient(circle, #ffe7a3 0%, rgba(255,231,163,0) 70%); filter: blur(30px); pointer-events: none; }
.ucr-close-in { position: relative; max-width: 760px; margin: 0 auto; padding: 88px 32px; text-align: center; }
.ucr-close-in .ucr-quote { font-size: clamp(26px, 3vw, 34px); }
.ucr-after { max-width: 760px; margin: 0 auto; padding: 36px 24px 96px; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 12px; }

/* ---------- Disclaimer ---------- */
.ucr-legal { border-top: 1px solid #eeebe3; }
.ucr-legal p { max-width: 880px; padding: 40px 0; font-size: 13px; line-height: 1.7; color: #56605a; text-wrap: pretty; }
.ucr-ad { padding: 0 24px 48px; display: flex; justify-content: center; }

/* ---------- Browse charities ---------- */
.ucr-bhero { position: relative; overflow: hidden; background: #fdf6df; }
.ucr-bhero .ucr-hero-fade { height: 140px; }
.ucr-bhero-in { position: relative; max-width: 920px; margin: 0 auto; padding: 96px 32px 128px; text-align: center; }
.ucr-bhero .ucr-h1 { font-size: clamp(40px, 5.4vw, 68px); line-height: 1.04; }
.ucr-bhero .ucr-lead { margin-left: auto; margin-right: auto; max-width: 640px; }
.ucr-filter { position: relative; z-index: 2; margin-top: -72px; background: #fff; border-radius: 24px; box-shadow: 0 20px 50px rgba(23,35,30,.08), 0 0 0 1px #eeebe3; padding: 16px; }
.ucr-search { position: relative; }
.ucr-search svg { position: absolute; left: 16px; top: 50%; transform: translateY(-50%); color: #56605a; }
.ucr-search input { width: 100%; font-size: 17px; min-height: 52px; padding: 0 16px 0 46px; border: 1px solid #e6e1d3; border-radius: 12px; background: #fff; color: #17231e; }
.ucr-filter-row { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin-top: 12px; }
.ucr-filter select { width: 100%; min-height: 48px; font-size: 16px; padding: 0 12px; border: 1px solid #e6e1d3; border-radius: 10px; background: #fff; color: #17231e; }
.ucr-zakat { display: flex; align-items: center; gap: 10px; min-height: 48px; padding: 0 14px; border: 1px solid #e6e1d3; border-radius: 10px; font-size: 16px; color: #17231e; cursor: pointer; }
.ucr-zakat input { width: 20px; height: 20px; accent-color: #14855f; }
.ucr-filter-go { grid-column: 1 / -1; min-height: 48px; border: 0; border-radius: 12px; background: #14855f; color: #fff; font-size: 16px; font-weight: 700; cursor: pointer; padding: 0 22px; }
.ucr-filter-go:hover { background: #0f6e4f; }
@media (min-width: 900px) { .ucr-filter-row { grid-template-columns: 1fr 1fr 1fr auto auto; } .ucr-filter-go { grid-column: auto; } }
.ucr-count { padding: 20px 0; font-size: 15px; color: #46524c; }
.ucr-accept { background: linear-gradient(180deg, #ffefc2 0%, #fff7df 30%, #fff 100%); border-radius: 28px; margin-top: 28px; padding: clamp(32px, 5vw, 56px) clamp(16px, 3vw, 40px); }
.ucr-accept-head { padding: 0 0 28px; }
.ucr-cgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 262px), 1fr)); gap: 20px; }
.ucr-ccard { display: flex; flex-direction: column; background: #fff; border: 1px solid #eeebe3; border-radius: 20px; padding: 16px 20px 20px; transition: transform .25s ease, box-shadow .25s ease; }
.ucr-ccard:hover { transform: translateY(-4px); box-shadow: 0 18px 40px rgba(23,35,30,.10); }
.ucr-cphoto { position: relative; aspect-ratio: 16/9; border-radius: 14px; overflow: hidden; background: linear-gradient(160deg, #dcefe2, #f4f8dc); }
.ucr-cphoto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.ucr-feat { position: absolute; top: 10px; left: 10px; font-size: 14px; font-weight: 700; color: #6b4e0f; background: rgba(255,255,255,.92); padding: 4px 10px; border-radius: 8px; }
.ucr-cmeta { display: flex; justify-content: space-between; align-items: center; margin-top: 14px; gap: 12px; }
.ucr-clogo { width: 60px; height: 60px; border-radius: 14px; border: 1px solid #efebe1; background: #fff; display: flex; align-items: center; justify-content: center; overflow: hidden; flex: none; }
.ucr-clogo img { width: 100%; height: 100%; object-fit: contain; padding: 4px; }
.ucr-clogo span { font-size: 24px; font-weight: 700; color: #14855f; }
.ucr-cland { font-size: 14px; color: #3a4640; text-align: right; }
.ucr-cname { margin-top: 12px !important; font-size: 20px; font-weight: 700; line-height: 1.25; letter-spacing: -.01em; color: #17231e; }
.ucr-ccause { margin-top: 6px !important; font-size: 14px; font-weight: 700; color: #0f6e4f; }
.ucr-czakat { margin-top: 4px !important; font-size: 14px; font-weight: 600; color: #8a6516; }
.ucr-cstat { margin-top: auto !important; padding-top: 14px; display: flex; justify-content: space-between; align-items: baseline; gap: 8px; font-size: 14px; color: #46524c; min-height: 40px; }
.ucr-cstat b { font-size: 18px; color: #14855f; font-weight: 700; }
.ucr-cstat .first { color: #8a6516; font-weight: 600; }
.ucr-ccard .ucr-btn-md { width: 100%; margin-top: 12px; padding: 17px 20px; }
.ucr-ccard .ucr-link { justify-content: center; margin-top: 4px; width: 100%; }
.ucr-note { margin-top: 12px !important; font-size: 15px; color: #46524c; text-align: center; min-height: 44px; display: flex; align-items: center; justify-content: center; }
.ucr-soon { margin-top: 48px; }
.ucr-soon h2 { font-size: clamp(26px, 3vw, 34px); font-weight: 700; letter-spacing: -.02em; color: #14855f; }
.ucr-soon .ucr-sec-lead { font-size: 17px; }
.ucr-notify { margin-top: auto; padding-top: 14px; }
.ucr-notify input { width: 100%; min-height: 48px; font-size: 16px; padding: 0 12px; border: 1px solid #e6e1d3; border-radius: 10px; margin-bottom: 8px; }
.ucr-notify button { width: 100%; min-height: 48px; border-radius: 12px; border: 1px solid rgba(20,133,95,.3); background: #fff; color: #14855f; font-size: 16px; font-weight: 700; cursor: pointer; }
.ucr-empty { background: linear-gradient(160deg, #dcefe2 0%, #e8f3d2 35%, #f4f8dc 52%, #e5f1d0 75%, #d9edc9 100%); border-radius: 24px; padding: 56px 24px; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 18px; }
.ucr-empty p { font-size: 22px; font-weight: 700; color: #14855f; }
.ucr-facts3 { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 32px; padding: 72px 0 40px; }
.ucr-facts3 svg { color: #14855f; margin-bottom: 12px; }
.ucr-facts3 .t { font-size: 19px; font-weight: 700; }
.ucr-facts3 .d { font-size: 17px; color: #3a4640; margin-top: 4px; line-height: 1.5; }
.ucr-pager { margin-top: 28px; }

@media (max-width: 700px) {
  .ucr-wrap { padding: 0 20px; }
  .ucr-hero-in { padding: 72px 20px 80px; }
  .ucr-lead { font-size: 18px; }
  .ucr-page a.ucr-btn-lg, .ucr-btn-lg { font-size: 19px; padding: 18px 32px; }
  .ucr-causes-in { padding: 72px 20px 64px; }
  .ucr-feature-tx { padding: 28px 24px; }
  .ucr-feature-h { font-size: 32px; }
  .ucr-band-in { padding: 72px 20px; }
  .ucr-how-in { padding: 64px 16px 72px; }
  .ucr-picker { padding: 20px; }
  .ucr-picked { text-align: left; }
  .ucr-bhero-in { padding: 64px 20px 112px; }
  .ucr-narr-in { padding: 24px 20px; }
  .ucr-close-in { padding: 64px 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .ucr-spark { animation: none; opacity: 0; }
  .ucr-card, .ucr-ccard, .ucr-feature, .ucr-reach-item { transition: none; }
}

/* ---------- Round 2 ---------- */
.ucr-coin { position: absolute; z-index: 1; height: auto; pointer-events: none; display: none; filter: drop-shadow(0 18px 32px rgba(176,127,28,.3)); }
@media (min-width: 1100px) { .ucr-coin { display: block; } .ucr-coin-l { width: 120px; left: 7%; top: 34%; transform: rotate(-10deg); } .ucr-coin-r { width: 210px; right: 6%; top: 22%; transform: rotate(8deg); } }
.ucr-hero-veil { background: radial-gradient(ellipse 50% 55% at 50% 45%, rgba(255,253,246,.55) 0%, rgba(255,253,246,.25) 60%, rgba(255,253,246,0) 100%); }
.ucr-trust1 { margin-top: 36px !important; font-size: 17px; color: #3a4640; }
.ucr-trust1 b { color: #14855f; font-weight: 800; }
.ucr-tile { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; padding: 16px; text-align: center; font-size: 22px; font-weight: 700; line-height: 1.2; color: #14855f; background: linear-gradient(160deg, #fff8e4 0%, #f4f8dc 100%); text-wrap: balance; }
.ucr-featline { margin-top: 2px !important; font-size: 14px; font-weight: 700; color: #6b4e0f; }
.ucr-flag { display: inline-block; vertical-align: -2px; border-radius: 2px; margin-right: 4px; }
.ucr-nominate { margin-top: 20px; display: flex; justify-content: center; }
/* the Ummah One upgrade strip: light gold, dark button (round 2) */
.ucr-body .ucr-promo-box { background: #EAF7EE !important; border-color: #BFE3CB !important; }
.ucr-body .ucr-promo-box > .absolute.inset-0 { display: none; }
.ucr-body .ucr-promo-h { color: #17231e !important; }
.ucr-body .ucr-promo-p { color: #3a4640 !important; }
.ucr-body .ucr-promo-em { color: #0F1F17 !important; }
.ucr-body .ucr-promo-x { color: #3a4640 !important; }
.ucr-body .ucr-promo-btn { background: #0A7B3D !important; color: #fff !important; }
@media (max-width: 700px) {
  .ucr-grid { gap: 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ucr-grid > .ucr-card { border-radius: 16px; }
  .ucr-card-ph { aspect-ratio: 1/1; }
  .ucr-card-bd { padding: 12px; }
  .ucr-card-t { font-size: 16px; }
  .ucr-card-row { flex-direction: column; align-items: flex-start; gap: 6px; padding-top: 10px; }
  .ucr-amt.first { text-align: left; font-size: 13px; }
  .ucr-card-btn { font-size: 16px; padding: 12px; margin-top: 10px; }
  .ucr-tile { font-size: 17px; }
  .ucr-picker-r { width: 100%; }
  .ucr-bism { width: 100%; }
  .ucr-trust1 { font-size: 15px; margin-top: 28px !important; }
  .ucr-narr { padding: 40px 16px 8px; }
  .ucr-feature-ph { min-height: 190px; }
  .ucr-hero-in { padding: 48px 20px 56px; }
  .ucr-causes-in { padding: 40px 20px 48px; }
  .ucr-causes-head { margin-bottom: 20px; }
  .ucr-h2 { font-size: 30px; }
  .ucr-sec-lead { font-size: 17px; }
  .ucr-hero-btns { margin-top: 28px; }
  .ucr-feature-tx { gap: 10px; padding: 22px 20px; }
  .ucr-sun { margin-top: 32px !important; }
}

.ucr-h1 .uc-gradient-text { background: none !important; -webkit-text-fill-color: #b07f1c !important; color: #b07f1c !important; }
@media (max-width: 700px) { .ucr-causes-head .ucr-sec-lead { display: none; } .ucr-feature-ph { min-height: 150px !important; } .ucr-picker-s { font-size: 15px; } }

/* ---------- Round 3 ---------- */
.ucr-tile { background: #fff8e4 !important; }
.ucr-coin-m { width: 72px; height: 72px; margin-bottom: 8px; filter: drop-shadow(0 8px 14px rgba(176,127,28,.3)); }
@media (min-width: 1100px) { .ucr-coin-m { display: none; } }
/* charity page hero: cream to gold, charity name in green (no dark blocks on her pages) */
.ucr-show-hero { background: linear-gradient(180deg, #fff8e4 0%, #fffdf6 55%, #f4f8dc 100%); border-bottom: 1px solid #f1ead6; }
.ucr-show-hero .uc-pattern { display: none; }
.ucr-show-hero h1, .ucr-show-hero .text-white { color: #14855f !important; }
.ucr-show-hero .text-emerald-100, .ucr-show-hero [class*="text-emerald-100"] { color: #3a4640 !important; }
.ucr-show-hero span[class*="rounded-full"] { border-radius: 8px !important; background: #fff !important; color: #3a4640 !important; border: 1px solid #eee3c6; }
.ucr-show-hero a[class*="bg-white"] { background: #14855f !important; color: #fff !important; }
.ucr-show-hero a[class*="bg-white"]:hover { background: #0f6e4f !important; }
.ucr-show-hero [class*="bg-white/20"], .ucr-show-hero [class*="bg-white/15"] { background: #fff !important; }

.ucr-adslot { display: flex; justify-content: center; margin: 40px auto 24px; padding: 0 16px; min-height: 250px; }

/* ---------- Round 4 ---------- */
.ucr-amt.first { font-size: 14px !important; }
.ucr-adslot { margin: 0 auto; }
.ucr-body .breadcrumb-back { color: #14855f !important; font-size: 14px !important; }


/* ---------- r2550: back to the spec (Tab, Oct 27) ---------- */
.ucr-trust { margin-top: 48px; }
.ucr-trust strong { color: #17231e; font-weight: 600; }
.ucr-trust strong.gold { color: #8a6516; font-weight: 700; }
.ucr-trust b { font-size: 17px; }
.ucr-trust-close { margin-top: 28px !important; font-size: 17px; color: #3a4640; text-wrap: balance; }
.ucr-trust-close strong { color: #14855f; font-weight: 700; }
@media (max-width: 700px) { .ucr-trust { margin-top: 28px; font-size: 15px; gap: 10px 20px; } .ucr-trust-close { font-size: 15px; margin-top: 18px !important; } }
.ucr-sun-cite { margin-top: 6px !important; font-size: 14px; color: #6b4e0f; }
.ucr-close-btn { margin-top: 44px; }
.ucr-close-link { margin-top: 18px; font-size: 15px; font-weight: 500; }
.ucr-close-in { display: flex; flex-direction: column; align-items: center; }
.ucr-close { padding-bottom: 96px; }
@media (max-width: 700px) { .ucr-close { padding-bottom: 56px; } .ucr-close-btn { margin-top: 28px; } }
/* browse: photo frame is always there (a charity with no cover photo gets its real logo or initial on the soft panel), live filter hides the button */
.ucr-cphoto-fb { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; }
.ucr-cphoto-fb img { max-width: 62%; max-height: 62%; object-fit: contain; }
.ucr-cphoto-fb span { font-size: 56px; font-weight: 700; color: #14855f; }
.ucr-filter.is-live .ucr-filter-go { display: none; }
@media (min-width: 900px) { .ucr-filter.is-live .ucr-filter-row { grid-template-columns: 1fr 1fr 1fr auto; } }
.ucr-soon .ucr-ccard { align-self: start; }
.ucr-heart-clip:has(img) { background: #fff; box-shadow: inset 0 0 0 0 #fff; }

.ucr-ccard .ucr-cphoto { margin: 0 -4px; background: #fff; border: 1px solid #efebe1; }
.ucr-ccard .ucr-cphoto .ucr-cphoto-fb { background: #fff; }
.ucr-ccard .ucr-cphoto .ucr-cphoto-fb img { position: static; inset: auto; width: auto; height: auto; max-width: 62%; max-height: 62%; object-fit: contain; }
.ucr-ccard .ucr-feat { top: 10px; left: 12px; font-size: 13px; color: #6b4e0f; background: none; padding: 0; border-radius: 0; z-index: 1; }

/* r2577: the Zakat line is a link to the charity's own page */
.ucr-czakat a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
/* Oct 27: logo box sizes the image, never the padding on top of it */
.ucr-heart-clip img { box-sizing: border-box; }

/* ---------- r2584: the inside pages (/causes, donate, how it works, transparency, about, FAQ, for charities, apply, contact) ----------
   They carry the redesign header, footer and tokens. Content keeps its own markup; these rules take the dark green
   band, dark panels, pill and uppercase labels out, and put cards and forms on the same tokens as home and Browse. */
.ucr-inner { font-family: 'Plus Jakarta Sans', system-ui, sans-serif; color: #17231e; background: #fff; }
.ucr-inner h1, .ucr-inner h2, .ucr-inner h3 { font-family: 'Plus Jakarta Sans', system-ui, sans-serif; text-wrap: balance; }
.ucr-inner h2.text-gray-900, .ucr-inner h2.text-3xl.text-gray-900 { color: #14855f; letter-spacing: -.02em; }
.ucr-inner .bg-gray-50 { background: #fffdf6; }
.ucr-inner .min-h-screen.bg-gray-50 { min-height: 0; }
.ucr-inner .bg-white.rounded-2xl, .ucr-inner .bg-white.rounded-xl, .ucr-inner .bg-white.rounded-3xl { border: 1px solid #eeebe3; box-shadow: 0 6px 22px rgba(23,35,30,.04); }
.ucr-inner .bg-white.rounded-2xl.shadow-sm, .ucr-inner .bg-white.rounded-xl.shadow-sm { box-shadow: 0 6px 22px rgba(23,35,30,.04); }
.ucr-inner input[type="text"], .ucr-inner input[type="email"], .ucr-inner input[type="number"], .ucr-inner input[type="url"], .ucr-inner input[type="tel"], .ucr-inner select, .ucr-inner textarea { border-color: #e6e1d3; border-radius: 12px; font-family: inherit; font-weight: 500; }
.ucr-inner input:focus, .ucr-inner select:focus, .ucr-inner textarea:focus { border-color: #14855f; box-shadow: 0 0 0 3px rgba(20,133,95,.18); outline: none; }
.ucr-inner a:not([class*="bg-"]):not([class*="uc-btn"]):not([class*="border-"]) { text-decoration-color: rgba(20,133,95,.35); }
.ucr-inner button.bg-emerald-600, .ucr-inner a.bg-emerald-600 { border-radius: 13px; font-weight: 700; }
.ucr-inner .bg-emerald-600:hover { background: #0f6e4f; }
.ucr-inner .uc-btn-primary { background: #14855f; color: #fff; border-radius: 13px; }
.ucr-inner .uc-btn-primary:hover { background: #0f6e4f; }
.ucr-inner [class*="rounded-full"][class*="bg-gold-500/1"], .ucr-inner [class*="rounded-full"][class*="bg-gold-500/2"], .ucr-inner [class*="rounded-full"][class*="bg-emerald-500/20"], .ucr-inner span[class*="rounded-full"][class*="text-xs"][class*="font-bold"] { border-radius: 8px !important; }
/* no uppercase eyebrow labels on the redesign pages */
/* r2626 (blind seats R1 #8, R2 #2): text-gray-400 is 2.3 to 2.5:1 on cream; inner pages read #56605a (6.4:1) */
.ucr-inner .text-gray-400 { color: #56605a; }
/* the closing line of the pill and other quiet emerald lines pass 4.5:1 */
.ucr-inner h1.text-gray-900 { color: #14855f; text-wrap: balance; }
.ucr-inner .uppercase { text-transform: none !important; letter-spacing: 0 !important; }
.ucr-inner .tracking-wider, .ucr-inner .tracking-wide { letter-spacing: 0 !important; }

/* page hero (inner pages) */
.ucr-phero .ucr-bhero-in, .ucr-phero .ucr-hero-in { padding-top: 72px; padding-bottom: 96px; }
.ucr-phero .ucr-h1 { font-size: clamp(38px, 5vw, 58px); }
@media (max-width: 700px) { .ucr-phero .ucr-bhero-in { padding: 48px 20px 80px; } }
/* the cream hero for pages whose hero carries stats, buttons and a Ramadan strip (/causes, for charities, onboarding) */
.ucr-inhero { background: linear-gradient(180deg, #fff8e4 0%, #fffdf6 62%, #fff 100%); border-bottom: 1px solid #f1ead6; }
.ucr-inhero [class*="text-emerald-100"], .ucr-inhero [class*="text-emerald-200"], .ucr-inhero [class*="text-gold-100"] { color: #3a4640 !important; }
.ucr-inhero p strong, .ucr-inhero strong.text-white { color: #17231e !important; }
.ucr-inhero .text-white { color: #17231e !important; }
.ucr-inhero h1, .ucr-inhero h1.text-white { color: #14855f !important; }
.ucr-inhero .uc-gradient-text { background: none !important; -webkit-text-fill-color: #b07f1c !important; color: #b07f1c !important; }
.ucr-inhero [class*="bg-white/15"], .ucr-inhero [class*="bg-white/10"] { background: #fff !important; }
.ucr-inhero [class*="bg-gold-500/15"] { background: none !important; border: 0 !important; border-radius: 0 !important; padding: 0 !important; margin-bottom: 20px !important; backdrop-filter: none !important; }
.ucr-inhero [class*="bg-gold-500/15"] span { color: #8a6516 !important; font-size: 16px !important; font-weight: 600 !important; }
.ucr-inhero [class*="bg-gold-500/15"] [class*="animate-ping"], .ucr-inhero [class*="bg-gold-500/15"] > span.relative { display: none; }
.ucr-inhero a[class*="border-white/30"] { border: 1px solid rgba(20,133,95,.3) !important; color: #14855f !important; background: rgba(255,255,255,.8) !important; box-shadow: none !important; }
.ucr-inhero a[class*="border-white/30"]:hover { background: #fff !important; color: #0f6e4f !important; }
.ucr-inhero .bg-white\/15, .ucr-inhero .w-px { background: #e6e1d3 !important; }
.ucr-inhero .uc-btn-primary { color: #fff !important; }
.ucr-inhero .uc-pattern, .ucr-inhero > .absolute { display: none; }
.ucr-inhero .text-emerald-200\/70 { color: #56605a !important; }

/* soft green panel: replaces the dark panels and green bands */
.ucr-soft { background: linear-gradient(160deg, #dcefe2 0%, #e8f3d2 35%, #f4f8dc 52%, #e5f1d0 75%, #d9edc9 100%) !important; color: #17231e; border: 1px solid #d3e6c8; border-radius: 24px; }
.ucr-soft .absolute.inset-0 { display: none; }
.ucr-soft h2, .ucr-soft h3, .ucr-soft .text-white { color: #17231e !important; }
.ucr-soft h2 { color: #14855f !important; }
.ucr-soft [class*="text-gray-200"], .ucr-soft [class*="text-gray-300"], .ucr-soft [class*="text-gray-400"], .ucr-soft [class*="text-emerald-100"], .ucr-soft [class*="text-emerald-200"] { color: #3a4640 !important; }
.ucr-soft [class*="text-gray-500"] { color: #56605a !important; }
.ucr-soft [class*="text-gold-300"], .ucr-soft [class*="text-gold-400"], .ucr-soft [class*="text-gold-100"] { color: #8a6516 !important; }
.ucr-soft [class*="text-emerald-300"], .ucr-soft [class*="text-emerald-400"] { color: #14855f !important; }
.ucr-soft [class*="bg-white/5"], .ucr-soft [class*="bg-white/10"] { background: rgba(255,255,255,.7) !important; border-color: #e6e1d3 !important; backdrop-filter: none !important; }
.ucr-soft [class*="bg-emerald-500/20"], .ucr-soft [class*="bg-gold-500/20"] { background: #fff !important; border-radius: 8px; }
.ucr-soft [class*="border-white/"] { border-color: #cfe3c4 !important; }
/* r2626 (blind seats R1 #1, R2 #1): match the EXACT utility token (~=), never a substring. [class*="bg-white"] also
   matched "hover:bg-white/10" on the ghost button and painted it green on green with no label. */
.ucr-soft.text-white { color: #17231e !important; }
.ucr-soft a[class~="bg-gold-500"], .ucr-soft a[class~="bg-white"], .ucr-soft a[class~="bg-emerald-500"], .ucr-soft a[class~="bg-emerald-600"] { background: #14855f !important; color: #fff !important; }
.ucr-soft a[class~="bg-gold-500"]:hover, .ucr-soft a[class~="bg-white"]:hover, .ucr-soft a[class~="bg-emerald-500"]:hover, .ucr-soft a[class~="bg-emerald-600"]:hover { background: #0f6e4f !important; }
/* ghost button (a border-white link with no solid fill): outlined, dark-green label on white */
.ucr-soft a[class*="border-white"]:not([class~="bg-white"]):not([class~="bg-emerald-500"]):not([class~="bg-emerald-600"]):not([class~="bg-gold-500"]) { color: #14855f !important; border-color: rgba(20,133,95,.35) !important; background: #fff !important; }
.ucr-soft a.uc-btn-primary { color: #fff !important; }
.ucr-soft .grid > div { color: inherit; }
@media (max-width: 700px) { .ucr-soft { border-radius: 20px; } }

/* Nov 3 2026 estate design round: the charity onboarding hero. Mint tint ground, estate green heading, no gold text.
   Scoped to .ucr-inhero--estate so the other inner pages keep their own hero until they are redone. */
.ucr-inhero.ucr-inhero--estate { background: linear-gradient(180deg, #EAF7EE 0%, #FAF6EC 100%); border-bottom: 1px solid #CFE3D4; }
.ucr-inhero.ucr-inhero--estate h1, .ucr-inhero.ucr-inhero--estate h1.text-white { color: #0A7B3D !important; }
.ucr-inhero.ucr-inhero--estate a.uc-btn-primary { background: #0A7B3D; box-shadow: none; }
.ucr-inhero.ucr-inhero--estate a.uc-btn-primary:hover { background: #166534; }

/* ===== Home hero B "Seven ears" (r3528, Nov 6 2026). Tokens from the round-3 mock; light only (no site dark theme). ===== */
.uc7-hero { --uc7-em:#0f6e4f; --uc7-em2:#14855f; --uc7-emt:#cfe6da; --uc7-gold:#C5963A; --uc7-soil:#e6d6b2; --uc7-hill:#eef0e0; --uc7-bg2:#F4F1E7;
  background: linear-gradient(180deg,#FEFDF8 0%,#FBF8EE 100%); }
.uc7-in { max-width: 1280px; margin: 0 auto; padding: 72px 32px 56px; display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.05fr); gap: 32px; align-items: center; }
.uc7-copy { text-align: left; }
.uc7-h1 { font-size: clamp(38px, 5.2vw, 64px); line-height: 1.04; letter-spacing: -0.02em; font-weight: 800; color: #17231e; margin: 0 0 18px; text-wrap: balance; }
.uc7-lead { font-size: 19px; line-height: 1.55; color: #46524c; max-width: 30em; margin: 0; text-wrap: pretty; }
.uc7-lead strong { color: #0f6e4f; }
.uc7-btns { justify-content: flex-start; margin-top: 28px; }
.uc7-trust { margin-top: 28px; text-align: left; }
.uc7-figure { min-width: 0; }
.uc7-art { width: 100%; height: auto; display: block; overflow: visible; }
.uc7-art .fg1{fill:var(--uc7-em)} .uc7-art .fg2{fill:var(--uc7-em2)} .uc7-art .fgo{fill:var(--uc7-gold)} .uc7-art .fso{fill:var(--uc7-soil)}
.uc7-art .fhl{fill:var(--uc7-hill)} .uc7-art .fbg2{fill:var(--uc7-bg2)} .uc7-art .fet{fill:var(--uc7-emt)}
.uc7-art .sg{stroke:var(--uc7-gold);fill:none} .uc7-art .se{stroke:var(--uc7-em);fill:none} .uc7-art .se2{stroke:var(--uc7-em2);fill:none}
.uc7-art a { cursor: pointer; outline: none; }
.uc7-art a:hover .fet, .uc7-art a:focus-visible .fet { fill: #f3e5c0; }
.uc7-art a:focus-visible .sg { stroke: #0f6e4f; stroke-width: 4px; }
.uc7-art .hit { fill: transparent; }
.uc7-art .ring { fill: none; stroke: none; }
.uc7-art a:focus-visible .ring { stroke: #0f6e4f; stroke-width: 3px; }
.uc7-stalk { transform-box: view-box; transform-origin: var(--ox, 300px) 520px; }
.uc7-icon { transform-box: fill-box; transform-origin: center; }
@media (prefers-reduced-motion: no-preference) {
  .uc7-stalk { animation: uc7-grow .9s cubic-bezier(.2,.8,.2,1) both; animation-delay: calc(.12s + var(--i) * .07s); }
  .uc7-icon { animation: uc7-pop .45s cubic-bezier(.2,.9,.3,1.2) both; animation-delay: calc(.75s + var(--i) * .07s); }
}
@keyframes uc7-grow { from { transform: scale(.15); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes uc7-pop { from { transform: scale(.4); opacity: 0; } to { transform: none; opacity: 1; } }
@media (max-width: 900px) {
  .uc7-in { grid-template-columns: 1fr; padding: 32px 16px 28px; gap: 8px; }
  .uc7-figure { max-width: 460px; margin: 0 auto; width: 100%; }
  .uc7-lead { font-size: 17px; }
  .uc7-btns { margin-top: 22px; }
}
/* Hero B fixes (Nov 6 2026): gap under the heading, buttons side by side on desktop, trust lines left-aligned with the copy. */
.uc7-hero .uc7-h1 { margin: 0 0 20px; font-size: clamp(36px, 4.6vw, 58px); }
.uc7-hero .uc7-lead { margin: 0; }
.uc7-hero .uc7-btns { flex-wrap: wrap; justify-content: flex-start; gap: 12px; }
.uc7-hero .uc7-btns .ucr-btn-lg { font-size: 18px; padding: 16px 28px; }
.uc7-hero .uc7-trust { justify-content: flex-start; flex-direction: column; gap: 10px; max-width: 34em; margin-top: 28px; }
@media (max-width: 900px) { .uc7-hero .uc7-btns .ucr-btn-lg { font-size: 17px; padding: 15px 24px; } }
/* Hero B round 2 (Nov 6 2026, two blind seats, both 80): one fee line, a calmer phone view, two columns from 700px. */
.uc7-hero .uc7-lead { text-wrap: balance; }
@media (min-width: 700px) and (max-width: 900px) {
  .uc7-in { grid-template-columns: minmax(0,1.1fr) minmax(0,.9fr); padding: 48px 24px 40px; gap: 20px; }
  .uc7-figure { max-width: none; }
  .uc7-hero .uc7-h1 { font-size: clamp(36px, 5vw, 48px); }
}
@media (max-width: 699px) {
  .uc7-in { grid-template-columns: 1fr; }
  .uc7-hero .uc7-trust > div:nth-child(n+2) { display: none; }
  .uc7-hero .uc7-btns .ucr-btn-lg:first-child { width: 100%; justify-content: center; text-align: center; }
  .uc7-hero .uc7-trust { margin-top: 20px; }
  .uc7-figure { margin-top: 4px; }
}