/* Rewards landing page ([charcuteried_rewards]). Tokens only. */
.ccr-landing { max-width: 1100px; margin: 0 auto; padding: 0 var(--ccc-gutter, 16px) var(--ccc-section-gap, 64px); }
.ccr-landing h2 { margin: 0 0 8px; font: 400 clamp(26px, 2.6vw, 36px)/1.15 var(--ccc-font-heading, serif); color: var(--ccc-ink, #0b1014); text-align: center; }

.ccr-section-header { text-align: center; margin: var(--ccc-section-gap, 56px) 0 32px; }
.ccr-section-subtitle { max-width: 54ch; margin: 0 auto; font: 400 15px/1.5 var(--ccc-font-body, sans-serif); color: var(--ccc-text, #515151); }

/* Hero section */
.ccr-hero { margin: 0 calc(-1 * var(--ccc-gutter, 16px)) 40px; padding: clamp(40px, 6vw, 72px) var(--ccc-gutter, 16px); background: var(--ccc-cream, #f2f1eb); text-align: center; border-radius: var(--ccc-radius-lg, 8px); }
.ccr-hero__eyebrow { margin: 0 0 10px; font: 600 12px/1.2 var(--ccc-font-body, sans-serif); text-transform: uppercase; letter-spacing: 0.15em; color: var(--ccc-primary, #1e2934); }
.ccr-hero .ccr-hero__title { margin: 0 0 14px; font: 400 clamp(32px, 4vw, 52px)/1.1 var(--ccc-font-heading, serif); color: var(--ccc-ink, #0b1014); }
.ccr-hero__text { max-width: 52ch; margin: 0 auto 24px; font: 400 clamp(15px, 1.4vw, 17px)/1.5 var(--ccc-font-body, sans-serif); color: var(--ccc-text, #515151); }

/* Buttons */
.ccr-hero__actions, .ccr-tracker__actions { display: flex; align-items: center; justify-content: center; gap: 14px; margin-top: 24px; flex-wrap: wrap; }
.ccr-btn--primary, .ccr-btn--secondary { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 28px; border-radius: var(--ccc-radius, 4px); font: 600 12px/1 var(--ccc-font-body, sans-serif); text-transform: uppercase; letter-spacing: 0.12em; text-decoration: none; transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease; }
.ccr-btn--primary { background: var(--ccc-primary, #1e2934); color: #fff !important; border: 1px solid var(--ccc-primary, #1e2934); }
.ccr-btn--primary:hover { background: #000; border-color: #000; }
.ccr-btn--secondary { background: transparent; color: var(--ccc-primary, #1e2934) !important; border: 1px solid var(--ccc-primary, #1e2934); }
.ccr-btn--secondary:hover { background: var(--ccc-primary, #1e2934); color: #fff !important; }

/* Authenticated Member Tracker */
.ccr-tracker { max-width: 760px; margin: 28px auto 0; padding: 24px; background: #fff; border-radius: var(--ccc-radius-lg, 8px); box-shadow: 0 4px 16px rgba(0, 0, 0, 0.05); }
.ccr-tracker__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; align-items: center; text-align: left; }
@media (max-width: 600px) { .ccr-tracker__grid { grid-template-columns: 1fr; text-align: center; } }
.ccr-tracker__item { display: flex; flex-direction: column; gap: 4px; }
.ccr-tracker__val { font: 400 clamp(28px, 3vw, 36px)/1 var(--ccc-font-heading, serif); color: var(--ccc-primary, #1e2934); font-weight: 600; }
.ccr-tracker__lbl { font: 500 12px/1.3 var(--ccc-font-body, sans-serif); text-transform: uppercase; letter-spacing: 0.08em; color: var(--ccc-text, #515151); }
.ccr-tracker__badge { display: inline-block; padding: 6px 14px; background: var(--ccc-primary, #1e2934); color: #fff; font: 700 12px/1 var(--ccc-font-body, sans-serif); text-transform: uppercase; letter-spacing: 0.1em; border-radius: 20px; width: fit-content; }
@media (max-width: 600px) { .ccr-tracker__badge { margin: 0 auto; } }
.ccr-tracker__item--progress { grid-column: 1 / -1; margin-top: 8px; }
.ccr-tracker__bar-wrap { width: 100%; height: 8px; background: #e5e5e5; border-radius: 4px; overflow: hidden; }
.ccr-tracker__bar { height: 100%; background: var(--ccc-primary, #1e2934); border-radius: 4px; transition: width 0.4s ease; }
.ccr-tracker__subtext { font: 400 13px/1.4 var(--ccc-font-body, sans-serif); color: var(--ccc-text, #515151); margin-top: 6px; }

/* 3 How It Works Steps */
.ccr-landing .ccr-steps { display: grid; gap: 20px; grid-template-columns: 1fr; margin: 0; padding: 0; list-style: none; counter-reset: ccr; }
@media (min-width: 768px) { .ccr-landing .ccr-steps { grid-template-columns: repeat(3, 1fr); } }
.ccr-landing .ccr-steps li { position: relative; padding: 32px 24px 24px; border: 1px solid var(--ccc-border, #d9d9d9); border-radius: var(--ccc-radius-lg, 8px); background: #fff; text-align: left; }
.ccr-landing .ccr-steps li::before { content: counter(ccr); position: absolute; top: -14px; left: 24px; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--ccc-primary, #1e2934); color: #fff; font: 700 12px/1 var(--ccc-font-body, sans-serif); counter-increment: ccr; }
.ccr-landing .ccr-steps li strong { display: block; margin-bottom: 8px; font: 600 17px/1.3 var(--ccc-font-body, sans-serif); color: var(--ccc-ink, #0b1014); }
.ccr-landing .ccr-steps li span { display: block; font: 400 14px/1.5 var(--ccc-font-body, sans-serif); color: var(--ccc-text, #515151); }

/* 8 Ways to Earn Cards */
.ccr-landing .ccr-cards { display: grid; gap: 16px; grid-template-columns: 1fr; margin: 0; padding: 0; list-style: none; }
@media (min-width: 540px) { .ccr-landing .ccr-cards { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 900px) { .ccr-landing .ccr-cards { grid-template-columns: repeat(4, 1fr); } }
.ccr-landing .ccr-cards li { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; min-height: 160px; padding: 24px 18px; text-align: center; background: var(--ccc-cream, #f2f1eb); border-radius: var(--ccc-radius-lg, 8px); list-style: none; transition: transform 0.2s ease, box-shadow 0.2s ease; }
.ccr-landing .ccr-cards li:hover { transform: translateY(-2px); box-shadow: 0 6px 16px rgba(0, 0, 0, 0.06); }
.ccr-card__pts { font: 700 14px/1.2 var(--ccc-font-body, sans-serif); text-transform: uppercase; letter-spacing: 0.08em; color: var(--ccc-primary, #1e2934); background: rgba(30, 41, 52, 0.08); padding: 4px 10px; border-radius: 12px; }
.ccr-card__title { margin: 4px 0 0; font: 600 16px/1.3 var(--ccc-font-body, sans-serif); color: var(--ccc-ink, #0b1014); }
.ccr-card__desc { font: 400 13px/1.45 var(--ccc-font-body, sans-serif); color: var(--ccc-text, #515151); }

/* Ways to Redeem Matrix */
.ccr-redeem { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; list-style: none; margin: 0 0 16px; padding: 0; border: 1px solid var(--ccc-border, #d9d9d9); border-radius: var(--ccc-radius-lg, 8px); overflow: hidden; background: #fff; }
.ccr-redeem li { padding: 28px 16px; text-align: center; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; }
.ccr-redeem li + li { border-left: 1px solid var(--ccc-border, #d9d9d9); }
.ccr-redeem strong { display: block; font: 400 clamp(24px, 2.2vw, 32px)/1.1 var(--ccc-font-heading, Georgia, serif); color: var(--ccc-ink, #0b1014); }
.ccr-redeem span { display: block; font: 700 12px/1.2 var(--ccc-font-body, sans-serif); text-transform: uppercase; letter-spacing: 0.1em; color: var(--ccc-primary, #1e2934); }
.ccr-redeem__perk { font-style: normal; font: 400 12px/1.3 var(--ccc-font-body, sans-serif); color: var(--ccc-text, #515151); }
@media (max-width: 640px) {
	.ccr-redeem { grid-template-columns: repeat(2, 1fr); }
	.ccr-redeem li:nth-child(2n + 1) { border-left: 0; }
	.ccr-redeem li:nth-child(n + 3) { border-top: 1px solid var(--ccc-border, #d9d9d9); }
}

/* 3-Tier VIP Table */
.ccr-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; border: 1px solid var(--ccc-border, #d9d9d9); border-radius: var(--ccc-radius-lg, 8px); background: #fff; margin-bottom: 24px; }
.ccr-tiers { width: 100%; border-collapse: collapse; font-size: 14px; text-align: left; }
.ccr-tiers th, .ccr-tiers td { padding: 18px 20px; border-bottom: 1px solid var(--ccc-border, #d9d9d9); }
.ccr-tiers tr:last-child td { border-bottom: 0; }
.ccr-tiers th { font: 700 11px/1.2 var(--ccc-font-body, sans-serif); text-transform: uppercase; letter-spacing: 0.14em; color: var(--ccc-ink, #0b1014); background: #fafafa; }
.ccr-tier-name { font-weight: 600; color: var(--ccc-ink, #0b1014); width: 22%; }
.ccr-tier-spend { font-weight: 500; color: var(--ccc-primary, #1e2934); width: 22%; white-space: nowrap; }
.ccr-tier-perks { color: var(--ccc-text, #515151); line-height: 1.5; }

/* FAQ Accordion */
.ccr-faq { display: flex; flex-direction: column; gap: 12px; margin: 0 auto; max-width: 820px; }
.ccr-faq__item { border: 1px solid var(--ccc-border, #d9d9d9); border-radius: var(--ccc-radius, 4px); background: #fff; overflow: hidden; transition: border-color 0.2s ease; }
.ccr-faq__item[open] { border-color: var(--ccc-ink, #0b1014); }
.ccr-faq__q { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 20px; font: 600 15px/1.3 var(--ccc-font-body, sans-serif); color: var(--ccc-ink, #0b1014); cursor: pointer; user-select: none; list-style: none; }
.ccr-faq__q::-webkit-details-marker { display: none; }
.ccr-faq__icon { flex-shrink: 0; transition: transform 0.2s ease; }
.ccr-faq__item[open] .ccr-faq__icon { transform: rotate(180deg); }
.ccr-faq__a { padding: 0 20px 18px; font: 400 14px/1.6 var(--ccc-font-body, sans-serif); color: var(--ccc-text, #515151); border-top: 1px solid transparent; }
.ccr-faq__a p { margin: 0; }

