/* Ported from Coffee assets/tuneup.css by docs/work/TC-WO-9/tokenize-css.py (TC-WO-9): header selectors now
   target the theme header (.tc-nav*); colours are tokens (assets/tokens.css). TC-WO-13: Total's element classes
   retargeted to the lean templates (.vcex-button → .tc-button, .vcex-heading → .tc-heading). */
/* TC-WO-3 homepage tune-up. Same palette/type; spacing, radius, pills, tiles.
   Classes come from the WPBakery "Coffee style" dropdown (tc-*) or the Coffee elements. */

/* Header menu: ACCESS-style pills, 44px outside (TC-WO-4). Venmo (1226) stays a plain link on the same centre line.
   Elza in a normal line box has ascent 12 / descent 4 at 16px with 11.4px caps, so caps sat ~1.7px high.
   Labels use line-height:1 and are trimmed to cap height; browsers without text-box get the same optical nudge. */
body .tc-nav__list > .tc-nav__item:not(.tc-nav__item--plain){border:2px solid var(--tc-orange)!important;border-radius:999px}
/* One 10px gap between items (Total's navbar style added 25px right margins on top, so pills sat 35px apart). */
body .tc-nav__list{gap:10px}
body .tc-nav__list > .tc-nav__item{margin:0!important}
body .tc-nav__list > .tc-nav__item:not(.tc-nav__item--plain) > a{display:flex;align-items:center;min-height:40px;padding:0 22px!important;border-radius:999px;font-weight:700;letter-spacing:.03em;line-height:1}
body .tc-nav__list > .tc-nav__item--plain > a{display:flex;align-items:center;min-height:44px;padding:0 12px!important;line-height:1}
body .tc-nav__list > .tc-nav__item > a > .tc-nav__label{display:block;line-height:1}
@supports (text-box:trim-both cap alphabetic){body .tc-nav__list > .tc-nav__item > a > .tc-nav__label{text-box:trim-both cap alphabetic}}
@supports not (text-box:trim-both cap alphabetic){body .tc-nav__list > .tc-nav__item > a > .tc-nav__label{transform:translateY(.105em)}body .tc-nav__list > .tc-nav__item--plain > a > .tc-nav__label{display:flex;align-items:center;gap:.25em;transform:translateY(.145em)}}
body .tc-nav__list > .tc-nav__item:last-child{background:var(--tc-orange)}
body .tc-nav__list > .tc-nav__item:last-child > a{color:var(--c-white)}

/* Pill buttons (vc_btn + Coffee style). */
.tc-button[class*="tc-pill-"]{display:inline-flex!important;align-items:center;justify-content:center;gap:10px;min-height:var(--tc-pill-h);margin:0 8px 12px 0;padding:0 30px!important;border:0!important;border-radius:999px!important;font-family:var(--tc-body)!important;font-weight:700!important;font-size:17px!important;line-height:1.1!important;letter-spacing:.03em;text-transform:uppercase;text-decoration:none;transition:background-color .2s,color .2s,box-shadow .2s}
.tc-button[class*="tc-pill-"] .tc-button__inner{display:inline-flex;align-items:center;gap:10px}
.tc-button.tc-pill-orange{background:var(--tc-orange)!important;color:var(--c-white)!important}
.tc-button.tc-pill-line{background:transparent!important;color:var(--tc-ink)!important;box-shadow:inset 0 0 0 2px var(--tc-ink)}
.tc-button.tc-pill-white{background:var(--c-white)!important;color:var(--tc-blue)!important}
.tc-button.tc-pill-line-white{background:transparent!important;color:var(--c-white)!important;box-shadow:inset 0 0 0 2px var(--c-white)}
.tc-button.tc-pill-ink{background:var(--tc-ink)!important;color:var(--c-white)!important}
.tc-card-orange .tc-button.tc-pill-white{color:var(--tc-orange)!important}

/* Type helpers. */
.tc-heading.tc-eyebrow,.tc-heading.tc-eyebrow-white{font-family:var(--tc-display)!important;font-weight:800!important;font-size:22px!important;line-height:1.1!important;letter-spacing:.06em;text-transform:uppercase;color:var(--tc-orange)!important;margin:0 0 14px!important}
.tc-heading.tc-eyebrow-white{color:var(--c-white)!important;opacity:.9}
.tc-heading.tc-display{font-family:var(--tc-display)!important;font-weight:900!important;font-size:clamp(64px,11vw,150px)!important;line-height:.9!important;text-transform:uppercase;letter-spacing:-.005em;color:var(--tc-ink)}
.tc-lead{font-size:clamp(19px,2.2vw,24px);line-height:1.45}
.tc-lead p{max-width:30ch;margin-left:auto;margin-right:auto}
.tc-short p{max-width:44ch}
.tc-short p:last-child{margin-bottom:0}
.tc-source{font-size:13px;line-height:1.5;color:var(--tc-muted);margin-top:14px}
.tc-source p{margin:0}

/* Rounded sections and cards. */
.vc_row.tc-section{border-radius:var(--tc-radius-lg)!important;padding:clamp(32px,5.5vw,80px)!important}
.tc-card-image img{border-radius:var(--tc-radius-lg)!important}
.vc_row.vc_inner.tc-card-orange{background:var(--tc-orange);color:var(--c-white);border-radius:var(--tc-radius-lg);padding:clamp(28px,4vw,48px) clamp(12px,3vw,36px);margin:56px 0 0!important;align-items:center}
.tc-card-orange .tc-heading,.tc-card-orange .wpb_text_column{color:var(--c-white)}
.tc-card-orange .wpb_text_column p{margin-bottom:0}
.vc_row.vc_inner.tc-card-blue{background:var(--tc-blue);color:var(--c-white);border-radius:var(--tc-radius-lg)}
.vc_row.vc_inner.tc-card-soft{background:var(--tc-soft);border-radius:var(--tc-radius-lg)}

