/* Black catalogue: whole form above, a separate panoramic material study below. */
.tea.section-wrap {width:90%;max-width:1600px}
.tea {padding-top:28px;padding-bottom:46px}
.tea-scene {position:relative;background:var(--canvas);padding-top:clamp(32px,3.2vw,50px)}
.tea-heading {display:flex;flex-direction:row;align-items:center;justify-content:start;width:auto;gap:28px;margin:0 0 clamp(24px,2vw,32px);padding:0 0 clamp(14px,1.1vw,18px);border-bottom:0;position:relative}
.tea-heading:after {content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--line);transform:scaleX(var(--tea-rule,1));transform-origin:left}
.tea-heading h2 {font:400 clamp(28px,2vw,34px)/1.35 var(--serif);letter-spacing:.12em}
.tea-heading .eyebrow {margin:0;font-size:clamp(10px,.9vw,14px);letter-spacing:.08em;color:#959c95}
.tea-navigation {position:absolute;top:clamp(32px,3.2vw,50px);right:0;left:auto;margin:0}
.tea-tabs {width:auto;gap:28px;padding:0}
.tea-tabs button {width:auto;min-width:44px;font-size:clamp(14px,1.15vw,18px);min-height:40px}
.tea-scroll-note {display:none}
.tea-view {position:relative;height:auto;min-height:0}
.tea-panel {position:relative;inset:auto;display:grid;grid-template-columns:repeat(16,minmax(0,1fr));grid-template-rows:clamp(330px,25vw,440px) 1px auto;gap:clamp(24px,1.8vw,28px) 24px;align-items:stretch;min-height:0}
.tea-caption {display:contents;grid-column:auto;grid-row:auto;border:0;padding:0;max-width:none;height:auto;max-height:none}
.tea-art-wrap {grid-column:1/10;grid-row:1;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(18px,1.65vw,26px);height:100%;max-height:none;min-height:0;padding:0;overflow:visible}
.tea-art-wrap:before {display:none}
.tea-art {position:relative;left:2.1vw;flex:1;min-height:0;width:100%;height:100%;max-height:none;filter:none;transform-origin:center}
.tea-art-pot {max-width:min(36vw,640px)}.tea-art-tray {max-width:min(44vw,780px)}.tea-art-cup {max-width:min(36vw,640px)}
.tea-object {width:100%;height:100%;max-height:100%;overflow:visible;filter:drop-shadow(0 14px 20px #0004);transform:translateZ(0)}
.tea-image-note {align-self:start;flex:none;margin:0;color:#9ca59e;font:400 clamp(11px,.95vw,15px)/1.6 var(--sans);letter-spacing:.025em}
.tea-object-copy {grid-column:11/-1;grid-row:1;display:flex;flex-direction:column;justify-content:center;align-items:start;gap:0;min-width:0;min-height:0;padding:0}
.tea-catalogue-label {display:block;margin:0 0 clamp(18px,1.65vw,26px);color:#9ca59e;font:400 clamp(11px,.9vw,14px)/1.5 var(--sans);letter-spacing:.045em}
.tea-caption h3 {grid-column:auto;grid-row:auto;flex:none;margin:0;font:400 clamp(48px,4.55vw,72px)/1.25 var(--serif);letter-spacing:.045em}
.tea-caption h3 span {display:block}
.tea-description {grid-column:auto;grid-row:auto;flex:none;max-width:none;margin:clamp(14px,1.2vw,20px) 0 0;color:var(--soft);font:400 clamp(14px,1.15vw,18px)/1.85 var(--sans)}
.tea-description br {display:block}
.tea-caption .line-link {grid-column:auto;grid-row:auto;align-self:start;flex:none;margin:clamp(22px,2vw,32px) 0 0;font-size:clamp(14px,1.15vw,18px);min-height:40px}
.tea-spread-rule {grid-column:1/-1;grid-row:2;background:var(--line);height:1px;align-self:start;transform-origin:left}
.tea-study-copy {grid-column:1/5;grid-row:3;display:flex;flex-direction:column;justify-content:center;align-items:start;min-width:0}
.tea-study-copy .eyebrow {display:block;font-size:clamp(10px,.9vw,14px);letter-spacing:.12em;margin:0 0 10px;color:#959c95}
.tea-study-copy h4 {margin:0;font:400 clamp(26px,2.3vw,38px)/1.3 var(--serif);letter-spacing:.04em}
.tea-study-copy>p:last-child {margin:12px 0 0;color:#a0a9a1;font:400 clamp(12px,.95vw,15px)/1.7 var(--sans)}
.tea-detail {grid-column:5/-1;grid-row:3;align-self:start;justify-self:end;display:flex;flex-direction:column;gap:clamp(10px,.9vw,14px);float:none;width:100%;height:auto;min-height:0;max-width:none;margin:0}
.tea-detail-heading {display:none}
.tea-detail-viewport {position:relative;flex:none;min-height:0;display:block;width:100%;height:auto;max-height:none;aspect-ratio:3.65;overflow:hidden;isolation:isolate}
.tea-detail svg {position:absolute;left:0;top:0;display:block;flex:none;max-width:none;max-height:none;aspect-ratio:auto;border-radius:0;box-shadow:none;background:var(--canvas);mask:none;-webkit-mask:none;transform-origin:0 0;transition:none;pointer-events:none;will-change:transform}
.tea-detail figcaption {align-self:start;flex:none;display:block;width:100%;height:auto;min-height:0;margin:0;font:400 clamp(10px,.9vw,14px)/1.6 var(--sans);color:#9ca59e;letter-spacing:.025em}
.tea-art:focus-visible {outline:1px solid #efe9d67a;outline-offset:8px}
.tea-selection {will-change:transform}
.tea-selection-area {transition:background .22s ease,border-color .22s ease}
.tea-selection-corners {opacity:.87;transition:opacity .22s ease}
.tea-art.is-inspecting .tea-selection-area {background:#faf8eb16}
.tea-art.is-inspecting .tea-selection-corners {opacity:1}
@media(min-width:1101px) { .tea-detail {margin-left:-12px;width:calc(100% + 12px)} }
/* Budget both image rows against the visible height below the fixed navigation. */
@media(min-width:761px) and (min-height:501px) {
 .tea-scene {--tea-fit-height:clamp(500px,calc(100svh - var(--tea-header-height,88px) - 34px),800px);--tea-upper-height:clamp(250px,calc(var(--tea-fit-height) * .46),370px);--tea-macro-height:clamp(150px,calc(var(--tea-fit-height) * .31),230px);padding-top:8px}
 .tea-heading {gap:24px;margin-bottom:10px;padding-bottom:10px;min-height:48px}
 .tea-heading h2 {font-size:28px;line-height:1.35}
 .tea-heading .eyebrow {font-size:11px}
 .tea-navigation {top:8px}
 .tea-tabs {gap:26px}
 .tea-tabs button {font-size:14px;min-height:38px}
 .tea-panel {grid-template-rows:var(--tea-upper-height) 1px auto;row-gap:16px}
 .tea-art-wrap {gap:10px}
 .tea-art {left:1.4vw}
 .tea-image-note {font-size:11px;line-height:1.6}
 .tea-catalogue-label {font-size:11px;line-height:1.5;margin-bottom:12px}
 .tea-caption h3 {font-size:clamp(40px,calc(var(--tea-fit-height) * .08),62px);line-height:1.2}
 .tea-description {font-size:clamp(13px,calc(var(--tea-fit-height) * .022),16px);line-height:1.8;margin-top:12px}
 .tea-caption .line-link {font-size:14px;min-height:36px;margin-top:18px}
 .tea-study-copy .eyebrow {font-size:10px;margin-bottom:8px}
 .tea-study-copy h4 {font-size:clamp(24px,calc(var(--tea-fit-height) * .047),34px);line-height:1.35}
 .tea-study-copy>p:last-child {font-size:12px;line-height:1.8;margin-top:10px}
 .tea-detail {gap:8px;max-width:calc(var(--tea-fit-height) * 1.4);margin-left:0;width:100%}
 .tea-detail-viewport {height:var(--tea-macro-height);aspect-ratio:auto}
 .tea-detail figcaption {font-size:11px;line-height:1.6}
}
@media(min-width:761px) and (max-width:1100px) and (min-height:501px) {
 .tea-caption h3 {font-size:44px}
 .tea-description {font-size:14px}
 .tea-art-pot,.tea-art-cup {max-width:43vw}
 .tea-object-copy {grid-column:11/-1}
}
@media(max-width:760px), (max-width:1100px) and (max-height:500px) {
 .tea-view,.gallery-window {position:relative;overflow:hidden}
 .mobile-swipe-current,.mobile-swipe-preview {will-change:transform,opacity}
 .mobile-swipe-preview {position:absolute;inset:0;width:100%;pointer-events:none}
 .tea-panel.mobile-swipe-preview {position:absolute;inset:0}
 .tea-view.is-swiping,.gallery-window.is-swiping {contain:paint}
}
@media(max-width:760px) and (orientation:portrait) {
 .tea.section-wrap {width:calc(100% - 44px)}
 .tea {padding-top:24px;padding-bottom:34px}
 .tea-scene {padding-top:0}
 .tea-heading {width:100%;flex-direction:row;align-items:center;justify-content:space-between;gap:12px;margin-bottom:74px;padding-bottom:15px}
 .tea-heading h2 {font-size:28px}
 .tea-heading .eyebrow {max-width:180px;text-align:right;font-size:9px;letter-spacing:.06em;line-height:1.6}
 .tea-navigation {top:61px;left:0;right:0}
 .tea-tabs {gap:27px}
 .tea-tabs button {min-height:44px;font-size:14px}
 .tea-view {height:820px;min-height:0}
 .tea-panel {position:absolute;inset:0;height:100%;max-height:none;grid-template-columns:minmax(0,1fr);grid-template-rows:192px 236px 1px 88px minmax(0,1fr);gap:19px 0}
 .tea-object-copy {grid-column:1;grid-row:1;display:flex;justify-content:start;padding:0}
 .tea-catalogue-label {margin-bottom:10px;font-size:10px}
 .tea-caption h3 {grid-column:auto;grid-row:auto;font-size:28px;line-height:1.35}
 .tea-caption h3 span {display:inline}
 .tea-description {grid-column:auto;grid-row:auto;font-size:13px;line-height:1.8;margin-top:10px;max-width:none}
 .tea-caption .line-link {grid-column:auto;grid-row:auto;font-size:13px;min-height:36px;margin-top:11px}
 .tea-art-wrap {grid-column:1;grid-row:2;height:236px;max-height:none;padding:0;gap:8px}
 .tea-art {left:0;width:100%;max-width:100%;max-height:none}
 .tea-image-note {font-size:10px}
 .tea-spread-rule {grid-column:1;grid-row:3}
 .tea-study-copy {grid-column:1;grid-row:4;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto;gap:0 16px;align-content:center}
 .tea-study-copy .eyebrow {grid-column:1;grid-row:1;margin:0 0 3px;font-size:9px}
 .tea-study-copy h4 {grid-column:1;grid-row:2;font-size:20px;line-height:1.4}
 .tea-study-copy h4 br {display:block}
 .tea-study-copy>p:last-child {grid-column:2;grid-row:1/3;align-self:center;margin:0;font-size:10px;line-height:1.8}
 .tea-detail {grid-column:1;grid-row:5;height:100%;max-width:none;gap:9px;margin:0}
 .tea-detail-viewport {aspect-ratio:auto;flex:1}
 .tea-detail figcaption {display:block;font-size:10px;margin:0}
}
@media(orientation:landscape) and (max-height:500px) and (max-width:1100px) {
 .tea {padding-top:22px;padding-bottom:28px}
 .tea-scene {padding-top:0}
 .tea-heading {width:auto;margin-bottom:22px;padding-bottom:12px;gap:18px}
 .tea-heading h2 {font-size:26px}
 .tea-heading .eyebrow {font-size:9px;max-width:160px}
 .tea-navigation {top:0;left:auto;right:0}
 .tea-tabs {gap:20px}
 .tea-tabs button {font-size:13px;min-height:36px}
 .tea-view {height:480px;min-height:0}
 .tea-panel {position:absolute;inset:0;height:100%;max-height:none;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:252px 1px minmax(0,1fr);gap:18px 16px}
 .tea-art-wrap {grid-column:1/8;grid-row:1;position:relative;top:auto;height:100%;max-height:none;gap:8px;padding:0}
 .tea-art {left:0;max-width:100%;max-height:none}
 .tea-object-copy {grid-column:8/-1;grid-row:1;display:flex;justify-content:center;padding:0}
 .tea-catalogue-label {font-size:10px;margin-bottom:10px}
 .tea-caption h3 {grid-column:auto;grid-row:auto;font-size:31px}
 .tea-description {grid-column:auto;grid-row:auto;font-size:12px;line-height:1.8;margin-top:12px;max-width:none}
 .tea-caption .line-link {grid-column:auto;grid-row:auto;font-size:12px;min-height:36px;margin-top:12px}
 .tea-spread-rule {grid-column:1/-1;grid-row:2}
 .tea-study-copy {grid-column:1/4;grid-row:3;display:flex}
 .tea-study-copy h4 {font-size:23px}
 .tea-study-copy>p:last-child {font-size:10px;margin-top:8px}
 .tea-detail {grid-column:4/-1;grid-row:3;height:100%;width:100%;max-width:none;gap:8px;margin:0}
 .tea-detail-viewport {aspect-ratio:auto;flex:1}
 .tea-detail figcaption {display:block;font-size:10px;margin:0}
}
@media(prefers-reduced-motion:reduce) {
 .mobile-swipe-current,.mobile-swipe-preview,.tea-detail svg {will-change:auto}
 .tea-selection-area,.tea-selection-corners {transition:none}
}
