/*
 * hqt-legal.css — shared shell for the policy/utility pages (shipping, returns,
 * privacy, terms, disclaimer, track-order, contact, B2B).
 *
 * Purpose : one on-design replacement for the eight per-template inline <style>
 *           blocks the old developer shipped. Deep-green hero + readable prose
 *           card; forms and info-grids reuse the same vocabulary.
 * Refs    : footer.php (link targets) · hqt-tokens.css (palette variables).
 */

.hqt-legal__hero { background: linear-gradient(150deg, var(--hqt-deep), var(--hqt-forest)); color: #fff; padding: 52px 0 46px; text-align: center; }
/* !important: a later global h1 color rule outranks this compound selector on
   rendered pages (same cascade bug class as the gifting builder heading). */
.hqt-legal__hero h1 { color: #fff !important; font-size: 34px; margin: 0 0 8px; }
.hqt-legal__hero p { color: #cfe0b8; margin: 0; font-size: 14px; }

.hqt-legal { max-width: 860px; margin: -26px auto 60px; background: #fff; border-radius: 16px; box-shadow: var(--hqt-shadow-hover); padding: 42px 46px; position: relative; z-index: 2; }
.hqt-legal h2 { font-size: 20px; color: var(--hqt-forest); margin: 30px 0 10px; }
.hqt-legal h2:first-child { margin-top: 0; }
.hqt-legal h3 { font-size: 16px; color: var(--hqt-forest); margin: 20px 0 8px; }
.hqt-legal p, .hqt-legal li { font-size: 14.5px; line-height: 1.75; color: #3c4433; }
.hqt-legal ul, .hqt-legal ol { padding-left: 22px; margin: 10px 0 16px; }
.hqt-legal li { margin-bottom: 7px; }
.hqt-legal a { color: var(--hqt-forest); font-weight: 600; text-decoration: underline; text-decoration-color: rgba(45, 80, 22, 0.35); }
.hqt-legal a:hover { color: var(--hqt-forest); }
.hqt-legal table { width: 100%; border-collapse: collapse; margin: 14px 0 18px; font-size: 14px; }
.hqt-legal th, .hqt-legal td { padding: 11px 14px; text-align: left; border: 1px solid #e4e9dc; }
.hqt-legal th { background: #f0f4e8; color: var(--hqt-forest); font-weight: 700; }
.hqt-legal__sec { border-bottom: 1px solid #eef1e8; padding-bottom: 18px; margin-bottom: 18px; }
.hqt-legal__sec:last-child { border-bottom: 0; padding-bottom: 0; margin-bottom: 0; }

/* info cards (contact / b2b) */
.hqt-legal__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; margin: 18px 0; }
.hqt-legal__card { background: #f6f8f2; border-radius: 12px; padding: 20px; }
.hqt-legal__card h3 { margin: 0 0 6px; }
.hqt-legal__card p { margin: 0; font-size: 13.5px; }

/* forms (track-order / contact / b2b) */
.hqt-legal form { margin-top: 6px; }
.hqt-legal label { display: block; font-size: 13px; font-weight: 700; color: var(--hqt-forest); margin: 14px 0 5px; }
.hqt-legal input[type="text"], .hqt-legal input[type="email"], .hqt-legal input[type="tel"],
.hqt-legal input[type="number"], .hqt-legal select, .hqt-legal textarea {
	width: 100%; padding: 11px 13px; border: 1.5px solid #dfe5d4; border-radius: 10px; font-size: 14px;
	font-family: inherit; background: #fff; color: #2c3325;
}
.hqt-legal input:focus, .hqt-legal select:focus, .hqt-legal textarea:focus { outline: none; border-color: var(--hqt-leaf); }
.hqt-legal .hqt-btn { margin-top: 18px; }

@media (max-width: 700px) {
	.hqt-legal { padding: 26px 20px; margin-left: 14px; margin-right: 14px; }
	.hqt-legal__hero h1 { font-size: 26px; }
}

/* form notices */
.hqt-legal__ok { background: #eef7e4; border-left: 4px solid var(--hqt-leaf); padding: 12px 14px; border-radius: 8px; font-weight: 600; }
.hqt-legal__err { background: #fbeeee; border-left: 4px solid #c0392b; padding: 12px 14px; border-radius: 8px; font-weight: 600; }

/* Buttons inside the legal card: the generic .hqt-legal a rule (forest text +
   underline, specificity 0,1,1) outranks .hqt-btn--primary (0,1,0) and painted
   forest-on-forest — the track-order CTA read as an empty box. */
.hqt-legal a.hqt-btn { color: #fff; text-decoration: none; }
.hqt-legal a.hqt-btn:hover { color: #fff; }

/* ---- brewing page (rebuilt 2026-07-26 — real product brew data) ---- */
.hqt-brew { padding: 40px 0 60px; }
.hqt-brew__rules { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; max-width: 900px; margin: 0 auto 44px; }
.hqt-brew__rules div { background: #fff; border-radius: 14px; box-shadow: var(--hqt-shadow); padding: 22px; text-align: center; }
.hqt-brew__rules b { display: block; font-family: var(--hqt-ff-display); font-size: 26px; color: var(--hqt-forest); margin-bottom: 4px; }
.hqt-brew__rules span { font-size: 13px; color: var(--hqt-soft); }
.hqt-brew__type { display: grid; grid-template-columns: 300px 1fr; gap: 32px; align-items: center; background: #fff; border-radius: 16px; box-shadow: var(--hqt-shadow); padding: 28px; margin-bottom: 24px; }
.hqt-brew__ph { border-radius: 12px; overflow: hidden; line-height: 0; display: block; }
.hqt-brew__ph img { width: 100%; height: auto; }
.hqt-brew__chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 10px 0 16px; }
.hqt-brew__chips span { background: #f0f4e8; color: var(--hqt-forest); font-weight: 700; font-size: 12.5px; padding: 7px 14px; border-radius: 999px; }
.hqt-brew__steps { list-style: none; padding: 0; margin: 0 0 18px; counter-reset: hqt-step; }
.hqt-brew__steps li { display: flex; gap: 12px; align-items: baseline; padding: 9px 0; border-bottom: 1px solid #eef1e8; counter-increment: hqt-step; }
.hqt-brew__steps li::before { content: counter(hqt-step); flex: none; width: 26px; height: 26px; border-radius: 50%; background: var(--hqt-forest); color: #fff; font-weight: 800; font-size: 13px; display: grid; place-items: center; align-self: center; }
.hqt-brew__steps b { flex: none; min-width: 150px; color: var(--hqt-forest); font-size: 13.5px; }
.hqt-brew__steps span { font-size: 13.5px; color: #3c4433; }
.hqt-brew__film { display: grid; grid-template-columns: 280px 1fr; gap: 32px; align-items: center; background: var(--hqt-deep); color: #fff; border-radius: 16px; padding: 28px; margin: 36px 0; }
.hqt-brew__film h2 { color: #fff !important; margin: 0 0 8px; }
.hqt-brew__film p { color: #cfe0b8; }
.hqt-brew__filmcard { border-radius: 12px; overflow: hidden; }
.hqt-brew__filmcard .hqt-vid--tap { aspect-ratio: 9 / 16; }
.hqt-brew__tip b { color: var(--hqt-forest); }
.hqt-brew__cta { text-align: center; padding: 26px 0 0; }
@media (max-width: 760px) {
	.hqt-brew__rules { grid-template-columns: 1fr; }
	.hqt-brew__type, .hqt-brew__film { grid-template-columns: 1fr; }
	.hqt-brew__steps b { min-width: 0; }
}

/* FAQ accordions (native details — no JS) */
.hqt-faq__item { border-bottom: 1px solid #eef1e8; }
.hqt-faq__item summary { cursor: pointer; font-weight: 700; color: var(--hqt-forest); padding: 13px 0; font-size: 14.5px; list-style-position: outside; }
.hqt-faq__item summary:hover { color: var(--hqt-forest); }
.hqt-faq__item[open] summary { color: var(--hqt-forest); }
.hqt-faq__item p { padding: 0 0 14px 18px; }