
  :root{
    --cream:#FFF6EE; --cream-2:#FFEBDD; --card:#FFFFFF;
    --red:#E23B32; --red-deep:#B4291F; --gold:#F6B24B;
    --ink:#38231D; --muted:#9A827A; --line:rgba(56,35,29,.12);
    --display:"Fraunces",Georgia,serif; --body:"Nunito Sans",system-ui,sans-serif;
    --maxw:1200px;
  }
  *{box-sizing:border-box;margin:0;padding:0}
  html{scroll-behavior:smooth}
  body{font-family:var(--body);color:var(--ink);background:var(--cream);-webkit-font-smoothing:antialiased}
  a{color:inherit;text-decoration:none}
  img{max-width:100%;display:block}
  ::selection{background:var(--red);color:#fff}
  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 22px}

  /* announcement */
  .announce{background:var(--red-deep);color:#fff;text-align:center;font-size:.86rem;font-weight:700;letter-spacing:.02em;padding:9px 12px}

  /* header */
  header{background:var(--card);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:50}
  .head{display:flex;align-items:center;gap:22px;padding:16px 0}
  .brand{display:flex;align-items:center;gap:11px;font-family:var(--display);font-weight:700;font-size:1.35rem;white-space:nowrap}
  .bag{width:38px;height:38px;border-radius:11px;background:linear-gradient(140deg,var(--red),var(--red-deep));display:flex;align-items:center;justify-content:center;box-shadow:0 8px 20px rgba(226,59,50,.28)}
  .bag svg{width:20px;height:20px;stroke:#fff;fill:none;stroke-width:1.8}
  .search{flex:1;display:flex;align-items:center;gap:10px;background:var(--cream);border:1px solid var(--line);border-radius:100px;padding:10px 18px;color:var(--muted)}
  .search svg{width:18px;height:18px;stroke:var(--muted);fill:none;stroke-width:2}
  .search input{border:0;background:transparent;outline:0;font-family:var(--body);font-size:.95rem;color:var(--ink);width:100%}
  .head-actions{display:flex;align-items:center;gap:18px}
  .head-actions a{display:flex;align-items:center;gap:7px;font-weight:700;font-size:.9rem}
  .head-actions svg{width:22px;height:22px;stroke:var(--ink);fill:none;stroke-width:1.8}
  .cart-badge{position:relative}
  .cart-badge b{position:absolute;top:-8px;right:-10px;background:var(--red);color:#fff;font-size:.62rem;width:17px;height:17px;border-radius:50%;display:flex;align-items:center;justify-content:center}

  /* category nav */
  .catnav{background:var(--card);border-bottom:1px solid var(--line)}
  .catnav ul{display:flex;gap:26px;list-style:none;overflow-x:auto;padding:13px 0}
  .catnav li{white-space:nowrap}
  .catnav a{font-weight:700;font-size:.9rem;color:var(--ink);opacity:.85;transition:opacity .2s,color .2s}
  .catnav a:hover{color:var(--red-deep);opacity:1}

  /* hero */
  .hero{padding:34px 0}
  .hero-grid{display:grid;grid-template-columns:2fr 1fr;gap:18px}
  .hero-main{position:relative;border-radius:22px;overflow:hidden;background:linear-gradient(120deg,#FFE2D3,#FFD0C6);padding:56px 48px;min-height:320px;display:flex;flex-direction:column;justify-content:center}
  .hero-main::after{content:"";position:absolute;right:-60px;bottom:-60px;width:280px;height:280px;background:radial-gradient(circle,rgba(246,178,75,.55),transparent 65%);filter:blur(20px)}
  .hero-main .eyebrow{font-weight:800;text-transform:uppercase;letter-spacing:.14em;font-size:.75rem;color:var(--red-deep);position:relative;z-index:2}
  .hero-main h1{font-family:var(--display);font-weight:600;font-size:clamp(2rem,4vw,3.1rem);line-height:1.05;letter-spacing:-.02em;margin:14px 0 12px;position:relative;z-index:2;max-width:16ch}
  .hero-main p{color:var(--ink);opacity:.8;max-width:42ch;position:relative;z-index:2}
  .btn{display:inline-flex;align-items:center;gap:8px;font-weight:800;font-size:.95rem;padding:13px 24px;border-radius:100px;cursor:pointer;border:0;transition:transform .18s,box-shadow .18s}
  .btn-red{background:linear-gradient(120deg,var(--red),var(--red-deep));color:#fff;box-shadow:0 10px 26px rgba(226,59,50,.28)}
  .btn-red:hover{transform:translateY(-2px);box-shadow:0 14px 32px rgba(226,59,50,.36)}
  .hero-main .btn{margin-top:24px;align-self:flex-start;position:relative;z-index:2}
  .hero-side{display:grid;grid-template-rows:1fr 1fr;gap:18px}
  .promo{border-radius:22px;padding:26px;display:flex;flex-direction:column;justify-content:center;color:#fff;position:relative;overflow:hidden}
  .promo.a{background:linear-gradient(135deg,#E23B32,#B4291F)}
  .promo.b{background:linear-gradient(135deg,#38231D,#5A3A2E)}
  .promo h3{font-family:var(--display);font-weight:600;font-size:1.4rem;margin-bottom:4px}
  .promo span{font-size:.85rem;opacity:.9}
  .promo a{margin-top:12px;font-weight:800;font-size:.85rem;text-decoration:underline}

  /* section heading */
  .sec{padding:44px 0}
  .sec-head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:26px;gap:16px}
  .sec-head h2{font-family:var(--display);font-weight:600;font-size:clamp(1.5rem,3vw,2.1rem);letter-spacing:-.01em}
  .sec-head a{font-weight:800;color:var(--red-deep);font-size:.9rem;white-space:nowrap}

  /* category tiles */
  .cats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
  .cat{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:26px 20px;text-align:center;transition:transform .2s,box-shadow .2s}
  .cat:hover{transform:translateY(-4px);box-shadow:0 16px 34px rgba(178,41,31,.10)}
  .cat .ic{width:56px;height:56px;margin:0 auto 14px;border-radius:15px;background:linear-gradient(140deg,#FFE7DA,#FFD8C8);display:flex;align-items:center;justify-content:center}
  .cat .ic svg{width:26px;height:26px;stroke:var(--red-deep);fill:none;stroke-width:1.7}
  .cat h3{font-size:1rem;font-weight:800}
  .cat span{font-size:.8rem;color:var(--muted)}

  /* product cards */
  .prods{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
  .prod{background:var(--card);border:1px solid var(--line);border-radius:18px;overflow:hidden;transition:transform .2s,box-shadow .2s}
  .prod:hover{transform:translateY(-4px);box-shadow:0 16px 34px rgba(178,41,31,.10)}
  .prod .ph{aspect-ratio:1;background:linear-gradient(140deg,var(--cream-2),#FFF);display:flex;align-items:center;justify-content:center;position:relative;border-bottom:1px solid var(--line)}
  .prod .ph svg{width:44px;height:44px;stroke:#D9BFB2;fill:none;stroke-width:1.4}
  .prod .tag{position:absolute;top:12px;left:12px;background:var(--red);color:#fff;font-size:.66rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;padding:5px 10px;border-radius:100px}
  .prod .info{padding:16px}
  .prod .info .cat-label{font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
  .prod .info h3{font-size:.98rem;font-weight:700;margin:5px 0 8px;line-height:1.25}
  .prod .info .price{font-weight:800;color:var(--red-deep);font-size:1.05rem}
  .prod .info .price small{color:var(--muted);font-weight:600;text-decoration:line-through;font-size:.82rem;margin-left:6px}
  .prod .info button{margin-top:12px;width:100%;background:var(--ink);color:#fff;border:0;border-radius:100px;padding:10px;font-family:var(--body);font-weight:800;font-size:.85rem;cursor:pointer;transition:background .2s}
  .prod .info button:hover{background:var(--red-deep)}

  /* value strip */
  .values{background:var(--card);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
  .values .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;padding:34px 22px}
  .val{display:flex;align-items:center;gap:13px}
  .val svg{width:30px;height:30px;stroke:var(--red-deep);fill:none;stroke-width:1.6;flex-shrink:0}
  .val b{display:block;font-size:.95rem}
  .val span{font-size:.82rem;color:var(--muted)}

  /* about */
  .about{padding:54px 0}
  .about .box{background:linear-gradient(140deg,#fff,var(--cream-2));border:1px solid var(--line);border-radius:24px;padding:44px}
  .about h2{font-family:var(--display);font-weight:600;font-size:1.7rem;margin-bottom:14px}
  .about p{color:var(--ink);opacity:.82;max-width:75ch;margin-bottom:12px;font-size:.98rem}

  /* footer */
  footer{background:var(--ink);color:#EADFD8;padding:54px 0 26px}
  .fgrid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1.2fr;gap:34px}
  footer h4{font-family:var(--body);font-weight:800;font-size:.8rem;text-transform:uppercase;letter-spacing:.12em;color:#fff;margin-bottom:16px}
  footer ul{list-style:none}
  footer li{margin-bottom:9px}
  footer a{color:#D8C8BF;font-size:.9rem}
  footer a:hover{color:#fff}
  .fbrand{display:flex;align-items:center;gap:10px;font-family:var(--display);font-weight:700;font-size:1.25rem;color:#fff;margin-bottom:12px}
  .fabout{font-size:.88rem;color:#C9B7AD;max-width:34ch;line-height:1.6}
  .contact-line{font-size:.9rem;color:#D8C8BF;margin-bottom:10px;line-height:1.5}
  .contact-line b{color:#fff;display:block;font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;margin-bottom:2px}
  .news{display:flex;gap:8px;margin-top:12px}
  .news input{flex:1;border:0;border-radius:100px;padding:11px 16px;font-family:var(--body);font-size:.85rem}
  .news button{background:var(--red);color:#fff;border:0;border-radius:100px;padding:11px 18px;font-weight:800;font-size:.85rem;cursor:pointer}
  .social{display:flex;gap:12px;margin-top:16px}
  .social a{width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center}
  .social svg{width:18px;height:18px;stroke:#fff;fill:none;stroke-width:1.8}
  .fbottom{border-top:1px solid rgba(255,255,255,.14);margin-top:38px;padding-top:22px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;font-size:.82rem;color:#B7A69C}
  .fbottom a{color:#fff;font-weight:700}

  @media(max-width:960px){
    .hero-grid{grid-template-columns:1fr}.hero-side{grid-template-rows:none;grid-template-columns:1fr 1fr}
    .cats,.prods{grid-template-columns:repeat(2,1fr)}
    .values .wrap{grid-template-columns:1fr 1fr}
    .fgrid{grid-template-columns:1fr 1fr}
  }
  @media(max-width:640px){
    .search{display:none}
    .hero-side{grid-template-columns:1fr}
    .fgrid{grid-template-columns:1fr}
  }

/* ---- category pages ---- */
.breadcrumb{padding:18px 0;font-size:.85rem;color:var(--muted)}
.breadcrumb a{color:var(--red-deep);font-weight:700}
.cat-banner{border-radius:22px;overflow:hidden;background:linear-gradient(120deg,#FFE2D3,#FFD0C6);padding:44px 40px;display:flex;align-items:center;gap:26px;position:relative}
.cat-banner::after{content:"";position:absolute;right:-50px;bottom:-50px;width:240px;height:240px;background:radial-gradient(circle,rgba(246,178,75,.5),transparent 65%);filter:blur(20px)}
.cat-banner .bigicon{width:100px;height:100px;border-radius:26px;background:linear-gradient(140deg,var(--red),var(--red-deep));display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 12px 30px rgba(226,59,50,.28);position:relative;z-index:2}
.cat-banner .bigicon svg{width:50px;height:50px;stroke:#fff;fill:none;stroke-width:1.6}
.cat-banner .txt{position:relative;z-index:2}
.cat-banner h1{font-family:var(--display);font-weight:600;font-size:clamp(1.8rem,4vw,2.7rem);letter-spacing:-.02em}
.cat-banner p{color:var(--ink);opacity:.82;margin-top:8px;max-width:52ch}
.count{color:var(--muted);font-size:.9rem;margin:24px 0 18px}
@media(max-width:640px){.cat-banner{flex-direction:column;text-align:center;padding:32px 22px}}

/* real product & category images */
.prod .ph{background:#fff;border-bottom:1px solid var(--line)}
.prod .ph img{width:100%;height:100%;object-fit:contain;padding:16px}
.prod .info h3{min-height:2.4em}
.prod .info .desc{font-size:.8rem;color:var(--muted);line-height:1.4;margin:0 0 10px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cat{padding:0;overflow:hidden}
.cat .thumb{aspect-ratio:1;background:#fff;display:flex;align-items:center;justify-content:center;border-bottom:1px solid var(--line)}
.cat .thumb img{width:100%;height:100%;object-fit:contain;padding:18px}
.cat .cbody{padding:16px 14px}
.cat h3{font-size:.98rem;font-weight:800;margin-bottom:3px}
.cat span{font-size:.8rem;color:var(--red-deep);font-weight:700}


/* v3 additions */
a.prod{display:block;color:inherit;text-decoration:none}
.prod .info .addbtn{display:block;text-align:center;margin-top:12px;background:var(--ink);color:#fff;border-radius:100px;padding:10px;font-family:var(--body);font-weight:800;font-size:.85rem;transition:background .2s}
.prod:hover .info .addbtn{background:var(--red-deep)}
.pdp{display:grid;grid-template-columns:1fr 1fr;gap:44px;padding:14px 0 64px}
.pdp-img{background:#fff;border:1px solid var(--line);border-radius:20px;display:flex;align-items:center;justify-content:center;padding:30px;min-height:360px}
.pdp-img img{max-width:100%;max-height:430px;object-fit:contain}
.pdp-info .cat-label{font-size:.75rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.pdp-info h1{font-family:var(--display);font-weight:600;font-size:clamp(1.5rem,3vw,2.2rem);letter-spacing:-.01em;margin:8px 0 14px;line-height:1.15}
.pdp-price{font-size:1.7rem;font-weight:800;color:var(--red-deep);margin-bottom:18px}
.pdp-desc{color:var(--ink);opacity:.85;line-height:1.7;margin-bottom:22px;white-space:pre-line}
.addbtn.big{display:inline-block;background:linear-gradient(120deg,var(--red),var(--red-deep));color:#fff;border-radius:100px;padding:14px 30px;font-weight:800;box-shadow:0 10px 26px rgba(226,59,50,.28)}
.backlink{display:inline-block;margin-left:14px;color:var(--red-deep);font-weight:700}
.pdp-note{color:var(--muted);font-size:.85rem;margin-top:22px}
/* mobile */
html{overflow-x:hidden}
@media(max-width:640px){
  .wrap{padding:0 16px}
  .head{gap:10px}
  .brand{font-size:1.02rem;gap:8px}
  .bag{width:32px;height:32px}.bag svg{width:17px;height:17px}
  .head-actions{gap:16px}
  .head-actions a .lbl{display:none}
  .catnav ul{gap:18px;padding:11px 0}
  .hero{padding:22px 0}
  .hero-main{padding:32px 22px;min-height:auto}
  .hero-main h1{font-size:1.85rem}
  .promo{padding:22px}
  .pdp{grid-template-columns:1fr;gap:24px}
  .pdp-img{min-height:240px;padding:20px}
  .backlink{display:block;margin:14px 0 0}
}
@media(max-width:390px){.brand{font-size:.92rem;gap:6px}.head-actions{gap:12px}.announce{font-size:.78rem}}
