/* Onion symptoms section (home page) */
html body{overflow-x:clip!important;overflow-y:visible!important}
.onion-sec{position:relative;box-sizing:content-box;height:440vh;height:440svh;padding-bottom:clamp(20px,3vw,40px)}
.onion-sec::after{content:"";position:absolute;left:0;right:0;bottom:0;height:clamp(160px,22vw,300px);background:linear-gradient(180deg,rgba(197,210,248,0) 0%,rgba(197,210,248,.12) 25%,rgba(197,210,248,.35) 50%,rgba(197,210,248,.7) 75%,#c5d2f8 100%);pointer-events:none;z-index:0}
.onion-stage{z-index:1}
.onion-stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;display:flex;align-items:center}
.onion-inner{width:100%;display:flex;flex-direction:column;align-items:center;text-align:center;padding-top:72px}
.onion-head .section-title{margin:0 auto var(--s-4);max-width:none;font-size:clamp(34px,4.4vw,58px);line-height:1.05}
.onion-sub{font-family:var(--font-mono);font-size:14px;line-height:1.6;color:var(--fg-muted);margin:0}
.onion-titles{display:grid;margin:clamp(36px,7vh,72px) 0 clamp(28px,5vh,52px)}
.onion-lt{grid-area:1/1}
.onion-lt h3{font-family:var(--font-mono);font-weight:400;font-size:12px;letter-spacing:var(--tracking-caps);text-transform:uppercase;color:var(--wbh-forget-me-nots);margin:0 0 12px}
.onion-lt p{font-family:var(--font-serif);font-style:italic;font-size:clamp(18px,1.8vw,22px);line-height:1.3;color:var(--fg);margin:0}
.onion-wrap{position:relative;height:clamp(220px,44vh,440px);aspect-ratio:440/470}
.onion-svg{position:absolute;inset:0;width:100%;height:100%;display:block;overflow:visible}
.onion-svg path{fill:none;stroke:var(--wbh-forget-me-nots);stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.onion-svg .o-fill{fill:var(--wbh-floral-white);fill-opacity:.98;stroke:none}
.onion-svg .o-core{fill:rgba(197,210,248,.75);stroke:none}
.onion-svg .o-line{stroke-width:2.2}
.onion-svg .o-vein{stroke-width:1.3;opacity:.42}
.onion-svg .o-seam{stroke-width:1.8}
.onion-labels{position:absolute;inset:0;z-index:2}
.onion-set{position:absolute;inset:0;pointer-events:none}
.onion-set.is-live{pointer-events:auto}
.onion-label{--tx:0;--rot:0deg;position:absolute;appearance:none;background:none;border:0;padding:6px 4px;font-family:var(--font-display);font-size:clamp(20px,1.9vw,26px);line-height:1.1;color:var(--wbh-forget-me-nots);cursor:pointer;white-space:nowrap;transform:translate(var(--tx),-50%) rotate(var(--rot))}
.onion-label.is-left{--tx:-100%}.onion-label.is-center{--tx:-50%}.onion-label.is-center:not(.is-left) .onion-tip{left:calc(50% - 120px);width:240px;top:auto;bottom:calc(100% + 4px)}
.onion-word{border-bottom:1px dashed rgba(41,56,89,.45);padding-bottom:1px}
.onion-tip{position:absolute;top:calc(100% + 4px);width:max-content;max-width:240px;white-space:normal;text-align:left;background:var(--wbh-floral-white);border:1px solid rgba(41,56,89,.22);border-radius:12px;padding:10px 14px;font-family:var(--font-mono);font-size:14px;line-height:1.55;color:var(--wbh-forget-me-nots);box-shadow:0 6px 18px rgba(41,56,89,.08);opacity:0;transform:translateY(-4px);pointer-events:none;transition:opacity .2s ease,transform .2s ease}
.onion-label.is-left .onion-tip{right:0}
.onion-label:not(.is-left) .onion-tip{left:0}
.onion-label.is-low .onion-tip{top:auto;bottom:calc(100% + 4px)}
.onion-label.is-open,.onion-label:focus-visible{z-index:4}
.onion-label.is-open .onion-tip,.onion-label:focus-visible .onion-tip{opacity:1;transform:none}
@media (hover:hover){.onion-label:hover{z-index:4}.onion-label:hover .onion-tip{opacity:1;transform:none}}
.onion-label:focus-visible{outline:2px solid var(--wbh-forget-me-nots);outline-offset:2px;border-radius:6px}
.onion-def{display:none}
@media (max-width:900px){
.onion-inner{padding-top:60px}
.onion-head .section-title{font-size:clamp(30px,7vw,40px)}
.onion-wrap{height:auto;aspect-ratio:auto;width:100%;display:flex;flex-direction:column;align-items:center}
.onion-svg{position:relative;inset:auto;width:min(62vw,32svh);height:auto;aspect-ratio:440/470}
.onion-labels{position:relative;inset:auto;display:grid;width:100%;max-width:380px;margin-top:6px}
.onion-set{position:relative;inset:auto;grid-area:1/1;display:flex;flex-wrap:wrap;justify-content:center;align-content:flex-start;gap:0 14px}
.onion-label{position:relative;left:auto!important;top:auto!important;transform:rotate(var(--rot));font-size:21px;min-height:40px}
.onion-tip{display:none}
.onion-def{display:block;min-height:4.7em;max-width:34ch;margin:4px auto 0;font-family:var(--font-mono);font-size:14px;line-height:1.55;color:var(--wbh-forget-me-nots)}
}
.onion-head,.onion-titles,.onion-svg,.onion-labels{transition:opacity 1100ms var(--ease-reveal),transform 1200ms var(--ease-reveal)}
.onion-sec.is-pre .onion-head,.onion-sec.is-pre .onion-titles,.onion-sec.is-pre .onion-labels{opacity:0;transform:translateY(24px)}
.onion-sec.is-pre .onion-svg{opacity:0;transform:translateY(28px) scale(.94)}
.onion-titles{transition-delay:620ms}.onion-svg{transition-delay:760ms}.onion-labels{transition-delay:980ms}
@media (prefers-reduced-motion:reduce){.onion-head,.onion-titles,.onion-svg,.onion-labels{transition:none}}
.onion-w{display:inline-block;transition:opacity 900ms var(--ease-reveal),transform 1100ms cubic-bezier(.25,1.1,.45,1);transition-delay:calc(var(--i) * 90ms)}
.onion-sec.is-pre .onion-head{opacity:1;transform:none}
.onion-sec.is-pre .onion-w{opacity:0;transform:translateY(.3em) rotate(calc(var(--r) * .5))}
.onion-sec.is-pre .onion-sub{opacity:0;transform:translateY(12px)}
.onion-sub{transition:opacity 900ms var(--ease-reveal) 480ms,transform 1000ms var(--ease-reveal) 480ms}
@media (prefers-reduced-motion:reduce){.onion-w,.onion-sub{transition:none}}
.onion-svg.is-wobble{animation:onionWobble 1.1s ease-in-out both;transform-origin:50% 82%}
@keyframes onionWobble{0%{transform:rotate(0)}22%{transform:rotate(-1.6deg)}46%{transform:rotate(1.1deg)}70%{transform:rotate(-.5deg)}100%{transform:rotate(0)}}
@media (prefers-reduced-motion:reduce){.onion-svg.is-wobble{animation:none}}

.onion-word{position:relative}
.onion-word::after{content:"";position:absolute;top:.1em;right:-9px;width:5px;height:5px;border-radius:50%;background:var(--wbh-forget-me-nots);opacity:0;transition:opacity 600ms var(--ease-settle)}
.onion-set.is-live .onion-word::after{animation:onionHint 2.6s ease-in-out infinite}
.onion-set.is-live .onion-label:nth-child(2) .onion-word::after{animation-delay:.45s}.onion-set.is-live .onion-label:nth-child(3) .onion-word::after{animation-delay:.9s}.onion-set.is-live .onion-label:nth-child(4) .onion-word::after{animation-delay:1.35s}.onion-set.is-live .onion-label:nth-child(5) .onion-word::after{animation-delay:1.8s}
@keyframes onionHint{0%,100%{opacity:.2;transform:scale(.8)}50%{opacity:.85;transform:scale(1.15)}}
.onion-sec.is-hinted .onion-word::after{animation:none;opacity:0}
@media (prefers-reduced-motion:reduce){.onion-set.is-live .onion-word::after{animation:none;opacity:.55}}

.onion-peel{display:none}
.onion-sec.is-tap{height:auto}
.onion-sec.is-tap .onion-stage{position:relative;height:auto;overflow:visible;padding:8px 0 28px}
.onion-sec.is-tap .onion-wrap{cursor:pointer}
.onion-sec.is-tap .onion-peel{display:inline-flex;align-items:center;justify-content:center;min-height:44px;margin:18px auto 0;padding:0 26px;border:1px solid var(--wbh-forget-me-nots);border-radius:999px;background:transparent;color:var(--wbh-forget-me-nots);font-family:var(--font-mono);font-size:12px;letter-spacing:var(--tracking-caps);text-transform:uppercase;cursor:pointer}

/*phone-callout*/
@media (max-width:900px){
.onion-def{position:absolute;left:50%;top:12%;transform:translateX(-50%);width:min(88%,320px);max-width:none;min-height:0;margin:0;z-index:5;background:var(--wbh-floral-white);border:1px solid rgba(41,56,89,.22);border-radius:12px;padding:10px 14px;box-shadow:0 6px 18px rgba(41,56,89,.14);text-align:left;font-size:14px;line-height:1.55;pointer-events:none}
.onion-def:empty{display:none}
}
