@font-face{
  font-family:Taiga;
  src:url('/taiga/assets/manrope.ttf') format('truetype');
  font-display:swap;
  font-weight:400}
*{
  box-sizing:border-box}
html{
  scroll-behavior:smooth;
  scroll-padding-top:30px}
body{
  margin:0;
  background:#f7f5ef;
  color:#243a2e;
  font-family:Taiga,Arial,sans-serif;
  font-size:15px;
  line-height:1.6}
button,input,select{
  font:inherit}
button,a,select{
  -webkit-tap-highlight-color:transparent}
button{
  cursor:pointer}
a{
  color:inherit;
  text-decoration:none}
button{
  color:inherit}
button:focus-visible,a:focus-visible,select:focus-visible{
  outline:2px solid #934c48;
  outline-offset:5px}
::selection{
  background:#b9c9aa;
  color:#183c30}
img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover}
button{
  border:0;
  background:none}
h1,h2,h3,p{
  margin:0}
h1,h2,h3{
  font-weight:500;
  line-height:1.08;
  letter-spacing:-.035em}
em{
  font-family:Georgia,serif;
  font-weight:400}
header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:24px 5%;
  gap:30px}
nav{
  display:flex;
  gap:36px;
  font-size:13px}
nav a:hover,footer a:hover{
  color:#8a4943}
.announcement{
  text-align:center;
  background:#183c30;
  color:#eceee2;
  font-size:11px;
  letter-spacing:.08em;
  padding:8px}
.wordmark{
  font-family:Georgia,serif;
  font-size:38px;
  letter-spacing:.06em;
  line-height:1}
.wordmark>span{
  display:block;
  font:8px Taiga,Arial,sans-serif;
  letter-spacing:.2em;
  margin-top:10px}
.bag{
  display:flex;
  gap:12px;
  align-items:center;
  font-size:13px}
.bag>span{
  border:1px solid #bfc6b8;
  border-radius:50%;
  min-width:24px;
  height:24px}
.hero{
  display:grid;
  grid-template-columns:47% 53%;
  min-height:620px;
  background:#183c30;
  color:#f5f1e4}
.hero-copy{
  padding:62px 10.5%;
  display:flex;
  align-items:flex-start;
  flex-direction:column}
.hero h1{
  font-size:clamp(55px,5.7vw,90px)}
.hero h1 em{
  color:#d3dbc2}
.hero-copy>p{
  font-size:14px;
  color:#d7ded0;
  margin-top:28px;
  line-height:1.8}
.button{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:45px;
  padding:16px 24px;
  font-size:13px;
  min-height:52px;
  transition:background .2s,color .2s}
.cream{
  background:#eeeade;
  color:#243a2e}
.cream:hover{
  background:#d6ddc8}
.hero .button{
  margin-top:32px}
.hero-foot{
  font-size:10px;
  color:#c2cebc;
  margin-top:auto;
  padding-top:36px;
  line-height:1.8}
.hero-photo{
  position:relative;
  overflow:hidden}
.hero-photo img{
  min-height:620px}
.hero-photo>span{
  position:absolute;
  bottom:35px;
  right:36px;
  font-size:11px;
  text-align:right;
  color:white;
  text-shadow:0 1px 8px #000}
.manifesto{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:45px 7%;
  border-bottom:1px solid #d9dcd1}
.manifesto>span{
  font-size:9px;
  letter-spacing:.15em}
.manifesto p{
  text-align:center;
  font-family:Georgia,serif;
  font-size:28px;
  line-height:1.3}
.section{
  padding:86px 5%}
.section-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:30px;
  margin-bottom:36px}
h2{
  font-size:clamp(34px,3.8vw,55px)}
.section-head p{
  font-size:13px;
  line-height:1.8;
  color:#626e5e}
.catalog-tools{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
  margin-bottom:30px}
.filters{
  display:flex;
  gap:8px;
  flex-wrap:wrap}
.filters button{
  padding:9px 18px;
  border:1px solid #d7dbcf;
  font-size:12px;
  min-height:42px}
.filters button[aria-pressed=true]{
  background:#243a2e;
  color:#fff;
  border-color:#243a2e}
.filters button:hover{
  border-color:#243a2e}
.sort{
  display:flex;
  gap:8px;
  font-size:11px;
  align-items:center;
  color:#626e5e}
.sort select{
  border:0;
  border-bottom:1px solid #bac1b2;
  background:transparent;
  color:#243a2e;
  padding:10px 2px;
  max-width:170px}
.products{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:36px 25px}
.product-image{
  position:relative;
  background:#ece9df;
  aspect-ratio:4/5;
  overflow:hidden;
  cursor:pointer}
.product-image img{
  transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.product-image:hover img{
  transform:scale(1.035)}
.product-image .tag{
  position:absolute;
  top:16px;
  left:16px;
  background:#f7f5ef;
  padding:5px 10px;
  font-size:9px;
  letter-spacing:.08em}
.product-info{
  padding-top:18px}
.product-info .category{
  font-size:10px;
  color:#65715f;
  letter-spacing:.08em}
.product-info h3{
  font-size:21px;
  margin:8px 0}
.product-info>p{
  font-size:12px;
  color:#626e5e}
.price-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:1px solid #cfd5c7;
  padding:18px 0 12px;
  margin-top:5px}
.price{
  font-size:14px;
  font-variant-numeric:tabular-nums}
.add{
  font-size:12px;
  padding:8px 0 8px 16px}
.add:hover{
  color:#8a4943}
.purchase-note{
  font-size:11px;
  line-height:1.8;
  color:#697260;
  margin-top:30px}
.philosophy{
  display:grid;
  grid-template-columns:1fr 1fr;
  background:#e8ecdf}
.forest-image{
  min-height:560px;
  overflow:hidden}
.forest-image img{
  object-position:70% center}
.philosophy-copy{
  padding:70px 12%}
.philosophy-copy h2{
  font-size:clamp(37px,4.4vw,64px);
  margin-bottom:30px}
.philosophy-copy>p{
  font-size:14px;
  line-height:1.9;
  margin-top:18px;
  max-width:42ch}
.philosophy-copy>a{
  display:inline-flex;
  gap:45px;
  font-size:12px;
  margin-top:32px;
  border-bottom:1px solid #8b9b80;
  padding-bottom:9px}
.steps{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:45px;
  padding-top:18px}
.steps article{
  border-top:1px solid #b7c0ad;
  padding-top:24px}
.steps article>span{
  font-size:10px;
  letter-spacing:.1em}
.steps h3{
  font-family:Georgia,serif;
  font-size:29px;
  margin-top:22px}
.steps p{
  font-size:13px;
  line-height:1.9;
  color:#626e5e;
  margin-top:17px;
  max-width:37ch}
.steps button{
  font-size:12px;
  margin-top:25px;
  padding:8px 0}
.steps button span{
  margin-left:15px}
.closing{
  background:#263e31;
  text-align:center;
  color:#f7f5e9;
  padding:65px 20px}
.closing>p{
  font-size:clamp(40px,5vw,68px);
  line-height:1.12;
  letter-spacing:-.03em}
.closing .button{
  max-width:245px;
  margin:30px auto 0}
footer{
  padding:45px 5% 24px}
.footer-top{
  display:flex;
  align-items:center;
  gap:45px;
  padding-bottom:45px}
.footer-top p{
  margin-right:auto;
  margin-left:35px;
  font-size:12px;
  color:#626e5e}
.footer-top>a:not(.wordmark){
  font-size:12px}
.footer-bottom{
  border-top:1px solid #d3d9c9;
  padding-top:24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:25px}
.footer-bottom small{
  font-size:10px;
  color:#626e5e}
.creator{
  display:inline-flex;
  align-items:center;
  gap:8px;
  opacity:.42;
  filter:grayscale(1);
  transition:opacity .25s,filter .25s;
  color:#171818;
  white-space:nowrap}
.creator>span{
  font-size:10px;
  margin-right:3px}
.creator strong{
  font-family:monospace;
  font-size:18px;
  letter-spacing:-.04em}
.creator strong span{
  color:#245be0}
.creator-mark{
  display:grid;
  place-items:center;
  width:26px;
  height:26px;
  background:#171818;
  color:#fcfcfa;
  font:600 12px monospace}
.creator:hover,.creator:focus-visible{
  opacity:1;
  filter:grayscale(0);
  color:#171818}
.creator:hover .creator-mark,.creator:focus-visible .creator-mark{
  background:#245be0}
.creator:hover strong span,.creator:focus-visible strong span{
  color:#b6d731}
dialog{
  color:#243a2e;
  background:#f7f5ef;
  border:0;
  padding:32px;
  max-height:90dvh;
  overscroll-behavior:contain}
dialog::backdrop{
  background:#11231dcc;
  backdrop-filter:blur(3px)}
body:has(dialog[open]){
  overflow:hidden}
.close{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:15px;
  font-size:12px;
  margin-left:auto;
  padding:8px 0}
.close span{
  font-size:25px;
  line-height:1}
.product-dialog{
  width:min(850px,94vw)}
#product-detail{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:36px;
  margin-top:20px}
#product-detail img{
  aspect-ratio:4/5;
  max-height:480px}
#product-detail h2{
  font-size:35px;
  margin:20px 0}
#product-detail p{
  font-size:13px;
  line-height:1.9;
  margin-bottom:20px}
#product-detail .button{
  margin-top:25px;
  background:#243a2e;
  color:#fff;
  width:100%}
.cart-dialog{
  width:min(540px,95vw);
  margin-right:0;
  margin-top:0;
  height:100dvh;
  max-height:100dvh}
.cart-heading{
  display:flex;
  align-items:center;
  gap:20px;
  border-bottom:1px solid #c8d0bd;
  padding-bottom:20px}
.cart-heading h2{
  font-size:28px}
.cart-item{
  display:grid;
  grid-template-columns:70px 1fr;
  gap:18px;
  padding:22px 0;
  border-bottom:1px solid #d7ddcf}
.cart-item img{
  height:95px}
.cart-item h3{
  font-size:17px;
  margin-bottom:5px}
.cart-item p{
  font-size:12px}
.quantity{
  display:flex;
  align-items:center;
  gap:12px;
  margin-top:8px}
.quantity button{
  min-width:32px;
  min-height:32px;
  border:1px solid #bdc9b2}
.quantity .remove{
  border:0;
  font-size:11px;
  margin-left:auto}
.total{
  display:flex;
  justify-content:space-between;
  font-size:20px;
  margin:28px 0}
#cart-summary .button{
  background:#243a2e;
  color:white;
  width:100%}
.empty{
  padding:55px 0}
.empty h3{
  font-size:25px;
  margin-bottom:15px}
.empty p{
  font-size:13px;
  color:#626e5e}
#toast{
  position:fixed;
  bottom:25px;
  left:50%;
  transform:translate(-50%,20px);
  background:#183c30;
  color:white;
  padding:14px 24px;
  font-size:12px;
  opacity:0;
  pointer-events:none;
  transition:opacity .2s,transform .2s;
  z-index:10;
  max-width:90vw;
  width:max-content}
#toast.visible{
  opacity:1;
  transform:translate(-50%,0)}
@media(min-width:1600px){
  body{
  max-width:1800px;
  margin:auto}
}
@media(max-width:760px){
  header{
  padding:20px 5%;
  gap:15px}
.wordmark{
  font-size:30px}
.wordmark>span{
  font-size:7px}
nav{
  display:none}
.bag{
  font-size:12px}
.hero{
  grid-template-columns:1fr;
  min-height:0}
.hero-copy{
  padding:40px 7% 35px}
.hero h1{
  font-size:61px}
.hero-copy>p{
  font-size:13px;
  margin-top:22px}
.hero-foot{
  display:none}
.hero .button{
  margin-top:25px}
.hero-photo{
  height:390px}
.hero-photo img{
  min-height:0;
  object-position:65% center}
.hero-photo>span{
  bottom:22px;
  right:22px}
.manifesto{
  padding:30px 6%}
.manifesto>span{
  font-size:7px;
  max-width:60px;
  line-height:1.8}
.manifesto p{
  font-size:22px}
.section{
  padding:55px 5%}
.section-head{
  align-items:flex-start;
  gap:20px;
  margin-bottom:25px}
.section-head h2{
  font-size:35px;
  max-width:230px}
.section-head p{
  font-size:11px;
  max-width:125px}
.catalog-tools{
  align-items:flex-start;
  flex-direction:column;
  gap:15px}
.filters{
  gap:6px}
.filters button{
  padding:9px 12px;
  font-size:11px}
.sort{
  align-self:flex-end}
.sort select{
  font-size:11px;
  padding:6px}
.products{
  grid-template-columns:repeat(2,1fr);
  gap:28px 14px}
.product-image .tag{
  top:9px;
  left:9px;
  font-size:8px;
  padding:4px 6px}
.product-info h3{
  font-size:18px}
.product-info>p{
  font-size:11px}
.product-info .category{
  font-size:8px}
.price-row{
  flex-wrap:wrap;
  gap:3px;
  padding-top:9px}
.add{
  padding:6px 0;
  font-size:11px}
.price{
  font-size:12px}
.philosophy{
  grid-template-columns:1fr}
.forest-image{
  height:340px;
  min-height:0}
.philosophy-copy{
  padding:40px 7% 45px}
.philosophy-copy h2{
  font-size:43px}
.steps{
  grid-template-columns:1fr;
  gap:30px}
.steps h3{
  margin-top:14px}
.steps p{
  max-width:none}
.steps button{
  margin-top:14px}
.closing{
  padding:50px 20px}
.footer-top{
  gap:22px;
  flex-wrap:wrap;
  padding-bottom:30px}
.footer-top p{
  margin:0;
  font-size:10px}
.footer-top>a:not(.wordmark){
  font-size:11px}
.footer-bottom{
  flex-direction:column;
  align-items:flex-start;
  gap:22px}
.creator{
  align-self:flex-end}
dialog{
  padding:22px}
#product-detail{
  grid-template-columns:1fr;
  gap:15px}
#product-detail img{
  height:300px;
  object-fit:contain;
  background:#eeeade}
#product-detail h2{
  font-size:30px}
.cart-dialog{
  width:100vw}
.cart-heading h2{
  font-size:26px}
}
@media(prefers-reduced-motion:reduce){
  html{
  scroll-behavior:auto}
*,*::before,*::after{
  transition:none!important;
  animation:none!important}
}


/* Keep secondary labels readable at compact widths. */
.wordmark>span,.product-info .category,.product-image .tag,.hero-foot,.hero-photo>span,.manifesto>span,.steps article>span,.footer-top p,.footer-bottom small,.creator>span{
  font-size:11px}
.announcement{
  letter-spacing:.03em}
.product-info>p,.section-head p,.purchase-note{
  font-size:12px}
.quantity button:disabled{
  opacity:.4;
  cursor:default}

@media(max-width:760px){
  .hero h1{
  font-size:clamp(44px,13vw,61px)}
.manifesto>span{
  max-width:83px;
  font-size:9px}
.manifesto p{
  font-size:20px}
.wordmark>span{
  letter-spacing:.12em}
}


.product-image:focus-visible{
  outline:2px solid #934c48;
  outline-offset:5px}

.catalog-search{
  display:flex;
  align-items:center;
  gap:20px;
  border-bottom:1px solid #cfd5c7;
  padding:4px 0 18px;
  margin-bottom:28px}
.catalog-search label{
  font-size:12px}
.catalog-search input{
  flex:1;
  max-width:330px;
  border:0;
  background:transparent;
  color:#243a2e;
  padding:12px 0;
  outline-offset:3px;
  min-width:0}
.catalog-search input::placeholder{
  color:#626e5e}
.catalog-search>span{
  margin-left:auto;
  font-size:12px;
  color:#626e5e;
  font-variant-numeric:tabular-nums}
.products{
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:36px 22px}
.products>article{
  display:flex;
  flex-direction:column;
  min-width:0}
.product-image{
  display:block;
  padding:0;
  width:100%;
  text-align:left;
  background:#eeeee7}
.product-image img{
  object-fit:contain}
.product-info{
  display:flex;
  flex:1;
  flex-direction:column}
.product-info h3{
  font-size:20px;
  line-height:1.25;
  min-height:2.5em}
.product-title{
  padding:0;
  text-align:left;
  font:inherit;
  letter-spacing:inherit}
.product-info>p{
  font-size:12px;
  min-height:3.2em}
.price-row{
  margin-top:auto}
.product-image .tag{
  background:#ffffffc9;
  font-size:10px;
  backdrop-filter:blur(4px)}
.detail-subtitle{
  font-size:17px;
  margin:25px 0 12px}
.purchase-note{
  font-size:12px;
  line-height:1.8;
  color:#626e5e;
  margin-top:20px}
.checkout-unavailable:disabled{
  background:#dce1d4!important;
  color:#56634d!important;
  cursor:not-allowed;
  justify-content:center;
  font-size:12px}
.search-empty{
  grid-column:1/-1;
  padding:40px 0}
.search-empty .button{
  margin-top:20px}
.forest-image img{
  object-position:center}
.announcement{
  font-size:12px}
.section{
  padding-top:96px;
  padding-bottom:96px}
@media(max-width:1050px) and (min-width:761px){
  .products{
  grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:760px){
  .products{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:30px 14px}
.product-info h3{
  font-size:17px}
.product-image .tag{
  font-size:9px}
.catalog-search{
  gap:10px;
  flex-wrap:wrap}
.catalog-search label{
  width:100%;
  font-size:11px}
.catalog-search input{
  font-size:13px;
  padding:7px 0}
.catalog-search>span{
  font-size:11px}
.section{
  padding-top:56px;
  padding-bottom:56px}
.hero-photo{
  height:355px}
.forest-image{
  height:400px}
.price-row{
  gap:8px}
.add{
  min-height:36px}
.creator{
  opacity:.64}
}

.product-image{aspect-ratio:1}
.announcement{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;padding:10px 5%}.portfolio-back{display:inline-flex;align-items:center;gap:9px;justify-self:start;font-size:12px;line-height:1.5;transition:opacity .2s}.portfolio-back:hover{opacity:.72}.portfolio-back:focus-visible{outline-color:#eeeade}@media(max-width:760px){.announcement{display:flex;min-height:38px}.announcement>span{display:none}}