/* Hero: taller, pills together. */
.vc_row.tc-hero{border-radius:var(--tc-radius-lg)!important}
.tc-hero .tc-button[class*="tc-pill-"]{margin-right:12px}
@media(max-width:767px){.vc_row.tc-hero{min-height:720px!important}}

/* Ticker: slightly smaller and tighter. */
.vc_row.tc-ticker-row{margin-bottom:12px!important}
/* TC-WO-17: same white above the names (hero photo → cap tops) as below (baseline → blue story box). With
   line-height 1, obviously-condensed puts .193em of empty ascent above the caps but only .028em under the baseline,
   so the names sat low (37px above vs 17px below at 1440; 37 vs 29 at 390, where the row's 170px min-height also
   centred them). The column's 35px top padding and the min-height go; the copy gets em-based padding that cancels
   the font's ascent/descent, the row's -40px top margin (30px over the hero) and its 12px bottom margin, leaving
   30px of white on each side at every width. Font, size, colour and scrolling are unchanged. */
.vc_row.tc-ticker-row{min-height:0!important}
.vc_row.tc-ticker-row>.wpb_column>.vc_column-inner{padding-top:0!important}
.vc_row.tc-ticker-row .tc-ticker-copy{padding:calc(60px - .193em) 0 calc(18px - .028em)}

/* Journey timeline (column with Timeline stop elements). */
.tc-timeline>.vc_column-inner>.wpb_wrapper{position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:28px;margin-top:56px}
.tc-timeline>.vc_column-inner>.wpb_wrapper::before{content:"";position:absolute;left:0;right:0;top:9px;height:3px;border-radius:3px;background:color-mix(in srgb, var(--c-white) 35%, transparent)}
.tc-stop{position:relative;color:var(--c-white)}
.tc-stop__dot{display:block;width:21px;height:21px;border-radius:50%;background:var(--tc-yellow);box-shadow:0 0 0 5px var(--tc-purple);margin-bottom:20px}
.tc-stop__head{margin:0 0 8px;font-family:var(--tc-display);font-weight:900;font-size:clamp(30px,2.8vw,40px);line-height:.95;text-transform:uppercase;color:var(--c-white)}
.tc-stop__years{display:block;font-size:.62em;letter-spacing:.03em;color:var(--tc-yellow);margin-bottom:4px}
.tc-stop__line{margin:0;font-size:16px;line-height:1.45;color:var(--c-white);opacity:.95}
@media(max-width:959px){
 .tc-timeline>.vc_column-inner>.wpb_wrapper{grid-template-columns:1fr;gap:26px;padding-left:38px;margin-top:40px}
 .tc-timeline>.vc_column-inner>.wpb_wrapper::before{left:9px;right:auto;top:6px;bottom:6px;width:3px;height:auto}
 .tc-stop__dot{position:absolute;left:-38px;top:4px;margin:0}
}

