/*
Theme Name: Holenea
Description: Editorial theme for the Holenea atelier shop.
Version: 2.0.0
Text Domain: holenea
*/

:root{
  --bg:#f3eee6;
  --ink:#1c1814;
  --muted:#6a6158;
  --line:#ddd4c8;
  --max:1120px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:"Outfit",system-ui,sans-serif;
  font-weight:300;
  font-size:16px;
  line-height:1.65;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto;display:block}
.site-header{
  position:sticky;top:0;z-index:30;
  display:flex;align-items:center;justify-content:space-between;
  padding:18px 28px;
  background:rgba(243,238,230,.92);
  border-bottom:1px solid var(--line);
  backdrop-filter:blur(16px);
}
.logo{
  font-family:"Cormorant Garamond",Georgia,serif;
  letter-spacing:.32em;
  font-size:15px;
}
.site-header nav ul{
  display:flex;gap:26px;list-style:none;margin:0;padding:0;
  font-size:11px;letter-spacing:.16em;text-transform:uppercase;
}
.site-header nav ul ul{display:none}
.wrap{width:min(var(--max),calc(100% - 40px));margin:0 auto}
.hero{padding:88px 0 36px}
.kicker{letter-spacing:.22em;text-transform:uppercase;font-size:11px;color:var(--muted);margin:0 0 16px}
h1,h2,h3,.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-family:"Cormorant Garamond",Georgia,serif;
  font-weight:400;
  line-height:1.08;
}
h1{font-size:clamp(44px,7vw,78px);margin:0 0 18px;letter-spacing:-.02em;max-width:14ch}
.lede{max-width:46ch;color:var(--muted);margin:0}
.section-title{font-size:34px;margin:56px 0 8px}
.site-footer{
  margin-top:72px;padding:48px 28px 32px;
  border-top:1px solid var(--line);
  display:grid;grid-template-columns:1.4fr 1fr 1fr;
  gap:28px;color:var(--muted);font-size:14px;
}
.site-footer strong{
  display:block;color:var(--ink);font-size:11px;letter-spacing:.14em;
  text-transform:uppercase;font-weight:400;margin-bottom:10px;
}
.site-footer a{display:block;margin:5px 0}
.woocommerce .woocommerce-result-count,
.woocommerce .woocommerce-ordering,
.woocommerce .woocommerce-breadcrumb{display:none}
.woocommerce ul.products,
.woocommerce-page ul.products{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:40px 22px !important;
  width:100% !important;
  margin:36px 0 0 !important;
  padding:0 !important;
  list-style:none !important;
  float:none !important;
}
.woocommerce ul.products::before,
.woocommerce ul.products::after,
.woocommerce-page ul.products::before,
.woocommerce-page ul.products::after{
  content:none !important;display:none !important;
}
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product{
  width:auto !important;
  max-width:none !important;
  float:none !important;
  margin:0 !important;
  padding:0 !important;
  text-align:left !important;
}
.woocommerce ul.products li.product a img,
.woocommerce ul.products li.product img{
  width:100% !important;
  aspect-ratio:3/4;
  object-fit:cover;
  margin:0 0 14px !important;
  background:#e8e0d4;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-size:22px !important;
  margin:0 0 4px !important;
  padding:0 !important;
}
.woocommerce ul.products li.product .price{
  display:block;color:var(--muted);font-size:14px;font-weight:300;
}
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .added_to_cart{display:none !important}
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit{
  background:transparent !important;
  color:var(--ink) !important;
  border:1px solid var(--ink) !important;
  border-radius:0 !important;
  font-weight:400 !important;
  letter-spacing:.14em;
  text-transform:uppercase;
  font-size:11px !important;
  padding:12px 18px !important;
}
@media(max-width:900px){
  .woocommerce ul.products,.woocommerce-page ul.products{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
  .site-footer{grid-template-columns:1fr 1fr}
}
@media(max-width:640px){
  .site-header{padding:12px 16px}
  .site-header nav ul{gap:12px;font-size:10px}
  .wrap{width:min(var(--max),calc(100% - 28px))}
  .hero{padding:48px 0 20px}
  .woocommerce ul.products,.woocommerce-page ul.products{grid-template-columns:1fr !important}
  .site-footer{grid-template-columns:1fr;padding:32px 16px}
}