/**
 * Storefront styles — mobile-first.
 * Bright & celebratory brand system (v2.7.0).
 *
 * @package RG_Communicator
 * @version 2.7.0
 */

:root {
    --rgc-primary: #c8102e;      /* graduation red */
    --rgc-primary-600: #a20d24;
    --rgc-primary-700: #7c0a1c;
    --rgc-accent: #e11d2e;       /* bright red — labels / errors */
    --rgc-gold: #17171b;         /* black — cart badge / sharp accents */
    --rgc-mint: #c8102e;         /* red — add-on "+$" pop */
    --rgc-ink: #17171b;          /* near-black text */
    --rgc-muted: #6f6467;
    --rgc-page: #fbf6f6;         /* soft warm white */
    --rgc-surface: #ffffff;
    --rgc-line: #ecdcde;         /* soft red-tinted border */
    --rgc-radius: 14px;
}

* { box-sizing: border-box; }
body.rgc-store {
    margin: 0; background: var(--rgc-page); color: var(--rgc-ink);
    font-family: "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
    line-height: 1.55;
}

/* Header — festive gradient */
.rgc-store-header { background: linear-gradient(105deg, #c8102e 0%, #9a0c22 58%, #17171b 125%); color: #fff; }
.rgc-store-header-inner {
    max-width: 1080px; margin: 0 auto; padding: 12px 16px;
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
}
.rgc-store-brand { color: #fff; font-size: 18px; font-weight: 700; text-decoration: none; display: inline-flex; align-items: center; }
.rgc-store-logo { display: block; max-height: 48px; width: auto; }
.rgc-store-header-right { display: flex; align-items: center; gap: 14px; }
.rgc-school-badge { font-size: 13px; background: rgba(255,255,255,.14); padding: 4px 10px; border-radius: 12px; }
.rgc-change-school { color: #ffd6db; margin-left: 6px; font-size: 12px; }
.rgc-map-link { color: #ffd6db; text-decoration: none; font-size: 14px; font-weight: 500; white-space: nowrap; }
.rgc-map-link:hover { color: #fff; text-decoration: underline; }
.rgc-account-link { color: #fff; text-decoration: none; font-size: 17px; line-height: 1; }
.rgc-cart-link { color: #fff; text-decoration: none; font-size: 18px; }
.rgc-store-footer a { color: inherit; }

/* Sign-in page (v2.24.0) */
.rgc-login-page { max-width: 440px; margin: 0 auto; padding: 24px 16px 40px; }
.rgc-login-form { display: flex; gap: 10px; flex-wrap: wrap; margin: 18px 0 6px; }
.rgc-login-form input[type=email] { flex: 1 1 220px; font-size: 16px; padding: 12px 14px; border: 1.5px solid var(--rgc-line); border-radius: 12px; }
.rgc-login-form input[type=email]:focus { outline: none; border-color: var(--rgc-primary); box-shadow: 0 0 0 3px rgba(200,16,46,.16); }
.rgc-login-status { min-height: 1.4em; font-weight: 600; }
.rgc-login-expired { background: #fdf3d7; border: 1px solid #eec966; border-radius: 10px; padding: 10px 14px; }
.rgc-cart-count {
    background: var(--rgc-gold); color: #fff; border-radius: 10px; padding: 0 7px;
    font-size: 12px; font-weight: 700; vertical-align: top;
}

.rgc-store-main { max-width: 1080px; margin: 0 auto; padding: 20px clamp(16px, 4vw, 40px) 60px; }
.rgc-store-footer { text-align: center; color: #646970; padding: 24px 16px; font-size: 14px; }

h1 { font-size: 24px; margin: 12px 0 8px; }
h2 { font-size: 20px; margin: 28px 0 6px; }
.rgc-lead { color: #50575e; margin-top: 0; }

/* Buttons */
.rgc-btn {
    display: inline-block; padding: 11px 20px; border-radius: 999px; border: 0;
    font-size: 15px; font-weight: 600; text-decoration: none; cursor: pointer; text-align: center;
}
.rgc-btn-primary { background: var(--rgc-primary); color: #fff; box-shadow: 0 4px 14px rgba(200,16,46,.32); }
.rgc-btn-primary:hover { background: var(--rgc-primary-600); transform: translateY(-1px); }
.rgc-btn-secondary { background: #fff; color: var(--rgc-primary-700); border: 1.5px solid var(--rgc-line); }
.rgc-btn-big { padding: 14px 28px; font-size: 17px; }

/* School selector */
.rgc-school-select { max-width: 480px; margin: 8vh auto 0; text-align: center; }
.rgc-school-form { display: flex; flex-direction: column; gap: 14px; margin-top: 20px; }
.rgc-school-form select { padding: 12px; font-size: 16px; border-radius: 6px; border: 1px solid #c3c4c7; }

/* Catalog grid */
.rgc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 16px; margin: 12px 0 8px; }
.rgc-card {
    background: var(--rgc-surface); border: 1px solid var(--rgc-line); border-radius: var(--rgc-radius);
    transition: transform .18s ease, box-shadow .18s ease;
    padding: 14px; display: flex; flex-direction: column; gap: 6px;
}
.rgc-card a { text-decoration: none; color: inherit; }
.rgc-card-img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 6px; }
.rgc-card-title { font-size: 15px; margin: 4px 0 0; }
.rgc-card-price { font-size: 18px; font-weight: 700; margin: 0 0 6px; color: var(--rgc-primary-700); }

/* Item page */
.rgc-breadcrumb a { color: var(--rgc-primary-700); text-decoration: none; }
.rgc-item, .rgc-item-layout, .rgc-item-body, .rgc-wizard { max-width: 100%; }
.rgc-item-layout { display: grid; grid-template-columns: 1fr; gap: 24px; }
/* Side-by-side only on wide screens; below 960px stack so the card
   always gets full width and can never be squeezed/clipped. The image
   caps its width when stacked so it doesn't dominate. */
@media (min-width: 960px) { .rgc-item-layout { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); } }
.rgc-item-media img { width: 100%; border-radius: 8px; }
@media (max-width: 959px) { .rgc-item-media { max-width: 420px; } }
.rgc-item-price { font-size: 28px; font-weight: 700; margin: 4px 0 12px; color: var(--rgc-primary-700); }
/* School stole/hood notice (v2.25.0) — decided by the chosen school. */
.rgc-regalia-note { display: flex; flex-direction: column; gap: 2px; background: #fff8e6; border: 1px solid #f0d58a; border-left: 4px solid var(--rgc-primary-700); border-radius: 8px; padding: 10px 14px; margin: 0 0 14px; font-size: 15px; }
.rgc-regalia-note .rgc-regalia-desc { color: #444; }
.rgc-regalia-note .rgc-regalia-price { font-weight: 600; color: var(--rgc-primary-700); }
.rgc-regalia-note.rgc-regalia-none { background: #f4f4f2; border-color: #ddd; border-left-color: #999; color: #555; }
.rgc-item-contents { background: #fff; border: 1px solid #e0e0dd; border-radius: 8px; padding: 12px 16px; margin: 12px 0; }
.rgc-item-contents h3 { margin: 0 0 6px; }
.rgc-item-contents ul { margin: 0; padding-left: 20px; }

.rgc-opt-heading { margin: 20px 0 4px; font-size: 16px; }
.rgc-opt-divider { border: 0; border-top: 1px solid #e0e0dd; margin: 18px 0; }
.rgc-opt-group { margin: 12px 0; border: 0; padding: 0; }
.rgc-opt-group label { display: block; font-weight: 600; font-size: 14px; }
.rgc-opt-group input[type=text], .rgc-opt-group input[type=number], .rgc-opt-group select {
    display: block; width: 100%; max-width: 380px; margin-top: 4px;
    padding: 10px; font-size: 15px; border: 1px solid #c3c4c7; border-radius: 6px;
}
.rgc-opt-group legend { font-weight: 600; font-size: 14px; padding: 0; margin-bottom: 4px; }
.rgc-radio { display: block; font-weight: 400 !important; padding: 6px 0 6px 2px; }
.rgc-radio input { margin-right: 8px; }
.rgc-delta { color: var(--rgc-mint); font-weight: 600; }
.rgc-req { color: #b32d2e; }

.rgc-addtocart { display: flex; align-items: flex-end; gap: 14px; margin-top: 22px; }
.rgc-qty-label { font-weight: 600; font-size: 14px; }
.rgc-item-qty { width: 70px; padding: 12px 8px; font-size: 16px; border: 1px solid #c3c4c7; border-radius: 6px; display: block; margin-top: 4px; }
.rgc-add-status { min-height: 20px; font-weight: 600; color: var(--rgc-primary); }
.rgc-add-status.rgc-error { color: #b32d2e; }

/* Cart */
.rgc-cart-table { width: 100%; background: #fff; border: 1px solid #e0e0dd; border-radius: 8px; border-collapse: separate; border-spacing: 0; }
.rgc-cart-table th, .rgc-cart-table td { padding: 12px 14px; text-align: left; border-bottom: 1px solid #eee; vertical-align: top; }
.rgc-cart-table .rgc-num { text-align: right; }
.rgc-line-options { margin: 6px 0 0; padding-left: 18px; color: #50575e; font-size: 13px; }
.rgc-line-qty { width: 64px; padding: 8px; border: 1px solid #c3c4c7; border-radius: 6px; }
.rgc-line-remove { color: #b32d2e; font-size: 20px; text-decoration: none; }

.rgc-cart-totals { max-width: 340px; margin: 18px 0 6px auto; }
.rgc-cart-totals p { display: flex; justify-content: space-between; margin: 6px 0; }
.rgc-t-grand { font-size: 20px; font-weight: 700; border-top: 2px solid #1d2327; padding-top: 8px; }
.rgc-cart-actions { display: flex; justify-content: space-between; gap: 12px; margin-top: 18px; flex-wrap: wrap; }
.rgc-note { color: #50575e; text-align: right; font-size: 13px; }

@media (max-width: 600px) {
    .rgc-school-badge { display: none; }
    .rgc-cart-actions { flex-direction: column-reverse; }
    .rgc-cart-actions .rgc-btn { width: 100%; }
}

/* Checkout */
.rgc-checkout-layout { display: grid; grid-template-columns: 1fr; gap: 24px; }
@media (min-width: 820px) { .rgc-checkout-layout { grid-template-columns: 3fr 2fr; } }
.rgc-checkout-main h2 { margin-top: 22px; }
.rgc-checkout-main label { display: block; font-weight: 600; font-size: 14px; margin: 12px 0; }
.rgc-checkout-main input[type=text], .rgc-checkout-main input[type=email],
.rgc-checkout-main input[type=tel], .rgc-checkout-main input[type=number] {
    display: block; width: 100%; margin-top: 4px; padding: 11px;
    font-size: 15px; border: 1px solid #c3c4c7; border-radius: 6px;
}
.rgc-field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.rgc-check { font-weight: 400 !important; display: flex !important; gap: 10px; align-items: flex-start; }
.rgc-check input { margin-top: 3px; }
.rgc-sms-box { background: #fdf1f2; border: 1px solid #f2c9cf; border-radius: 6px; padding: 12px 14px; }
.rgc-paychoice { border: 1px solid #e0e0dd; border-radius: 8px; padding: 12px 16px; background: #fff; }
.rgc-deposit-wrap { padding-left: 26px; }
.rgc-deposit-wrap input { max-width: 180px; }
.rgc-hint { color: #50575e; font-size: 13px; margin: 4px 0 0; }
.rgc-checkout-error {
    background: #fcf0f1; border: 1px solid #f0b8b8; color: #b32d2e;
    border-radius: 6px; padding: 12px 16px; margin: 14px 0; font-weight: 600;
}
.rgc-secure-note { color: #50575e; font-size: 13px; }
.rgc-checkout-summary { background: #fff; border: 1px solid #e0e0dd; border-radius: 8px; padding: 16px 20px; align-self: start; }
.rgc-summary-school { color: #50575e; margin-top: -6px; }
.rgc-summary-lines { list-style: none; margin: 0 0 12px; padding: 0; border-bottom: 1px solid #eee; }
.rgc-summary-lines li { display: flex; justify-content: space-between; gap: 12px; padding: 6px 0; font-size: 14px; }
.rgc-summary-row { display: flex; justify-content: space-between; margin: 6px 0; }
.rgc-summary-total { font-size: 19px; font-weight: 700; border-top: 2px solid #1d2327; padding-top: 8px; }

/* Receipt */
.rgc-receipt { max-width: 560px; margin: 0 auto; }
.rgc-receipt-box { background: #fff; border: 1px solid #e0e0dd; border-radius: 8px; padding: 18px 22px; margin: 18px 0; }
.rgc-receipt-row { display: flex; justify-content: space-between; margin: 7px 0; }
.rgc-receipt-items { width: 100%; margin: 12px 0; border-top: 1px solid #eee; border-bottom: 1px solid #eee; }
.rgc-receipt-items td { padding: 7px 0; }
.rgc-receipt-total { font-size: 18px; font-weight: 700; }
.rgc-receipt-balance { color: #b32d2e; }

/* ===== Bright & celebratory additions (v2.7.0) ===== */
.rgc-card:hover { transform: translateY(-4px); box-shadow: 0 12px 28px rgba(200,16,46,.16); }
.rgc-card-title { font-weight: 600; }
h1, h2 { color: var(--rgc-ink); font-weight: 700; }
.rgc-lead { color: var(--rgc-muted); }

/* Guided configurator wizard */
.rgc-wizard { background: var(--rgc-surface); border: 1px solid var(--rgc-line); border-radius: 18px; overflow: hidden; box-shadow: 0 10px 40px rgba(200,16,46,.10); }
.rgc-wz-bar-track { height: 6px; background: #f0e9fa; }
.rgc-wz-bar { height: 100%; width: 0; background: linear-gradient(90deg, var(--rgc-primary), var(--rgc-accent)); transition: width .4s ease; }
.rgc-wz-stage { padding: 26px 24px; min-height: 260px; }
.rgc-wz-step { opacity: 0; transform: translateX(26px); transition: opacity .3s ease, transform .3s ease; }
/* !important so a stylesheet update fixes the resting position even when
   a stale cached rgc-store.js leaves an inline transform:translateX(26px)
   on the step (a stylesheet !important beats a non-important inline style).
   v2.7.9 — the real "content shoved right / clipped" fix. */
.rgc-wz-step.in { opacity: 1 !important; transform: translateX(0) !important; }
.rgc-wz-count { font-size: 12px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--rgc-accent); }
.rgc-wz-q { font-size: 22px; font-weight: 700; margin: 6px 0 18px; color: var(--rgc-ink); }
.rgc-wz-choices { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 12px; }
.rgc-wz-choice { text-align: left; border: 1.5px solid var(--rgc-line); background: #fff; border-radius: 14px; padding: 14px 16px; font-size: 15px; font-weight: 500; color: var(--rgc-ink); cursor: pointer; transition: border-color .15s, box-shadow .15s, transform .1s; display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.rgc-wz-choice:hover { border-color: var(--rgc-primary); }
.rgc-wz-choice.sel { border-color: var(--rgc-primary); box-shadow: 0 0 0 3px rgba(200,16,46,.18); }
.rgc-wz-choice .rgc-wz-plus { color: var(--rgc-mint); font-weight: 700; font-size: 14px; }
.rgc-wz-swatches { display: grid; grid-template-columns: repeat(auto-fit, minmax(96px, 1fr)); gap: 14px; }
.rgc-wz-swatch { border: 1.5px solid var(--rgc-line); background: #fff; border-radius: 14px; padding: 12px 6px; display: flex; flex-direction: column; align-items: center; gap: 9px; cursor: pointer; font-size: 13px; font-weight: 500; transition: border-color .15s, box-shadow .15s; }
.rgc-wz-swatch:hover { border-color: var(--rgc-primary); }
.rgc-wz-swatch.sel { border-color: var(--rgc-primary); box-shadow: 0 0 0 3px rgba(200,16,46,.18); }
.rgc-wz-dot { width: 46px; height: 46px; border-radius: 50%; border: 2px solid #fff; box-shadow: 0 0 0 1px var(--rgc-line); }
.rgc-wz-text input, .rgc-wz-text select { width: 100%; font-size: 17px; padding: 13px 14px; border: 1.5px solid var(--rgc-line); border-radius: 12px; }
.rgc-wz-text input:focus, .rgc-wz-text select:focus { outline: none; border-color: var(--rgc-primary); box-shadow: 0 0 0 3px rgba(200,16,46,.16); }
.rgc-wz-foot { display: flex; align-items: center; justify-content: space-between; padding: 16px 24px; border-top: 1px solid var(--rgc-line); background: #fdfbff; }
.rgc-wz-back { background: none; border: 0; color: var(--rgc-muted); font-size: 15px; font-weight: 600; cursor: pointer; }
.rgc-wz-total-label { font-size: 12px; color: var(--rgc-muted); }
.rgc-wz-total { font-size: 24px; font-weight: 800; color: var(--rgc-ink); transition: transform .25s ease, color .5s ease; display: inline-block; }
.rgc-wz-next { background: var(--rgc-primary); color: #fff; border: 0; border-radius: 999px; padding: 12px 26px; font-size: 16px; font-weight: 700; cursor: pointer; box-shadow: 0 4px 14px rgba(200,16,46,.32); }
.rgc-wz-next:hover { background: var(--rgc-primary-600); }
.rgc-wz-finish { text-align: center; padding: 10px 0; }
.rgc-wz-finish .rgc-wz-cap { font-size: 46px; }
.rgc-wz-summary { list-style: none; padding: 0; margin: 14px auto 20px; max-width: 320px; text-align: left; }
.rgc-wz-summary li { display: flex; justify-content: space-between; padding: 7px 0; border-bottom: 1px dashed var(--rgc-line); font-size: 14px; }
.rgc-wz-err { color: var(--rgc-accent); font-weight: 600; font-size: 14px; margin-top: 10px; min-height: 18px; }
@keyframes rgc-pop { 0% { transform: scale(1); } 40% { transform: scale(1.16); } 100% { transform: scale(1); } }
.rgc-pop { animation: rgc-pop .4s ease; }

/* v2.7.1 — configurator responsiveness (grid children need min-width:0 or they overflow) */
.rgc-item-layout > * { min-width: 0; }
.rgc-item-media, .rgc-item-body { min-width: 0; }
.rgc-wizard { max-width: 100%; }
.rgc-wz-choices, .rgc-wz-swatches { grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); }
.rgc-wz-choice, .rgc-wz-swatch { min-width: 0; }
.rgc-wz-choice span, .rgc-wz-swatch span { overflow-wrap: anywhere; }
@media (max-width: 560px) {
    .rgc-wz-stage { padding: 20px 16px; min-height: 220px; }
    .rgc-wz-q { font-size: 19px; }
    .rgc-wz-foot { padding: 14px 16px; }
    .rgc-wz-next { padding: 11px 20px; font-size: 15px; }
}

/* v2.9.0 — grouped configurator steps (multiple questions per screen) */
.rgc-wz-q-block { margin: 0 0 20px; }
.rgc-wz-q-block:last-of-type { margin-bottom: 6px; }
.rgc-wz-q-label { font-size: 15px; font-weight: 600; color: var(--rgc-ink); margin: 0 0 9px; }
.rgc-wz-req { color: var(--rgc-accent); }
.rgc-wz-opt { font-weight: 400; color: var(--rgc-muted); font-size: 13px; }
.rgc-wz-stage { max-height: 62vh; overflow-y: auto; }
.rgc-wz-summary li span:first-child { color: var(--rgc-muted); padding-right: 12px; }
.rgc-wz-summary li span:last-child { font-weight: 600; text-align: right; }

/* Admin live-preview mode (v2.13.0) */
.rgc-preview-banner {
    background: #fff4e5; color: #7a4a00; border-bottom: 2px solid #f0b429;
    padding: 8px 16px; font-size: 13px; font-weight: 600; text-align: center;
}
.rgc-is-preview .rgc-btn[disabled] { opacity: .55; cursor: not-allowed; }

/* Picture-card choices (v2.15.0) — recovered choice images */
.rgc-wz-pics { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 14px; }
.rgc-wz-pic {
    border: 1.5px solid var(--rgc-line); background: #fff; border-radius: 14px; padding: 10px;
    cursor: pointer; text-align: center; display: flex; flex-direction: column; gap: 8px;
    transition: border-color .15s, box-shadow .15s, transform .1s; min-width: 0;
}
.rgc-wz-pic:hover { border-color: var(--rgc-primary); transform: translateY(-2px); }
.rgc-wz-pic.sel { border-color: var(--rgc-primary); box-shadow: 0 0 0 3px rgba(200,16,46,.18); }
.rgc-wz-pic-img {
    display: block; width: 100%; aspect-ratio: 1 / 1; border-radius: 10px;
    background: #f6f1f2 center / contain no-repeat;
}
.rgc-wz-pic-none { background: repeating-linear-gradient(45deg,#f3eeef,#f3eeef 8px,#eae3e5 8px,#eae3e5 16px); }
.rgc-wz-pic-label { font-size: 14px; font-weight: 600; color: var(--rgc-ink); line-height: 1.3; overflow-wrap: anywhere; }
@media (max-width: 560px) { .rgc-wz-pics { grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 10px; } }

/* Choice descriptions on wizard cards (v2.23.0) */
.rgc-wz-pic-desc { display: block; font-size: 12px; font-weight: 400; color: var(--rgc-muted); line-height: 1.35; margin-top: 2px; }
.rgc-wz-choice { flex-wrap: wrap; }
.rgc-wz-choice-desc { flex-basis: 100%; font-size: 12.5px; font-weight: 400; color: var(--rgc-muted); line-height: 1.35; }

/* "No thanks" tile on optional groups (v2.20.1) */
.rgc-wz-skip { border-style: dashed; }
.rgc-wz-skip span, .rgc-wz-skip .rgc-wz-pic-label { color: var(--rgc-muted); font-weight: 500; }
.rgc-wz-skip:hover { border-color: var(--rgc-muted); }
.rgc-wz-skip.sel { border-color: var(--rgc-muted); box-shadow: 0 0 0 3px rgba(120, 116, 124, .16); }
.rgc-wz-skip-img { display: flex; align-items: center; justify-content: center; width: 100%; aspect-ratio: 1 / 1; border-radius: 10px; background: #faf7f8; }
.rgc-wz-skip-img::before { content: '\2715'; font-size: 26px; color: var(--rgc-muted); opacity: .45; }
.rgc-wz-dot-none { background: #fff; position: relative; }
.rgc-wz-dot-none::before { content: '\2715'; position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: var(--rgc-muted); font-size: 16px; opacity: .55; }

/* ===== Gate sequences (9.17) ===== */
.rgc-gate { max-width: 1080px; margin: 0 auto; }
.rgc-gate-page { margin-bottom: 36px; }
.rgc-gate-hero {
    background: #17171b center / cover no-repeat; border-radius: 16px; padding: clamp(48px, 9vw, 140px) 20px;
    display: flex; justify-content: center; margin-bottom: 28px;
}
.rgc-gate-hero-card { background: #fff; border: 1px solid #000; border-radius: 8px; padding: 26px 30px; max-width: 720px; text-align: center; }
.rgc-gate-hero-card h1 { font-size: clamp(22px, 3.2vw, 34px); margin: 0 0 10px; }
.rgc-gate-sub { color: var(--rgc-muted); font-size: 16px; }
.rgc-gate-benefits { background: #f5f5f5; border-radius: 14px; padding: 22px 26px; margin-bottom: 28px; }
.rgc-gate-benefits h2 { margin: 0 0 10px; }
.rgc-gate-benefits ul { list-style: none; padding: 0; margin: 0; }
.rgc-gate-benefits li { padding: 6px 0 6px 32px; position: relative; font-size: 16px; }
.rgc-gate-benefits li::before { content: "🎓"; position: absolute; left: 0; }
.rgc-gate-items h2 { text-align: center; margin: 8px 0 18px; }
.rgc-gate-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 18px; margin-bottom: 32px; }
.rgc-gate-items-small .rgc-gate-grid { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
.rgc-gate-card { background: #fff; border: 1px solid var(--rgc-line); border-radius: 14px; padding: 16px; text-align: center; display: flex; flex-direction: column; gap: 8px; transition: transform .18s, box-shadow .18s; }
.rgc-gate-card:hover { transform: translateY(-4px); box-shadow: 0 12px 28px rgba(200,16,46,.14); }
.rgc-gate-card img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 10px; }
.rgc-gate-card h3 { margin: 4px 0 0; font-size: 16px; }
.rgc-gate-desc { color: var(--rgc-muted); font-size: 13px; margin: 0; flex: 1; }
.rgc-gate-price { font-size: 20px; font-weight: 800; color: var(--rgc-primary-700); }
.rgc-gate-text { max-width: 760px; margin: 0 auto 28px; }
.rgc-gate-text h3 { margin: 18px 0 6px; }
.rgc-gate-cta { text-align: center; }
/* The release — deliberately quiet, at the very end */
.rgc-gate-release { text-align: center; padding: 28px 0 12px; border-top: 1px dashed var(--rgc-line); margin-top: 12px; }
.rgc-gate-release-btn { background: #fff; color: var(--rgc-ink); border: 1.5px solid var(--rgc-line); box-shadow: none; font-weight: 600; }
.rgc-gate-release-btn:hover { border-color: var(--rgc-primary); color: var(--rgc-primary); }
/* flip mode */
.rgc-gate-progress { display: flex; align-items: center; gap: 8px; justify-content: center; margin: 6px 0 22px; }
.rgc-gate-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--rgc-line); }
.rgc-gate-dot.is-done { background: #c98a93; }
.rgc-gate-dot.is-on { background: var(--rgc-primary); transform: scale(1.25); }
.rgc-gate-step { font-size: 13px; color: var(--rgc-muted); margin-left: 8px; }
.rgc-gate-nav { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin: 8px 0 20px; }
.rgc-gate-flip-page { animation: rgc-gate-in .32s ease; }
@keyframes rgc-gate-in { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.rgc-gate-empty { text-align: center; color: var(--rgc-muted); padding: 60px 20px; border: 2px dashed var(--rgc-line); border-radius: 14px; }
.rgc-catalog-gated { text-align: center; margin: 40px 0 10px; font-size: 14px; }
.rgc-catalog-gated a { color: var(--rgc-muted); text-decoration: underline; margin: 0 10px; }
.rgc-catalog-gated a:hover { color: var(--rgc-primary); }