@charset "utf-8";
/* ==========================================================================
   sg/info.css — our additions for the FAQ / Contact / Services / Events pages
   (loaded after the coder's page CSS). The coder's answers are one <p>; ours
   (Admin text with line breaks, the policy texts) can be several.
   ========================================================================== */
.fq-a_inner > div > * + * { margin-top: .08rem; }
.fq-a_inner strong { font-weight: 600; color: var(--c-ink); }
.fq-a_inner .sg-draft { font-size: .12rem; color: var(--c-ink-muted); font-style: italic; }
/* group anchors (/faq#skincare) and policy anchors land below the sticky header */
.fq-group[id], .fq-item[id] { scroll-margin-top: calc(var(--header-h, .64rem) + .16rem); }

/* contact: several opening-hours lines */
.ct-list dd span { display: block; }

/* events: why items can't be bought right now (upcoming / ended / wholesale) */
.evd-note {
    margin-top: .12rem;
    padding: .12rem .16rem;
    border-radius: .08rem;
    background: var(--c-warm);
    font-size: .13rem;
    line-height: .2rem;
    color: var(--c-ink-muted);
}
/* event card / hero without a public image: the coder's warm placeholder */
.sg-event-noimg { object-fit: contain !important; background: var(--c-warm); }

/* compact product card (event items): our Add to Cart is wrapped in a <form>, which the coder's
   column flex shrinks to the button's width — stretch it so the button is full width as designed */
.evd-grid .c-product--compact .c-product_actions > form { align-self: stretch; }