/*
 * Public membership catalogue, tonal look (default).
 * Cream/white surfaces, a coloured title band per plan, payment large, salon credit as a separate inset.
 * Plan colour follows the stable local offer key only (data-plan). No JavaScript.
 */
.epic-public-memberships {
 --ezm-bg:#fff; --ezm-panel:#fffdf9; --ezm-text:#24221f; --ezm-muted:#5c5750; --ezm-bronze:#7a5f43; --ezm-border:#d9d2c6; --ezm-tile-bg:#f3ede3;
 --ezm-cta-bg:#79b928; --ezm-cta-text:#ffffff; --ezm-focus:#326800;
 --ezm-radius:5px; --ezm-section-padding:24px; --ezm-card-padding:24px; --ezm-gap:24px; --ezm-columns:3; --ezm-display-font:"degular",sans-serif; --ezm-body-font:"Inter",sans-serif;
 container:ezm / inline-size; color:var(--ezm-text); background:var(--ezm-bg); padding:var(--ezm-section-padding); font:var(--ezm-body-size,16px)/1.55 var(--ezm-body-font); width:100%; min-width:0;
}
.epic-public-memberships[data-theme="dark"] { --ezm-bg:#191817; --ezm-panel:#252321; --ezm-text:#fff; --ezm-muted:#d0cbc4; --ezm-border:#5a5249; --ezm-tile-bg:#252321; --ezm-focus:#b4e77e; --ezm-inset:rgba(255,255,255,.09); }
.epic-public-memberships[data-theme="cream"] { --ezm-bg:#f3eee6; --ezm-panel:#fffdf9; --ezm-tile-bg:#fffdf9; }
.epic-public-memberships * { box-sizing:border-box; }
.epic-public-memberships :is(h2,h3,h4,p,dl,dd,ul) { margin:0; color:inherit; overflow-wrap:anywhere; }
.epic-public-memberships h2 { font:600 var(--ezm-heading-size,clamp(30px,4vw,48px))/1.1 var(--ezm-display-font); letter-spacing:-.02em; text-align:var(--ezm-heading-align,left); margin-bottom:24px; }
.epic-public-memberships h3 { font:600 var(--ezm-title-size,28px)/1.1 var(--ezm-display-font); }
.epic-public-memberships h4 { font:600 20px/1.3 var(--ezm-display-font); margin-bottom:10px; }
.epic-public-memberships .ezm-aud { margin-bottom:20px; font-size:13px; color:var(--ezm-muted); }

/* Card + plan identity */
.epic-public-memberships .ezm-items { display:grid; gap:var(--ezm-gap); grid-template-columns:repeat(var(--ezm-columns),minmax(0,1fr)); }
.epic-public-memberships .ezm-card { --ezm-band:#6d5539; --ezm-tint:#f0e5d4; min-width:0; background:var(--ezm-panel); border:1px solid var(--ezm-border); border-radius:var(--ezm-radius); overflow:hidden; }
.epic-public-memberships .ezm-card[data-programme="annual"] { --ezm-band:#8d5c29; --ezm-tint:#f3e6d2; }
.epic-public-memberships .ezm-card[data-plan="maintenance"] { --ezm-band:#5e704e; --ezm-tint:#e5eadc; }
.epic-public-memberships .ezm-card[data-plan="premium"] { --ezm-band:#7a5f43; --ezm-tint:#f0e5d4; }
.epic-public-memberships .ezm-card[data-plan="ultimate"] { --ezm-band:#3a322a; --ezm-tint:#ece3d2; }
.epic-public-memberships[data-theme="dark"] .ezm-card[data-plan="ultimate"] { --ezm-band:#4d4338; }
.epic-public-memberships .ezm-band { display:flex; align-items:center; gap:14px; padding:20px var(--ezm-card-padding); background:var(--ezm-band); color:#fff; }
.epic-public-memberships .ezm-tile { display:grid; place-items:center; flex:0 0 auto; width:48px; height:48px; border-radius:var(--ezm-radius); background:rgba(255,255,255,.16); }
.epic-public-memberships .ezm-icon { width:28px; height:28px; flex:0 0 auto; }
.epic-public-memberships .ezm-band h3 { color:#fff; }
.epic-public-memberships .ezm-kicker { margin-top:4px; font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:#fff; opacity:.95; }
.epic-public-memberships .ezm-desc { padding:22px var(--ezm-card-padding) 4px; font-size:15px; line-height:1.55; color:var(--ezm-muted); }
.epic-public-memberships .ezm-desc:empty { padding:0; }
.epic-public-memberships .ezm-label { display:block; margin-bottom:6px; font:700 11px/1.3 var(--ezm-body-font); letter-spacing:.13em; text-transform:uppercase; color:var(--ezm-muted); }

/* Payment is the price; frequency sits beside it */
.epic-public-memberships .ezm-pay { padding:14px var(--ezm-card-padding) 18px; align-self:end; }
.epic-public-memberships .ezm-price-line { display:flex; flex-wrap:wrap; align-items:baseline; gap:2px 10px; }
.epic-public-memberships .ezm-price { display:block; font:600 var(--ezm-price-size,64px)/1 var(--ezm-display-font); letter-spacing:-.03em; font-variant-numeric:tabular-nums; }
.epic-public-memberships .ezm-price-missing { font-size:24px; letter-spacing:0; line-height:1.2; }
.epic-public-memberships .ezm-freq { font-size:18px; color:var(--ezm-text); }

/* Salon credit (or duration / range) is its own inset, never merged with the payment */
.epic-public-memberships .ezm-extra:not(:empty) { margin:0 var(--ezm-card-padding); padding:16px 18px; background:var(--ezm-inset,var(--ezm-tint)); border-radius:var(--ezm-radius); align-self:start; }
.epic-public-memberships .ezm-fact { display:grid; gap:3px; }
.epic-public-memberships .ezm-fact + .ezm-fact { margin-top:14px; }
.epic-public-memberships .ezm-fact strong { font:600 26px/1.15 var(--ezm-display-font); }
.epic-public-memberships .ezm-fact span:last-child:not(.ezm-label) { font-size:14px; color:var(--ezm-muted); }

/* Benefits, conditions, action */
.epic-public-memberships .ezm-foot { display:flex; flex-direction:column; justify-content:flex-end; gap:12px; padding:18px var(--ezm-card-padding) var(--ezm-card-padding); }
.epic-public-memberships .ezm-foot ul { list-style:none; padding:0; display:grid; gap:8px; }
.epic-public-memberships .ezm-foot li { position:relative; padding-left:26px; font-size:15px; line-height:1.45; }
.epic-public-memberships .ezm-foot li::before { content:"\2713" / ""; position:absolute; left:0; top:0; color:#5e704e; font-weight:700; }
.epic-public-memberships[data-theme="dark"] .ezm-foot li::before { color:#b4e77e; }
.epic-public-memberships .ezm-foot h4 { margin:0; }
.epic-public-memberships .ezm-terms { border-top:1px solid var(--ezm-border); }
.epic-public-memberships .ezm-terms > summary { display:flex; justify-content:space-between; align-items:center; gap:12px; min-height:44px; padding:8px 0; cursor:pointer; list-style:none; font-size:14px; color:var(--ezm-muted); }
.epic-public-memberships .ezm-terms > summary::-webkit-details-marker { display:none; }
.epic-public-memberships .ezm-terms > summary::after { content:"+"; font-size:18px; line-height:1; }
.epic-public-memberships .ezm-terms[open] > summary::after { content:"\2212"; }
.epic-public-memberships .ezm-terms h4 { margin:14px 0 6px; font-size:15px; }
.epic-public-memberships .ezm-terms ul { gap:4px; margin-bottom:8px; }
.epic-public-memberships .ezm-terms li { padding-left:0; font-size:13px; color:var(--ezm-muted); }
.epic-public-memberships .ezm-terms li::before { content:none; }
.epic-public-memberships .ezm-terms p { margin:6px 0 12px; font-size:13px; color:var(--ezm-muted); }
.epic-public-memberships :is(.ezm-action,.ezm-theme-action) { display:flex; align-items:center; justify-content:center; gap:4px; width:100%; min-height:48px; padding:12px 20px; margin-top:4px; background:var(--ezm-cta-bg); color:var(--ezm-cta-text); font-size:16px; font-weight:600; line-height:normal; text-decoration:none; border-radius:var(--ezm-button-radius,4px); max-width:100%; overflow-wrap:anywhere; text-align:center; }
.epic-public-memberships :is(.ezm-action,.ezm-theme-action):hover { filter:brightness(.94); }
/* Theme mode (default) keeps the component's arrow and hover lift, and sets colour so it never depends on an unbuilt utility class. */
.epic-public-memberships .ezm-theme-action { width:100%; max-width:100%; min-height:48px; margin-top:4px; padding-inline:20px; text-align:center; background:var(--ezm-cta-bg); color:var(--ezm-cta-text); font-weight:600; }
.epic-public-memberships :is(a,summary):focus-visible { outline:3px solid var(--ezm-focus); outline-offset:3px; }
.epic-public-memberships :is(.ezm-terms > summary,details.ezm-card > summary):focus-visible { outline-offset:-3px; }

/* Grid (default): three cards whose rows line up (band, copy, payment, credit, action) */
.epic-public-memberships[data-design="grid"] .ezm-items { row-gap:0; margin-bottom:calc(-1 * var(--ezm-gap)); }
.epic-public-memberships[data-design="grid"] .ezm-card { display:grid; grid-template-columns:minmax(0,1fr); grid-template-rows:subgrid; grid-row:span 5; margin-bottom:var(--ezm-gap); }
.epic-public-memberships[data-design="grid"] :is(.ezm-side,.ezm-main) { display:contents; }
.epic-public-memberships[data-design="grid"] .ezm-band { grid-row:1; }
.epic-public-memberships[data-design="grid"] .ezm-desc { grid-row:2; }
.epic-public-memberships[data-design="grid"] .ezm-pay { grid-row:3; }
.epic-public-memberships[data-design="grid"] .ezm-extra { grid-row:4; }
.epic-public-memberships[data-design="grid"] .ezm-foot { grid-row:5; }

/* Feature and ledger: one wide panel per plan, coloured side (feature) or plain side (ledger) */
.epic-public-memberships:is([data-design="feature"],[data-design="ledger"],[data-design="index"]) .ezm-items { grid-template-columns:minmax(0,1fr); }
.epic-public-memberships:is([data-design="feature"],[data-design="ledger"]) .ezm-card { display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.4fr); }
.epic-public-memberships:is([data-design="feature"],[data-design="ledger"]) .ezm-side { display:flex; flex-direction:column; gap:18px; padding-bottom:var(--ezm-card-padding); }
.epic-public-memberships:is([data-design="feature"],[data-design="ledger"]) .ezm-side > * { align-self:stretch; }
.epic-public-memberships:is([data-design="feature"],[data-design="ledger"]) .ezm-pay { padding:0 var(--ezm-card-padding); }
.epic-public-memberships:is([data-design="feature"],[data-design="ledger"]) .ezm-main { display:flex; flex-direction:column; gap:10px; padding:calc(var(--ezm-card-padding) + 4px) 0 0; }
.epic-public-memberships:is([data-design="feature"],[data-design="ledger"]) .ezm-foot { flex:1; }
.epic-public-memberships[data-design="feature"] .ezm-side { background:var(--ezm-band); color:#fff; }
.epic-public-memberships[data-design="feature"] .ezm-side .ezm-band { background:transparent; padding-bottom:0; }
.epic-public-memberships[data-design="feature"] .ezm-side :is(.ezm-label,.ezm-freq,.ezm-fact span) { color:#fff; }
.epic-public-memberships[data-design="feature"] .ezm-side .ezm-extra:not(:empty) { background:rgba(255,255,255,.16); }
.epic-public-memberships[data-design="feature"] .ezm-foot > ul { grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:28px; }
.epic-public-memberships[data-design="ledger"] .ezm-card { border-width:0 0 1px; border-radius:0; background:transparent; }
.epic-public-memberships[data-design="ledger"] .ezm-band { background:transparent; color:var(--ezm-text); padding-bottom:0; }
.epic-public-memberships[data-design="ledger"] .ezm-band h3, .epic-public-memberships[data-design="ledger"] .ezm-kicker { color:var(--ezm-text); }
.epic-public-memberships[data-design="ledger"] .ezm-tile { background:var(--ezm-tint); color:var(--ezm-band); }
.epic-public-memberships[data-design="ledger"][data-theme="dark"] .ezm-tile { background:var(--ezm-inset); color:#fff; }

/* Index: native expandable rows, initially open */
.epic-public-memberships[data-design="index"] .ezm-card > summary { display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:64px; padding:16px var(--ezm-card-padding); cursor:pointer; list-style:none; }
.epic-public-memberships[data-design="index"] .ezm-card > summary::-webkit-details-marker { display:none; }
.epic-public-memberships[data-design="index"] .ezm-card > summary h3 { flex:1 1 auto; }
.epic-public-memberships[data-design="index"] .ezm-sum-price { font:600 20px/1.2 var(--ezm-display-font); text-align:right; }
.epic-public-memberships[data-design="index"] .ezm-card > summary::after { content:"+"; display:grid; place-items:center; flex:0 0 auto; width:36px; height:36px; border:1px solid var(--ezm-text); border-radius:50%; font-size:18px; line-height:1; }
.epic-public-memberships[data-design="index"] .ezm-card[open] > summary::after { content:"\2212"; }
.epic-public-memberships[data-design="index"] .ezm-card[open] > summary { border-bottom:1px solid var(--ezm-border); }
.epic-public-memberships[data-design="index"] .ezm-card > :is(.ezm-desc,.ezm-pay) { padding-left:var(--ezm-card-padding); padding-right:var(--ezm-card-padding); }
.epic-public-memberships[data-design="index"] .ezm-card .ezm-extra:not(:empty) { margin-bottom:6px; }
.epic-public-memberships[data-design="index"] .ezm-card .ezm-price { font-size:var(--ezm-price-size,48px); }

/* Overview: one compact card per programme */
.epic-public-memberships[data-design="overview"] .ezm-items { grid-template-columns:repeat(min(var(--ezm-columns),2),minmax(0,1fr)); }
.epic-public-memberships[data-design="overview"] .ezm-card { display:flex; flex-direction:column; }
.epic-public-memberships .ezm-ov-body { display:flex; flex-direction:column; flex:1; gap:16px; padding:20px var(--ezm-card-padding) var(--ezm-card-padding); }
.epic-public-memberships .ezm-ov-blurb { font-size:15px; line-height:1.5; color:var(--ezm-muted); }
.epic-public-memberships .ezm-ov-list { list-style:none; padding:0; }
.epic-public-memberships .ezm-ov-list li { display:flex; justify-content:space-between; align-items:baseline; gap:12px; padding:10px 0; border-top:1px solid var(--ezm-border); font-size:15px; }
.epic-public-memberships .ezm-ov-list b { font:600 22px/1.1 var(--ezm-display-font); text-align:right; font-variant-numeric:tabular-nums; }
.epic-public-memberships .ezm-ov-list small { font:400 13px var(--ezm-body-font); color:var(--ezm-muted); }
.epic-public-memberships .ezm-ov-body .ezm-action, .epic-public-memberships .ezm-ov-body .ezm-theme-action { margin-top:auto; }

/* Shared benefits: figure tiles; long text stays a quiet note */
.epic-public-memberships .ezm-shared { margin-top:40px; }
.epic-public-memberships .ezm-shared h3 { margin-bottom:20px; font-size:var(--ezm-title-size,30px); }
.epic-public-memberships .ezm-tiles { list-style:none; padding:0; display:grid; gap:16px; grid-template-columns:repeat(3,minmax(0,1fr)); }
.epic-public-memberships .ezm-tile-b { display:flex; flex-direction:column; gap:10px; min-height:140px; padding:22px; background:var(--ezm-tile-bg); border-radius:var(--ezm-radius); font-size:15px; line-height:1.45; }
.epic-public-memberships .ezm-fig { font:600 52px/1 var(--ezm-display-font); letter-spacing:-.02em; color:var(--ezm-bronze); }
.epic-public-memberships[data-theme="dark"] .ezm-fig { color:#e2c79a; }
.epic-public-memberships .ezm-tile-text .ezm-icon { width:28px; height:28px; color:var(--ezm-bronze); stroke-width:2; }
.epic-public-memberships .ezm-tile-note { grid-column:1 / -1; flex-direction:row; align-items:flex-start; min-height:0; background:transparent; border:1px dashed var(--ezm-border); color:var(--ezm-muted); font-size:14px; }
.epic-public-memberships .ezm-tile-note .ezm-icon { width:22px; height:22px; margin-top:1px; }
.epic-public-memberships :is(.ezm-empty,[data-empty]) { color:var(--ezm-muted); }

/* Collapse by the width this block actually has (Benefits pages sit beside a sidebar) */
@container ezm (max-width:860px) {
 .epic-public-memberships .ezm-items { grid-template-columns:repeat(min(var(--ezm-columns),2),minmax(0,1fr)); }
 .epic-public-memberships[data-design="overview"] .ezm-items { grid-template-columns:repeat(min(var(--ezm-columns),2),minmax(0,1fr)); }
}
@container ezm (max-width:900px) {
 .epic-public-memberships[data-design="feature"] .ezm-foot > ul { grid-template-columns:minmax(0,1fr); }
}
@container ezm (max-width:700px) {
 .epic-public-memberships .ezm-items, .epic-public-memberships[data-design="overview"] .ezm-items { grid-template-columns:minmax(0,1fr); }
 .epic-public-memberships:is([data-design="feature"],[data-design="ledger"]) .ezm-card { grid-template-columns:minmax(0,1fr); }
 .epic-public-memberships:is([data-design="feature"],[data-design="ledger"]) .ezm-main { padding-top:0; }
 .epic-public-memberships .ezm-tiles { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .epic-public-memberships[data-design="index"] .ezm-card > summary { flex-wrap:wrap; }
}
@container ezm (max-width:440px) {
 .epic-public-memberships .ezm-tiles { grid-template-columns:minmax(0,1fr); }
 .epic-public-memberships .ezm-tile-b { min-height:0; }
 .epic-public-memberships .ezm-price { font-size:min(var(--ezm-price-size,64px),56px); }
 .epic-public-memberships .ezm-band h3 { font-size:min(var(--ezm-title-size,28px),26px); }
}
@media (max-width:600px) { .epic-public-memberships { padding:min(var(--ezm-section-padding),16px); } }
@media (prefers-reduced-motion:reduce) { .epic-public-memberships * { scroll-behavior:auto; transition:none; } .epic-public-memberships .ezm-theme-action:hover { transform:none; } }
