:root{--ink:#17242a;--muted:#5c6260;--cream:#f6f3ec;--paper:#fffefa;--sage:#b5c4b5;--sand:#ded5c3;--serif:Georgia,"Times New Roman",serif;--sans:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);font:16px/1.65 var(--sans);-webkit-font-smoothing:antialiased}
body,button,input,select,textarea{font-family:var(--sans)}
a{color:inherit;text-decoration:none}
a:hover{color:#596d69}
img{display:block;max-width:100%;height:auto}
button,input,select,textarea{font:inherit}
.screen-reader-text{position:absolute!important;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);width:1px;height:1px;overflow:hidden;white-space:nowrap}
.skip-link{position:fixed;z-index:1000;top:1rem;left:1rem;padding:.75rem 1rem;transform:translateY(-160%);background:var(--ink);color:white;border-radius:999px}
.skip-link:focus{transform:translateY(0)}
.site-header{position:relative;z-index:20;width:100%;background:var(--cream)}
.site-header--overlay{position:absolute;top:0;left:0;background:transparent}
.header-inner{width:min(100% - 12vw,1500px);min-height:96px;margin:0 auto;display:flex;align-items:center;gap:3rem}
.site-brand{flex:1}
.wordmark{display:inline-block;color:var(--ink);font:400 2rem/1 var(--serif);letter-spacing:.34em;padding-left:.34em;text-transform:uppercase;white-space:nowrap}
.custom-logo{width:auto;max-height:58px}
.desktop-navigation{margin-left:auto}
.nav-list{display:flex;align-items:center;gap:clamp(1.25rem,2.4vw,2.7rem);margin:0;padding:0;list-style:none}
.nav-list a{font:400 .9rem/1.2 var(--serif);letter-spacing:.015em}
.header-actions{display:flex;align-items:center;gap:1.35rem}
.header-actions svg{display:block;width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.search-navigation,.mobile-navigation{position:relative}
.search-navigation summary,.mobile-navigation summary{display:flex;align-items:center;justify-content:center;list-style:none;cursor:pointer}
.search-navigation summary::-webkit-details-marker,.mobile-navigation summary::-webkit-details-marker{display:none}
.search-navigation{margin-left:.2rem;padding-left:1.6rem;border-left:1px solid rgba(23,36,42,.7)}
.header-search-form{position:absolute;top:calc(100% + 1.4rem);right:0;z-index:40;display:flex;gap:.5rem;padding:.65rem;background:var(--paper);box-shadow:0 10px 35px rgba(23,36,42,.14)}
.header-search-form input{width:min(55vw,250px);padding:.55rem .7rem;border:1px solid var(--sand);background:white}
.header-search-form button{padding:.5rem .75rem;border:0;background:var(--ink);color:white;font-size:.72rem}
.bag-link{position:relative;display:grid;place-items:center}
.bag-link svg{width:23px;height:25px}
.bag-count{display:none}
.mobile-navigation{display:none}
.menu-icon{display:grid;gap:5px;width:22px}
.menu-icon span{width:100%;height:1px;background:currentColor}
.site-main{min-height:45vh}
.site-main--home{padding:0}
.hero{position:relative;display:flex;align-items:flex-start;min-height:100vh;min-height:100svh;padding:clamp(145px,16.5vh,190px) max(6.4vw,calc((100vw - 1500px)/2)) 100px;overflow:hidden;background-color:#c7d9e7;background-image:url("../images/hero-desktop.webp");background-position:50% 47%;background-size:cover}
.hero-copy{position:relative;z-index:1;width:min(740px,70vw)}
.hero h1{max-width:790px;margin:0;font:400 clamp(2.8rem,3.6vw,4rem)/1.1 var(--serif);letter-spacing:-.035em;text-wrap:balance}
.hero-description{max-width:430px;margin:1rem 0 0;color:#4b5354;font:400 clamp(1.05rem,1.45vw,1.25rem)/1.35 var(--serif);letter-spacing:.025em}
.section-wrap{width:min(100% - 12vw,1200px);margin-right:auto;margin-left:auto}
.story-section{display:grid;grid-template-columns:.8fr 1.2fr;gap:8vw;padding-top:clamp(90px,12vw,165px);padding-bottom:clamp(90px,12vw,165px)}
.story-kicker{display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start}
.eyebrow{margin:0 0 1.2rem;color:var(--muted);font-size:.67rem;font-weight:600;letter-spacing:.19em;line-height:1.4;text-transform:uppercase}
.story-number{color:#8a9691;font:400 .7rem var(--serif);letter-spacing:.14em}
.story-copy{max-width:660px}
.story-copy h2,.section-heading h2,.about-section h2{margin:0;font:400 clamp(2.5rem,4.7vw,4.5rem)/1.08 var(--serif);letter-spacing:-.045em;text-wrap:balance}
.story-copy p,.about-section p:not(.eyebrow){max-width:590px;margin:1.5rem 0 1.6rem;color:var(--muted);font:400 1.05rem/1.7 var(--serif)}
.text-link{display:inline-flex;gap:.55rem;padding-bottom:.3rem;border-bottom:1px solid #9ba99f;font:400 .85rem var(--serif)}
.about-section{display:grid;grid-template-columns:.8fr 1.2fr;gap:8vw;padding-top:4.5rem;padding-bottom:clamp(90px,11vw,150px);border-top:1px solid rgba(28,43,50,.13)}
.about-section h2{max-width:660px}
.about-section p:not(.eyebrow){max-width:590px}
.featured-section{padding:4rem 0 8rem;border-top:1px solid rgba(28,43,50,.12)}
.section-heading{display:flex;align-items:end;justify-content:space-between;gap:2rem;margin-bottom:2.5rem}
.section-heading h2{font-size:clamp(2.2rem,4vw,3.5rem)}
.page-content-section{padding-bottom:6rem}
.content-wrap{width:min(100% - 10vw,900px);margin:0 auto;padding-top:clamp(4rem,9vw,8rem);padding-bottom:clamp(5rem,10vw,9rem)}
.archive-header{margin-bottom:3.5rem}
.archive-header h1,.entry-header h1,.not-found h1{margin:0;font:400 clamp(2.8rem,7vw,5.5rem)/1.04 var(--serif);letter-spacing:-.06em}
.archive-description,.entry-content{color:#42565d}
.post-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:3rem 2rem}
.post-card-image{display:block;margin-bottom:1.2rem;overflow:hidden;background:#e8e1d4}
.post-card-image img{width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform .5s}
.post-card-image:hover img{transform:scale(1.03)}
.post-meta{margin:0 0 .5rem;color:var(--muted);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase}
.post-card h2{margin:0;font:400 1.8rem/1.2 var(--serif);letter-spacing:-.03em}
.post-excerpt{color:var(--muted)}
.entry-content{padding-top:1rem;font-size:1.06rem}
.entry-content>*{max-width:100%}
.entry-content h2,.entry-content h3{margin-top:2.5rem;color:var(--ink);font:400 2rem var(--serif)}
.featured-image{margin-top:2rem}
.featured-image img{width:100%;max-height:650px;object-fit:cover}
.post-navigation{display:flex;justify-content:space-between;gap:2rem;margin-top:4rem;padding-top:1.5rem;border-top:1px solid var(--sand)}
.nav-links{display:flex;justify-content:center;gap:.7rem;margin-top:3rem}
.page-numbers{padding:.5rem .8rem;border:1px solid var(--sand);border-radius:50%}
.page-numbers.current{background:var(--ink);color:white}
.not-found{min-height:60vh;display:flex;flex-direction:column;align-items:flex-start;justify-content:center}
.not-found p:not(.eyebrow){max-width:520px;margin:1.2rem 0 2rem;color:var(--muted)}
.site-footer{padding:4rem max(6vw,calc((100vw - 1400px)/2)) 1.5rem;background:#e9e6dc}
.footer-main{display:grid;grid-template-columns:1fr;align-items:center;gap:2rem;padding-bottom:3rem}
.footer-wordmark{font-size:1.7rem}
.footer-main p{max-width:250px;margin:0;color:var(--muted);font:400 .95rem var(--serif)}
.footer-main .nav-list{gap:1.5rem}
.footer-main .nav-list a{font-size:.82rem}
.footer-bottom{display:flex;justify-content:flex-end;gap:1rem;padding-top:1.2rem;border-top:1px solid rgba(28,43,50,.15);color:#718087;font:400 .7rem var(--serif);letter-spacing:.06em}
.woocommerce-main{width:min(100% - 10vw,1320px)}
.woocommerce .woocommerce-breadcrumb{margin-bottom:2rem;color:var(--muted);font-size:.75rem}
.woocommerce .page-title,.woocommerce-products-header__title{margin:0 0 2rem;font:400 clamp(2.8rem,6vw,5rem)/1.05 var(--serif);letter-spacing:-.06em}
.woocommerce ul.products{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2rem 1.25rem;margin:0;padding:0}
.woocommerce ul.products:before,.woocommerce ul.products:after{display:none}
.woocommerce ul.products li.product{float:none;width:auto;margin:0}
.woocommerce ul.products li.product a img{aspect-ratio:4/5;margin:0 0 1rem;object-fit:cover;background:#ebe5d9}
.woocommerce ul.products li.product .woocommerce-loop-product__title{padding:0;color:var(--ink);font:400 1.3rem var(--serif)}
.woocommerce ul.products li.product .price{color:var(--muted);font-size:.9rem}
.woocommerce span.onsale{min-height:0;padding:.45rem .75rem;border-radius:999px;background:var(--sage);color:var(--ink);font-size:.66rem;line-height:1.2}
.woocommerce a.button,.woocommerce button.button,.woocommerce input.button,.woocommerce #respond input#submit,.woocommerce a.added_to_cart{padding:.9rem 1.25rem;border:0;border-radius:999px;background:var(--ink);color:white;font-size:.7rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.woocommerce a.button:hover,.woocommerce button.button:hover,.woocommerce input.button:hover{background:#425d60;color:white}
.woocommerce div.product div.images img{background:#ebe5d9}
.woocommerce div.product .product_title{font:400 clamp(2.2rem,4vw,3.7rem)/1.05 var(--serif);letter-spacing:-.05em}
.woocommerce div.product p.price,.woocommerce div.product span.price{color:#536c6b;font-size:1.25rem}
.woocommerce div.product form.cart div.quantity{margin-right:.8rem}
.woocommerce .quantity .qty,.woocommerce form .form-row input.input-text,.woocommerce form .form-row textarea,.woocommerce select{min-height:46px;padding:.65rem .8rem;border:1px solid #d5d0c4;border-radius:4px;background:var(--paper);color:var(--ink)}
.woocommerce-message,.woocommerce-info,.woocommerce-error{border-top-color:#80978a;background:#f0eee7}
.woocommerce-message:before,.woocommerce-info:before{color:#58716e}
.woocommerce table.shop_table{border-color:#ded9ce;border-radius:4px}
.woocommerce table.shop_table th{color:var(--ink)}
.woocommerce .woocommerce-ordering select,.woocommerce .woocommerce-result-count{color:var(--muted);font-size:.85rem}
.wp-block-button__link{border-radius:999px;background:var(--ink);color:white}
:focus-visible{outline:2px solid #567b74;outline-offset:4px}
@media(max-width:1000px){
	.header-inner{width:min(100% - 8vw,1500px);min-height:82px;gap:1.5rem}
	.wordmark{font-size:1.65rem;letter-spacing:.25em;padding-left:.25em}
	.desktop-navigation .nav-list{gap:1.15rem}
	.desktop-navigation .nav-list a{font-size:.82rem}
	.header-actions{gap:1rem}
	.search-navigation{padding-left:1rem}
}
@media(max-width:768px){
	.desktop-navigation{display:none}
	.site-brand{flex:1}
	.mobile-navigation{display:block}
	.mobile-navigation[open] nav{position:absolute;top:calc(100% + 1.2rem);right:0;z-index:30;min-width:230px;padding:1.3rem;border:1px solid rgba(28,43,50,.08);background:var(--paper);box-shadow:0 15px 45px rgba(28,43,50,.12)}
	.mobile-navigation .nav-list{display:flex;flex-direction:column;align-items:flex-start;gap:1rem}
	.hero{min-height:90svh;padding:145px 7vw 90px}
	.hero-copy{width:min(640px,80vw)}
	.section-wrap{width:min(100% - 10vw,1200px)}
}
@media(max-width:768px){
	.header-inner{width:calc(100% - 2.5rem);min-height:76px;gap:1.1rem}
	.wordmark{font-size:1.55rem;letter-spacing:.22em;padding-left:.22em}
	.header-actions{gap:1rem}
	.header-actions svg{width:21px;height:21px}
	.search-navigation{margin-left:0;padding-left:.9rem}
	.header-search-form{top:calc(100% + 1.2rem)}
	.hero{align-items:flex-start;min-height:100vh;min-height:100svh;padding:clamp(145px,19vh,180px) 1.5rem 80px;background-image:url("../images/hero-mobile.webp");background-position:50% 50%;background-size:cover}
	.hero-copy{width:min(100%,520px)}
	.hero h1{max-width:500px;font-size:clamp(2.75rem,10vw,4rem);line-height:1.05}
	.hero-description{max-width:350px;margin-top:.9rem;font-size:1.08rem}
	.story-section,.about-section{grid-template-columns:1fr;gap:2.5rem;padding-top:5.5rem;padding-bottom:5.5rem}
	.story-kicker{flex-direction:row}
	.story-copy h2,.about-section h2{font-size:clamp(2.7rem,11vw,4rem)}
	.section-heading{align-items:flex-start;flex-direction:column}
	.post-grid{grid-template-columns:1fr;gap:2.5rem}
	.footer-main{grid-template-columns:1fr;gap:1rem;padding-bottom:2rem}
	.footer-main nav{margin-top:1rem}
	.footer-bottom{font-size:.62rem}
	.woocommerce ul.products{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem .85rem}
	.woocommerce-main{width:calc(100% - 2.5rem)}
}
@media(max-width:390px){
	.header-inner{gap:.8rem}
	.header-actions{gap:.8rem}
	.hero{padding-right:1.25rem;padding-left:1.25rem}
	.hero h1{font-size:2.65rem}
	.woocommerce ul.products{gap:1.2rem .6rem}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}

/* Cinematic kettle focus layers. Strengths stay localized to the kettle and dragon. */
.hero-focus-layers{position:absolute;inset:0;z-index:2;overflow:hidden;pointer-events:none}
.hero-scene-dim,.hero-dragon-light,.hero-kettle-glow,.hero-steam-layer,.hero-kettle-rim-light{position:absolute;display:block;pointer-events:none}
/* Adjust scene dim opacity here. */
.hero-scene-dim{inset:0;background:rgba(12,15,18,.25);opacity:0;transition:opacity .36s ease}
body.tea-modal-open .hero-scene-dim{opacity:0;transition:none}
/* Warm light stays on the dragon's lower chest, fading toward the pot. */
.hero-dragon-light{left:32.2%;top:70%;width:clamp(190px,18vw,350px);height:clamp(145px,20vh,230px);transform:translate(-50%,-50%) scale(.78);border-radius:50%;background:radial-gradient(ellipse 34% 40% at 68% 58%,rgba(255,228,193,.38) 0%,rgba(255,190,133,.2) 42%,rgba(227,157,116,.06) 72%,transparent 90%),radial-gradient(ellipse 54% 46% at 43% 65%,rgba(247,199,161,.13) 0%,rgba(235,174,131,.06) 58%,transparent 87%);filter:blur(13px);mix-blend-mode:screen;opacity:0;transition:opacity .38s ease,transform .5s ease}
/* Broad backlight rises behind the pot; the compact core sits just above its upper rim. */
.hero-kettle-glow{left:36.9%;top:71.6%;width:clamp(300px,30vw,590px);height:clamp(270px,42vh,470px);transform:translate(-50%,-50%) scale(.72);background:radial-gradient(ellipse 16% 17% at 51% 43%,rgba(255,255,235,.98) 0%,rgba(255,225,168,.77) 27%,rgba(255,190,117,.3) 60%,transparent 100%),radial-gradient(ellipse 38% 50% at 53% 39%,rgba(255,222,177,.31) 0%,rgba(255,191,136,.16) 47%,transparent 86%),radial-gradient(ellipse 74% 33% at 48% 25%,rgba(255,243,219,.2) 0%,rgba(249,211,170,.09) 48%,transparent 88%);filter:blur(16px);mix-blend-mode:screen;opacity:0;transition:opacity .38s ease,transform .55s cubic-bezier(.2,.72,.24,1),filter .5s ease}
/* Fine oval arc follows the kettle's top lip; tune its width/height to the source image. */
.hero-kettle-rim-light{left:36.9%;top:70.65%;width:clamp(42px,3.35vw,70px);height:clamp(12px,1.35vh,18px);transform:translate(-50%,-50%) scale(.82);border:1px solid transparent;border-top-color:rgba(255,253,230,.96);border-right-color:rgba(255,225,173,.62);border-left-color:rgba(255,225,173,.62);border-radius:50%;filter:blur(.35px) drop-shadow(0 -1px 5px rgba(255,214,139,.78));mix-blend-mode:screen;opacity:0;transition:opacity .3s ease,transform .38s ease,filter .4s ease}
.hero-kettle-rim-light:after{position:absolute;top:-3px;left:34%;width:32%;height:7px;border-radius:50%;background:radial-gradient(ellipse,rgba(255,255,231,.88) 0%,rgba(255,220,151,.38) 48%,transparent 78%);filter:blur(2px);content:""}
/* One narrow, rising plume with three wandering ribbons replaces the dense steam bank. */
.hero-steam-layer{left:36.9%;top:71.6%;width:clamp(180px,22vw,420px);height:clamp(220px,34vh,390px);transform:translate(-50%,-100%);opacity:0;transition:opacity .35s ease}
.hero-steam-art{display:block;width:100%;height:100%;overflow:visible;opacity:0;transition:opacity .35s ease}
.hero-steam-art .steam-haze path{stroke-width:48px;opacity:.19;filter:blur(10px)}
.hero-steam-art .steam-ribbons path{stroke-width:22px;opacity:.46}
.hero-steam-art .steam-haze .steam-wisp--one{stroke-width:56px}
.hero-steam-art .steam-haze .steam-wisp--two{stroke-width:46px}
.hero-steam-art .steam-haze .steam-wisp--three{stroke-width:39px}
.hero-steam-art .steam-ribbons .steam-wisp--one{stroke-width:27px}
.hero-steam-art .steam-ribbons .steam-wisp--two{stroke-width:21px}
.hero-steam-art .steam-ribbons .steam-wisp--three{stroke-width:17px}
.hero.is-tea-focused .hero-scene-dim{opacity:1}
.hero.is-tea-focused .hero-dragon-light{opacity:.95;transform:translate(-50%,-50%) scale(1)}
.hero.is-tea-focused .hero-kettle-glow{opacity:1;transform:translate(-50%,-50%) scale(1);animation:tea-glow-breathe 3s ease-in-out infinite alternate}
.hero.is-tea-focused .hero-kettle-rim-light{opacity:1;transform:translate(-50%,-50%) scale(1);animation:tea-rim-shimmer 2.8s ease-in-out infinite alternate}
.hero.is-tea-focused .hero-steam-layer,.hero.is-tea-focused .hero-steam-art{opacity:1}
.hero.is-tea-focused .hero-steam-art .steam-haze{animation:tea-steam-haze 6.8s ease-in-out infinite alternate;transform-box:fill-box;transform-origin:50% 100%}
.hero.is-tea-focused .hero-steam-art .steam-wisp--one{animation:tea-wisp-flow 6.4s ease-in-out infinite;transform-box:fill-box;transform-origin:50% 100%}
.hero.is-tea-focused .hero-steam-art .steam-wisp--two{animation:tea-wisp-flow 7.8s ease-in-out -2.4s infinite;transform-box:fill-box;transform-origin:50% 100%}
.hero.is-tea-focused .hero-steam-art .steam-wisp--three{animation:tea-wisp-flow 7.1s ease-in-out -4.1s infinite;transform-box:fill-box;transform-origin:50% 100%}.tea-hotspot{position:absolute;z-index:3;left:36.9%;top:71.6%;display:block;width:clamp(104px,6vw,120px);height:clamp(74px,8vw,92px);padding:0;transform:translate(-50%,-50%);appearance:none;border:0;background:transparent;color:inherit;cursor:pointer}
.tea-hotspot:focus-visible{outline:1px solid rgba(255,231,190,.9);outline-offset:2px}
.tea-hotspot__tooltip{position:absolute;left:50%;bottom:calc(100% + 14px);z-index:2;display:block;padding:.42rem .7rem;transform:translate(-50%,5px);border:1px solid rgba(242,220,184,.2);background:rgba(19,19,17,.78);color:#f2e7d4;font:400 .82rem/1.2 var(--serif);letter-spacing:.01em;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .3s ease,transform .3s ease}
@media (hover:hover) and (pointer:fine){.tea-hotspot:hover .tea-hotspot__tooltip{opacity:1;transform:translate(-50%,0)}}
.tea-hotspot:focus-visible .tea-hotspot__tooltip,.hero.is-tea-focused .tea-hotspot__tooltip{opacity:1;transform:translate(-50%,0)}
@keyframes tea-glow-breathe{from{filter:blur(14px);opacity:.88}to{filter:blur(19px);opacity:1}}
@keyframes tea-rim-shimmer{from{filter:blur(.35px) drop-shadow(0 -1px 5px rgba(255,214,139,.72));opacity:.78}to{filter:blur(1px) drop-shadow(0 -1px 8px rgba(255,224,164,.95));opacity:1}}
@keyframes tea-steam-haze{from{transform:translate3d(-5px,3px,0) scale(.96);opacity:.65}to{transform:translate3d(7px,-16px,0) scale(1.04);opacity:1}}
@keyframes tea-wisp-flow{0%{transform:translate3d(0,9px,0) scale(.96);opacity:.18}24%{opacity:.64}67%{transform:translate3d(-7px,-20px,0) scale(1.025);opacity:.4}100%{transform:translate3d(7px,-43px,0) scale(1.07);opacity:.12}}


body.tea-modal-open{overflow:hidden}
.tea-modal[hidden]{display:none!important}
.tea-modal{position:fixed;inset:0;z-index:100;display:grid;place-items:center;overflow:hidden;padding:24px;color:#392d20}
.tea-modal:before{position:absolute;top:71.6%;left:36.9%;z-index:105;width:clamp(250px,28vw,470px);height:36vh;content:"";background:radial-gradient(ellipse 24% 24% at 50% 51%,rgba(255,231,193,.28),transparent 86%),radial-gradient(ellipse 30% 45% at 38% 39%,rgba(255,242,222,.22),transparent 76%),radial-gradient(ellipse 22% 44% at 68% 24%,rgba(238,235,224,.18),transparent 76%),radial-gradient(ellipse 40% 40% at 52% 25%,rgba(247,226,193,.15),transparent 76%);filter:blur(12px);mix-blend-mode:screen;opacity:0;transform:translate(-50%,-46%) scale(.86);transition:opacity .5s ease,transform .85s cubic-bezier(.2,.72,.24,1);pointer-events:none}
.tea-modal:not([hidden]):before{opacity:.84;transform:translate(-50%,-50%) scale(1);animation:tea-book-vapor-drift 7.6s ease-in-out .5s infinite alternate}
/* Backdrop darkness and blur are tuned here. */
.tea-modal__backdrop{position:absolute;inset:0;z-index:100;opacity:0;pointer-events:none;background:rgba(12,15,18,.42);backdrop-filter:blur(1.5px);-webkit-backdrop-filter:blur(1.5px);transition:opacity .42s ease}
.tea-modal.is-open .tea-modal__backdrop{opacity:1;pointer-events:auto}
.tea-modal.is-closing .tea-modal__backdrop{opacity:0;pointer-events:none}
.tea-modal.is-closing{pointer-events:none}
.tea-modal.is-closing:before{opacity:0;transform:translate(-50%,-45%) scale(.9);animation:none;transition-duration:.24s}
/* The steam starts on modal reveal; the book rises after the existing 140ms kettle-steam lead-in. */
.tea-modal__panel{position:relative;z-index:110;width:min(94vw,1320px);max-height:calc(100svh - 40px);perspective:1600px;isolation:isolate;opacity:0;transform:translate3d(0,28px,0) scale(.97);transition:opacity .56s ease,transform .66s cubic-bezier(.2,.72,.24,1)}
.tea-modal__panel:before{position:absolute;right:15%;bottom:-28px;left:15%;z-index:0;height:116px;content:"";border-radius:50%;background:radial-gradient(ellipse at 50% 0,rgba(247,190,111,.4),rgba(197,124,56,.2) 34%,transparent 72%);filter:blur(21px);opacity:0;transform:translateY(12px) scale(.92);transition:opacity .65s ease .14s,transform .75s cubic-bezier(.2,.72,.24,1) .08s;pointer-events:none}
.tea-modal__panel:after{position:absolute;inset:-4% -4% -8%;z-index:0;content:"";border-radius:50%;background:radial-gradient(ellipse at 2% 69%,rgba(244,237,220,.24),transparent 28%),radial-gradient(ellipse at 98% 69%,rgba(244,237,220,.23),transparent 28%),radial-gradient(ellipse at 50% 102%,rgba(255,223,180,.3),transparent 48%),radial-gradient(ellipse at 50% 98%,rgba(255,190,111,.22),transparent 61%);filter:blur(20px);opacity:0;transform:translateY(22px) scale(.94);transition:opacity .76s ease .08s,transform .86s cubic-bezier(.2,.72,.24,1) .06s;pointer-events:none}
.tea-modal.is-open .tea-modal__panel:before{opacity:1;transform:translateY(0) scale(1)}
.tea-modal.is-open .tea-modal__panel:after{opacity:.82;transform:translateY(0) scale(1)}
.tea-modal.is-closing .tea-modal__panel:before{opacity:0;transform:translateY(12px) scale(.94);transition-delay:0s}
.tea-modal.is-closing .tea-modal__panel:after{opacity:0;transform:translateY(16px) scale(.94);transition-delay:0s}
.tea-modal.is-open .tea-modal__panel{opacity:1;transform:translate3d(0,0,0) scale(1)}
.tea-modal.is-closing .tea-modal__panel{opacity:0;transform:translate3d(0,18px,0) scale(.985)}

.tea-modal__close{position:absolute;top:15px;right:15px;z-index:10;display:grid;width:42px;height:42px;place-items:center;padding:0;border:0;background:transparent;color:#4a3828;font:300 1.8rem/1 var(--sans);cursor:pointer;transition:color .2s ease}
.tea-modal__close:hover{color:#9a5e30}
.tea-modal__close:focus-visible,.tea-choice:focus-visible{outline:1px solid #926b3c;outline-offset:3px}
.tea-book__spread{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);width:100%;height:min(78svh,750px);min-height:420px;padding:8px;overflow:visible;border:1px solid rgba(211,170,94,.82);border-radius:11px 15px 14px 9px/11px 15px 14px 9px;background:linear-gradient(100deg,#927548 0%,#785a38 3%,#674b31 48%,#5a402b 50%,#5a402b 51%,#674b31 53%,#856b43 97%,#735537 100%);box-shadow:inset 0 0 0 1px rgba(255,237,195,.38),0 1px 0 rgba(248,218,164,.28),0 14px 32px rgba(5,8,10,.28),0 26px 56px rgba(5,8,10,.24),0 0 28px rgba(225,169,83,.1);transform:perspective(1500px) rotateX(2deg) translateY(16px) scaleX(.88) scaleY(.96);transform-style:flat;transform-origin:50% 55%;transition:transform .66s cubic-bezier(.2,.72,.24,1) .14s}
.tea-modal.is-open .tea-book__spread{transform:perspective(1500px) rotateX(.8deg) translateY(0) scaleX(1) scaleY(1)}
.tea-modal.is-closing .tea-book__spread{transform:perspective(1500px) rotateX(1.5deg) translateY(10px) scaleX(.94) scaleY(.98);transition-delay:0s}
.tea-book__spread:before{position:absolute;top:2px;right:2px;bottom:-7px;left:2px;z-index:-1;content:"";border:1px solid rgba(90,65,42,.42);border-radius:inherit;background:linear-gradient(105deg,#665036 0%,#7e6442 12%,#684e33 48%,#5f472f 50%,#5f472f 52%,#684e33 54%,#765e3c 89%,#5c442d 100%);box-shadow:0 7px 14px rgba(24,16,11,.17);pointer-events:none}
.tea-book__spread:after{position:absolute;top:13px;bottom:18px;left:50%;z-index:5;width:26px;content:"";transform:translateX(-50%);border-radius:50%;background:linear-gradient(90deg,transparent 0%,rgba(45,27,17,.14) 22%,rgba(67,41,23,.08) 40%,rgba(255,239,201,.18) 50%,rgba(94,58,32,.1) 62%,rgba(45,28,18,.08) 80%,transparent 100%);box-shadow:0 0 8px rgba(46,29,18,.08);pointer-events:none}
.tea-book__page{position:relative;min-width:0;overflow:hidden;border:1px solid rgba(104,76,48,.18);border-radius:9px;background-color:#dfc89d;background-image:radial-gradient(ellipse at 17% 10%,rgba(255,249,224,.58),transparent 51%),radial-gradient(ellipse at 86% 88%,rgba(131,88,47,.12),transparent 56%),radial-gradient(rgba(94,67,39,.075) .55px,transparent .8px);background-size:auto,auto,7px 8px;box-shadow:0 8px 20px rgba(42,27,17,.13),inset 0 0 24px rgba(94,55,27,.16),inset 0 1px 0 rgba(255,244,212,.72);transform-style:preserve-3d;transition:transform .62s cubic-bezier(.2,.72,.24,1) .28s}
.tea-book__page--left{z-index:1;display:flex;flex-direction:column;padding:clamp(28px,3.2vw,46px) clamp(22px,3.4vw,48px);border-radius:7px 17px 15px 6px/8px 18px 14px 7px;background-image:radial-gradient(ellipse at 12% 4%,rgba(255,249,224,.64),transparent 52%),radial-gradient(ellipse at 98% 52%,rgba(112,72,39,.08),transparent 18%),radial-gradient(ellipse at 18% 96%,rgba(131,88,47,.14),transparent 48%),radial-gradient(rgba(94,67,39,.075) .55px,transparent .8px);background-size:auto,auto,auto,7px 8px;box-shadow:0 8px 20px rgba(42,27,17,.13),inset 0 0 26px rgba(94,55,27,.16),inset -10px 0 18px rgba(76,46,26,.08),inset 0 1px 0 rgba(255,244,212,.72);transform:perspective(1500px) rotateY(-6deg) rotateX(.4deg);transform-origin:right center}
.tea-book__page--right{z-index:1;transform:perspective(1500px) rotateY(6deg) rotateX(.4deg);transform-origin:left center;border-radius:17px 7px 6px 15px/18px 8px 7px 15px;background-color:#d9c096;background-image:radial-gradient(ellipse at 52% 48%,rgba(247,232,199,.48),transparent 68%),radial-gradient(ellipse at 0 48%,rgba(70,43,25,.12),transparent 18%),radial-gradient(ellipse at 100% 52%,rgba(70,43,25,.1),transparent 18%),radial-gradient(ellipse at 48% 0,rgba(87,54,31,.18),transparent 24%),radial-gradient(ellipse at 55% 100%,rgba(77,48,27,.22),transparent 27%),radial-gradient(ellipse at 24% 34%,rgba(150,105,64,.14),transparent 15%),radial-gradient(ellipse at 81% 73%,rgba(126,82,46,.12),transparent 13%),radial-gradient(rgba(75,51,31,.09) .55px,transparent .85px);background-size:auto,auto,auto,auto,auto,auto,auto,7px 8px;box-shadow:0 8px 20px rgba(42,27,17,.13),inset 0 0 22px rgba(70,43,25,.14),inset 1px 0 0 rgba(255,242,211,.22),inset 0 1px 0 rgba(255,241,209,.42)}
.tea-modal.is-open .tea-book__page--left{transform:perspective(1500px) rotateY(-1.2deg) rotateX(.2deg)}
.tea-modal.is-open .tea-book__page--right{transform:perspective(1500px) rotateY(1.2deg) rotateX(.2deg)}
.tea-modal.is-closing .tea-book__page--left{transform:perspective(1500px) rotateY(-4deg) rotateX(.4deg);transition-delay:0s}
.tea-modal.is-closing .tea-book__page--right{transform:perspective(1500px) rotateY(4deg) rotateX(.4deg);transition-delay:0s}
.tea-book__folio{display:flex;flex:0 0 auto;align-items:center;justify-content:space-between;gap:16px;margin:0 0 12px;padding:0 2px 10px;border-bottom:1px solid rgba(94,67,39,.29);color:rgba(75,55,36,.73);font:500 .67rem/1.2 var(--sans);letter-spacing:.2em}
.tea-book__folio span:last-child{font-size:.58rem;letter-spacing:.15em}
.tea-choice-list,.tea-choice-list__items{margin:0;padding:0;list-style:none}
.tea-choice-list{flex:1;min-height:0;opacity:0;transform:translateY(8px);transition:opacity .28s ease .68s,transform .34s cubic-bezier(.2,.72,.24,1) .68s}
.tea-choice-list__items{display:flex;flex-direction:column;justify-content:center;height:100%;counter-reset:tea-entry}
.tea-modal.is-open .tea-choice-list{opacity:1;transform:translateY(0)}
.tea-choice-list__item{min-width:0;border-bottom:1px solid rgba(91,65,38,.2);counter-increment:tea-entry}
.tea-choice-list__item:last-child{border-bottom:0}
.tea-choice{display:grid;grid-template-columns:24px 56px minmax(0,1fr) 16px;min-height:76px;align-items:center;gap:12px;padding:8px 4px;color:#443728;text-decoration:none;transition:color .24s ease,transform .28s ease,background-color .24s ease}
.tea-choice:before{content:counter(tea-entry,decimal-leading-zero);color:rgba(97,73,48,.66);font:400 .65rem/1 var(--serif);letter-spacing:.04em}
.tea-choice:hover{transform:translateX(3px);background:radial-gradient(ellipse at 48% 50%,rgba(218,169,91,.2),transparent 72%);color:#714821}
.tea-choice__mark{display:block;width:52px;height:52px;flex:0 0 auto;object-fit:contain}
.tea-choice__copy{display:block;min-width:0}
.tea-choice__title{display:block;color:inherit;font:400 clamp(1.14rem,1.5vw,1.45rem)/1.1 var(--serif);letter-spacing:.012em}
.tea-choice__note{display:block;margin-top:6px;color:rgba(67,54,39,.76);font:400 clamp(.78rem,.94vw,.92rem)/1.25 var(--serif);letter-spacing:.015em}
.tea-choice__arrow{color:#977342;font:400 1rem/1 var(--serif);opacity:.62;transition:opacity .24s ease,transform .24s ease}
.tea-choice:hover .tea-choice__arrow{transform:translate(2px,-2px);opacity:1}
.tea-book__landscape-art{position:absolute;inset:-2%;width:104%;height:104%;max-width:none;object-fit:cover;object-position:center 50%;mix-blend-mode:normal;opacity:0;pointer-events:none;transition:opacity .45s ease .2s}
.tea-modal.is-open .tea-book__landscape-art{opacity:.96}
.tea-book__seal{position:absolute;right:10%;bottom:9%;z-index:2;display:grid;width:36px;height:50px;place-content:center;border:1px solid rgba(139,53,37,.72);color:rgba(139,53,37,.84);font:500 .78rem/1.2 var(--serif);text-align:center;opacity:0;box-shadow:inset 0 0 0 2px rgba(139,53,37,.14);transition:opacity .3s ease .36s}
.tea-modal.is-open .tea-book__seal{opacity:.84}
@keyframes tea-book-vapor-drift{from{opacity:.62;transform:translate(-50%,-49%) scale(.96)}to{opacity:.82;transform:translate(-49%,-54%) scale(1.04)}}
@media(max-width:768px){
	.tea-modal{padding:10px}
	.tea-modal__panel{width:min(100%,560px);max-height:calc(100svh - 20px)}
	.tea-modal__close{top:12px;right:13px;width:42px;height:42px}
	.tea-modal:before{width:clamp(230px,72vw,380px);height:45vh}
	.tea-modal__panel:after{inset:-3% -5% -5%;filter:blur(16px)}
	.tea-book__spread{height:min(90svh,780px);min-height:min(660px,calc(100svh - 36px));grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1.13fr) minmax(180px,.8fr);padding:8px}
	.tea-book__spread:after{top:50%;right:8px;bottom:auto;left:8px;width:auto;height:18px;transform:translateY(-50%);background:linear-gradient(180deg,rgba(65,39,22,.035),rgba(255,243,209,.09) 43%,rgba(104,67,37,.05) 55%,rgba(55,34,20,.02));box-shadow:0 0 5px rgba(46,29,18,.04)}
	.tea-book__spread:before{top:2px;right:2px;bottom:-9px;left:2px;border-radius:9px 12px 13px 8px/9px 12px 13px 8px}
	.tea-book__page--left{padding:clamp(16px,4vw,28px) clamp(17px,5vw,30px);transform:perspective(1400px) rotateX(2.5deg);transform-origin:center bottom}
	.tea-book__folio{margin-bottom:7px;padding-bottom:7px;font-size:.58rem;letter-spacing:.17em}
	.tea-book__folio span:last-child{font-size:.52rem;letter-spacing:.1em}
	.tea-book__page--right{min-height:180px;transform:perspective(1400px) rotateX(-2.5deg);transform-origin:center top}
	.tea-modal.is-open .tea-book__page--left{transform:perspective(1400px) rotateX(.3deg)}
	.tea-modal.is-open .tea-book__page--right{transform:perspective(1400px) rotateX(-.3deg)}
	.tea-modal.is-closing .tea-book__page--left{transform:perspective(1400px) rotateX(3deg);transition-delay:0s}
	.tea-modal.is-closing .tea-book__page--right{transform:perspective(1400px) rotateX(-3deg);transition-delay:0s}
	.tea-book__page--left{box-shadow:0 2px 7px rgba(42,27,17,.05),inset 0 0 18px rgba(94,55,27,.1),inset 0 1px 0 rgba(255,244,212,.55)}
	.tea-book__page--right{box-shadow:0 2px 7px rgba(42,27,17,.05),inset 0 0 18px rgba(70,43,25,.1),inset 0 1px 0 rgba(255,241,209,.36)}
	.tea-choice{grid-template-columns:21px 34px minmax(0,1fr) 15px;min-height:56px;gap:8px;padding:6px 2px}
	.tea-choice:before{font-size:.58rem}
	.tea-choice__mark{width:31px;height:31px}
	.tea-choice__title{font-size:clamp(1.02rem,4.4vw,1.18rem)}
	.tea-choice__note{margin-top:3px;font-size:clamp(.77rem,3.1vw,.88rem)}
	.tea-choice__arrow{font-size:.9rem}
	.tea-book__landscape-art{inset:-9% -2%;width:104%;height:118%}
	.tea-book__seal{right:8%;bottom:8%;width:32px;height:44px}
}
@media(max-width:380px){
	.tea-book__spread{grid-template-rows:minmax(0,1.08fr) minmax(165px,.7fr)}
	.tea-book__page--left{padding-right:14px;padding-left:14px}
	.tea-choice{min-height:53px;grid-template-columns:19px 30px minmax(0,1fr) 14px;gap:7px}
	.tea-choice__mark{width:28px;height:28px}
}
@media(max-width:768px) and (max-height:640px){
	.tea-book__spread{grid-template-rows:minmax(0,1.4fr) minmax(130px,.68fr)}
	.tea-book__page--left{padding:12px clamp(12px,4vw,15px)}
	.tea-book__folio{margin-bottom:4px;padding-bottom:4px;font-size:.52rem}
	.tea-choice{grid-template-columns:19px 30px minmax(0,1fr) 14px;min-height:46px;gap:6px;padding:3px 2px}
	.tea-choice__mark{width:28px;height:28px}
	.tea-choice__title{font-size:.98rem}
	.tea-choice__note{margin-top:2px;font-size:.72rem}
	.tea-book__page--right{min-height:130px}
}
@media(prefers-reduced-motion:reduce){
	.hero-scene-dim,.hero-dragon-light,.hero-kettle-glow,.hero-kettle-rim-light,.hero-steam-layer,.hero-steam-art,.hero-steam-art path,.tea-hotspot__tooltip,.tea-modal__backdrop,.tea-modal:before,.tea-modal__panel,.tea-modal__panel:before,.tea-modal__panel:after,.tea-book__spread,.tea-book__spread:before,.tea-book__spread:after,.tea-book__page,.tea-choice,.tea-choice-list,.tea-book__landscape-art,.tea-book__seal{animation:none!important;transition:none!important}
	.hero.is-tea-focused .hero-kettle-glow,.hero.is-tea-focused .hero-kettle-rim-light,.hero.is-tea-focused .hero-steam-layer,.hero.is-tea-focused .hero-steam-art{opacity:1}
}
/* Raster tea chooser: the former tea book remains preserved and hidden in front-page.php. */
.tea-raster-modal[hidden]{display:none!important}
.tea-raster-modal{position:fixed;inset:0;z-index:120;display:grid;place-items:center;overflow:hidden;padding:0;color:#f5ead8}
.tea-raster-modal__backdrop{position:absolute;inset:0;z-index:0;opacity:0;pointer-events:none;background:rgba(12,15,18,.26);backdrop-filter:blur(.4px);-webkit-backdrop-filter:blur(.4px);transition:opacity .36s ease}
.tea-raster-modal.is-open .tea-raster-modal__backdrop{opacity:1;pointer-events:auto}
.tea-raster-modal.is-closing{pointer-events:none}
/* Keep the supplied fan proportions while centering it over the hero. */
.tea-raster-modal__content{position:absolute;top:50%;left:50%;z-index:1;width:min(92vw,118svh,1450px);aspect-ratio:1448/1086;opacity:0;pointer-events:none;transform:translate3d(-50%,calc(-50% + 22px),0) scale(.975);transition:opacity .42s ease,transform .56s cubic-bezier(.2,.72,.24,1)}
.tea-raster-modal.is-open .tea-raster-modal__content{opacity:1;pointer-events:auto;transform:translate3d(-50%,-50%,0) scale(1)}
.tea-raster-modal.is-closing .tea-raster-modal__content{opacity:0;transform:translate3d(-50%,calc(-50% + 12px),0) scale(.985);transition-duration:.34s}
.tea-raster-modal__art{display:block;width:100%;height:100%;max-width:none;object-fit:contain;object-position:center;filter:drop-shadow(0 14px 24px rgba(9,11,13,.22));pointer-events:none}
.tea-raster-modal__choices{position:absolute;inset:0;z-index:2;pointer-events:none}
.tea-raster-modal__choice{position:absolute;display:block;border:0;background:transparent;cursor:pointer;pointer-events:auto}
.tea-raster-modal__choice:focus-visible{outline:2px solid rgba(255,224,160,.95);outline-offset:-5px;filter:drop-shadow(0 0 8px rgba(255,210,112,.85))}
/* Invisible hit regions follow the five fan panels; their category names are part of the artwork. */
/* These invisible links trace the five printed fan panels in tea-floating-fan-steam.png. */
.tea-raster-modal__choice--green{inset:0;width:100%;height:100%;clip-path:polygon(1.6% 36.8%,15.6% 20.3%,31.4% 50.9%,22.9% 55.8%)}
.tea-raster-modal__choice--oolong{inset:0;width:100%;height:100%;clip-path:polygon(15.6% 20.3%,36.3% 10.3%,43.9% 42.7%,31.7% 50.9%)}
.tea-raster-modal__choice--black{inset:0;width:100%;height:100%;clip-path:polygon(36.3% 10.3%,64.6% 9.9%,56.7% 42.7%,43.9% 42.7%)}
.tea-raster-modal__choice--pu-erh{inset:0;width:100%;height:100%;clip-path:polygon(64.6% 9.9%,84.3% 20.3%,68.6% 51.4%,56.7% 42.7%)}
.tea-raster-modal__choice--yellow{inset:0;width:100%;height:100%;clip-path:polygon(84.3% 20.3%,98.3% 36.8%,79.7% 55.6%,68.6% 51.4%)}
.tea-raster-modal__label{display:none}
.tea-raster-modal__close{position:absolute;top:clamp(64px,8vh,96px);right:clamp(14px,2.5vw,34px);z-index:3;display:grid;width:42px;height:42px;place-items:center;padding:0;border:0;background:transparent;color:rgba(250,242,227,.92);font:300 2rem/1 var(--sans);cursor:pointer;text-shadow:0 1px 8px rgba(0,0,0,.45);opacity:0;pointer-events:none;transition:opacity .3s ease}
.tea-raster-modal.is-open .tea-raster-modal__close{opacity:1;pointer-events:auto}
.tea-raster-modal__close:focus-visible{outline:1px solid rgba(255,231,190,.92);outline-offset:2px}
body.tea-modal-open .site-header--overlay .wordmark,body.tea-modal-open .site-header--overlay .nav-list a,body.tea-modal-open .site-header--overlay .header-actions{color:rgba(250,244,232,.9)}
body.tea-modal-open .site-header--overlay .search-navigation{border-left-color:rgba(250,244,232,.56)}
body.tea-modal-open .tea-hotspot__tooltip{visibility:hidden;opacity:0!important}
@media(max-width:768px){
	.tea-raster-modal__content{width:min(116vw,118svh,1450px)}
	.tea-raster-modal__close{top:64px;right:12px}
}
@media(prefers-reduced-motion:reduce){
	.tea-raster-modal__backdrop,.tea-raster-modal__content,.tea-raster-modal__close{transition:none!important}
}
/* Rain mode: independent far, middle, and near layers share one lightweight CSS system. */
.hero{--rain-far-opacity:.3;--rain-mid-opacity:.24;--rain-near-opacity:.4;--rain-cool-opacity:.105;--rain-dim-opacity:.065}
.hero-rain-atmosphere,.rain-layer{position:absolute;inset:0;pointer-events:none}
.hero-rain-atmosphere{z-index:0;background:linear-gradient(rgba(12,15,18,var(--rain-dim-opacity)),rgba(12,15,18,var(--rain-dim-opacity))),linear-gradient(rgba(80,100,120,var(--rain-cool-opacity)),rgba(80,100,120,var(--rain-cool-opacity)));opacity:0;backdrop-filter:saturate(.82) brightness(.91) contrast(1.04);-webkit-backdrop-filter:saturate(.82) brightness(.91) contrast(1.04);transition:opacity .45s ease}
.rain-layer{z-index:0;inset:-8% -10%;overflow:hidden;background-repeat:repeat;opacity:0;pointer-events:none}
.rain-layer--far{background-image:url("../images/rain-far.svg");background-size:1200px 1100px;background-position:371px -423px;filter:blur(.34px)}
.rain-layer--mid{background-image:url("../images/rain-mid.svg");background-size:900px 950px;background-position:-197px 148px;filter:blur(.24px)}
.rain-layer--near{background-image:url("../images/rain-near.svg");background-size:680px 720px;background-position:213px -437px;filter:blur(.62px)}
.hero.rain-mode .hero-rain-atmosphere{opacity:1}
/* Long vertical drift phases end one exact texture tile later, so each loop is seamless. */
.hero.rain-mode .rain-layer--far{opacity:var(--rain-far-opacity);animation:vivere-far-fall 11.6s linear -6.37s infinite,vivere-far-wind 18.7s ease-in-out -8.24s infinite alternate}
.hero.rain-mode .rain-layer--mid{opacity:var(--rain-mid-opacity);animation:vivere-mid-fall 6.8s linear -2.83s infinite,vivere-mid-wind 14.2s ease-in-out -5.16s infinite alternate}
.hero.rain-mode .rain-layer--near{opacity:var(--rain-near-opacity);animation:vivere-near-fall 4.3s linear -3.61s infinite,vivere-near-wind 11.9s ease-in-out -7.43s infinite alternate}
@keyframes vivere-far-fall{to{background-position:371px 677px}}
@keyframes vivere-mid-fall{to{background-position:-197px 1098px}}
@keyframes vivere-near-fall{to{background-position:213px 283px}}
@keyframes vivere-far-wind{from{transform:translate3d(-2px,0,0)}to{transform:translate3d(3px,1px,0)}}
@keyframes vivere-mid-wind{from{transform:translate3d(4px,0,0)}to{transform:translate3d(-5px,2px,0)}}
@keyframes vivere-near-wind{from{transform:translate3d(-8px,0,0)}to{transform:translate3d(7px,3px,0)}}
/* In rain mode, add a little more amber spill to the kettle and the dragon's lower face/chest. */
.hero.rain-mode .hero-dragon-light{transition:opacity .38s ease,transform .5s ease,filter .38s ease}
.hero.rain-mode.is-tea-focused .hero-dragon-light{filter:brightness(1.2) blur(13px)}
.hero.rain-mode.is-tea-focused .hero-kettle-glow{animation:tea-glow-breathe-rain 3s ease-in-out infinite alternate}
@keyframes tea-glow-breathe-rain{from{filter:brightness(1.2) blur(14px);opacity:.9}to{filter:brightness(1.2) blur(19px);opacity:1}}
/* Mobile keeps the independent phases but slightly reduces their intensity. */
@media(max-width:768px){
	.hero{--rain-far-opacity:.25;--rain-mid-opacity:.2;--rain-near-opacity:.36;--rain-cool-opacity:.09;--rain-dim-opacity:.05}
	.rain-layer--near{filter:blur(.52px)}
	.hero.rain-mode.is-tea-focused .hero-kettle-glow{animation:none;filter:brightness(1.2) blur(13px)}
}
@media(prefers-reduced-motion:reduce){
	.hero.rain-mode .rain-layer{animation:none!important}
	.hero.rain-mode .rain-layer--far{opacity:.18}
	.hero.rain-mode .rain-layer--mid{opacity:.14}
	.hero.rain-mode .rain-layer--near{opacity:.2}
	.hero.rain-mode .hero-rain-atmosphere{transition:none}
	.hero.rain-mode.is-tea-focused .hero-kettle-glow{animation:none;filter:brightness(1.2) blur(13px)}
}
/* Raster fan selector: the supplied transparent art includes the fan, vapor, teapot, and stand. */
.tea-raster-modal__content{--fan-width-scale:1;top:0;left:calc(50% - 10.3vw);width:min(84vw,82svh,1254px);aspect-ratio:1;transform:translate3d(-50%,18px,0) scaleX(var(--fan-width-scale)) scale(.975)}
.tea-raster-modal.is-open .tea-raster-modal__content{transform:translate3d(-50%,0,0) scaleX(var(--fan-width-scale)) scale(1)}
.tea-raster-modal.is-closing .tea-raster-modal__content{transform:translate3d(-50%,12px,0) scaleX(var(--fan-width-scale)) scale(.985)}
.tea-raster-modal__art{filter:drop-shadow(0 12px 24px rgba(9,11,13,.22))}
@media(min-aspect-ratio:3/2) and (min-width:769px){
	.tea-raster-modal__content{--fan-width-scale:1.3;left:calc(50% - 6.6vw)}
}
/* The supplied art contains its own rising steam and replaces the separate SVG fan trails while the selector is open. */
body.tea-modal-open .hero-steam-layer{visibility:hidden;opacity:0!important}
@media(max-width:768px){
	.tea-raster-modal__content{--fan-width-scale:1;top:calc(73.2vh - 101.3vw);left:calc(50% + 1.3vw);width:min(116vw,82svh,1254px)}
	.tea-raster-modal__close{top:64px;right:12px}
}