/* Heartswill site chrome: one universal header (mega menu + phone sheet) and footer for every page. Uses each page's colour variables. */
.hwh{display:block;padding:0;position:sticky;top:0;z-index:60;background:color-mix(in srgb,var(--paper,#fbf7f1) 86%,transparent);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid var(--line,#f0e6e8);font-family:var(--body,system-ui)}
.hwh-bar{width:min(1180px,100% - 32px);margin:0 auto;display:flex;align-items:center;gap:4px;min-height:68px;position:relative}
.hwh-logo{display:flex;align-items:center;flex:none;margin-right:12px}.hwh-logo img{height:34px;width:auto;display:block;transition:transform .3s cubic-bezier(.2,.8,.2,1)}.hwh-logo:hover img{transform:scale(1.04)}
.hwh-nav{display:flex;align-items:center;justify-content:center;gap:10px;flex:1;min-width:0}
.hwh-nav>a,.hwh-g>button{font:600 .9rem var(--body,system-ui);color:var(--ink,#1f1c22);text-decoration:none;background:none;border:0;padding:9px 14px;border-radius:10px;cursor:pointer;display:inline-flex;align-items:center;gap:6px;white-space:nowrap;position:relative}
.hwh-nav>a::after,.hwh-g>button::after{content:"";position:absolute;left:12px;right:12px;bottom:4px;height:2px;border-radius:2px;background:var(--rose,#c00e29);transform:scaleX(0);transition:transform .25s cubic-bezier(.2,.8,.2,1)}
.hwh-nav>a:hover,.hwh-g>button:hover,.hwh-g.open>button{color:var(--rose,#c00e29)}
.hwh-nav>a:hover::after,.hwh-g.open>button::after,.hwh-nav>a[aria-current="page"]::after,.hwh-g.on>button::after{transform:scaleX(1)}
.hwh-nav>a[aria-current="page"],.hwh-g.on>button{color:var(--rose,#c00e29)}
.hwh-g{position:static}
.hwh .cv{width:12px;height:12px;transition:transform .25s}.hwh-g.open .cv{transform:rotate(180deg)}
.hwh-mega{position:absolute;top:calc(100% - 4px);left:50%;width:min(860px,100vw - 32px);background:var(--card,#fff);border:1px solid var(--line,#f0e6e8);border-radius:22px;box-shadow:0 30px 70px -30px rgba(80,10,20,.38);padding:14px;display:grid;grid-template-columns:1fr 250px;gap:14px;opacity:0;visibility:hidden;transform:translate(-50%,-8px) scale(.985);transform-origin:top center;transition:opacity .2s,transform .28s cubic-bezier(.2,.8,.2,1),visibility .2s}
.hwh-mega::before{content:"";position:absolute;left:0;right:0;top:-14px;height:14px}
.hwh-g.open .hwh-mega{opacity:1;visibility:visible;transform:translate(-50%,0) scale(1)}
.hwh-items{display:grid;grid-template-columns:1fr 1fr;gap:4px;align-content:start}
.hwh-items a{display:grid;grid-template-columns:40px 1fr;gap:2px 12px;align-items:center;padding:11px 12px;border-radius:14px;text-decoration:none;color:var(--ink,#1f1c22);opacity:0;transform:translateY(6px);transition:background .15s,opacity .3s,transform .35s cubic-bezier(.2,.8,.2,1)}
.hwh-g.open .hwh-items a{opacity:1;transform:none;transition-delay:calc(var(--i) * 40ms + 40ms),calc(var(--i) * 40ms + 40ms),0s}
.hwh-items a:hover,.hwh-items a:focus-visible{background:var(--blush,#fdf1f2);outline:none}
.hwh-items a[aria-current="page"] b{color:var(--rose,#c00e29)}
.hwh-ic{grid-row:span 2;width:40px;height:40px;border-radius:12px;background:var(--blush,#fdf1f2);display:grid;place-items:center;color:var(--rose,#c00e29);transition:transform .3s cubic-bezier(.3,1.6,.5,1),background .2s,color .2s}
.hwh-ic svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.hwh-items a:hover .hwh-ic{transform:translateY(-2px) rotate(-6deg) scale(1.06);background:var(--rose,#c00e29);color:#fff}
.hwh-items b{font:600 .93rem var(--body,system-ui);display:flex;align-items:center;gap:6px}.hwh-items small{font-size:.8rem;color:var(--mute,#57525c);line-height:1.35}
.hwh .ar{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;opacity:0;transform:translateX(-4px);transition:opacity .2s,transform .25s}
.hwh-items a:hover .ar,.hwh-spot:hover .ar{opacity:1;transform:none}
.hwh-spot{display:flex;flex-direction:column;gap:6px;padding:16px;border-radius:18px;text-decoration:none;color:var(--ink,#1f1c22);background:linear-gradient(160deg,var(--blush,#fdf1f2),color-mix(in srgb,var(--blush,#fdf1f2) 40%,var(--card,#fff)));border:1px solid var(--line,#f0e6e8);overflow:hidden}
.hwh-spot .ey{font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--rose,#c00e29);font-weight:700}
.hwh-spot .ln{font:500 1.02rem/1.35 var(--display,inherit)}
.hwh-spot strong{margin-top:auto;color:var(--rose,#c00e29);font-weight:600;font-size:.88rem;display:flex;align-items:center;gap:6px}.hwh-spot strong .ar{opacity:.6;transform:none}
/* spotlight illustrations: only animate while their panel is open */
.hwa{width:100%;height:auto;max-height:118px;margin:-4px 0 4px;overflow:visible}
.hwa *{fill:none;stroke:var(--rose,#c00e29);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transform-box:fill-box;transform-origin:center}
.hwa .a-glow{fill:var(--rose,#c00e29);stroke:none;opacity:.08}
.hwa .a-card,.hwa .a-blk rect,.hwa .a-map{fill:var(--card,#fff)}
.hwa .a-ln,.hwa .a-blk path,.hwa .a-map2{stroke:color-mix(in srgb,var(--rose,#c00e29) 35%,transparent)}
.hwa .a-heart{fill:var(--rose,#c00e29);stroke:none}
.hwa .a-path{stroke-dasharray:4 6;stroke-opacity:.5}
.hwa .a-tick,.hwa .a-seal circle{fill:#22a35a;stroke:none}.hwa .a-chk,.hwa .a-seal path{stroke:#fff}
.hwa .a-leaf{fill:color-mix(in srgb,#22a35a 18%,transparent);stroke:#22a35a}.hwa .a-stem,.hwa .a-ground{stroke:#22a35a}
.hwa .a-sp{fill:#ffb36b;stroke:none}
.hwa .a-pin path:first-child{fill:var(--card,#fff)}.hwa .a-pin .a-heart{stroke:none}
.hwa .a-rip{stroke-opacity:.5}
.hwa .a-scan{fill:var(--rose,#c00e29);stroke:none;opacity:.18}
.hwa *{animation-play-state:paused}
.hwh-g.open .hwa *{animation-play-state:running}
.hwa .a-heart{animation:hwa-beat 1.6s ease-in-out infinite}
[data-art=order] .a-bag{animation:hwa-bob 2.4s ease-in-out infinite}
[data-art=order] .a-path{animation:hwa-dash 1.2s linear infinite}
[data-art=order] .a-tick,[data-art=order] .a-chk{animation:hwa-pop 2.4s cubic-bezier(.3,1.6,.5,1) infinite}
[data-art=grow] .a-leaf.l1{animation:hwa-sway 3s ease-in-out infinite;transform-origin:right bottom}
[data-art=grow] .a-leaf.l2{animation:hwa-sway 3s ease-in-out -1.5s infinite;transform-origin:left bottom}
[data-art=grow] .a-sp{animation:hwa-twinkle 2s ease-in-out infinite}[data-art=grow] .s2{animation-delay:-.7s}[data-art=grow] .s3{animation-delay:-1.3s}
[data-art=chain] .a-scan{animation:hwa-scan 2.6s cubic-bezier(.6,0,.4,1) infinite}
[data-art=chain] .a-blk{animation:hwa-lit 2.6s ease-in-out infinite}[data-art=chain] .b2{animation-delay:.5s}[data-art=chain] .b3{animation-delay:1s}
[data-art=chain] .a-seal{animation:hwa-pop 2.6s cubic-bezier(.3,1.6,.5,1) 1.2s infinite}
[data-art=pin] .a-pin{animation:hwa-drop 2.4s cubic-bezier(.3,1.4,.5,1) infinite}
[data-art=pin] .a-rip{animation:hwa-rip 2.4s ease-out infinite}[data-art=pin] .r2{animation-delay:1.2s}
@keyframes hwa-beat{0%,100%{transform:scale(1)}15%{transform:scale(1.18)}30%{transform:scale(.96)}45%{transform:scale(1.08)}}
@keyframes hwa-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
@keyframes hwa-dash{to{stroke-dashoffset:-20}}
@keyframes hwa-pop{0%,40%{transform:scale(.4);opacity:0}55%{transform:scale(1.12);opacity:1}70%,100%{transform:scale(1);opacity:1}}
@keyframes hwa-sway{0%,100%{transform:rotate(0)}50%{transform:rotate(-7deg)}}
@keyframes hwa-twinkle{0%,100%{opacity:.2;transform:scale(.6)}50%{opacity:1;transform:scale(1.2)}}
@keyframes hwa-scan{0%{transform:translateX(0);opacity:0}10%{opacity:.25}90%{opacity:.25}100%{transform:translateX(146px);opacity:0}}
@keyframes hwa-lit{0%,100%{opacity:.55}30%{opacity:1}}
@keyframes hwa-drop{0%{transform:translateY(-10px)}30%{transform:translateY(0)}100%{transform:translateY(0)}}
@keyframes hwa-rip{0%{transform:scale(.4);opacity:.8}100%{transform:scale(2.2);opacity:0}}
.hwh-sp{flex:1}
.hwh-track{display:inline-flex;align-items:center;gap:7px;height:40px;padding:0 14px 0 11px;border-radius:999px;border:1px solid var(--line,#f0e6e8);background:var(--card,#fff);color:var(--ink,#1f1c22);text-decoration:none;font:600 .86rem var(--body,system-ui);flex:none;margin-right:6px}
.hwh-track svg{width:17px;height:17px;fill:var(--rose,#c00e29);animation:hwa-beat 2.4s ease-in-out infinite}
.hwh-track:hover{border-color:var(--rose,#c00e29);color:var(--rose,#c00e29)}
.hwh .tt{width:40px;height:40px;border-radius:50%;border:1px solid var(--line,#f0e6e8);background:var(--card,#fff);color:var(--ink,#1f1c22);display:grid;place-items:center;cursor:pointer;padding:0;flex:none}
.hwh .tt svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:transform .5s cubic-bezier(.2,.8,.2,1)}.hwh .tt:hover svg{transform:rotate(-20deg)}
.hwh .tt .sun{display:none}:root[data-theme="dark"] .hwh .tt .moon{display:none}:root[data-theme="dark"] .hwh .tt .sun{display:block;color:#ffb36b}
.hwh-cta{margin-left:8px;flex:none}
.hwh-burger{display:none;width:42px;height:42px;border-radius:12px;border:1px solid var(--line,#f0e6e8);background:var(--card,#fff);cursor:pointer;padding:0;flex:none;margin-left:6px;position:relative}
.hwh-burger span{position:absolute;left:11px;right:11px;height:2px;border-radius:2px;background:var(--ink,#1f1c22);transition:transform .3s cubic-bezier(.2,.8,.2,1),opacity .2s}
.hwh-burger span:nth-child(1){top:14px}.hwh-burger span:nth-child(2){top:20px}.hwh-burger span:nth-child(3){top:26px}
.hwh-burger[aria-expanded="true"] span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.hwh-burger[aria-expanded="true"] span:nth-child(2){opacity:0;transform:scaleX(.3)}
.hwh-burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
/* phone sheet */
.hwh-m{z-index:59;font-family:var(--body,system-ui);position:fixed;left:0;right:0;top:var(--hwh-h,68px);bottom:0;background:var(--paper,#fbf7f1);overflow-y:auto;overscroll-behavior:contain;border-top:1px solid var(--line,#f0e6e8);animation:hwm-in .3s cubic-bezier(.2,.8,.2,1)}
.hwh-m[hidden]{display:none}
.hwh-m-in{width:min(560px,100% - 28px);margin:0 auto;padding:14px 0 calc(28px + env(safe-area-inset-bottom))}
@keyframes hwm-in{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:none}}
.hwh-quick{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:10px}
.hwh-quick a{display:flex;flex-direction:column;align-items:center;gap:8px;padding:14px 6px;border-radius:16px;background:var(--card,#fff);border:1px solid var(--line,#f0e6e8);text-decoration:none;color:var(--ink,#1f1c22);font-weight:600;font-size:.82rem;text-align:center;animation:hwm-up .4s cubic-bezier(.2,.8,.2,1) both}
.hwh-quick a:nth-child(2){animation-delay:.04s}.hwh-quick a:nth-child(3){animation-delay:.08s}
.hwh-quick a[aria-current="page"]{border-color:var(--rose,#c00e29);color:var(--rose,#c00e29)}
.hwh-quick .hwh-ic{grid-row:auto}
.hwh-acc{border-bottom:1px solid var(--line,#f0e6e8);animation:hwm-up .4s cubic-bezier(.2,.8,.2,1) both}
.hwh-acc:nth-of-type(1){animation-delay:.1s}.hwh-acc:nth-of-type(2){animation-delay:.14s}.hwh-acc:nth-of-type(3){animation-delay:.18s}.hwh-acc:nth-of-type(4){animation-delay:.22s}
.hwh-acc summary{list-style:none;display:flex;justify-content:space-between;align-items:center;padding:18px 6px;font:600 1.05rem var(--body,system-ui);color:var(--ink,#1f1c22);cursor:pointer}
.hwh-acc summary::-webkit-details-marker{display:none}
.hwh-acc summary .cv{width:16px;height:16px}.hwh-acc[open] summary .cv{transform:rotate(180deg)}.hwh-acc[open] summary{color:var(--rose,#c00e29)}
.hwh-acc-b{display:grid;gap:2px;padding:0 0 12px}
.hwh-acc-b a{display:grid;grid-template-columns:40px 1fr;gap:12px;align-items:center;padding:10px 6px;border-radius:14px;text-decoration:none;color:var(--ink,#1f1c22)}
.hwh-acc[open] .hwh-acc-b a{animation:hwm-up .35s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i) * 45ms)}
.hwh-acc-b a:active,.hwh-acc-b a:hover{background:var(--blush,#fdf1f2)}
.hwh-acc-b a[aria-current="page"] b{color:var(--rose,#c00e29)}
.hwh-acc-b b{display:block;font-weight:600;font-size:.95rem}.hwh-acc-b small{display:block;color:var(--mute,#57525c);font-size:.82rem;margin-top:1px}
.hwh-m-cta{margin-top:20px;width:100%;justify-content:center;animation:hwm-up .4s cubic-bezier(.2,.8,.2,1) .26s both}
@keyframes hwm-up{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media (max-width:1100px){.hwh-track{width:40px;padding:0;justify-content:center}.hwh-track span{display:none}}
@media (max-width:860px){.hwh-nav{display:none}.hwh-burger{display:block}.hwh-cta{display:none}}
@media (max-width:480px){.hwh-logo img{height:30px}.hwh-bar{min-height:62px}.hwh-track{width:40px;padding:0;justify-content:center}.hwh-track span{display:none}}
@media (prefers-reduced-motion:reduce){.hwh *,.hwh *::after,.hwh-m,.hwh-m *{animation:none!important;transition:none!important}.hwh-items a{opacity:1;transform:none}}
/* footer */
.hwf{border-top:1px solid var(--line,#f0e6e8);margin-top:40px;padding:44px 0 28px;font-size:.92rem;color:var(--mute,#57525c)}
.hwf-in{width:min(1180px,100% - 32px);margin:0 auto;display:grid;grid-template-columns:1.4fr repeat(4,1fr);gap:28px}
.hwf-brand img{height:32px;width:auto;display:block;margin-bottom:12px}.hwf-brand p{margin:0;max-width:30ch;line-height:1.55}
.hwf h4{font:600 .72rem var(--body,system-ui);letter-spacing:.16em;text-transform:uppercase;color:var(--ink,#1f1c22);margin:4px 0 10px}
.hwf ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}.hwf a{color:var(--mute,#57525c);text-decoration:none}.hwf a:hover{color:var(--rose,#c00e29)}
.hwf-base{width:min(1180px,100% - 32px);margin:28px auto 0;padding-top:18px;border-top:1px solid var(--line,#f0e6e8);display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:.84rem}
@media (max-width:860px){.hwf-in{grid-template-columns:1fr 1fr}.hwf-brand{grid-column:1/-1}}
@media (max-width:420px){.hwf-in{gap:22px}}
@media (prefers-reduced-motion:reduce){.hwh-mega{transition:none}}
/* layout safety: grid sections never grow wider than the screen */
:where(main section){grid-template-columns:minmax(0,1fr)}
:where(main section)>*{min-width:0}
.flow{min-width:0}.wb>*{min-width:0}
@media (max-width:900px){.wb{grid-template-columns:minmax(0,1fr)!important}}
/* animated flow diagrams: vertical list on phones */
.flow-m{display:none;gap:0;max-width:360px;margin:0 auto;width:100%;text-align:left}
.flow-m .fm{display:grid;grid-template-columns:48px 1fr;gap:14px;align-items:center;background:var(--card,#fff);border:1px solid var(--line,#f0e6e8);border-radius:18px;padding:14px 16px;box-shadow:var(--shadow)}
.flow-m .fm i{width:44px;height:44px;border-radius:50%;display:grid;place-items:center}
.flow-m .fm svg{width:22px;height:22px;fill:none;stroke:var(--rose,#c00e29);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.flow-m .fm b{display:block;font:500 1.05rem var(--display,inherit)}.flow-m .fm span{font-size:.88rem;color:var(--mute,#57525c)}
.flow-m .ar{height:30px;width:2px;margin:0 auto;background:repeating-linear-gradient(var(--rose,#c00e29) 0 5px,transparent 5px 10px);position:relative}
.flow-m .ar::after{content:"";position:absolute;left:50%;bottom:0;width:12px;height:12px;margin-left:-6px;border-radius:50%;background:#e74040;animation:hwfm 1.6s ease-in-out infinite}
.flow-m .cap{margin-top:14px;text-align:center;font-size:.86rem;color:var(--leaf,#22a35a);font-weight:600}
@keyframes hwfm{0%{transform:translateY(-24px);opacity:0}30%{opacity:1}100%{transform:translateY(0);opacity:0}}
@media (max-width:640px){.flow>svg{display:none}.flow-m{display:grid}}
@media (prefers-reduced-motion:reduce){.flow-m .ar::after{animation:none;opacity:1}}
.wb-stage{grid-template-columns:minmax(0,1fr)}.wb-frame{justify-self:center}
/* home timeline: vertical with a travelling heart on phones instead of disappearing */
@media (max-width:640px){
  html .track-labels{display:grid!important;grid-template-columns:1fr;gap:18px;text-align:left;position:relative;padding:4px 0 4px 40px;max-width:380px;margin:0 auto;width:100%}
  html .track-labels::before{content:"";position:absolute;left:13px;top:10px;bottom:10px;width:2px;border-radius:2px;background:linear-gradient(var(--blush,#f3d9dd),var(--rose,#c00e29),var(--blush,#f3d9dd))}
  html .track-labels span{position:relative;background:var(--card,#fff);border:1px solid var(--line,#f0e6e8);border-radius:16px;padding:12px 14px;font-size:.88rem}
  html .track-labels span::before{content:"";position:absolute;left:-34px;top:50%;width:14px;height:14px;margin-top:-7px;border-radius:50%;background:var(--card,#fff);border:2px solid var(--rose,#c00e29);animation:hwtl-dot 8s ease-in-out infinite}
  html .track-labels span:nth-child(2)::before{animation-delay:2s}html .track-labels span:nth-child(3)::before{animation-delay:4s}html .track-labels span:nth-child(4)::before{animation-delay:6s}
  html .track-labels::after{content:"";position:absolute;left:4px;top:0;width:20px;height:20px;background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 20s-7-4.4-9.3-8.6A5 5 0 0 1 12 6.3a5 5 0 0 1 9.3 5.1C19 15.6 12 20 12 20z' fill='%23c00e29'/%3E%3C/svg%3E");filter:drop-shadow(0 4px 6px rgba(192,14,41,.35));animation:hwtl-beat 8s cubic-bezier(.6,0,.4,1) infinite}
}
@keyframes hwtl-dot{0%,100%{background:var(--card,#fff);transform:scale(1)}8%,20%{background:var(--rose,#c00e29);transform:scale(1.25)}}
@keyframes hwtl-beat{0%{top:0}25%{top:calc(25% + 6px)}50%{top:calc(50% + 4px)}75%{top:calc(75% + 2px)}100%{top:calc(100% - 20px)}}
@media (prefers-reduced-motion:reduce){html .track-labels::after,html .track-labels span::before{animation:none}}

/* grouped mega panels (Solutions) */
.hwh-mega.wide{width:min(980px,100vw - 32px);grid-template-columns:1fr 250px}
.hwh-mega.wide .hwh-items{grid-template-columns:1fr 1fr;grid-auto-flow:column;grid-template-rows:auto repeat(4,auto)}
.hwh-sub{display:block;font:700 .68rem var(--body,system-ui);letter-spacing:.16em;text-transform:uppercase;color:var(--mute,#57525c);padding:8px 12px 4px}
.hwh-acc-b .hwh-sub{padding:10px 6px 2px}
.hwh-mega:not(.wide) .hwh-items a{min-height:0}
/* laptop audit: balanced grids, no stranded cards, nothing spilling into the next card */
html .csr-causes{grid-template-columns:repeat(3,minmax(0,1fr))}
html .csr-causes>*,html .nsteps>*,html .trust-grid>*{min-width:0}
html .pcard h2{font-size:clamp(1.6rem,2.1vw,2.05rem);line-height:1.08;overflow-wrap:break-word}
html .pcard .pill{flex:none;white-space:nowrap}
html .pcard .note{overflow-wrap:break-word}
html .nsteps{grid-template-columns:repeat(3,minmax(0,1fr))}
html .trust-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:1180px){html .trust-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:980px){html .csr-causes,html .nsteps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){html .csr-causes,html .nsteps,html .trust-grid{grid-template-columns:minmax(0,1fr)}}