/* Sales-page invitation: existing editorial typography, five visitor-choice colour fields. */
.vx-chooser{position:fixed;inset:auto 24px 24px auto;z-index:60;width:max-content;max-width:calc(100vw - 48px);background:transparent;border:0;color:#17231b;font:500 14px/1.4 'Schibsted Grotesk',system-ui,sans-serif}
.vx-chooser [hidden]{display:none!important}
.vx-switcher{position:relative}
.vx-pill{display:flex;align-items:center;justify-content:center;gap:12px;min-height:48px;padding:10px 17px;border:1px solid #17231b;border-radius:999px;background:#f7f4ed;cursor:pointer;list-style:none;user-select:none}
.vx-pill::-webkit-details-marker{display:none}
.vx-pill:hover{background:#eaf1de}
.vx-chevron{font-size:21px;line-height:1;transform:translateY(3px);transition:transform 180ms ease}
.vx-switcher[open] .vx-chevron{transform:rotate(180deg) translateY(1px)}
.vx-dots{display:flex;align-items:center;padding-left:3px}
.vx-dots i{display:block;width:13px;height:20px;margin-left:-3px;border:1px solid #17231b;border-radius:10px;background:var(--vx-tint)}
.vx-tint-inspire{--vx-tint:#cce8bf}.vx-tint-guide{--vx-tint:#cadffc}.vx-tint-value{--vx-tint:#f9df9e}.vx-tint-try{--vx-tint:#ffcbb5}.vx-tint-details{--vx-tint:#dcd0f4}
.vx-invitation{position:absolute;right:0;bottom:calc(100% + 12px);width:340px;max-width:calc(100vw - 32px);max-height:min(440px,calc(100dvh - 132px));overflow:auto;overscroll-behavior:contain;border:1px solid #17231b;border-radius:18px;background:#f1f0d5;padding:16px}
.vx-invite-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}
.vx-invite-heading h2{font:400 24px/1.12 'Fraunces',Georgia,serif;letter-spacing:-.035em;margin:0;color:#17231b}
.vx-dismiss{flex:none;display:grid;place-items:center;width:44px;min-height:44px;border:1px solid #89947d;border-radius:50%;background:transparent;color:#17231b;font:400 28px/1 system-ui;cursor:pointer}
.vx-dismiss:hover{background:#e2e7c3}
.vx-invitation>p{display:none}
.vx-invitation .vx-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;margin-top:12px}
.vx-choice:last-child{grid-column:1/-1}
.vx-chooser .vx-reset{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;margin-top:8px;border:1px dashed #89947d;border-radius:8px;background:transparent;color:#17231b;font-size:13px;text-decoration:none}
.vx-chooser .vx-reset:hover{background:#e2e7c3}
.vx-chooser .vx-choice,.vx-chooser .vx-choice[aria-current]{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:8px;min-height:44px;padding:10px 12px;border-radius:8px;border:1px solid transparent;background:var(--vx-tint);color:#17231b;transition:transform 180ms ease,border-color 180ms ease;text-decoration:none}
.vx-choice>span{font-size:13px;font-weight:600;line-height:1.3}
.vx-choice>small{display:block;font-size:12px;line-height:1.35;color:#344431;margin-top:2px}
.vx-chooser .vx-choice[aria-current]{border-color:#17231b;box-shadow:inset 0 0 0 1px #17231b}
.vx-chooser .vx-choice:hover{transform:translateY(-3px);border-color:#17231b}
.vx-invitation .vx-invite-foot{font-size:12px;line-height:1.5;margin:17px 0 0;color:#344431}
.vx-nudge{position:absolute;right:0;bottom:calc(100% + 8px);display:flex;flex-direction:column;gap:7px;width:280px;max-width:calc(100vw - 32px);max-height:calc(33dvh - 16px);overflow:auto;padding:16px 18px 0;border:1px solid #17231b;border-radius:16px;background:#f1f0d5;color:#17231b;text-align:left;font:400 13px/1.4 'Schibsted Grotesk',system-ui,sans-serif;cursor:pointer;transform-origin:bottom right}
.vx-nudge strong{font:400 23px/1.15 'Fraunces',Georgia,serif;letter-spacing:-.025em}
.vx-colour-strip{display:flex;height:7px;margin:4px -18px 0;flex:none;overflow:hidden;border-radius:0 0 15px 15px}
.vx-colour-strip i{flex:1;background:var(--vx-tint)}
.vx-introducing .vx-pill{animation:vx-pill-hello 850ms ease-in-out 1}
.vx-introducing .vx-nudge{animation:vx-nudge-hello 5500ms cubic-bezier(.2,.7,.25,1) both}
@keyframes vx-pill-hello{0%,100%{transform:none}25%{transform:rotate(-2deg)}50%{transform:rotate(2deg)}75%{transform:rotate(-1deg)}}
@keyframes vx-nudge-hello{0%,15%{opacity:0;transform:translateY(14px) scale(.96);visibility:hidden}23%,85%{opacity:1;transform:none;visibility:visible}100%{opacity:0;transform:translateY(14px) scale(.96);visibility:hidden}}
body:has(.gptpill) .vx-chooser{bottom:48px}
.vx-chooser~.wrap>.nav{position:sticky;top:0}
@media(max-width:760px){
  .vx-chooser{inset:auto 16px max(16px,env(safe-area-inset-bottom)) auto;max-width:calc(100vw - 32px)}
  .vx-invitation{width:320px;padding:14px}
  .vx-invitation .vx-invite-foot{margin-top:14px}
}
@media(prefers-reduced-motion:reduce){.vx-chooser,.vx-chooser *{animation:none!important;transition:none!important;scroll-behavior:auto!important}.vx-chooser .vx-choice:hover{transform:none}}
/* Short action feedback; existing typography, dimensions and colour hierarchy stay in charge. */
.vx-primary,.vx-pill,.vx-dismiss,.vx-chooser .vx-reset{transition:background-color 140ms ease-out,border-color 140ms ease-out,transform 140ms ease-out}
.vx-primary:active,.vx-pill:active,.vx-dismiss:active,.vx-chooser .vx-reset:active{transform:translateY(1px)}
.vx-brand-row>div>a,.vx-text-link,.vx-index a{transition:text-decoration-color 140ms ease-out;text-decoration:underline;text-decoration-color:transparent;text-underline-offset:5px}
.vx-brand-row>div>a:focus-visible,.vx-text-link:focus-visible,.vx-index a:focus-visible{text-decoration-color:currentColor}
@media(hover:hover) and (pointer:fine){.vx-brand-row>div>a:hover,.vx-text-link:hover,.vx-index a:hover{text-decoration-color:currentColor}}
html.vx-motion-quiet :is(.vx-primary,.vx-pill,.vx-dismiss,.vx-reset,.vx-choice,.vx-brand-row>div>a,.vx-text-link,.vx-index a){transition:none!important;transform:none!important}
html.vx-motion-quiet .vx-chooser *{animation:none!important}
@media(prefers-reduced-motion:reduce){.vx-primary,.vx-pill,.vx-dismiss,.vx-chooser .vx-reset,.vx-brand-row>div>a,.vx-text-link,.vx-index a{transition:none!important;transform:none!important}}

/* refined 15 Sep 2026: current view reads as current, focus uses the site's emerald, the pill clears the phone's home bar */
.vx-chooser .vx-choice[aria-current]::after{content:'You are here';font-size:11px;font-weight:600;margin-top:4px;color:#0F502D}
.vx-chooser :focus-visible{outline:3px solid #0F502D;outline-offset:2px}
.vx-chooser{bottom:max(16px,env(safe-area-inset-bottom))}