
:root{
  --lavender:#d5cfe9;
  --ink:#0c0c0c;             
  --ink-h:#0d0c0c;           
  --ink-60:rgba(13,12,12,.6);
  --rule:#b8adde;
  --serif:"STIX Two Text",Georgia,serif;
  --sans:"Inter",system-ui,sans-serif;
  --side:80px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--lavender);color:var(--ink);font-family:var(--serif);font-size:18px;line-height:1.08;letter-spacing:-.05em;font-weight:400;overflow-x:hidden;-webkit-font-smoothing:antialiased}
img,video{display:block}
a{color:inherit;text-decoration:none}
p{margin:0}
h1,h2{margin:0;font-weight:400;color:var(--ink-h)}
h1{font-size:61px;line-height:1.1;letter-spacing:-.03em}
h2{font-size:36px;line-height:1.1;letter-spacing:-.05em;font-weight:600;color:var(--ink)}
.orn{color:var(--ink-60)}
em{font-style:italic}
p,h1,h2,.t-title,.t-type{white-space:pre-wrap;text-wrap:balance;word-break:break-word;overflow-wrap:break-word}
:root{--line:#aea8c2;--line-2:#9a94ae;--line-dark:#222}
.page-text{--line:#0c0c0c;--line-2:#0c0c0c}
.nav{position:relative;height:80px;padding:0 var(--side);border-bottom:1px solid var(--line)}
.nav .logo{position:absolute;left:var(--side);top:22px;display:block}
.nav .logo img{width:148px;height:72px;object-fit:contain}
.nav .cart{position:absolute;right:var(--side);top:24px;width:32px;height:32px;border-radius:80px;display:flex;justify-content:center;align-items:center;box-shadow:inset 0 0 0 1px #000;font-family:var(--sans);font-size:16px;line-height:16px;letter-spacing:0;color:#000}
.nav .cart .cart-t{display:none}
.tabs{display:flex;align-items:center;gap:32px;height:72px;padding:0 var(--side);font-size:16px;line-height:1.2;letter-spacing:0;border-bottom:1px solid var(--line)}
.tabs a{display:inline-flex;align-items:center;gap:8px;color:rgba(0,0,0,.6);font-weight:400;text-align:center}
.tabs a::before{content:"";width:10px;height:10px;border-radius:50%;background:#6c78d1;display:none}
.tabs a.on{color:#000;font-weight:500}
.tabs a.on::before{display:block}
.page-text .tabs a{color:var(--ink);letter-spacing:-.05em;height:16px;line-height:19.2px;align-items:flex-start;overflow:visible}
.page-home{background:#dfe4ed;overflow:hidden}
.page-home .nav{position:fixed;top:0;left:0;right:0;z-index:3;display:none}
.hero{position:fixed;inset:0}
.hero .collage{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero .liquid{position:absolute;display:none;pointer-events:none}
.hero.gl .liquid{display:block}
.hero.gl .collage{visibility:hidden}
.cta-bar{position:fixed;left:2.5%;width:95%;bottom:22px;height:47px;display:flex;justify-content:center;align-items:center;background:#000;color:#fff;font-size:12px;font-weight:700;letter-spacing:0;line-height:1.2;z-index:2}
.pdp{display:grid;grid-template-columns:minmax(0,1fr) calc(40vw - 32px);padding-right:var(--side);height:100vh;min-height:640px}
.carousel{display:flex;gap:2px;height:100%;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;background:#e8eef6}
.carousel::-webkit-scrollbar{display:none}
.carousel img{height:100%;width:auto;max-width:none;flex:none;scroll-snap-align:start;object-fit:cover}
.pdp-copy{align-self:center;padding:48px 64px;display:flex;flex-direction:column;gap:48px}
.pdp-text,.pdp-head{display:flex;flex-direction:column;gap:16px}
.desc p{margin-bottom:1.08em}
.desc p:last-child{margin-bottom:0}
.buy button{width:100%;height:56px;display:flex;justify-content:space-between;align-items:center;background:#000;color:#fff;border:0;padding:0 24px;font-family:var(--serif);cursor:pointer}
.buy button .cta{font-size:12px;line-height:1.2;font-weight:700;letter-spacing:0;text-transform:uppercase}
.buy button .price{font-size:14px;line-height:14px;font-weight:500;letter-spacing:0}
.buy button:disabled{opacity:.5;cursor:default}
.details{display:grid;grid-template-columns:minmax(0,1fr) 449px}
.details-text .chemical{padding:40px var(--side) 31px;display:flex;flex-direction:column;gap:40px;border-bottom:1px solid var(--line-2)}
.details-text .specs{padding:32px var(--side);display:flex;flex-direction:column;gap:40px}
.sec-head{display:flex;flex-direction:column;gap:16px}
.details-video{position:sticky;top:0;width:100%;height:100vh;object-fit:cover}
.ingredients{list-style:none;margin:0;padding:0;display:flex;justify-content:space-between;text-align:center}
.ingredients li{display:flex;flex-direction:column;align-items:center;gap:16px;width:135px}
.ingredients img{width:135px;height:135px;object-fit:cover}
.spec-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.spec-list li{border-bottom:1px solid var(--rule);padding-bottom:8px}
.spec-list li:last-child{border-bottom:0;padding-bottom:0}
.spec-list li.row,.spec-list summary{display:flex;align-items:center;min-height:48px}
.spec-list li.row{min-height:57px}
.spec-list li.row p{width:100%}
.spec-list li.row:last-child{min-height:48px}
.spec-list details summary{cursor:pointer;list-style:none;justify-content:space-between}
.spec-list details summary::-webkit-details-marker{display:none}
.spec-list .chev{font-weight:500;align-self:flex-start;margin-top:11px}
.spec-list details>div{padding:8px 0 16px}
.spec-list .toc-title{margin-bottom:12px;font-weight:600}
.spec-list .toc-ch{margin:12px 0 6px;font-weight:600}
.spec-list .toc{margin:0;padding:0;list-style:none}
.spec-list .toc li{border:0;padding:3px 0}
.spec-list details p+p{margin-top:10px}
.texts{padding:39px var(--side) 39px;display:flex;flex-direction:column;gap:40px;border-top:1px solid var(--line-dark);border-bottom:1px solid var(--line-dark)}
.texts .sec-head{width:1040px;max-width:none}
.texts-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;column-gap:160px;row-gap:20px}
.texts-list a{display:flex;align-items:center;gap:10px;height:80px}
.texts-list img{width:30px;height:80px;object-fit:cover;flex:none}
.texts-list .t-title{color:var(--ink-h);text-align:center}
.texts-list .t-type{color:var(--ink-60);text-align:center}
.soon{position:relative;height:450px;overflow:hidden}
.soon img{width:100%;height:100%;object-fit:cover}
.soon h2{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:1040px;text-align:center;color:#fff}
.soon .orn-w{color:rgba(255,255,255,.6)}
.footer{position:relative;background:rgba(255,255,255,.25);height:450px;padding:79px var(--side) 80px;border-top:1px solid #0d0c0c;display:grid;grid-template-columns:419px 1fr;grid-template-rows:auto;align-items:start;column-gap:40px}
.footer-left{display:flex;flex-direction:column;gap:24px;align-items:flex-start}
.footer-left .ava-mark{width:63px;height:75px;object-fit:contain}
.footer-line{font-size:32px;line-height:1.2;letter-spacing:-.06em;color:#000;width:419px}
.footer-line-phone{display:none}
.typewriter{width:311px;height:300px;flex:none;object-fit:cover;justify-self:end;margin:-36px -63px 0 0}
.footer-links{position:absolute;left:var(--side);right:var(--side);bottom:80px;display:flex;justify-content:space-between}
.footer-links a{color:var(--ink);line-height:1.08;text-align:center}
.page-text .footer{height:540px}
.page-text{background:var(--bg,#8bbbec)}
.page-text .top{position:sticky;top:0;z-index:1;background:var(--bg,#8bbbec)}
.essay{padding:56px var(--side) 0;display:flex;flex-direction:column;gap:40px}
.essay-head{display:flex;flex-direction:column;gap:15px}
.essay-head .meta{display:flex}
.essay-head .meta p{width:50%;color:var(--ink-h)}
.essay-head .meta .date{text-align:right}
.essay-hero{width:100%;height:500px;object-fit:cover;margin-top:-7px}
.player{width:1024px;max-width:100%;height:105px;margin:0 auto;display:flex;align-items:center;gap:18px;padding:15px;background:rgba(0,0,0,.04)}
.player .play{width:45px;height:45px;border-radius:50%;border:0;background:var(--player);color:#fff;display:flex;justify-content:center;align-items:center;cursor:pointer;flex:none;padding:0;box-shadow:0 .82px 1.64px 0 rgba(8,8,8,.1),inset 0 4.91px 9.82px 0 rgba(255,255,255,.12),inset 0 .82px .82px 0 rgba(255,255,255,.2)}
.player .play svg{width:28px;height:28px;fill:currentColor}
.player .play .ico-play{transform:translate(1.1px,.6px)}   
.player .ico-pause,.player.playing .ico-play{display:none}
.player.playing .ico-pause{display:block}
.player .bars{flex:1;display:flex;justify-content:space-between;align-items:center;height:75px;overflow:hidden}
.player .bars i{display:block;width:3px;border-radius:12px;background:var(--player);transition:background .2s;transform-origin:center}
.player.playing .bars i{animation:bar-breathe 1.4s ease-in-out infinite alternate}
@keyframes bar-breathe{0%{transform:scaleY(1)}25%{transform:scaleY(.8)}50%{transform:scaleY(1.2)}75%{transform:scaleY(.9)}90%{transform:scaleY(1.1)}100%{transform:scaleY(1)}}
@media (prefers-reduced-motion:reduce){.player.playing .bars i{animation:none}}
.player .bars i.on{background:#fff}
.essay-body{width:1000px;max-width:100%;margin:0 auto;text-align:center}
.essay-body p{margin-bottom:1.08em}
.essay-body p:last-child{margin-bottom:0}
.essay-body{padding-bottom:17px}
.essay-body img{margin:24px auto}
.essay .texts{padding-left:0;padding-right:0}
.film{background:#000}
.film video{width:100%;aspect-ratio:1440/807;display:block;object-fit:cover}
.notfound{padding:20vh var(--side);text-align:center}
@media (min-width:810px) and (max-width:1199px){
  h2{font-size:34px;letter-spacing:-.05em}
  .pdp{display:block;height:auto;min-height:0;padding-right:0}
  .carousel{height:40vh}
  .pdp-copy{padding:48px 64px}
  .details{display:block}
  .ingredients li,.ingredients img{width:90px}
  .ingredients img{height:90px}
  .details-video{position:static;height:900px;object-fit:fill}
  .page-product .texts{padding:39px 40px}
  .page-product .texts-list{width:1000px}
  .texts-list{column-gap:80px}
  .page-text .nav,.page-text .tabs{--side:40px}
  .essay{padding:48px 40px 0;gap:32px}
  .essay-hero{margin-top:-8px}
  .essay-body{padding-bottom:16px}
  .player{width:736px}
  .page-text .texts{padding:40px 40px}
  .page-text .texts-list{width:920px}
  .page-text .footer{height:360px}
  .page-text .footer-left .ava-mark{width:49px;height:59px}
}
@media (max-width:809px){
  :root{--side:24px}
  h1{font-size:40px;letter-spacing:-.03em}
  h2{font-size:24px;line-height:1.25;letter-spacing:-.5px}
  .tabs{height:56px;font-size:18px;line-height:1.08;letter-spacing:-.05em}
  .tabs a,.tabs a.on{color:var(--ink);font-weight:400}
  .page-product .tabs{height:72px;gap:35px}
  .page-home .nav{display:block}
  .page-home .nav .logo{top:16px}
  .page-home .nav .logo img{width:131px;height:64px}
  .page-home .nav .cart{width:auto;height:auto;box-shadow:none;top:24px;font-family:var(--serif);font-size:14px;line-height:1.2;font-weight:500;text-align:center}
  .page-home .nav .cart .cart-n{display:none}
  .page-home .nav .cart .cart-t{display:inline}
  .cta-bar{left:12px;width:auto;right:12px;bottom:24px;height:46px}
  .pdp{display:block;height:auto;min-height:0;padding-right:0}
  .carousel{height:55vh}
  .pdp-copy{padding:32px 24px 40px;gap:16px}
  .pdp-head{gap:12px}
  .pdp-head .orn{font-size:16px;font-weight:600;letter-spacing:0;line-height:1.2}
  .buy{position:fixed;left:20px;right:19px;bottom:8px;z-index:4}
  .buy button .cta{font-size:14px;line-height:14px;letter-spacing:-.01em;text-transform:none}
  .details{display:block}
  .details-text .chemical{padding:23px 24px 30px;gap:24px;border-bottom:0;border-top:1px solid var(--line-2)}
  .details-text .specs{padding:23px 24px 30px;gap:24px;border-top:1px solid var(--line-2)}
  .sec-head{gap:12px}
  .ingredients li,.ingredients img{width:99px}
  .ingredients img{height:99px}
  .ingredients li span{color:var(--ink-h)}
  .details-video{position:static;height:693px;object-fit:fill;margin-bottom:72px}
  .texts{padding:31px 24px 39px;gap:24px}
  .texts-list{grid-template-columns:1fr;row-gap:8px}
  .texts-list img{width:20px}
  .soon{height:300px}
  .footer{height:598px;padding:31px 24px 32px;display:flex;flex-direction:column;align-items:stretch}
  .footer-left .ava-mark{width:43px;height:52px}
  .footer-line{display:none}
  .footer-line-phone{display:block;align-self:stretch;font-size:24px;line-height:1.2;letter-spacing:-.06em;color:#000}
  .typewriter{margin:90px auto 0;justify-self:auto}
  .footer-links{bottom:32px}
  .page-text .footer{height:594px}
  .essay{padding:32px 24px 0;gap:24px}
  .essay-head{gap:24px}
  .essay-hero{margin-top:0}
  .essay-body{padding-bottom:8px}
  .page-text .tabs{font-size:16px;line-height:1.2;letter-spacing:-.05em}
  .player{width:100%}
}