/* Number tiles (Israel). */
.tc-tiles>.vc_column-inner>.wpb_wrapper{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}
.tc-stat{display:flex;flex-direction:column;gap:10px;background:var(--tc-soft);border-radius:var(--tc-radius-sm);padding:22px 18px;color:var(--tc-ink)}
.tc-stat__number{font-family:var(--tc-display);font-weight:900;font-size:clamp(52px,4.6vw,72px);line-height:.9;letter-spacing:-.005em}
.tc-stat__label{font-size:15px;font-weight:600;line-height:1.3}
.tc-stat--orange .tc-stat__number{color:var(--tc-orange)}
.tc-stat--blue .tc-stat__number{color:var(--tc-blue)}
.tc-stat--purple .tc-stat__number{color:var(--tc-purple)}
.tc-stat--yellow .tc-stat__number{color:var(--tc-yellow)}
.tc-stat--ink .tc-stat__number{color:var(--tc-ink)}
.tc-stat--dark{background:var(--tc-ink);color:var(--c-white)}
.tc-stat--dark.tc-stat--ink .tc-stat__number{color:var(--c-white)}
@media(max-width:1100px){.tc-tiles>.vc_column-inner>.wpb_wrapper{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:600px){.tc-tiles>.vc_column-inner>.wpb_wrapper{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.tc-stat{padding:18px 14px}}

/* Observations (Israel). */
.tc-observations p{margin:0 0 10px;padding-left:16px;border-left:4px solid var(--tc-yellow);line-height:1.45}
.tc-observations p:last-child{margin-bottom:0}

/* Giving (from Nolan's ACCESS draft). */
.tc-giving .vc_column-inner>.wpb_wrapper{max-width:1040px;margin:0 auto;text-align:center}
.tc-giving .tc-heading{text-align:center}
.tc-goal{max-width:560px;margin:28px auto 26px;text-align:left}
.tc-goal__top{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:8px;font-weight:700;font-size:17px;color:var(--tc-ink)}
.tc-goal__top span{font-weight:500;font-size:15px;color:var(--tc-muted)}
.tc-goal__bar{height:14px;border-radius:999px;background:var(--tc-soft);box-shadow:inset 0 0 0 1px var(--c-hue-e4e4df);overflow:hidden}
.tc-goal__bar i{display:block;height:100%;min-width:14px;border-radius:999px;background:var(--tc-orange)}
.tc-giving-card .vc_column-inner>.wpb_wrapper{text-align:center}
.tc-giving-card .tc-heading.tc-display{font-size:clamp(52px,8.5vw,110px)!important;color:var(--tc-ink)}
.tc-giving-card .tc-lead{font-size:19px;color:var(--c-white)}
.tc-giving-card .tc-lead p{max-width:34ch}
.vc_row.vc_inner.tc-tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:40px 0 44px!important}
.vc_row.vc_inner.tc-tiles>.wpb_column{width:auto!important;max-width:none;padding:0!important;margin:0!important;float:none}
.vc_row.vc_inner.tc-tiles>.wpb_column>.vc_column-inner{padding:0!important;height:100%}
.vc_row.vc_inner.tc-tiles .wpb_wrapper{height:100%}
.tc-need{position:relative;display:flex;flex-direction:column;gap:8px;height:100%;box-sizing:border-box;background:var(--c-white);color:var(--tc-ink);border-radius:var(--tc-radius-sm);padding:26px 22px;text-align:left;text-decoration:none;overflow:hidden}
.tc-need small{font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--tc-muted)}
.tc-need b{font-size:16px;font-weight:700}
.tc-need__amount{font-family:var(--tc-display);font-weight:900;font-size:40px;line-height:1;color:var(--tc-orange)}
.vc_row.vc_inner.tc-boxes{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:24px 0 0!important;text-align:left}
.vc_row.vc_inner.tc-boxes>.wpb_column{width:auto!important;padding:0!important;margin:0!important;float:none}
.vc_row.vc_inner.tc-boxes>.wpb_column>.vc_column-inner{padding:0!important;height:100%}
.vc_row.vc_inner.tc-boxes .wpb_wrapper{height:100%;text-align:left}
.tc-box{height:100%;box-sizing:border-box;background:var(--tc-soft);border-radius:var(--tc-radius-sm);padding:24px}
.tc-box small{display:block;margin-bottom:8px;font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--tc-orange)}
.tc-box__text p{margin:0;font-size:20px;line-height:1.5;color:var(--tc-ink)}
.tc-box__text strong{font-size:26px;line-height:1.3}
.vc_row.tc-close .tc-heading{text-align:center}
.vc_row.tc-close .wpb_wrapper{text-align:center}
@media(max-width:760px){
 .tc-giving .tc-button[class*="tc-pill-"],.tc-close .tc-button[class*="tc-pill-"]{display:flex!important;width:100%;margin-right:0}
 .vc_row.vc_inner.tc-tiles{grid-template-columns:1fr 1fr}
 .vc_row.vc_inner.tc-boxes{grid-template-columns:1fr}
}
/* Grid rows: WPBakery's clearfix pseudo-elements would become grid items. */
.vc_row.vc_inner.tc-tiles::before,.vc_row.vc_inner.tc-tiles::after,.vc_row.vc_inner.tc-boxes::before,.vc_row.vc_inner.tc-boxes::after,.tc-tiles>.vc_column-inner>.wpb_wrapper::before,.tc-tiles>.vc_column-inner>.wpb_wrapper::after{display:none!important}
.tc-nav__list > .tc-nav__item:not(.tc-nav__item--plain) > a,.tc-nav__list > .tc-nav__item:not(.tc-nav__item--plain) > a .tc-nav__label{font-weight:700!important;font-size:16px}
.vc_row.tc-close .vc_column-inner>.wpb_wrapper{max-width:1040px;margin:0 auto}
.vc_row.tc-close .tc-heading{margin-bottom:14px!important}
.tc-button[href^="mailto:"][class*="tc-pill-"]{text-transform:none;letter-spacing:.01em}
.tc-card-orange .tc-heading{margin-bottom:14px!important}

