/* Moving Music garlic page, Nov 2026. The look of the garlic page prototype (v3.73 to v3.79), applied to the
   markup in the Ghost page itself (the mm-garlic-* classes in its HTML card), so the words, photos, prices,
   and Stripe links stay in Ghost where Bennett edits them. Each rule names the prototype rule it copies. */

.garlic{padding-top:28px}
.garlic h1{font-size:clamp(2.1rem,3.3vw,2.9rem);letter-spacing:-.005em;margin:0 0 .7rem}

/* .garlic .grid */
.mm-garlic-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:40px;align-items:start}

/* .garlic .story */
.mm-garlic-story{max-width:640px}
.mm-garlic-story p{font-family:var(--serif);font-size:1.2rem;line-height:1.5;margin:0 0 .9rem;text-wrap:pretty}

/* .gphoto: the white frame sits on the image, so the motto can stay in the figure's caption */
.mm-garlic-photo-card{display:block;margin:0;padding:0;border:0;background:none}
.mm-garlic-photo-card img{display:block;width:100%;height:auto;background:#fff;border:1px solid var(--rule);padding:10px;box-shadow:0 1px 2px rgba(35,31,27,.08),0 2px 8px rgba(35,31,27,.06)}
/* .story .gphoto */
.mm-garlic-story .mm-garlic-photo-card{margin:1.4rem 0 .2rem}
/* .garlic .story p.motto */
.mm-garlic-photo-card figcaption{margin:1rem 0 .9rem;font-family:var(--serif);font-size:1.2rem;line-height:1.5;font-style:italic;text-wrap:pretty}
.mm-garlic-photo-card figcaption em{font-style:italic}

/* .buycol */
.mm-garlic-right{display:flex;flex-direction:column;gap:16px}

/* .panel.buy */
.mm-garlic-card{padding:20px 22px 22px;background:var(--card);box-shadow:0 1px 2px rgba(35,31,27,.08),0 2px 8px rgba(35,31,27,.06)}
/* .buy .rule-head */
.mm-garlic-card-head{display:flex;align-items:center;gap:.45rem;margin:0 0 4px}
.mm-garlic-card-head .mm-garlic-bulb{display:block;flex:none;width:auto;height:1.9rem}
/* .rule-head span */
.mm-garlic-card-head h2{margin:0;font-family:var(--serif);font-style:italic;font-weight:400;font-size:1.1rem;line-height:1.55;letter-spacing:normal;color:var(--ink-2)}
/* .buy .sub-line */
.mm-garlic-sub-line{margin:0 0 .2rem;font-size:.9rem;color:var(--ink-2)}

/* .lbs */
.mm-garlic-lbs{width:100%;border-collapse:collapse}
.mm-garlic-lbs td{padding:.6rem 0;border-bottom:1px solid var(--rule);vertical-align:middle}
.mm-garlic-lbs tr:last-child td{border-bottom:none}
.mm-garlic-lbs td.n{font-family:var(--serif);font-weight:var(--hw);font-size:1.15rem}
.mm-garlic-lbs td.m{text-align:right;padding-right:14px;font-variant-numeric:tabular-nums;white-space:nowrap}
.mm-garlic-lbs td.b{width:1%;text-align:right}

/* .btn.red.sm */
.mm-garlic-buy{display:inline-block;padding:.42rem .95rem;border:1px solid var(--red);border-radius:2px;background:var(--red);color:var(--paper);text-decoration:none;font-family:var(--sans);font-weight:700;font-size:.9rem;line-height:1.1;cursor:pointer}
.mm-garlic-buy:hover{background:var(--red-dark);border-color:var(--red-dark)}

/* .buycol .ship */
.mm-garlic-ship{margin:0 2px;font-family:var(--serif);font-style:italic;font-size:1rem;line-height:1.35;color:var(--ink-2);text-wrap:pretty}

@media (max-width:900px){.mm-garlic-grid{grid-template-columns:minmax(0,1fr) 300px;gap:28px}}
@media (max-width:700px){.mm-garlic-grid{grid-template-columns:1fr}.mm-garlic-story{max-width:none}.mm-garlic-right{order:-1}}