/* Tailwind v4 preflight (abridged to what this page uses) */
*,::after,::before,::backdrop,::file-selector-button{box-sizing:border-box;margin:0;padding:0;border:0 solid}
html,:host{line-height:1.5;-webkit-text-size-adjust:100%;tab-size:4;font-family:var(--font-sans);-webkit-tap-highlight-color:transparent}
hr{height:0;color:inherit;border-top-width:1px}
h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}
a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}
b,strong{font-weight:bolder}
ol,ul,menu{list-style:none}
img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}
img,video{max-width:100%;height:auto}
button,input,select,optgroup,textarea,::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;border-radius:0;background-color:transparent;opacity:1}
::placeholder{opacity:1;color:color-mix(in oklab,currentcolor 50%,transparent)}
button,input:where([type=button],[type=reset],[type=submit]),::file-selector-button{appearance:button}
summary{display:list-item}
[hidden]:where(:not([hidden=until-found])){display:none!important}

/* Project theme (src/styles.css) */
:root{
  --font-display:"Bricolage Grotesque",system-ui,sans-serif;
  --font-sans:"Inter",system-ui,sans-serif;
  --font-hand:"Caveat",cursive;
  --radius:1rem;
  --background:oklch(0.982 0.022 82);
  --foreground:oklch(0.235 0.01 250);
  --card:oklch(1 0 0);
  --primary:oklch(0.85 0.17 85);
  --primary-foreground:oklch(0.235 0.01 250);
  --accent:oklch(0.69 0.2 45);
  --accent-foreground:oklch(1 0 0);
  --muted:oklch(0.95 0.03 82);
  --muted-foreground:oklch(0.45 0.015 250);
  --border:oklch(0.235 0.01 250);
  --ring:oklch(0.69 0.2 45);
  --whatsapp:oklch(0.55 0.12 160);
  --whatsapp-bubble:oklch(0.94 0.07 140);
  --cream-deep:oklch(0.95 0.04 82);
  /* constants used by the dark theme */
  --ink:oklch(0.235 0.01 250);
  --band:oklch(0.235 0.01 250);
  --on-band:oklch(0.982 0.022 82);
  --edge:oklch(0.235 0.01 250);
  color-scheme:light;
}
/* Dark theme: follows the device unless the visitor picks one with the toggle */
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){
  --background:oklch(0.2 0.012 250);--foreground:oklch(0.95 0.02 82);--card:oklch(0.26 0.014 250);
  --muted:oklch(0.28 0.014 250);--muted-foreground:oklch(0.78 0.015 82);--border:oklch(0.95 0.02 82);
  --whatsapp:oklch(0.78 0.13 160);--whatsapp-bubble:oklch(0.3 0.05 155);--cream-deep:oklch(0.24 0.014 250);
  --band:oklch(0.14 0.01 250);--on-band:oklch(0.95 0.02 82);--edge:oklch(0.9 0.02 82);color-scheme:dark}}
:root[data-theme=dark]{
  --background:oklch(0.2 0.012 250);--foreground:oklch(0.95 0.02 82);--card:oklch(0.26 0.014 250);
  --muted:oklch(0.28 0.014 250);--muted-foreground:oklch(0.78 0.015 82);--border:oklch(0.95 0.02 82);
  --whatsapp:oklch(0.78 0.13 160);--whatsapp-bubble:oklch(0.3 0.05 155);--cream-deep:oklch(0.24 0.014 250);
  --band:oklch(0.14 0.01 250);--on-band:oklch(0.95 0.02 82);--edge:oklch(0.9 0.02 82);color-scheme:dark}
*{border-color:var(--border)}
html{scroll-behavior:smooth}
body{background:var(--background);color:var(--foreground);font-family:var(--font-sans);margin:0}
h1,h2,h3{font-family:var(--font-display);letter-spacing:-0.02em}

