@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,500;0,600;1,400;1,500&family=Lato:wght@300;400;700&display=swap');
:root{--cream:#fbf7ef;--ivory:#f4ecdd;--rose:#d9a5a0;--rose-d:#b97a74;--sage:#9aa98a;--sage-d:#6f7f62;--gold:#c9a96e;--ink:#4a3b36}
*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font:300 17px/1.7 Lato,sans-serif}
h1,h2,h3,.logo{font-family:"Playfair Display",serif;font-weight:500;line-height:1.2}a{color:var(--rose-d)}
.wrap{max-width:1140px;margin:auto;padding:0 24px}
.topbar{background:var(--sage-d);color:var(--cream);text-align:center;font-size:12px;letter-spacing:3px;text-transform:uppercase;padding:8px}
header{border-bottom:1px solid #e8dcc6;background:var(--cream);position:sticky;top:0;z-index:10}
header .wrap{display:flex;align-items:center;justify-content:space-between;height:84px}
.logo{display:inline-flex;align-items:center;gap:10px;font-size:30px;font-style:italic;color:var(--ink);text-decoration:none;line-height:1}.logo span{color:var(--gold)}.logo-img{height:52px;width:auto;display:block;max-width:min(280px,55vw)}.logo-text{display:none}
nav a{margin-left:28px;color:var(--ink);text-decoration:none;font-size:13px;letter-spacing:2.5px;text-transform:uppercase}nav a:hover{color:var(--rose-d)}
.menu-toggle{display:none;background:none;border:0;font-size:26px;color:var(--ink)}
.gingham{height:14px;background:repeating-linear-gradient(90deg,rgba(217,165,160,.35) 0 7px,transparent 7px 14px),repeating-linear-gradient(0deg,rgba(217,165,160,.35) 0 7px,transparent 7px 14px),var(--cream)}
.hero{background:linear-gradient(rgba(251,247,239,.55),rgba(251,247,239,.55)),radial-gradient(circle at 80% 30%,#f1d9d3,transparent 55%),radial-gradient(circle at 15% 80%,#dfe5d4,transparent 50%),var(--ivory);text-align:center;padding:110px 24px 120px}
.eyebrow{font-size:12px;letter-spacing:4px;text-transform:uppercase;color:var(--sage-d);margin:0 0 12px}
.hero h1{font-size:clamp(44px,7vw,80px);margin:0 0 10px}.hero h1 em{color:var(--rose-d)}
.hero p.lead{font-family:"Playfair Display",serif;font-style:italic;font-size:22px;margin:0 0 34px}
.flourish{color:var(--gold);letter-spacing:10px;margin:18px 0}
.btn{display:inline-block;background:var(--rose-d);color:#fff;border:0;padding:15px 38px;font:400 13px Lato;letter-spacing:3px;text-transform:uppercase;text-decoration:none;cursor:pointer;transition:.2s}
.btn:hover{background:var(--ink)}.btn.ghost{background:transparent;color:var(--ink);border:1px solid var(--gold)}
section{padding:80px 0}.center{text-align:center}.right{text-align:right}
.title{text-align:center;margin-bottom:44px}.title h2{font-size:40px;margin:0}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:34px}
#featured{grid-template-columns:repeat(4,1fr);gap:24px}
.card{text-decoration:none;color:var(--ink);text-align:center}
.card .img{background:#fff;border:1px solid #efe4d2;padding:22px;transition:.25s}.card:hover .img{box-shadow:0 12px 30px rgba(74,59,54,.1);transform:translateY(-3px)}
.card h3{font-size:20px;margin:18px 0 4px}.price{color:var(--sage-d);font-weight:700;letter-spacing:1px;margin:0}
.about{background:var(--ivory)}.about .wrap{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.about .art{aspect-ratio:1;background:radial-gradient(circle,#fff 0 45%,transparent 46%),repeating-linear-gradient(90deg,rgba(154,169,138,.3) 0 12px,transparent 12px 24px),repeating-linear-gradient(0deg,rgba(154,169,138,.3) 0 12px,transparent 12px 24px);display:flex;align-items:center;justify-content:center;border:1px solid var(--gold);padding:30px}
.about .art p{font-family:"Playfair Display";font-style:italic;font-size:30px;text-align:center;max-width:220px;color:var(--rose-d)}
.about h2{font-size:40px;margin-top:0}
.news{text-align:center}.news form{display:flex;max-width:480px;margin:24px auto 0}
.news input{flex:1;padding:14px 18px;border:1px solid var(--gold);background:#fff;font:inherit}
footer{background:var(--ink);color:#e9dfd0;text-align:center;padding:50px 24px;font-size:14px}footer .logo{color:var(--cream);font-size:26px;justify-content:center}footer .logo-img{height:64px;filter:none}footer a{color:#e9dfd0}
.page-head{text-align:center;padding:70px 24px 10px}.page-head h1{font-size:52px;margin:0}
#product{display:grid;grid-template-columns:1.1fr 1fr;gap:60px;padding:60px 0}
.pimg{background:#fff;border:1px solid #efe4d2;padding:30px}.pinfo h1{font-size:40px;margin:0}.price.big{font-size:22px;margin:8px 0 16px}
h4{font-size:12px;letter-spacing:3px;text-transform:uppercase;margin:26px 0 10px;font-weight:700}
.opts{display:flex;gap:10px;flex-wrap:wrap}.swatch{width:38px;height:38px;border-radius:50%;border:1px solid #cdbca3;cursor:pointer}.swatch.on{outline:2px solid var(--gold);outline-offset:3px}
.size{min-width:52px;padding:10px;background:#fff;border:1px solid #d8c9b0;font:inherit;cursor:pointer}.size.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.pinfo .btn{margin-top:30px;width:100%}.note{color:var(--sage-d);font-style:italic}.small{font-size:14px;color:#857469}
#cart{max-width:820px;margin:auto;padding:40px 0 80px}.line{display:grid;grid-template-columns:90px 1fr auto 90px;gap:20px;align-items:center;border-bottom:1px solid #e8dcc6;padding:16px 0}
.thumb{background:#fff;border:1px solid #efe4d2}.line h3{margin:0;font-size:18px}.line .small{margin:0}
.qty button{background:none;border:1px solid #d8c9b0;width:28px;height:28px;margin:0 8px;cursor:pointer}.total{display:flex;justify-content:space-between;font-size:20px;padding:20px 0 0;font-family:"Playfair Display"}
.prose{max-width:720px;margin:auto;padding:30px 24px 80px;font-size:18px}.prose h2{font-size:30px}
@media(max-width:820px){.grid,#featured{grid-template-columns:repeat(2,1fr);gap:18px}.about .wrap,#product{grid-template-columns:1fr;gap:30px}
 nav{display:none;position:absolute;top:84px;left:0;right:0;background:var(--cream);border-bottom:1px solid #e8dcc6;padding:10px 24px}.nav-open nav{display:block}nav a{display:block;margin:14px 0}
 .menu-toggle{display:block}.logo{font-size:25px}.logo-img{height:42px;max-width:min(220px,58vw)}.hero{padding:80px 20px}section{padding:56px 0}.title h2,.about h2{font-size:32px}.card h3{font-size:16px}.line{grid-template-columns:64px 1fr;}.news form{flex-direction:column;gap:10px}}
/* v2: photos, hero feature, tabs, cozy */
.card .img{padding:0;aspect-ratio:4/5;overflow:hidden}.card .img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s}.card:hover .img img{transform:scale(1.04)}
.svgwrap{width:100%;height:100%;display:flex;align-items:center;justify-content:center;padding:22px;background:#fff}.svgwrap svg{width:100%}
.pimg{padding:0;aspect-ratio:4/5;overflow:hidden}.pimg img{width:100%;height:100%;object-fit:cover;display:block}
.thumb{aspect-ratio:4/5;overflow:hidden}.thumb img{width:100%;height:100%;object-fit:cover;display:block}.thumb .svgwrap{padding:4px}
.hero{padding:70px 24px;text-align:left}.hero-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:60px;align-items:center}
.hero-feature{position:relative;display:block;border:1px solid var(--gold);padding:12px;background:#fff;box-shadow:0 20px 40px rgba(74,59,54,.12)}.hero-feature img{width:100%;aspect-ratio:1;object-fit:cover;display:block}
.tag{position:absolute;left:24px;bottom:24px;background:rgba(251,247,239,.94);color:var(--ink);font-size:12px;letter-spacing:2px;text-transform:uppercase;padding:8px 14px}
.tabs{display:flex;justify-content:center;gap:10px;margin-top:20px}.tabs a{padding:9px 24px;border:1px solid var(--gold);text-decoration:none;color:var(--ink);font-size:13px;letter-spacing:2.5px;text-transform:uppercase}.tabs a.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.cozy{background:linear-gradient(180deg,#f3e6e0,var(--cream))}.lead2{font-family:"Playfair Display";font-style:italic;font-size:19px;margin:8px 0 0}
#featured{grid-template-columns:repeat(4,1fr)}
@media(max-width:820px){.hero{text-align:center}.hero-grid{grid-template-columns:1fr;gap:36px}#featured{grid-template-columns:repeat(2,1fr)}#cozy{grid-template-columns:1fr 1fr}#cozy .card:first-child{grid-column:1/-1}nav a{margin-left:0}.tabs a{padding:8px 14px}}
/* v3: full store */
nav a{margin-left:20px;letter-spacing:2px;font-size:12.5px}
.grid.g4,#favorite,#cozy,#gifts,#more{grid-template-columns:repeat(4,1fr);gap:24px}
#grid{grid-template-columns:repeat(4,1fr);gap:28px}
.card .img,.coll .img{aspect-ratio:1;background:#fff}
.card .img img,.coll .img img,.pimg img,.thumb img{object-fit:cover}
.pimg{aspect-ratio:1}
.dots{display:flex;justify-content:center;gap:6px;margin-top:12px}.dots i{width:12px;height:12px;border-radius:50%;border:1px solid #cdbca3;display:block}
.card h3{font-size:17px;margin-top:10px}
.colls{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.coll{text-decoration:none;color:var(--ink);text-align:center;background:#fff;border:1px solid #efe4d2;padding:14px 14px 18px;transition:.25s}.coll:hover{box-shadow:0 12px 30px rgba(74,59,54,.1);transform:translateY(-3px)}
.coll .img{overflow:hidden}.coll img{width:100%;height:100%;display:block}.coll h3{font-size:22px;margin:14px 0 2px}.coll .small{margin:0}
.fav{background:linear-gradient(180deg,#fbf3e4,var(--cream))}
.tabs{flex-wrap:wrap}.tabs.sub a{font-size:11.5px;padding:7px 16px;border-color:#e2d3b8}.tabs.sub a.on{background:var(--rose-d);border-color:var(--rose-d)}
.sib{display:flex;flex-wrap:wrap;gap:10px}.sib a{border:1px solid var(--gold);padding:8px 14px;text-decoration:none;color:var(--ink);font-size:14px}
.pinfo .eyebrow a{color:inherit;text-decoration:none}
#shop-count{margin:4px 0 0}
@media(max-width:1100px){nav a{margin-left:14px;font-size:11.5px;letter-spacing:1.5px}}
@media(max-width:980px){#grid,.grid.g4,#favorite,#cozy,#gifts,#more,.colls{grid-template-columns:repeat(2,1fr);gap:16px}
 nav{display:none;position:absolute;top:84px;left:0;right:0;background:var(--cream);border-bottom:1px solid #e8dcc6;padding:10px 24px}.nav-open nav{display:block}nav a{display:block;margin:14px 0}.menu-toggle{display:block}
 #cozy .card:first-child{grid-column:auto}.tabs a{padding:7px 12px;font-size:11px}.coll h3{font-size:18px}}
/* many color swatches */
.swatch-row{display:flex;flex-wrap:wrap;gap:8px;max-height:140px;overflow-y:auto;padding:4px 2px 8px;border:1px solid #efe4d2;background:#fff;border-radius:8px}
.swatch{width:28px;height:28px;flex:0 0 auto}
#color-count{margin:6px 0 0}
.dots .more{font-size:11px;color:#857469;margin-left:4px;align-self:center}