@font-face{font-family:"Courier Prime";src:url("https://fonts.gstatic.com/s/courierprime/v11/u-450q2lgwslOqpF_6gQ8kELWwNjW-_-tvg.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
:root{color-scheme:dark;--black:#000;--white:#fff;--font:"Courier Prime","Courier New",monospace;--hero-height:931px;--hero-image:url("assets/artists.avif")}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--black);color:var(--white);font-family:var(--font);font-size:14px}button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}button{color:inherit;background:none;border:0;padding:0;cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible{outline:1px solid white;outline-offset:5px}button:hover,a:hover{color:#d0d0d0}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:fixed;top:8px;left:8px;z-index:100;background:black;padding:12px;transform:translateY(-200%)}.skip-link:focus{transform:none}
.hero{height:var(--hero-height);position:relative;isolation:isolate;overflow:hidden;background:#000}.hero-video,.collection-still,.collection-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:-2}.hero-video{opacity:.62}.hero-video:not(.is-ready){opacity:0}.introduction{position:absolute;left:calc(50% + 15px);top:365px;transform:translateX(-50%);width:403px;font-size:15px;line-height:24px}.introduction h1,.introduction p{font:inherit;margin:0 0 20px}.introduction p:last-child{margin-bottom:0}
.site-header{height:60px;position:relative;z-index:20}.navigation{height:100%;border:1px solid #222;background:#000;display:flex;align-items:center;padding:0 6.2% 0 2.9%;position:relative;gap:25px}.brand{display:flex;align-items:center;flex-shrink:0}.brand img{width:50px;height:auto}.search{position:absolute;left:16.3%;width:28%;top:12px}.search input{height:40px;width:100%;background:transparent;border:1px solid #343434;border-radius:0;padding:0 12px;color:white;font:14px Arial,sans-serif}.search input::placeholder{color:#888}.desktop-links{margin-left:auto;display:flex;align-items:center;gap:28px;height:100%}.desktop-links>a,.desktop-links button,.cart{font-size:14px;line-height:22.4px;white-space:nowrap}.nav-item{position:relative;height:100%;display:flex;align-items:center}.nav-item>button{height:100%}.dropdown{position:absolute;left:0;top:100%;width:148px;padding:4px 14px 30px;background:rgba(0,0,0,.65);backdrop-filter:blur(12px);border-radius:0 0 24px 24px;display:flex;flex-direction:column;z-index:30}.dropdown a{line-height:31px;font-size:14px;white-space:nowrap}.dropdown a:hover{text-decoration:underline;text-underline-offset:4px}.mobile-toggle{display:none}.search-results{position:absolute;top:44px;left:0;right:0;max-height:320px;overflow:auto;background:rgba(0,0,0,.96);border:1px solid #333;padding:10px;box-shadow:0 10px 30px #0008}.search-results a{display:block;padding:10px 4px}.search-results p{margin:8px 4px;font-size:13px;line-height:1.5}.search-results small{display:block;font-size:11px;color:#999;margin-bottom:6px}
.collections{height:816px;position:relative;isolation:isolate;padding:118px 2.1% 48px .5%;overflow:hidden}.collection-still,.collection-video{opacity:.2}.collection-video:not(.is-ready){opacity:0}.collection-still{z-index:-3;filter:blur(12px)}.collection-grid{display:grid;grid-template-columns:1.08fr .95fr 1.08fr;gap:18px;height:100%}.collection-card{position:relative;display:grid;place-items:center;overflow:hidden;isolation:isolate;min-width:0}.collection-card img{position:absolute;width:100%;height:100%;object-fit:cover;object-position:center;z-index:-1;filter:brightness(.75);transition:transform .65s ease,filter .65s ease}.collection-card:hover img{transform:scale(1.035);filter:brightness(.87)}.collection-card h2{margin:0;font-size:38px;line-height:1.1;font-weight:400;color:white;text-align:center}.footer{position:relative;min-height:186px;padding:63px 3.1% 24px 4.8%;font:12px/1.6 "Courier New",monospace}.socials{display:flex;justify-content:center;gap:36px;align-items:center;height:20px}.socials img{object-fit:contain;width:20px;height:20px}.footer-brand{position:absolute;left:4.8%;top:137px}.footer-brand img{object-fit:contain}.policies{display:flex;justify-content:space-between;gap:20px;margin-top:49px;margin-left:14.1%;white-space:nowrap}.mobile-menu{margin:0;max-width:none;max-height:none;width:100%;height:100dvh;border:0;padding:0;color:white;background:linear-gradient(#000c,#000e),var(--hero-image) center/cover;overflow:auto}.mobile-menu::backdrop{background:black}.mobile-menu-top{height:64px;display:flex;align-items:center;justify-content:center;background:#0009;position:sticky;top:0;z-index:1}.close-menu{position:absolute;left:14px;top:15px;font:28px/32px Arial,sans-serif}.mobile-menu-top img{object-fit:contain}.mobile-menu-links{padding:140px 20px 70px;display:flex;flex-direction:column;align-items:center;gap:20px;font-size:16px}.mobile-submenu{display:flex;flex-direction:column;gap:14px;align-items:center;padding:10px 0 20px;font-size:14px;color:#ccc}.mobile-menu-links>button{font-size:16px}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}.hero-video,.collection-video{display:none}}

/* Original introduction uses -0.02em tracking. */
.introduction{letter-spacing:-.02em}

/* Reveal the opening copy one line at a time, from top to bottom. */
.intro-group .intro-line{display:block}
.intro-line{opacity:0;will-change:opacity;animation:roji-intro-reveal 3s ease forwards}
.introduction>.intro-line:nth-child(1){animation-delay:.4s}
.intro-group .intro-line:nth-child(1){animation-delay:.7s}
.intro-group .intro-line:nth-child(2){animation-delay:1s}
.intro-group .intro-line:nth-child(3){animation-delay:1.3s}
.introduction>.intro-line:nth-child(3){animation-delay:1.6s}
.introduction>.intro-line:nth-child(4){animation-delay:1.9s}
@keyframes roji-intro-reveal{to{opacity:1}}
@media(prefers-reduced-motion:reduce){.intro-line{opacity:1;animation:none}}


/* Fluid sizing: normal document flow, proportional media, and content-safe navigation. */
.hero{height:auto;min-height:clamp(34rem,73vw,70rem);display:grid;place-items:center;padding:clamp(6rem,16vw,18rem) 5%}
.introduction{position:relative;left:auto;top:auto;transform:none;width:max-content;max-width:100%;font-size:clamp(.75rem,1.18vw,1.125rem);line-height:1.6;overflow-wrap:break-word}
.introduction h1,.introduction p{margin-bottom:1.333em}
.site-header{height:auto;margin:0}
.navigation{min-height:clamp(3.75rem,4.7vw,5rem);height:auto;display:grid;grid-template-columns:auto minmax(8rem,1fr) auto auto;gap:clamp(1rem,2vw,2.5rem);padding:.65rem 3%}
.brand img{width:clamp(2.75rem,4vw,4rem);height:auto}
.search{position:relative;inset:auto;width:100%;max-width:28rem;margin:0 auto}
.search input{height:2.5rem;font-size:1rem}
.desktop-links{margin:0;gap:clamp(.9rem,2.2vw,2.5rem);align-self:stretch}
.desktop-links>a,.desktop-links button,.cart{font-size:clamp(.875rem,1.1vw,1.125rem);line-height:1.6}
.desktop-links>a{display:flex;align-items:center}
.search-results{top:calc(100% + .3rem);max-height:min(20rem,50dvh);overflow-wrap:anywhere}
.collections{height:auto;margin:0;padding:clamp(1.25rem,9.2vw,9rem) 1.5% clamp(1.5rem,3.75vw,4rem)}
.collection-grid{height:auto;gap:clamp(.4rem,1.4vw,1.75rem);grid-template-columns:repeat(3,minmax(0,1fr))}
.collection-card{aspect-ratio:.63;min-height:0;padding:1rem .15rem;container-type:inline-size}
.collection-card h2{font-size:clamp(.875rem,3vw,3.5rem);font-size:clamp(.75rem,9.4cqw,3.5rem);overflow-wrap:anywhere;max-width:100%}
.footer{height:auto;min-height:0;padding:clamp(2rem,5vw,5rem) 4% 2rem;display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(1.5rem,4vw,4rem);align-items:center;font-size:clamp(.75rem,.95vw,1rem)}
.socials{position:static;grid-column:1/-1;gap:clamp(1rem,2.8vw,3rem);height:auto;flex-wrap:wrap}
.socials img{width:clamp(.9rem,1.6vw,1.5rem);height:auto;aspect-ratio:1}
.footer-brand{position:static;transform:none}.footer-brand img{width:clamp(2.5rem,4vw,4rem);height:auto}
.policies{margin:0;gap:1rem 2rem;flex-wrap:wrap;justify-content:space-between;white-space:normal}
.mobile-menu-links{padding:clamp(3rem,16vh,9rem) 1.25rem 4rem}
@media(max-width:64rem){
 .navigation{grid-template-columns:2.75rem minmax(0,1fr) auto;gap:.75rem 1rem;padding:.6rem 4%;border-radius:0 0 1.5rem 1.5rem}
 .mobile-toggle{display:block;position:static;font:1.8rem/1 Arial,sans-serif;min-height:2.75rem;min-width:2.75rem;grid-column:1;grid-row:1}
 .brand{position:static;transform:none;justify-self:center;grid-column:2;grid-row:1}
 .cart{position:static;grid-column:3;grid-row:1;font-size:.875rem;min-height:2.75rem;display:flex;align-items:center}
 .desktop-links{display:none}
 .search{grid-column:1/-1;grid-row:2;max-width:none}
 .search-results{width:100%;left:0;right:0}
 .hero{min-height:clamp(30rem,85svh,58rem)}
 .introduction{font-size:clamp(.75rem,1.65vw,1rem)}
 .footer{grid-template-columns:auto minmax(0,1fr);gap:1.5rem}
 .policies{justify-content:flex-start;gap:.75rem 1.25rem}
}
@media(max-width:30rem){
 .hero{padding-inline:6%;min-height:clamp(28rem,85svh,44rem)}
 .introduction{width:100%;font-size:clamp(.75rem,3vw,.875rem)}
 .collections{padding-top:1rem}
 .collection-card{aspect-ratio:.38}
 .footer{grid-template-columns:1fr auto;align-items:start;padding:1.5rem 5%}
 .socials{grid-column:1/-1;justify-content:center}
 .footer-brand{grid-column:2;grid-row:2;align-self:center}
 .policies{grid-column:1;grid-row:2;flex-direction:column;font-size:.75rem;gap:.75rem}
}
/* Keep section proportions continuous across navigation breakpoints. */
.hero{min-height:clamp(28rem,max(73vw,85svh),70rem)}
.collection-card{aspect-ratio:auto;min-height:clamp(15rem,calc(35vw + 10rem),65rem)}

/* Shared translucent navigation, matching the Shop All Tea header. */
:root body .site-header{background:transparent}
:root body .site-header .navigation{background:rgba(0,0,0,.6);color:#fff;border-color:#ffffff20;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
/* Desktop menus span the navigation bar, with a simple left-aligned list. */
@media(min-width:64.001rem){
  .navigation .desktop-links,.navigation .nav-item{position:static}
  .navigation .dropdown{left:0;right:0;top:100%;width:auto;box-sizing:border-box;border-radius:0;border-top:1px solid #ffffff20;border-bottom:1px solid #ffffff20;padding:32px clamp(28px,8vw,160px) 40px;background:rgba(20,20,20,.94);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);align-items:flex-start;gap:0;max-height:calc(100dvh - 100px);overflow-y:auto;box-shadow:0 16px 24px #0002}
  .navigation .dropdown a{display:block;flex:none;line-height:1.6;font-size:14px;padding:7px 0;white-space:normal;max-width:100%;text-align:left}
  .navigation .nav-item>button[aria-expanded=true]{text-decoration:underline;text-underline-offset:6px}
}
/* Glass surfaces shared by search and navigation menus. */
:root{--roji-nav-inset:3vw;--roji-glass-edge:rgba(0,0,0,.65);--roji-glass-surface:linear-gradient(135deg,rgba(255,255,255,.07),rgba(255,255,255,.015) 48%,rgba(255,255,255,.035)),rgba(7,9,10,.84)}
:root body .navigation .search input{background:linear-gradient(125deg,#ffffff0c,#ffffff03),rgba(8,10,12,.72);border:1px solid var(--roji-glass-edge);border-radius:999px;padding-inline:18px;color:#fff;box-shadow:inset 0 1px 0 #ffffff0a,inset 0 -1px 0 #00000030,0 5px 18px #0002;-webkit-backdrop-filter:blur(20px) saturate(150%);backdrop-filter:blur(20px) saturate(150%);transition:border-color .2s ease,box-shadow .2s ease}
:root body .navigation .search input::placeholder{color:#d0d2d4}
:root body .navigation .search input:focus-visible{outline:2px solid #ffffffa6;outline-offset:3px;border-color:#ffffff70;box-shadow:inset 0 1px 0 #ffffff40,0 6px 24px #0003}
:root body .navigation .dropdown,:root body .navigation .search-results{background:var(--roji-glass-surface);border:1px solid var(--roji-glass-edge);-webkit-backdrop-filter:blur(28px) saturate(160%);backdrop-filter:blur(28px) saturate(160%);box-shadow:inset 0 1px 0 #ffffff0a,inset 0 -1px 0 #00000030,0 20px 45px #0004;color:#f5f5f7}
:root body .navigation .search-results{border-radius:20px;padding:12px;top:calc(100% + 10px)}
:root body .navigation .search-results a{border-radius:10px;padding:10px 12px}
:root body .navigation .search-results small{color:#c5c7ca;padding:6px 12px}
:root body .navigation .dropdown a:hover,:root body .navigation .dropdown a:focus-visible,:root body .navigation .search-results a:hover,:root body .navigation .search-results a:focus-visible{background:#ffffff16;color:#fff}
@media(min-width:64.001rem){
 :root body .site-header .navigation{padding-inline:var(--roji-nav-inset)}
 :root body .navigation .dropdown{padding:26px var(--roji-nav-inset) 34px;border-radius:0 0 24px 24px}
 :root body .navigation .dropdown a{border-radius:8px;padding:8px 12px;margin-left:-12px;min-width:180px;max-width:100%;box-sizing:border-box}
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){:root body .navigation .dropdown,:root body .navigation .search-results{background:#1c1e20f5}}
@media(prefers-reduced-transparency:reduce){:root body .navigation .dropdown,:root body .navigation .search-results,:root body .navigation .search input{background:#1c1e20;-webkit-backdrop-filter:none;backdrop-filter:none}}
/* Immediate stills while decorative video buffers. */
.video-still{pointer-events:none;object-fit:cover}.video-still[hidden]{display:none!important}.tea-opening .video-still{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover}.product-page .video-still.page-background-video{opacity:.46;filter:brightness(.62) saturate(.72)}