.-bottom-2{bottom:calc(0.5rem * -1)}
.-bottom-3{bottom:calc(0.75rem * -1)}
.-left-20{left:calc(5rem * -1)}
.-left-3{left:calc(0.75rem * -1)}
.-left-6{left:calc(1.5rem * -1)}
.-mt-6{margin-top:calc(1.5rem * -1)}
.-right-6{right:calc(1.5rem * -1)}
.-rotate-1{rotate:calc(1deg * -1)}
.-rotate-2{rotate:calc(2deg * -1)}
.-rotate-3{rotate:calc(3deg * -1)}
.-top-10{top:calc(2.5rem * -1)}
.-top-4{top:calc(1rem * -1)}
.-top-5{top:calc(1.25rem * -1)}
.\[\&\:\:-webkit-details-marker\]\:hidden::-webkit-details-marker{display:none}
.\[-webkit-text-stroke\:2\.5px_var\(--foreground\)\]{-webkit-text-stroke:2.5px var(--foreground)}
.absolute{position:absolute}
.backdrop-blur-sm{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.bg-accent{background-color:var(--accent)}
.bg-background{background-color:var(--background)}
.bg-background\/95{background-color:color-mix(in oklab, var(--background) 95%, transparent)}
.bg-card{background-color:var(--card)}
.bg-cream-deep{background-color:var(--cream-deep)}
.bg-foreground{background-color:var(--foreground)}
.bg-primary{background-color:var(--primary)}
.bg-whatsapp-bubble{background-color:var(--whatsapp-bubble)}
.block{display:block}
.bob{animation:bob 3.2s ease-in-out infinite}
.border-2{border-style:var(--tw-border-style,solid);border-width:2px}
.border-\[2\.5px\]{border-style:var(--tw-border-style,solid);border-width:2.5px}
.border-b-2{border-bottom-style:var(--tw-border-style,solid);border-bottom-width:2px}
.border-b-\[2\.5px\]{border-bottom-style:var(--tw-border-style,solid);border-bottom-width:2.5px}
.border-background\/20{border-color:color-mix(in oklab, var(--background) 20%, transparent)}
.border-dashed{--tw-border-style:dashed;border-style:dashed}
.border-foreground{border-color:var(--foreground)}
.border-foreground\/10{border-color:color-mix(in oklab, var(--foreground) 10%, transparent)}
.border-foreground\/40{border-color:color-mix(in oklab, var(--foreground) 40%, transparent)}
.border-l-\[2\.5px\]{border-left-style:var(--tw-border-style,solid);border-left-width:2.5px}
.border-r-\[2\.5px\]{border-right-style:var(--tw-border-style,solid);border-right-width:2.5px}
.border-t{border-top-style:var(--tw-border-style,solid);border-top-width:1px}
.border-t-\[2\.5px\]{border-top-style:var(--tw-border-style,solid);border-top-width:2.5px}
.border-y-\[2\.5px\]{border-top-style:var(--tw-border-style,solid);border-top-width:2.5px;border-bottom-style:var(--tw-border-style,solid);border-bottom-width:2.5px}
.bottom-5{bottom:1.25rem}
.bottom-6{bottom:1.5rem}
.btn-press{transition:transform .12s, box-shadow .12s}
.chunky{border:2.5px solid var(--edge);box-shadow:4px 4px 0 0 var(--edge)}
.chunky-lg{border:2.5px solid var(--edge);box-shadow:7px 7px 0 0 var(--edge)}
.cursor-pointer{cursor:pointer}
.decoration-4{text-decoration-thickness:4px}
.decoration-primary{text-decoration-color:var(--primary)}
.divide-dashed > :not(:last-child){--tw-border-style:dashed;border-style:dashed}
.divide-foreground\/20 > :not(:last-child){border-color:color-mix(in oklab, var(--foreground) 20%, transparent)}
.divide-y-2 > :not(:last-child){border-top-width:0;border-bottom-width:2px;border-style:var(--tw-border-style,solid)}
.flex{display:flex}
.flex-col{flex-direction:column}
.flex-wrap{flex-wrap:wrap}
.focus\:ring-4:focus{box-shadow:0 0 0 4px var(--tw-ring-color)}
.focus\:ring-ring\/40:focus{--tw-ring-color:color-mix(in oklab, var(--ring) 40%, transparent)}
.font-bold{--tw-font-weight:700;font-weight:700}
.font-display{font-family:var(--font-display)}
.font-extrabold{--tw-font-weight:800;font-weight:800}
.font-hand{font-family:var(--font-hand)}
.font-medium{--tw-font-weight:500;font-weight:500}
.font-semibold{--tw-font-weight:600;font-weight:600}
.gap-10{gap:2.5rem}
.gap-12{gap:3rem}
.gap-2{gap:0.5rem}
.gap-3{gap:0.75rem}
.gap-4{gap:1rem}
.gap-5{gap:1.25rem}
.gap-6{gap:1.5rem}
.gap-7{gap:1.75rem}
.gap-8{gap:2rem}
.gap-x-4{column-gap:1rem}
.gap-y-2{row-gap:0.5rem}
.grid{display:grid}
.grid-cols-\[auto_1fr\]{grid-template-columns:auto 1fr}
.group[open] .group-open\:rotate-45{rotate:45deg}
.h-10{height:2.5rem}
.h-11{height:2.75rem}
.h-12{height:3rem}
.h-20{height:5rem}
.h-24{height:6rem}
.h-4{height:1rem}
.h-5{height:1.25rem}
.h-7{height:1.75rem}
.h-8{height:2rem}
.hidden{display:none}
@media (hover:hover){.hover\:underline:hover{text-decoration-line:underline}}
.inline-block{display:inline-block}
.inline-flex{display:inline-flex}
.items-center{align-items:center}
.items-end{align-items:flex-end}
.items-start{align-items:flex-start}
.justify-between{justify-content:space-between}
.justify-center{justify-content:center}
.justify-end{justify-content:flex-end}
.justify-start{justify-content:flex-start}
.leading-\[0\.95\]{--tw-leading:0.95;line-height:0.95}
.leading-\[1\.02\]{--tw-leading:1.02;line-height:1.02}
.leading-none{--tw-leading:1;line-height:1}
.leading-snug{--tw-leading:1.375;line-height:1.375}
.leading-tight{--tw-leading:1.25;line-height:1.25}
.left-0{left:0rem}
.left-10{left:2.5rem}
.left-4{left:1rem}
.list-none{list-style-type:none}
.marquee{animation:marquee 30s linear infinite}
.max-w-2xl{max-width:42rem}
.max-w-3xl{max-width:48rem}
.max-w-5xl{max-width:64rem}
.max-w-6xl{max-width:72rem}
.max-w-\[15rem\]{max-width:15rem}
.max-w-\[85\%\]{max-width:85%}
.max-w-lg{max-width:32rem}
.max-w-md{max-width:28rem}
.max-w-sm{max-width:24rem}
.max-w-xs{max-width:20rem}
.mb-10{margin-bottom:2.5rem}
.mb-3{margin-bottom:0.75rem}
.mb-4{margin-bottom:1rem}
.mb-5{margin-bottom:1.25rem}
.mb-8{margin-bottom:2rem}
.min-h-12{min-height:3rem}
.ml-2{margin-left:0.5rem}
.ml-auto{margin-left:auto}
.mt-0\.5{margin-top:0.125rem}
.mt-1{margin-top:0.25rem}
.mt-10{margin-top:2.5rem}
.mt-12{margin-top:3rem}
.mt-2{margin-top:0.5rem}
.mt-20{margin-top:5rem}
.mt-24{margin-top:6rem}
.mt-3{margin-top:0.75rem}
.mt-4{margin-top:1rem}
.mt-5{margin-top:1.25rem}
.mt-6{margin-top:1.5rem}
.mt-7{margin-top:1.75rem}
.mt-8{margin-top:2rem}
.mx-auto{margin-inline:auto}
.opacity-60{opacity:60%}
.opacity-70{opacity:70%}
.opacity-90{opacity:90%}
.outline-none{--tw-outline-style:none;outline-style:none}
.overflow-hidden{overflow:hidden}
.overflow-x-hidden{overflow-x:hidden}
.p-1{padding:0.25rem}
.p-3{padding:0.75rem}
.p-4{padding:1rem}
.p-5{padding:1.25rem}
.p-6{padding:1.5rem}
.p-7{padding:1.75rem}
.p-8{padding:2rem}
.pb-16{padding-bottom:4rem}
.pb-3{padding-bottom:0.75rem}
.pb-5{padding-bottom:1.25rem}
.place-items-center{place-items:center}
.pop-in{opacity:0;transform:scale(.7) translateY(12px);transition:opacity .45s, transform .55s cubic-bezier(.34,1.56,.64,1)}
.pt-10{padding-top:2.5rem}
.pt-6{padding-top:1.5rem}
.px-2{padding-inline:0.5rem}
.px-3{padding-inline:0.75rem}
.px-4{padding-inline:1rem}
.px-5{padding-inline:1.25rem}
.px-6{padding-inline:1.5rem}
.px-7{padding-inline:1.75rem}
.py-1{padding-block:0.25rem}
.py-12{padding-block:3rem}
.py-14{padding-block:3.5rem}
.py-16{padding-block:4rem}
.py-2{padding-block:0.5rem}
.py-20{padding-block:5rem}
.py-3{padding-block:0.75rem}
.py-4{padding-block:1rem}
.py-5{padding-block:1.25rem}
.relative{position:relative}
.right-0{right:0rem}
.right-5{right:1.25rem}
.rotate-1{rotate:1deg}
.rotate-2{rotate:2deg}
.rotate-45{rotate:45deg}
.rotate-6{rotate:6deg}
.rotate-\[0\.6deg\]{rotate:0.6deg}
.rounded-2xl{border-radius:1.5rem}
.rounded-3xl{border-radius:1.875rem}
.rounded-\[2\.5rem\]{border-radius:2.5rem}
.rounded-\[2rem\]{border-radius:2rem}
.rounded-bl-sm{border-bottom-left-radius:.25rem}
.rounded-br-sm{border-bottom-right-radius:.25rem}
.rounded-full{border-radius:calc(infinity * 1px)}
.rounded-lg{border-radius:1rem}
.rounded-md{border-radius:.375rem}
.rounded-xl{border-radius:1.25rem}
.scroll-mt-24{scroll-margin-top:6rem}
.self-center{align-self:center}
.shrink-0{flex-shrink:0}
.space-y-2 > :not(:last-child){margin-block-start:0;margin-block-end:0.5rem}
.space-y-3 > :not(:last-child){margin-block-start:0;margin-block-end:0.75rem}
.space-y-4 > :not(:last-child){margin-block-start:0;margin-block-end:1rem}
.space-y-7 > :not(:last-child){margin-block-start:0;margin-block-end:1.75rem}
.sticky{position:sticky}
.text-2xl{font-size:1.5rem;line-height:var(--tw-leading,calc(2/1.5))}
.text-3xl{font-size:1.875rem;line-height:var(--tw-leading,calc(2.25/1.875))}
.text-4xl{font-size:2.25rem;line-height:var(--tw-leading,calc(2.5/2.25))}
.text-5xl{font-size:3rem;line-height:var(--tw-leading,1)}
.text-6xl{font-size:3.75rem;line-height:var(--tw-leading,1)}
.text-8xl{font-size:6rem;line-height:var(--tw-leading,1)}
.text-9xl{font-size:8rem;line-height:var(--tw-leading,1)}
.text-\[10px\]{font-size:10px}
.text-\[11px\]{font-size:11px}
.text-accent{color:var(--accent)}
.text-accent-foreground{color:var(--accent-foreground)}
.text-background{color:var(--background)}
.text-base{font-size:1rem;line-height:var(--tw-leading,1.5)}
.text-center{text-align:center}
.text-foreground{color:var(--foreground)}
.text-lg{font-size:1.125rem;line-height:var(--tw-leading,calc(1.75/1.125))}
.text-muted-foreground{color:var(--muted-foreground)}
.text-primary{color:var(--primary)}
.text-right{text-align:right}
.text-sm{font-size:0.875rem;line-height:var(--tw-leading,calc(1.25/.875))}
.text-whatsapp{color:var(--whatsapp)}
.text-xl{font-size:1.25rem;line-height:var(--tw-leading,calc(1.75/1.25))}
.text-xs{font-size:0.75rem;line-height:var(--tw-leading,calc(1/.75))}
.top-0{top:0rem}
.top-6{top:1.5rem}
.tracking-tight{letter-spacing:-0.025em}
.tracking-wider{letter-spacing:0.05em}
.transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}
.underline{text-decoration-line:underline}
.underline-offset-4{text-underline-offset:4px}
.uppercase{text-transform:uppercase}
.w-10{width:2.5rem}
.w-11{width:2.75rem}
.w-12{width:3rem}
.w-16{width:4rem}
.w-20{width:5rem}
.w-24{width:6rem}
.w-28{width:7rem}
.w-48{width:12rem}
.w-5{width:1.25rem}
.w-56{width:14rem}
.w-64{width:16rem}
.w-7{width:1.75rem}
.w-8{width:2rem}
.w-full{width:100%}
.w-max{width:max-content}
.whitespace-nowrap{white-space:nowrap}
.z-10{z-index:10}
.z-40{z-index:40}
@media (width>=40rem){
.sm\:-left-6{left:calc(1.5rem * -1)}
.sm\:block{display:block}
.sm\:flex-row{flex-direction:row}
.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.sm\:grid-cols-\[10rem_1fr\]{grid-template-columns:10rem 1fr}
.sm\:text-6xl{font-size:3.75rem;line-height:var(--tw-leading,1)}
}
@media (width>=48rem){
.md\:-rotate-1{rotate:calc(1deg * -1)}
.md\:-translate-y-4{translate:0 calc(1rem * -1)}
.md\:block{display:block}
.md\:flex{display:flex}
.md\:flex-row{flex-direction:row}
.md\:gap-6{gap:1.5rem}
.md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.md\:grid-cols-\[1\.1fr_1fr\]{grid-template-columns:1.1fr 1fr}
.md\:grid-cols-\[1\.4fr_1fr\]{grid-template-columns:1.4fr 1fr}
.md\:grid-cols-\[1fr_1\.2fr\]{grid-template-columns:1fr 1.2fr}
.md\:grid-cols-\[1fr_1\.3fr\]{grid-template-columns:1fr 1.3fr}
.md\:items-center{align-items:center}
.md\:items-end{align-items:flex-end}
.md\:justify-between{justify-content:space-between}
.md\:mx-0{margin-inline:0rem}
.md\:p-10{padding:2.5rem}
.md\:p-8{padding:2rem}
.md\:pt-16{padding-top:4rem}
.md\:py-20{padding-block:5rem}
.md\:rotate-1{rotate:1deg}
.md\:text-3xl{font-size:1.875rem;line-height:var(--tw-leading,calc(2.25/1.875))}
.md\:text-4xl{font-size:2.25rem;line-height:var(--tw-leading,calc(2.5/2.25))}
.md\:text-5xl{font-size:3rem;line-height:var(--tw-leading,1)}
.md\:text-6xl{font-size:3.75rem;line-height:var(--tw-leading,1)}
.md\:text-7xl{font-size:4.5rem;line-height:var(--tw-leading,1)}
.md\:text-base{font-size:1rem;line-height:var(--tw-leading,1.5)}
.md\:text-left{text-align:left}
.md\:text-xl{font-size:1.25rem;line-height:var(--tw-leading,calc(1.75/1.25))}
}
.is-visible{opacity:1!important;transform:none!important}
@media (hover:hover){.btn-press:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 0 var(--edge)}}
.btn-press:active{transform:translate(2px,2px);box-shadow:1px 1px 0 0 var(--edge)}
@keyframes bob{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-12px) rotate(1.5deg)}}
@keyframes marquee{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.bob,.marquee{animation:none}.pop-in{opacity:1;transform:none}}
input[type=range]{accent-color:var(--accent)}
.legal{font-size:1.0625rem;line-height:1.7}
.legal h2{font-size:1.75rem;font-weight:800;line-height:1.15;margin:2.5rem 0 .75rem}
.legal p{margin:0 0 1rem}
.legal ul{list-style:disc;padding-left:1.4rem;margin:0 0 1rem}
.legal li{margin-bottom:.4rem}
.legal a{text-decoration:underline;text-decoration-color:var(--primary);text-decoration-thickness:3px;text-underline-offset:3px}
a:focus-visible,button:focus-visible,summary:focus-visible,select:focus-visible{outline:3px solid var(--accent);outline-offset:3px}

