@import "https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400;1,500&family=Manrope:wght@400;500;600;700&display=swap";
:root{
  --paper:#fbf8f0;
  --ink:#3e493e;
  --green:#6b8174;
  --muted:#828579;
  --rose:#b77673;
  --line:#deded0;
  --serif:"Cormorant Garamond",Georgia,serif;
  --sans:"Manrope",Arial,sans-serif
}
*{
  box-sizing:border-box
}
html{
  scroll-behavior:smooth;
  scroll-padding-top:110px
}
body{
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  margin:0;
  font-size:14px;
  line-height:1.7
}
body:before{
  content:"";
  pointer-events:none;
  opacity:.035;
  z-index:50;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.7' filter='url(%23n)'/%3E%3C/svg%3E");
  position:fixed;
  inset:0
}
button,
input,
select,
textarea{
  font:inherit
}
button,
a,
input,
textarea,
select{
  -webkit-tap-highlight-color:transparent
}
button{
  cursor:pointer;
  color:inherit
}
button:disabled{
  opacity:.45;
  cursor:not-allowed
}
button{
  background:0 0;
  border:0
}
a{
  color:inherit;
  text-decoration:none
}
a,
button{
  touch-action:manipulation
}
:is(button:focus-visible,
a:focus-visible){
  outline:2px solid var(--rose);
  outline-offset:5px
}
img{
  max-width:100%;
  display:block
}
h1,
h2,
h3,
p{
  margin-top:0
}
h1,
h2,
h3{
  font-family:var(--serif);
  font-weight:500;
  line-height:1.07
}
h2{
  letter-spacing:-1.1px;
  margin-bottom:24px;
  font-size:46px
}
em{
  color:var(--green);
  font-weight:400
}
.fabric-top{
  background:url(/images/2.webp) 50% 45%/360px;
  height:12px
}
.announcement{
  text-align:center;
  letter-spacing:1.5px;
  background:#edf0e5;
  border-bottom:1px solid #d9dfd1;
  padding:8px 15px;
  font-size:10px
}
.announcement span{
  color:var(--rose);
  padding-left:10px
}
header{
  border-bottom:1px solid var(--line);
  z-index:60;
  background:var(--paper);
  justify-content:space-between;
  align-items:center;
  gap:28px;
  max-width:1440px;
  margin:auto;
  padding:25px 6%;
  display:flex;
  position:sticky;
  top:0
}
.brand{
  font-family:var(--serif);
  white-space:nowrap;
  align-items:center;
  gap:11px;
  font-size:29px;
  font-weight:600;
  line-height:1.1;
  display:flex
}
.brand small{
  font-family:var(--sans);
  letter-spacing:2.1px;
  margin-top:7px;
  font-size:7px;
  font-weight:500;
  display:block
}
.brand-logo{
  object-fit:contain;
  flex:none;
  width:84px;
  height:52px
}
.header-actions{
  align-items:center;
  gap:12px;
  display:flex
}
nav{
  align-items:center;
  gap:28px;
  font-size:11px;
  display:flex
}
nav button{
  padding:0;
  font-size:11px
}
nav a:hover,
nav button:hover{
  color:var(--rose)
}
.icon{
  justify-content:center;
  align-items:center;
  width:30px;
  height:35px;
  padding:0;
  display:inline-flex
}
.bag{
  gap:6px;
  width:auto
}
.bag span{
  background:var(--green);
  color:#fff;
  border-radius:50%;
  place-items:center;
  width:20px;
  height:20px;
  font-size:12px;
  display:grid
}
.selected{
  color:var(--rose)
}
.mobile-menu{
  display:none
}
.hero{
  grid-template-columns:1fr 1fr;
  align-items:center;
  gap:36px;
  max-width:1440px;
  min-height:635px;
  margin:auto;
  padding:65px 8%;
  display:grid
}
.eyebrow{
  letter-spacing:2.1px;
  color:var(--green);
  align-items:center;
  gap:10px;
  margin-bottom:20px;
  font-size:9px;
  font-weight:600;
  display:flex
}
.eyebrow>span{
  background:var(--green);
  width:24px;
  height:1px
}
h1{
  letter-spacing:-2px;
  margin:0 0 25px;
  font-size:clamp(50px,5.5vw,80px);
  line-height:1.02
}
.hero-copy>p{
  color:#74796d;
  margin-bottom:25px;
  font-size:13px;
  line-height:1.95
}
.button{
  letter-spacing:.3px;
  border:1px solid var(--green);
  justify-content:center;
  align-items:center;
  gap:20px;
  min-height:48px;
  padding:15px 23px;
  font-size:11px;
  transition:background .2s,transform .2s;
  display:inline-flex
}
.button:hover{
  transform:translateY(-2px)
}
.primary{
  background:var(--green);
  color:#fffdf5
}
.primary:hover{
  background:#526b5d
}
.secondary{
  color:var(--green);
  background:0 0
}
.handwritten{
  font-family:var(--serif);
  color:#9b8170;
  font-size:20px;
  font-style:italic
}
.hero-copy .handwritten{
  margin-top:15px;
  font-size:18px
}
.handwritten span{
  color:var(--rose)
}
.hero-foot{
  color:var(--muted);
  align-items:center;
  gap:10px;
  margin-top:38px;
  font-size:9px;
  display:flex
}
.hero-art{
  height:495px;
  position:relative
}
.pattern-square{
  opacity:.8;
  background:url(/images/1.webp) 50%/400px;
  border-radius:48% 48% 0 0;
  width:70%;
  height:88%;
  position:absolute;
  top:8px;
  right:-20px;
  transform:rotate(5deg)
}
.photo-main{
  background:#fffdf7;
  border:1px solid #e8e3d4;
  width:75%;
  padding:12px 12px 0;
  position:absolute;
  top:5px;
  left:12%;
  transform:rotate(4deg);
  box-shadow:0 8px 25px #4d4c3e20
}
.photo-main img{
  object-fit:cover;
  object-position:center 42%;
  width:100%;
  height:380px
}
.photo-main>div{
  font-family:var(--serif);
  text-align:center;
  padding:10px;
  font-size:20px;
  font-style:italic
}
.tape{
  clip-path:polygon(0 3%,97% 0,100% 90%,3% 100%);
  z-index:2;
  background:#ddd2ab90;
  width:110px;
  height:33px;
  position:absolute;
  top:-8px;
  left:41%;
  transform:rotate(-5deg)
}
.photo-mini{
  background:#fffdf7;
  width:37%;
  padding:8px 8px 0;
  position:absolute;
  bottom:5px;
  left:-5%;
  transform:rotate(-11deg);
  box-shadow:0 6px 18px #3d463e29
}
.photo-mini img{
  object-fit:cover;
  object-position:center 35%;
  width:100%;
  height:184px
}
.photo-mini>span{
  font-family:var(--serif);
  text-align:center;
  padding:9px 0;
  font-size:14px;
  display:block
}
.hero-logo{
  object-fit:contain;
  width:200px;
  height:124px;
  position:absolute;
  bottom:0;
  right:-14px;
  transform:rotate(0deg);
  filter:drop-shadow(0 5px 12px #3d463e29)
}
.little-flower{
  color:#ba8e81;
  font-size:44px;
  position:absolute;
  top:10px;
  left:-4%;
  transform:rotate(15deg)
}
.values{
  color:#697661;
  background:#f0f1e7;
  border-top:1px dashed #bcc8b8;
  border-bottom:1px dashed #bcc8b8;
  justify-content:center;
  align-items:center;
  gap:45px;
  padding:22px 25px;
  font-size:10px;
  display:flex
}
.values span{
  align-items:center;
  gap:10px;
  display:flex
}
.values svg{
  stroke-width:1.3px;
  width:20px
}
.section{
  max-width:1250px;
  margin:auto;
  padding:70px 40px
}
.section-top{
  justify-content:space-between;
  align-items:flex-end;
  gap:20px;
  display:flex
}
.section-top .eyebrow{
  margin-bottom:12px
}
.section-top h2{
  margin-bottom:0
}
.section-top .handwritten{
  padding-bottom:4px;
  font-size:18px
}
.filters{
  border-bottom:1px solid var(--line);
  justify-content:space-between;
  align-items:center;
  gap:20px;
  margin:30px 0 26px;
  padding-bottom:18px;
  display:flex
}
.tabs{
  flex-wrap:wrap;
  gap:6px;
  display:flex
}
.tabs button{
  border:1px solid #0000;
  padding:9px 17px;
  font-size:10px
}
.tabs button.active{
  background:var(--green);
  border-color:var(--green);
  color:#fff
}
.tabs button:not(.active):hover{
  border-color:#b7c3b2
}
.sorting{
  color:var(--muted);
  align-items:center;
  gap:8px;
  display:flex
}
select{
  color:inherit;
  cursor:pointer;
  background:0 0;
  border:0;
  max-width:170px;
  font-size:10px
}
.products{
  grid-template-columns:repeat(3,1fr);
  gap:36px 26px;
  display:grid
}
.product-image{
  background:#e6e3d8;
  height:370px;
  position:relative;
  overflow:hidden
}
.image-link{
  width:100%;
  height:100%;
  padding:0;
  display:block
}
.product-image img{
  object-fit:cover;
  object-position:50% 40%;
  width:100%;
  height:100%;
  transition:transform .6s
}
.product:hover .product-image img{
  transform:scale(1.035)
}
.favorite{
  color:#6b7868;
  background:#fffcf1e8;
  border-radius:50%;
  place-items:center;
  width:33px;
  height:33px;
  display:grid;
  position:absolute;
  top:13px;
  right:13px
}
.is-liked{
  color:var(--rose)
}
.tag{
  color:#657160;
  background:#f7f2e7ef;
  padding:5px 10px;
  font-size:8px;
  position:absolute;
  top:15px;
  left:13px
}
.quick-view{
  background:#faf7ebed;
  justify-content:center;
  align-items:center;
  gap:16px;
  width:100%;
  padding:13px;
  font-size:10px;
  transition:all .2s;
  display:flex;
  position:absolute;
  bottom:0;
  left:0;
  transform:translateY(100%)
}
.product:hover .quick-view,
.product:focus-within .quick-view{
  transform:translateY(0)
}
.product-category{
  letter-spacing:1px;
  color:var(--muted);
  margin:16px 0 7px;
  font-size:8px
}
.product-category span{
  letter-spacing:0;
  color:#8e9685;
  font-size:8px
}
.product-maker{
  color:var(--green);
  font-size:10px;
  margin:-2px 0 5px
}
.product-title{
  font-family:var(--serif);
  text-align:left;
  padding:0;
  font-size:27px;
  font-weight:500;
  line-height:1.2
}
.product-bottom{
  justify-content:space-between;
  align-items:center;
  margin-top:9px;
  font-size:11px;
  display:flex
}
.add-bag{
  border:1px solid #d0d7c8;
  align-items:center;
  gap:4px;
  padding:7px 10px;
  display:flex
}
.add-bag:hover{
  background:#e6eadf
}
.collection-note{
  text-align:center;
  color:#929183;
  margin:35px 0 0;
  font-size:10px
}
.searchbox{
  border-bottom:1px solid var(--green);
  align-items:center;
  gap:12px;
  margin-bottom:25px;
  padding:8px 10px;
  display:flex
}
.searchbox input{
  background:0 0;
  border:0;
  outline:0;
  width:100%;
  padding:8px
}
.filter-note{
  font-size:12px
}
.filter-note button{
  margin-left:15px;
  text-decoration:underline
}
.story{
  grid-template-columns:1fr 1fr;
  align-items:center;
  gap:100px;
  padding-top:25px;
  padding-bottom:80px;
  display:grid
}
.story-images{
  margin-left:20px;
  position:relative
}
.story-images:before{
  content:"";
  z-index:-1;
  background:url(/images/0.webp) 50%/450px;
  position:absolute;
  inset:20px 20px -20px -20px
}
.story-images>img{
  object-fit:cover;
  object-position:50% 35%;
  width:100%;
  height:420px
}
.story-label{
  font-family:var(--serif);
  background:#f4eddf;
  padding:19px 25px;
  font-size:23px;
  font-style:italic;
  line-height:1.15;
  position:absolute;
  bottom:20px;
  right:-30px;
  transform:rotate(-5deg);
  box-shadow:0 4px 9px #353e3220
}
.story-copy p{
  color:#7e8073;
  font-size:12px;
  line-height:1.95
}
.story-copy h2{
  font-size:49px
}
.text-link{
  border-bottom:1px solid #b4bdac;
  align-items:center;
  gap:14px;
  padding:10px 0;
  font-size:11px;
  display:inline-flex
}
.custom{
  text-align:center;
  background:linear-gradient(#edf0e7ed,#edf0e7ed),url(/images/1.webp) 50%/430px;
  border-top:1px solid #d5ddcf;
  border-bottom:1px solid #d5ddcf;
  max-width:none;
  padding:55px 30px 60px;
  position:relative
}
.custom .eyebrow{
  justify-content:center;
  margin-top:12px
}
.flower-mark{
  color:var(--rose);
  font-size:31px
}
.custom h2{
  font-size:49px
}
.custom p{
  color:#7a8272;
  margin-bottom:24px;
  font-size:12px;
  line-height:1.9
}
.faq{
  grid-template-columns:1fr 1.3fr;
  gap:50px;
  display:grid
}
.faq h2{
  font-size:36px
}
.faq details{
  border-bottom:1px solid var(--line)
}
.faq summary{
  cursor:pointer;
  justify-content:space-between;
  align-items:center;
  padding:18px 0;
  font-size:12px;
  list-style:none;
  display:flex
}
.faq summary::-webkit-details-marker{
  display:none
}
.faq details p{
  color:var(--muted);
  padding-right:30px;
  font-size:12px
}
.faq details[open] summary svg{
  transform:rotate(45deg)
}
footer{
  background:#efeee4;
  border-top:1px solid #d9ddcf;
  padding:38px 6% 20px
}
.footer-main{
  justify-content:space-between;
  align-items:center;
  gap:30px;
  max-width:1250px;
  margin:auto;
  padding-bottom:35px;
  display:flex
}
.footer-main>div{
  gap:25px;
  font-size:10px;
  display:flex
}
.footer-main button{
  padding:0;
  font-size:10px
}
.instagram-link{
  align-items:center;
  gap:10px;
  font-size:10px;
  display:flex
}
.footer-bottom{
  color:#85897c;
  border-top:1px solid #d7dbcd;
  justify-content:space-between;
  gap:20px;
  max-width:1250px;
  margin:auto;
  padding-top:18px;
  font-size:8px;
  display:flex
}
.footer-bottom>div{
  gap:20px;
  display:flex
}
.footer-bottom button{
  padding:0;
  font-size:8px
}
.overlay{
  -webkit-backdrop-filter:blur(5px);
  backdrop-filter:blur(5px);
  z-index:100;
  background:#29382d75;
  justify-content:center;
  align-items:center;
  padding:24px;
  display:flex;
  position:fixed;
  inset:0;
  overflow-y:auto
}
.modal{
  background:var(--paper);
  max-height:90vh;
  position:relative;
  overflow-y:auto;
  box-shadow:0 25px 90px #1b302740
}
.close{
  z-index:5;
  background:#fffdf3e8;
  border-radius:50%;
  width:36px;
  height:36px;
  position:absolute;
  top:14px;
  right:15px
}
.product-modal{
  grid-template-columns:1fr 1fr;
  width:850px;
  display:grid
}
.detail-image{
  object-fit:cover;
  width:100%;
  height:100%;
  max-height:680px
}
.detail-gallery{min-width:0}
.detail-thumbnails,.seo-product-thumbnails{display:flex;gap:8px;flex-wrap:wrap;padding:10px}
.detail-thumbnails button,.seo-product-thumbnails button{width:64px;height:64px;padding:0;border:2px solid transparent;background:transparent;cursor:pointer}
.detail-thumbnails button.selected,.seo-product-thumbnails button.selected{border-color:var(--green,#52664d)}
.detail-thumbnails button:focus-visible,.seo-product-thumbnails button:focus-visible{outline:2px solid var(--rose);outline-offset:2px}
.detail-thumbnails img,.seo-product-thumbnails img{width:100%;height:100%;object-fit:cover}
.detail-copy{
  padding:50px 35px 35px
}
.detail-copy h2{
  font-size:42px
}
.detail-copy p{
  color:var(--muted);
  font-size:12px
}
.detail-copy .other-origin{
  display:inline-block;
  color:#546b59;
  background:#e9eee5;
  padding:5px 10px;
  margin:0 0 8px;
  font-size:10px
}
dl{
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  grid-template-columns:90px 1fr;
  gap:12px;
  padding:18px 0;
  font-size:11px;
  display:grid
}
dt{
  color:var(--muted)
}
dd{
  margin:0
}
.detail-copy h3{
  margin:20px 0;
  font-size:28px
}
.detail-copy .button{
  gap:10px;
  width:100%;
  margin-top:10px
}
.small{
  color:var(--muted);
  line-height:1.8;
  font-size:11px!important
}
.drawer-overlay{
  justify-content:flex-end;
  padding:0
}
.drawer{
  background:var(--paper);
  width:480px;
  max-width:100%;
  height:100%;
  padding:48px 32px;
  position:relative;
  overflow-y:auto
}
.drawer h2{
  font-size:42px
}
.cart-item{
  border-bottom:1px solid var(--line);
  grid-template-columns:80px 1fr;
  gap:18px;
  padding:22px 0;
  display:grid
}
.cart-item img{
  object-fit:cover;
  width:80px;
  height:115px
}
.cart-item h3{
  margin:4px 0 9px;
  font-size:24px
}
.cart-item p{
  font-size:11px
}
.qty{
  align-items:center;
  gap:13px;
  font-size:12px;
  display:flex
}
.qty button{
  align-items:center;
  padding:3px;
  display:flex
}
.qty .remove{
  color:var(--muted);
  margin-left:auto;
  font-size:9px;
  text-decoration:underline
}
.cart-total{
  justify-content:space-between;
  padding:25px 0 10px;
  font-size:13px;
  display:flex
}
.drawer>.button{
  width:100%
}
.centered{
  justify-content:center;
  margin:15px auto;
  display:flex
}
.empty{
  text-align:center;
  color:var(--muted);
  padding:60px 15px
}
.empty>svg{
  margin:0 auto 20px
}
.empty h3{
  color:var(--ink);
  margin:10px 0;
  font-size:30px
}
.empty p{
  font-size:12px
}
.empty .button{
  margin-top:12px
}
.checkout{
  width:620px;
  padding:45px
}
.checkout h2{
  margin-bottom:16px;
  font-size:41px
}
form label{
  flex-direction:column;
  gap:5px;
  margin-bottom:16px;
  font-size:11px;
  display:flex
}
input,
textarea{
  color:var(--ink);
  background:#fffdf6;
  border:1px solid #d4dacb;
  border-radius:0;
  outline:none;
  width:100%;
  padding:12px
}
input:focus,
textarea:focus{
  border-color:var(--green);
  box-shadow:0 0 0 2px #6b817418
}
textarea{
  resize:vertical;
  min-height:85px
}
.form-row{
  grid-template-columns:1fr 1fr;
  gap:15px;
  display:grid
}
.checkbox{
  font-size:10px;
  display:block
}
.checkbox input{
  vertical-align:middle;
  width:14px;
  accent-color:var(--green);
  margin:0 8px 0 0
}
.checkbox button{
  padding:0;
  font-size:10px;
  text-decoration:underline
}
.checkout form>.button{
  width:100%;
  margin-top:7px
}
.error{
  color:#a84448;
  background:#f6e6e1;
  padding:12px;
  font-size:12px
}
.success{
  text-align:center;
  padding:20px 0
}
.success>span{
  color:var(--rose);
  font-size:60px
}
.success p{
  font-size:13px
}
.info-overlay{
  z-index:110
}
.info-modal{
  width:650px;
  padding:50px
}
.info-modal p{
  color:#767e70;
  font-size:13px
}
.info-modal h2{
  font-size:40px
}
.toast{
  color:#fff;
  z-index:150;
  white-space:nowrap;
  background:#566e5e;
  align-items:center;
  gap:12px;
  max-width:90vw;
  padding:15px 23px;
  font-size:12px;
  display:flex;
  position:fixed;
  bottom:25px;
  left:50%;
  transform:translate(-50%);
  box-shadow:0 5px 22px #243b3225
}
.notice{
  background:#eee8d6;
  padding:12px;
  font-size:11px
}
.admin-wrap{
  max-width:1200px;
  margin:auto;
  padding:40px
}
.admin-header{
  border-bottom:1px solid var(--line);
  justify-content:space-between;
  align-items:center;
  gap:20px;
  margin-bottom:35px;
  padding:25px 0;
  display:flex
}
.admin-nav{
  flex-wrap:wrap;
  gap:12px;
  margin-bottom:25px;
  display:flex
}
.admin-table{
  border-collapse:collapse;
  width:100%;
  font-size:12px
}
.admin-table td,
.admin-table th{
  text-align:left;
  border-bottom:1px solid var(--line);
  padding:13px
}
.admin-table img{
  object-fit:cover;
  width:55px;
  height:72px
}
.admin-table button{
  border-bottom:1px solid var(--green);
  font-size:11px
}
.admin-table th{
  color:var(--muted);
  font-weight:500
}
.admin-scroll{
  overflow-x:auto
}
.admin-editor{
  background:#f1f0e6;
  margin:25px 0;
  padding:30px
}
.admin-editor h2{
  font-size:35px
}
.admin-grid{
  grid-template-columns:150px 1fr;
  gap:25px;
  display:grid
}
.admin-grid img{
  object-fit:cover;
  width:150px;
  height:200px
}
.admin-editor select{
  border:1px solid var(--line);
  background:var(--paper);
  max-width:none;
  padding:12px;
  font-size:12px
}
.admin-orders{
  gap:20px;
  display:grid
}
.order-card{
  border:1px solid var(--line);
  background:#fffdf6;
  padding:25px
}
.order-card header{
  max-width:none;
  margin-bottom:15px;
  padding:0 0 15px;
  font-size:11px
}
.order-card header select{
  font-size:12px
}
.order-card h3{
  margin:0;
  font-size:25px
}
.order-card p{
  margin-bottom:8px;
  font-size:12px
}
.order-items{
  border-top:1px dashed var(--line);
  margin-top:15px;
  padding-top:15px
}
.admin-message{
  background:#e6eddf;
  padding:15px;
  font-size:12px
}
.admin-stats{
  gap:20px;
  margin-bottom:25px;
  display:flex
}
.admin-stats>div{
  background:#eeefe3;
  flex:1;
  padding:20px 30px;
  font-size:11px
}
.admin-stats strong{
  font-family:var(--serif);
  font-size:32px;
  display:block
}
@media (min-width:1500px){
  .hero-art{
    height:540px
  }
  .photo-main img{
    height:420px
  }
}
@media (max-width:1100px){
  header{
    gap:15px;
    padding:22px 4%
  }
  .brand{
    font-size:25px
  }
  nav{
    gap:16px
  }
  .header-actions{
    gap:7px
  }
  .hero{
    gap:25px;
    min-height:570px;
    padding:55px 6%
  }
  .hero-art{
    height:430px
  }
  .photo-main img{
    height:320px
  }
  .photo-mini img{
    height:150px
  }
  .hero-logo{
    width:170px;
    height:108px
  }
  .section{
    padding-left:5%;
    padding-right:5%
  }
  .section-top .handwritten{
    display:none
  }
  .story{
    gap:65px
  }
  .product-image{
    height:320px
  }
  .values{
    gap:24px;
    font-size:9px
  }
  .footer-main{
    flex-wrap:wrap
  }
  .footer-main>div{
    gap:16px
  }
  .story-copy h2{
    font-size:43px
  }
}
@media (max-width:760px){
  .announcement{
    letter-spacing:.8px;
    font-size:8px
  }
  header{
    padding:18px 5%
  }
  .brand{
    font-size:23px
  }
  .brand small{
    letter-spacing:1.5px;
    font-size:6px
  }
  .brand-logo{
    width:68px;
    height:42px
  }
  .header-actions{
    gap:5px
  }
  .header-actions>.icon:first-child{
    display:none
  }
  .header-actions>.seo-cart:first-child{
    display:inline-flex
  }
  .header-actions .icon{
    width:26px
  }
  .header-actions .bag{
    width:auto
  }
  .header-actions svg{
    width:18px
  }
  .mobile-menu{
    display:inline-flex
  }
  nav{
    display:none
  }
  nav.nav-open{
    background:var(--paper);
    border-bottom:1px solid var(--line);
    flex-direction:column;
    padding:25px;
    display:flex;
    position:absolute;
    top:100%;
    left:0;
    right:0
  }
  .hero{
    grid-template-columns:1fr;
    gap:30px;
    padding:40px 7% 35px
  }
  .hero-copy{
    position:relative
  }
  .hero h1{
    font-size:65px
  }
  .eyebrow{
    letter-spacing:1.5px;
    font-size:8px
  }
  .hero-copy>p{
    font-size:12px
  }
  .hero-foot{
    margin-top:25px;
    font-size:8px
  }
  .hero-art{
    width:100%;
    max-width:430px;
    height:470px;
    margin:10px auto 0
  }
  .photo-main img{
    height:355px
  }
  .photo-main{
    width:74%;
    left:16%
  }
  .pattern-square{
    right:-5px
  }
  .photo-mini{
    width:37%;
    bottom:15px;
    left:0
  }
  .photo-mini img{
    height:170px
  }
  .hero-logo{
    bottom:5px;
    right:0
  }
  .little-flower{
    top:25px;
    left:1%
  }
  .values{
    justify-content:space-around;
    align-items:flex-start;
    gap:12px;
    padding:18px 20px
  }
  .values span{
    text-align:center;
    flex-direction:column;
    gap:5px;
    max-width:100px;
    font-size:8px;
    line-height:1.6
  }
  .section{
    padding:45px 6%
  }
  h2,.section-top h2{
    font-size:38px
  }
  .filters{
    flex-direction:column;
    align-items:stretch;
    gap:15px;
    margin-top:22px
  }
  .tabs{
    gap:3px
  }
  .tabs button{
    padding:8px 11px;
    font-size:9px
  }
  .sorting{
    justify-content:flex-end
  }
  .products{
    grid-template-columns:1fr 1fr;
    gap:28px 14px
  }
  .product-image{
    height:260px
  }
  .product-title{
    font-size:24px
  }
  .product-category{
    letter-spacing:.5px;
    font-size:7px
  }
  .product-category span{
    font-size:7px;
    display:block
  }
  .product-bottom{
    font-size:10px
  }
  .tag{
    padding:4px 6px;
    font-size:7px;
    top:10px;
    left:7px
  }
  .favorite{
    width:27px;
    height:27px;
    top:10px;
    right:7px
  }
  .favorite svg{
    width:16px
  }
  .add-bag{
    padding:6px
  }
  .add-bag svg:first-child,.quick-view{
    display:none
  }
  .collection-note{
    font-size:9px
  }
  .story{
    grid-template-columns:1fr;
    gap:45px;
    padding-top:15px
  }
  .story-images{
    margin:0 20px 0 16px
  }
  .story-images>img{
    height:390px
  }
  .story-label{
    right:-15px
  }
  .story-copy h2{
    font-size:44px
  }
  .custom{
    padding:40px 6%
  }
  .custom h2{
    font-size:40px
  }
  .faq{
    grid-template-columns:1fr;
    gap:5px
  }
  .faq h2{
    font-size:34px
  }
  .faq .eyebrow{
    margin-bottom:12px
  }
  .footer-main{
    flex-direction:column;
    align-items:flex-start;
    gap:25px
  }
  .footer-bottom{
    flex-direction:column;
    font-size:8px
  }
  .footer-bottom>div{
    flex-wrap:wrap;
    gap:15px
  }
  .product-modal{
    grid-template-columns:1fr;
    width:450px
  }
  .detail-image{
    object-position:50% 35%;
    height:350px
  }
  .detail-copy{
    padding:30px 25px
  }
  .detail-copy h2{
    font-size:38px
  }
  .overlay{
    padding:15px
  }
  .drawer-overlay{
    padding:0
  }
  .checkout{
    padding:45px 24px 25px
  }
  .checkout h2{
    font-size:35px
  }
  .form-row{
    grid-template-columns:1fr;
    gap:0
  }
  .info-modal{
    padding:45px 25px 25px
  }
  .info-modal h2{
    font-size:34px
  }
  .toast{
    padding:13px 15px;
    font-size:10px
  }
  .admin-wrap{
    padding:20px
  }
  .admin-header{
    flex-direction:column;
    align-items:flex-start
  }
  .admin-grid{
    grid-template-columns:1fr
  }
  .admin-stats{
    gap:8px
  }
  .admin-stats>div{
    padding:15px 10px
  }
  .admin-editor{
    padding:20px
  }
  .order-card{
    padding:15px
  }
  .order-card header{
    flex-wrap:wrap
  }
  .order-card h3{
    font-size:20px
  }
}
@media (max-width:380px){
  .brand{
    font-size:20px
  }
  .brand small{
    font-size:5px
  }
  .brand-logo{
    width:54px;
    height:34px
  }
  .hero-art{
    height:400px
  }
  .photo-main img{
    height:300px
  }
  .photo-mini img{
    height:130px
  }
  .hero h1{
    font-size:56px
  }
  .product-image{
    height:220px
  }
  .product-title{
    font-size:21px
  }
}
@media (prefers-reduced-motion:reduce){
  html{
    scroll-behavior:auto
  }
  *,:before,:after{
    transition:none!important;
    animation:none!important
  }
}
.admin-header-actions{
  align-items:center;
  gap:22px;
  display:flex
}
.admin-toolbar{
  justify-content:space-between;
  align-items:flex-start;
  gap:18px;
  margin-bottom:22px;
  display:flex
}
.admin-toolbar .admin-nav{
  gap:8px;
  margin:0
}
.admin-toolbar .button{
  gap:9px;
  padding:12px 17px
}
.admin-message{
  align-items:center;
  gap:10px;
  display:flex
}
.admin-editor{
  border:1px dashed #b8c4ae;
  scroll-margin-top:25px
}
.editor-heading{
  justify-content:space-between;
  align-items:flex-start;
  gap:15px;
  display:flex
}
.editor-heading .eyebrow{
  margin-bottom:9px
}
.admin-grid{
  grid-template-columns:210px 1fr;
  gap:35px
}
.admin-grid fieldset{
  border:0;
  min-width:0;
  margin:0;
  padding:0
}
.upload-panel>img{
  object-fit:cover;
  width:210px;
  height:280px
}
.admin-photo-list{display:grid;gap:10px;margin-top:12px}
.admin-photo-item{display:grid;grid-template-columns:56px 1fr;align-items:center;gap:4px 8px}
.admin-photo-item img{grid-row:span 2;width:56px;height:56px;object-fit:cover}
.admin-photo-item button{font:inherit;text-align:left;color:#52664d;background:none;border:0;padding:0;cursor:pointer}
.admin-photo-item button:disabled{opacity:.5;cursor:default}
.image-placeholder{
  text-align:center;
  color:#7e8b73;
  background:#e7e9db;
  border:1px dashed #b2bfa8;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  gap:15px;
  width:210px;
  height:280px;
  padding:20px;
  font-size:12px;
  display:flex
}
.upload-label{
  margin-top:16px
}
.upload-label input{
  max-width:100%;
  padding:8px;
  font-size:10px
}
.editor-actions{
  flex-wrap:wrap;
  gap:12px;
  margin-top:22px;
  display:flex
}
.inventory-heading h2{
  margin:30px 0 8px;
  font-size:37px
}
.inventory-heading p{
  color:var(--muted);
  font-size:12px
}
.inventory-filters{
  justify-content:space-between;
  align-items:center;
  gap:20px;
  margin:22px 0;
  display:flex
}
.admin-search{
  background:#fffdf6;
  border:1px solid #d4dacb;
  flex:1;
  align-items:center;
  gap:10px;
  max-width:520px;
  padding:0 13px;
  display:flex
}
.admin-search input{
  box-shadow:none;
  background:0 0;
  border:0;
  font-size:12px
}
.admin-visibility{
  color:var(--muted);
  align-items:center;
  gap:12px;
  font-size:11px;
  display:flex
}
.admin-visibility select{
  border:1px solid var(--line);
  padding:10px;
  font-size:12px
}
.inventory-table th{
  letter-spacing:.5px;
  background:#f0f0e4;
  font-size:10px
}
.inventory-table td{
  vertical-align:middle
}
.inventory-product{
  align-items:center;
  gap:17px;
  min-width:220px;
  display:flex
}
.inventory-product img{
  width:65px;
  height:85px
}
.inventory-product strong{
  font-family:var(--serif);
  font-size:24px;
  font-weight:500;
  display:block
}
.inventory-product small{
  color:var(--muted);
  font-size:10px;
  display:block
}
.visibility-badge{
  background:#e5e5d9;
  margin-top:4px;
  padding:2px 6px;
  font-size:9px;
  display:inline-block
}
.stock-badge{
  color:#63785b;
  white-space:nowrap;
  background:#eaf0e2;
  padding:4px 9px;
  font-size:9px;
  display:inline-block
}
.stock-badge.sold{
  color:#987167;
  background:#eee5e0
}
.inventory-actions{
  flex-wrap:wrap;
  align-items:flex-start;
  gap:12px;
  min-width:225px;
  display:flex
}
.inventory-actions button{
  border:0;
  align-items:center;
  gap:5px;
  padding:4px 0;
  font-size:10px;
  display:flex
}
.inventory-actions button:hover{
  text-decoration:underline
}
.inventory-actions .delete-action{
  color:#ac625d
}
.inventory-help{
  margin-top:22px
}
.delete-confirm{
  width:100%;
  max-width:480px;
  padding:35px
}
.delete-confirm h2{
  margin:20px 0 15px;
  font-size:38px
}
.delete-confirm p{
  color:#7b8073;
  font-size:12px
}
.delete-symbol{
  color:#af716b;
  background:#f0e1db;
  border-radius:50%;
  place-items:center;
  width:50px;
  height:50px;
  display:grid
}
.danger{
  color:#fff;
  background:#a66761;
  border-color:#a66761
}
.danger:hover{
  background:#905650
}
.admin-lock{
  color:var(--rose);
  font-size:65px
}
@media (max-width:760px){
  .admin-header-actions{
    flex-wrap:wrap;
    gap:15px
  }
  .admin-header-actions .button{
    padding:10px 14px
  }
  .admin-toolbar{
    flex-direction:column;
    align-items:stretch
  }
  .admin-toolbar>.button{
    width:100%
  }
  .admin-toolbar .admin-nav{
    grid-template-columns:1fr 1fr 1fr;
    gap:5px;
    display:grid
  }
  .admin-toolbar .admin-nav .button{
    gap:5px;
    padding:10px 7px;
    font-size:9px
  }
  .admin-toolbar .admin-nav svg{
    width:13px
  }
  .admin-grid{
    grid-template-columns:1fr;
    gap:25px
  }
  .upload-panel{
    max-width:100%
  }
  .upload-panel>img,.image-placeholder{
    width:180px;
    height:240px
  }
  .inventory-filters{
    flex-direction:column;
    align-items:stretch;
    gap:10px
  }
  .admin-search{
    max-width:none
  }
  .admin-visibility{
    justify-content:flex-end
  }
  .inventory-product{
    min-width:210px
  }
  .inventory-actions{
    flex-direction:column;
    gap:5px;
    min-width:100px
  }
  .inventory-table td,.inventory-table th{
    padding:12px 8px
  }
  .inventory-product strong{
    font-size:22px
  }
  .inventory-product img{
    width:50px;
    height:70px
  }
  .delete-confirm{
    padding:28px 22px
  }
  .delete-confirm .editor-actions{
    flex-direction:column
  }
  .delete-confirm .button{
    width:100%
  }
}
.account-status{
  overflow-wrap:anywhere;
  background:#eef0e5;
  border:1px solid #d9dfd0;
  padding:14px 18px;
  font-size:12px
}
.account-status strong{
  font-weight:600
}
.admin-role-badge{
  color:#fff;
  background:#6b8174;
  margin-left:14px;
  padding:3px 10px;
  font-size:10px;
  display:inline-block
}
.admin-nav-link{
  color:#6b8174;
  border-bottom:1px solid #9bab91;
  padding-bottom:3px
}
@media (max-width:760px){
  .admin-role-badge{
    width:fit-content;
    margin:8px 0 0;
    display:block
  }
  .account-status{
    font-size:11px
  }
}

.checkout-summary { margin: 14px 0 20px; padding: 12px 16px; list-style: none; background: #fff8f4; border-radius: 12px; }
.checkout-summary li { padding: 5px 0; font-size: .92rem; line-height: 1.4; }
.checkout-summary li + li { border-top: 1px solid #eadbd3; }

.product-title { display: block; color: inherit; text-decoration: none; }
.product-title:hover, .product-title:focus-visible { text-decoration: underline; }
.seo-product { max-width: 1180px; margin: 0 auto; min-height: 70vh; }
.seo-product nav { margin-bottom: 28px; }
.seo-product nav a { color: var(--green); }
.seo-product-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 5vw; align-items: start; }
.seo-product-gallery > img { display: block; width: 100%; max-height: 680px; object-fit: cover; }
.seo-product h1 { font-family: var(--serif); font-size: clamp(46px, 6vw, 82px); line-height: 1; margin: 12px 0 26px; }
.seo-product h2 { font-family: var(--serif); font-size: 38px; }
.seo-product dl { display: grid; grid-template-columns: 130px 1fr; gap: 7px 12px; margin: 26px 0; }
.seo-product dt { color: var(--muted); }
.seo-product dd { margin: 0; }
@media (max-width: 760px) { .seo-product-layout { grid-template-columns: 1fr; } .seo-product { padding: 24px; } }

/* Readable type scale for desktop browsing. */
@media (min-width:1101px){
  body{font-size:16px}
  .announcement{font-size:12px}
  .brand small{font-size:10px;letter-spacing:1.5px}
  nav,nav button{font-size:14px}
  .eyebrow{font-size:12px;letter-spacing:1.6px}
  .hero-copy>p{font-size:16px;line-height:1.75}
  .hero-foot,.values{font-size:16px;line-height:1.5}
  .button{font-size:14px}
  .tabs button,select,.sorting{font-size:16px}
  .product-category,.product-category span{font-size:12px}
  .product-maker,.tag,.quick-view{font-size:12px}
  .product-bottom,.collection-note{font-size:14px}
  .story-copy p,.custom p{font-size:16px;line-height:1.8}
  .text-link,.faq summary,.faq details p{font-size:15px}
  .footer-main>div,.footer-main button,.instagram-link{font-size:13px}
  .footer-bottom,.footer-bottom button{font-size:12px}
}
@media (min-width:761px) and (max-width:1100px){
  nav,nav button{font-size:12px}
  .brand small{font-size:9px}
  .hero-foot,.values{font-size:14px;line-height:1.5}
  .tabs button,select,.sorting{font-size:16px}
  .product-category,.product-category span{font-size:14px}
}

/* Legible labels and controls across the shop. */
@media (min-width:1101px){
  .product-category,.product-category span,.product-maker,.tag{font-size:14px}
  .hero-foot,.values{font-size:17px}
}
@media (max-width:760px){
  .hero-foot,.values span,.tabs button,.sorting,select,.product-category,.product-category span,.product-maker,.product-bottom,.collection-note,.tag{font-size:14px;line-height:1.45}
  .tabs button{min-height:44px;padding:10px 12px}
  .sorting{min-height:44px}
  .sorting select{max-width:none;min-height:44px}
  .product-category span{display:inline}
  .tag{padding:6px 8px}
  .favorite{width:40px;height:40px}
}
@media (max-width:400px){
  header{gap:6px;padding:10px 3%}
  header .brand{min-width:0;gap:5px;font-size:17px}
  header .brand span{max-width:140px;white-space:normal;line-height:1}
  header .brand-logo{width:38px;height:32px}
  header .brand small{display:none}
  header .header-actions{flex:none;gap:3px}
  header .header-actions .icon{width:24px;min-height:40px}
  header .header-actions .bag{width:auto;min-width:48px}
}