/* Ann Lees: the same paper, inks and globe as Victoria's site (copied from her home page), plus Ann's own parts at the end */
/* Victoria Bell Portfolio — the art does the talking; the frame stays quiet */
.vbp{--vbp-ink:#23262b;--vbp-soft:#6b6f76;--vbp-line:#e3e1dc;--vbp-mark:#2f5d50;--vbp-gap:14px;color:var(--vbp-ink);margin:0 auto}
.vbp *{box-sizing:border-box}

/* section picker: a contact sheet of covers */
.vbp-nav{display:flex;gap:18px;overflow-x:auto;padding:4px 2px 14px;margin:0 0 28px;border-bottom:1px solid var(--vbp-line);scrollbar-width:thin}
.vbp-tab{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:8px;width:96px;text-decoration:none;color:var(--vbp-soft);border-radius:6px;outline-offset:3px}
.vbp-cover{display:block;width:84px;height:84px;border-radius:50%;overflow:hidden;background:#f1efea;border:2px solid transparent;transition:border-color .2s}
.vbp-cover img{width:100%;height:100%;object-fit:cover;display:block}
.vbp-name{font-size:14px;line-height:1.25;text-align:center}
.vbp-tab:hover .vbp-cover{border-color:var(--vbp-line)}
.vbp-tab[aria-current="true"]{color:var(--vbp-ink)}
.vbp-tab[aria-current="true"] .vbp-cover{border-color:var(--vbp-mark)}
.vbp-tab:focus-visible{outline:2px solid var(--vbp-mark)}

.vbp-sec{display:none}
.vbp-sec.is-on,.vbp-single .vbp-sec{display:block}
.vbp-title{font-size:clamp(1.5rem,1.2rem + 1.2vw,2.2rem);font-weight:400;margin:0 0 20px;letter-spacing:.01em}
.vbp-nav ~ .vbp-sec .vbp-title{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.vbp-letters{margin:0 0 36px}

/* masonry: every picture keeps its own shape */
.vbp-grid{columns:4 240px;column-gap:var(--vbp-gap)}
.vbp-item{display:block;break-inside:avoid;margin:0 0 var(--vbp-gap);cursor:zoom-in;outline-offset:3px;border-radius:3px;overflow:hidden;background:#f6f5f2}
.vbp-item img{display:block;width:100%;height:auto}
.vbp-item:focus-visible{outline:2px solid var(--vbp-mark)}
@media (max-width:600px){.vbp-grid{columns:2;--vbp-gap:10px}.vbp-tab{width:76px}.vbp-cover{width:64px;height:64px}}

/* lightbox */
.vbp-box{padding:0;border:0;width:100vw;height:100vh;max-width:none;max-height:none;background:rgba(18,19,21,.96);color:#eee}
.vbp-box::backdrop{background:rgba(18,19,21,.96)}
.vbp-box figure{margin:0;position:absolute;inset:48px 64px 64px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px}
.vbp-box img{max-width:100%;max-height:100%;object-fit:contain;min-height:0;flex:1 1 auto}
.vbp-box figcaption{font-size:15px;color:#cfcfcf;text-align:center;max-width:70ch}
.vbp-box button{position:absolute;background:transparent;border:0;color:#ddd;font-size:44px;line-height:1;width:56px;height:56px;cursor:pointer;border-radius:50%}
.vbp-box button:hover{background:rgba(255,255,255,.08)}
.vbp-box button:focus-visible{outline:2px solid #fff}
.vbp-prev{left:6px;top:50%;transform:translateY(-50%)}
.vbp-next{right:6px;top:50%;transform:translateY(-50%)}
.vbp-close{right:8px;top:6px;font-size:36px!important}
@media (max-width:600px){.vbp-box figure{inset:44px 8px 70px}.vbp-prev,.vbp-next{top:auto;bottom:8px;transform:none}}
@media (prefers-reduced-motion:reduce){.vbp-cover{transition:none}}

/* portals: one doorway per gallery */
.vbp-portals{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:22px;margin:0 0 12px}
.vbp-portals[hidden]{display:none}
.vbp-portal{display:flex;flex-direction:column;gap:12px;text-decoration:none;color:var(--vbp-ink);outline-offset:4px}
.vbp-portal-pic{display:block;aspect-ratio:4/5;border-radius:6px;overflow:hidden;background:#f1efea;box-shadow:0 1px 2px rgba(0,0,0,.06),0 10px 26px rgba(0,0,0,.08)}
.vbp-portal-pic img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease}
.vbp-portal:hover .vbp-portal-pic img{transform:scale(1.035)}
.vbp-portal-tf .vbp-portal-pic{background:#1c2541}
.vbp-portal-tf .vbp-portal-pic img{object-fit:contain;background:#fff}
.vbp-portal-text{display:flex;flex-direction:column;gap:2px}
.vbp-portal-name{font-size:clamp(1.15rem,1rem + .5vw,1.45rem);letter-spacing:.01em}
.vbp-portal-count{font-size:14px;color:var(--vbp-soft)}
.vbp-portal:focus-visible{outline:2px solid var(--vbp-mark)}
.vbp-has-portals .vbp-sec .vbp-title{position:static;width:auto;height:auto;overflow:visible;clip:auto}
.vbp-back{display:inline-block;margin:0 0 14px;color:var(--vbp-soft);text-decoration:none;font-size:15px}
.vbp-back:hover{color:var(--vbp-ink);text-decoration:underline}
@media (max-width:600px){.vbp-portals{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}}
@media (prefers-reduced-motion:reduce){.vbp-portal-pic img{transition:none}}
/* Victoria Bell — home page.
   Daylight: warm cream paper, ink and garden green. Night: the starry blue wall with cream mats. */
:root{
	--hand:"Caveat Brush","Bradley Hand","Segoe Print",cursive;
	--book:"Alegreya",Georgia,"Times New Roman",serif;
}
body.vbh-day{
	--bg:#faf5ea;--bg2:#f3ead8;--ink:#2b2924;--soft:#6e675a;--head:#26241f;
	--mat:#fffdf8;--line:#e4dac6;--mark:#2f5d3a;--warm:#c8553d;
	--bar:rgba(250,245,234,.92);--shadow:rgba(80,62,30,.16);--shadow2:rgba(80,62,30,.24);
	--field:#fffdf8;
	color-scheme:light;
}
body.vbh-night{
	--bg:#1b2139;--bg2:#12172a;--ink:#f6efe2;--soft:#a9b3d1;--head:#fbf6ec;
	--mat:#fbf6ec;--line:rgba(169,179,209,.25);--mark:#5ccdf2;--warm:#f2602b;
	--bar:rgba(27,33,57,.9);--shadow:rgba(4,7,18,.55);--shadow2:rgba(4,7,18,.7);
	--field:rgba(251,246,236,.06);
	color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
html{background:var(--bg2,#faf5ea);scroll-behavior:smooth;scroll-padding-top:72px}
body.vbh{
	margin:0;min-height:100vh;
	padding:0 env(safe-area-inset-right,0) env(safe-area-inset-bottom,0) env(safe-area-inset-left,0);
	background:linear-gradient(180deg,var(--bg) 0%,var(--bg) 60%,var(--bg2) 100%);
	color:var(--ink);font-family:var(--book);font-size:18px;line-height:1.6;
	-webkit-font-smoothing:antialiased;
}
/* a few quiet stars at night, as on her holding page */
body.vbh-night::before{
	content:"";position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.55;
	background:
		radial-gradient(1px 1px at 9% 34%,#fff,transparent),
		radial-gradient(1px 1px at 92% 22%,#fff,transparent),
		radial-gradient(1.5px 1.5px at 78% 61%,#dfe6ff,transparent),
		radial-gradient(1px 1px at 22% 78%,#fff,transparent),
		radial-gradient(1px 1px at 55% 9%,#dfe6ff,transparent),
		radial-gradient(1px 1px at 37% 52%,#fff,transparent),
		radial-gradient(1.5px 1.5px at 6% 90%,#fff,transparent),
		radial-gradient(1px 1px at 86% 88%,#dfe6ff,transparent);
}
body.vbh>*{position:relative;z-index:1}
a{color:inherit}
:focus-visible{outline:2px solid var(--mark);outline-offset:4px}
.vbh-skip{position:absolute;left:12px;top:-60px;z-index:20;background:var(--mark);color:#fff;padding:8px 14px;border-radius:6px;text-decoration:none}
.vbh-skip:focus{top:12px}

/* ---- the menu bar ---- */
.vbh-bar{
	position:sticky;top:0;z-index:10;
	display:flex;align-items:center;gap:8px 24px;flex-wrap:wrap;
	padding:calc(env(safe-area-inset-top,0px) + 10px) clamp(16px,4vw,48px) 10px;
	background:var(--bar);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
	border-bottom:1px solid var(--line);
}
.vbh-bar-name{font:400 26px/1 var(--hand);color:var(--head);text-decoration:none;white-space:nowrap;margin-right:auto}
.vbh-bar-links{display:flex;gap:4px 22px;flex-wrap:wrap;align-items:center}
.vbh-bar-links a{font-size:16px;color:var(--soft);text-decoration:none;padding:6px 0;white-space:nowrap;background:linear-gradient(var(--warm),var(--warm)) 0 100%/0 2px no-repeat;transition:background-size .25s,color .2s}
.vbh-bar-links a:hover,.vbh-bar-links a:focus-visible{color:var(--head);background-size:100% 2px}
.vbh-edit{font:500 13px/1 var(--book);padding:7px 12px;border-radius:999px;background:var(--mark);color:#fff;text-decoration:none}
body.vbh-night .vbh-edit{color:#12172a}

/* ---- top, banner: her name, then a wide band of one painting ---- */
.vbh-top{text-align:center}
.vbh-top-banner{padding:clamp(36px,6vw,72px) 0 0}
.vbh-title{font:400 clamp(3.4rem,2rem + 7vw,7.6rem)/.92 var(--hand);color:var(--head);margin:0 16px;letter-spacing:.005em;text-wrap:balance}
.vbh-tagline{font-size:clamp(1.1rem,1rem + .5vw,1.4rem);font-style:italic;color:var(--soft);margin:14px 16px clamp(28px,4vw,44px)}
.vbh-band{
	margin:0;height:clamp(260px,46vw,620px);overflow:hidden;
	border-top:1px solid var(--line);border-bottom:1px solid var(--line);
	background:var(--bg2);
}
.vbh-band .vbh-hero-img{display:block;width:100%;height:100%;object-fit:cover;animation:vbh-rise 1.4s cubic-bezier(.2,.7,.2,1) both}
.vbh-focus-top .vbh-hero-img{object-position:50% 12%}
.vbh-focus-center .vbh-hero-img{object-position:50% 50%}
.vbh-focus-bottom .vbh-hero-img{object-position:50% 88%}
@keyframes vbh-rise{from{opacity:0;transform:scale(1.04)}to{opacity:1;transform:none}}
.vbh-top-banner .vbh-intro{margin:clamp(28px,4vw,44px) auto 0;padding:0 22px}

/* ---- top, framed: one painting in a mat ---- */
.vbh-top-framed{max-width:900px;margin:0 auto;padding:clamp(36px,6vw,72px) 22px 24px}
.vbh-hero{
	margin:0 auto;display:inline-block;max-width:min(560px,86vw);
	padding:clamp(10px,1.6vw,15px);background:var(--mat);border-radius:3px;
	box-shadow:0 2px 3px var(--shadow),0 28px 70px var(--shadow2);
	animation:vbh-hang 1.1s cubic-bezier(.2,.7,.2,1) both;
}
.vbh-hero .vbh-hero-img{display:block;width:100%;height:auto;max-height:64vh;object-fit:contain}
@keyframes vbh-hang{from{opacity:0;transform:translateY(14px) rotate(-1.2deg)}to{opacity:1;transform:none}}
.vbh-tagline-big{font:400 clamp(2.6rem,1.6rem + 4.6vw,5.4rem)/1.02 var(--hand);color:var(--head);margin:clamp(30px,5vw,52px) auto 0;max-width:12em;text-wrap:balance}
.vbh-intro{max-width:34em;margin:20px auto 0;color:var(--soft);font-size:clamp(1.05rem,1rem + .3vw,1.2rem);font-style:italic;text-wrap:pretty}

/* ---- headings shared by the parts below ---- */
.vbh-h{font:400 clamp(2.4rem,1.7rem + 2.6vw,3.8rem)/1 var(--hand);color:var(--head);margin:0 0 12px;text-align:center}
.vbh-lede{max-width:32em;margin:0 auto clamp(28px,4vw,44px);text-align:center;color:var(--soft);font-style:italic;text-wrap:pretty}
.vbh-part{max-width:1180px;margin:0 auto;padding:clamp(56px,8vw,104px) clamp(18px,4vw,40px) 0}
.vbh-part::before{content:"";display:block;width:64px;height:2px;background:var(--warm);margin:0 auto clamp(40px,6vw,64px);border-radius:2px;opacity:.75}

/* ---- the wall of portals ---- */
.vbh-wall{max-width:1180px;margin:0 auto;padding:clamp(48px,7vw,84px) clamp(18px,4vw,40px) 0}
.vbh .vbp{--vbp-ink:var(--ink);--vbp-soft:var(--soft);--vbp-line:var(--line);--vbp-mark:var(--mark);color:var(--ink)}
.vbh .vbp-portals{grid-template-columns:repeat(auto-fit,minmax(200px,260px));justify-content:center;gap:clamp(30px,4vw,52px) clamp(22px,3vw,40px)}
.vbh .vbp-portal{color:var(--ink);gap:16px}
.vbh .vbp-portal-pic{
	background:var(--mat);padding:10px;border-radius:2px;
	box-shadow:0 1px 2px var(--shadow),0 16px 36px var(--shadow);
	transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s;
	transform:rotate(var(--tilt,0deg));
}
.vbh .vbp-portal:nth-child(4n+1){--tilt:-1.1deg}
.vbh .vbp-portal:nth-child(4n+2){--tilt:.7deg}
.vbh .vbp-portal:nth-child(4n+3){--tilt:-.4deg}
.vbh .vbp-portal:nth-child(4n){--tilt:1.3deg}
.vbh .vbp-portal-pic img{border-radius:1px;transition:none}
.vbh .vbp-portal:hover .vbp-portal-pic img{transform:none}
.vbh .vbp-portal:hover .vbp-portal-pic,.vbh .vbp-portal:focus-visible .vbp-portal-pic{transform:rotate(0) translateY(-4px);box-shadow:0 2px 3px var(--shadow),0 26px 54px var(--shadow2)}
.vbh .vbp-portal-tf .vbp-portal-pic{background:#fff}
.vbh .vbp-portal-text{align-items:center;text-align:center}
.vbh .vbp-portal-name{font:400 clamp(1.6rem,1.3rem + .8vw,2rem)/1.05 var(--hand);color:var(--head)}
.vbh .vbp-portal-count{font-size:15px;font-style:italic;color:var(--soft)}
.vbh .vbp-portal:focus-visible{outline-offset:8px}

/* inside a gallery */
.vbh .vbp-back{color:var(--soft);font-size:16px}
.vbh .vbp-back:hover{color:var(--head)}
.vbh .vbp-has-portals .vbp-sec .vbp-title{font:400 clamp(2.2rem,1.6rem + 2.4vw,3.6rem)/1 var(--hand);color:var(--head);margin:0 0 28px}
.vbh .vbp-grid{--vbp-gap:18px}
.vbh .vbp-item{background:var(--mat);padding:7px;border-radius:2px;box-shadow:0 1px 2px var(--shadow),0 12px 28px var(--shadow)}
.vbh .vbp-item img{border-radius:1px}
.vbh .vbp-letters{background:var(--mat);color:#23262b;border-radius:3px;padding:16px}
.vbh-empty{text-align:center;color:var(--soft);font-style:italic}

/* ---- in the studio: time-lapse films ---- */
.vbh-films{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:clamp(28px,4vw,48px) clamp(20px,3vw,36px);align-items:start}
.vbh-film{margin:0}
.vbh-film-frame{
	background:var(--mat);padding:8px;border-radius:3px;
	box-shadow:0 1px 2px var(--shadow),0 16px 36px var(--shadow);
	max-height:78vh;display:flex;justify-content:center;
}
.vbh-film video{display:block;width:100%;height:100%;max-height:calc(78vh - 16px);object-fit:contain;background:#111;border-radius:1px}
.vbh-film figcaption{text-align:center;margin-top:14px;display:flex;flex-direction:column;gap:2px}
.vbh-film-title{font:400 clamp(1.5rem,1.25rem + .6vw,1.85rem)/1.1 var(--hand);color:var(--head)}
.vbh-film-note{font-size:15px;font-style:italic;color:var(--soft)}

/* ---- hello ---- */
.vbh-about{display:flex;flex-wrap:wrap;gap:0 clamp(28px,5vw,64px);align-items:center;justify-content:center;max-width:980px}
.vbh-about::before{flex:0 0 100%;width:auto;height:2px;background:linear-gradient(var(--warm),var(--warm)) center/64px 2px no-repeat}
.vbh-about-pic{margin:0;flex:0 0 min(340px,38%);background:var(--mat);padding:10px;border-radius:2px;transform:rotate(-1.4deg);box-shadow:0 1px 2px var(--shadow),0 18px 40px var(--shadow)}
.vbh-about-pic img{display:block;width:100%;height:auto}
.vbh-about-text{flex:1 1 0;max-width:36em}
.vbh-about-pic + .vbh-about-text .vbh-h{text-align:left}
.vbh-about-text p{margin:0 0 1em;text-wrap:pretty}
.vbh-about:not(:has(.vbh-about-pic)) .vbh-about-text{text-align:center}

/* ---- write to Victoria ---- */
.vbh-contact{max-width:760px}
.vbh-form{display:grid;gap:16px}
.vbh-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.vbh-form label{display:grid;gap:6px;font-size:15px;color:var(--soft)}
.vbh-form input,.vbh-form textarea{
	font:inherit;font-size:17px;color:var(--ink);background:var(--field);
	border:1px solid var(--line);border-radius:8px;padding:12px 14px;width:100%;
	transition:border-color .2s,box-shadow .2s;
}
.vbh-form textarea{resize:vertical;min-height:150px}
.vbh-form input:focus,.vbh-form textarea:focus{outline:none;border-color:var(--mark);box-shadow:0 0 0 3px color-mix(in srgb,var(--mark) 22%,transparent)}
.vbh-form [aria-invalid="true"]{border-color:var(--warm)}
.vbh-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.vbh-send{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin:4px 0 0}
.vbh-send button{
	font:400 24px/1 var(--hand);letter-spacing:.02em;color:#fff;background:var(--mark);
	border:0;border-radius:999px;padding:12px 34px 13px;cursor:pointer;transition:transform .15s,filter .2s;
}
body.vbh-night .vbh-send button{color:#12172a}
.vbh-send button:hover{filter:brightness(1.08);transform:translateY(-1px)}
.vbh-send button[disabled]{opacity:.6;cursor:wait;transform:none}
.vbh-said{font-style:italic;color:var(--soft)}
.vbh-said.is-ok{color:var(--mark)}
.vbh-said.is-bad{color:var(--warm)}
.vbh-form.is-sent{opacity:.55}
.vbh-write{text-align:center;margin:28px 0 0;color:var(--soft)}
.vbh-write a{color:var(--head);text-decoration-color:var(--warm);text-underline-offset:4px}

/* ---- bottom ---- */
.vbh-foot{text-align:center;margin-top:clamp(64px,9vw,112px);padding:40px 22px calc(env(safe-area-inset-bottom,0px) + 44px);color:var(--soft);border-top:1px solid var(--line)}
.vbh-foot-name{font:400 30px/1 var(--hand);color:var(--head);margin:0 0 16px}
.vbh-foot-links{display:flex;justify-content:center;flex-wrap:wrap;gap:6px 22px;margin:0 0 20px}
.vbh-foot-links a{color:var(--soft);text-decoration:none;font-size:16px}
.vbh-foot-links a:hover{color:var(--head);text-decoration:underline;text-decoration-color:var(--warm)}
.vbh-small{font-size:14px;margin:0;opacity:.85}

@media (max-width:760px){
	html{scroll-padding-top:104px}
	.vbh-bar{padding-bottom:6px}
	.vbh-bar-links{order:3;width:100%;flex-wrap:nowrap;overflow-x:auto;gap:20px;padding-bottom:4px;scrollbar-width:none;-webkit-mask-image:linear-gradient(90deg,#000 88%,transparent)}
	.vbh-bar-links::-webkit-scrollbar{display:none}
	.vbh-about{flex-direction:column;flex-wrap:nowrap}
	.vbh-about::before{flex:none;width:100%}
	.vbh-about-pic{margin-bottom:28px}
	.vbh-about-pic{flex-basis:auto;width:min(300px,78vw)}
	.vbh-about-pic + .vbh-about-text .vbh-h{text-align:center}
	.vbh-row{grid-template-columns:1fr}
}
@media (max-width:600px){
	body.vbh{font-size:17px}
	.vbh .vbp-portals{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 16px}
	.vbh .vbp-portal-pic{padding:6px}
	.vbh .vbp-grid{--vbp-gap:12px}
	.vbh .vbp-item{padding:5px}
	.vbh-film-frame{padding:5px}
}
@media (prefers-reduced-motion:reduce){
	html{scroll-behavior:auto}
	.vbh-hero,.vbh-band .vbh-hero-img{animation:none}
	.vbh .vbp-portal-pic{transition:none}
}

/* ---- the welcome screen: one painting, a word, and a door ---- */
.vbh-welcome{display:none}
.vbh-js:not(.vbh-in) body{overflow:hidden}
.vbh-js:not(.vbh-in) .vbh-welcome{
	position:fixed;inset:0;z-index:100;
	display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(14px,2.4vh,28px);
	padding:calc(env(safe-area-inset-top,0px) + 16px) 16px calc(env(safe-area-inset-bottom,0px) + 20px);
	background:var(--wbg,#78dafb);color:#14285a;text-align:center;
	transition:opacity .7s ease,visibility 0s linear .7s;
}
.vbh-welcome-pic{margin:0;flex:0 1 auto;min-height:0;display:flex;justify-content:center}
.vbh-welcome-art{display:block;width:auto;height:auto;max-width:min(92vw,900px);max-height:calc(100vh - 190px);max-height:calc(100dvh - 190px);aspect-ratio:auto;object-fit:contain;animation:vbh-wel-in 1.2s cubic-bezier(.2,.7,.2,1) both}
video.vbh-welcome-art{background:var(--wbg,#78dafb)}
/* soften the edges so the painting melts into the screen */
.vbh-welcome-art{
	-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 6%,#000 94%,transparent 100%),linear-gradient(180deg,transparent 0,#000 6%,#000 94%,transparent 100%);
	-webkit-mask-composite:source-in;
	mask-image:linear-gradient(90deg,transparent 0,#000 6%,#000 94%,transparent 100%),linear-gradient(180deg,transparent 0,#000 6%,#000 94%,transparent 100%);
	mask-composite:intersect;
}
.vbh-welcome-words{display:flex;flex-direction:column;align-items:center;gap:10px;animation:vbh-wel-in 1.2s .25s cubic-bezier(.2,.7,.2,1) both}
.vbh-welcome-title{font:400 clamp(2.4rem,1.6rem + 3vw,4rem)/1 var(--hand);margin:0;letter-spacing:.01em}
.vbh-welcome-enter{
	font:400 clamp(1.5rem,1.3rem + .6vw,1.9rem)/1 var(--hand);letter-spacing:.06em;
	color:#fff;background:#d4471f;text-decoration:none;
	padding:12px 44px 14px;border-radius:999px;
	box-shadow:0 2px 0 #9e3214,0 10px 26px rgba(20,40,90,.28);
	transition:transform .18s,box-shadow .18s,background .2s;
}
.vbh-welcome-enter:hover{background:#e3521f;transform:translateY(-2px);box-shadow:0 3px 0 #9e3214,0 14px 30px rgba(20,40,90,.32)}
.vbh-welcome-enter:active{transform:translateY(1px);box-shadow:0 1px 0 #9e3214,0 6px 16px rgba(20,40,90,.25)}
.vbh-welcome-enter:focus-visible{outline:2px solid #fff;outline-offset:3px}
.vbh-welcome.is-leaving{opacity:0;visibility:hidden}
.vbh-welcome.is-leaving .vbh-welcome-art{transform:scale(1.06);transition:transform .7s ease}
/* a wide painting (Feel Love): the picture across the screen, the button under it */
.vbh-welcome.is-wide .vbh-welcome-art{max-width:96vw;max-height:calc(100vh - 150px);max-height:calc(100dvh - 150px)}
@keyframes vbh-wel-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@media (orientation:landscape) and (min-width:900px){
	.vbh-js:not(.vbh-in) .vbh-welcome{flex-direction:row;gap:clamp(32px,5vw,80px)}
	.vbh-welcome-art{max-height:calc(100vh - 64px);max-height:calc(100dvh - 64px);max-width:min(62vw,900px)}
	.vbh-welcome-words{gap:22px}
	.vbh-js:not(.vbh-in) .vbh-welcome.is-wide{flex-direction:column;gap:clamp(18px,3vh,36px)}
	.vbh-welcome.is-wide .vbh-welcome-art{max-width:min(96vw,1900px);max-height:calc(100vh - 150px);max-height:calc(100dvh - 150px)}
}
@media (prefers-reduced-motion:reduce){
	.vbh-welcome-art,.vbh-welcome-words{animation:none}
	.vbh-js:not(.vbh-in) .vbh-welcome{transition:none}
}

/* ---- top, dream: a Dream Painters painting fills the screen, her name on it ---- */
.vbh-dream{
	position:relative;margin:0;overflow:hidden;
	height:calc(100vh - 58px);height:calc(100svh - 58px);min-height:520px;
	background:#ee7a1c;color:#fff;
	--fx:50%;--fy:50%;
}
.vbh-dream-p7{--fx:50%;--fy:78%;background:#f08a1e}
.vbh-dream-img{
	position:absolute;inset:0;width:100%;height:100%;
	object-fit:cover;object-position:var(--fx) var(--fy);
	animation:vbh-dream-in 2.2s cubic-bezier(.2,.7,.2,1) both;
}
@keyframes vbh-dream-in{from{opacity:0;transform:scale(1.06)}to{opacity:1;transform:none}}
/* soft shade where the words sit, so they read on any painting */
.vbh-dream::after{
	content:"";position:absolute;inset:0;pointer-events:none;
	background:
		radial-gradient(ellipse 58% 46% at 92% 6%,rgba(54,14,0,.5),transparent 72%),
		linear-gradient(0deg,rgba(18,10,28,.5) 0%,rgba(18,10,28,0) 26%);
}
.vbh-dream-words{
	position:absolute;z-index:1;
	top:clamp(22px,6vh,72px);right:clamp(20px,5vw,80px);
	max-width:min(46vw,640px);text-align:right;
	animation:vbh-dream-words 1.6s .5s cubic-bezier(.2,.7,.2,1) both;
}
@keyframes vbh-dream-words{from{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:none}}
.vbh-dream .vbh-title{
	margin:0;color:#fff;
	font-size:clamp(3.6rem,2rem + 7.4vw,9rem);
	text-shadow:0 2px 3px rgba(60,16,0,.35),0 6px 40px rgba(60,16,0,.55);
}
.vbh-dream .vbh-tagline{
	margin:10px 4px 0 0;color:#fff7ea;
	font-size:clamp(1.15rem,1rem + .6vw,1.6rem);
	text-shadow:0 1px 2px rgba(60,16,0,.6),0 2px 18px rgba(60,16,0,.6);
}
.vbh-dream-plaque{
	position:absolute;z-index:1;right:clamp(14px,3vw,40px);bottom:clamp(14px,3vh,32px);
	display:grid;gap:1px;text-align:right;
	padding:11px 16px 12px;border-radius:12px;
	background:rgba(26,10,22,.62);-webkit-backdrop-filter:blur(10px) saturate(1.2);backdrop-filter:blur(10px) saturate(1.2);
	color:#fff;text-decoration:none;
	box-shadow:0 8px 26px rgba(0,0,0,.22);
	transition:background .2s,transform .2s;
	animation:vbh-dream-fade 1.4s 1s ease both;
}
.vbh-dream-plaque:hover{background:rgba(26,10,22,.8);transform:translateY(-2px)}
.vbh-dream-name{font:400 clamp(22px,1.8vw,28px)/1.05 var(--hand)}
.vbh-dream-from{font-size:15px;opacity:.9}
.vbh-dream-go{margin-top:6px;font-size:16px;font-weight:500;color:#ffe08a}
.vbh-dream-down{
	position:absolute;z-index:1;left:50%;transform:translateX(-50%);bottom:clamp(14px,3vh,32px);
	display:flex;align-items:center;gap:6px;white-space:nowrap;
	color:#fff;text-decoration:none;font-size:16px;
	padding:10px 16px;border-radius:999px;border:1px solid rgba(255,255,255,.55);
	background:rgba(22,14,34,.25);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
	animation:vbh-dream-fade 1.4s 1.4s ease both;
}
@keyframes vbh-dream-fade{from{opacity:0}to{opacity:1}}
.vbh-dream-down:hover{background:rgba(22,14,34,.45)}
.vbh-dream-down svg{animation:vbh-nudge 2.4s 3s ease-in-out infinite}
@keyframes vbh-nudge{0%,100%{transform:none}50%{transform:translateY(3px)}}
.vbh-dream :focus-visible{outline-color:#ffd27a}
.vbh-dream-intro{text-align:center;margin:clamp(36px,5vw,56px) auto 0;padding:0 22px}

@media (max-width:760px),(max-aspect-ratio:1/1){
	.vbh-dream{height:calc(100svh - 96px);min-height:480px}
	.vbh-dream-p7{--fx:24%;--fy:50%}
	.vbh-dream::after{
		background:
			linear-gradient(180deg,rgba(54,14,0,.5) 0%,rgba(54,14,0,0) 34%),
			linear-gradient(0deg,rgba(18,10,28,.62) 0%,rgba(18,10,28,0) 34%);
	}
	.vbh-dream{display:flex;flex-direction:column;align-items:center;padding:clamp(22px,5vh,48px) 16px 0}
	.vbh-dream-words{position:relative;top:auto;right:auto;max-width:none;text-align:center}
	.vbh-dream .vbh-tagline{margin-right:0}
	.vbh-dream-plaque{position:relative;right:auto;bottom:auto;margin-top:18px;text-align:center;padding:10px 18px}
}
@media (prefers-reduced-motion:reduce){
	.vbh-dream-img,.vbh-dream-words,.vbh-dream-plaque,.vbh-dream-down,.vbh-dream-down svg{animation:none}
}

/* ---- 1.6.2: Feel Love across the top, the whole painting in view ---- */
.vbh-band.vbh-band-fit{height:auto;aspect-ratio:1920/732;background:#000;border-color:#000}
.vbh-band-fit .vbh-hero-img{width:100%;height:100%;object-fit:contain}

/* ---- 1.6.2: the welcome globe of flowers, with the door on the side ---- */
.vbh-welcome.is-globe{background:radial-gradient(ellipse at 40% 45%,#fffaf2 0,var(--wbg,#f6eee2) 45%,#ecd9e6 100%) !important;color:#2b2420}
.vbh-wg{position:relative;width:min(92vw,58vh);height:min(92vw,58vh);flex:0 0 auto;touch-action:none;cursor:grab;user-select:none;-webkit-user-select:none;perspective:1100px;animation:vbh-wel-in 1.2s cubic-bezier(.2,.7,.2,1) both}
.vbh-wg:active{cursor:grabbing}
.vbh-wg-ball{position:absolute;left:50%;top:50%;width:0;height:0;transform-style:preserve-3d}
.vbh-wg-t{position:absolute;left:0;top:0;padding:0;border:0;border-radius:9px;overflow:hidden;background:#fff;cursor:pointer;backface-visibility:hidden;-webkit-backface-visibility:hidden;box-shadow:0 5px 14px rgba(40,20,50,.28);
	transform:rotateY(var(--lon)) rotateX(var(--lat)) translateZ(var(--r));transition:transform .22s ease,box-shadow .2s}
.vbh-wg-t img{display:block;width:100%;height:100%;object-fit:cover;pointer-events:none}
.vbh-wg-t:hover,.vbh-wg-t:focus-visible{transform:rotateY(var(--lon)) rotateX(var(--lat)) translateZ(calc(var(--r) + var(--pop,20px) * .35)) scale(1.4);box-shadow:0 0 0 3px #fff,0 0 0 6px #e2487a,0 10px 24px rgba(40,20,50,.4);outline:none}
.is-globe .vbh-welcome-title{color:#2b2420}
@media (orientation:landscape) and (min-width:900px){
	.vbh-js:not(.vbh-in) .vbh-welcome.is-globe{flex-direction:row;gap:clamp(36px,6vw,110px)}
	.vbh-wg{width:min(58vw,calc(86vh - 50px));height:min(58vw,calc(86vh - 50px))}
	.is-globe .vbh-welcome-words{align-items:flex-start;text-align:left}
}
.vbh-wg-t.is-pop{transform:rotateY(var(--lon)) rotateX(var(--lat)) translateZ(calc(var(--r) + var(--pop,20px) * 4)) scale(2.6);box-shadow:0 20px 60px rgba(40,20,50,.5);z-index:3;transition:transform .22s ease-in}
.vbh-wg-wrap{display:flex;flex-direction:column;align-items:center;gap:6px;flex:0 0 auto}
.vbh-wg-zoom{display:flex;gap:8px}
.vbh-wg-zoom button{width:40px;height:40px;border-radius:50%;border:1px solid rgba(43,36,32,.18);background:rgba(255,255,255,.8);color:#2b2420;font:400 22px/1 system-ui,sans-serif;cursor:pointer;box-shadow:0 2px 8px rgba(40,20,50,.12)}
.vbh-wg-zoom button:hover{background:#fff}
.vbh-wg-box img{cursor:zoom-out}

/* ---- 1.6.4: more colour — her films in the windows, painted mats, a ribbon of paintings ---- */
.vbp-portal-pic{position:relative}
.vbp-portal-film{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .8s ease;pointer-events:none;background:transparent}
.vbh .vbp-portal-film{inset:10px;width:calc(100% - 20px);height:calc(100% - 20px);border-radius:1px}
.vbp-portal-film.is-on{opacity:1}
.vbp-portal-tf .vbp-portal-film{object-fit:contain;background:#fff}
.vbh .vbp-portal.has-film .vbp-portal-pic::after{content:"▶ watch her paint";position:absolute;left:50%;bottom:18px;transform:translateX(-50%);padding:4px 11px;border-radius:999px;background:rgba(255,255,255,.88);color:#2b2420;font:600 11px/1.4 system-ui,sans-serif;letter-spacing:.04em;white-space:nowrap;opacity:0;transition:opacity .3s}
.vbh .vbp-portal.has-film:hover .vbp-portal-pic::after{opacity:1}
.vbh .vbp-portal-tf.has-film .vbp-portal-pic::after{content:"✦ tooth fairy"}
/* painted mats, in her colours */
.vbh .vbp-portal:nth-child(6n+1) .vbp-portal-pic{background:linear-gradient(135deg,#ff6f9c,#e2487a)}
.vbh .vbp-portal:nth-child(6n+2) .vbp-portal-pic{background:linear-gradient(135deg,#ffb14a,#f07a2c)}
.vbh .vbp-portal:nth-child(6n+3) .vbp-portal-pic{background:linear-gradient(135deg,#ffe066,#f2bf1f)}
.vbh .vbp-portal:nth-child(6n+4) .vbp-portal-pic{background:linear-gradient(135deg,#4fd6c6,#1f9e92)}
.vbh .vbp-portal:nth-child(6n+5) .vbp-portal-pic{background:linear-gradient(135deg,#6f86ff,#3a55d6)}
.vbh .vbp-portal:nth-child(6n) .vbp-portal-pic{background:linear-gradient(135deg,#b57bff,#8a4fd1)}
.vbh .vbp-portal:nth-child(6n+1) .vbp-portal-name{color:#d63a6d}
.vbh .vbp-portal:nth-child(6n+2) .vbp-portal-name{color:#e0661c}
.vbh .vbp-portal:nth-child(6n+3) .vbp-portal-name{color:#c99400}
.vbh .vbp-portal:nth-child(6n+4) .vbp-portal-name{color:#16897e}
.vbh .vbp-portal:nth-child(6n+5) .vbp-portal-name{color:#3049c4}
.vbh .vbp-portal:nth-child(6n) .vbp-portal-name{color:#7a3fc4}
/* soft washes of colour behind the wall */
.vbh-wall{position:relative;isolation:isolate}
.vbh-wall::before{content:"";position:absolute;inset:-40px -6vw 0;z-index:-1;pointer-events:none;
	background:radial-gradient(38% 30% at 12% 14%,rgba(255,111,156,.22),transparent 70%),radial-gradient(34% 26% at 88% 22%,rgba(79,214,198,.22),transparent 70%),radial-gradient(40% 30% at 20% 62%,rgba(255,224,102,.26),transparent 70%),radial-gradient(36% 28% at 84% 70%,rgba(181,123,255,.2),transparent 70%),radial-gradient(40% 26% at 50% 96%,rgba(255,177,74,.2),transparent 70%)}
.vbh-night .vbh-wall::before{opacity:.6}
/* the ribbon */
.vbh-ribbon{overflow:hidden;margin:clamp(30px,5vw,56px) 0 0;padding:14px 0;transform:rotate(-1.2deg);background:linear-gradient(90deg,#e2487a,#f08a3c,#f2bf1f,#1f9e92,#3a55d6,#8a4fd1);box-shadow:0 10px 30px rgba(60,20,60,.18)}
.vbh-ribbon-track{display:flex;gap:12px;width:max-content;animation:vbh-ribbon 90s linear infinite}
.vbh-ribbon img{display:block;width:clamp(76px,9vw,120px);height:clamp(76px,9vw,120px);object-fit:cover;border-radius:8px;border:3px solid #fff;box-shadow:0 4px 12px rgba(0,0,0,.2)}
.vbh-ribbon:hover .vbh-ribbon-track{animation-play-state:paused}
@keyframes vbh-ribbon{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.vbh-ribbon-track{animation:none}}

/* ---- 1.7.0: selected works, then the galleries in three groups ---- */
.vbh-selected{max-width:1320px;margin:0 auto;padding:clamp(48px,7vw,84px) 0 0}
.vbh-sel-head{padding:0 clamp(18px,4vw,40px)}
.vbh-sel-row{list-style:none;margin:0;padding:6px clamp(18px,4vw,40px) 26px;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(240px,26vw);gap:clamp(16px,2vw,26px);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:thin;-webkit-overflow-scrolling:touch}
.vbh-sel-row li{scroll-snap-align:start}
.vbh-sel-row li.is-wide{grid-column:span 2}
.vbh-sel-row a{display:flex;flex-direction:column;gap:12px;text-decoration:none;color:var(--ink)}
.vbh-sel-row img{display:block;width:100%;height:clamp(240px,30vw,400px);object-fit:cover;background:var(--mat);padding:10px;border-radius:2px;box-shadow:0 1px 2px var(--shadow),0 16px 36px var(--shadow);transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s}
.vbh-sel-row a:hover img,.vbh-sel-row a:focus-visible img{transform:translateY(-6px);box-shadow:0 2px 4px var(--shadow),0 26px 48px var(--shadow2)}
.vbh-sel-t{display:flex;flex-direction:column;gap:2px;padding:0 4px}
.vbh-sel-name{font:400 26px/1.05 var(--hand);color:var(--head)}
.vbh-sel-where{font-size:15px;color:var(--soft)}
.vbh-groups{display:grid;gap:clamp(48px,7vw,84px)}
.vbh-group-h{font:400 clamp(2rem,1.5rem + 2vw,3rem)/1 var(--hand);color:var(--head);text-align:center;margin:0 0 clamp(24px,3vw,36px)}
.vbh-group-more{display:block;font:400 17px/1.4 var(--book);margin-top:8px}
.vbh-group-more,.vbh-group-more:visited{color:var(--mark);text-decoration:none}
.vbh-group-h::after{content:"";display:block;width:48px;height:2px;background:var(--warm);margin:14px auto 0;border-radius:2px;opacity:.7}
@media (max-width:700px){
	.vbh-sel-row{grid-auto-columns:72vw}
	.vbh-sel-row li.is-wide{grid-column:span 1}
	.vbh-sel-row img{height:62vw}
}

/* ---------------- Ann Lees ---------------- */
body.annl{--warm:#3f7d8c;--mark:#2f6b5a}
.annl .vbh-welcome.is-globe{background:radial-gradient(ellipse at 40% 45%,#fbf8f1 0,#eef1ea 45%,#dbe8ec 100%) !important}
.annl .vbh-welcome-enter{background:#3f7d8c;box-shadow:0 2px 0 #275561,0 10px 26px rgba(20,40,60,.28)}
.annl .vbh-welcome-enter:hover{background:#346b78;box-shadow:0 3px 0 #275561,0 14px 30px rgba(20,40,60,.32)}
.annl-welcome-line{margin:0;font-style:italic;color:#5c665f;max-width:22em}
.annl-top{max-width:1180px;margin:0 auto;padding:clamp(28px,5vw,64px) clamp(18px,4vw,40px) 0;text-align:center}
.annl-hero{margin:clamp(18px,3vw,32px) auto 0;max-width:1100px;background:var(--mat);padding:clamp(10px,1.4vw,18px);box-shadow:0 1px 2px var(--shadow),0 22px 50px var(--shadow)}
.annl-hero-img{display:block;width:100%;height:auto;max-height:72vh;object-fit:contain}
.annl-gallery{max-width:1180px;margin:0 auto;padding:clamp(56px,8vw,96px) clamp(18px,4vw,40px) 0}
.annl-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:clamp(18px,2.4vw,30px)}
.annl-grid a{display:flex;flex-direction:column;gap:10px;text-decoration:none;color:var(--ink)}
.annl-grid img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:cover;background:var(--mat);padding:8px;border-radius:2px;box-shadow:0 1px 2px var(--shadow),0 12px 28px var(--shadow);transition:transform .3s cubic-bezier(.2,.7,.2,1),box-shadow .3s}
.annl-grid a:hover img,.annl-grid a:focus-visible img{transform:translateY(-5px);box-shadow:0 2px 4px var(--shadow),0 22px 44px var(--shadow2)}
.annl-grid span{font-size:16px;color:var(--soft);text-align:center}
.annl-about{display:grid;grid-template-columns:minmax(0,340px) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:start}
.annl-about:not(:has(.annl-about-pic)){grid-template-columns:1fr;max-width:820px}
.annl-about-pic{margin:0}
.annl-about-pic img{width:100%;height:auto;border-radius:3px;box-shadow:0 14px 34px var(--shadow)}
.annl-about-text .vbh-h{text-align:left}
.annl-about-text p{margin:0 0 16px;font-size:19px}
.annl-btns{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin:0}
.annl-btn{display:inline-flex;align-items:center;min-height:48px;padding:0 26px;border-radius:999px;background:#3f7d8c;color:#fff !important;text-decoration:none;font-size:18px}
.annl-btn:hover{background:#346b78}
.annl-btn-line{background:transparent;color:#3f7d8c !important;border:1.5px solid #3f7d8c}
.annl-btn-line:hover{background:rgba(63,125,140,.08)}
.annl-buy{position:absolute;left:50%;top:12px;transform:translateX(-50%);z-index:5;background:#d4471f;color:#fff !important;text-decoration:none;font:500 16px/1 var(--book);padding:11px 20px;border-radius:999px;box-shadow:0 6px 20px rgba(0,0,0,.35);white-space:nowrap}
.annl-buy:hover{background:#b93c19}
.annl-box figure{inset:64px 64px 56px}
@media (max-width:800px){.annl-about{grid-template-columns:1fr}.annl-about-text .vbh-h{text-align:center}}