.theme-toggle{display:grid;place-items:center;width:2.6rem;height:2.6rem;border-radius:9999px;border:2.5px solid var(--edge);background:var(--card);color:var(--foreground);cursor:pointer;flex:none}
.theme-toggle svg{width:1.2rem;height:1.2rem}
.theme-toggle .sun{display:none}
.nav-right{display:flex;align-items:center;gap:.6rem}
@media (prefers-color-scheme:dark){
:root:not([data-theme=light]) .bg-primary{--foreground:var(--ink);--muted-foreground:oklch(0.36 0.015 250);--edge:var(--ink);--border:var(--ink);color:var(--ink)}
:root:not([data-theme=light]) .bg-background,:root:not([data-theme=light]) .bg-card,:root:not([data-theme=light]) .bg-cream-deep,:root:not([data-theme=light]) .bg-whatsapp-bubble{--foreground:oklch(0.95 0.02 82);--muted-foreground:oklch(0.78 0.015 82);color:var(--foreground)}
:root:not([data-theme=light]) .bg-foreground{background-color:var(--band)}
:root:not([data-theme=light]) .text-background{color:var(--on-band)}
:root:not([data-theme=light]) .theme-toggle .sun{display:block}
:root:not([data-theme=light]) .theme-toggle .moon{display:none}
:root:not([data-theme=light]) .demo-wrap{--char:var(--band);--on-hivis:var(--ink);--taken:oklch(0.34 0.014 250);--taken-ink:oklch(0.95 0.02 82);--warn:oklch(0.8 0.14 40);--warn-soft:oklch(0.3 0.07 30)}
:root:not([data-theme=light]) .pnl-h{color:var(--ink)}
:root:not([data-theme=light]) .pnl-h .stat{color:oklch(0.36 0.015 250)}
:root:not([data-theme=light]) .pnl-h .stat.live{color:oklch(0.42 0.12 160)}
}
:root[data-theme=dark] .bg-primary{--foreground:var(--ink);--muted-foreground:oklch(0.36 0.015 250);--edge:var(--ink);--border:var(--ink);color:var(--ink)}
:root[data-theme=dark] .bg-background,:root[data-theme=dark] .bg-card,:root[data-theme=dark] .bg-cream-deep,:root[data-theme=dark] .bg-whatsapp-bubble{--foreground:oklch(0.95 0.02 82);--muted-foreground:oklch(0.78 0.015 82);color:var(--foreground)}
:root[data-theme=dark] .bg-foreground{background-color:var(--band)}
:root[data-theme=dark] .text-background{color:var(--on-band)}
:root[data-theme=dark] .theme-toggle .sun{display:block}
:root[data-theme=dark] .theme-toggle .moon{display:none}
:root[data-theme=dark] .demo-wrap{--char:var(--band);--on-hivis:var(--ink);--taken:oklch(0.34 0.014 250);--taken-ink:oklch(0.95 0.02 82);--warn:oklch(0.8 0.14 40);--warn-soft:oklch(0.3 0.07 30)}
:root[data-theme=dark] .pnl-h{color:var(--ink)}
:root[data-theme=dark] .pnl-h .stat{color:oklch(0.36 0.015 250)}
:root[data-theme=dark] .pnl-h .stat.live{color:oklch(0.42 0.12 160)}

