@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400&family=Lato:wght@300;400;500;700&family=Montserrat:wght@400;500;600&display=swap');

:root{
  --bg:#F9F7F2; --sage:#8A9A5B; --cta:#D63384; --cta-hover:#c02070; --text:#4A4A4A;
  --border:#E8E4DC; --muted:#B8B8B8;
}
*{box-sizing:border-box;}
body{margin:0;background:var(--bg);color:var(--text);font-family:'Lato',sans-serif;line-height:1.6;}
a{text-decoration:none;color:inherit;}
img{max-width:100%;display:block;}

/* Announcement bar */
.announce{background:var(--sage);color:#fff;font-family:'Montserrat',sans-serif;font-size:.78rem;padding:9px 16px;display:flex;justify-content:center;align-items:center;gap:28px;flex-wrap:nowrap;letter-spacing:.02em;overflow-x:auto;white-space:nowrap;-ms-overflow-style:none;scrollbar-width:none;}
.announce::-webkit-scrollbar{display:none;}
.announce span{display:flex;align-items:center;gap:6px;white-space:nowrap;flex-shrink:0;}
.announce svg{width:14px;height:14px;flex-shrink:0;}
@media(max-width:640px){.announce{gap:8px;font-size:.56rem;padding:7px 10px;justify-content:flex-start;}.announce svg{width:9px;height:9px;}}
@media(max-width:380px){.announce{gap:6px;font-size:.5rem;}}

/* Header */
header.site-header{position:sticky;top:0;z-index:100;height:72px;background:rgba(249,247,242,.96);backdrop-filter:blur(16px);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:center;}
.brand-wrap{display:flex;align-items:center;gap:14px;}
.brand-line{width:28px;height:1px;background:#8A9A5B44;}
.brand-dot{width:4px;height:4px;border-radius:50%;background:#8A9A5B44;}
.brand-text{text-align:center;}
.brand-text .name{font-family:'Cormorant Garamond',serif;font-size:1.75rem;color:var(--text);letter-spacing:.03em;}
.brand-text .sub{font-family:'Lato',sans-serif;font-size:.58rem;letter-spacing:.35em;color:var(--sage);text-transform:uppercase;}

/* Hero */
.hero{position:relative;height:clamp(400px,60vh,700px);overflow:hidden;}
.hero img{width:100%;height:100%;object-fit:cover;}
.hero::after{content:'';position:absolute;left:0;right:0;bottom:0;height:80px;background:linear-gradient(to bottom, transparent, var(--bg));}

/* Products section */
.products-section{max-width:1300px;margin:0 auto;padding:56px 32px 80px;}
.section-title-wrap{display:flex;align-items:center;justify-content:center;gap:20px;margin-bottom:32px;}
.section-title-wrap .line{height:1px;width:80px;background:linear-gradient(to right, transparent, var(--sage));flex-shrink:0;}
.section-title-wrap .line.right{background:linear-gradient(to left, transparent, var(--sage));}
.section-title-wrap h2{font-family:'Cormorant Garamond',serif;font-size:2rem;font-weight:500;text-align:center;margin:0;white-space:nowrap;}
@media(max-width:480px){
  .section-title-wrap{gap:10px;}
  .section-title-wrap .line{width:36px;}
  .section-title-wrap h2{font-size:1.5rem;}
}
@media(max-width:360px){
  .section-title-wrap .line{width:20px;}
  .section-title-wrap h2{font-size:1.3rem;}
}

.filter-wrap{display:flex;justify-content:center;align-items:center;gap:12px;margin-bottom:40px;flex-wrap:wrap;}
.filter-select-wrap{position:relative;}
.filter-select{appearance:none;font-family:'Montserrat',sans-serif;font-size:.85rem;padding:11px 40px 11px 18px;border-radius:24px;border:1px solid var(--border);background:#fff;color:var(--text);cursor:pointer;min-width:220px;}
.filter-select.active{background:var(--sage);color:#fff;border-color:var(--sage);}
.filter-arrow{position:absolute;right:16px;top:50%;transform:translateY(-50%);pointer-events:none;width:10px;height:10px;}
.clear-filter{font-family:'Montserrat',sans-serif;font-size:.78rem;color:#888;background:#eee;border:none;padding:10px 16px;border-radius:20px;cursor:pointer;}
.clear-filter:hover{background:#ddd;}

.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
@media(max-width:900px){.grid{grid-template-columns:repeat(2,1fr);gap:10px;}}

.card{background:#fff;border:1px solid var(--border);border-radius:12px;overflow:hidden;transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;display:flex;flex-direction:column;height:100%;}
.card:hover{transform:translateY(-6px);box-shadow:0 14px 30px rgba(214,51,132,.12);border-color:#D6338344;}
.card-img-wrap{position:relative;aspect-ratio:1/1;overflow:hidden;cursor:zoom-in;background:#f2f0ea;flex-shrink:0;}
.card-img-wrap img{width:100%;height:100%;object-fit:cover;transition:transform .3s ease;}
.card:hover .card-img-wrap img{transform:scale(1.04);}
.card-img-wrap.out img{filter:grayscale(1) brightness(.9);}
.out-badge{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(249,247,242,.85);backdrop-filter:blur(3px);}
.out-badge span{font-family:'Montserrat',sans-serif;font-size:.72rem;letter-spacing:.15em;text-transform:uppercase;color:#777;font-weight:600;}

.card-info{padding:16px 18px 20px;display:flex;flex-direction:column;flex:1;}
.card-info .pname{font-family:'Cormorant Garamond',serif;font-size:1.1rem;color:var(--text);margin:0 0 4px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.3;min-height:2.6em;}
.card-info .pcode{font-family:'Lato',sans-serif;font-size:.67rem;color:var(--muted);letter-spacing:.12em;margin-bottom:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

.info-toggle{background:none;border:none;font-family:'Montserrat',sans-serif;font-size:.72rem;color:var(--sage);cursor:pointer;display:flex;align-items:center;gap:5px;padding:0;margin-bottom:8px;white-space:nowrap;}
.info-toggle svg{width:9px;height:9px;transition:transform .2s;flex-shrink:0;}
.info-toggle.open svg{transform:rotate(180deg);}
.desc-box{max-height:0;overflow:hidden;transition:max-height .4s ease;}
.desc-box.open{max-height:1000px;}
.desc-box p{font-size:.8rem;border-left:2px solid var(--sage);padding:8px 12px;margin:0 0 10px;background:#faf9f5;color:#777;white-space:pre-line;line-height:1.7;}

.price-row{display:flex;justify-content:space-between;align-items:baseline;margin-top:auto;margin-bottom:12px;padding-top:8px;flex-wrap:nowrap;gap:8px;}
.price{font-family:'Cormorant Garamond',serif;font-size:1.05rem;white-space:nowrap;flex-shrink:0;}
.price.out{text-decoration:line-through;color:#aaa;}
.avail{font-size:.68rem;color:var(--sage);white-space:nowrap;flex-shrink:0;}

.buy-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;background:var(--cta);color:#fff;border:none;border-radius:24px;padding:11px;font-family:'Montserrat',sans-serif;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;transition:background .2s;white-space:nowrap;}
.buy-btn:hover{background:var(--cta-hover);}
.buy-btn.disabled{background:var(--border);color:#999;pointer-events:none;}
.buy-btn svg{width:15px;height:15px;flex-shrink:0;}


/* Skeleton */
.skel-card{background:#fff;border:1px solid var(--border);border-radius:12px;overflow:hidden;}
.skel-img{aspect-ratio:1/1;background:linear-gradient(90deg,#eee,#f5f5f2,#eee);background-size:200% 100%;animation:shimmer 1.4s infinite;}
.skel-line{height:12px;margin:14px 16px;border-radius:4px;background:linear-gradient(90deg,#eee,#f5f5f2,#eee);background-size:200% 100%;animation:shimmer 1.4s infinite;}
@keyframes shimmer{0%{background-position:200% 0;}100%{background-position:-200% 0;}}

/* Lightbox */
.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.95);z-index:2000;display:flex;align-items:center;justify-content:center;padding:20px;}
.lightbox img{max-width:90vw;max-height:90vh;object-fit:contain;}
.lightbox-close{position:absolute;top:12px;right:16px;color:#999;font-size:1.8rem;background:none;border:none;cursor:pointer;line-height:1;}

.info-modal-card{position:relative;background:var(--bg);border-radius:14px;padding:32px 28px 28px;max-width:420px;width:100%;max-height:80vh;overflow-y:auto;}
.info-modal-card h3{font-family:'Cormorant Garamond',serif;font-size:1.3rem;color:var(--text);margin:0 0 16px;padding-right:20px;}
.info-modal-card p{font-size:.88rem;color:#666;white-space:pre-line;line-height:1.8;margin:0;}
.info-modal-card .lightbox-close{color:#999;}
.info-modal-card .lightbox-close:hover{color:#333;}

/* Footer */
footer.site-footer{background:var(--sage);color:#fff;padding:50px 32px 24px;}
.footer-grid{max-width:1300px;margin:0 auto;display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:32px;}
@media(max-width:768px){.footer-grid{grid-template-columns:1fr;}}
.footer-grid h3{font-family:'Cormorant Garamond',serif;font-size:1.4rem;margin:0 0 8px;}
.footer-grid p, .footer-grid a{font-size:.85rem;opacity:.92;display:block;margin-bottom:6px;}
.footer-grid a:hover{text-decoration:underline;}
.footer-bottom{max-width:1300px;margin:36px auto 0;padding-top:20px;border-top:1px solid rgba(255,255,255,.25);text-align:center;font-size:.78rem;opacity:.85;}

/* WhatsApp float */
.wa-float{position:fixed;bottom:28px;right:28px;width:58px;height:58px;border-radius:50%;background:linear-gradient(135deg,#25D366,#128C7E);display:flex;align-items:center;justify-content:center;box-shadow:0 6px 18px rgba(0,0,0,.25);z-index:1000;transition:transform .2s;}
.wa-float:hover{transform:scale(1.1);}
.wa-float svg{width:28px;height:28px;fill:#fff;}