/* Additions for the live shop: bag drawer, prices, add-to-bag links.
   Styled to match styles.css — edit the mockup's files for the look of the page. */
.price-line{font:400 1.6rem var(--serif);margin:0 0 1.2rem}
.card-price{margin:1rem 0 0!important;font:400 1.3rem var(--serif);color:var(--ink)!important}
.price-line:empty,.card-price:empty{display:none}
.feature-copy .button{border:0;cursor:pointer}
.link-add{display:inline-block;margin-top:1.25rem;padding:0 0 .25rem;border:0;border-bottom:1px solid currentColor;background:none;color:var(--ink);font-size:.74rem;text-transform:uppercase;letter-spacing:.11em;font-weight:750;cursor:pointer}
.link-add:hover{color:#a86d6e}
.editorial-copy .link-add{margin-top:.6rem;font-size:.76rem}
.quick-add[disabled],.link-add[disabled],.button[disabled]{opacity:.45;cursor:not-allowed;transform:none}
.bag-count.bump{animation:bagbump .4s}
@keyframes bagbump{50%{transform:scale(1.3)}}
:focus-visible{outline:2px solid #b57678;outline-offset:3px}

.scrim{position:fixed;inset:0;background:rgba(40,39,33,.35);z-index:60}
.scrim[hidden]{display:none}
.cart{position:fixed;top:0;right:0;height:100%;width:min(420px,100%);background:var(--paper);z-index:70;display:flex;flex-direction:column;transform:translateX(100%);transition:transform .3s ease;box-shadow:-12px 0 40px rgba(68,55,42,.14);outline:none}
.cart.open{transform:none}
.cart-head{display:flex;justify-content:space-between;align-items:center;padding:1.4rem 1.5rem;border-bottom:1px solid var(--line)}
.cart-head h2{font:400 2rem var(--serif);letter-spacing:-.03em;margin:0}
.cart-close{border:0;background:none;font-size:1.8rem;line-height:1;cursor:pointer;color:var(--ink)}
.ship-meter{margin:0;padding:.8rem 1.5rem;background:#f5dada;font-size:.72rem;font-weight:750;letter-spacing:.1em;text-transform:uppercase}
.ship-meter:empty{display:none}
.cart-lines{flex:1;overflow:auto;padding:.5rem 1.5rem}
.cart-empty{text-align:center;color:var(--muted);font:400 1.1rem var(--serif);margin-top:3rem}
.line{display:grid;grid-template-columns:64px 1fr auto;gap:1rem;align-items:center;padding:1rem 0;border-bottom:1px solid var(--line)}
.line img{width:64px;height:76px;object-fit:cover;background:#fff}
.line h4{font:400 1.05rem var(--serif);margin:0 0 .4rem}
.qty{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:999px}
.qty button{border:0;background:none;width:28px;height:28px;cursor:pointer;color:var(--ink)}
.qty span{min-width:20px;text-align:center;font-size:.85rem}
.remove{display:block;border:0;background:none;padding:.4rem 0 0;color:var(--muted);font-size:.68rem;text-transform:uppercase;letter-spacing:.1em;cursor:pointer}
.line-price{font-size:.9rem}
.cart-foot{padding:1.3rem 1.5rem 1.6rem;border-top:1px solid var(--line);display:grid;gap:.7rem}
.subtotal{display:flex;justify-content:space-between;font:400 1.25rem var(--serif)}
.cart-fine{margin:0;color:var(--muted);font-size:.75rem}
.cart-foot .button{width:100%}
.cart-foot .button[aria-disabled="true"]{opacity:.45;pointer-events:none}
.cart.busy .cart-lines{opacity:.5;pointer-events:none}

/* Keep the tilted round notes from causing sideways scroll on phones */
html,body{overflow-x:clip}
.bag-button{white-space:nowrap}
/* Keep the footer logo in proportion */
footer img{height:auto}
/* Draw the tilted hero cards on their own layer so rotated text stays crisp */
.seasonal-card{backface-visibility:hidden;-webkit-backface-visibility:hidden;will-change:transform}