/* ---------- TC-WO-4 polish ---------- */
/* Need tiles: no underline anywhere, lift + shadow on hover, optional photo with a readable overlay. */
.tc-need,.tc-need *,a.tc-need:hover,a.tc-need:hover *,a.tc-need:focus,a.tc-need:focus *{text-decoration:none!important}
a.tc-need{transition:transform .25s cubic-bezier(.2,.7,.2,1),box-shadow .25s ease}
a.tc-need:hover,a.tc-need:focus-visible{transform:translateY(-4px);box-shadow:0 14px 30px color-mix(in srgb, var(--c-hue-0c1428) 28%, transparent)}
a.tc-need:focus-visible{outline:3px solid var(--c-white);outline-offset:3px}
.tc-need>*{position:relative;z-index:2}
.tc-need--image{justify-content:flex-end;min-height:230px;background:var(--tc-ink);color:var(--c-white)}
.tc-need>.tc-need__img{position:absolute;z-index:0;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;border-radius:0;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.tc-need__shade{position:absolute!important;z-index:1!important;inset:0}
/* About 60-74% overlay, heavier at the bottom where the text sits: white text stays >= 4.5:1 even over a pure white photo area (see TC-WO-4 return). */
.tc-need--ink .tc-need__shade{background:linear-gradient(180deg,color-mix(in srgb, var(--c-ink-deep) 58%, transparent) 0%,color-mix(in srgb, var(--c-ink-deep) 74%, transparent) 100%)}
.tc-need--blue .tc-need__shade{background:linear-gradient(180deg,color-mix(in srgb, var(--c-hue-123478) 62%, transparent) 0%,color-mix(in srgb, var(--c-hue-12285a) 78%, transparent) 100%)}
.tc-need--image small{color:var(--c-white)}
.tc-need--image b{color:var(--c-white)}
.tc-need--image .tc-need__amount{color:var(--tc-yellow)}
.tc-need--image small,.tc-need--image b,.tc-need--image .tc-need__amount{text-shadow:0 1px 2px color-mix(in srgb, var(--c-black) 35%, transparent)}
a.tc-need--image:hover .tc-need__img,a.tc-need--image:focus-visible .tc-need__img{transform:scale(1.05)}
.tc-giving-card .tc-lead{margin-bottom:0}
@media(max-width:760px){.vc_row.vc_inner.tc-tiles{gap:12px;margin:32px 0 36px!important}.tc-need{padding:20px 16px}.tc-need--image{min-height:190px}.tc-need__amount{font-size:34px}}

/* Journey timeline: hover/focus/tap/scroll highlights one stop (classes from assets/timeline.js; :hover/:focus work without JS). */
.tc-timeline>.vc_column-inner>.wpb_wrapper::after{content:"";display:block!important;position:absolute;z-index:0;left:0;top:9px;width:var(--tc-tl-x,0px);height:3px;border-radius:3px;background:var(--tc-yellow);transition:width .45s cubic-bezier(.2,.7,.2,1),height .45s cubic-bezier(.2,.7,.2,1);pointer-events:none}
.tc-stop{z-index:1;border-radius:14px;outline:0;transition:opacity .3s ease;-webkit-tap-highlight-color:transparent}
.tc-stop__dot{background:var(--tc-purple);box-shadow:inset 0 0 0 4px var(--tc-yellow),0 0 0 5px var(--tc-purple);transition:transform .3s cubic-bezier(.2,.7,.2,1),background-color .3s ease,box-shadow .3s ease}
.tc-stop__years{transition:transform .3s cubic-bezier(.2,.7,.2,1)}
.tc-stop__head,.tc-stop__line{transition:color .3s ease,opacity .3s ease}
.tc-stop__line{color:color-mix(in srgb, var(--c-white) 88%, transparent);opacity:1}
.tc-stop.is-active .tc-stop__dot,.tc-stop:hover .tc-stop__dot,.tc-stop:focus-visible .tc-stop__dot{background:var(--tc-yellow);transform:scale(1.4);box-shadow:inset 0 0 0 4px var(--tc-yellow),0 0 0 4px var(--tc-purple),0 0 0 9px color-mix(in srgb, var(--c-yellow) 28%, transparent)}
.tc-stop.is-active .tc-stop__years,.tc-stop:hover .tc-stop__years,.tc-stop:focus-visible .tc-stop__years{transform:translateY(-4px)}
.tc-stop.is-active .tc-stop__line,.tc-stop:hover .tc-stop__line,.tc-stop:focus-visible .tc-stop__line{color:var(--c-white)}
.tc-timeline .has-active .tc-stop:not(.is-active),.tc-timeline .wpb_wrapper:not(.tc-tl-js):has(.tc-stop:hover,.tc-stop:focus-visible) .tc-stop:not(:hover):not(:focus-visible){opacity:.72}
.tc-stop:focus-visible{outline:3px solid var(--tc-yellow);outline-offset:10px}
@media(max-width:959px){.tc-timeline>.vc_column-inner>.wpb_wrapper::after{left:9px;top:6px;width:3px;height:var(--tc-tl-y,0px)}}

/* Motion (assets/home-motion.js). Hero is always visible; below-fold reveals are initialized in JS. */
.tc-goal__bar i{transform-origin:left center}
@media(prefers-reduced-motion:reduce){
 a.tc-need,.tc-need__img,.tc-stop,.tc-stop__dot,.tc-stop__years,.tc-stop__head,.tc-stop__line,.tc-timeline>.vc_column-inner>.wpb_wrapper::after{transition:none!important}
 a.tc-need:hover,a.tc-need:focus-visible,a.tc-need--image:hover .tc-need__img{transform:none}
}

/* ---------- TC-WO-4b colour texture: soft gradient + film grain (WPBakery "Coffee texture" on rows) ----------
   Technique after elevenlabs.io/pricing: a blurred colour field with a 256px grey-noise tile blended with overlay,
   shown at 128 CSS px on 2× screens. Ours is CSS gradients (no photo files) + our own seeded noise (brand/build-grain.cjs).
   WPBakery keeps setting the flat background-color underneath; only background-image layers are added. */
.tc-tex{--tc-noise-size:256px;background-image:url(grain/noise-256.webp),var(--tc-a1),var(--tc-a2),var(--tc-a3),var(--tc-a4),var(--tc-g1),var(--tc-g2),var(--tc-g0)!important;background-size:var(--tc-noise-size) var(--tc-noise-size),100% 100%,100% 100%,100% 100%,100% 100%,100% 100%,100% 100%,100% 100%!important;background-repeat:repeat,no-repeat,no-repeat,no-repeat,no-repeat,no-repeat,no-repeat,no-repeat!important;background-position:0 0,0 0,0 0,0 0,0 0,0 0,0 0,0 0!important;background-blend-mode:overlay,normal,normal,normal,normal,normal,normal,normal}
@media(min-resolution:2dppx){.tc-tex{--tc-noise-size:128px}}
/* Aurora (TC-WO-4c, after ElevenLabs' customer cards): soft cloud-like hints of a contrasting hue on each colour,
   e.g. pink + cyan on blue, coral + lavender on purple, peach + navy shadow on orange. Kept light behind text. */
.tc-tex--orange{--tc-g0:linear-gradient(135deg,var(--c-hue-fd6a14) 0%,var(--c-orange) 55%,var(--c-hue-f04a06) 100%);--tc-g1:radial-gradient(60% 80% at 8% 0%,color-mix(in srgb, var(--c-hue-ff9646) 45%, transparent) 0%,color-mix(in srgb, var(--c-hue-ff9646) 25%, transparent) 38%,color-mix(in srgb, var(--c-hue-ff9646) 0%, transparent) 100%);--tc-g2:radial-gradient(55% 75% at 100% 100%,color-mix(in srgb, var(--c-hue-d62e0a) 45%, transparent) 0%,color-mix(in srgb, var(--c-hue-d62e0a) 25%, transparent) 38%,color-mix(in srgb, var(--c-hue-d62e0a) 0%, transparent) 100%);--tc-a1:radial-gradient(55% 60% at 70% -8%,color-mix(in srgb, var(--c-hue-ffcda0) 55%, transparent) 0%,color-mix(in srgb, var(--c-hue-ffcda0) 30%, transparent) 38%,color-mix(in srgb, var(--c-hue-ffcda0) 0%, transparent) 100%);--tc-a2:radial-gradient(40% 55% at 102% 40%,color-mix(in srgb, var(--c-hue-ffaa78) 35%, transparent) 0%,color-mix(in srgb, var(--c-hue-ffaa78) 19%, transparent) 38%,color-mix(in srgb, var(--c-hue-ffaa78) 0%, transparent) 100%);--tc-a3:radial-gradient(55% 70% at 104% 104%,color-mix(in srgb, var(--c-hue-2d1c60) 55%, transparent) 0%,color-mix(in srgb, var(--c-hue-2d1c60) 30%, transparent) 38%,color-mix(in srgb, var(--c-hue-2d1c60) 0%, transparent) 100%);--tc-a4:radial-gradient(35% 45% at -4% 104%,color-mix(in srgb, var(--c-hue-c8288c) 32%, transparent) 0%,color-mix(in srgb, var(--c-hue-c8288c) 18%, transparent) 38%,color-mix(in srgb, var(--c-hue-c8288c) 0%, transparent) 100%)}
.tc-tex--purple{--tc-g0:linear-gradient(135deg,var(--c-hue-8b40f0) 0%,var(--c-purple) 50%,var(--c-hue-7631e2) 100%);--tc-g1:radial-gradient(55% 75% at 6% 0%,color-mix(in srgb, var(--c-hue-aa6eff) 45%, transparent) 0%,color-mix(in srgb, var(--c-hue-aa6eff) 25%, transparent) 38%,color-mix(in srgb, var(--c-hue-aa6eff) 0%, transparent) 100%);--tc-g2:radial-gradient(60% 80% at 100% 100%,color-mix(in srgb, var(--c-hue-542cd6) 45%, transparent) 0%,color-mix(in srgb, var(--c-hue-542cd6) 25%, transparent) 38%,color-mix(in srgb, var(--c-hue-542cd6) 0%, transparent) 100%);--tc-a1:radial-gradient(30% 70% at -6% 96%,color-mix(in srgb, var(--c-hue-ff6050) 55%, transparent) 0%,color-mix(in srgb, var(--c-hue-ff6050) 30%, transparent) 38%,color-mix(in srgb, var(--c-hue-ff6050) 0%, transparent) 100%);--tc-a2:radial-gradient(45% 60% at 98% 10%,color-mix(in srgb, var(--c-hue-f0aae1) 42%, transparent) 0%,color-mix(in srgb, var(--c-hue-f0aae1) 23%, transparent) 38%,color-mix(in srgb, var(--c-hue-f0aae1) 0%, transparent) 100%);--tc-a3:radial-gradient(40% 45% at 60% 104%,color-mix(in srgb, var(--c-blue) 38%, transparent) 0%,color-mix(in srgb, var(--c-blue) 21%, transparent) 38%,color-mix(in srgb, var(--c-blue) 0%, transparent) 100%);--tc-a4:radial-gradient(35% 40% at 30% -6%,color-mix(in srgb, var(--c-hue-ff96c8) 25%, transparent) 0%,color-mix(in srgb, var(--c-hue-ff96c8) 14%, transparent) 38%,color-mix(in srgb, var(--c-hue-ff96c8) 0%, transparent) 100%)}
.tc-tex--blue{--tc-g0:linear-gradient(135deg,var(--c-hue-4490ff) 0%,var(--c-blue) 50%,var(--c-hue-337bfa) 100%);--tc-g1:radial-gradient(55% 75% at 6% 0%,color-mix(in srgb, var(--c-hue-78afff) 45%, transparent) 0%,color-mix(in srgb, var(--c-hue-78afff) 25%, transparent) 38%,color-mix(in srgb, var(--c-hue-78afff) 0%, transparent) 100%);--tc-g2:radial-gradient(60% 80% at 100% 100%,color-mix(in srgb, var(--c-hue-305cec) 45%, transparent) 0%,color-mix(in srgb, var(--c-hue-305cec) 25%, transparent) 38%,color-mix(in srgb, var(--c-hue-305cec) 0%, transparent) 100%);--tc-a1:radial-gradient(45% 50% at 14% -4%,color-mix(in srgb, var(--c-hue-ffc4d2) 68%, transparent) 0%,color-mix(in srgb, var(--c-hue-ffc4d2) 37%, transparent) 38%,color-mix(in srgb, var(--c-hue-ffc4d2) 0%, transparent) 100%);--tc-a2:radial-gradient(40% 45% at 98% 38%,color-mix(in srgb, var(--c-hue-ffcddc) 52%, transparent) 0%,color-mix(in srgb, var(--c-hue-ffcddc) 29%, transparent) 38%,color-mix(in srgb, var(--c-hue-ffcddc) 0%, transparent) 100%);--tc-a3:radial-gradient(50% 55% at -6% 104%,color-mix(in srgb, var(--c-hue-0e286e) 50%, transparent) 0%,color-mix(in srgb, var(--c-hue-0e286e) 28%, transparent) 38%,color-mix(in srgb, var(--c-hue-0e286e) 0%, transparent) 100%);--tc-a4:radial-gradient(40% 45% at 104% 104%,color-mix(in srgb, var(--c-hue-28c8eb) 40%, transparent) 0%,color-mix(in srgb, var(--c-hue-28c8eb) 22%, transparent) 38%,color-mix(in srgb, var(--c-hue-28c8eb) 0%, transparent) 100%)}
.tc-tex--yellow{--tc-g0:linear-gradient(135deg,var(--c-hue-ffc81f) 0%,var(--c-yellow) 50%,var(--c-hue-ffb20b) 100%);--tc-g1:radial-gradient(55% 75% at 6% 0%,color-mix(in srgb, var(--c-hue-ffe06e) 50%, transparent) 0%,color-mix(in srgb, var(--c-hue-ffe06e) 28%, transparent) 38%,color-mix(in srgb, var(--c-hue-ffe06e) 0%, transparent) 100%);--tc-g2:radial-gradient(60% 80% at 100% 100%,color-mix(in srgb, var(--c-hue-ff960a) 40%, transparent) 0%,color-mix(in srgb, var(--c-hue-ff960a) 22%, transparent) 38%,color-mix(in srgb, var(--c-hue-ff960a) 0%, transparent) 100%);--tc-a1:radial-gradient(45% 50% at 100% -4%,color-mix(in srgb, var(--c-hue-ff96aa) 50%, transparent) 0%,color-mix(in srgb, var(--c-hue-ff96aa) 28%, transparent) 38%,color-mix(in srgb, var(--c-hue-ff96aa) 0%, transparent) 100%);--tc-a2:radial-gradient(45% 45% at -4% 104%,color-mix(in srgb, var(--c-orange) 40%, transparent) 0%,color-mix(in srgb, var(--c-orange) 22%, transparent) 38%,color-mix(in srgb, var(--c-orange) 0%, transparent) 100%);--tc-a3:radial-gradient(35% 40% at 60% 104%,color-mix(in srgb, var(--c-hue-ff78a0) 25%, transparent) 0%,color-mix(in srgb, var(--c-hue-ff78a0) 14%, transparent) 38%,color-mix(in srgb, var(--c-hue-ff78a0) 0%, transparent) 100%);--tc-a4:radial-gradient(40% 40% at 30% -6%,color-mix(in srgb, var(--c-hue-fff0be) 45%, transparent) 0%,color-mix(in srgb, var(--c-hue-fff0be) 25%, transparent) 38%,color-mix(in srgb, var(--c-hue-fff0be) 0%, transparent) 100%)}
.tc-tex--ink{--tc-g0:linear-gradient(135deg,var(--c-hue-262623) 0%,var(--c-ink-deep) 55%,var(--c-hue-151513) 100%);--tc-g1:radial-gradient(55% 75% at 6% 0%,color-mix(in srgb, var(--c-hue-464640) 45%, transparent) 0%,color-mix(in srgb, var(--c-hue-464640) 25%, transparent) 38%,color-mix(in srgb, var(--c-hue-464640) 0%, transparent) 100%);--tc-g2:radial-gradient(60% 80% at 100% 100%,color-mix(in srgb, var(--c-black) 30%, transparent) 0%,color-mix(in srgb, var(--c-black) 17%, transparent) 38%,color-mix(in srgb, var(--c-black) 0%, transparent) 100%);--tc-a1:radial-gradient(50% 50% at 100% 0%,color-mix(in srgb, var(--c-purple) 40%, transparent) 0%,color-mix(in srgb, var(--c-purple) 22%, transparent) 38%,color-mix(in srgb, var(--c-purple) 0%, transparent) 100%);--tc-a2:radial-gradient(45% 45% at 0% 100%,color-mix(in srgb, var(--c-blue) 30%, transparent) 0%,color-mix(in srgb, var(--c-blue) 17%, transparent) 38%,color-mix(in srgb, var(--c-blue) 0%, transparent) 100%);--tc-a3:radial-gradient(30% 35% at 60% -6%,color-mix(in srgb, var(--c-orange) 22%, transparent) 0%,color-mix(in srgb, var(--c-orange) 12%, transparent) 38%,color-mix(in srgb, var(--c-orange) 0%, transparent) 100%);--tc-a4:linear-gradient(transparent,transparent)}
/* Need tiles: bigger need name, tighter stack (TC-WO-4b). */
.tc-need{gap:4px}
.tc-need b{font-size:clamp(20px,1.65vw,24px);line-height:1.12;letter-spacing:-.005em}
.tc-need__amount{margin-top:6px}
@media(max-width:760px){.tc-need b{font-size:18px}}
/* Long pill labels on phones (e.g. "What's in your hands?"): text may wrap, the icon stays beside it (was dropping below). */
.tc-button[class*="tc-pill-"] .tc-button__inner{flex-wrap:nowrap!important;text-align:center}
.tc-button[class*="tc-pill-"] .tc-button__icon--right{flex-shrink:0}
/* Orange card call to action (TC-WO-4c): side by side (≥1200px, vc_col-lg) the button sits flush right, mirroring
   the text's left inset; stacked it sits under the text; on phones it is a full-width block like the giving pills. */
.tc-card-orange>.wpb_column:last-child .wpb_wrapper{text-align:right}
.tc-card-orange>.wpb_column:last-child .tc-button{margin-right:0!important;margin-bottom:0}
@media(max-width:1199px){
 .tc-card-orange>.wpb_column:last-child .wpb_wrapper{text-align:left}
 .tc-card-orange>.wpb_column:last-child .tc-button{margin-top:22px}
}
@media(max-width:767px){.tc-card-orange>.wpb_column:last-child .tc-button{display:flex!important;width:100%}}

/* ---------- TC-WO-4d menu hover: small aurora + grain (same family as Coffee texture) ----------
   A texture layer fades in behind the label. Outline pills: orange with a yellow glint and a magenta hint.
   Give: deep blue (white text ≈4.6:1) with cyan/purple hints, and its border turns blue to match (was an orange
   border around an ink fill). Venmo stays a plain link. */
body .tc-nav__list > .tc-nav__item:not(.tc-nav__item--plain) > a{position:relative;isolation:isolate;overflow:hidden}
body .tc-nav__list > .tc-nav__item:not(.tc-nav__item--plain) > a::after{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;opacity:0;transition:opacity .25s ease;pointer-events:none;
 background-image:url(grain/noise-256.webp),var(--tc-n1),var(--tc-n2),var(--tc-n0);background-size:128px 128px,100% 100%,100% 100%,100% 100%;background-repeat:repeat,no-repeat,no-repeat,no-repeat;background-blend-mode:overlay,normal,normal,normal;
 --tc-n0:linear-gradient(120deg,var(--c-hue-ff7a2a) 0%,var(--c-orange) 48%,var(--c-hue-e9480a) 100%);--tc-n1:radial-gradient(60% 90% at 12% 0%,color-mix(in srgb, var(--c-yellow) 50%, transparent) 0%,color-mix(in srgb, var(--c-yellow) 0%, transparent) 70%);--tc-n2:radial-gradient(55% 90% at 100% 100%,color-mix(in srgb, var(--c-hue-c42896) 32%, transparent) 0%,color-mix(in srgb, var(--c-hue-c42896) 0%, transparent) 70%)}
body .tc-nav__list > .tc-nav__item:last-child:not(.tc-nav__item--plain) > a::after{--tc-n0:linear-gradient(120deg,var(--c-hue-3f8bff) 0%,var(--c-hue-2f6fe6) 48%,var(--c-hue-2558cc) 100%);--tc-n1:radial-gradient(55% 90% at 10% 0%,color-mix(in srgb, var(--c-hue-50e1d2) 32%, transparent) 0%,color-mix(in srgb, var(--c-hue-50e1d2) 0%, transparent) 70%);--tc-n2:radial-gradient(60% 95% at 100% 100%,color-mix(in srgb, var(--c-purple) 50%, transparent) 0%,color-mix(in srgb, var(--c-purple) 0%, transparent) 70%)}
body .tc-nav__list > .tc-nav__item:not(.tc-nav__item--plain) > a:is(:hover,:focus-visible)::after{opacity:1}
body .tc-nav__list > .tc-nav__item:not(.tc-nav__item--plain) > a:is(:hover,:focus-visible){color:var(--c-white)!important}
body .tc-nav__list > .tc-nav__item:last-child > a:is(:hover,:focus-visible){background:transparent!important}
body .tc-nav__list > .tc-nav__item:last-child:has(> a:is(:hover,:focus-visible)){border-color:var(--c-hue-2f6fe6)!important;background:var(--c-hue-2f6fe6);transition:border-color .25s ease,background-color .25s ease}
body .tc-nav__list > .tc-nav__item:last-child{transition:border-color .25s ease,background-color .25s ease}
@media(prefers-reduced-motion:reduce){body .tc-nav__list > .tc-nav__item > a::after,body .tc-nav__list > .tc-nav__item:last-child{transition:none!important}}

/* ---------- TC-WO-4e button hovers: every pill goes from its colour to that colour's aurora (no more → black) ----------
   Same layer as the menu: a texture (gradient + hints + film grain) fades in behind the label. Audit and contrast
   notes: docs/work/TC-WO-4/button-audit.md.
   orange → orange aurora, white text · ink → ink aurora (purple/blue hints), white text
   ink outline → fills with the ink aurora, text turns white
   white / white outline → "pearl" aurora (white with a faint peach + lavender haze); text deepens one shade
   (orange var(--c-hue-c43f08), blue var(--c-hue-2563d8), ink) so it keeps contrast on the haze. */
.tc-button[class*="tc-pill-"]{position:relative;isolation:isolate;overflow:hidden}
.tc-button[class*="tc-pill-"]::after{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;opacity:0;transition:opacity .25s ease;pointer-events:none;
 background-image:url(grain/noise-256.webp),var(--tc-n1),var(--tc-n2),var(--tc-n0);background-size:128px 128px,100% 100%,100% 100%,100% 100%;background-repeat:repeat,no-repeat,no-repeat,no-repeat;background-blend-mode:overlay,normal,normal,normal;
 --tc-n0:linear-gradient(120deg,var(--c-hue-ff7a2a) 0%,var(--c-orange) 48%,var(--c-hue-e9480a) 100%);--tc-n1:radial-gradient(60% 90% at 12% 0%,color-mix(in srgb, var(--c-yellow) 50%, transparent) 0%,color-mix(in srgb, var(--c-yellow) 0%, transparent) 70%);--tc-n2:radial-gradient(55% 90% at 100% 100%,color-mix(in srgb, var(--c-hue-c42896) 32%, transparent) 0%,color-mix(in srgb, var(--c-hue-c42896) 0%, transparent) 70%)}
.tc-button.tc-pill-ink::after,.tc-button.tc-pill-line::after{--tc-n0:linear-gradient(120deg,var(--c-hue-33332f) 0%,var(--c-ink-deep) 50%,var(--c-hue-121211) 100%);--tc-n1:radial-gradient(55% 90% at 10% 0%,color-mix(in srgb, var(--c-blue) 32%, transparent) 0%,color-mix(in srgb, var(--c-blue) 0%, transparent) 70%);--tc-n2:radial-gradient(60% 95% at 100% 100%,color-mix(in srgb, var(--c-purple) 50%, transparent) 0%,color-mix(in srgb, var(--c-purple) 0%, transparent) 70%)}
.tc-button.tc-pill-white::after,.tc-button.tc-pill-line-white::after{--tc-n0:linear-gradient(120deg,var(--c-white) 0%,var(--c-hue-fbf8f6) 55%,var(--c-hue-f3f1fb) 100%);--tc-n1:radial-gradient(60% 95% at 8% 0%,color-mix(in srgb, var(--c-hue-ffc4a0) 50%, transparent) 0%,color-mix(in srgb, var(--c-hue-ffc4a0) 0%, transparent) 70%);--tc-n2:radial-gradient(60% 95% at 100% 100%,color-mix(in srgb, var(--c-hue-a0afff) 45%, transparent) 0%,color-mix(in srgb, var(--c-hue-a0afff) 0%, transparent) 70%)}
.tc-button[class*="tc-pill-"]:is(:hover,:focus-visible)::after{opacity:1}
.tc-button.tc-pill-line:is(:hover,:focus-visible),.tc-button.tc-pill-ink:is(:hover,:focus-visible),.tc-button.tc-pill-orange:is(:hover,:focus-visible){color:var(--c-white)!important}
.tc-button.tc-pill-white:is(:hover,:focus-visible){color:var(--c-hue-2563d8)!important}
.tc-card-orange .tc-button.tc-pill-white:is(:hover,:focus-visible){color:var(--c-hue-c43f08)!important}
.tc-button.tc-pill-line-white:is(:hover,:focus-visible){color:var(--tc-ink)!important}
.tc-button[class*="tc-pill-"]:focus-visible{outline:3px solid currentColor;outline-offset:3px}
@media(prefers-reduced-motion:reduce){.tc-button[class*="tc-pill-"]::after{transition:none!important}}

/* TC-WO-4f: optical centring of pill labels (measured by docs/work/TC-WO-4/pill-centre.cjs). Elza's ascent is much
   larger than its descent, so uppercase caps sat 2.4px above the pill centre and the icons 1.8px. The label row
   moves down .14em (caps centred); icons move back up .035em so they stay centred with the caps. The lowercase
   email pill centres its x-height/cap midpoint instead. Transform only: pill size and layout are unchanged. */
.tc-button[class*="tc-pill-"] .tc-button__inner{transform:translateY(.14em)}
.tc-button[class*="tc-pill-"] :is(.tc-button__icon--right,.tc-button__icon--left){transform:translateY(-.035em)}
.tc-button[href^="mailto:"][class*="tc-pill-"] .tc-button__inner{transform:translateY(.092em)}

/* Customizer Additional CSS (post 86) still in use: .tarantino-padding helpers on pages 2, 1682, 1814, 1835.
   Its header rules are now chrome.css. */
.tarantino-padding{padding:65px}
@media only screen and (min-device-width:768px) and (max-device-width:1024px) and (orientation:portrait) and (-webkit-min-device-pixel-ratio:1){.tarantino-padding{padding:35px 20px}}
@media only screen and (max-width:600px){.tarantino-padding{padding:35px 20px}.tarantino-padding-2{padding:35px 15px}}
/* TC-WO-13b: home Israel row (#why) is .tarantino-padding-2, which has no padding above 600px, so its photo/text sat on
   the yellow hands row. Bottom only, matching .tarantino-padding (65px; 35px tablet portrait; phones already 35px). */
@media only screen and (min-width:601px){.home #why.tarantino-padding-2{padding-bottom:65px}}
@media only screen and (min-device-width:768px) and (max-device-width:1024px) and (orientation:portrait) and (-webkit-min-device-pixel-ratio:1){.home #why.tarantino-padding-2{padding-bottom:35px}}
