:root{
  --bg:#fffdfb;
  --surface:#ffffff;
  --cream:#f8efe8;
  --rose:#b66f58;
  --rose-dark:#8f4f3b;
  --soft:#f4e8df;
  --gold:#c99879;
  --text:#251d1a;
  --muted:#756b65;
  --line:#eadfd8;
  --wine:#7f1318;
  --shadow:0 14px 42px rgba(60,35,24,.12);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--text);
  font-family:"Inter",sans-serif;
  background:var(--bg);
}
img{display:block;width:100%}
a{text-decoration:none;color:inherit}
button,input{font:inherit}
button{cursor:pointer}
.container{width:min(1410px,94%);margin:auto}

.topbar{
  background:linear-gradient(90deg,#bf7259,#a95742);
  color:white;
  font-size:12px;
}
.topbar__inner{
  min-height:34px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
}
.topbar__left,.topbar__right{
  display:flex;
  align-items:center;
  gap:18px;
}
.topbar a{color:#fff}

.site-header{
  background:rgba(255,255,255,.98);
  position:sticky;
  top:0;
  z-index:1000;
  box-shadow:0 1px 0 var(--line);
}
.header-main{
  display:grid;
  grid-template-columns:300px minmax(320px,1fr) 300px;
  gap:28px;
  align-items:center;
  padding:14px 0;
}
.logo-wrap{
  display:flex;
  align-items:center;
  gap:12px;
}
.logo-emblem{
  width:72px;
  height:62px;
  display:grid;
  place-items:center;
  font-family:"Cormorant Garamond",serif;
  font-size:42px;
  font-weight:700;
  color:#171313;
  position:relative;
}
.logo-emblem::after{
  content:"";
  width:52px;
  height:52px;
  position:absolute;
  border:2px solid var(--rose);
  border-radius:50%;
  opacity:.65;
}
.logo-copy strong{
  display:block;
  font:600 30px/1 "Cormorant Garamond",serif;
  letter-spacing:5px;
}
.logo-copy span{
  display:block;
  margin-top:4px;
  color:var(--rose);
  font-size:13px;
  letter-spacing:8px;
}

.search-bar{
  display:flex;
  border:1px solid #e7ddd7;
  border-radius:999px;
  background:#fff;
  box-shadow:0 4px 14px rgba(0,0,0,.02);
  overflow:hidden;
}
.search-bar input{
  flex:1;
  border:0;
  outline:0;
  padding:13px 18px;
}
.search-bar button{
  width:52px;
  border:0;
  background:transparent;
  color:var(--rose-dark);
  font-size:24px;
}
.header-actions{
  display:flex;
  justify-content:flex-end;
  gap:22px;
}
.header-action{
  border:0;
  background:none;
  display:grid;
  justify-items:center;
  position:relative;
  color:#211a17;
}
.header-action>span{font-size:25px;line-height:1}
.header-action small{font-size:10px;margin-top:6px}
.cart-action b{
  position:absolute;
  right:2px;
  top:-6px;
  background:var(--rose-dark);
  color:#fff;
  width:18px;
  height:18px;
  border-radius:50%;
  display:grid;
  place-items:center;
  font-size:10px;
}

.main-nav{border-top:1px solid var(--line)}
.nav-scroll{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  overflow-x:auto;
  white-space:nowrap;
  min-height:50px;
}
.nav-scroll a{
  font-size:13px;
  font-weight:600;
  padding:16px 0 13px;
  position:relative;
}
.nav-scroll a.active,
.nav-scroll a:hover{color:var(--rose-dark)}
.nav-scroll a.active::after,
.nav-scroll a:hover::after{
  content:"";
  height:2px;
  background:var(--rose);
  position:absolute;
  left:0;
  right:0;
  bottom:8px;
}

.hero{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 18% 18%,rgba(255,255,255,.9),transparent 32%),
    linear-gradient(90deg,#f9ebdf 0%,#f7e8dc 42%,#ead5c4 100%);
}
.hero-bg{
  position:absolute;inset:0;
  background:
    linear-gradient(90deg,rgba(251,242,234,.96) 0 38%,rgba(251,242,234,.45) 56%,rgba(251,242,234,.05) 75%);
}
.hero-layout{
  min-height:590px;
  position:relative;
  display:grid;
  grid-template-columns:40% 60%;
  align-items:center;
  z-index:2;
}
.hero-copy{padding:60px 0 70px 60px}
.kicker{
  font-size:12px;
  letter-spacing:1.6px;
  font-weight:700;
  color:#584a43;
}
.hero h1{
  font:600 clamp(48px,5.2vw,77px)/.98 "Cormorant Garamond",serif;
  margin:18px 0 22px;
}
.hero h1 em{font-weight:500;color:var(--rose-dark)}
.hero p{
  color:#554b46;
  max-width:520px;
  font-size:16px;
  line-height:1.7;
}
.hero-buttons{display:flex;gap:14px;margin-top:28px}
.btn{
  min-height:46px;
  padding:0 25px;
  border-radius:3px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-weight:700;
  font-size:13px;
  border:1px solid var(--rose);
  transition:.25s ease;
}
.btn-filled{background:var(--rose);color:#fff}
.btn-filled:hover{background:var(--rose-dark);transform:translateY(-2px)}
.btn-outline{background:#fff9f5;color:var(--rose-dark)}
.btn-outline:hover{background:#fff;transform:translateY(-2px)}
.btn-full{width:100%}

.hero-fashion-grid{
  height:590px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:6px;
  transform:skewX(-7deg);
  transform-origin:center;
  margin-right:-90px;
}
.hero-look{
  position:relative;
  overflow:hidden;
  border-left:5px solid rgba(255,255,255,.9);
}
.hero-look img{
  height:100%;
  object-fit:cover;
  transform:skewX(7deg) scale(1.15);
}
.hero-look span{
  position:absolute;
  right:18px;
  bottom:18px;
  background:#fff;
  padding:9px 18px;
  font-size:12px;
  font-weight:700;
  transform:skewX(7deg);
}

.benefits{
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  background:#fff;
}
.benefits-grid{
  display:grid;
  grid-template-columns:repeat(5,1fr);
}
.benefit{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  padding:18px 10px;
  border-right:1px solid var(--line);
}
.benefit:last-child{border-right:0}
.benefit-icon{font-size:28px;color:var(--rose)}
.benefit strong,.benefit small{display:block}
.benefit strong{font-size:12px}
.benefit small{font-size:11px;color:var(--muted);margin-top:2px}

.heritage{padding:30px 0 10px}
.heritage-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.heritage-card{
  min-height:285px;
  border-radius:4px;
  position:relative;
  overflow:hidden;
  display:grid;
  grid-template-columns:1.1fr .9fr;
}
.heritage-card--green{background:linear-gradient(135deg,#f4f5ed,#e5eadb)}
.heritage-card--peach{background:linear-gradient(135deg,#f7eee5,#f3dccd)}
.heritage-card--lavender{background:linear-gradient(135deg,#f5eff3,#e9ddea)}
.heritage-card__copy{padding:34px 0 28px 34px;z-index:2}
.heritage-card__copy>span{font-size:11px;letter-spacing:1px}
.heritage-card h2{
  font:600 39px/.95 "Cormorant Garamond",serif;
  margin:10px 0;
}
.heritage-card p{font-size:13px;color:#5f544e}
.heritage-card a{display:inline-block;margin-top:18px;color:var(--rose-dark);font-size:12px;font-weight:700}
.heritage-card img{
  height:100%;
  object-fit:cover;
  object-position:center top;
  mix-blend-mode:multiply;
}

.categories{padding:22px 0 10px}
.section-title--line{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
}
.section-title--line span{height:1px;background:#d9c8bd;max-width:130px;flex:1}
.section-title h2{
  font:600 18px/1 "Inter",sans-serif;
  letter-spacing:.6px;
}
.category-grid{
  display:grid;
  grid-template-columns:repeat(8,1fr);
  gap:18px;
  margin-top:20px;
}
.category-item{text-align:center}
.category-item img{
  width:112px;
  height:112px;
  object-fit:cover;
  border-radius:50%;
  margin:0 auto 10px;
  border:5px solid #f7ede7;
  transition:.25s;
}
.category-item:hover img{transform:translateY(-5px);box-shadow:var(--shadow)}
.category-item strong{font-size:12px;font-weight:500}

.promo-strip{padding:28px 0 40px}
.promo-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px}
.promo-card{
  min-height:190px;
  position:relative;
  overflow:hidden;
  border-radius:4px;
  padding:28px 30px;
}
.promo-card>div:first-child{position:relative;z-index:2}
.promo-card span{font-size:10px;letter-spacing:1px}
.promo-card h2{
  font:600 32px/1 "Cormorant Garamond",serif;
  margin:8px 0;
}
.promo-card p{font-size:12px}
.promo-card a{display:inline-block;margin-top:13px;font-size:11px;font-weight:700}
.promo-card--light{background:#f5e7df}
.promo-card--light img{
  position:absolute;
  right:0;bottom:0;
  width:52%;
  height:100%;
  object-fit:cover;
  object-position:top;
  mix-blend-mode:multiply;
}
.promo-card--red{background:#82141a;color:#fff}
.promo-card--red .seal{
  position:absolute;
  right:35px;top:26px;
  width:118px;height:118px;
  border-radius:50%;
  background:#f0dfc8;
  color:#7b2a26;
  display:grid;place-items:center;
  text-align:center;
  font:600 17px/1.05 "Cormorant Garamond",serif;
  border:8px double #ad8a69;
}
.promo-card--gift{background:#f5f0eb}
.promo-card--gift strong{
  display:inline-block;
  padding:6px 12px;
  border:1px solid var(--rose);
  color:var(--rose-dark);
  font-size:11px;
}
.gift-box{
  position:absolute;
  right:40px;
  bottom:25px;
  font-size:85px;
}

.products-section{padding:56px 0;background:#fff}
.section-heading-row{
  display:flex;
  align-items:end;
  justify-content:space-between;
  margin-bottom:24px;
}
.section-heading-row span,
.about-copy>span,
.newsletter-box>div>span{font-size:11px;letter-spacing:1.5px;color:var(--rose-dark);font-weight:700}
.section-heading-row h2{
  font:600 48px/1 "Cormorant Garamond",serif;
  margin-top:4px;
}
.text-btn{border:0;background:none;color:var(--rose-dark);font-weight:700}
.product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.product-card{
  border:1px solid var(--line);
  background:#fff;
  border-radius:8px;
  overflow:hidden;
  transition:.25s;
}
.product-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.product-image{position:relative}
.product-image img{height:360px;object-fit:cover;object-position:top}
.product-badge{
  position:absolute;left:12px;top:12px;
  background:var(--rose-dark);color:#fff;
  font-size:10px;font-weight:700;
  padding:6px 9px;border-radius:2px;
}
.product-wish{
  position:absolute;right:12px;top:12px;
  width:36px;height:36px;
  border-radius:50%;border:0;background:rgba(255,255,255,.93);
  font-size:20px;
}
.product-info{padding:15px}
.product-info h3{font-size:14px;margin:0 0 6px}
.product-meta{font-size:11px;color:var(--muted);margin-bottom:8px}
.price-row{display:flex;align-items:center;gap:8px}
.current-price{font-weight:800}
.old-price{text-decoration:line-through;color:#9d928d;font-size:12px}
.discount{font-size:11px;color:#2c7c53;font-weight:700}
.add-btn{
  width:100%;
  border:1px solid var(--rose);
  color:var(--rose-dark);
  background:#fff9f6;
  margin-top:12px;
  padding:11px;
  font-weight:700;
}
.add-btn:hover{background:var(--rose);color:#fff}

.about-section{padding:72px 0}
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:55px;align-items:center}
.about-image-wrap{position:relative}
.about-image-wrap img{height:520px;object-fit:cover;border-radius:10px}
.about-stamp{
  position:absolute;
  right:-22px;
  bottom:30px;
  width:122px;height:122px;
  border-radius:50%;
  background:#fff7f2;
  border:1px solid var(--gold);
  display:grid;place-items:center;
  text-align:center;
  color:var(--rose-dark);
  font:600 18px/1.1 "Cormorant Garamond",serif;
  box-shadow:var(--shadow);
}
.about-copy h2{
  font:600 54px/1 "Cormorant Garamond",serif;
  margin:8px 0 18px;
}
.about-copy h2 em{color:var(--rose);font-weight:500}
.about-copy p{color:var(--muted);line-height:1.75}

.newsletter{padding:0 0 70px}
.newsletter-box{
  background:linear-gradient(135deg,#f4e4da,#fff8f3);
  border:1px solid var(--line);
  border-radius:14px;
  padding:38px 45px;
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:center;
  gap:34px;
}
.newsletter-box h2{
  font:600 40px/1 "Cormorant Garamond",serif;
  margin:6px 0 8px;
}
.newsletter-box p{color:var(--muted);margin:0}
.newsletter-form{
  display:flex;
  overflow:hidden;
  border-radius:3px;
  background:#fff;
  border:1px solid var(--line);
}
.newsletter-form input{flex:1;border:0;outline:0;padding:14px}
.newsletter-form button{border:0;background:var(--rose);color:#fff;padding:0 22px;font-weight:700}

footer{background:#1d1715;color:#f8eee9;padding:55px 0 18px}
.footer-grid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:40px}
.footer-logo{margin-bottom:16px}
.footer-logo .logo-copy strong{color:#fff}
footer h3{font:600 23px/1 "Cormorant Garamond",serif;margin:0 0 14px}
footer p,footer a{font-size:13px;color:#cdbfb8}
footer a{display:block;margin:8px 0}
.footer-bottom{
  border-top:1px solid #3c302c;
  margin-top:34px;
  padding-top:16px;
  display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;
  color:#9f918a;font-size:11px;
}

.whatsapp-float{
  position:fixed;
  right:22px;
  bottom:22px;
  width:56px;height:56px;
  border-radius:50%;
  display:grid;place-items:center;
  background:#25d366;
  color:#fff;
  font-size:26px;
  z-index:1200;
  box-shadow:0 12px 30px rgba(0,0,0,.22);
}

.cart-drawer{
  position:fixed;
  inset:0;
  z-index:1500;
  pointer-events:none;
  opacity:0;
  transition:.25s;
}
.cart-drawer.open{opacity:1;pointer-events:auto}
.cart-drawer__overlay{position:absolute;inset:0;background:rgba(0,0,0,.35)}
.cart-drawer__panel{
  position:absolute;
  right:0;top:0;bottom:0;
  width:min(430px,92vw);
  background:#fff;
  z-index:2;
  transform:translateX(100%);
  transition:.25s;
  display:flex;
  flex-direction:column;
}
.cart-drawer.open .cart-drawer__panel{transform:translateX(0)}
.cart-drawer__head{
  display:flex;align-items:center;justify-content:space-between;
  padding:20px;border-bottom:1px solid var(--line);
}
.cart-drawer__head h2{font:600 30px/1 "Cormorant Garamond",serif;margin:0}
.cart-drawer__head button{border:0;background:none;font-size:34px}
.cart-items{padding:16px;overflow:auto;flex:1}
.cart-item{
  display:grid;grid-template-columns:76px 1fr auto;gap:12px;
  padding:12px 0;border-bottom:1px solid var(--line);
}
.cart-item img{width:76px;height:92px;object-fit:cover}
.cart-item h4{margin:0 0 4px;font-size:13px}
.cart-item p{margin:0;color:var(--muted);font-size:12px}
.cart-item button{border:0;background:none;color:#a24b3d}
.cart-footer{padding:18px;border-top:1px solid var(--line)}
.cart-total{display:flex;justify-content:space-between;margin-bottom:14px;font-size:16px}

@media(max-width:1150px){
  .header-main{grid-template-columns:260px 1fr auto}
  .header-actions{gap:10px}
  .hero-layout{grid-template-columns:45% 55%}
  .hero-copy{padding-left:20px}
  .category-grid{grid-template-columns:repeat(4,1fr)}
  .product-grid{grid-template-columns:repeat(3,1fr)}
  .benefits-grid{grid-template-columns:repeat(3,1fr)}
}

@media(max-width:850px){
  .topbar__right{display:none}
  .header-main{grid-template-columns:1fr auto}
  .search-bar{grid-column:1/-1;grid-row:2}
  .header-action small{display:none}
  .hero-layout{grid-template-columns:1fr}
  .hero-copy{padding:50px 10px 30px}
  .hero-fashion-grid{height:420px;margin:0 -50px 0 0}
  .heritage-grid,.promo-grid{grid-template-columns:1fr}
  .product-grid{grid-template-columns:repeat(2,1fr)}
  .about-grid{grid-template-columns:1fr}
  .newsletter-box{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:repeat(2,1fr)}
}

@media(max-width:560px){
  .topbar__left{gap:8px;font-size:10px;overflow:auto}
  .logo-emblem{width:54px;height:50px;font-size:32px}
  .logo-copy strong{font-size:24px}
  .logo-copy span{font-size:10px;letter-spacing:5px}
  .hero-fashion-grid{height:310px}
  .hero-look span{display:none}
  .benefits-grid{grid-template-columns:1fr 1fr}
  .category-grid{grid-template-columns:repeat(2,1fr)}
  .product-grid{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
}