/* ---- Ask Vesty chat widget ---- */
.vc-root{position:fixed;right:16px;bottom:80px;z-index:60;display:flex;flex-direction:column;align-items:flex-end;gap:12px;font-family:var(--font-sans)}
.vc-fab{display:flex;align-items:center;gap:8px;padding:6px 16px 6px 6px;border-radius:999px;background:var(--primary);color:var(--ink,#15181B);font-weight:700;border:2.5px solid var(--edge);box-shadow:4px 4px 0 0 var(--edge);cursor:pointer}
.vc-fab img{width:40px;height:40px;border-radius:999px;background:var(--background)}
.vc-fab:active{transform:translate(2px,2px);box-shadow:2px 2px 0 0 var(--edge)}
.vc-root.is-open .vc-fab-t{display:none}
.vc-root.is-open .vc-fab{padding:6px}
.vc-panel{width:min(370px,calc(100vw - 32px));max-height:min(600px,calc(100vh - 190px));max-height:min(600px,calc(100dvh - 190px));display:flex;flex-direction:column;background:var(--card);color:var(--foreground);border:2.5px solid var(--edge);box-shadow:6px 6px 0 0 var(--edge);border-radius:1.5rem;overflow:hidden}
.vc-panel[hidden]{display:none}
.vc-head{display:flex;align-items:center;gap:10px;padding:12px 14px;background:var(--primary);color:var(--ink,#15181B);border-bottom:2.5px solid var(--edge)}
.vc-head img{width:38px;height:38px;border-radius:999px;background:var(--background)}
.vc-head div{flex:1;display:flex;flex-direction:column;line-height:1.2}
.vc-head b{font-family:var(--font-display);font-size:1.1rem}
.vc-head small{font-size:.75rem;opacity:.8}
.vc-x{font-size:1.6rem;line-height:1;background:none;border:0;cursor:pointer;color:inherit;padding:0 4px}
.vc-voice{margin:12px 14px 0;padding:10px 14px;border-radius:999px;background:var(--accent);color:var(--accent-foreground);font-weight:700;border:2.5px solid var(--edge);cursor:pointer}
.vc-voice.is-live{background:var(--foreground);color:var(--background)}
[data-vapi-start].is-live{background:var(--foreground);color:var(--background)}
.vc-vstat{margin:6px 14px 0;font-size:.75rem;color:var(--muted-foreground);text-align:center}
.vc-log{flex:1 1 auto;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:8px;min-height:90px}
.vc-msg{max-width:85%;padding:9px 12px;border-radius:16px;font-size:.95rem;line-height:1.4;white-space:pre-wrap;overflow-wrap:anywhere}
.vc-msg a{text-decoration:underline;color:inherit}
.vc-bot{align-self:flex-start;background:var(--muted);border-bottom-left-radius:4px}
.vc-me{align-self:flex-end;background:var(--primary);color:var(--ink,#15181B);border-bottom-right-radius:4px}
.vc-wait{opacity:.6}
.vc-chips{display:flex;flex-wrap:wrap;gap:6px;padding:0 14px 10px}
.vc-chips[hidden]{display:none}
.vc-chip{font-size:.8rem;padding:6px 10px;border-radius:999px;border:2px solid var(--edge);background:var(--background);color:var(--foreground);cursor:pointer}
.vc-form{display:flex;gap:8px;padding:10px 14px;border-top:2px solid var(--border)}
.vc-form input{flex:1;min-width:0;padding:10px 12px;border-radius:12px;border:2px solid var(--edge);background:var(--background);color:var(--foreground);font-size:16px}
.vc-send{padding:10px 14px;border-radius:12px;background:var(--foreground);color:var(--background);font-weight:700;border:0;cursor:pointer}
.vc-send:disabled{opacity:.5}
.vc-foot{margin:0;padding:0 14px 10px;font-size:.7rem;color:var(--muted-foreground)}
@media (prefers-reduced-motion:reduce){.vc-fab:active{transform:none}}

.vc-head,.vc-voice,.vc-vstat,.vc-chips,.vc-form,.vc-foot{flex-shrink:0}
@media (max-height:700px){.vc-chips .vc-chip:nth-child(n+3){display:none}.vc-foot{display:none}}

/* Chat colours: yellow header, panel opposite to the site theme, iMessage-style bubbles */
.vc-panel{--vc-bg:oklch(0.2 0.012 250);--vc-ink:oklch(0.95 0.02 82);background:var(--vc-bg);color:var(--vc-ink);border-color:#15181B;box-shadow:6px 6px 0 0 #15181B}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .vc-panel{--vc-bg:oklch(0.982 0.022 82);--vc-ink:#15181B;border-color:#f2efe8;box-shadow:6px 6px 0 0 #f2efe8}}
:root[data-theme=dark] .vc-panel{--vc-bg:oklch(0.982 0.022 82);--vc-ink:#15181B;border-color:#f2efe8;box-shadow:6px 6px 0 0 #f2efe8}
.vc-head{background:oklch(0.85 0.17 85);color:#15181B;border-bottom:2.5px solid #15181B}
.vc-head img,.vc-fab img{background:#fff}
.vc-msg{color:#000;border-radius:18px}
.vc-bot{background:#E9E9EB;border-bottom-left-radius:5px}
.vc-me{background:#0A84FF;border-bottom-right-radius:5px;color:#fff}
.vc-me a{color:#fff}
.vc-msg a{color:#000}
.vc-vstat,.vc-foot{color:var(--vc-ink);opacity:.75}
.vc-chip{background:oklch(0.69 0.2 45);color:#fff;border:1.5px solid oklch(0.69 0.2 45);font-weight:600}
.vc-form{border-top:2px solid color-mix(in oklab,var(--vc-ink) 25%,transparent)}
.vc-form input{background:#fff;color:#000;border:2px solid #C7C7CC}
.vc-form input::placeholder{color:#8E8E93}
.vc-send{background:#0A84FF;color:#000}
.vc-voice{border-color:#15181B}
.vc-voice.is-live{background:#15181B;color:#fff;border-color:#fff}
.vc-fab{background:oklch(0.85 0.17 85);color:#15181B;border-color:#15181B;box-shadow:4px 4px 0 0 #15181B}
@media (min-width:768px){.vc-panel{width:440px;height:min(760px,75vh,calc(100vh - 170px));max-height:none}}

/* Chat avatar: zoom in on Vesty's head and phone */
.vc-fab img,.vc-head img{clip-path:circle(33% at 50% 36%);transform:translateY(14%) scale(1.5);transform-origin:50% 36%}

/* ===== Redesign "the mix" (11 Nov 2026): calmer site-wide look + new homepage sections ===== */
:root{--background:oklch(0.993 0.006 85);--hair:oklch(0.9 0.02 82);--soft-shadow:0 8px 24px rgba(27,31,35,.09)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--background:oklch(0.2 0.012 250);--hair:oklch(0.36 0.014 250);--soft-shadow:0 8px 24px rgba(0,0,0,.35)}}
:root[data-theme="dark"]{--background:oklch(0.2 0.012 250);--hair:oklch(0.36 0.014 250);--soft-shadow:0 8px 24px rgba(0,0,0,.35)}
.chunky,.chunky-lg{border:1px solid var(--hair);box-shadow:var(--soft-shadow)}
.bg-primary.chunky,.bg-primary.chunky-lg{border-color:transparent}
a.btn-press.chunky,button.btn-press.chunky{box-shadow:none;border:1.5px solid var(--edge)}
a.btn-press.bg-primary.chunky,button.btn-press.bg-primary.chunky{border-color:transparent}
.btn-press:hover{transform:translateY(-2px);box-shadow:var(--soft-shadow)}
.border-b-\[2\.5px\],.border-t-\[2\.5px\],.border-y-\[2\.5px\],.border-\[2\.5px\]{border-color:var(--hair)}
.border-b-\[2\.5px\]{border-bottom-width:1px}.border-t-\[2\.5px\]{border-top-width:1px}.border-y-\[2\.5px\]{border-top-width:1px;border-bottom-width:1px}.border-\[2\.5px\]{border-width:1px}
.mx-stripe{height:8px;background:repeating-linear-gradient(135deg,oklch(0.85 0.17 85) 0 18px,oklch(0.235 0.01 250) 18px 36px)}
.mx-wrap{max-width:72rem;margin:0 auto;padding-left:1rem;padding-right:1rem}
.mx-hero{background:var(--cream-deep)}
.mx-hero-grid{display:flex;flex-wrap:wrap;gap:3rem;align-items:center;padding-top:4rem;padding-bottom:4rem}
.mx-hero-copy{flex:1 1 30rem;min-width:0}
.mx-kicker{margin:0 0 .9rem;font-weight:600;font-size:.85rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted-foreground)}
.mx-h1{margin:0;font-family:var(--font-display);font-weight:800;font-size:clamp(2.6rem,6vw,4.4rem);line-height:.98;letter-spacing:-.02em}
.mx-hl{background:oklch(0.85 0.17 85);color:oklch(0.235 0.01 250);padding:0 .5rem;border-radius:.6rem;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.mx-lead{margin:1.5rem 0 0;font-size:1.2rem;line-height:1.55;color:var(--muted-foreground);max-width:34rem}
.mx-ctas{margin-top:2rem;display:flex;flex-wrap:wrap;gap:.75rem}
.mx-btn{display:inline-block;padding:1rem 1.6rem;border-radius:999px;font-weight:700;font-size:1.05rem;text-decoration:none;transition:transform .12s,box-shadow .12s}
.mx-btn:hover{transform:translateY(-2px);box-shadow:var(--soft-shadow)}
.mx-btn-yellow{background:oklch(0.85 0.17 85);color:oklch(0.235 0.01 250)}
.mx-btn-outline{border:1.5px solid var(--foreground);color:var(--foreground);background:var(--card)}
.mx-btn-dark{background:oklch(0.235 0.01 250);color:#fff}
.mx-small{margin:1.1rem 0 0;font-size:.9rem;color:var(--muted-foreground)}
.mx-visual{flex:1 1 24rem;min-width:0;position:relative;display:flex;justify-content:center;padding:2rem 0}
.mx-visual-panel{width:100%;max-width:28rem;aspect-ratio:1/1;border-radius:2rem;background:var(--card);box-shadow:var(--soft-shadow);display:flex;align-items:flex-end;justify-content:center;overflow:hidden}
.mx-visual-panel img{width:82%;height:auto;display:block}
.mx-bubble{position:absolute;top:0;right:0;max-width:15rem;background:var(--card);color:var(--foreground);border-radius:1.2rem 1.2rem .3rem 1.2rem;padding:.8rem 1rem;box-shadow:var(--soft-shadow);font-family:var(--font-display);font-weight:600;font-size:1.05rem;line-height:1.3}
.mx-jobcard{position:absolute;left:0;bottom:1rem;width:16rem;background:var(--card);color:var(--foreground);border-radius:1.1rem;box-shadow:var(--soft-shadow);padding:1rem 1.15rem}
.mx-jobcard .t{margin:0;font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:oklch(0.55 0.13 155)}
.mx-jobcard .h{margin:.4rem 0 0;font-weight:700;font-size:1.05rem}
.mx-jobcard .s{margin:.2rem 0 0;font-size:.85rem;color:var(--muted-foreground)}
.mx-trust{border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.mx-trust-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(12rem,1fr));gap:1rem;padding-top:1.3rem;padding-bottom:1.3rem;text-align:center;font-weight:600;font-size:.95rem}
.mx-trust-grid p{margin:0}
.mx-trust-grid p::before{content:"✓";display:inline-block;margin-right:.45rem;color:oklch(0.55 0.13 155);font-weight:800}
.mx-ring{position:relative;overflow:hidden;margin-top:4.5rem;background:oklch(0.235 0.01 250);color:#fff;border-radius:1.75rem;padding:2.5rem;display:flex;flex-wrap:wrap;gap:2rem;align-items:center;justify-content:space-between}
.mx-ring .mx-stripe{position:absolute;left:0;right:0;top:0}
.mx-ring .k{margin:0;font-weight:700;font-size:.85rem;letter-spacing:.08em;text-transform:uppercase;color:oklch(0.85 0.17 85)}
.mx-ring h2{margin:.5rem 0 0;font-family:var(--font-display);font-weight:800;font-size:clamp(2rem,4vw,2.9rem);line-height:1.05}
.mx-ring p.s{margin:.6rem 0 0;font-size:1.1rem;color:oklch(0.86 0.01 82)}
.mx-vs{padding-top:5rem;padding-bottom:5rem}
.mx-h2{margin:0;font-family:var(--font-display);font-weight:800;font-size:clamp(2rem,4.5vw,2.9rem);line-height:1.05}
.mx-vs-grid{margin-top:2.2rem;display:grid;grid-template-columns:repeat(auto-fit,minmax(19rem,1fr));gap:1.5rem}
.mx-vs-card{border-radius:1.5rem;padding:2rem}
.mx-vs-card .k{margin:0;font-weight:800;text-transform:uppercase;letter-spacing:.08em;font-size:.8rem}
.mx-vs-card ul{margin:1rem 0 0;padding-left:1.25rem;line-height:1.9;font-size:1.05rem}
.mx-vs-bad{background:var(--muted)}
.mx-vs-bad .k{color:oklch(0.55 0.18 35)}
.mx-vs-good{background:oklch(0.85 0.17 85);color:oklch(0.235 0.01 250)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .mx-vs-bad .k{color:oklch(0.75 0.15 40)}}
:root[data-theme="dark"] .mx-vs-bad .k{color:oklch(0.75 0.15 40)}
