/* =====================================================================
   Earthmede storefront — shared layout (header, footer, cards, forms,
   listing, basket, checkout, CMS pages). Tokens come from luxe.css.
   ===================================================================== */

/* ---------- base (pages without the legacy theme stylesheet) ---------- */
.em-page{margin:0;background:var(--lx-ivory);color:var(--lx-ink);font:400 15px/1.65 var(--lx-sans);-webkit-font-smoothing:antialiased}
.em-page *,.em-page *::before,.em-page *::after{box-sizing:border-box}
.em-page img{max-width:100%;height:auto;display:block}
.em-page a{color:inherit;text-decoration:none}
.em-page button,.em-page input,.em-page select,.em-page textarea{font:inherit;color:inherit}
.em-page h1,.em-page h2,.em-page h3{font-family:var(--lx-serif);font-weight:500;line-height:1.1;margin:0}
.em-page p{margin:0 0 1em}
.em-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.em-hp{position:absolute!important;left:-9999px!important;opacity:0}
.em-skip{position:absolute;left:-999px;top:8px;z-index:10000;background:var(--lx-ink);color:#fff!important;padding:10px 16px}
.em-skip:focus{left:8px}
.ic{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;flex:none}
.em-wrap{max-width:1400px;margin:0 auto;padding:0 clamp(16px,3vw,40px)}
.em-narrow{max-width:860px}
.em-main{display:block;min-height:40vh}
.lx-stars{color:var(--lx-brass);letter-spacing:2px;white-space:nowrap}
.lx-stars-off{color:var(--lx-line)}

.em-h1{font-family:var(--lx-serif)!important;font-weight:400!important;font-size:clamp(36px,4.4vw,60px)!important;line-height:1.02!important;letter-spacing:-.01em;margin:6px 0 12px!important;color:var(--lx-ink)}
.em-h2{font-family:var(--lx-serif)!important;font-weight:400!important;font-size:clamp(30px,3vw,44px)!important;line-height:1.05!important;margin:0!important;color:var(--lx-ink)}
.em-h3{font-family:var(--lx-serif)!important;font-weight:500!important;font-size:24px!important;margin:0 0 14px!important}
.em-lede{font-size:16.5px;line-height:1.7;color:#5A5048;max-width:62ch}
.em-small{font-size:12.5px;color:var(--lx-muted);line-height:1.6}
.em-meta{font-size:13px;color:var(--lx-muted)}
.em-link{display:inline-flex;align-items:center;gap:8px;font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--lx-ink)!important;border-bottom:1px solid currentColor;padding-bottom:3px}
.em-link .ic{width:15px;height:15px;transition:transform .3s}
.em-link:hover .ic{transform:translateX(4px)}
.em-link.is-light{color:#F4ECE0!important}
.em-chip{display:inline-block;padding:7px 16px;border-radius:999px;background:rgba(251,248,243,.14);border:1px solid rgba(217,185,131,.5);color:#F4ECE0;font-size:11px;letter-spacing:.2em;text-transform:uppercase}
.em-chip.is-soft{background:var(--lx-stone);border-color:transparent;color:var(--lx-brass-dark);letter-spacing:.08em;text-transform:none;font-size:13px}

/* buttons */
.em-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:0 28px;border:1px solid var(--lx-ink)!important;background:var(--lx-ink)!important;color:var(--lx-ivory)!important;font:500 12.5px/1 var(--lx-sans)!important;letter-spacing:.16em!important;text-transform:uppercase;cursor:pointer;border-radius:0!important;transition:background .25s,border-color .25s,color .25s;text-decoration:none!important}
.em-btn:hover{background:var(--lx-brass)!important;border-color:var(--lx-brass)!important;color:#fff!important}
.em-btn .ic{width:16px;height:16px}
.em-btn-ghost{background:transparent!important;color:var(--lx-ink)!important}
.em-btn-ghost:hover{background:var(--lx-ink)!important;color:var(--lx-ivory)!important;border-color:var(--lx-ink)!important}
.em-btn-light{background:var(--lx-ivory)!important;border-color:var(--lx-ivory)!important;color:var(--lx-ink)!important;border-radius:999px!important}
.em-btn-block{width:100%}
.em-linkish{background:none;border:0;padding:0;color:inherit;font:inherit;cursor:pointer;text-decoration:underline;text-underline-offset:3px}

/* flash */
.em-flash{max-width:1400px;margin:14px auto;padding:14px 18px;background:var(--lx-stone);border-left:3px solid var(--lx-brass);font-size:14px}
.em-flash.is-ok{border-color:#6F7F4E}
.em-flash.is-error{border-color:var(--lx-oxblood);background:#F7EAE8}
.em-flash ul{margin:0;padding-left:18px}

/* ---------- promo strip (above the announcement bar, dismissible) ---------- */
/* Its own band in the moss green, carrying the brand lines on a ticker. The announcement bar
   below it is untouched and keeps the standing message, the coupon code and the quick links. */
.em-promo{background:var(--lx-moss);color:#EDEFE7;font-size:12px;letter-spacing:.06em}
.em-promo[hidden]{display:none}
.em-promo .em-wrap{display:flex;align-items:center;gap:16px;min-height:36px}
/* One box the height of a single line, with the messages stacked inside it and slid through one
   at a time, so the strip never changes height as they rotate. */
.em-promo-ticker{position:relative;margin:0!important;flex:1 1 auto;min-width:0;height:20px;overflow:hidden;text-align:center}
.em-promo-msg{position:absolute;left:0;top:0;width:100%;margin:0!important;line-height:20px;color:#EDEFE7;text-transform:uppercase;letter-spacing:.12em;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:0;transform:translateY(100%);transition:opacity .45s ease,transform .45s cubic-bezier(.3,.7,.2,1)}
.em-promo-msg.is-on{opacity:1;transform:none}
.em-promo-msg.is-out{opacity:0;transform:translateY(-100%)}
.em-promo-x{flex:0 0 auto;width:24px;height:24px;margin-right:-6px;padding:0;border:0;background:transparent;color:#EDEFE7;display:grid;place-items:center;cursor:pointer;opacity:.7;border-radius:50%;transition:opacity .2s,background .2s}
.em-promo-x:hover{opacity:1;background:rgba(255,255,255,.16)}
.em-promo-x .ic{width:13px;height:13px}
@media (prefers-reduced-motion:reduce){
  .em-promo-msg{transition:opacity .2s;transform:none!important}
  .em-promo-msg.is-out{opacity:0}
}

/* ---------- announcement + header ---------- */
.em-announce{background:var(--lx-espresso);color:#E9DFD2;font-size:12px;letter-spacing:.06em}
.em-announce .em-wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:40px}
.em-announce-msg{margin:0!important;color:#E9DFD2}
.em-announce-links{display:flex;align-items:center;gap:22px}
.em-announce-links a{color:#E9DFD2!important;opacity:.9}
.em-announce-links a:hover{color:#D9B983!important}
.em-cur{display:inline-flex;border:1px solid rgba(217,185,131,.35);border-radius:999px;overflow:hidden}
.em-cur a{padding:3px 10px;font-size:11px;letter-spacing:.08em}
.em-cur a.is-on{background:#D9B983;color:var(--lx-ink)!important;opacity:1}
.em-header{position:sticky;top:0;z-index:900;background:rgba(251,248,243,.97);backdrop-filter:blur(8px);border-bottom:1px solid var(--lx-line);transition:box-shadow .3s}
.em-header.is-stuck{box-shadow:0 12px 30px -24px rgba(27,23,20,.45)}
.em-header-main{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:clamp(20px,4vw,56px);min-height:82px}
.em-logo img{width:186px;height:auto}
.em-burger,.em-search-toggle{display:none;background:none;border:0;padding:6px;cursor:pointer;color:var(--lx-ink)}
.em-burger .ic,.em-search-toggle .ic{width:24px;height:24px}
.em-search{display:flex;align-items:center;max-width:520px;width:100%;justify-self:center;border:1px solid var(--lx-line);background:#fff;transition:border-color .2s}
.em-search:focus-within{border-color:var(--lx-ink)}
.em-search input{flex:1;border:0!important;background:transparent!important;padding:12px 16px!important;font-size:14px;outline:none;min-width:0;height:auto!important;box-shadow:none!important}
.em-search button{background:none!important;border:0!important;padding:0 14px!important;cursor:pointer;color:var(--lx-ink)!important;min-height:44px}
.em-actions{display:flex;align-items:center;gap:22px}
.em-gift-link{display:inline-flex;align-items:center;gap:8px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--lx-ink)!important}
.em-gift-link .ic{color:var(--lx-brass)}
.em-bag{position:relative;display:inline-flex;color:var(--lx-ink)!important}
.em-bag .ic{width:26px;height:26px}
.em-bag-count{position:absolute;top:-6px;right:-9px;min-width:19px;height:19px;border-radius:999px;background:var(--lx-brass);color:#fff;font-size:11px;line-height:19px;text-align:center;padding:0 5px}
.em-bag-count.bump{animation:emBump .5s}
@keyframes emBump{40%{transform:scale(1.35)}}
.em-nav{border-top:1px solid var(--lx-line)}
.em-nav ul{display:flex;justify-content:center;flex-wrap:wrap;gap:clamp(18px,3vw,44px);list-style:none;margin:0;padding:0}
.em-nav a{display:block;padding:14px 0;font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--lx-ink)!important;position:relative}
.em-nav a::after{content:"";position:absolute;left:0;right:0;bottom:9px;height:1px;background:var(--lx-brass);transform:scaleX(0);transition:transform .3s}
.em-nav a:hover::after,.em-nav a.is-active::after{transform:scaleX(1)}
.em-nav a.is-sale{color:var(--lx-oxblood)!important}

/* drawer */
.em-drawer{position:fixed;inset:0;z-index:2000;visibility:hidden}
.em-drawer.is-open{visibility:visible}
.em-drawer-bg{position:absolute;inset:0;background:rgba(27,23,20,.45);opacity:0;transition:opacity .3s}
.em-drawer.is-open .em-drawer-bg{opacity:1}
.em-drawer-panel{position:absolute;left:0;top:0;bottom:0;width:min(88vw,380px);background:var(--lx-ivory);padding:22px 24px;overflow-y:auto;transform:translateX(-100%);transition:transform .35s ease}
.em-drawer.is-open .em-drawer-panel{transform:none}
.em-drawer-close{position:absolute;right:14px;top:14px;background:none;border:0;cursor:pointer;padding:6px}
.em-drawer-logo{margin-bottom:20px}
.em-drawer-search{display:flex;border:1px solid var(--lx-line);background:#fff;margin-bottom:18px}
.em-drawer-search input{flex:1;border:0;padding:12px;background:none;min-width:0}
.em-drawer-search button{background:none;border:0;padding:0 12px}
.em-drawer-menu,.em-drawer-sub{list-style:none;margin:0 0 18px;padding:0}
.em-drawer-menu a{display:block;padding:14px 0;border-bottom:1px solid var(--lx-line);font-family:var(--lx-serif);font-size:22px}
.em-drawer-sub a{display:block;padding:8px 0;font-size:14px;color:var(--lx-muted)}
.em-drawer-cur{display:flex;gap:8px}
.em-drawer-cur a{padding:8px 14px;border:1px solid var(--lx-line);font-size:13px}
.em-drawer-cur a.is-on{background:var(--lx-ink);color:#fff}
body.em-lock{overflow:hidden}

/* ---------- footer ---------- */
.em-assure{border-top:1px solid var(--lx-line);background:var(--lx-stone)}
.em-assure .em-wrap{display:grid;grid-template-columns:repeat(4,1fr)}
.em-assure .em-wrap>div{display:grid;grid-template-columns:auto 1fr;column-gap:14px;align-items:center;padding:26px 18px;border-right:1px solid var(--lx-line)}
.em-assure .em-wrap>div:last-child{border-right:0}
.em-assure .ic{grid-row:span 2;width:26px;height:26px;color:var(--lx-brass)}
.em-assure b{font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:500;align-self:end}
.em-assure span{font-size:13px;color:var(--lx-muted);align-self:start}
.em-footer{background:var(--lx-espresso);color:#CBBDAA;font-size:14px}
.em-footer a{color:#E9DFD2!important}
.em-footer a:hover{color:#D9B983!important}
.em-footer-top{display:grid;grid-template-columns:1.4fr .8fr .8fr .8fr 1.5fr;gap:clamp(24px,3vw,48px);padding-top:clamp(56px,6vw,90px);padding-bottom:50px}
.em-footer-brand img{filter:invert(1) brightness(1.9);margin-bottom:18px;width:170px}
.em-footer-brand p,.em-footer-brand address{color:#BFB09C;font-style:normal;line-height:1.7;margin:0 0 14px}
.em-social{display:flex;flex-wrap:wrap;gap:8px}
.em-social a{padding:7px 14px;border:1px solid rgba(217,185,131,.3);border-radius:999px;font-size:12px}
.em-footer h2{font:500 11.5px/1 var(--lx-sans)!important;letter-spacing:.2em!important;text-transform:uppercase;color:#FBF8F3!important;margin:6px 0 20px!important}
.em-footer ul{list-style:none;margin:0;padding:0}
.em-footer li{margin:0 0 11px}
.em-footer-news p{color:#BFB09C}
.em-news-row{display:flex;border:1px solid rgba(217,185,131,.4)}
.em-news-row input{flex:1;min-width:0;border:0!important;background:transparent!important;padding:14px 16px!important;color:inherit!important;outline:none;height:auto!important}
.em-news-row button{border:0;background:#D9B983;color:var(--lx-ink);padding:0 20px;font:500 11.5px/1 var(--lx-sans);letter-spacing:.16em;text-transform:uppercase;cursor:pointer}
.em-news-row button:hover{background:#FBF8F3}
.em-check{display:flex;gap:10px;align-items:flex-start;margin-top:12px;font-size:12.5px;line-height:1.5;cursor:pointer}
.em-check input{margin-top:3px;accent-color:var(--lx-brass);width:auto!important}
.em-footer-bottom{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;padding-top:26px;padding-bottom:30px;border-top:1px solid rgba(217,185,131,.18);font-size:12.5px}
.em-footer-legal p{margin:0 0 6px;color:#A89A87}
.em-footer-legal nav{display:flex;flex-wrap:wrap;gap:18px;margin-top:8px}
.em-footer-legal .em-linkish{color:#E9DFD2;font-size:12.5px}
.em-pay{width:330px;opacity:.8;filter:grayscale(.2)}

/* floating */
.em-top{position:fixed;right:20px;bottom:20px;z-index:997;width:46px;height:46px;border-radius:50%;border:0;background:var(--lx-ink);color:#fff;display:grid;place-items:center;cursor:pointer;opacity:0;pointer-events:none;transition:opacity .3s,transform .3s;transform:translateY(10px)}
/* Stroke is set here, not inherited: .em-page button{color:inherit} outranks .em-top's own
   colour, so an inherited arrow comes out ink-on-ink and vanishes into the circle. */
.em-top .ic{transform:rotate(-90deg);width:22px;height:22px;stroke:var(--lx-ivory);stroke-width:1.7}
.em-top.on{opacity:1;pointer-events:auto;transform:none}
/* The legacy theme carries its own #to-top rule, and an id beats .em-top: it forces 36px, parks
   the button at 5px and applies scale(0), which hid it altogether on the homepage. */
#to-top.em-top{width:46px;height:46px;padding:0;right:20px;bottom:20px;transform:translateY(10px)}
#to-top.em-top.on{transform:none}
.em-legacy #to-top.scroll-button{display:none}

/* cookie banner */
.em-cookie{position:fixed;left:20px;right:20px;bottom:20px;z-index:3000;max-width:980px;margin:0 auto;background:#FBF8F3;border:1px solid var(--lx-line);box-shadow:0 30px 60px -30px rgba(27,23,20,.5);padding:22px 24px;display:flex;gap:24px;align-items:center;font-size:13.5px;line-height:1.6}
.em-cookie[hidden]{display:none}
.em-cookie p{margin:0}
.em-cookie a{text-decoration:underline}
.em-cookie-main{flex:1}
.em-cookie-prefs{display:grid;gap:4px;margin-top:10px}
.em-cookie-btns{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.em-cookie .em-btn{min-height:42px;padding:0 18px;font-size:11px!important}

/* ---------- product cards / rails / grids ---------- */
/* The card is a surface now, not four loose elements on the page background. The photo runs
   full-bleed to the top edge; everything below it is inset, so a row of cards reads as a row of
   objects rather than a ragged column of text. */
.em-card{position:relative;display:flex;flex-direction:column;background:#FFFDF9;border:1px solid var(--lx-line);transition:border-color .25s,box-shadow .25s,transform .25s}
.em-card:hover{border-color:var(--lx-sand);box-shadow:0 10px 28px -18px rgba(27,23,20,.45);transform:translateY(-2px)}
.em-card-img{position:relative;display:block;aspect-ratio:1;overflow:hidden;background:var(--lx-stone)}
.em-card-img img{width:100%;height:100%;object-fit:cover;transition:opacity .5s,transform 1s cubic-bezier(.2,.7,.2,1)}
.em-card-img .em-card-alt{position:absolute;inset:0;opacity:0}
.em-card:hover .em-card-img .em-card-alt{opacity:1}
.em-card:hover .em-card-img img{transform:scale(1.03)}
/* Flags stack down the top-left corner: the saving first, then whatever the shop is saying
   about the piece this week. Three is the limit — past that they stop being read at all. */
.em-card-flags{position:absolute;left:12px;top:12px;display:grid;gap:5px;justify-items:start;z-index:1;pointer-events:none}
.em-card-flag{padding:4px 9px;border:1px solid rgba(126,44,39,.45);background:rgba(251,248,243,.92);color:var(--lx-oxblood);font-size:11px;letter-spacing:.1em;line-height:1.25}
.em-card-flag.is-soft{color:var(--lx-brass-dark);border-color:rgba(168,131,79,.45)}
.em-card-flag.is-ink{color:var(--lx-ivory);background:rgba(27,23,20,.88);border-color:transparent}
.em-card-flag.is-oxblood{color:var(--lx-ivory);background:rgba(126,44,39,.9);border-color:transparent}
.em-card-flag.is-sage{color:#38431F;background:rgba(222,228,203,.95);border-color:rgba(110,124,70,.4)}
.em-card-flag.is-moss{color:#EDEFE7;background:var(--lx-moss);border-color:transparent}
/* Fixed height, with the price pushed to the bottom of it. A two-line name, a missing rating
   line — neither of them shunts the price out of step with the card beside it. */
.em-card-body{display:flex;flex-direction:column;gap:5px;min-height:122px;padding:14px 14px 12px}
.em-card-name{font:400 15px/1.35 var(--lx-sans)!important;margin:0!important;letter-spacing:.01em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.em-card-name a{color:var(--lx-ink)!important}
.em-card-rating{display:flex;align-items:center;gap:5px;font-size:12px;color:var(--lx-muted);text-decoration:none}
.em-card-rating:hover{color:var(--lx-ink)}
.em-card-rating b{font-weight:600;color:var(--lx-ink)}
.em-card-rating .lx-stars{font-size:12px;letter-spacing:1px}
.em-card-price{font-size:14.5px;display:flex;gap:8px;align-items:baseline;flex-wrap:wrap;margin-top:auto}
.pr-from{font-size:12px;color:var(--lx-muted)}
.pr-was{color:var(--lx-muted);font-size:13px}
/* Two shapes wear this class: a <form> wrapping a <button>, and a bare <a> that IS the button.
   The form takes the inset as padding; the link has to take it as margin, or the inset lands
   inside its own border and the button stretches to the card's edges. */
.em-card-add{margin-top:auto}
form.em-card-add{padding:0 14px 14px}
a.em-card-add{margin:auto 14px 14px;width:auto}
.em-card-add button,.em-card-opts{display:block;width:100%;text-align:center;padding:12px;border:1px solid var(--lx-line);background:transparent;font:500 11px/1 var(--lx-sans);letter-spacing:.16em;text-transform:uppercase;cursor:pointer;color:var(--lx-ink)!important;transition:all .25s}
.em-card-add button:hover,.em-card-opts:hover{background:var(--lx-moss);border-color:var(--lx-moss);color:#EDEFE7!important}
.em-card-add button.is-done{background:var(--lx-brass);border-color:var(--lx-brass);color:#fff}
.em-grid-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,2vw,28px)}
.em-sec-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:32px;flex-wrap:wrap}
.em-rail-sec{padding:clamp(56px,7vw,100px) 0}
.em-rail{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 3 * 24px) / 4);gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:6px}
.em-rail::-webkit-scrollbar{display:none}
.em-rail>*{scroll-snap-align:start}
.em-rail-nav{display:flex;align-items:center;gap:10px}
.em-rail-btn{width:46px;height:46px;border-radius:50%;border:1px solid var(--lx-line);background:transparent;display:grid;place-items:center;cursor:pointer;transition:all .25s}
.em-rail-btn:hover{background:var(--lx-ink);border-color:var(--lx-ink);color:#fff}
.em-rail-btn.is-prev .ic{transform:rotate(180deg)}
.em-rail-nav .em-link{margin-left:14px}

/* shop the look */
.em-look{padding:clamp(40px,6vw,90px) 0}
.em-look .em-h2 a{border-bottom:1px solid currentColor;color:var(--lx-brass-dark)!important}
.em-look-grid{display:grid;grid-template-columns:1.55fr 1fr;gap:clamp(20px,3vw,40px);align-items:stretch}
.em-look-img{position:relative;margin:0;overflow:hidden;background:var(--lx-stone);min-height:420px}
.em-look-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.em-look-img figcaption{position:absolute;left:20px;bottom:20px;background:rgba(251,248,243,.92);padding:8px 14px;font-size:11px;letter-spacing:.2em;text-transform:uppercase}
.em-look-list{display:flex;flex-direction:column;gap:14px;background:#FFFDF9;border:1px solid var(--lx-line);padding:clamp(20px,2.5vw,32px)}
.em-look-item{display:grid;grid-template-columns:auto 96px 1fr;gap:16px;align-items:center;padding-bottom:14px;border-bottom:1px solid var(--lx-line);cursor:pointer}
.em-look-item input{accent-color:var(--lx-brass);width:18px;height:18px}
.em-look-thumb{width:96px;height:96px;overflow:hidden;background:var(--lx-stone)}
.em-look-thumb img{width:100%;height:100%;object-fit:cover}
.em-look-info{display:grid;gap:4px}
.em-look-info small{font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--lx-muted)}
.em-look-info a{font-size:15px;line-height:1.35;color:var(--lx-ink)!important}
.em-look-total{display:flex;justify-content:space-between;align-items:baseline;margin-top:auto;padding-top:6px}
.em-look-total span{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--lx-muted)}
.em-look-total b{font-family:var(--lx-serif);font-size:32px;font-weight:400}
.em-look-note{font-size:12px;color:var(--lx-muted);margin:0}

/* delivery banner */
.em-deliv{padding:clamp(40px,6vw,90px) 0}
.em-deliv-box{display:grid;grid-template-columns:1.1fr 1fr;background:var(--lx-espresso);color:#E9DFD2;overflow:hidden}
.em-deliv-copy{padding:clamp(32px,5vw,72px)}
.em-deliv .em-h2{color:#FBF8F3!important;margin:4px 0 16px!important}
.em-deliv .lx-kicker{color:#D9B983}
.em-deliv-copy>p{color:#C9BCAB;max-width:46ch}
.em-deliv-zones{list-style:none;margin:22px 0 28px;padding:0;border-top:1px solid rgba(217,185,131,.2)}
.em-deliv-zones li{display:grid;grid-template-columns:1.2fr 1fr auto;gap:14px;padding:14px 0;border-bottom:1px solid rgba(217,185,131,.2);font-size:13.5px}
.em-deliv-zones b{font-weight:500;color:#FBF8F3}
.em-deliv-zones em{font-style:normal;color:#D9B983}
.em-deliv-img{position:relative;min-height:340px}
.em-deliv-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* eco band */
.em-eco{position:relative;min-height:clamp(380px,48vw,560px);display:flex;align-items:flex-end;overflow:hidden;margin:clamp(20px,3vw,40px) 0}
.em-eco-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.em-eco::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(0deg,rgba(27,23,20,.78) 0%,rgba(27,23,20,.25) 55%,rgba(27,23,20,.05) 100%)}
.em-eco-inner{position:relative;z-index:2;padding-bottom:clamp(36px,5vw,70px);width:100%}
.em-eco-text{font-family:var(--lx-serif);font-size:clamp(26px,3vw,42px);line-height:1.2;color:#FBF8F3;max-width:26ch;margin:18px 0 26px!important}
.em-eco-text em{color:#E5C48F}

/* craft: 5 value boxes + story */
.em-craft{padding:clamp(56px,7vw,110px) 0}
.em-values{list-style:none;margin:0 0 clamp(48px,6vw,90px);padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.em-values li{background:#FFFDF9;border:1px solid var(--lx-line);padding:28px 22px 26px;display:flex;flex-direction:column;align-items:flex-start;gap:14px;transition:transform .4s,box-shadow .4s,border-color .4s}
.em-values li:hover{transform:translateY(-4px);border-color:rgba(168,131,79,.5);box-shadow:0 26px 40px -30px rgba(27,23,20,.35)}
.em-values .ic{width:34px;height:34px;color:var(--lx-brass);stroke-width:1.2}
.em-values .em-chip{font-size:12px;padding:5px 12px}
.em-values p{margin:0;font-size:14.5px;line-height:1.55;color:#4A423C}
.em-craft-story{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,80px);align-items:center}
.em-craft-copy .em-h2{margin:6px 0 18px!important;font-size:clamp(30px,3.2vw,46px)!important}
.em-craft-copy p{color:#5A5048;max-width:52ch;margin-bottom:26px}
.em-craft-img{aspect-ratio:1;overflow:hidden;background:var(--lx-stone)}
.em-craft-img img{width:100%;height:100%;object-fit:cover}

/* insta + newsletter */
.em-insta{padding-top:clamp(40px,5vw,70px)}
.em-insta-strip{display:grid;grid-template-columns:repeat(6,1fr)}
.em-insta-strip a{aspect-ratio:1;overflow:hidden;display:block}
.em-insta-strip img{width:100%;height:100%;object-fit:cover;transition:transform .8s}
.em-insta-strip a:hover img{transform:scale(1.05)}
.em-insta-sign{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;padding-top:50px;padding-bottom:70px}
.em-news-form.is-large .em-news-row{border-color:var(--lx-ink)}
.em-news-form.is-large input{font-size:16px}
.em-news-form.is-large button{background:var(--lx-ink);color:#fff}
.em-news-form.is-large button:hover{background:var(--lx-brass)}

/* ---------- listing (shop / category / search) ---------- */
.em-list-head{padding:clamp(34px,5vw,70px) 0 clamp(20px,3vw,34px);background:linear-gradient(180deg,var(--lx-stone),var(--lx-ivory))}
.em-crumbs{display:flex;flex-wrap:wrap;gap:8px;font-size:12.5px;color:var(--lx-muted);margin-bottom:10px}
.em-crumbs a:hover{color:var(--lx-ink)}
.em-crumbs.is-light{color:#BFB09C}
.em-list-bar{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;padding:18px 0 28px;border-bottom:1px solid var(--lx-line);margin-bottom:34px}
.em-cat-pills{display:flex;flex-wrap:wrap;gap:8px}
.em-cat-pills a{padding:8px 16px;border:1px solid var(--lx-line);border-radius:999px;font-size:13px;transition:all .2s}
.em-cat-pills a:hover{border-color:var(--lx-ink)}
.em-cat-pills a.is-on{background:var(--lx-ink);border-color:var(--lx-ink);color:#fff}
.em-sort{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--lx-muted)}
.em-sort select{border:1px solid var(--lx-line);background:#fff;padding:9px 12px}
.em-grid-cards.is-shop{margin-bottom:60px}
.em-empty{text-align:center;padding:70px 20px;background:var(--lx-stone);margin-bottom:60px}
.em-cat-desc{border-top:1px solid var(--lx-line);padding:40px 0 70px;max-width:820px}

/* rich text (CMS + descriptions) */
.em-rich{font-size:15.5px;line-height:1.8;color:#3E3731}
.em-rich h2{font-family:var(--lx-serif);font-size:30px;font-weight:500;margin:1.6em 0 .5em}
.em-rich h3{font-family:var(--lx-serif);font-size:23px;margin:1.4em 0 .4em}
.em-rich a{color:var(--lx-brass-dark);text-decoration:underline;text-underline-offset:3px}
.em-rich ul,.em-rich ol{padding-left:1.2em}
.em-rich li{margin-bottom:.4em}
.em-cms .em-rich{padding-bottom:80px}
.em-table{width:100%;border-collapse:collapse;margin:1em 0 1.4em;font-size:14px;background:#FFFDF9}
.em-table th,.em-table td{padding:11px 14px;border:1px solid var(--lx-line);text-align:left;vertical-align:top}
.em-table th{background:var(--lx-stone);font-weight:500;font-size:12px;letter-spacing:.08em;text-transform:uppercase}

/* ---------- forms ---------- */
.em-form{display:grid;gap:16px}
.em-form label{display:grid;gap:6px;font-size:13px;color:#5A5048}
.em-form input:not([type=checkbox]):not([type=radio]),.em-form select,.em-form textarea{width:100%;border:1px solid #D6CCBF;background:#fff;padding:13px 14px;font-size:15px;color:var(--lx-ink);border-radius:0;outline:none;transition:border-color .2s,box-shadow .2s}
.em-form input:focus,.em-form select:focus,.em-form textarea:focus{border-color:var(--lx-ink);box-shadow:0 0 0 3px rgba(168,131,79,.15)}
.em-grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.em-grid3{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:14px}
.em-err{color:var(--lx-oxblood);font-size:12.5px}
.em-card-box{background:#FFFDF9;border:1px solid var(--lx-line);padding:clamp(22px,3vw,40px)}
.em-formpage{padding:clamp(40px,5vw,80px) 0}
.em-split{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(30px,5vw,80px);align-items:start}
.em-contact-list{list-style:none;padding:0;margin:26px 0;display:grid;gap:20px}
.em-contact-list li{display:flex;gap:16px;font-size:14.5px;line-height:1.6}
.em-contact-list .ic{width:24px;height:24px;color:var(--lx-brass);margin-top:3px}
.em-contact-list b{display:block;font-weight:500}
.em-contact-list a{color:var(--lx-brass-dark)}
.em-ticks{list-style:none;padding:0;margin:22px 0;display:grid;gap:12px}
.em-ticks li{display:flex;gap:12px;align-items:center}
.em-ticks .ic{color:var(--lx-brass)}

/* ---------- basket + checkout ---------- */
.em-basket,.em-checkout,.em-success{padding:clamp(34px,5vw,70px) 0 90px}
.em-basket-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:clamp(24px,4vw,60px);align-items:start;margin-top:26px}
.em-line{display:grid;grid-template-columns:96px 1fr auto auto auto;gap:18px;align-items:center;padding:18px 0;border-bottom:1px solid var(--lx-line)}
.em-line-img{width:96px;height:96px;overflow:hidden;background:var(--lx-stone)}
.em-line-img img{width:100%;height:100%;object-fit:cover}
.em-line-info{display:grid;gap:3px}
.em-line-info small{color:var(--lx-muted);font-size:13px}
.em-line-qty input{width:64px;border:1px solid var(--lx-line);padding:9px;text-align:center;background:#fff}
.em-line-total{font-weight:500;min-width:80px;text-align:right}
.em-line-rm{background:none;border:0;cursor:pointer;color:var(--lx-muted);padding:6px}
.em-summary{position:sticky;top:130px;background:#FFFDF9;border:1px solid var(--lx-line);padding:clamp(22px,3vw,34px);display:grid;gap:14px}
.em-sum-row{display:flex;justify-content:space-between;gap:12px;font-size:14.5px;padding:4px 0}
.em-sum-row.is-muted{color:var(--lx-muted)}
.em-sum-row.is-total{border-top:1px solid var(--lx-line);padding-top:14px;font-size:17px}
.em-sum-row.is-total b{font-family:var(--lx-serif);font-size:28px;font-weight:500}
.em-sum-row small{display:block;font-size:11.5px;color:var(--lx-muted)}
.em-freebar{font-size:13.5px;background:var(--lx-stone);padding:14px 16px}
.em-freebar i{display:block;height:4px;background:#fff;margin-top:10px}
.em-freebar em{display:block;height:100%;background:var(--lx-brass);transition:width .6s}
.em-sum-gift{display:flex;gap:10px;align-items:center;font-size:13px;color:var(--lx-brass-dark);margin:0}
.em-sum-gift .ic{color:var(--lx-brass)}
.em-sum-trust{list-style:none;margin:6px 0 0;padding:14px 0 0;border-top:1px solid var(--lx-line);display:grid;gap:10px;font-size:13px;color:#5A5048}
.em-sum-trust li{display:flex;gap:10px;align-items:center}
.em-sum-trust .ic{color:var(--lx-brass)}
.em-mini{display:grid;grid-template-columns:56px 1fr auto;gap:14px;align-items:center;font-size:14px}
.em-mini small{display:block;color:var(--lx-muted);font-size:12.5px}
.em-mini-img{position:relative;width:56px;height:56px;background:var(--lx-stone)}
.em-mini-img img{width:100%;height:100%;object-fit:cover}
.em-mini-img i{position:absolute;top:-7px;right:-7px;min-width:20px;height:20px;border-radius:999px;background:var(--lx-muted);color:#fff;font-size:11px;font-style:normal;display:grid;place-items:center}
.em-steps{display:flex;gap:28px;font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--lx-muted)}
.em-steps .is-on{color:var(--lx-ink);border-bottom:1px solid var(--lx-ink);padding-bottom:3px}
.em-duty{display:flex;gap:14px;background:var(--lx-stone);padding:14px 16px;font-size:13px;line-height:1.55}
.em-duty .ic{color:var(--lx-brass);width:24px;height:24px}
.em-duty p{margin:0}
.em-status{padding:3px 10px;background:var(--lx-stone);font-size:12px;text-transform:uppercase;letter-spacing:.1em}
.em-status.is-paid,.em-status.is-shipped,.em-status.is-completed{background:#E7EBDD;color:#4E5A33}
.em-giftcta{display:grid;grid-template-columns:auto 1fr auto;gap:18px;align-items:center;margin:26px 0;padding:22px 24px;background:var(--lx-espresso);color:#F4ECE0!important}
.em-giftcta .ic{width:28px;height:28px;color:#D9B983}
.em-giftcta b{display:block;font-family:var(--lx-serif);font-size:24px;font-weight:400;color:#FBF8F3}
.em-giftcta span{font-size:13.5px;color:#C9BCAB}
.em-404{padding:clamp(60px,9vw,140px) 0;text-align:center}
.em-404 .lx-kicker{justify-content:center}
.em-404 .em-lede{margin:0 auto 24px}
.em-404-search{max-width:460px;margin:0 auto 26px;border-color:var(--lx-ink)}
.em-404-search button{background:var(--lx-ink);color:#fff}

/* ---------- product page additions ---------- */
.pdp-vat{font-size:12px;color:var(--lx-muted)}
.pdp-form{display:grid;gap:14px}
.pdp-buynow{height:50px;border:1px solid var(--lx-ink);background:transparent;font:500 12px/1 var(--lx-sans);letter-spacing:.16em;text-transform:uppercase;cursor:pointer;transition:all .25s}
.pdp-buynow:hover{background:var(--lx-ink);color:var(--lx-ivory)}
.pdp-giftnote{display:flex;gap:12px;align-items:center;padding:13px 16px;border:1px dashed rgba(168,131,79,.6);font-size:13.5px;line-height:1.5;color:var(--lx-ink)!important}
.pdp-giftnote .ic{color:var(--lx-brass);width:24px;height:24px}
.pdp-soldout{padding:14px;background:var(--lx-stone)}
.pdp-flag.is-soft{background:var(--lx-ink)}
.pdp-review-form{background:#FFFDF9;border:1px solid var(--lx-line);padding:24px;margin-bottom:10px}
.pdp-rev-title{font-family:var(--lx-serif)!important;font-size:20px!important;margin:0 0 6px!important}
.pdp-finish:disabled{opacity:.45;cursor:not-allowed}
.em-page .pdp-stage img{width:100%;height:100%}

/* toast */
.em-toast{position:fixed;left:50%;top:22px;transform:translate(-50%,-20px);opacity:0;background:var(--lx-ink);color:var(--lx-ivory);padding:14px 22px;font-size:14px;z-index:100002;transition:all .3s ease;max-width:92vw;text-align:center;display:flex;gap:14px;align-items:center}
.em-toast.on{opacity:1;transform:translate(-50%,0)}
.em-toast a{color:#D9B983!important;text-decoration:underline}

/* ---------- responsive ---------- */
@media (max-width:1100px){
  .em-footer-top{grid-template-columns:1fr 1fr 1fr}
  .em-footer-brand,.em-footer-news{grid-column:span 3}
  .em-values{grid-template-columns:repeat(3,1fr)}
  .em-grid-cards{grid-template-columns:repeat(3,1fr)}
  .em-rail{grid-auto-columns:calc((100% - 2 * 20px) / 3);gap:20px}
}
@media (max-width:900px){
  .em-announce-links a:not(.em-cur a){display:none}
  .em-header-main{grid-template-columns:auto 1fr auto;min-height:64px;gap:10px}
  .em-burger,.em-search-toggle{display:inline-flex}
  .em-logo{justify-self:center}
  .em-logo img{width:150px}
  .em-search{display:none;grid-column:1/-1;grid-row:2;max-width:none;margin-bottom:12px}
  .em-header.is-searching .em-search{display:flex}
  .em-gift-link span{display:none}
  .em-nav{display:none}
  .em-assure .em-wrap{grid-template-columns:1fr 1fr}
  .em-assure .em-wrap>div:nth-child(2){border-right:0}
  .em-assure .em-wrap>div:nth-child(-n+2){border-bottom:1px solid var(--lx-line)}
  .em-look-grid,.em-deliv-box,.em-craft-story,.em-insta-sign,.em-split,.em-basket-grid{grid-template-columns:1fr}
  .em-look-img{min-height:320px}
  .em-summary{position:static}
  .em-values{grid-template-columns:repeat(2,1fr)}
  .em-values li:last-child{grid-column:span 2}
  .em-insta-strip{grid-template-columns:repeat(3,1fr)}
  .em-cookie{flex-direction:column;align-items:stretch}
}
@media (max-width:767px){
  .em-announce .em-wrap{justify-content:center;flex-wrap:wrap;padding-top:6px;padding-bottom:6px;min-height:0;gap:6px 16px;text-align:center}
  .em-footer-top{grid-template-columns:1fr 1fr}
  .em-footer-brand,.em-footer-news{grid-column:span 2}
  .em-grid-cards{grid-template-columns:1fr 1fr;gap:14px}
  .em-rail{grid-auto-columns:70%;gap:14px}
  .em-rail-btn{display:none}
  .em-grid2,.em-grid3{grid-template-columns:1fr}
  .em-line{grid-template-columns:72px 1fr auto;grid-template-areas:"img info rm" "img qty total"}
  .em-line-img{grid-area:img;width:72px;height:72px}.em-line-info{grid-area:info}.em-line-qty{grid-area:qty}.em-line-total{grid-area:total}.em-line-rm{grid-area:rm}
  .em-deliv-zones li{grid-template-columns:1fr auto}
  .em-deliv-zones span{grid-column:1;grid-row:2;font-size:12px;color:#A89A87}
  .em-deliv-zones em{grid-row:span 2;align-self:center}
  .em-look-item{grid-template-columns:auto 72px 1fr}
  .em-look-thumb{width:72px;height:72px}
  .em-values{gap:10px}
  .em-values li{padding:20px 16px}
  .em-values p{font-size:13.5px}
  .em-cookie{left:10px;right:10px;bottom:10px;padding:18px}
  .em-cookie-btns .em-btn{flex:1}
  .em-pay{width:100%}
  .em-top,#to-top.em-top{bottom:84px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* legacy theme overrides (homepage loads the old theme stylesheet too) */
.em-eco-bg,.em-deliv-img img,.em-look-img img,.em-card-img img,.em-craft-img img,.em-insta-strip img,.em-look-thumb img,.em-offer-bg img,.em-cattile-img img{height:100%!important;max-width:none!important;width:100%!important}
/* The review card's "Purchased" thumbnail is a 44px stamp, not a fill-the-box photo. It was
   swept into the rule above and blew up to the full width of the card, shoving the product
   name out of sight. It needs the !important only to beat the legacy theme, not the size. */
.lx-rv-item img{width:44px!important;height:44px!important;max-width:44px!important;object-fit:cover}
.em-nav ul li,.em-footer li,.em-values li,.em-deliv-zones li,.em-drawer li{list-style:none!important;background:none!important}
.em-nav li::before,.em-nav li::after,.em-values li::before,.em-deliv-zones li::before,.em-footer li::before{content:none!important;display:none!important}
.em-nav li{margin:0!important;padding:0!important}
.em-rail-btn{color:var(--lx-ink)!important;padding:0!important;border-radius:50%!important}
.em-rail-btn .ic{width:18px;height:18px}
.em-card-add button{border-radius:0!important;min-height:0!important;height:auto!important}
.em-news-row button{border-radius:0!important}
/* The legacy theme pads every button to 25px and gives it a fill. That turned the back-to-top
   circle into an ellipse twice; the promo strip's close button is the same shape of target, so
   it gets the same reset up front rather than after someone notices. */
.em-promo-x{width:24px!important;height:24px!important;min-height:0!important;padding:0!important;border-radius:50%!important;background:transparent!important;color:#EDEFE7!important;line-height:1!important}
.em-promo-x:hover{background:rgba(255,255,255,.16)!important;color:#fff!important}
.em-promo-x .ic{display:block;width:13px;height:13px}
/* The card is an <article>; the theme gives those a margin and a bottom rule. The price keeps
   its auto top margin — that is what pins it to the bottom of the body — so it is left alone. */
.em-card{margin:0!important;padding:0!important;border-bottom-width:1px!important}
/* Only the form shape — the <a> shape carries its inset as a margin, so zeroing it here would
   flatten the button back against the card's edges. */
.em-card-body,form.em-card-add{margin:0!important}
.em-legacy .em-header .ic,.em-legacy .em-footer .ic{display:inline-block}
.em-values li{margin:0!important}
.em-values li:first-child{margin-top:0!important}
@media (max-width:767px){.lx-etsy-float{display:none!important}.em-values .em-chip{font-size:11px;padding:4px 10px}}
.pdp-add{color:var(--lx-ivory)!important}
.pdp-buynow{color:var(--lx-ink)}
.pdp-buynow:hover{color:var(--lx-ivory)!important}
.em-page .pdp-qty button{color:var(--lx-ink)}
[hidden]{display:none!important}
button.lx-btn{background:transparent;cursor:pointer;font-family:var(--lx-sans)}
button.lx-btn:hover{background:#D9B983}
.em-form label.em-check{display:flex;gap:10px;align-items:flex-start}
.em-giftcta b{display:inline;font:inherit;color:#FBF8F3}
.em-giftcta>div>b{display:block;font-family:var(--lx-serif);font-size:24px;font-weight:400}
.em-success .em-card-box,.em-summary{display:grid;gap:12px}
.em-success .em-card-box{margin-bottom:10px}

/* ---------------------------------------------- customer accounts */
.em-auth,.em-account{padding:clamp(30px,4.5vw,60px) 0 90px}
.em-auth .em-card-box,.em-auth .em-form{display:grid;gap:14px}
.em-auth-alt{margin-top:22px;font-size:14px;color:var(--lx-muted)}
.em-flash.is-warn{border-color:#C8922F;background:#FBF3E4}
.em-flash.is-warn p{margin:0 0 6px}

/* header */
.em-acc-head{display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;align-items:flex-end;margin-bottom:22px}
.em-acc-head h1{margin:6px 0 4px}

/* sidebar + panel */
.em-acc-shell{display:grid;grid-template-columns:232px minmax(0,1fr);gap:clamp(20px,3vw,40px);align-items:start}
.em-acc-side{display:grid;gap:2px;position:sticky;top:90px}
.em-acc-side a{display:flex;align-items:center;gap:12px;padding:12px 14px;font:500 12px/1 var(--lx-sans);letter-spacing:.12em;text-transform:uppercase;color:var(--lx-muted);text-decoration:none;border-left:2px solid transparent;transition:background .2s,color .2s,border-color .2s}
.em-acc-side a .ic{width:18px;height:18px;flex:none;color:var(--lx-muted);transition:color .2s}
.em-acc-side a:hover{background:var(--lx-stone);color:var(--lx-ink)}
.em-acc-side a.is-on{background:#FFFDF9;border-left-color:var(--lx-brass);color:var(--lx-ink)}
.em-acc-side a.is-on .ic{color:var(--lx-brass)}
.em-acc-side-cta{margin-top:14px;border-top:1px solid var(--lx-line);padding-top:20px!important}
.em-acc-panel{display:grid;gap:20px;min-width:0}

/* stat tiles */
.em-tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.em-tile{background:#FFFDF9;border:1px solid var(--lx-line);padding:18px 18px 16px;display:grid;gap:4px;align-content:start}
.em-tile span{display:flex;align-items:center;gap:8px;font:500 10.5px/1 var(--lx-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--lx-muted)}
.em-tile span .ic{width:15px;height:15px;color:var(--lx-brass)}
.em-tile b{font-family:var(--lx-serif);font-size:clamp(26px,3vw,34px);font-weight:400;line-height:1.1;color:var(--lx-ink)}
.em-tile small{font-size:12px;color:var(--lx-muted)}

/* latest-order card + stepper */
.em-live{display:grid;gap:18px}
.em-live-top{display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;align-items:flex-start}
.em-live-top h2{margin:6px 0 2px}
.em-steps-track{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.em-steps-track li{position:relative;padding:28px 10px 0 0;display:grid;gap:3px;align-content:start}
.em-steps-track li::before{content:"";position:absolute;top:9px;left:0;right:0;height:2px;background:var(--lx-line)}
.em-steps-track li:last-child::before{right:auto;width:20px}
.em-steps-track li.is-done::before,.em-steps-track li.is-current::before{background:var(--lx-brass)}
.em-steps-track li.is-current~li::before{background:var(--lx-line)}
.em-step-dot{position:absolute;top:0;left:0;width:20px;height:20px;border-radius:50%;background:var(--lx-ivory);border:2px solid var(--lx-line);display:grid;place-items:center}
.em-steps-track li.is-done .em-step-dot{background:var(--lx-brass);border-color:var(--lx-brass)}
.em-steps-track li.is-done .em-step-dot .ic{width:12px;height:12px;color:#fff;stroke-width:3}
.em-steps-track li.is-current .em-step-dot{border-color:var(--lx-brass);box-shadow:inset 0 0 0 3px var(--lx-brass)}
.em-steps-track li.is-stopped .em-step-dot{border-color:var(--lx-oxblood);box-shadow:inset 0 0 0 3px var(--lx-oxblood)}
.em-steps-track li b{font:500 13px/1.3 var(--lx-sans);color:var(--lx-muted)}
.em-steps-track li.is-done b,.em-steps-track li.is-current b,.em-steps-track li.is-stopped b{color:var(--lx-ink)}
.em-steps-track li small{font-size:11.5px;line-height:1.4;color:var(--lx-muted)}

/* panels, lists, empty states */
.em-card-head{display:flex;flex-wrap:wrap;gap:10px 16px;justify-content:space-between;align-items:center}
.em-card-head h2,.em-card-head h3{margin:0}
.em-acc-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px;align-items:start}
.em-acc-grid.is-cards{grid-template-columns:repeat(auto-fill,minmax(290px,1fr))}
.em-acc-grid .em-card-box{display:grid;gap:12px;align-content:start}
.em-card-box.is-default{border-color:var(--lx-brass)}
.em-acc-form{max-width:640px}
.em-acc-row{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;margin:0}
.em-empty{justify-items:center;text-align:center;padding:clamp(30px,5vw,52px) 24px}
.em-empty .ic{width:34px;height:34px;color:var(--lx-brass)}
.em-empty p{margin:0}

.em-chips{display:flex;flex-wrap:wrap;gap:8px}
.em-chips a{display:inline-flex;align-items:center;gap:7px;padding:8px 15px;border:1px solid var(--lx-line);font:500 11.5px/1 var(--lx-sans);letter-spacing:.1em;text-transform:uppercase;color:var(--lx-muted);text-decoration:none}
.em-chips a:hover{border-color:var(--lx-ink);color:var(--lx-ink)}
.em-chips a.is-on{background:var(--lx-ink);border-color:var(--lx-ink);color:var(--lx-ivory)}
.em-chips a i{font-style:normal;font-size:11px;opacity:.65}

.em-ord-list{display:grid}
.em-ord{display:grid;grid-template-columns:auto 1fr auto auto 18px;gap:16px;align-items:center;padding:14px 0;border-bottom:1px solid var(--lx-line);text-decoration:none;color:inherit;font-size:14.5px}
.em-ord:first-child{padding-top:0}
.em-ord:last-child{border-bottom:0;padding-bottom:0}
.em-ord:hover .em-ord-no{color:var(--lx-brass)}
.em-ord>.ic{width:18px;height:18px;color:var(--lx-line);transition:color .2s,transform .2s}
.em-ord:hover>.ic{color:var(--lx-brass);transform:translateX(3px)}
.em-ord-no{font-weight:500}
.em-ord-no small{display:block;font-weight:400;font-size:12.5px;color:var(--lx-muted)}
.em-ord-thumbs{display:flex;align-items:center}
.em-ord-thumbs img{width:48px;height:48px;object-fit:cover;background:var(--lx-stone);border:2px solid #FFFDF9;margin-left:-14px}
.em-ord-thumbs img:first-child{margin-left:0}
.em-ord-thumbs i{display:grid;place-items:center;width:34px;height:48px;font-style:normal;font-size:12px;color:var(--lx-muted)}
.em-ord-thumbs.is-row img{width:56px;height:56px;margin-left:0;border:0;margin-right:8px}

.em-addr{font-style:normal;font-size:14.5px;line-height:1.65;color:#5A5048}
.em-tag{display:inline-block;padding:3px 9px;background:var(--lx-stone);font:500 10.5px/1 var(--lx-sans);letter-spacing:.12em;text-transform:uppercase;color:var(--lx-muted)}
.em-link{background:none;border:0;padding:0;font:inherit;font-size:13.5px;color:var(--lx-brass);text-decoration:underline;cursor:pointer}
.em-link.is-danger{color:var(--lx-oxblood)}
.em-btn .ic{width:16px;height:16px;margin-right:7px}

/* header link */
.em-acc-link{display:inline-flex;align-items:center;gap:8px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--lx-ink)!important;text-decoration:none}
.em-acc-link .ic{color:var(--lx-brass)}
.em-acc-offer{display:grid;gap:10px;margin:18px 0}

@media (max-width:1000px){
 .em-acc-shell{grid-template-columns:1fr;gap:18px}
 .em-acc-side{position:static;grid-auto-flow:column;grid-auto-columns:max-content;overflow-x:auto;border-bottom:1px solid var(--lx-line);padding-bottom:0;-webkit-overflow-scrolling:touch}
 .em-acc-side a{border-left:0;border-bottom:2px solid transparent;padding:10px 14px 12px;white-space:nowrap}
 .em-acc-side a.is-on{background:none;border-bottom-color:var(--lx-brass)}
 .em-acc-side-cta{display:none!important}
 .em-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:900px){.em-acc-link span{display:none}}
@media (max-width:680px){
 .em-steps-track{grid-template-columns:1fr;gap:0}
 .em-steps-track li{padding:0 0 20px 32px}
 .em-steps-track li::before{top:20px;bottom:-4px;left:9px;right:auto;width:2px;height:auto}
 .em-steps-track li:last-child::before{display:none}
 .em-ord{grid-template-columns:auto 1fr auto;row-gap:8px}
 .em-ord>.ic{display:none}
 .em-ord .em-status{grid-column:2;justify-self:start}
 .em-ord b{grid-column:3;grid-row:1}
}
/* Cormorant defaults to old-style figures, which turn "10" into something like "IO".
   Force lining figures wherever a number has to be read at a glance. */
.em-tile b,.em-ord-no,.em-ord b,.em-sum-row b,.em-live-top h2{font-variant-numeric:lining-nums;font-feature-settings:"lnum" 1}
.em-ref-note{display:flex;gap:10px;align-items:flex-start;margin-top:14px;padding:12px 14px;background:#F3F6EC;border-left:3px solid #6F7F4E;font-size:13.5px}
.em-ref-note .ic{width:16px;height:16px;flex:none;margin-top:2px;color:#6F7F4E}
.em-ref-note p{margin:0}
.em-wallet-use{padding:12px 14px;background:var(--lx-stone);margin-top:14px}
.em-sum-row.is-off b{color:#6F7F4E}

/* ------------------------------------------- wallet, partner programme */
.em-balance{display:grid;gap:6px;justify-items:start}
.em-balance b{font-family:var(--lx-serif);font-size:clamp(40px,6vw,58px);font-weight:400;line-height:1;color:var(--lx-ink);font-variant-numeric:lining-nums;font-feature-settings:"lnum" 1}
.em-balance p{margin:4px 0 0;max-width:60ch}
.em-ledger{display:grid}
.em-ledger-row{display:grid;grid-template-columns:1fr auto auto;gap:14px;align-items:center;padding:12px 0;border-bottom:1px solid var(--lx-line);font-size:14px}
.em-ledger-row:last-child{border-bottom:0;padding-bottom:0}
.em-ledger-row small{display:block;font-size:12.5px;color:var(--lx-muted)}
.em-ledger-row b.is-in{color:#4E5A33}
.em-ledger-row b.is-out{color:var(--lx-muted)}
.em-ticks{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.em-ticks li{position:relative;padding-left:24px;font-size:14px;line-height:1.55;color:#5A5048}
.em-ticks li::before{content:"";position:absolute;left:2px;top:7px;width:9px;height:5px;border-left:2px solid var(--lx-brass);border-bottom:2px solid var(--lx-brass);transform:rotate(-45deg)}
.em-partner-intro{display:grid;gap:14px}
.em-partner-intro .em-lede{margin:0}
.em-share{display:grid;gap:12px}
.em-copy{display:flex;gap:10px;flex-wrap:wrap}
.em-copy input{flex:1 1 280px;min-width:0;padding:13px 14px;border:1px solid var(--lx-line);background:var(--lx-stone);font:400 14px/1 var(--lx-sans);color:var(--lx-ink)}
.em-copy .em-btn{flex:none;min-height:46px}
.em-code{display:inline-block;padding:3px 9px;background:var(--lx-ink);color:var(--lx-ivory);letter-spacing:.1em}
.em-status.is-pending,.em-status.is-requested{background:#FBF3E4;color:#8A6520}
.em-status.is-approved{background:#E7EBDD;color:#4E5A33}
.em-status.is-reversed,.em-status.is-declined,.em-status.is-rejected{background:#F7EAE8;color:var(--lx-oxblood)}

.em-partners-hero{background:var(--lx-stone);padding:clamp(48px,7vw,96px) 0;text-align:center;border-bottom:1px solid var(--lx-line)}
.em-partners-hero .em-lede{margin:0 auto 26px;max-width:54ch}
.em-partners-hero .em-btn{margin:0 6px 8px}
.em-partners{padding:clamp(36px,5vw,72px) 0 90px;display:grid;gap:clamp(28px,4vw,52px)}
.em-partners .em-acc-grid .em-card-box{gap:10px}
.em-partners .em-acc-grid .em-h2{margin:0;font-size:clamp(30px,3.6vw,42px)}
.em-how-steps{list-style:none;counter-reset:s;margin:18px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:22px}
.em-how-steps li{counter-increment:s;display:grid;gap:5px;padding-top:44px;position:relative}
.em-how-steps li::before{content:counter(s);position:absolute;top:0;left:0;width:32px;height:32px;border:1px solid var(--lx-brass);border-radius:50%;display:grid;place-items:center;font:500 13px/1 var(--lx-sans);color:var(--lx-brass)}
.em-how-steps b{font:500 15px/1.3 var(--lx-sans)}
.em-how-steps span{font-size:14px;line-height:1.6;color:#5A5048}
.em-partners-cta{display:grid;gap:12px;justify-items:start}
/* partner page corrections */
.em-card-box>.em-tag,.em-partners .em-tag{justify-self:start}
.em-partners .em-h2,.em-ledger-row b{font-variant-numeric:lining-nums;font-feature-settings:"lnum" 1}
.em-how{margin-top:clamp(6px,1vw,14px)}
.em-ledger+.em-small{margin-top:14px}
.em-how{margin-top:clamp(14px,2vw,28px)}
.em-how h2{margin:0}
.em-how-steps{margin-bottom:clamp(14px,2vw,26px)}
/* discount code box */
.em-coupon{border-top:1px solid var(--lx-line);padding-top:14px;margin-top:4px;display:grid;gap:8px}
.em-coupon-form{display:flex;gap:8px}
.em-coupon-form input{flex:1 1 auto;min-width:0;padding:12px 13px;border:1px solid var(--lx-line);background:#fff;font:400 14px/1 var(--lx-sans);text-transform:uppercase;letter-spacing:.06em}
.em-coupon-form .em-btn{flex:none;min-height:44px;padding:0 18px}
.em-coupon-on{display:flex;gap:12px;align-items:center;justify-content:space-between;background:#F3F6EC;padding:11px 13px;font-size:13.5px}
.em-coupon-on span{display:inline-flex;align-items:center;gap:8px}
.em-coupon-on .ic{width:15px;height:15px;color:#6F7F4E}
/* basket offer notes */
.em-offer{display:flex;gap:10px;align-items:flex-start;margin:0 0 10px;padding:12px 15px;background:var(--lx-stone);border-left:3px solid var(--lx-brass);font-size:14px}
.em-offer.is-on{background:#F3F6EC;border-left-color:#6F7F4E}
.em-offer .ic{width:16px;height:16px;flex:none;margin-top:2px;color:var(--lx-brass)}
.em-offer.is-on .ic{color:#6F7F4E}
.em-offer p{margin:0}
/* collapsible account sidebar */
.em-acc-toggle{display:flex;align-items:center;gap:12px;width:100%;padding:10px 14px;margin-bottom:6px;background:none;border:0;border-bottom:1px solid var(--lx-line);font:500 11px/1 var(--lx-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--lx-muted);cursor:pointer;transition:color .2s}
.em-acc-toggle:hover{color:var(--lx-ink)}
.em-acc-toggle .ic{width:18px;height:18px;flex:none;transition:transform .25s}
.em-acc-shell.is-tight{grid-template-columns:62px minmax(0,1fr)}
.em-acc-shell.is-tight .em-acc-side a,.em-acc-shell.is-tight .em-acc-toggle{justify-content:center;padding-left:0;padding-right:0;gap:0}
.em-acc-shell.is-tight .em-acc-side span{display:none}
.em-acc-shell.is-tight .em-acc-toggle .ic{transform:rotate(180deg)}
@media (max-width:1000px){
 .em-acc-toggle{display:none}
 .em-acc-shell.is-tight{grid-template-columns:1fr}
 .em-acc-shell.is-tight .em-acc-side span{display:inline}
 .em-acc-shell.is-tight .em-acc-side a{justify-content:flex-start;padding:10px 14px 12px;gap:12px}
}

/* ------------------------------------------------- slide-in basket (from the left) */
.em-cart-drawer{position:fixed;inset:0;z-index:2100;visibility:hidden}
.em-cart-drawer.is-open{visibility:visible}
.em-cart-bg{position:absolute;inset:0;background:rgba(27,23,20,.45);opacity:0;transition:opacity .3s}
.em-cart-drawer.is-open .em-cart-bg{opacity:1}
.em-cart-panel{position:absolute;right:0;top:0;bottom:0;width:min(92vw,420px);background:var(--lx-ivory);display:flex;flex-direction:column;transform:translateX(100%);transition:transform .35s cubic-bezier(.4,0,.2,1);box-shadow:0 0 60px rgba(27,23,20,.18)}
.em-cart-drawer.is-open .em-cart-panel{transform:none}
.em-cart-panel.is-busy{opacity:.55;pointer-events:none}
.em-cart-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:20px 22px 16px;border-bottom:1px solid var(--lx-line)}
.em-cart-head h2{margin:0}
.em-cart-head i{font-style:normal;font-size:15px;color:var(--lx-muted);margin-left:2px}
.em-cart-close{background:none;border:0;padding:6px;cursor:pointer;color:var(--lx-muted)}
.em-cart-close:hover{color:var(--lx-ink)}
.em-cart-ship{padding:14px 22px;border-bottom:1px solid var(--lx-line);display:grid;gap:8px}
.em-cart-ship p{margin:0;font-size:13px;color:#5A5048}
.em-cart-ship p.is-done{display:flex;align-items:center;gap:7px;color:#4E5A33}
.em-cart-ship .ic{width:15px;height:15px}
.em-cart-bar{display:block;height:3px;background:var(--lx-stone)}
.em-cart-bar i{display:block;height:100%;background:var(--lx-brass);transition:width .4s}
.em-cart-lines{flex:1 1 auto;overflow-y:auto;padding:4px 22px}
.em-cart-line{display:grid;grid-template-columns:72px 1fr auto;gap:14px;padding:16px 0;border-bottom:1px solid var(--lx-line)}
.em-cart-line:last-child{border-bottom:0}
.em-cart-img{display:block;width:72px;height:72px;background:var(--lx-stone)}
.em-cart-img img{width:100%;height:100%;object-fit:cover}
.em-cart-info{min-width:0;display:grid;gap:4px;align-content:start}
.em-cart-info b{font:500 14px/1.35 var(--lx-sans)}
.em-cart-info small{font-size:12.5px;color:var(--lx-muted)}
.em-cart-qty{display:flex;align-items:center;gap:0;margin-top:4px}
.em-cart-qty button{width:28px;height:28px;border:1px solid var(--lx-line);background:none;cursor:pointer;font-size:15px;line-height:1;color:var(--lx-ink)}
.em-cart-qty button:hover{border-color:var(--lx-ink)}
.em-cart-qty span{min-width:34px;text-align:center;font-size:14px}
.em-cart-qty .em-cart-rm{width:auto;height:auto;border:0;margin-left:12px;padding:0;font-size:12.5px;color:var(--lx-muted);text-decoration:underline}
.em-cart-qty .em-cart-rm:hover{color:var(--lx-oxblood)}
.em-cart-price{font-size:14.5px;white-space:nowrap}
.em-cart-foot{border-top:1px solid var(--lx-line);padding:18px 22px 22px;display:grid;gap:10px;background:#FFFDF9}
.em-cart-foot .em-sum-row.is-total{border-top:0;padding-top:0}
.em-cart-foot .em-small{margin:0}
.em-cart-empty{flex:1;display:grid;place-content:center;justify-items:center;gap:14px;text-align:center;padding:40px 22px}
.em-cart-empty .ic{width:30px;height:30px;color:var(--lx-brass)}
.em-cart-empty p{margin:0;color:var(--lx-muted)}
@media (prefers-reduced-motion:reduce){.em-cart-panel{transition:none}}
/* saved delivery address at checkout */
.em-saved{border:1px solid var(--lx-line);background:var(--lx-stone);padding:18px 20px;display:grid;gap:8px}
.em-saved-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.em-saved .em-addr{margin:0}
.em-saved .em-acc-row{margin-top:4px;gap:8px 16px}
.em-saved-pick{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:4px 0 2px}
.em-chip-sm{display:inline-block;padding:6px 12px;border:1px solid var(--lx-line);font-size:12.5px;color:var(--lx-ink);text-decoration:none}
.em-chip-sm:hover{border-color:var(--lx-brass);color:var(--lx-brass)}

/* ------------------------------------------- free gift picker + reassurance */
.em-giftpick{border-top:1px solid var(--lx-line);border-bottom:1px solid var(--lx-line);padding:14px 0;margin:0 0 18px;display:grid;gap:12px}
.em-giftpick.is-compact{border-top:0;padding:14px 22px;margin:0;background:#FBF6EC}
.em-giftpick-lead{display:flex;gap:9px;align-items:flex-start;margin:0;font-size:13.5px;line-height:1.5;color:#5A5048}
.em-giftpick-lead .ic{width:16px;height:16px;flex:none;margin-top:1px;color:var(--lx-brass)}
.em-giftpick-lead.is-on{color:#4E5A33}
.em-giftpick-lead.is-on .ic{color:#6F7F4E}
.em-giftpick-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:10px}
.em-giftpick.is-compact .em-giftpick-grid{grid-template-columns:repeat(auto-fill,minmax(92px,1fr))}
.em-giftpick-one{margin:0}
.em-giftpick-one button{width:100%;display:grid;gap:5px;justify-items:center;padding:8px;border:1px solid var(--lx-line);background:#FFFDF9;cursor:pointer;text-align:center;transition:border-color .2s}
.em-giftpick-one button:hover{border-color:var(--lx-brass)}
.em-giftpick-one img{width:100%;aspect-ratio:1;object-fit:cover;background:var(--lx-stone)}
.em-giftpick-one span{font-size:11.5px;line-height:1.35;color:var(--lx-ink)}
.em-giftpick-one i{font-style:normal;font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--lx-oxblood)}
.em-giftpick-has{display:grid;grid-template-columns:56px 1fr auto;gap:12px;align-items:center}
.em-giftpick-img img{width:56px;height:56px;object-fit:cover;background:var(--lx-stone)}
.em-giftpick-has b{display:block;font:500 14px/1.35 var(--lx-sans)}
.em-giftpick-has small{font-size:12px;color:var(--lx-muted)}
.em-giftpick-has form{margin:0}

.em-trust{list-style:none;margin:18px 0 0;padding:0;display:grid;gap:12px}
.em-trust li{display:flex;gap:11px;align-items:flex-start}
.em-trust .ic{width:17px;height:17px;flex:none;margin-top:2px;color:var(--lx-brass)}
.em-trust b{display:block;font:500 13.5px/1.4 var(--lx-sans);color:var(--lx-ink)}
.em-trust small{display:block;margin-top:2px;font-size:12.5px;line-height:1.5;color:var(--lx-muted)}
.em-trust.is-slim{gap:8px;margin-top:14px;padding-top:14px;border-top:1px solid var(--lx-line)}
.em-trust.is-slim b{font-size:12.5px;font-weight:400;color:#5A5048}
.em-trust.is-slim .ic{width:15px;height:15px;margin-top:1px}
.em-cart-foot .em-trust.is-slim{margin-top:10px}
.pdp-low{display:flex;gap:9px;align-items:center;margin:0 0 14px;padding:10px 13px;background:#F7EAE8;font-size:13.5px;color:#7A2E26}
.pdp-low .ic{width:16px;height:16px;flex:none;color:var(--lx-oxblood)}

/* ---------- shop by category tiles ---------- */
.em-num{font-variant-numeric:lining-nums;font-feature-settings:"lnum" 1}
.em-cattiles{padding:clamp(48px,6vw,86px) 0}
.em-cattile-grid{margin:0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:clamp(14px,2vw,26px)}
/* the legacy theme stylesheet still puts bullets on list items, hence the !important */
.em-cattile-grid,.em-cattile-grid li{list-style:none!important;margin:0;padding:0}
.em-cattile-grid li::marker{content:""}
.em-cattile{display:block;text-align:center;color:var(--lx-ink)!important}
/* the ring matters: most product photos are cut out on white, so without it the circle
   disappears into the ivory background and the row reads as floating objects. */
.em-cattile-img{display:block;position:relative;aspect-ratio:1;overflow:hidden;background:var(--lx-stone);border-radius:50%;box-shadow:inset 0 0 0 1px var(--lx-line)}
.em-cattile-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.6,.2,1)}
.em-cattile:hover .em-cattile-img img{transform:scale(1.07)}
.em-cattile-name{display:block;margin-top:16px;font-family:var(--lx-serif);font-size:19px;line-height:1.25}
.em-cattile-n{display:block;margin-top:3px;font:400 11.5px/1 var(--lx-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--lx-muted)}

/* ---------- browse the collections (tabbed category grids) ---------- */
.em-catshow{padding:clamp(52px,6.5vw,96px) 0;background:var(--lx-stone)}
.em-catshow-lede{margin:10px 0 0;font-size:14.5px;color:var(--lx-muted)}
.em-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 30px;padding-bottom:2px}
.em-tab{display:inline-flex;align-items:center;gap:7px;padding:10px 18px;border:1px solid var(--lx-line);background:#FBF8F3;cursor:pointer;
  font:500 11.5px/1 var(--lx-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--lx-ink);transition:background .25s,border-color .25s,color .25s}
.em-tab i{font-style:normal;font-size:11px;letter-spacing:.06em;color:var(--lx-muted);font-variant-numeric:lining-nums;font-feature-settings:"lnum" 1}
.em-tab:hover{border-color:var(--lx-ink)}
.em-tab.is-on{background:var(--lx-ink);border-color:var(--lx-ink);color:var(--lx-ivory)}
.em-tab.is-on i{color:rgba(251,248,243,.62)}

/* Without JS every collection stays on the page, one under the other. */
.em-catblock+.em-catblock{margin-top:clamp(36px,4.5vw,64px);padding-top:clamp(36px,4.5vw,64px);border-top:1px solid var(--lx-line)}
.em-catblock-head{display:grid;grid-template-columns:1fr auto;align-items:end;gap:6px 24px;margin-bottom:22px}
.em-catblock-name{grid-column:1;margin:0;font-family:var(--lx-serif);font-weight:400;font-size:clamp(22px,2vw,28px);line-height:1.1;color:var(--lx-ink)}
.em-catblock-head p{grid-column:1;margin:0;font-size:13.5px;line-height:1.6;color:var(--lx-muted);max-width:58ch}
.em-catblock-head .em-link{grid-column:2;grid-row:1/span 2;align-self:center;white-space:nowrap}
.em-catgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,1.6vw,24px)}
/* ...and with JS the tabs take over: one collection at a time, no dividers. */
.em-catshow.is-tabbed .em-catblock{display:none;margin-top:0;padding-top:0;border-top:0}
.em-catshow.is-tabbed .em-catblock.is-on{display:block}

@media (max-width:1100px){
  .em-cattile-grid{grid-template-columns:repeat(3,1fr);gap:22px}
  .em-catgrid{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:767px){
  .em-cattile-grid{grid-template-columns:repeat(2,1fr);gap:16px}
  .em-cattile-name{margin-top:11px;font-size:16px}
  .em-tabs{gap:6px;margin-bottom:22px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
  .em-tabs::-webkit-scrollbar{display:none}
  .em-tab{flex:none;padding:9px 14px;font-size:11px}
  .em-catblock-head{grid-template-columns:1fr;margin-bottom:16px}
  .em-catblock-head .em-link{grid-column:1;grid-row:auto;margin-top:10px;justify-self:start}
  .em-catgrid{grid-template-columns:1fr 1fr;gap:14px}
}

/* ---------- three reasons to order today ---------- */
.em-offers{padding:clamp(48px,6vw,86px) 0}
.em-offer-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.8vw,24px)}
.em-offer-grid.is-2{grid-template-columns:repeat(2,1fr)}
.em-offer-grid.is-1{grid-template-columns:1fr}
.em-offer{position:relative;display:flex;align-items:flex-end;min-height:330px;overflow:hidden;color:#F4ECE0!important;background:var(--lx-ink)}
.em-offer-bg{position:absolute;inset:0}
.em-offer-bg img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s cubic-bezier(.2,.6,.2,1)}
.em-offer:hover .em-offer-bg img{transform:scale(1.05)}
/* the scrim has to carry small brass type over a sunlit wall, so it is heavier than it looks
   like it needs to be in a dark mock-up */
.em-offer::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(27,23,20,.95) 0%,rgba(27,23,20,.88) 34%,rgba(27,23,20,.55) 64%,rgba(27,23,20,.14) 100%)}
.em-offer-in{position:relative;z-index:1;padding:clamp(22px,2.2vw,32px);display:block}
.em-offer-kick{display:block;font:500 10.5px/1 var(--lx-sans);letter-spacing:.24em;text-transform:uppercase;color:#DCBB8C}
.em-offer-title{display:block;margin-top:12px;font-family:var(--lx-serif);font-size:clamp(23px,2vw,30px);line-height:1.12;color:#FBF8F3;font-variant-numeric:lining-nums;font-feature-settings:"lnum" 1}
.em-offer-note{display:block;margin-top:9px;font-size:13.5px;line-height:1.6;color:rgba(244,236,224,.82);max-width:36ch}
.em-offer-cta{display:inline-flex;align-items:center;gap:8px;margin-top:18px;font:500 11.5px/1 var(--lx-sans);letter-spacing:.18em;text-transform:uppercase;border-bottom:1px solid rgba(244,236,224,.5);padding-bottom:4px}
.em-offer-cta .ic{width:15px;height:15px;transition:transform .3s}
.em-offer:hover .em-offer-cta .ic{transform:translateX(4px)}
@media (max-width:900px){
  .em-offer-grid,.em-offer-grid.is-2{grid-template-columns:1fr}
  .em-offer{min-height:250px}
}

/* ---------- all reviews page ---------- */
.em-revpage{padding:clamp(40px,5.5vw,80px) 0 clamp(56px,7vw,96px)}
.em-revhead{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-bottom:30px}
.em-revhead-note{margin:12px 0 0;font-size:15px;line-height:1.6;color:var(--lx-muted);max-width:54ch}
.em-revscore{display:flex;align-items:center;gap:18px;padding:20px 26px;background:var(--lx-ink);color:#F4ECE0}
.em-revscore b{font-family:var(--lx-serif);font-weight:400;font-size:clamp(40px,4.5vw,56px);line-height:1;color:#FBF8F3}
.em-revscore .lx-stars{color:var(--lx-brass);font-size:15px;letter-spacing:2px}
.em-revscore small{display:block;margin-top:6px;font-size:12.5px;color:rgba(244,236,224,.8)}
.em-revbars{display:grid;gap:7px;max-width:460px;margin:0 0 26px}
.em-revbar{display:grid;grid-template-columns:42px 1fr 42px;align-items:center;gap:12px;padding:5px 8px;color:var(--lx-ink)!important;transition:background .2s}
.em-revbar:hover{background:var(--lx-stone)}
.em-revbar.is-on{background:var(--lx-stone)}
.em-revbar.is-empty{opacity:.45;pointer-events:none}
.em-revbar-n{font-size:12.5px;color:var(--lx-muted)}
.em-revbar-track{display:block;height:7px;background:var(--lx-stone);overflow:hidden}
.em-revbar.is-on .em-revbar-track,.em-revbar:hover .em-revbar-track{background:#E3DACD}
.em-revbar-track i{display:block;height:100%;background:var(--lx-brass)}
.em-revbar-c{font-size:12.5px;color:var(--lx-muted);text-align:right}
.em-revfilter{margin:0 0 22px;font-size:14px;color:var(--lx-muted);display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.em-revgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.8vw,24px)}
.em-revgrid .lx-rv{scroll-snap-align:none}
.em-rv-title{display:block;margin:14px 0 -6px;font-family:var(--lx-serif);font-size:18px;line-height:1.25}
.em-revpager{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:40px;font-size:13px;color:var(--lx-muted)}
.em-revempty{font-size:16px;color:var(--lx-muted);display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.em-revfoot{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;margin-top:clamp(36px,4vw,60px);padding-top:26px;border-top:1px solid var(--lx-line)}
.em-revfoot p{margin:0;font-size:13.5px;color:var(--lx-muted);max-width:62ch;display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.lx-tw-all{margin-left:14px}
@media (max-width:1000px){.em-revgrid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:700px){
  .em-revgrid{grid-template-columns:1fr}
  .em-revbars{max-width:none}
  .em-revscore{padding:16px 20px}
  .lx-tw-all{margin-left:0;width:100%;margin-top:12px}
}
/* The Etsy badge's own rules live in pdp.css, which the reviews page doesn't load. */
.em-revfoot .pdp-etsy{display:flex;align-items:center;gap:14px;border:1px solid var(--lx-line);background:#fff;padding:14px 18px;color:var(--lx-ink)!important;min-width:260px;transition:border-color .2s}
.em-revfoot .pdp-etsy:hover{border-color:var(--lx-ink)}
.em-revfoot .pdp-etsy b{display:block;font-weight:500;font-size:14px}
.em-revfoot .pdp-etsy span{display:block;font-size:12.5px;color:var(--lx-muted)}
.em-revfoot .pdp-etsy i{margin-left:auto;font-style:normal;font-size:18px;color:var(--lx-muted)}
.em-revfoot .lx-etsy-badge{width:38px;height:38px;font-size:19px;flex:none}

/* ---------- other designs, under the gallery ---------- */
/* Takes the slot the bundle used to hold. A scrolling row rather than a grid, because it is a
   choice between pieces and should feel like flicking through them; the one being viewed leads
   the row and is marked, so the strip reads as a selection and not another product list. */
.pdp-gallery .pdp-designs{grid-column:1/-1;margin-top:6px}
.pdp-designs-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin:0 0 13px}
.pdp-designs-head b{font:500 11.5px/1 var(--lx-sans);letter-spacing:.18em;text-transform:uppercase;color:var(--lx-ink)}
.pdp-designs-head a{font-size:12.5px;color:var(--lx-muted);text-decoration:none;white-space:nowrap;transition:color .2s}
.pdp-designs-head a:hover{color:var(--lx-ink)}
.pdp-designs-row{list-style:none;margin:0;padding:2px 2px 12px;display:flex;gap:13px;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:var(--lx-sand) transparent}
.pdp-designs-row::-webkit-scrollbar{height:5px}
.pdp-designs-row::-webkit-scrollbar-thumb{background:var(--lx-sand)}
.pdp-designs-row li{flex:none;width:104px;scroll-snap-align:start}
.pdp-design{display:grid;gap:7px;text-decoration:none;color:var(--lx-ink)}
.pdp-design img{display:block;width:104px;height:104px;object-fit:cover;border:1px solid var(--lx-line);background:#fff;transition:border-color .2s}
.pdp-design:hover img{border-color:var(--lx-ink)}
.pdp-design.is-on img{border:2px solid var(--lx-ink)}
.pdp-design b{font:400 12px/1.35 var(--lx-sans);overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.pdp-design.is-on b{font:500 9.5px/1 var(--lx-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--lx-brass-dark)}
.pdp-design span{font-size:12.5px;color:var(--lx-muted)}

/* ---------- quantity bundles ---------- */
/* A band of its own below the detail: the cards get the whole page width, which is what makes
   the falling price legible, and the cheapest piece carries the flag. */
.pdp-bundle{margin-top:clamp(48px,6vw,84px);padding:clamp(40px,5vw,66px) 0;background:var(--lx-stone)}
.pdp-bundle-head{max-width:58ch;margin:0 0 clamp(22px,3vw,30px)}
.pdp-bundle-head .lx-h2{margin:9px 0 10px}
.pdp-bundle-head .lx-lede{margin:0}
/* Capped, not stretched: with only two tiers an open 1fr grid blows each card out to half the
   page, and a price card that wide stops reading as a card at all. */
.pdp-tiers{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(172px,230px));justify-content:start;gap:12px}
.pdp-tiers li{position:relative;border:1px solid var(--lx-line);background:#fff;padding:20px 18px 18px;display:grid;align-content:start;gap:3px}
.pdp-tiers li.is-best{border-color:var(--lx-ink);background:var(--lx-ivory)}
.pdp-tier-q{font:500 11px/1 var(--lx-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--lx-muted)}
.pdp-tier-p{font:500 30px/1 var(--lx-serif);color:var(--lx-ink)}
.pdp-tier-p small{font:400 12.5px/1 var(--lx-sans);color:var(--lx-muted);margin-left:5px}
.pdp-tier-s{font:500 11px/1 var(--lx-sans);letter-spacing:.1em;text-transform:uppercase;color:var(--lx-brass-dark);margin-top:6px;min-height:11px;white-space:nowrap}
.pdp-tier-best{position:absolute;top:-1px;right:-1px;background:var(--lx-ink);color:var(--lx-ivory);font:500 9.5px/1 var(--lx-sans);letter-spacing:.14em;text-transform:uppercase;padding:5px 8px}
/* .em-page a sets colour and outranks .lx-btn-solid, so the label has to be reclaimed here or
   the button renders as ink on ink — an invisible word in a black box. */
.pdp-bundle .pdp-bundle-cta{margin-top:clamp(22px,3vw,30px);color:var(--lx-ivory)}
.pdp-bundle .pdp-bundle-cta:hover{color:#fff}
@media (max-width:767px){
  .pdp-tiers{grid-template-columns:1fr 1fr}
  .pdp-tiers li{padding:14px 13px 12px}
  /* The flag is narrow enough to clear the label on a wide card, not on a half-width one. */
  .pdp-tiers li.is-best{padding-top:30px}
  .pdp-tier-p{font-size:24px}
  .pdp-designs-head{display:block}
  .pdp-designs-head a{display:inline-block;margin-top:5px}
}
.em-line-total s,.em-cart-price s{display:block;font-size:12.5px;font-weight:400;color:var(--lx-muted)}
.em-line-total small{display:block;margin-top:2px;font:400 11px/1.3 var(--lx-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--lx-brass-dark,#8A6A3C)}

/* the code in the announcement bar */
.em-announce-msg.is-code b{display:inline-block;margin-left:7px;padding:2px 8px;border:1px dashed currentColor;letter-spacing:.14em;font-weight:500;font-variant-numeric:lining-nums;font-feature-settings:"lnum" 1}

/* The Etsy badges are proof, not a way out of the shop — they stopped being links. */
.em-revfoot .pdp-etsy{cursor:default}
.em-revfoot .pdp-etsy:hover{border-color:var(--lx-line)}
.em-revfoot .pdp-etsy i{display:none}
.lx-etsy-float{cursor:default}
.lx-official-pill{cursor:default}

/* ---------- free gift: what it is worth, struck through beside nothing ---------- */
.em-giftpick-price{display:flex;align-items:baseline;justify-content:center;gap:6px;margin-top:3px}
.em-giftpick-price s{font-size:12px;color:var(--lx-muted)}
.em-giftpick-price b{font:500 11px/1 var(--lx-sans);letter-spacing:.12em;color:var(--lx-brass-dark)}
.em-giftpick-saved s{color:var(--lx-muted)}
.em-giftpick-saved b{color:var(--lx-ink)}

/* ---------- Klarna mark ---------- */
.em-klarna{display:inline-block;padding:2px 6px;border-radius:3px;background:#FFB3C7;color:#0B051D;font:500 11px/1.35 var(--lx-sans);letter-spacing:.01em;vertical-align:1px}
.em-klarna-img{height:16px;width:auto;vertical-align:-3px}

/* ---------- wishlist ---------- */
.em-heart{position:absolute;top:10px;right:10px;z-index:3;width:34px;height:34px;padding:0;border:0;border-radius:50%;background:rgba(251,248,243,.92);color:var(--lx-ink);display:grid;place-items:center;cursor:pointer;opacity:0;transition:opacity .2s,background .2s,color .2s}
.em-card{position:relative}
.em-card:hover .em-heart,.em-heart:focus-visible,.em-heart.is-on{opacity:1}
@media (hover:none){.em-heart{opacity:1}}
.em-heart .ic{width:17px;height:17px;transition:fill .2s}
.em-heart:hover{background:var(--lx-ivory)}
.em-heart.is-on{color:var(--lx-oxblood)}
.em-heart.is-on .ic{fill:var(--lx-oxblood)}
.pdp-heart{position:static;width:52px;height:52px;flex:none;border:1px solid var(--lx-line);border-radius:0;background:#fff;opacity:1}
.pdp-heart .ic{width:20px;height:20px}
.pdp-heart:hover{border-color:var(--lx-ink)}
.em-wishlink{position:relative;display:inline-grid;place-items:center;color:inherit}
.em-wishlink .ic{width:22px;height:22px}
.em-wish-count{position:absolute;top:-6px;right:-8px;min-width:17px;height:17px;padding:0 4px;border-radius:9px;background:var(--lx-brass);color:#fff;font:500 10.5px/17px var(--lx-sans);text-align:center}
.em-wish{padding:clamp(34px,5vw,64px) 0 clamp(52px,7vw,96px)}
.em-wishhead{max-width:60ch;margin:0 0 clamp(26px,3.4vw,42px)}
.em-wishhead-note{margin:10px 0 0;color:var(--lx-muted);font-size:14.5px}
.em-wishempty{padding:54px 20px;text-align:center;border:1px solid var(--lx-line);background:#fff}
.em-wishempty .ic{width:30px;height:30px;color:var(--lx-brass);margin:0 auto 14px}
.em-wishempty p{margin:0 0 20px;color:var(--lx-muted)}
.em-wishbusy{margin:18px 0 0;color:var(--lx-muted);font-size:14px}

/* ---------- product page: price, demand, delivery ---------- */
.pdp-just{font:400 15px/1 var(--lx-sans);color:var(--lx-muted);align-self:center;margin-right:-2px}
.pdp-plusgift{display:inline-flex;align-items:center;gap:6px;font:500 13px/1 var(--lx-sans);letter-spacing:.04em;color:var(--lx-brass-dark);align-self:center}
.pdp-plusgift .ic{width:16px;height:16px}
/* The saving sits hard right, so the row reads price first and lands on the number saved. */
.pdp-price .pdp-save{margin-left:auto;align-self:center}
/* Materials and size on two lines, not in a box: a brass leaf and rule, the words beside them,
   and the measurements keyed w x h x d so one short line carries all three. */
.pdp-made{list-style:none;margin:0;padding:15px 0 0;border-top:1px solid var(--lx-line);display:grid;gap:9px}
.pdp-made li{display:flex;align-items:center;gap:11px;font-size:14px;line-height:1.4;color:var(--lx-ink)}
.pdp-made svg{width:18px;height:18px;flex:none;fill:none;stroke:var(--lx-brass);stroke-width:1.4}
.pdp-made b{font-weight:400;font-variant-numeric:lining-nums;font-feature-settings:"lnum" 1}
.pdp-made i{margin-left:8px;font-style:normal;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--lx-muted)}
/* Flowed as text, not a flex row: on a narrow column flex squeezed "In demand." onto two lines. */
.pdp-demand{margin:2px 0 0;font-size:13.5px;line-height:1.6;color:var(--lx-muted);font-variant-numeric:lining-nums;font-feature-settings:"lnum" 1}
.pdp-demand b{color:var(--lx-ink);font-weight:500;white-space:nowrap}
.pdp-demand i{display:inline-block;width:7px;height:7px;margin:0 9px 1px 3px;vertical-align:middle;border-radius:50%;background:var(--lx-oxblood);box-shadow:0 0 0 3px rgba(126,44,39,.14)}
.pdp-delivery-free{display:block;margin-top:3px;color:var(--lx-brass-dark)}
.pdp-delivery em{font-style:normal;font-weight:600}
.pdp-rev-score.is-plain{display:flex;align-items:center;gap:12px}
.pdp-rev-score.is-plain small{color:var(--lx-muted)}

/* ---------- expandable menu ---------- */
/* The dropdown is CSS only: hover for a mouse, :focus-within for a keyboard, and nothing to
   load. .em-nav is already display:none below 1024px, where the drawer takes over instead. */
.em-nav ul li.has-sub{position:relative}
.em-caret{display:inline-block;width:5px;height:5px;margin-left:7px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform .25s}
.em-nav .has-sub:hover .em-caret,.em-nav .has-sub:focus-within .em-caret{transform:translateY(0) rotate(225deg)}
.em-sub{position:absolute;top:100%;left:50%;transform:translate(-50%,6px);min-width:232px;padding:8px;background:var(--lx-ivory);border:1px solid var(--lx-line);box-shadow:0 18px 40px rgba(27,23,20,.1);opacity:0;visibility:hidden;transition:opacity .2s,transform .2s,visibility .2s;z-index:60}
.em-nav .has-sub:hover .em-sub,.em-nav .has-sub:focus-within .em-sub{opacity:1;visibility:visible;transform:translate(-50%,0)}
.em-sub ul{display:block;margin:0;padding:0}
.em-sub a{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:9px 12px;font-size:12px;letter-spacing:.1em;text-transform:none;white-space:nowrap;transition:background .2s}
.em-sub a::after{display:none}
.em-sub a:hover{background:var(--lx-stone)}
.em-sub a span{font-size:11px;color:var(--lx-muted);font-variant-numeric:lining-nums}
.em-sub a.is-all{letter-spacing:.14em;text-transform:uppercase;font-size:10.5px;color:var(--lx-muted)!important;border-bottom:1px solid var(--lx-line);margin-bottom:4px;padding-bottom:11px}

/* Drawer groups. details/summary, so the first tap works before any script has run. */
.em-drawer-menu li.has-sub>details>summary{display:flex;align-items:center;justify-content:space-between;padding:14px 0;border-bottom:1px solid var(--lx-line);font-family:var(--lx-serif);font-size:22px;cursor:pointer;list-style:none}
.em-drawer-menu li.has-sub>details>summary::-webkit-details-marker{display:none}
.em-drawer-menu li.has-sub>details[open]>summary .em-caret{transform:translateY(0) rotate(225deg)}
.em-drawer-menu li.has-sub>details>summary .em-caret{width:7px;height:7px}
.em-drawer-menu li.has-sub ul{margin:0;padding:4px 0 10px}
.em-drawer-menu li.has-sub ul a{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0 10px 16px;border-bottom:0;font-family:var(--lx-sans);font-size:15px;color:var(--lx-muted)}
.em-drawer-menu li.has-sub ul a span{font-size:12px;font-variant-numeric:lining-nums}

/* Second pill row on a collection page: narrows a parent, or moves sideways between siblings. */
.em-cat-pills.is-sub{flex-basis:100%;margin-top:14px;padding-top:14px;border-top:1px dotted var(--lx-sand)}
.em-cat-pills.is-sub a{padding:7px 14px;font-size:12.5px;color:var(--lx-muted)}
.em-cat-pills.is-sub a:hover{color:var(--lx-ink)}
.em-cat-pills.is-sub a.is-on{color:#fff}
.em-cat-pills.is-sub a span{opacity:.6;margin-left:3px;font-variant-numeric:lining-nums}

/* ---------- reviews as pins ---------- */
/* CSS columns rather than a JS masonry: every card is as tall as its own words and pictures,
   the column count falls with the width, and there is no layout script to get out of step
   with the page. display:inline-block keeps a card from being split across a column break. */
.pdp-pins{columns:2;column-gap:16px}
.pdp-pin{display:inline-block;width:100%;break-inside:avoid;margin:0 0 16px;background:#fff;border:1px solid var(--lx-line);overflow:hidden}
.pdp-pin-shots{display:grid;gap:2px;background:var(--lx-line)}
.pdp-pin-shots.is-many{grid-template-columns:1fr 1fr}
.pdp-pin-shot{display:block;padding:0;border:0;background:var(--lx-stone);cursor:zoom-in;line-height:0}
.pdp-pin-shots:not(.is-many) .pdp-pin-shot img{width:100%;height:auto;display:block}
.pdp-pin-shots.is-many .pdp-pin-shot img{width:100%;aspect-ratio:1;object-fit:cover;display:block}
/* Three photos in a two-column grid leave a hole, so the first one takes the full width and
   the other two sit under it. (:first-child:nth-last-child(3) means "first of exactly three".) */
.pdp-pin-shots.is-many .pdp-pin-shot:first-child:nth-last-child(3){grid-column:1/-1}
.pdp-pin-shots.is-many .pdp-pin-shot:first-child:nth-last-child(3) img{aspect-ratio:16/10}
.pdp-pin-body{padding:18px 20px 20px;display:grid;gap:10px;justify-items:start}
.pdp-pin .lx-stars{font-size:14px;letter-spacing:.08em}
.pdp-pin-title{font-family:var(--lx-serif)!important;font-size:19px!important;font-weight:500;margin:0!important;line-height:1.3}
.pdp-pin p{margin:0;font-family:var(--lx-serif);font-size:17.5px;line-height:1.5;color:var(--lx-ink)}
.pdp-pin-foot{display:flex;align-items:center;gap:11px;margin-top:2px}
.pdp-pin-foot .pdp-avatar{width:34px;height:34px;font-size:16px}
.pdp-pin-foot b{display:block;font-weight:500;font-size:14px}
.pdp-pin-foot small{color:var(--lx-muted);font-size:12px}
/* A pin with a photograph is the one worth landing on, so it gets the stronger edge. */
.pdp-pin.has-shot{border-color:var(--lx-sand)}

/* The review section used to run straight into the footer with nothing between them. */
.pdp-reviews,.pdp-pair{padding-bottom:0}
.pdp{padding-bottom:clamp(56px,8vw,104px)}

/* Lightbox for a review photo. Built once, on the first click, and reused after that. */
.em-lightbox{position:fixed;inset:0;z-index:300;display:grid;place-items:center;padding:24px;background:rgba(27,23,20,.86);opacity:0;visibility:hidden;transition:opacity .25s,visibility .25s}
.em-lightbox.on{opacity:1;visibility:visible}
.em-lightbox img{max-width:min(1100px,92vw);max-height:88vh;width:auto;height:auto;box-shadow:0 30px 80px rgba(0,0,0,.45)}
/* The close control sits over whatever the photo happens to be, so it carries its own disc
   rather than trusting a pale corner to stay pale. */
.em-lightbox button{position:absolute;top:18px;right:20px;width:44px;height:44px;border:0;border-radius:50%;background:rgba(27,23,20,.6);color:#FBF8F3;font-size:26px;line-height:1;cursor:pointer;transition:background .2s}
.em-lightbox button:hover{background:rgba(27,23,20,.9)}

/* Photo field on the review form. */
.pdp-rev-photos input[type=file]{font-size:13px}
.pdp-rev-photos small{display:block;margin-top:6px;color:var(--lx-muted);font-size:12.5px;line-height:1.5}
.pdp-rev-picked{display:inline-block;margin-top:8px;padding:4px 10px;background:var(--lx-stone);font-size:12px;letter-spacing:.06em}

@media (max-width:1024px){.pdp-pins{columns:2}}
@media (max-width:620px){.pdp-pins{columns:1}}

/* ---------- CMS page sections ---------- */
/* Blocks written in Dashboard -> Pages. Prose keeps its narrow column; these run full width. */
.em-cms .em-rich{padding-bottom:clamp(30px,4vw,48px)}
/* A section already carries its own bottom margin, so the prose that follows must not add a
   second gap on top of it — stacked, the two read as a missing block. */
.em-cms section + .em-wrap.em-narrow{padding-top:0}
.em-cms .em-wrap.em-narrow + section{margin-top:clamp(20px,3vw,36px)}

/* hero — photograph with the words laid over it */
.pb-hero{position:relative;display:grid;align-items:end;min-height:clamp(340px,46vw,560px);margin:clamp(24px,4vw,44px) 0;overflow:hidden;background:var(--lx-ink)}
.pb-hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
/* A scrim, not just opacity: these photographs are pale, and ivory text on a pale wooden bowl
   is unreadable however low the opacity goes. The gradient darkens only where the words sit. */
.pb-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(20,16,13,.88) 0%,rgba(20,16,13,.68) 38%,rgba(20,16,13,.25) 72%,rgba(20,16,13,.1) 100%)}
.pb-hero-in{position:relative;z-index:1;padding-top:clamp(50px,8vw,96px);padding-bottom:clamp(30px,4vw,52px);color:#FBF8F3;max-width:760px}
.pb-hero .lx-kicker{color:#D9B983}
.pb-hero-title{font-family:var(--lx-serif);font-weight:400;font-size:clamp(32px,5vw,58px);line-height:1.08;margin:10px 0 14px;color:#FBF8F3}
.pb-hero-text p{margin:0 0 10px;font-size:clamp(15px,1.6vw,18px);line-height:1.65;color:#E8DFD3}
.pb-hero .lx-btn{margin-top:14px}

/* split — picture one side, words the other */
.pb-split{margin:clamp(34px,5vw,72px) 0}
.pb-split-in{display:grid;grid-template-columns:1fr 1fr;gap:clamp(26px,5vw,72px);align-items:center}
.pb-split.is-flip .pb-split-img{order:2}
/* A fixed ratio rather than height:100%. Stretching the picture to the grid row left a tall
   band of nothing beside two short paragraphs. */
.pb-split-img img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover}
.pb-split-copy .em-h2{margin:10px 0 14px}
.pb-split-copy p{margin:0 0 12px;font-size:15.5px;line-height:1.8;color:#3E3731}
.pb-split-copy .em-btn{margin-top:6px}

/* band — a full-width photograph carrying one line */
.pb-band{position:relative;display:grid;place-items:center;min-height:clamp(260px,32vw,400px);margin:clamp(34px,5vw,72px) 0;overflow:hidden;background:var(--lx-espresso,#2A231D)}
.pb-band-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.pb-band::after{content:"";position:absolute;inset:0;background:rgba(20,16,13,.62)}
.pb-band-in{z-index:1}
.pb-band-in{position:relative;text-align:center;color:#FBF8F3;padding:clamp(40px,6vw,72px) 0}
.pb-band-text{font-family:var(--lx-serif);font-size:clamp(22px,3.2vw,38px);line-height:1.3;margin:14px auto 18px;max-width:22ch;color:#FBF8F3}
.pb-band-text em{font-style:italic;color:#E8C89A}

/* cards — icon, label, line */
.pb-cards{margin:clamp(30px,4.5vw,64px) 0}
/* 250px rather than 220: at desktop width that settles on four columns, so a four-card page
   fills one clean row and a six-card page breaks 4+2 instead of stranding one card alone. */
.pb-cards ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:clamp(18px,2.6vw,34px)}
/* Six cards fall 4+2 in a four-column grid, which reads as a mistake. Cap the six-card
   case at three columns so it lands 3+3. */
.pb-cards ul:has(>li:nth-child(6)):not(:has(>li:nth-child(7))){max-width:1120px;margin-inline:auto;grid-template-columns:repeat(auto-fit,minmax(290px,1fr))}
.pb-cards li{display:grid;gap:9px;align-content:start}
.pb-cards svg{width:26px;height:26px;fill:none;stroke:var(--lx-brass);stroke-width:1.3}
.pb-cards b{font-family:var(--lx-serif);font-size:19px;font-weight:500;color:var(--lx-ink)}
.pb-cards p{margin:0;font-size:14.5px;line-height:1.65;color:var(--lx-muted)}

/* gallery — a row of photographs */
.pb-gallery{margin:clamp(30px,4.5vw,64px) 0}
.pb-gallery ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px}
.pb-gallery img{display:block;width:100%;aspect-ratio:1;object-fit:cover}

/* cta — the closing line */
.pb-cta{margin:clamp(34px,5vw,72px) 0 clamp(20px,3vw,40px)}
.pb-cta-in{text-align:center;max-width:620px;margin-inline:auto}
.pb-cta-in p{margin:0 0 18px;font-family:var(--lx-serif);font-size:clamp(19px,2.4vw,26px);line-height:1.4;color:var(--lx-ink)}

@media (max-width:860px){
  .pb-split-in{grid-template-columns:1fr}
  /* Flipped or not, on one column the picture leads — a wall of text first reads as an error. */
  .pb-split.is-flip .pb-split-img{order:0}
  .pb-split-img img{aspect-ratio:16/10}
}
/* .em-page a sets colour at (0,1,1) and outranks .lx-btn-solid at (0,1,0), so a solid button
   inside a CMS page renders as ink on ink. Same trap as the bundle CTA and the back-to-top. */
.em-cms .lx-btn-solid,.pb-cta .lx-btn-solid,.pb-hero .lx-btn-solid{color:var(--lx-ivory)}
.em-cms .lx-btn-solid:hover,.pb-cta .lx-btn-solid:hover{color:#fff}

/* ---------------------------------------------------------------------------
 * Options chosen on the card itself, so "Add to basket" can sit on a piece that
 * has a size or a finish without sending the shopper away to pick it.
 * ------------------------------------------------------------------------- */
.em-card{position:relative}
.em-quick{position:absolute;left:0;right:0;bottom:0;z-index:5;background:var(--lx-ivory);border:1px solid var(--lx-ink);padding:14px;display:grid;gap:10px;box-shadow:0 -10px 30px rgba(27,23,20,.14)}
.em-quick-head{font:500 10.5px/1 var(--lx-sans);letter-spacing:.16em;text-transform:uppercase;color:var(--lx-muted)}
.em-quick-list{display:grid;gap:5px;max-height:190px;overflow:auto}
.em-quick-opt{display:flex;align-items:center;gap:8px;width:100%;text-align:left;padding:9px 10px;border:1px solid var(--lx-line);background:#fff;font:400 13px/1.2 var(--lx-sans);color:var(--lx-ink);cursor:pointer;transition:border-color .2s,background .2s}
.em-quick-opt:hover:not(:disabled){border-color:var(--lx-ink);background:var(--lx-stone)}
.em-quick-opt i{width:14px;height:14px;border-radius:50%;border:1px solid rgba(27,23,20,.18);flex:none}
.em-quick-opt span{margin-left:auto;color:var(--lx-muted);font-size:12.5px}
.em-quick-opt.is-out{opacity:.45;cursor:not-allowed;text-decoration:line-through}
.em-quick-more{font-size:11.5px;color:var(--lx-muted);text-align:center}
.em-card-opts.is-out{opacity:.6;pointer-events:auto}

/* ---------------------------------------------------------------------------
 * "Buy the set" — several different pieces at a percentage off.
 * ------------------------------------------------------------------------- */
.pdp-sets{padding:clamp(48px,6vw,86px) 0;background:var(--lx-ivory);border-top:1px solid var(--lx-line)}
.pdp-set{display:grid;grid-template-columns:1fr 300px;gap:clamp(24px,4vw,56px);align-items:center;padding:clamp(20px,3vw,32px);border:1px solid var(--lx-line);background:#fff;margin-top:26px}
.pdp-set + .pdp-set{margin-top:18px}
.pdp-set-items{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:clamp(8px,1.6vw,18px);flex-wrap:wrap}
.pdp-set-plus{color:var(--lx-brass);font:300 26px/1 var(--lx-serif);flex:none}
.pdp-set-item{flex:1 1 120px;min-width:110px;max-width:170px}
.pdp-set-item a{display:grid;gap:6px;text-decoration:none;color:var(--lx-ink)}
.pdp-set-item img{width:100%;aspect-ratio:1;object-fit:cover;background:var(--lx-stone)}
.pdp-set-item b{font:400 12.5px/1.35 var(--lx-sans)}
.pdp-set-item span{font-size:12.5px;color:var(--lx-muted)}
.pdp-set-item.is-this img{outline:2px solid var(--lx-brass);outline-offset:-2px}
.pdp-set-item.is-this b::after{content:" · this piece";color:var(--lx-brass-dark);font-size:11px}
.pdp-set-buy{display:grid;gap:7px;align-content:center}
.pdp-set-name{font:400 19px/1.2 var(--lx-serif)}
.pdp-set-blurb{margin:0;font-size:13px;line-height:1.55;color:var(--lx-muted)}
.pdp-set-price{margin:4px 0 0;font:500 23px/1 var(--lx-sans)}
.pdp-set-price s{color:var(--lx-muted);font-size:16px;font-weight:400;margin-left:7px}
.pdp-set-save{margin:0 0 6px;font-size:13px;color:var(--lx-oxblood)}
.pdp-set-buy .lx-btn-solid{justify-content:center;text-align:center}
@media (max-width:860px){.pdp-set{grid-template-columns:1fr}}

/* ---------------------------------------------------------------------------
 * Reviews page: the pin wall, and the parcels that arrived.
 * ------------------------------------------------------------------------- */
.em-revpins{columns:3;column-gap:18px;margin-bottom:clamp(40px,5vw,72px)}
@media (max-width:1024px){.em-revpins{columns:2}}
@media (max-width:620px){.em-revpins{columns:1}}
.em-pin-item{display:flex;align-items:center;gap:10px;margin-top:4px;padding-top:12px;border-top:1px solid var(--lx-line);width:100%;text-decoration:none;color:var(--lx-ink)}
.em-pin-item img,.em-pin-item .lx-rv-ph{width:40px;height:40px;object-fit:cover;flex:none;background:var(--lx-stone)}
.em-pin-item span{display:grid;font-size:13px;line-height:1.3}
.em-pin-item small{color:var(--lx-muted);font-size:11px;letter-spacing:.06em;text-transform:uppercase}
.em-pin-item:hover span{color:var(--lx-brass-dark)}

.em-parcels{padding:clamp(40px,5vw,72px) 0 clamp(30px,4vw,56px);border-top:1px solid var(--lx-line)}
.em-parcels-head{max-width:62ch;margin-bottom:26px}
.em-parcels-head p{margin:10px 0 0;color:var(--lx-muted);font-size:14.5px;line-height:1.6}
.em-parcel-wall{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px}
.em-parcel-wall li{display:grid;gap:7px}
.em-parcel-wall button{padding:0;border:0;background:var(--lx-stone);cursor:zoom-in;line-height:0;overflow:hidden}
.em-parcel-wall img{width:100%;aspect-ratio:1;object-fit:cover;display:block;transition:transform .4s}
.em-parcel-wall button:hover img{transform:scale(1.04)}
.em-parcel-note{display:grid;gap:2px;font-size:12.5px;line-height:1.4}
.em-parcel-note b{font-weight:500}
.em-parcel-note small{color:var(--lx-muted);font-size:11.5px}
.em-parcel-note a{font-size:11.5px;color:var(--lx-brass-dark)}

/* ---------- shop filters ---------- */
.em-filters{margin:0 0 clamp(18px,3vw,26px)}
.em-filters-toggle{display:none;align-items:center;gap:8px;border:1px solid var(--lx-line);background:#fff;color:var(--lx-ink);font:500 12px/1 var(--lx-sans);letter-spacing:.1em;text-transform:uppercase;padding:11px 18px;cursor:pointer}
.em-filters-n{display:inline-grid;place-items:center;min-width:17px;height:17px;padding:0 4px;border-radius:9px;background:var(--lx-moss);color:#EDEFE7;font-size:10.5px;letter-spacing:0}
.em-filters-body{display:flex;flex-wrap:wrap;align-items:flex-start;gap:10px 26px}
.em-filter{position:relative;min-width:0}
.em-filter>summary{list-style:none;cursor:pointer;font:500 12px/1 var(--lx-sans);letter-spacing:.1em;text-transform:uppercase;color:var(--lx-ink);padding:9px 0;display:flex;align-items:center;gap:7px}
.em-filter>summary::-webkit-details-marker{display:none}
.em-filter>summary::after{content:"";width:6px;height:6px;border-right:1.5px solid var(--lx-muted);border-bottom:1.5px solid var(--lx-muted);transform:rotate(45deg) translateY(-2px);transition:transform .2s}
.em-filter[open]>summary::after{transform:rotate(-135deg) translateY(-2px)}
.em-filter>summary i{font-style:normal;display:inline-grid;place-items:center;min-width:16px;height:16px;padding:0 4px;border-radius:8px;background:var(--lx-moss);color:#EDEFE7;font-size:10px;letter-spacing:0}
/* The panel floats so opening one filter does not shove the product grid down the page. */
.em-filter>ul{position:absolute;z-index:20;top:100%;left:-14px;min-width:216px;max-height:320px;overflow:auto;margin:0;padding:8px 0;list-style:none;background:#fff;border:1px solid var(--lx-line);box-shadow:0 18px 40px -24px rgba(27,23,20,.45)}
.em-filter>ul li{margin:0}
.em-filter>ul a{display:flex;align-items:center;gap:10px;padding:8px 16px;font:400 14px/1.3 var(--lx-sans);color:var(--lx-ink)!important;text-decoration:none}
.em-filter>ul a:hover{background:var(--lx-stone)}
.em-filter-box{flex:0 0 auto;width:15px;height:15px;border:1px solid var(--lx-sand);background:#fff;display:inline-block}
.em-filter>ul a.is-on .em-filter-box{background:var(--lx-moss);border-color:var(--lx-moss);position:relative}
.em-filter>ul a.is-on .em-filter-box::after{content:"";position:absolute;left:4px;top:1px;width:4px;height:8px;border-right:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(45deg)}
.em-filter-name{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.em-filter-n{flex:0 0 auto;color:var(--lx-muted);font-size:12.5px}
.em-filters-clear{align-self:center;font:500 12px/1 var(--lx-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--lx-oxblood)!important;text-decoration:none;padding:9px 0}
.em-filters-clear:hover{text-decoration:underline}
@media (max-width:760px){
  .em-filters-toggle{display:inline-flex}
  .em-filters-body{display:none;flex-direction:column;gap:0;margin-top:12px;border-top:1px solid var(--lx-line)}
  .em-filters.is-open .em-filters-body{display:flex}
  .em-filter{border-bottom:1px solid var(--lx-line)}
  .em-filter>summary{padding:14px 0;justify-content:space-between}
  /* Stacked on a phone, so the panel sits in the flow instead of floating over the grid. */
  .em-filter>ul{position:static;border:0;box-shadow:none;min-width:0;max-height:none;padding:0 0 10px}
  .em-filter>ul a{padding:9px 2px}
}

/* ===== social proof popup (bottom left) =====================================
   Real orders, real reviews, real offline sales — see app/lib/proof.php. Sits
   bottom-left so it never fights the centred buy bar or the scroll-to-top button;
   --em-proof-lift is set by app.js from the live height of the buy bar, because on
   a phone the bar is full-width and the popup has to sit above it. */
.em-proof{
  position:fixed; left:20px; z-index:980;
  bottom:calc(20px + env(safe-area-inset-bottom,0px) + var(--em-proof-lift,0px));
  width:min(344px,calc(100vw - 40px));
  display:flex; gap:12px; align-items:center;
  padding:12px 38px 12px 12px;
  background:var(--lx-ivory); border:1px solid var(--lx-line);
  box-shadow:0 22px 48px -26px rgba(27,23,20,.5),0 2px 6px -3px rgba(27,23,20,.14);
  opacity:0; transform:translateY(14px) scale(.98); pointer-events:none;
  transition:opacity .4s ease,transform .4s cubic-bezier(.2,.7,.3,1),bottom .25s ease;
  text-decoration:none; color:inherit;
}
.em-proof.on{opacity:1; transform:none; pointer-events:auto}
.em-proof:hover{box-shadow:0 26px 54px -24px rgba(27,23,20,.58)}
.em-proof img{width:52px;height:52px;object-fit:cover;flex:none;background:var(--lx-stone)}
.em-proof-b{min-width:0;flex:1}
.em-proof-lead{display:block;font:600 13px/1.35 var(--lx-sans);color:var(--lx-ink)}
.em-proof-txt{display:block;font:400 13px/1.4 var(--lx-sans);color:var(--lx-muted);
  overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.em-proof-txt em{font-style:italic}
.em-proof-foot{display:block;margin-top:3px;font:500 11px/1 var(--lx-sans);
  letter-spacing:.08em;text-transform:uppercase;color:var(--lx-brass)}
.em-proof-stars{color:var(--lx-brass);font-size:12px;letter-spacing:.08em}
/* Verified marker only ever appears on a row that really is a paid order. */
.em-proof-tick{color:var(--lx-moss)}
.em-proof-x{
  position:absolute;top:6px;right:6px;width:26px;height:26px;line-height:26px;
  border:0;background:none;cursor:pointer;color:var(--lx-muted);font-size:17px;padding:0;
}
.em-proof-x:hover{color:var(--lx-ink)}
@media (max-width:600px){
  .em-proof{left:12px;width:calc(100vw - 24px);bottom:calc(12px + env(safe-area-inset-bottom,0px) + var(--em-proof-lift,0px))}
  .em-proof img{width:46px;height:46px}
}
@media (prefers-reduced-motion:reduce){
  .em-proof{transition:opacity .2s linear}
  .em-proof.on{transform:none}
}
@media print{.em-proof{display:none}}


/* =============================================================== Offers page
   /offers/ — see app/controllers/offers.php. Built from the shop's own figures, so the layout
   has to cope with any section being absent: nothing here assumes a neighbour exists. */

.em-offers-page{padding-bottom:clamp(56px,8vw,96px)}
.em-op-sec{margin:clamp(40px,6vw,72px) 0}
.em-op-sec > .em-h2{margin:0 0 clamp(18px,2.5vw,26px)}

.em-op-cards{list-style:none;margin:0;padding:0;display:grid;gap:18px;
  grid-template-columns:repeat(auto-fit,minmax(270px,1fr))}
.em-op-card{display:flex;flex-direction:column;gap:7px;padding:26px 24px;
  background:var(--lx-stone);border:1px solid var(--lx-line)}
.em-op-kick{font:500 11px/1 var(--lx-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--lx-muted)}
.em-op-card strong{font:400 clamp(19px,2vw,23px)/1.25 var(--lx-serif);color:var(--lx-ink)}
.em-op-card p{margin:0;color:var(--lx-muted);font-size:14.5px;line-height:1.55}
.em-op-go{margin-top:auto;padding-top:12px;display:inline-flex;align-items:center;gap:7px;
  font:500 12px/1 var(--lx-sans);letter-spacing:.1em;text-transform:uppercase;
  color:var(--lx-ink);text-decoration:none}
.em-op-go:hover{color:var(--lx-brass)}
.em-op-go .ic{width:15px;height:15px}

/* Codes. The code itself is the thing to be copied, so it is the loudest element in the row. */
.em-op-codes{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.em-op-codes li{display:flex;align-items:center;gap:20px;flex-wrap:wrap;
  padding:18px 22px;border:1px solid var(--lx-line);background:#fff}
.em-op-code{font:600 17px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.08em;
  padding:11px 16px;border:1px dashed var(--lx-brass);color:var(--lx-ink);
  background:var(--lx-stone);user-select:all}
.em-op-codes li > div{flex:1 1 240px}
.em-op-codes strong{display:block;font:400 17px/1.3 var(--lx-serif);color:var(--lx-ink)}
.em-op-codes p{margin:4px 0 0;color:var(--lx-muted);font-size:13.5px}
.em-op-note{margin:14px 0 0;color:var(--lx-muted);font-size:13px}

.em-op-bundles{list-style:none;margin:0;padding:0;display:grid;gap:18px;
  grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}
.em-op-bundle{display:flex;gap:18px;padding:20px;border:1px solid var(--lx-line);background:#fff}
/* A row, not a column: stacked vertically, three pieces made the card twice as tall as its
   own text and left a field of white beside it. */
.em-op-thumbs{display:grid;grid-auto-flow:column;grid-auto-columns:64px;gap:6px;align-self:start}
.em-op-thumbs img{width:64px;height:64px;object-fit:cover;display:block}
.em-op-bundle-in{flex:1;min-width:0}
.em-op-bundle-in strong{display:block;font:400 19px/1.25 var(--lx-serif);color:var(--lx-ink)}
.em-op-bundle-in p{margin:5px 0 0;color:var(--lx-muted);font-size:13.5px;line-height:1.5}
.em-op-prices{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-top:10px!important}
.em-op-prices .is-now{font:500 19px/1 var(--lx-sans);color:var(--lx-ink)}
.em-op-prices s{color:var(--lx-muted)}
.em-op-prices .is-save{color:var(--lx-oxblood);font-weight:500}

.em-op-all{display:inline-flex;align-items:center;gap:7px;font:500 12px/1 var(--lx-sans);
  letter-spacing:.1em;text-transform:uppercase;color:var(--lx-ink);text-decoration:none;white-space:nowrap}
.em-op-all:hover{color:var(--lx-brass)}
.em-op-more{margin-top:clamp(24px,3vw,36px);text-align:center}
.em-op-empty{max-width:60ch;color:var(--lx-muted);font-size:16px;line-height:1.7;margin:0 0 20px}

@media (max-width:560px){
  .em-op-codes li{gap:14px}
  .em-op-bundle{flex-direction:column}
}

/* The pager. These rules live inside views/pages/category.php's own <style> block, so they are
   not loaded on any other page — the journal's pager rendered as four bare blue links until
   this was copied here. Kept identical so the two look the same. */
.em-pager{display:flex;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap;margin:clamp(32px,5vw,56px) 0 clamp(8px,2vw,16px)}
.em-pager a,.em-pager span{font:500 12.5px/1 var(--lx-sans);letter-spacing:.1em;text-transform:uppercase;text-decoration:none}
.em-pg-step{display:inline-flex;align-items:center;min-height:44px;padding:0 20px;border:1px solid var(--lx-line);color:var(--lx-ink);transition:border-color .2s,background .2s}
.em-pg-step:hover{border-color:var(--lx-ink);background:var(--lx-stone)}
.em-pg-step.is-off{opacity:.35;pointer-events:none}
.em-pg-nums{display:flex;align-items:center;gap:6px}
.em-pg-n{display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:40px;border:1px solid transparent;color:var(--lx-muted,#7A6F66)}
.em-pg-n:hover{color:var(--lx-ink);border-color:var(--lx-line)}
.em-pg-n.is-on{color:var(--lx-ivory);background:var(--lx-ink);border-color:var(--lx-ink)}
@media (max-width:560px){.em-pager{gap:10px}.em-pg-step{padding:0 12px;font-size:11.5px}}

/* ================================================================== Journal
   /blog/ and /blog/{slug}/. A reading surface, not a product grid: measure is capped and the
   type is the serif the rest of the brand uses for prose. */

.em-journal{padding-bottom:clamp(56px,8vw,96px)}
/* The header and the grid were touching: .em-list-head has no bottom padding, which is fine
   on a listing where a filter bar comes next and wrong here, where the first thing is a photo. */
.em-journal .em-list-head{padding-bottom:clamp(26px,4vw,44px)}
.em-jr-grid{display:grid;gap:clamp(22px,3vw,34px);grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
/* start, not stretch: a post with no cover image should sit at the top of its row rather than
   being pulled as tall as the one beside it. */
.em-jr-card{min-width:0;align-self:start}
.em-jr-link{display:flex;flex-direction:column;gap:14px;text-decoration:none;color:inherit;height:100%}
/* A fixed ratio, so one badly proportioned upload cannot push the rest of the page off screen
   and a slow-loading image does not make the grid jump when it arrives. */
.em-jr-img{display:block;overflow:hidden;background:var(--lx-stone);aspect-ratio:8/5}
.em-jr-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease}
.em-jr-link:hover .em-jr-img img{transform:scale(1.03)}
.em-jr-in{display:flex;flex-direction:column;gap:8px}
.em-jr-date{font:500 11px/1 var(--lx-sans);letter-spacing:.13em;text-transform:uppercase;color:var(--lx-muted)}
.em-jr-title{font:400 clamp(20px,2.1vw,24px)/1.25 var(--lx-serif);color:var(--lx-ink)}
.em-jr-link:hover .em-jr-title{color:var(--lx-brass)}
.em-jr-ex{color:var(--lx-muted);font-size:15px;line-height:1.6}
.em-jr-go{margin-top:4px;display:inline-flex;align-items:center;gap:7px;
  font:500 12px/1 var(--lx-sans);letter-spacing:.1em;text-transform:uppercase;color:var(--lx-ink)}
.em-jr-go .ic{width:15px;height:15px}

/* The newest post gets the full width of the grid on the first page: a journal whose latest
   entry looks the same size as one from eight months ago reads as a dead archive. */
@media (min-width:900px){
  .em-jr-card.is-lead{grid-column:1 / -1}
  .em-jr-card.is-lead .em-jr-link{flex-direction:row;align-items:center;gap:clamp(26px,3.5vw,48px)}
  .em-jr-card.is-lead .em-jr-img{flex:0 0 58%;aspect-ratio:3/2}
  .em-jr-card.is-lead .em-jr-title{font-size:clamp(26px,3vw,36px)}
  .em-jr-card.is-lead .em-jr-ex{font-size:16.5px}
}
.em-jr-empty{color:var(--lx-muted);font-size:17px;margin:0 0 20px}

.em-post{padding-bottom:clamp(56px,8vw,96px)}
.em-post-draft{display:inline-block;margin:0 0 10px;padding:5px 11px;background:var(--lx-oxblood);
  color:#fff;font:500 11px/1.4 var(--lx-sans);letter-spacing:.1em;text-transform:uppercase}
.em-post-meta{display:flex;gap:10px;align-items:baseline;margin:14px 0 0;
  font:500 12px/1 var(--lx-sans);letter-spacing:.1em;text-transform:uppercase;color:var(--lx-muted)}
.em-post-hero{margin:clamp(24px,3vw,40px) 0}
.em-post-hero img{width:100%;height:100%;object-fit:cover;display:block;aspect-ratio:16/9}

.em-post-body{font:17px/1.75 var(--lx-serif);color:var(--lx-ink);max-width:68ch}
.em-post-body > :first-child{margin-top:0}
.em-post-body p{margin:0 0 1.3em}
.em-post-body h2{font:400 clamp(24px,2.6vw,30px)/1.25 var(--lx-serif);margin:1.8em 0 .5em}
.em-post-body h3{font:400 clamp(20px,2.1vw,23px)/1.3 var(--lx-serif);margin:1.6em 0 .45em}
.em-post-body h4{font:500 17px/1.35 var(--lx-sans);margin:1.5em 0 .4em}
.em-post-body ul,.em-post-body ol{margin:0 0 1.3em;padding-left:1.5em}
.em-post-body li{margin:.4em 0}
.em-post-body blockquote{margin:1.6em 0;padding:4px 0 4px 20px;border-left:2px solid var(--lx-brass);
  color:var(--lx-muted);font-style:italic}
.em-post-body a{color:var(--lx-oxblood);text-underline-offset:3px}
.em-post-body img{max-width:100%;height:auto;display:block;margin:1.6em 0}
.em-post-body hr{border:0;border-top:1px solid var(--lx-line);margin:2.2em 0}
.em-post-body figure{margin:1.8em 0}
.em-post-body figcaption{margin-top:8px;font:13px/1.5 var(--lx-sans);color:var(--lx-muted)}
.em-post-body table{border-collapse:collapse;width:100%;margin:1.6em 0;font:15px/1.5 var(--lx-sans)}
.em-post-body th,.em-post-body td{border:1px solid var(--lx-line);padding:9px 12px;text-align:left}
.em-post-body th{background:var(--lx-stone);font-weight:500}

.em-post-more{margin-top:clamp(56px,7vw,88px);padding-top:clamp(36px,4vw,52px);border-top:1px solid var(--lx-line)}
.em-post-more .em-h2{margin:0 0 clamp(20px,2.5vw,30px)}


/* ------------------------------------------------------- search suggestions
   The dropdown under the header search box. See assets/js/suggest.js.

   It is positioned against the form, which already establishes a stacking context in the
   sticky header, so the panel travels with the box when the header shrinks on scroll. */

form.em-search{position:relative}

.em-sug{position:absolute;top:calc(100% + 8px);left:0;right:0;z-index:120;
  background:#fff;border:1px solid var(--lx-line);box-shadow:0 18px 44px rgba(27,23,20,.14);
  max-height:min(70vh,520px);overflow:auto;overscroll-behavior:contain}

/* The reset has to be on the li, not only the ul: the storefront styles `li` directly, which
   beats list-style on the parent, and every suggestion rendered with a bullet above it. */
.em-sug-list{list-style:none;margin:0;padding:6px}
.em-sug-item{list-style:none;margin:0}
.em-sug-item a{display:flex;align-items:center;gap:13px;padding:9px 10px;text-decoration:none;
  color:var(--lx-ink);border-radius:4px}
.em-sug-item.is-at a,.em-sug-item a:hover{background:var(--lx-stone)}
.em-sug-img{flex:0 0 52px;width:52px;height:52px;background:var(--lx-stone);overflow:hidden;
  display:flex;align-items:center;justify-content:center}
.em-sug-img img{width:100%;height:100%;object-fit:cover;display:block}
/* A collection has no single photo, so it gets a mark rather than a blank square that reads
   as a picture that failed to load. */
.em-sug-img.is-cat{background:var(--lx-ink);position:relative}
.em-sug-img.is-cat::after{content:"";position:absolute;inset:16px;border:1.5px solid var(--lx-ivory,#FBF8F3)}
.em-sug-txt{min-width:0;display:flex;flex-direction:column;gap:3px}
.em-sug-name{font:400 15px/1.3 var(--lx-serif);color:var(--lx-ink);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.em-sug-name mark{background:none;color:var(--lx-brass);font-weight:600}
.em-sug-price{font:500 12.5px/1 var(--lx-sans);color:var(--lx-muted)}
.em-sug-price s{opacity:.7;margin-left:4px}

.em-sug-all{display:block;padding:13px 16px;border-top:1px solid var(--lx-line);
  background:var(--lx-stone);color:var(--lx-ink);text-decoration:none;
  font:500 12px/1.3 var(--lx-sans);letter-spacing:.08em;text-transform:uppercase;text-align:center}
.em-sug-all:hover{background:var(--lx-ink);color:#fff}
.em-sug-none{margin:0;padding:18px 16px;color:var(--lx-muted);font-size:14px;text-align:center}

@media (max-width:760px){
  .em-sug{max-height:60vh}
  .em-sug-img{flex-basis:44px;width:44px;height:44px}
  .em-sug-name{font-size:14px}
}
@media (prefers-reduced-motion:reduce){ .em-sug{box-shadow:0 0 0 1px var(--lx-line)} }


/* ================================================================== shop chat
   The bubble sits above everything, clear of the basket bar on a phone and of the cookie
   banner, which is the one thing that must never be covered. */

.em-chat{position:fixed;right:clamp(14px,2vw,26px);bottom:clamp(14px,2vw,26px);z-index:900;
  font-family:var(--lx-sans)}
.em-chat-bubble{display:inline-flex;align-items:center;gap:9px;border:0;cursor:pointer;
  padding:13px 20px;border-radius:999px;background:var(--lx-ink);color:#fff;
  font:500 13.5px/1 var(--lx-sans);box-shadow:0 10px 30px rgba(27,23,20,.25)}
.em-chat-bubble:hover{background:var(--lx-espresso)}
.em-chat-bubble-i{color:#7FB069;font-size:10px}
.em-chat.is-open .em-chat-bubble{display:none}

.em-chat-panel{display:flex;flex-direction:column;width:min(380px,calc(100vw - 28px));
  height:min(560px,calc(100vh - 120px));background:#fff;border:1px solid var(--lx-line);
  border-radius:12px;overflow:hidden;box-shadow:0 24px 60px rgba(27,23,20,.26)}
.em-chat-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;
  padding:14px 16px;background:var(--lx-ink);color:#fff}
.em-chat-head b{display:block;font:500 14.5px/1.3 var(--lx-sans)}
.em-chat-note{display:block;font-size:12px;opacity:.75;margin-top:2px}
.em-chat-x{border:0;background:none;color:#fff;font-size:22px;line-height:1;cursor:pointer;opacity:.8;padding:0 2px}
.em-chat-x:hover{opacity:1}

.em-chat-log{flex:1;overflow:auto;padding:14px;display:flex;flex-direction:column;gap:10px;
  background:var(--lx-stone);overscroll-behavior:contain}
.em-chat-msg{max-width:88%}
.em-chat-msg.is-you{align-self:flex-end}
.em-chat-b{padding:10px 13px;border-radius:12px;font-size:14px;line-height:1.55;
  background:#fff;color:var(--lx-ink);border:1px solid var(--lx-line)}
.em-chat-msg.is-you .em-chat-b{background:var(--lx-ink);color:#fff;border-color:var(--lx-ink)}
.em-chat-msg.is-agent .em-chat-b{background:#F3F7F1;border-color:#CBDCC4}
.em-chat-b a{color:var(--lx-oxblood);text-underline-offset:2px}
.em-chat-msg.is-you .em-chat-b a{color:#fff}
.em-chat-who{display:block;font-size:11px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--lx-muted);margin-bottom:3px}

/* The three dots while a reply is being worked out. Without it the box looks broken for the
   second the request takes. */
.em-chat-msg.is-wait .em-chat-b{display:flex;gap:4px;padding:14px 13px}
.em-chat-msg.is-wait i{width:6px;height:6px;border-radius:50%;background:var(--lx-muted);
  animation:em-chat-dot 1.2s infinite}
.em-chat-msg.is-wait i:nth-child(2){animation-delay:.15s}
.em-chat-msg.is-wait i:nth-child(3){animation-delay:.3s}
@keyframes em-chat-dot{0%,60%,100%{opacity:.25}30%{opacity:1}}
@media (prefers-reduced-motion:reduce){.em-chat-msg.is-wait i{animation:none;opacity:.5}}

.em-chat-prods{display:grid;gap:6px;margin-top:7px}
.em-chat-prods a{display:flex;align-items:center;gap:10px;padding:7px;background:#fff;
  border:1px solid var(--lx-line);border-radius:9px;text-decoration:none;color:var(--lx-ink)}
.em-chat-prods a:hover{border-color:var(--lx-brass)}
.em-chat-prods img,.em-chat-noimg{width:44px;height:44px;border-radius:6px;object-fit:cover;
  background:var(--lx-stone);flex:none}
.em-chat-prods b{display:block;font:400 13.5px/1.3 var(--lx-serif)}
.em-chat-prods i{font-style:normal;font-size:12.5px;color:var(--lx-muted)}

.em-chat-act{margin-top:8px;display:flex;gap:6px}
.em-chat-act button{padding:9px 14px;border-radius:8px;border:1px solid var(--lx-ink);
  background:var(--lx-ink);color:#fff;cursor:pointer;font:500 12.5px/1 var(--lx-sans)}
.em-chat-act.is-field input{flex:1;min-width:0;padding:9px 11px;border-radius:8px;
  border:1px solid var(--lx-line);font-size:13.5px}

.em-chat-form{display:flex;gap:8px;padding:11px;border-top:1px solid var(--lx-line);background:#fff}
.em-chat-form input{flex:1;min-width:0;padding:11px 13px;border:1px solid var(--lx-line);
  border-radius:9px;font-size:14px;color:var(--lx-ink)}
.em-chat-form input:focus{outline:2px solid var(--lx-brass);outline-offset:-1px}
.em-chat-form button{padding:0 16px;border:0;border-radius:9px;background:var(--lx-ink);
  color:#fff;cursor:pointer;font:500 13px/1 var(--lx-sans)}
.em-chat-foot{margin:0;padding:0 13px 11px;font-size:11px;color:var(--lx-muted);background:#fff;line-height:1.45}

@media (max-width:480px){
  .em-chat{right:10px;bottom:10px;left:10px}
  .em-chat-panel{width:100%;height:min(76vh,560px)}
  .em-chat-bubble{float:right}
}

/* ============================================================ the chat inbox */

.ad-chat{display:grid;grid-template-columns:290px 1fr;gap:18px;align-items:start}
@media (max-width:900px){.ad-chat{grid-template-columns:1fr}}

.ad-chat-list{background:#fff;border:1px solid var(--line);border-radius:10px;overflow:hidden;
  max-height:72vh;overflow-y:auto}
.ad-chat-list a{display:block;padding:12px 14px;border-bottom:1px solid var(--line);
  text-decoration:none;color:var(--ink)}
.ad-chat-list a:hover{background:var(--st)}
.ad-chat-list a.is-on{background:var(--iv);box-shadow:inset 3px 0 0 var(--brass)}
.ad-chat-when{display:flex;align-items:center;gap:7px;font-size:11.5px;color:var(--mut)}
.ad-chat-flag{background:var(--ox);color:#fff;border-radius:999px;padding:2px 7px;font-size:10.5px;font-weight:500}
.ad-chat-dot{background:var(--ink);color:var(--iv);border-radius:999px;padding:2px 7px;font-size:10.5px;margin-left:auto}
.ad-chat-list .ad-chat-who{display:block;font-weight:500;margin:3px 0 2px;font-size:13.5px}
.ad-chat-prev{display:block;color:var(--mut);font-size:12.5px;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}

.ad-chat-thread{background:#fff;border:1px solid var(--line);border-radius:10px}
.ad-chat-meta{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;
  padding:14px 16px;border-bottom:1px solid var(--line);font-size:13.5px}
.ad-chat-log{padding:16px;display:flex;flex-direction:column;gap:12px;max-height:48vh;overflow:auto}
.ad-chat-msg{max-width:78%}
.ad-chat-msg.is-visitor{align-self:flex-start}
.ad-chat-msg.is-agent,.ad-chat-msg.is-bot{align-self:flex-end;text-align:right}
.ad-chat-msg .ad-chat-role{display:block;font-size:11px;color:var(--mut);margin-bottom:3px}
.ad-chat-b{display:inline-block;text-align:left;padding:9px 12px;border-radius:10px;
  font-size:13.5px;line-height:1.5;background:var(--st);border:1px solid var(--line)}
.ad-chat-msg.is-agent .ad-chat-b{background:var(--ink);color:var(--iv);border-color:var(--ink)}
.ad-chat-msg.is-agent .ad-chat-b a{color:#fff}
.ad-chat-msg.is-bot .ad-chat-b{background:var(--iv)}
.ad-chat-reply{display:flex;gap:10px;align-items:flex-end;padding:14px 16px;border-top:1px solid var(--line)}
.ad-chat-reply textarea{flex:1;border:1px solid var(--line);border-radius:8px;padding:9px 11px;font:14px/1.5 inherit}
.ad-chat-learn{margin:16px}
.ad-pad{padding:16px}

.ad-try{background:var(--iv)}
.ad-try-out{margin:-6px 0 16px}
.ad-try-tag{margin:0 0 8px;font:500 12px/1 var(--lx-sans,inherit);letter-spacing:.08em;text-transform:uppercase}
.ad-try-tag span{text-transform:none;letter-spacing:0;color:var(--mut);font-weight:400;margin-left:8px}
.ad-try-tag.is-hit{color:#2F5D3A}
.ad-try-tag.is-miss{color:var(--ox)}
.ad-try-body{padding:11px 13px;background:var(--st);border-radius:8px;font-size:14px;line-height:1.55}
.ad-live-list{margin:0;padding-left:1.1em;color:var(--mut);font-size:13px}
.ad-table tr.is-off{opacity:.5}