@import url("https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=Space+Grotesk:wght@600;700&display=swap");

:root {
  --ink: #171a18;
  --muted: #70766f;
  --paper: #f5f4ef;
  --panel: #ffffff;
  --line: #e6e5de;
  --dark: #151817;
  --orange: #ffad22;
  --orange-soft: #fff1d4;
  --lime: #caff3d;
  --green: #88bd28;
  --shadow: 0 20px 55px rgba(24, 30, 25, 0.08);
}

* { box-sizing: border-box; }
html { background: var(--paper); scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: "Manrope", system-ui, sans-serif; -webkit-font-smoothing: antialiased; }
button, input, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button:focus-visible, input:focus-visible, select:focus-visible { outline: 3px solid rgba(255, 173, 34, 0.35); outline-offset: 2px; }

.app-shell { min-height: 100vh; }
.workspace-v2 { min-height: 100vh; display: grid; grid-template-columns: 270px minmax(0, 1fr); }
.sidebar-v2 { position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; padding: 25px 18px 18px; color: #fff; background: var(--dark); overflow-y: auto; }
.sidebar-brand { padding: 0 10px 22px; border-bottom: 1px solid rgba(255,255,255,.08); }
.sidebar-brand p { margin: 13px 0 0; color: #929992; font-size: 10px; }
.logo { display: inline-flex; align-items: center; gap: 11px; color: inherit; }
.logo > span:last-child { display: grid; }
.logo b { font: 700 20px/1 "Space Grotesk", sans-serif; letter-spacing: -1px; }
.logo small { margin-top: 2px; color: var(--orange); font-size: 7px; font-weight: 800; letter-spacing: 4px; }
.logo-symbol { position: relative; width: 33px; height: 31px; display: block; }
.logo-symbol i { position: absolute; left: 1px; width: 30px; height: 10px; border: 3px solid currentColor; border-radius: 3px; transform: rotate(-5deg) skewX(-16deg); }
.logo-symbol i:nth-child(1) { top: 1px; color: var(--orange); }
.logo-symbol i:nth-child(2) { top: 10px; color: #fff; }
.logo-symbol i:nth-child(3) { top: 19px; color: #fff; }

.role-picker { margin: 22px 0 13px; padding: 0 6px; }
.role-picker > small { color: #697069; font-size: 7px; font-weight: 800; letter-spacing: 1.2px; }
.role-picker > div { display: grid; grid-template-columns: 1fr 1fr; gap: 5px; margin-top: 9px; }
.role-picker button { min-height: 30px; padding: 6px 4px; border: 1px solid rgba(255,255,255,.08); border-radius: 8px; color: #8f9690; background: rgba(255,255,255,.025); font-size: 8px; font-weight: 800; cursor: pointer; }
.role-picker button.active { color: #1b1f19; background: var(--orange); border-color: var(--orange); }

.module-nav { display: grid; gap: 4px; }
.module-nav button { position: relative; width: 100%; min-height: 43px; display: flex; align-items: center; gap: 11px; padding: 0 12px; border: 0; border-radius: 11px; color: #a0a7a1; background: transparent; font-size: 10px; font-weight: 700; text-align: left; cursor: pointer; transition: .2s ease; }
.module-nav button:hover { color: #fff; background: rgba(255,255,255,.05); }
.module-nav button.active { color: #fff; background: rgba(255,255,255,.08); }
.module-nav button.active svg { color: var(--orange); }
.module-nav button > i { position: absolute; right: 8px; width: 5px; height: 5px; border-radius: 50%; background: var(--orange); }

.sidebar-status { display: flex; gap: 10px; margin-top: auto; padding: 13px; border: 1px solid rgba(202,255,61,.12); border-radius: 13px; color: var(--lime); background: rgba(202,255,61,.04); }
.sidebar-status svg { flex: 0 0 auto; }
.sidebar-status div { display: grid; gap: 3px; }
.sidebar-status strong { color: #dce3db; font-size: 8px; }
.sidebar-status span { color: #777f78; font-size: 7px; line-height: 1.5; }
.sidebar-profile { display: flex; align-items: center; gap: 10px; margin-top: 12px; padding: 13px 7px 0; border-top: 1px solid rgba(255,255,255,.07); }
.avatar { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px; color: #222; background: var(--orange); font-size: 9px; font-weight: 900; }
.avatar.lime { flex: 0 0 auto; background: var(--lime); }
.sidebar-profile p { flex: 1; display: grid; gap: 2px; margin: 0; }
.sidebar-profile strong { font-size: 9px; }
.sidebar-profile small { color: #757c76; font-size: 7px; }
.sidebar-profile button { width: 30px; height: 30px; display: grid; place-items: center; border: 0; color: #7d847e; background: transparent; cursor: pointer; }

.main-v2 { min-width: 0; }
.page-v2 { max-width: 1260px; min-height: 100vh; margin: 0 auto; padding: 43px clamp(28px, 4.5vw, 72px) 70px; }
.page-title-v2 { min-height: 93px; display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; margin-bottom: 27px; }
.page-title-v2 > div > span { display: block; margin-bottom: 8px; color: #b27816; font-size: 8px; font-weight: 800; letter-spacing: 1.4px; }
.page-title-v2 h1 { max-width: 720px; margin: 0; font: 700 clamp(31px, 4vw, 46px)/.98 "Space Grotesk", sans-serif; letter-spacing: -2.2px; }
.page-title-v2 p { max-width: 660px; margin: 11px 0 0; color: var(--muted); font-size: 11px; line-height: 1.6; }
.primary-action, .secondary-action { min-height: 43px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 0 16px; border-radius: 11px; font-size: 9px; font-weight: 800; cursor: pointer; transition: transform .18s ease, box-shadow .18s ease; white-space: nowrap; }
.primary-action { border: 1px solid var(--orange); color: #1b1d1a; background: var(--orange); box-shadow: 0 10px 24px rgba(255,173,34,.2); }
.secondary-action { border: 1px solid var(--line); color: var(--ink); background: #fff; }
.primary-action:hover, .secondary-action:hover { transform: translateY(-1px); }
.primary-action.wide, .secondary-action.wide { width: 100%; }
.search-box { min-width: 260px; min-height: 42px; display: flex; align-items: center; gap: 9px; padding: 0 12px; border: 1px solid var(--line); border-radius: 11px; color: #899088; background: #fff; }
.search-box input { min-width: 0; flex: 1; border: 0; outline: 0; color: var(--ink); background: transparent; font-size: 9px; }

.customer-overview { display: grid; grid-template-columns: repeat(3, .72fr) 1.45fr; margin-bottom: 35px; border: 1px solid var(--line); border-radius: 18px; background: #fff; box-shadow: var(--shadow); overflow: hidden; }
.customer-overview > div, .customer-overview > aside { min-height: 92px; display: flex; align-items: center; gap: 12px; padding: 17px; }
.customer-overview > div + div { border-left: 1px solid var(--line); }
.overview-icon { width: 38px; height: 38px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 11px; color: #9d6a14; background: var(--orange-soft); }
.customer-overview p { display: grid; gap: 2px; margin: 0; }
.customer-overview strong { font-size: 19px; }
.customer-overview small { color: var(--muted); font-size: 8px; }
.customer-overview aside { color: #fff; background: var(--dark); }
.customer-overview aside > span { font-size: 23px; }
.customer-overview aside strong { font-size: 10px; }
.customer-overview aside small { color: #a4aba5; line-height: 1.4; }

.section-heading-v2 { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 16px; }
.section-heading-v2.top-gap { margin-top: 39px; }
.section-heading-v2 h2 { margin: 0 0 4px; font: 700 20px/1.1 "Space Grotesk", sans-serif; letter-spacing: -.6px; }
.section-heading-v2 p { margin: 0; color: var(--muted); font-size: 9px; }
.section-heading-v2 > button { display: flex; align-items: center; gap: 4px; border: 0; color: #785818; background: transparent; font-size: 9px; font-weight: 800; cursor: pointer; }

.wallet-grid-v2 { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 15px; }
.loyalty-card-v2 { position: relative; min-height: 310px; overflow: hidden; display: flex; flex-direction: column; padding: 21px; border: 0; border-radius: 22px; color: #fff; background: #1a1e1b; text-align: left; cursor: pointer; box-shadow: 0 17px 40px rgba(17,22,18,.16); transition: .22s ease; }
.loyalty-card-v2:hover { transform: translateY(-4px); box-shadow: 0 23px 48px rgba(17,22,18,.23); }
.loyalty-card-v2:after { content: ""; position: absolute; inset: 0; background: linear-gradient(140deg, color-mix(in srgb, var(--accent) 20%, transparent), transparent 48%); pointer-events: none; }
.card-glow { position: absolute; right: -95px; top: -100px; width: 230px; height: 230px; border-radius: 50%; background: var(--accent2); opacity: .25; filter: blur(3px); }
.loyalty-card-v2 > *:not(.card-glow) { position: relative; z-index: 1; }
.loyalty-card-v2 header { display: flex; align-items: center; justify-content: space-between; }
.loyalty-card-v2 header span { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 13px; color: #171a18; background: var(--accent); font-size: 10px; font-weight: 900; }
.loyalty-card-v2 header > i { padding: 5px 8px; border: 1px solid rgba(255,255,255,.15); border-radius: 20px; color: #b5bcb7; font-size: 7px; font-style: normal; font-weight: 800; text-transform: uppercase; }
.card-name { margin-top: 27px; }
.card-name small { color: #9ca49e; font-size: 7px; text-transform: uppercase; letter-spacing: .7px; }
.card-name h3 { margin: 5px 0 4px; font: 700 21px/1 "Space Grotesk", sans-serif; letter-spacing: -.7px; }
.card-name p { margin: 0; color: #aeb5af; font-size: 8px; }
.card-balance { display: flex; align-items: flex-end; justify-content: space-between; margin-top: auto; }
.card-balance p { display: flex; align-items: baseline; gap: 6px; margin: 0; }
.card-balance strong { font-size: 25px; }
.card-balance small { color: #9aa29c; font-size: 7px; }
.card-balance b { color: var(--accent); font-size: 8px; }
.card-track, .balance-track, .detail-track { height: 5px; overflow: hidden; border-radius: 20px; background: rgba(255,255,255,.12); }
.card-track { margin-top: 10px; }
.card-track i, .balance-track i, .detail-track i { display: block; height: 100%; border-radius: inherit; background: var(--accent); }
.loyalty-card-v2 footer { display: flex; align-items: center; justify-content: space-between; margin-top: 20px; color: #c9ceca; font-size: 8px; font-weight: 800; }
.loyalty-card-v2 footer > i { width: 27px; height: 27px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.16); border-radius: 50%; }

.offer-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.offer-card { position: relative; min-height: 210px; overflow: hidden; padding: 27px; border-radius: 20px; }
.offer-card:after { content: ""; position: absolute; right: -45px; bottom: -70px; width: 210px; height: 210px; border: 38px solid rgba(255,255,255,.13); border-radius: 50%; }
.offer-card.orange { color: #2b2318; background: linear-gradient(135deg,#ffad22,#ff7d34); }
.offer-card.dark { color: #fff; background: linear-gradient(135deg,#171b18,#29392b); }
.offer-card > * { position: relative; z-index: 1; }
.offer-card > span { font-size: 7px; font-weight: 900; letter-spacing: 1px; }
.offer-card h3 { max-width: 380px; margin: 12px 0 7px; font: 700 25px/1.05 "Space Grotesk", sans-serif; }
.offer-card p { margin: 0 0 23px; color: currentColor; opacity: .7; font-size: 9px; }
.offer-card button { min-height: 35px; padding: 0 13px; border: 0; border-radius: 9px; color: #fff; background: #1a1d1b; font-size: 8px; font-weight: 800; cursor: pointer; }
.offer-card.dark button { color: #1a1d1b; background: var(--lime); }

.filter-row { display: flex; gap: 7px; margin-bottom: 18px; overflow-x: auto; }
.filter-row button { min-height: 33px; padding: 0 13px; border: 1px solid var(--line); border-radius: 20px; color: var(--muted); background: #fff; font-size: 8px; font-weight: 700; cursor: pointer; white-space: nowrap; }
.filter-row button.active { color: #1d201d; background: var(--orange); border-color: var(--orange); }
.explore-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 14px; }
.business-tile { display: grid; grid-template-columns: 170px 1fr; min-height: 190px; overflow: hidden; border: 1px solid var(--line); border-radius: 20px; background: #fff; box-shadow: 0 12px 34px rgba(30,35,30,.05); }
.business-cover { position: relative; display: grid; place-items: center; background: linear-gradient(140deg,var(--accent),var(--accent2)); }
.business-cover:after { content:""; position:absolute; width:135px; height:135px; border:24px solid rgba(255,255,255,.16); border-radius:50%; }
.business-cover > span { position: relative; z-index: 1; font: 800 31px/1 "Space Grotesk",sans-serif; }
.business-cover > i { position: absolute; left: 12px; bottom: 12px; z-index: 1; padding: 5px 8px; border-radius: 20px; color: #fff; background: rgba(0,0,0,.22); font-size: 7px; font-style: normal; }
.business-info { padding: 21px; }
.business-info > small { display:flex; align-items:center; gap:4px; color:var(--muted); font-size:7px; }
.business-info h2 { margin: 9px 0 5px; font:700 18px/1.1 "Space Grotesk",sans-serif; }
.business-info > p { margin:0; color:var(--muted); font-size:8px; }
.business-info > div { display:flex; align-items:center; justify-content:space-between; gap:9px; margin-top:25px; }
.business-info > div > span { color:#9c6a15; font-size:7px; font-weight:800; text-transform:uppercase; }
.business-info button { display:flex; align-items:center; gap:4px; padding:7px 9px; border:0; border-radius:8px; color:#fff; background:var(--dark); font-size:7px; font-weight:800; cursor:pointer; }
.business-info button.joined { color:#607b20; background:#eff6da; }

.reward-hero { min-height: 220px; display:flex; align-items:center; justify-content:space-between; gap:30px; padding:32px 38px; border-radius:23px; color:#fff; background:linear-gradient(125deg,#171a18 10%,#252d25 62%,#684b18); box-shadow:var(--shadow); }
.reward-hero > div { max-width:620px; }
.reward-kicker { display:inline-flex; align-items:center; gap:6px; color:var(--orange); font-size:7px; font-weight:900; letter-spacing:1px; }
.reward-hero h2 { margin:14px 0 8px; font:700 27px/1.06 "Space Grotesk",sans-serif; }
.reward-hero p { margin:0; color:#9fa6a0; font-size:9px; line-height:1.55; }
.level-track { height:6px; margin:23px 0 7px; overflow:hidden; border-radius:20px; background:rgba(255,255,255,.1); }
.level-track i { display:block; width:80%; height:100%; border-radius:inherit; background:var(--orange); }
.reward-hero > div > small { color:#979e98; font-size:7px; }
.level-number { font:700 88px/1 "Space Grotesk",sans-serif; color:transparent; -webkit-text-stroke:1px rgba(255,173,34,.55); }
.reward-grid-v2 { display:grid; grid-template-columns:repeat(4,1fr); gap:13px; margin-top:15px; }
.reward-tile { min-height:220px; display:flex; flex-direction:column; padding:20px; border:1px solid var(--line); border-radius:18px; background:#fff; }
.reward-icon { width:38px; height:38px; display:grid; place-items:center; border-radius:11px; color:#1a1d1a; }
.reward-tile > small { margin-top:22px; color:var(--muted); font-size:7px; }
.reward-tile h3 { margin:6px 0; font:700 15px/1.15 "Space Grotesk",sans-serif; }
.reward-tile p { margin:0; color:#9d6b16; font-size:8px; font-weight:800; }
.reward-tile button { display:flex; align-items:center; justify-content:space-between; margin-top:auto; padding:9px 0 0; border:0; border-top:1px solid var(--line); color:var(--muted); background:transparent; font-size:8px; font-weight:800; cursor:pointer; }
.reward-tile button.ready { color:#5b7819; }

.activity-feed-v2 { max-width:850px; }
.activity-feed-v2 section { margin-bottom:25px; }
.activity-feed-v2 section > h3 { margin:0 0 7px; color:var(--muted); font-size:8px; text-transform:uppercase; letter-spacing:1px; }
.activity-line { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:13px; min-height:70px; padding:11px 15px; border:1px solid var(--line); border-bottom:0; background:#fff; }
.activity-line:nth-last-child(1) { border-bottom:1px solid var(--line); border-radius:0 0 13px 13px; }
.activity-line:nth-child(2) { border-radius:13px 13px 0 0; }
.activity-line:only-of-type { border-bottom:1px solid var(--line); border-radius:13px; }
.activity-line > span { width:37px; height:37px; display:grid; place-items:center; border-radius:11px; font-size:8px; font-weight:900; }
.activity-line p { display:grid; gap:3px; margin:0; }
.activity-line strong { font-size:9px; }
.activity-line small { color:var(--muted); font-size:7px; }
.activity-line > b { color:#5f7c1d; font-size:9px; }

.employee-chip { display:flex; align-items:center; gap:9px; padding:8px 12px; border:1px solid var(--line); border-radius:11px; background:#fff; }
.employee-chip > span { width:32px; height:32px; display:grid; place-items:center; border-radius:9px; background:var(--orange-soft); color:#9b6914; font-size:8px; font-weight:900; }
.employee-chip p { display:grid; gap:2px; margin:0; }
.employee-chip strong { font-size:8px; }
.employee-chip small { color:var(--muted); font-size:7px; }
.scanner-v2 { min-height:455px; display:grid; grid-template-columns:1.15fr .85fr; overflow:hidden; border:1px solid var(--line); border-radius:24px; background:#fff; box-shadow:var(--shadow); }
.camera-v2 { position:relative; display:grid; place-items:center; overflow:hidden; color:rgba(202,255,61,.13); background:radial-gradient(circle at 50% 45%,#354039,#181c19 65%); }
.camera-v2 > svg { opacity:.24; }
.camera-v2 > span { position:absolute; left:20px; bottom:18px; display:flex; align-items:center; gap:6px; color:#aab1ab; font-size:8px; }
.camera-v2 > span > i { width:6px; height:6px; border-radius:50%; background:var(--lime); box-shadow:0 0 0 4px rgba(202,255,61,.1); }
.scan-frame-v2 { position:absolute; z-index:2; width:240px; height:240px; }
.scan-frame-v2 > i { position:absolute; width:42px; height:42px; border-color:var(--orange); border-style:solid; }
.scan-frame-v2 > i:nth-child(1){left:0;top:0;border-width:3px 0 0 3px;border-radius:12px 0 0}
.scan-frame-v2 > i:nth-child(2){right:0;top:0;border-width:3px 3px 0 0;border-radius:0 12px 0 0}
.scan-frame-v2 > i:nth-child(3){left:0;bottom:0;border-width:0 0 3px 3px;border-radius:0 0 0 12px}
.scan-frame-v2 > i:nth-child(4){right:0;bottom:0;border-width:0 3px 3px 0;border-radius:0 0 12px}
.scan-frame-v2 > div { position:absolute; left:10px; right:10px; top:50%; height:2px; background:var(--orange); box-shadow:0 0 15px var(--orange); animation:scan 2.3s ease-in-out infinite; }
@keyframes scan { 0%,100%{transform:translateY(-95px);opacity:.55}50%{transform:translateY(95px);opacity:1} }
.scanner-actions-v2 { display:flex; flex-direction:column; justify-content:center; padding:42px; text-align:center; }
.secure-label { display:inline-flex; align-items:center; align-self:center; gap:5px; color:#728a3b; font-size:7px; font-weight:800; }
.scanner-actions-v2 h2 { margin:15px 0 8px; font:700 23px/1.08 "Space Grotesk",sans-serif; }
.scanner-actions-v2 > p { max-width:340px; margin:0 auto 25px; color:var(--muted); font-size:9px; line-height:1.55; }
.divider { position:relative; margin:20px 0; border-top:1px solid var(--line); }
.divider span { position:absolute; left:50%; top:50%; padding:0 8px; color:#9da29d; background:#fff; font-size:8px; transform:translate(-50%,-50%); }
.manual-search { display:flex; align-items:center; gap:7px; padding:5px 5px 5px 10px; border:1px solid var(--line); border-radius:10px; color:#8a918a; }
.manual-search input { min-width:0; flex:1; border:0; outline:0; font-size:8px; }
.manual-search button { padding:8px 11px; border:0; border-radius:7px; color:#fff; background:var(--dark); font-size:7px; font-weight:800; cursor:pointer; }

.member-top { display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.member-top button { border:0; color:var(--muted); background:transparent; font-size:9px; font-weight:700; cursor:pointer; }
.member-top span { display:flex; align-items:center; gap:5px; padding:6px 9px; border-radius:20px; color:#66821d; background:#ecf5d2; font-size:7px; font-weight:800; }
.member-profile-v2 { display:flex; align-items:center; gap:14px; padding:18px; border:1px solid var(--line); border-radius:17px; background:#fff; }
.member-avatar-v2 { width:54px; height:54px; display:grid; place-items:center; flex:0 0 auto; border-radius:15px; background:var(--lime); font-size:13px; font-weight:900; }
.member-profile-v2 > p { display:grid; gap:3px; margin:0; }
.member-profile-v2 > p small { color:#829c38; font-size:7px; font-weight:800; }
.member-profile-v2 h1 { margin:0; font:700 21px/1.1 "Space Grotesk",sans-serif; }
.member-profile-v2 > p span, .member-profile-v2 > div small { color:var(--muted); font-size:7px; }
.member-profile-v2 > div { margin-left:auto; display:grid; gap:3px; text-align:right; }
.member-profile-v2 > div b { color:#66821d; font-size:8px; }
.member-workspace-v2 { display:grid; grid-template-columns:1.35fr .65fr; gap:15px; margin-top:15px; }
.operation-v2, .balance-panel-v2 { padding:22px; border:1px solid var(--line); border-radius:18px; background:#fff; }
.operation-v2 > header { display:flex; align-items:center; gap:10px; }
.operation-v2 > header > span { width:38px; height:38px; display:grid; place-items:center; border-radius:11px; color:#8b6118; background:var(--orange-soft); }
.operation-v2 header p { display:grid; gap:3px; margin:0; }
.operation-v2 header strong { font-size:11px; }
.operation-v2 header small { color:var(--muted); font-size:8px; }
.field-label-v2 { display:block; margin:23px 0 8px; color:var(--muted); font-size:7px; font-weight:800; text-transform:uppercase; letter-spacing:.8px; }
.program-selector-v2 { display:grid; grid-template-columns:repeat(3,1fr); gap:7px; }
.program-selector-v2 button { position:relative; min-height:61px; display:flex; align-items:center; gap:8px; padding:9px; border:1px solid var(--line); border-radius:10px; background:#fff; text-align:left; cursor:pointer; }
.program-selector-v2 button.active { border-color:var(--orange); box-shadow:0 0 0 2px rgba(255,173,34,.14); }
.program-selector-v2 button > span { width:33px; height:33px; display:grid; place-items:center; flex:0 0 auto; border-radius:9px; font-size:7px; font-weight:900; }
.program-selector-v2 button p { display:grid; gap:2px; margin:0; }
.program-selector-v2 strong { font-size:8px; }
.program-selector-v2 small { color:var(--muted); font-size:6px; }
.program-selector-v2 button > i { position:absolute; right:7px; top:7px; width:8px; height:8px; border:1px solid #ccd0cb; border-radius:50%; }
.program-selector-v2 button.active > i { border:3px solid var(--orange); }
.operation-fields { display:grid; grid-template-columns:1fr 1fr; gap:9px; margin-top:18px; }
.operation-fields > label { display:grid; gap:6px; color:var(--muted); font-size:7px; font-weight:700; }
.operation-fields input { width:100%; min-height:37px; padding:0 10px; border:1px solid var(--line); border-radius:9px; outline:0; font-size:8px; }
.operation-fields label > div { display:flex; border:1px solid var(--line); border-radius:9px; overflow:hidden; }
.operation-fields label > div span { display:grid; place-items:center; padding:0 10px; color:#9c6c19; background:var(--orange-soft); font-size:8px; font-weight:800; }
.operation-fields label > div input { border:0; border-radius:0; }
.earning-preview { display:flex; align-items:center; justify-content:space-between; margin:13px 0; padding:11px 13px; border-radius:9px; background:#f5f6f2; font-size:8px; }
.earning-preview strong { color:#7a981f; }
.selected-brand { display:flex; align-items:center; gap:9px; }
.selected-brand > span { width:39px; height:39px; display:grid; place-items:center; border-radius:11px; font-size:8px; font-weight:900; }
.selected-brand p { display:grid; gap:3px; margin:0; }
.selected-brand small { color:var(--muted); font-size:7px; }
.selected-brand strong { font-size:9px; }
.large-balance { display:flex; align-items:baseline; gap:5px; margin-top:31px; font:700 49px/1 "Space Grotesk",sans-serif; }
.large-balance small { color:var(--muted); font:600 8px/1 "Manrope",sans-serif; }
.balance-track { margin:12px 0; background:#edf0ea; }
.goal-copy { display:grid; gap:4px; margin:0 0 23px; color:var(--muted); font-size:7px; }
.goal-copy strong { color:var(--ink); font-size:9px; }
.audit-note { display:flex; gap:6px; margin-top:15px; padding-top:14px; border-top:1px solid var(--line); color:var(--muted); font-size:7px; line-height:1.5; }

.customer-list-v2 { display:grid; gap:7px; }
.customer-list-v2 > button { display:grid; grid-template-columns:auto 1fr auto auto auto; align-items:center; gap:13px; min-height:66px; padding:10px 15px; border:1px solid var(--line); border-radius:13px; color:var(--ink); background:#fff; text-align:left; cursor:pointer; }
.customer-list-v2 > button > span { width:37px; height:37px; display:grid; place-items:center; border-radius:10px; background:var(--orange-soft); font-size:8px; font-weight:900; }
.customer-list-v2 p { display:grid; gap:3px; margin:0; }
.customer-list-v2 strong { font-size:9px; }
.customer-list-v2 small { color:var(--muted); font-size:7px; }
.customer-list-v2 button > i { padding:5px 8px; border-radius:20px; color:#617d1d; background:#eef5d9; font-size:7px; font-style:normal; }
.customer-list-v2 button > b { font-size:8px; }
.voucher-validator { max-width:700px; margin:40px auto 0; padding:42px; border:1px solid var(--line); border-radius:23px; background:#fff; box-shadow:var(--shadow); text-align:center; }
.voucher-validator > span { width:66px; height:66px; display:grid; place-items:center; margin:0 auto; border-radius:20px; color:#9d6c18; background:var(--orange-soft); }
.voucher-validator h2 { margin:17px 0 7px; font:700 24px/1.1 "Space Grotesk",sans-serif; }
.voucher-validator > p { max-width:470px; margin:0 auto 24px; color:var(--muted); font-size:9px; line-height:1.5; }
.voucher-validator > label { display:flex; gap:7px; max-width:480px; margin:0 auto; }
.voucher-validator input { min-width:0; flex:1; padding:0 14px; border:1px solid var(--line); border-radius:10px; outline:0; font-size:10px; letter-spacing:1px; }
.voucher-validator label button { min-height:42px; padding:0 16px; border:0; border-radius:10px; color:#1b1d1b; background:var(--orange); font-size:8px; font-weight:800; cursor:pointer; }
.security-row { display:flex; justify-content:center; gap:18px; margin-top:27px; padding-top:20px; border-top:1px solid var(--line); }
.security-row span { display:flex; align-items:center; gap:5px; color:var(--muted); font-size:7px; }

.branch-select-v2 { display:flex; align-items:center; gap:8px; padding:9px 11px; border:1px solid var(--line); border-radius:10px; color:#a4721a; background:#fff; }
.branch-select-v2 select { border:0; outline:0; background:transparent; font-size:8px; font-weight:800; }
.metric-grid-v2, .network-metrics { display:grid; grid-template-columns:repeat(4,1fr); gap:11px; }
.metric-grid-v2 article, .network-metrics article { min-height:106px; display:flex; align-items:center; gap:12px; padding:16px; border:1px solid var(--line); border-radius:16px; background:#fff; }
.metric-grid-v2 article > span, .network-metrics article > span { width:39px; height:39px; display:grid; place-items:center; flex:0 0 auto; border-radius:11px; }
.metric-grid-v2 .green{color:#66831c;background:#eef6d8}.metric-grid-v2 .orange{color:#ad7015;background:#fff0d5}.metric-grid-v2 .purple{color:#785ca5;background:#f0eaf8}.metric-grid-v2 .blue{color:#37799d;background:#e7f3f8}
.metric-grid-v2 p, .network-metrics p { display:grid; gap:3px; margin:0; }
.metric-grid-v2 small, .network-metrics small { color:var(--muted); font-size:7px; }
.metric-grid-v2 strong, .network-metrics strong { font:700 22px/1 "Space Grotesk",sans-serif; }
.metric-grid-v2 b, .network-metrics b { color:#6d891f; font-size:7px; }
.dashboard-grid-v2 { display:grid; grid-template-columns:1.6fr .75fr; gap:12px; margin-top:12px; }
.dashboard-grid-v2.bottom { grid-template-columns:1.4fr .95fr; }
.analytics-card-v2, .recent-ops, .program-summary-v2, .network-chart, .city-ranking { padding:20px; border:1px solid var(--line); border-radius:18px; background:#fff; }
.analytics-card-v2 > header, .recent-ops > header, .network-chart > header, .city-ranking > header { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; }
.analytics-card-v2 h2, .recent-ops h2, .network-chart h2, .city-ranking h2 { margin:0 0 4px; font:700 15px/1.1 "Space Grotesk",sans-serif; }
.analytics-card-v2 p, .recent-ops header p, .network-chart header p, .city-ranking header p { margin:0; color:var(--muted); font-size:7px; }
.analytics-card-v2 header button, .recent-ops header button { display:flex; align-items:center; gap:4px; border:0; color:var(--muted); background:transparent; font-size:7px; font-weight:700; cursor:pointer; }
.bar-chart-v2 { height:205px; display:flex; align-items:flex-end; gap:12px; margin-top:22px; padding:0 3px 20px; border-bottom:1px solid var(--line); background:repeating-linear-gradient(to bottom,transparent 0,transparent 48px,#f0f0eb 49px); }
.bar-chart-v2 > div { height:100%; flex:1; display:flex; flex-direction:column; justify-content:flex-end; align-items:center; }
.bar-chart-v2 i { width:min(28px,70%); min-height:9px; border-radius:7px 7px 2px 2px; background:#e8d9b9; }
.bar-chart-v2 i.peak { background:var(--orange); }
.bar-chart-v2 span { margin-bottom:-18px; color:var(--muted); font-size:7px; }
.checa-card { display:flex; flex-direction:column; padding:22px; border-radius:18px; color:#fff; background:linear-gradient(145deg,#171a18,#334229); }
.checa-card > span { display:flex; align-items:center; gap:5px; color:var(--lime); font-size:7px; font-weight:900; letter-spacing:.7px; }
.checa-card h2 { margin:20px 0 9px; font:700 21px/1.08 "Space Grotesk",sans-serif; }
.checa-card p { margin:0; color:#a4aca5; font-size:8px; line-height:1.6; }
.checa-card button { margin-top:auto; min-height:36px; border:0; border-radius:9px; color:#1c211a; background:var(--lime); font-size:7px; font-weight:900; cursor:pointer; }
.checa-card small { margin-top:10px; color:#727a73; font-size:6px; text-align:center; }
.recent-ops > div { display:grid; grid-template-columns:auto 1fr auto auto; align-items:center; gap:10px; min-height:52px; border-top:1px solid var(--line); }
.recent-ops > div:first-of-type { margin-top:12px; }
.recent-ops > div > span { width:30px; height:30px; display:grid; place-items:center; border-radius:9px; background:var(--orange-soft); font-size:7px; font-weight:900; }
.recent-ops > div p { display:grid; gap:2px; margin:0; }
.recent-ops > div strong { font-size:8px; }
.recent-ops > div small, .recent-ops time { color:var(--muted); font-size:7px; }
.recent-ops > div b { color:#69861c; font-size:7px; }
.program-summary-v2 { color:#fff; background:var(--dark); border:0; }
.program-summary-v2 header { display:flex; align-items:center; gap:10px; margin-bottom:18px; padding-bottom:17px; border-bottom:1px solid rgba(255,255,255,.1); }
.program-summary-v2 header > span { width:39px; height:39px; display:grid; place-items:center; border-radius:11px; color:#1d1f1c; background:#ff713b; font-weight:900; }
.program-summary-v2 header p { display:grid; gap:3px; margin:0; }
.program-summary-v2 header small { color:#878f88; font-size:6px; }
.program-summary-v2 header strong { font-size:10px; }
.program-summary-v2 > div { display:flex; align-items:center; justify-content:space-between; padding:10px 0; border-bottom:1px solid rgba(255,255,255,.07); }
.program-summary-v2 > div span { color:#858d87; font-size:7px; }
.program-summary-v2 > div b { font-size:8px; }
.program-summary-v2 > button { width:100%; display:flex; align-items:center; justify-content:space-between; margin-top:16px; padding:10px 12px; border:1px solid rgba(255,255,255,.12); border-radius:9px; color:#fff; background:rgba(255,255,255,.04); font-size:7px; font-weight:800; cursor:pointer; }

.program-grid-v2 { display:grid; grid-template-columns:repeat(3,1fr); gap:13px; }
.program-manage-card, .new-program-tile { min-height:250px; padding:21px; border:1px solid var(--line); border-radius:18px; background:#fff; }
.program-manage-card > header { display:flex; align-items:center; gap:10px; }
.program-logo { width:41px; height:41px; display:grid; place-items:center; border-radius:12px; font-weight:900; }
.program-logo.orange { background:#ff713b; }.program-logo.green { background:var(--lime); }
.program-manage-card header p { display:grid; gap:3px; margin:0; }
.program-manage-card header small { color:var(--muted); font-size:7px; }
.program-manage-card header strong { font-size:10px; }
.program-manage-card header > i { margin-left:auto; padding:5px 8px; border-radius:20px; color:#65811d; background:#edf5d6; font-size:7px; font-style:normal; }
.program-manage-card > p { min-height:36px; margin:20px 0; color:var(--muted); font-size:8px; line-height:1.5; }
.program-stats { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.program-stats span { display:grid; gap:3px; padding:11px; border-radius:9px; background:#f5f6f2; }
.program-stats small { color:var(--muted); font-size:6px; }.program-stats b { font-size:12px; }
.program-manage-card > button { width:100%; min-height:35px; margin-top:17px; border:1px solid var(--line); border-radius:9px; background:#fff; font-size:7px; font-weight:800; cursor:pointer; }
.new-program-tile { display:grid; place-items:center; border:1px dashed #c6c7c0; color:var(--muted); background:transparent; text-align:center; cursor:pointer; }
.new-program-tile > div { display:grid; justify-items:center; gap:7px; }
.new-program-tile span { width:42px; height:42px; display:grid; place-items:center; border-radius:50%; color:#9a6916; background:var(--orange-soft); }
.new-program-tile strong { color:var(--ink); font-size:10px; }.new-program-tile small { max-width:160px; font-size:7px; line-height:1.5; }

.crm-toolbar { display:flex; align-items:center; gap:7px; margin-bottom:13px; }
.crm-toolbar .search-box { flex:1; }
.crm-toolbar > button { min-height:40px; display:flex; align-items:center; gap:6px; padding:0 12px; border:1px solid var(--line); border-radius:10px; background:#fff; font-size:7px; font-weight:800; cursor:pointer; }
.insight-row { display:grid; grid-template-columns:repeat(4,1fr); gap:9px; margin-bottom:13px; }
.insight-row article { display:flex; align-items:center; gap:10px; padding:14px; border:1px solid var(--line); border-radius:13px; background:#fff; }
.insight-row article > span { font-size:21px; }.insight-row p { display:grid; gap:3px; margin:0; }
.insight-row strong { font-size:9px; }.insight-row small { color:var(--muted); font-size:6px; }
.data-table-v2 { overflow:hidden; border:1px solid var(--line); border-radius:15px; background:#fff; }
.data-table-v2 > header, .data-table-v2 > div { display:grid; grid-template-columns:2fr .9fr .55fr .8fr .75fr 30px; align-items:center; gap:10px; min-height:57px; padding:0 15px; }
.data-table-v2 > header { min-height:40px; color:var(--muted); background:#f1f2ee; font-size:7px; font-weight:800; text-transform:uppercase; }
.data-table-v2 > div { border-top:1px solid var(--line); font-size:8px; }
.table-person { display:flex; align-items:center; gap:9px; }
.table-person > i { width:33px; height:33px; display:grid; place-items:center; flex:0 0 auto; border-radius:9px; background:var(--orange-soft); font-size:7px; font-style:normal; font-weight:900; }
.table-person p { display:grid; gap:2px; margin:0; }.table-person strong { font-size:8px; }.table-person small { color:var(--muted); font-size:6px; }
.data-table-v2 .segment, .status-pill { display:inline-block; width:max-content; padding:5px 7px; border-radius:20px; color:#657e23; background:#eef4da; font-size:6px; font-style:normal; font-weight:800; }
.data-table-v2 .segment.vip { color:#805d18; background:#fff0cd; }.data-table-v2 .segment.nueva { color:#3f7390; background:#e6f2f7; }.data-table-v2 .segment.por-recuperar { color:#9b553f; background:#fae9e4; }
.data-table-v2 button { width:27px; height:27px; display:grid; place-items:center; border:0; color:var(--muted); background:transparent; cursor:pointer; }

.campaign-hero { min-height:205px; display:grid; grid-template-columns:1.4fr .55fr; gap:25px; align-items:center; padding:30px 34px; border-radius:22px; color:#fff; background:linear-gradient(125deg,#171a18,#2b352d); }
.campaign-hero > div > span { display:flex; align-items:center; gap:5px; color:var(--lime); font-size:7px; font-weight:900; }
.campaign-hero h2 { margin:14px 0 8px; font:700 25px/1.08 "Space Grotesk",sans-serif; }.campaign-hero p { max-width:560px; margin:0; color:#9fa6a0; font-size:8px; line-height:1.5; }
.campaign-hero button { margin-top:19px; padding:10px 13px; border:0; border-radius:9px; background:var(--lime); font-size:7px; font-weight:900; cursor:pointer; }
.campaign-hero aside { display:grid; gap:6px; padding:20px; border:1px solid rgba(255,255,255,.1); border-radius:16px; background:rgba(255,255,255,.04); }.campaign-hero aside small,.campaign-hero aside span { color:#8f9791; font-size:7px; }.campaign-hero aside strong { font:700 24px/1 "Space Grotesk",sans-serif; }
.campaign-list-v2 { display:grid; gap:7px; }
.campaign-list-v2 article { display:grid; grid-template-columns:auto 1.4fr .7fr .7fr auto 28px; align-items:center; gap:11px; min-height:65px; padding:10px 13px; border:1px solid var(--line); border-radius:13px; background:#fff; }
.campaign-list-v2 article > span { width:36px; height:36px; display:grid; place-items:center; border-radius:10px; color:#9b6b16; background:var(--orange-soft); }
.campaign-list-v2 p,.campaign-list-v2 div { display:grid; gap:3px; margin:0; }.campaign-list-v2 strong,.campaign-list-v2 b { font-size:8px; }.campaign-list-v2 small { color:var(--muted); font-size:6px; }
.campaign-list-v2 article > i { padding:5px 8px; border-radius:20px; color:#607b20; background:#eef5d8; font-size:6px; font-style:normal; font-weight:800; }
.campaign-list-v2 button { border:0; color:var(--muted); background:transparent; cursor:pointer; }

.two-column-v2 { display:grid; grid-template-columns:1.25fr .75fr; gap:15px; }
.two-column-v2 > section,.two-column-v2 > aside { padding:20px; border:1px solid var(--line); border-radius:18px; background:#fff; }
.team-list-v2,.branch-list-v2 { display:grid; gap:7px; }
.team-list-v2 article,.branch-list-v2 article { display:flex; align-items:center; gap:10px; min-height:57px; padding:9px 0; border-top:1px solid var(--line); }
.team-list-v2 article > span { position:relative; width:35px; height:35px; display:grid; place-items:center; flex:0 0 auto; border-radius:10px; background:var(--orange-soft); font-size:7px; font-weight:900; }
.team-list-v2 article > span i { position:absolute; right:-1px; bottom:-1px; width:8px; height:8px; border:2px solid #fff; border-radius:50%; background:#bbc0bb; }.team-list-v2 article > span i.online { background:#76ad29; }
.team-list-v2 p,.branch-list-v2 p { flex:1; display:grid; gap:3px; margin:0; }.team-list-v2 strong,.branch-list-v2 strong { font-size:8px; }.team-list-v2 small,.branch-list-v2 small { color:var(--muted); font-size:6px; }
.team-list-v2 article > i,.branch-list-v2 article > i { color:var(--muted); font-size:7px; font-style:normal; }.team-list-v2 button { border:0; color:var(--muted); background:transparent; cursor:pointer; }
.branch-list-v2 article > span { width:35px; height:35px; display:grid; place-items:center; border-radius:10px; color:#66821e; background:#eef4dc; }

.integration-feature { min-height:270px; display:grid; grid-template-columns:auto 1.35fr .75fr; gap:24px; align-items:center; padding:31px; border:1px solid var(--line); border-radius:22px; background:#fff; box-shadow:var(--shadow); }
.integration-logo { width:66px; height:66px; display:grid; place-items:center; border-radius:19px; color:#fff; background:linear-gradient(145deg,#ffad22,#ff713b); font:700 29px/1 "Space Grotesk",sans-serif; }
.integration-feature > div:nth-child(2) > span { color:#a16d13; font-size:7px; font-weight:900; letter-spacing:.8px; }.integration-feature h2 { margin:7px 0; font:700 24px/1.08 "Space Grotesk",sans-serif; }.integration-feature p { max-width:610px; margin:0; color:var(--muted); font-size:8px; line-height:1.5; }
.integration-feature ul { display:grid; gap:6px; margin:14px 0; padding:0; list-style:none; }.integration-feature li { display:flex; align-items:center; gap:6px; font-size:7px; }.integration-feature li svg { color:#719022; }
.integration-feature > div > button { padding:10px 13px; border:0; border-radius:9px; background:var(--orange); font-size:7px; font-weight:900; cursor:pointer; }
.integration-feature > aside { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:7px; padding:18px; border-radius:15px; color:#fff; background:var(--dark); }.integration-feature aside > span { display:grid; justify-items:center; gap:7px; font-size:7px; text-align:center; }.integration-feature aside > span i { width:38px; height:38px; border:1px solid rgba(255,255,255,.14); border-radius:11px; background:linear-gradient(145deg,#ff713b,#ffad22); }.integration-feature aside > span:nth-of-type(2) i { background:linear-gradient(145deg,#b9ee35,#538c2f); }.integration-feature aside > small { grid-column:1/-1; margin-top:8px; color:var(--lime); font-size:6px; text-align:center; }
.integration-grid-v2 { display:grid; grid-template-columns:repeat(3,1fr); gap:11px; margin-top:13px; }.integration-grid-v2 article { display:flex; align-items:center; gap:11px; padding:16px; border:1px solid var(--line); border-radius:14px; background:#fff; }.integration-icon { width:37px; height:37px; display:grid; place-items:center; flex:0 0 auto; border-radius:10px; }.integration-icon.whatsapp{color:#32855b;background:#e4f5eb}.integration-icon.api{color:#6b58a0;background:#eee9f8}.integration-icon.analytics{color:#a16c16;background:var(--orange-soft)}
.integration-grid-v2 p { flex:1; display:grid; gap:3px; margin:0; }.integration-grid-v2 strong { font-size:8px; }.integration-grid-v2 small { color:var(--muted); font-size:6px; }.integration-grid-v2 article > i { color:var(--muted); font-size:6px; font-style:normal; }.integration-grid-v2 article > i.active { color:#68831f; }

.network-metrics article > span { color:#996a18; background:var(--orange-soft); }.platform-grid { display:grid; grid-template-columns:1.6fr .7fr; gap:12px; margin-top:12px; }
.network-chart > header > span { color:var(--muted); font-size:7px; }.line-chart-mock { margin-top:22px; }.line-chart-mock svg { width:100%; height:200px; }.line-chart-mock > div { display:flex; justify-content:space-between; margin-top:5px; color:var(--muted); font-size:6px; }
.city-ranking > div { margin-top:24px; }.city-ranking > div p { display:flex; justify-content:space-between; margin:0 0 7px; font-size:8px; }.city-ranking > div p span { color:var(--muted); }.city-ranking > div > i { display:block; height:5px; overflow:hidden; border-radius:20px; background:#eef0eb; }.city-ranking > div > i b { display:block; height:100%; border-radius:inherit; }
.business-quick-list { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }.business-quick-list article { display:flex; align-items:center; gap:9px; padding:14px; border:1px solid var(--line); border-radius:13px; background:#fff; }.business-quick-list article > span { width:35px; height:35px; display:grid; place-items:center; flex:0 0 auto; border-radius:10px; font-size:7px; font-weight:900; }.business-quick-list p { flex:1; display:grid; gap:3px; margin:0; }.business-quick-list strong { font-size:8px; }.business-quick-list small { color:var(--muted); font-size:6px; }.business-quick-list article > i { color:#627d20; font-size:6px; font-style:normal; }.business-quick-list button { border:0; color:var(--muted); background:transparent; cursor:pointer; }

.business-table > header,.business-table > div { grid-template-columns:1.8fr .75fr .55fr .45fr .7fr 30px; }
.plan-grid-v2 { display:grid; grid-template-columns:repeat(3,1fr); gap:13px; }
.plan-card-v2 { min-height:330px; display:flex; flex-direction:column; padding:25px; border:1px solid var(--line); border-radius:20px; background:#fff; }.plan-card-v2.lime { background:#edffb8; border-color:#d3ef7d; }.plan-card-v2.dark { color:#fff; background:var(--dark); border-color:var(--dark); }
.plan-card-v2 > span { width:max-content; padding:5px 8px; border-radius:20px; color:#8f651b; background:var(--orange-soft); font-size:7px; font-weight:900; }.plan-card-v2.lime > span { color:#476311; background:#d4f46e; }.plan-card-v2.dark > span { color:var(--lime); background:rgba(202,255,61,.1); }
.plan-card-v2 h2 { margin:20px 0 5px; font:700 35px/1 "Space Grotesk",sans-serif; }.plan-card-v2 h2 small { font:600 8px/1 "Manrope",sans-serif; opacity:.6; }.plan-card-v2 > p { margin:0; color:var(--muted); font-size:8px; }.plan-card-v2.dark > p { color:#929992; }
.plan-card-v2 ul { display:grid; gap:10px; margin:24px 0; padding:0; list-style:none; }.plan-card-v2 li { display:flex; align-items:center; gap:7px; font-size:8px; }.plan-card-v2 li svg { color:#6e8b20; }.plan-card-v2 footer { display:flex; align-items:center; gap:5px; margin-top:auto; padding-top:16px; border-top:1px solid currentColor; border-color:rgba(120,125,120,.18); }.plan-card-v2 footer strong { font-size:15px; }.plan-card-v2 footer span { flex:1; color:var(--muted); font-size:7px; }.plan-card-v2 footer button { border:0; color:inherit; background:transparent; cursor:pointer; }
.revenue-projection { display:flex; align-items:center; justify-content:space-between; gap:25px; margin-top:13px; padding:27px 30px; border-radius:19px; color:#fff; background:linear-gradient(120deg,#8e6316,#ffad22); }.revenue-projection span { font-size:7px; font-weight:900; letter-spacing:1px; }.revenue-projection h2 { margin:8px 0 4px; font:700 20px/1.1 "Space Grotesk",sans-serif; }.revenue-projection p { margin:0; color:rgba(255,255,255,.7); font-size:7px; }.revenue-projection > strong { display:grid; gap:3px; font:700 31px/1 "Space Grotesk",sans-serif; text-align:right; }.revenue-projection > strong small { font:600 7px/1 "Manrope",sans-serif; opacity:.7; }

.security-dashboard { display:grid; grid-template-columns:.55fr 1.45fr; gap:13px; }.health-score,.security-checks { border:1px solid var(--line); border-radius:18px; background:#fff; }.health-score { min-height:300px; display:flex; flex-direction:column; align-items:center; justify-content:center; }.health-score > span { width:70px; height:70px; display:grid; place-items:center; border-radius:21px; color:#6c8a1f; background:#edf5d6; }.health-score strong { margin-top:15px; font:700 52px/1 "Space Grotesk",sans-serif; }.health-score small { color:var(--muted); font-size:7px; }.health-score > i { margin-top:11px; padding:6px 9px; border-radius:20px; color:#5e7a1d; background:#eef4dc; font-size:7px; font-style:normal; font-weight:800; }
.security-checks { padding:10px 20px; }.security-checks article { display:flex; align-items:center; gap:11px; min-height:68px; border-top:1px solid var(--line); }.security-checks article:first-child { border-top:0; }.security-checks article > span { width:34px; height:34px; display:grid; place-items:center; border-radius:10px; }.security-checks article > span.ok { color:#63811c; background:#edf5d7; }.security-checks article > span.pending { color:#aa7114; background:var(--orange-soft); }.security-checks article p { flex:1; display:grid; gap:3px; margin:0; }.security-checks article strong { font-size:8px; }.security-checks article small { color:var(--muted); font-size:7px; }.security-checks article > i { color:var(--muted); font-size:7px; font-style:normal; }
.audit-list-v2 { overflow:hidden; border:1px solid var(--line); border-radius:15px; background:#fff; }.audit-list-v2 > div { min-height:60px; display:flex; align-items:center; gap:11px; padding:10px 15px; border-top:1px solid var(--line); }.audit-list-v2 > div:first-child { border-top:0; }.audit-list-v2 > div > span { width:35px; height:35px; display:grid; place-items:center; border-radius:10px; color:#996a17; background:var(--orange-soft); }.audit-list-v2 p { flex:1; display:grid; gap:3px; margin:0; }.audit-list-v2 strong { font-size:8px; }.audit-list-v2 small,.audit-list-v2 time { color:var(--muted); font-size:7px; }
.settings-grid-v2 { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }.settings-grid-v2 button { min-height:130px; display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:11px; padding:18px; border:1px solid var(--line); border-radius:16px; color:var(--ink); background:#fff; text-align:left; cursor:pointer; }.settings-grid-v2 button:hover { border-color:#d1a54d; box-shadow:var(--shadow); }.settings-grid-v2 button > span { width:39px; height:39px; display:grid; place-items:center; border-radius:11px; color:#956616; background:var(--orange-soft); }.settings-grid-v2 p { display:grid; gap:4px; margin:0; }.settings-grid-v2 strong { font-size:9px; }.settings-grid-v2 small { color:var(--muted); font-size:7px; line-height:1.4; }

.modal-backdrop-v2 { position:fixed; inset:0; z-index:80; display:grid; place-items:center; padding:20px; background:rgba(11,14,12,.76); backdrop-filter:blur(8px); animation:fade .2s ease; }
@keyframes fade { from { opacity:0; } }
.card-detail-v2 { position:relative; width:min(560px,100%); max-height:calc(100vh - 35px); overflow-y:auto; border-radius:25px; background:#fff; box-shadow:0 32px 90px rgba(0,0,0,.35); }
.modal-close-v2 { position:absolute; right:15px; top:15px; z-index:3; width:34px; height:34px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.18); border-radius:50%; color:#fff; background:rgba(0,0,0,.2); cursor:pointer; }
.card-detail-v2 > header { position:relative; overflow:hidden; padding:26px; color:#fff; background:linear-gradient(140deg,#171a18,#242a25); }
.card-detail-v2 > header:after { content:""; position:absolute; right:-60px; top:-85px; width:220px; height:220px; border-radius:50%; background:var(--accent2); opacity:.25; }
.detail-brand { position:relative; z-index:1; display:flex; align-items:center; gap:10px; }.detail-brand > span { width:44px; height:44px; display:grid; place-items:center; border-radius:13px; color:#171a18; background:var(--accent); font-size:9px; font-weight:900; }.detail-brand p { display:grid; gap:3px; margin:0; }.detail-brand small { color:#a0a7a1; font-size:7px; }.detail-brand h2 { margin:0; font:700 17px/1 "Space Grotesk",sans-serif; }
.card-detail-v2 > header > i { position:absolute; right:58px; top:30px; z-index:1; padding:5px 8px; border:1px solid rgba(255,255,255,.15); border-radius:20px; color:#b6bdb7; font-size:7px; font-style:normal; text-transform:uppercase; }
.detail-balance { position:relative; z-index:1; display:grid; gap:2px; margin-top:29px; }.detail-balance > small { color:#a4aba5; font-size:7px; }.detail-balance > strong { font:700 40px/1 "Space Grotesk",sans-serif; }.detail-balance > strong span { margin-left:6px; color:#9ea59f; font:600 8px/1 "Manrope",sans-serif; }
.detail-track { position:relative; z-index:1; margin-top:16px; }.detail-goal { position:relative; z-index:1; display:flex; justify-content:space-between; margin:7px 0 0; color:#9da49e; font-size:7px; }.detail-goal b { color:#d8ddd9; }
.detail-body { display:grid; grid-template-columns:160px 1fr; gap:22px; align-items:center; padding:25px; }.qr-block-v2 { padding:13px; border:1px solid var(--line); border-radius:14px; box-shadow:0 10px 25px rgba(22,27,23,.07); }.qr-block-v2 > span { display:block; margin-top:8px; color:var(--muted); font-size:6px; letter-spacing:.9px; text-align:center; }.qr-pattern { display:grid; grid-template-columns:repeat(13,1fr); gap:2px; aspect-ratio:1; padding:4px; background:#fff; }.qr-pattern i { border-radius:1px; }.qr-pattern i.on { background:#171a18; }
.qr-copy { display:grid; align-content:center; }.qr-copy > span { display:flex; align-items:center; gap:5px; color:#66821d; font-size:7px; font-weight:800; }.qr-copy > span i { width:6px; height:6px; border-radius:50%; background:#78a329; }.qr-copy h3 { margin:10px 0 6px; font:700 17px/1.1 "Space Grotesk",sans-serif; }.qr-copy p { margin:0; color:var(--muted); font-size:8px; line-height:1.5; }.qr-copy button { width:max-content; display:flex; align-items:center; gap:5px; margin-top:13px; padding:8px 10px; border:1px solid var(--line); border-radius:8px; background:#fff; font-size:7px; font-weight:800; cursor:pointer; }
.next-reward-v2 { display:flex; align-items:center; gap:10px; margin:0 25px 20px; padding:14px; border-radius:13px; background:#f3f5ee; }.next-reward-v2 > span { width:36px; height:36px; display:grid; place-items:center; border-radius:10px; color:#996a16; background:var(--orange-soft); }.next-reward-v2 p { flex:1; display:grid; gap:3px; margin:0; }.next-reward-v2 small { color:var(--muted); font-size:6px; }.next-reward-v2 strong { font-size:9px; }.next-reward-v2 button { display:flex; align-items:center; gap:4px; border:0; color:#795816; background:transparent; font-size:7px; font-weight:800; cursor:pointer; }
.card-detail-v2 > footer { display:grid; grid-template-columns:1fr 1fr; border-top:1px solid var(--line); }.card-detail-v2 > footer button { min-height:52px; display:flex; align-items:center; justify-content:center; gap:7px; border:0; color:var(--ink); background:#fff; font-size:8px; font-weight:800; cursor:pointer; }.card-detail-v2 > footer button + button { border-left:1px solid var(--line); }
.toast-v2 { position:fixed; z-index:100; left:50%; bottom:24px; display:flex; align-items:center; gap:9px; padding:8px 15px 8px 8px; border:1px solid rgba(255,255,255,.12); border-radius:30px; color:#fff; background:#171a18; box-shadow:0 18px 45px rgba(0,0,0,.3); font-size:8px; font-weight:800; transform:translateX(-50%); animation:toastin .25s ease; }.toast-v2 span { width:27px; height:27px; display:grid; place-items:center; border-radius:50%; color:#1c2119; background:var(--lime); }
@keyframes toastin { from { opacity:0; transform:translate(-50%,8px); } }

.mobile-header,.mobile-role-picker { display:none; }

@media (max-width: 1080px) {
  .workspace-v2 { grid-template-columns:225px minmax(0,1fr); }
  .sidebar-v2 { padding-inline:13px; }
  .wallet-grid-v2 { grid-template-columns:repeat(2,1fr); }
  .loyalty-card-v2:last-child { grid-column:span 2; }
  .customer-overview { grid-template-columns:repeat(3,1fr); }
  .customer-overview aside { grid-column:1/-1; min-height:68px; }
  .explore-grid { grid-template-columns:1fr; }
  .reward-grid-v2 { grid-template-columns:repeat(2,1fr); }
  .metric-grid-v2,.network-metrics { grid-template-columns:repeat(2,1fr); }
  .program-grid-v2,.settings-grid-v2 { grid-template-columns:repeat(2,1fr); }
  .business-quick-list { grid-template-columns:repeat(2,1fr); }
}

@media (max-width: 760px) {
  .workspace-v2 { display:block; }
  .sidebar-v2 { display:none; }
  .mobile-header { position:sticky; top:0; z-index:45; height:62px; display:flex; align-items:center; gap:10px; padding:0 13px; color:#fff; background:rgba(21,24,23,.96); backdrop-filter:blur(15px); }
  .mobile-header .logo b { font-size:16px; }.mobile-header .logo small { font-size:5px; letter-spacing:3px; }.mobile-header .logo-symbol { transform:scale(.76); margin-right:-4px; }
  .demo-chip { margin-left:auto; display:flex; align-items:center; gap:5px; color:#858d87; font-size:6px; }.demo-chip i { width:5px; height:5px; border-radius:50%; background:var(--orange); }
  .mobile-header > button { width:31px; height:31px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.1); border-radius:50%; color:#bac0bb; background:transparent; }.mobile-header .avatar { width:31px; height:31px; }
  .page-v2 { min-height:calc(100vh - 62px); padding:15px 13px 48px; }
  .mobile-role-picker { position:sticky; top:69px; z-index:35; display:grid; grid-template-columns:repeat(4,1fr); gap:3px; margin-bottom:23px; padding:4px; border:1px solid var(--line); border-radius:12px; background:rgba(255,255,255,.93); box-shadow:0 8px 25px rgba(23,27,24,.08); backdrop-filter:blur(12px); }
  .mobile-role-picker button { min-height:31px; padding:0 2px; border:0; border-radius:8px; color:#7a807a; background:transparent; font-size:7px; font-weight:800; }.mobile-role-picker button.active { color:#1c1f1c; background:var(--orange); }
  .page-title-v2 { min-height:0; display:grid; gap:17px; margin-bottom:22px; }.page-title-v2 h1 { font-size:34px; letter-spacing:-1.7px; }.page-title-v2 p { font-size:9px; }.page-title-v2 > button,.page-title-v2 > .search-box,.page-title-v2 > .employee-chip,.page-title-v2 > .branch-select-v2 { width:100%; }
  .search-box { min-width:0; }
  .customer-overview { grid-template-columns:1fr 1fr; margin-bottom:28px; }.customer-overview > div { min-height:76px; padding:12px; }.customer-overview > div:nth-child(3) { border-top:1px solid var(--line); border-left:0; }.customer-overview aside { grid-column:2; grid-row:1/3; align-items:flex-start; flex-direction:column; justify-content:center; }.customer-overview aside > span { font-size:19px; }.overview-icon { width:33px; height:33px; }.customer-overview strong { font-size:15px; }
  .section-heading-v2 { align-items:flex-start; }.section-heading-v2 h2 { font-size:18px; }.section-heading-v2 p { max-width:230px; line-height:1.4; }.section-heading-v2 > button { white-space:nowrap; }
  .wallet-grid-v2 { display:flex; gap:11px; margin-right:-13px; padding:2px 13px 20px 0; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; }.loyalty-card-v2,.loyalty-card-v2:last-child { min-width:min(82vw,325px); min-height:300px; grid-column:auto; scroll-snap-align:start; }.loyalty-card-v2:hover { transform:none; }
  .offer-row { grid-template-columns:1fr; }.offer-card { min-height:190px; padding:23px; }.offer-card h3 { font-size:23px; }
  .explore-grid { grid-template-columns:1fr; }.business-tile { grid-template-columns:120px 1fr; min-height:175px; }.business-info { padding:16px; }.business-info > div { margin-top:19px; }
  .reward-hero { padding:26px 22px; }.reward-hero h2 { font-size:23px; }.level-number { display:none; }.reward-grid-v2 { grid-template-columns:1fr 1fr; gap:8px; }.reward-tile { min-height:205px; padding:16px; }
  .scanner-v2 { grid-template-columns:1fr; }.camera-v2 { min-height:330px; }.scanner-actions-v2 { padding:31px 22px; }.scanner-actions-v2 h2 { font-size:21px; }
  .member-profile-v2 { align-items:flex-start; padding:14px; }.member-avatar-v2 { width:45px; height:45px; }.member-profile-v2 > div { display:none; }.member-profile-v2 h1 { font-size:17px; }.member-workspace-v2 { grid-template-columns:1fr; }.balance-panel-v2 { order:-1; }.program-selector-v2 { grid-template-columns:1fr; }.operation-fields { grid-template-columns:1fr; }
  .customer-list-v2 > button { grid-template-columns:auto 1fr auto; }.customer-list-v2 button > i,.customer-list-v2 button > b { display:none; }.voucher-validator { margin-top:0; padding:27px 18px; }.voucher-validator > label { display:grid; }.voucher-validator input { min-height:43px; }.security-row { flex-wrap:wrap; gap:10px; }
  .metric-grid-v2,.network-metrics { grid-template-columns:1fr 1fr; gap:8px; }.metric-grid-v2 article,.network-metrics article { min-height:116px; display:grid; align-content:center; padding:13px; }.metric-grid-v2 strong,.network-metrics strong { font-size:20px; }
  .dashboard-grid-v2,.dashboard-grid-v2.bottom,.platform-grid { grid-template-columns:1fr; }.checa-card { min-height:270px; order:-1; }.bar-chart-v2 { height:180px; gap:5px; }.program-summary-v2 { order:-1; }
  .program-grid-v2,.settings-grid-v2 { grid-template-columns:1fr; }.program-manage-card,.new-program-tile { min-height:230px; }
  .crm-toolbar { flex-wrap:wrap; }.crm-toolbar .search-box { width:100%; flex-basis:100%; }.insight-row { display:flex; margin-right:-13px; padding-right:13px; overflow-x:auto; scrollbar-width:none; }.insight-row article { min-width:185px; }
  .data-table-v2 { overflow-x:auto; }.data-table-v2 > header,.data-table-v2 > div { min-width:690px; }
  .campaign-hero { grid-template-columns:1fr; padding:25px 21px; }.campaign-hero h2 { font-size:22px; }.campaign-list-v2 article { grid-template-columns:auto 1fr auto; }.campaign-list-v2 article > div,.campaign-list-v2 article > i { display:none; }
  .two-column-v2 { grid-template-columns:1fr; }.two-column-v2 > section,.two-column-v2 > aside { padding:16px; }
  .integration-feature { grid-template-columns:1fr; padding:24px 20px; }.integration-logo { width:54px; height:54px; }.integration-feature > aside { min-height:150px; }.integration-grid-v2 { grid-template-columns:1fr; }
  .business-quick-list { grid-template-columns:1fr 1fr; gap:7px; }.business-quick-list article { padding:10px; }.business-quick-list article > i { display:none; }
  .plan-grid-v2 { grid-template-columns:1fr; }.revenue-projection { align-items:flex-start; padding:23px; }.revenue-projection > strong { font-size:24px; }
  .security-dashboard { grid-template-columns:1fr; }.health-score { min-height:250px; }.settings-grid-v2 button { min-height:105px; }
  .detail-body { grid-template-columns:125px 1fr; gap:15px; padding:20px; }.next-reward-v2 { margin:0 20px 18px; }.card-detail-v2 > footer { grid-template-columns:1fr; }.card-detail-v2 > footer button + button { border-left:0; border-top:1px solid var(--line); }
}

@media (max-width: 420px) {
  .customer-overview { grid-template-columns:1fr 1fr; }.customer-overview aside { grid-column:1/-1; grid-row:auto; min-height:75px; flex-direction:row; align-items:center; }.reward-grid-v2,.metric-grid-v2,.network-metrics,.business-quick-list { grid-template-columns:1fr; }
  .business-tile { grid-template-columns:105px 1fr; }.business-cover > span { font-size:23px; }.business-info h2 { font-size:16px; }
  .recent-ops > div { grid-template-columns:auto 1fr auto; }.recent-ops time { display:none; }
  .detail-body { grid-template-columns:1fr; }.qr-block-v2 { width:180px; margin:0 auto; }.qr-copy { text-align:center; }.qr-copy > span { justify-content:center; }.qr-copy button { margin-inline:auto; }
}

@media (prefers-reduced-motion: reduce) {
  *, *:before, *:after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; }
}
@import url("https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,600;12..96,700;12..96,800&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap");

.consumer-app {
  min-height: 100vh;
  color: #252525;
  background: #fffdf9;
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
}

.consumer-header {
  position: sticky;
  top: 0;
  z-index: 50;
  border-bottom: 1px solid rgba(31, 31, 31, .055);
  background: rgba(255, 255, 255, .94);
  backdrop-filter: blur(18px);
}

.consumer-header-inner {
  max-width: 1470px;
  height: 88px;
  display: grid;
  grid-template-columns: 250px 1fr 250px;
  align-items: center;
  gap: 20px;
  margin: 0 auto;
  padding: 0 30px;
}

.brand-button {
  width: max-content;
  padding: 0;
  border: 0;
  color: inherit;
  background: transparent;
  cursor: pointer;
}

.consumer-logo {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #ff9d1a;
}

.consumer-logo > span:last-child {
  display: grid;
  justify-items: center;
}

.consumer-logo b {
  font: 800 30px/.9 "Space Grotesk", sans-serif;
  letter-spacing: -1.7px;
}

.consumer-logo small {
  margin-top: 8px;
  color: #f07817;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 7px;
  transform: translateX(4px);
}

.banana-mark {
  position: relative;
  width: 27px;
  height: 44px;
  display: block;
  transform: rotate(-8deg);
}

.banana-mark i {
  position: absolute;
  bottom: 3px;
  width: 10px;
  height: 34px;
  border: 4px solid #7ea12b;
  border-top-color: transparent;
  border-right-color: transparent;
  border-radius: 55% 15% 60% 55%;
}

.banana-mark i:nth-child(1) { left: 0; }
.banana-mark i:nth-child(2) { left: 7px; height: 39px; border-color: #a7be35; border-top-color: transparent; border-right-color: transparent; }
.banana-mark i:nth-child(3) { left: 15px; height: 32px; border-color: #e5aa22; border-top-color: transparent; border-right-color: transparent; }

.consumer-header nav {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(30px, 4.4vw, 72px);
}

.consumer-header nav button {
  position: relative;
  height: 100%;
  padding: 0 4px;
  border: 0;
  color: #252525;
  background: transparent;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
}

.consumer-header nav button:after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 12px;
  height: 3px;
  border-radius: 10px;
  background: #ff6a14;
  opacity: 0;
  transform: scaleX(.5);
  transition: .2s ease;
}

.consumer-header nav button.active { color: #f66b15; }
.consumer-header nav button.active:after { opacity: 1; transform: none; }

.consumer-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 20px;
}

.notification-button {
  position: relative;
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 0;
  color: #292929;
  background: transparent;
  cursor: pointer;
}

.notification-button > i {
  position: absolute;
  right: 4px;
  top: 2px;
  width: 17px;
  height: 17px;
  display: grid;
  place-items: center;
  border: 2px solid #fff;
  border-radius: 50%;
  color: #fff;
  background: #ff6915;
  font-size: 8px;
  font-style: normal;
  font-weight: 900;
}

.profile-menu-wrap { position: relative; }

.profile-button {
  min-width: 145px;
  height: 47px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 0 14px;
  border: 1px solid #dedede;
  border-radius: 12px;
  color: #252525;
  background: #fff;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}

.profile-button svg:last-child { margin-left: auto; }

.profile-dropdown {
  position: absolute;
  right: 0;
  top: calc(100% + 10px);
  width: 280px;
  padding: 11px;
  border: 1px solid #ebe6dc;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 24px 65px rgba(52, 40, 20, .18);
  animation: consumer-pop .18s ease;
}

@keyframes consumer-pop { from { opacity: 0; transform: translateY(-7px) scale(.98); } }

.profile-dropdown header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 7px 13px;
}

.profile-dropdown header > span {
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  color: #693b05;
  background: #ffe2b3;
  font-size: 10px;
  font-weight: 900;
}

.profile-dropdown p { display: grid; gap: 3px; margin: 0; }
.profile-dropdown strong { font-size: 11px; }
.profile-dropdown small { color: #888; font-size: 8px; }
.profile-dropdown > button { width: 100%; min-height: 39px; display: flex; align-items: center; gap: 9px; padding: 0 9px; border: 0; border-radius: 9px; color: #4f4f4f; background: transparent; font-size: 10px; font-weight: 700; text-align: left; cursor: pointer; }
.profile-dropdown > button:hover { color: #ce570c; background: #fff5e5; }
.profile-dropdown > button svg { width: 17px; }
.profile-dropdown > div { margin: 6px 0 9px; border-top: 1px solid #eee9df; }
.profile-dropdown > small { display: block; padding: 0 9px 6px; color: #a7a197; font-size: 6px; font-weight: 900; letter-spacing: .9px; }

.consumer-content {
  width: min(1470px, 100%);
  margin: 0 auto;
  padding: 24px 30px 80px;
}

.consumer-hero {
  position: relative;
  min-height: 410px;
  overflow: hidden;
  display: flex;
  align-items: center;
  padding: 42px 52px 68px;
  border-radius: 25px;
  color: #fff;
  background: radial-gradient(circle at 72% 12%, rgba(255,224,142,.95) 0 10%, transparent 34%), linear-gradient(115deg, #f9830b 0%, #ff9d12 43%, #ffc44d 100%);
  box-shadow: 0 24px 70px rgba(225, 116, 0, .24);
}

.consumer-hero:before { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(90deg,rgba(126,52,0,.17),transparent 42%),radial-gradient(circle at 13% 110%,rgba(255,91,0,.32),transparent 32%); }

.hero-rings i {
  position: absolute;
  right: 7%;
  top: -210px;
  width: 360px;
  height: 360px;
  border: 35px solid rgba(255,255,255,.18);
  border-radius: 50%;
}

.hero-rings i:nth-child(2) { right: 2%; top: -255px; width: 480px; height: 480px; border-width: 26px; opacity: .7; }
.hero-rings i:nth-child(3) { right: -5%; top: -325px; width: 630px; height: 630px; border-width: 22px; opacity: .45; }

.hero-leaves i {
  position: absolute;
  right: -1%;
  bottom: -75px;
  width: 115px;
  height: 265px;
  border-radius: 100% 0 100% 0;
  background: linear-gradient(145deg, #b8c534, #6f8c23);
  transform: rotate(32deg);
  box-shadow: inset 10px 0 rgba(255,255,255,.12);
}

.hero-leaves i:nth-child(2) { right: -4%; bottom: -100px; width: 120px; height: 310px; background: rgba(255,255,255,.75); transform: rotate(33deg); }

.hero-layout { position:relative; z-index:2; width:100%; display:grid; grid-template-columns:minmax(0,1.12fr) minmax(330px,.88fr); align-items:center; gap:42px; }
.hero-copy { position:relative; z-index:2; min-width:0; }
.hero-kicker { width:max-content; display:flex; align-items:center; gap:8px; margin-bottom:17px; padding:7px 10px; border:1px solid rgba(255,255,255,.28); border-radius:999px; color:#fff9e8; background:rgba(126,58,0,.14); backdrop-filter:blur(8px); font-size:8px; font-weight:900; letter-spacing:1.2px; }
.hero-kicker i { width:7px; height:7px; border-radius:50%; background:#caff3d; box-shadow:0 0 0 5px rgba(202,255,61,.14); }
.hero-copy h1 { margin:0; font-family:"Bricolage Grotesque",sans-serif; font-size:clamp(48px,4.65vw,72px); font-weight:800; line-height:.88; letter-spacing:-3.7px; text-wrap:balance; }
.hero-copy h1 span,.hero-copy h1 strong { display:block; }
.hero-copy h1 strong { color:#fff8e7; }
.hero-copy h1 em { position:relative; display:inline-block; color:#caff3d; font-style:italic; transform:rotate(-2deg); text-shadow:0 5px 0 rgba(105,58,0,.13); }
.hero-copy h1 em:after { content:""; position:absolute; left:2%; right:-2%; bottom:-5px; height:6px; border-radius:100%; background:#caff3d; opacity:.72; transform:rotate(-1deg); }
.hero-copy > p { max-width:570px; margin:18px 0 14px; color:rgba(255,255,255,.91); font-size:14px; font-weight:600; line-height:1.55; }
.hero-proof { display:flex; align-items:center; gap:15px; margin:0 0 22px; color:rgba(255,255,255,.82); font-size:8px; font-weight:700; }
.hero-proof span { display:flex; align-items:baseline; gap:5px; }
.hero-proof b { color:#fff; font-family:"Bricolage Grotesque",sans-serif; font-size:15px; }
.hero-proof > i { width:1px; height:16px; background:rgba(255,255,255,.32); }
.hero-search { display:grid; grid-template-columns:minmax(260px,1fr) auto; gap:11px; }
.hero-search label {
  height: 56px;
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 0 21px;
  border-radius: 16px;
  color: #2f2f2f;
  background: #fff;
  box-shadow: 0 10px 30px rgba(128, 69, 0, .09);
}
.hero-search input { min-width: 0; flex: 1; border: 0; outline: 0; color: #222; background: transparent; font-size: 13px; }
.hero-search input::placeholder { color: #9a9a9a; }
.hero-search button { min-width:181px; display:flex; align-items:center; justify-content:center; gap:7px; padding:0 19px; border:1px solid rgba(255,255,255,.22); border-radius:16px; color:#1f2716; background:#caff3d; box-shadow:0 13px 30px rgba(85,100,0,.2); font-size:10px; font-weight:900; cursor:pointer; transition:transform .2s ease,box-shadow .2s ease; }
.hero-search button:hover { transform:translateY(-2px); box-shadow:0 17px 35px rgba(85,100,0,.27); }

.hero-showcase { position:relative; min-width:0; height:280px; perspective:1000px; }
.hero-card-stack { position:absolute; inset:0; }
.hero-loyalty { position:absolute; right:7%; width:min(330px,88%); height:102px; display:grid; grid-template-columns:58px 1fr auto; align-items:center; gap:12px; padding:14px 16px; border:1px solid rgba(255,255,255,.28); border-radius:21px; color:#fff; box-shadow:0 24px 45px rgba(79,34,0,.22); backdrop-filter:blur(10px); transform-origin:center; animation:hero-card-float 5s ease-in-out infinite; }
.hero-loyalty > span { width:52px; height:52px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.44); border-radius:16px; background:rgba(255,255,255,.1); font-family:"Bricolage Grotesque",sans-serif; font-size:14px; font-weight:800; }
.hero-loyalty p { display:grid; gap:5px; margin:0; }
.hero-loyalty small { font-size:7px; font-weight:900; letter-spacing:1px; }
.hero-loyalty b { font-family:"Bricolage Grotesque",sans-serif; font-size:13px; }
.hero-loyalty > i { min-width:40px; height:40px; display:grid; place-items:center; border-radius:12px; background:rgba(255,255,255,.12); font-size:10px; font-style:normal; font-weight:900; }
.mini-jarras { top:12px; right:1%; background:linear-gradient(135deg,rgba(30,68,31,.9),rgba(39,92,37,.82)); transform:rotate(8deg) scale(.9); opacity:.84; animation-delay:-3.2s; }
.mini-virlly { top:82px; right:11%; background:linear-gradient(135deg,rgba(178,26,24,.95),rgba(232,65,37,.9)); transform:rotate(-5deg) scale(.96); animation-delay:-1.8s; }
.mini-mu { top:158px; right:2%; background:linear-gradient(135deg,rgba(19,20,18,.98),rgba(42,43,38,.94)); transform:rotate(3deg); }
.hero-pop { position:absolute; z-index:5; display:flex; align-items:center; gap:7px; padding:10px 13px; border:1px solid rgba(255,255,255,.5); border-radius:14px; color:#283015; background:#fff; box-shadow:0 15px 34px rgba(81,41,0,.2); font-size:8px; animation:hero-pop-float 3.4s ease-in-out infinite; }
.hero-pop svg { color:#f36d12; }
.hero-pop.one { left:0; top:58px; transform:rotate(-5deg); }
.hero-pop.two { right:1%; bottom:-4px; color:#263015; background:#caff3d; animation-delay:-1.7s; }
.hero-pop.two svg { color:#5d781b; }
@keyframes hero-card-float { 0%,100%{ translate:0 0; } 50%{ translate:0 -7px; } }
@keyframes hero-pop-float { 0%,100%{ margin-top:0; } 50%{ margin-top:-8px; } }

.hero-ticker { position:absolute; z-index:4; left:0; right:0; bottom:0; height:38px; overflow:hidden; display:flex; align-items:center; color:#2a330e; background:#caff3d; transform:rotate(-.15deg) scale(1.01); }
.hero-ticker > div { min-width:max-content; display:flex; align-items:center; gap:23px; padding-left:18px; animation:ticker-run 19s linear infinite; }
.hero-ticker span { font-family:"Bricolage Grotesque",sans-serif; font-size:9px; font-weight:800; letter-spacing:2.3px; }
.hero-ticker i { width:6px; height:6px; border-radius:50%; background:#ff6c12; }
@keyframes ticker-run { to { transform:translateX(-36%); } }

.consumer-section-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  margin: 30px 25px 14px;
}
.consumer-section-heading h2 { position:relative; width:max-content; margin:0 0 8px; font:800 27px/1 "Space Grotesk",sans-serif; letter-spacing:-1.1px; }
.consumer-section-heading h2:after { content:""; position:absolute; left:0; bottom:-7px; width:34px; height:4px; border-radius:8px; background:#ff6b13; transform:skewX(-24deg); }
.consumer-section-heading p { margin: 0; color: #888; font-size: 9px; }
.consumer-section-heading button { display: flex; align-items: center; gap: 5px; padding: 0; border: 0; color: #ff5f0f; background: transparent; font-size: 10px; font-weight: 900; cursor: pointer; }

.home-card-grid, .wallet-full-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 23px; padding: 0 25px; }
.program-card-consumer { position:relative; overflow:hidden; border:1px solid #e7e4df; border-radius:22px; background:#fff; box-shadow:0 12px 30px rgba(51,39,23,.1); transition:transform .28s cubic-bezier(.2,.8,.2,1),box-shadow .28s ease; }
.home-card-grid .program-card-consumer:nth-child(1) { transform:rotate(-.65deg); }
.home-card-grid .program-card-consumer:nth-child(2) { transform:translateY(12px); }
.home-card-grid .program-card-consumer:nth-child(3) { transform:rotate(.65deg); }
.program-card-consumer:after { content:""; position:absolute; z-index:4; inset:-40% auto -40% -55%; width:30%; pointer-events:none; background:linear-gradient(90deg,transparent,rgba(255,255,255,.5),transparent); transform:skewX(-18deg); transition:left .55s ease; }
.program-card-consumer:hover { transform:translateY(-8px) rotate(0)!important; box-shadow:0 24px 50px rgba(51,39,23,.16); }
.program-card-consumer:hover:after { left:125%; }
.program-card-consumer > header { position: relative; height: 126px; display: grid; place-items: center; overflow: hidden; border-bottom: 6px solid var(--brand-accent); background: var(--brand-bg); }
.program-card-consumer > header:before { content: ""; position: absolute; inset: 0; opacity: .09; background-image: radial-gradient(circle at 20% 30%, #fff 0 2px, transparent 3px), radial-gradient(circle at 70% 60%, #fff 0 3px, transparent 4px), linear-gradient(45deg, transparent 46%, #fff 47% 52%, transparent 53%); background-size: 43px 43px, 66px 66px, 73px 73px; }
.program-card-consumer.mu { --brand-bg:#181917; --brand-accent:#ff6416; --ink-accent:#ff6416; --soft-accent:#fff0e5; --soft-text:#b74b0e; }
.program-card-consumer.virlly { --brand-bg:linear-gradient(135deg,#c62821,#e44529); --brand-accent:#d1191b; --ink-accent:#d72625; --soft-accent:#fde8e6; --soft-text:#ad2624; }
.program-card-consumer.jarras { --brand-bg:linear-gradient(135deg,#183d1f,#285c25); --brand-accent:#f0b72d; --ink-accent:#72952b; --soft-accent:#edf3dc; --soft-text:#5a7827; }
.program-card-consumer.oroverde { --brand-bg:linear-gradient(135deg,#406232,#719643); --brand-accent:#dcb266; --ink-accent:#66833d; --soft-accent:#edf3e5; --soft-text:#547035; }
.brand-lockup { position: relative; z-index: 2; display: flex; align-items: center; justify-content: center; gap: 11px; color: #fff; }
.brand-lockup > img { width: min(230px, 74%); height: 76px; object-fit: contain; }
.brand-lockup > span { width: 58px; height: 58px; display: grid; place-items: center; border: 2px solid rgba(255,255,255,.82); border-radius: 50%; color: #fff; background: rgba(255,255,255,.09); font: 800 16px/1 "Space Grotesk", sans-serif; }
.brand-lockup > b { max-width: 180px; font: 800 24px/.9 "Space Grotesk", sans-serif; text-transform: uppercase; text-shadow: 0 2px 0 rgba(0,0,0,.1); }
.program-card-consumer > section { padding: 16px 20px 20px; text-align: center; }
.program-card-consumer h3 { margin: 0; font: 800 16px/1.15 "Space Grotesk", sans-serif; }
.program-card-consumer section > p { margin: 7px 0 11px; color: #555; font-size: 12px; }
.stamps-row { display: flex; justify-content: center; gap: clamp(4px, .55vw, 9px); min-height: 36px; }
.consumer-stamp { width: 33px; height: 33px; display: grid; place-items: center; border: 1px solid #c8c8c8; border-radius: 50%; color: #a6a6a6; background: #f7f7f7; }
.consumer-stamp i { font-size: 11px; font-style: normal; font-weight: 900; }
.consumer-stamp.active { color: #fff; border-color: var(--ink-accent); background: var(--ink-accent); }
.points-progress { height: 36px; display: grid; align-items: center; padding: 0 7px; }
.points-progress > i { height: 18px; display: block; overflow: hidden; border-radius: 30px; background: #e4e4e4; }
.points-progress > i b { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #719324, #8dae37); }
.remaining-pill { width: max-content; max-width: 100%; min-height: 30px; display: flex; align-items: center; justify-content: center; gap: 7px; margin: 12px auto; padding: 0 17px; border-radius: 30px; color: var(--soft-text); background: var(--soft-accent); font-size: 9px; }
.remaining-pill svg { fill: currentColor; }
.program-card-consumer section > button { width: 100%; min-height: 40px; display: flex; align-items: center; justify-content: center; gap: 5px; border: 1px solid var(--ink-accent); border-radius: 9px; color: var(--ink-accent); background: #fff; font-size: 10px; font-weight: 900; cursor: pointer; }

.home-benefit-scroll { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; padding: 0 25px; }
.benefit-card-consumer { min-height:255px; overflow:hidden; border:1px solid #e8e5df; border-radius:20px; background:#fff; box-shadow:0 9px 25px rgba(58,42,22,.07); transition:transform .25s ease,box-shadow .25s ease; }
.benefit-card-consumer:hover { transform:translateY(-6px); box-shadow:0 20px 42px rgba(58,42,22,.13); }
.benefit-image { position: relative; height: 128px; overflow: hidden; background: #f4ead7; }
.benefit-image img { width: 100%; height: 100%; display: block; object-fit: cover; transition: transform .3s ease; }
.benefit-card-consumer:hover .benefit-image img { transform: scale(1.035); }
.benefit-image > span { position: absolute; left: 12px; top: 12px; padding: 5px 9px; border-radius: 20px; color: #fff; background: rgba(31,31,31,.78); backdrop-filter: blur(8px); font-size: 7px; font-weight: 900; }
.benefit-card-consumer > div:last-child { position: relative; padding: 15px 17px; }
.benefit-card-consumer > div:last-child > small { color: #f36716; font-size: 7px; font-weight: 900; text-transform: uppercase; letter-spacing: .5px; }
.benefit-card-consumer h3 { max-width: 340px; margin: 5px 0 7px; font: 800 16px/1.15 "Space Grotesk", sans-serif; }
.benefit-card-consumer p { display: flex; align-items: center; gap: 4px; margin: 0; color: #888; font-size: 8px; }
.benefit-card-consumer button { position: absolute; right: 13px; bottom: 13px; display: flex; align-items: center; gap: 4px; padding: 6px 7px; border: 0; color: #e55d12; background: transparent; font-size: 8px; font-weight: 900; cursor: pointer; }

.member-level-strip { min-height: 142px; display: grid; grid-template-columns: auto 1.25fr .9fr; align-items: center; gap: 22px; margin: 34px 25px 0; padding: 24px 28px; border-radius: 19px; color: #fff; background: linear-gradient(125deg,#1f241f,#34472b); box-shadow: 0 18px 45px rgba(24, 34, 24, .16); }
.level-medal { position: relative; width: 76px; height: 76px; display: grid; place-items: center; border: 1px solid rgba(202,255,61,.22); border-radius: 22px; color: #caff3d; background: rgba(202,255,61,.06); }
.level-medal svg { position: absolute; width: 52px; height: 52px; opacity: .24; }
.level-medal span { font: 800 22px/1 "Space Grotesk", sans-serif; }
.level-copy small { color: #b9df4d; font-size: 7px; font-weight: 900; letter-spacing: .9px; }
.level-copy h2 { margin: 5px 0 3px; font: 800 22px/1.1 "Space Grotesk", sans-serif; }
.level-copy p { max-width: 520px; margin: 0; color: #a8b0a8; font-size: 8px; line-height: 1.5; }
.level-progress p { display: flex; justify-content: space-between; margin: 0 0 7px; color: #abb2ac; font-size: 8px; }
.level-progress p b { color: #fff; }
.level-progress > i { height: 7px; display: block; overflow: hidden; border-radius: 20px; background: rgba(255,255,255,.1); }
.level-progress > i b { width: 50%; height: 100%; display: block; border-radius: inherit; background: #caff3d; }
.level-progress button { display: flex; align-items: center; gap: 4px; margin-top: 12px; padding: 0; border: 0; color: #caff3d; background: transparent; font-size: 8px; font-weight: 900; cursor: pointer; }

.home-two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin: 20px 25px 0; }
.referral-card, .smart-card { min-height: 178px; display: grid; grid-template-columns: auto 1fr; gap: 17px; align-items: center; padding: 24px; border: 1px solid #eee1cf; border-radius: 18px; background: #fff5e6; }
.smart-card { color: #fff; border-color: #222b23; background: #1e241f; }
.referral-card > span, .smart-card > span { width: 52px; height: 52px; display: grid; place-items: center; border-radius: 15px; color: #ad5e0c; background: #ffddb1; }
.smart-card > span { color: #caff3d; background: rgba(202,255,61,.08); }
.referral-card small, .smart-card small { color: #bd721c; font-size: 7px; font-weight: 900; letter-spacing: .7px; }
.smart-card small { color: #a7c84a; }
.referral-card h2, .smart-card h2 { margin: 5px 0; font: 800 18px/1.1 "Space Grotesk", sans-serif; }
.referral-card p, .smart-card p { max-width: 470px; margin: 0; color: #7f776d; font-size: 8px; line-height: 1.5; }
.smart-card p { color: #929a93; }
.referral-card button, .smart-card button { margin-top: 13px; padding: 0; border: 0; color: #e06411; background: transparent; font-size: 8px; font-weight: 900; cursor: pointer; }
.smart-card button { color: #caff3d; }

.consumer-page { min-height: calc(100vh - 190px); padding: 14px 25px 0; }
.consumer-page-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 25px; padding: 12px 0 30px; }
.consumer-page-header > div > span { color: #e36b17; font-size: 8px; font-weight: 900; letter-spacing: 1.1px; }
.consumer-page-header h1 { margin: 7px 0 7px; font: 800 clamp(33px, 4vw, 48px)/.98 "Space Grotesk", sans-serif; letter-spacing: -1.8px; }
.consumer-page-header p { max-width: 700px; margin: 0; color: #777; font-size: 11px; line-height: 1.55; }
.orange-button { min-height: 45px; display: flex; align-items: center; gap: 8px; padding: 0 16px; border: 0; border-radius: 11px; color: #fff; background: #ff6815; box-shadow: 0 9px 22px rgba(219,85,10,.2); font-size: 10px; font-weight: 900; cursor: pointer; }
.wallet-summary { display: grid; grid-template-columns: repeat(3,.7fr) 1.45fr; margin-bottom: 22px; overflow: hidden; border: 1px solid #e7e2da; border-radius: 16px; background: #fff; }
.wallet-summary > article, .wallet-summary > aside { min-height: 88px; display: flex; align-items: center; gap: 11px; padding: 15px 18px; }
.wallet-summary > article + article { border-left: 1px solid #eee9e1; }
.wallet-summary article > span { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 11px; color: #b36713; background: #fff0d8; }
.wallet-summary p { display: grid; gap: 2px; margin: 0; }
.wallet-summary strong { font: 800 19px/1 "Space Grotesk", sans-serif; }
.wallet-summary small { color: #8a8a8a; font-size: 7px; }
.wallet-summary aside { color: #fff; background: #202521; }
.wallet-summary aside > svg { color: #caff3d; }
.wallet-summary aside strong { font-size: 9px; }
.wallet-summary aside small { max-width: 340px; color: #999f9a; line-height: 1.45; }
.wallet-full-grid { padding: 0; }
.wallet-connect { display: flex; align-items: center; justify-content: space-between; gap: 25px; margin-top: 23px; padding: 26px 28px; border: 1px solid #e6e0d6; border-radius: 18px; background: linear-gradient(115deg,#fff9ef,#fff); }
.wallet-connect > div { display: flex; align-items: center; gap: 15px; }
.wallet-connect > div > span { width: 50px; height: 50px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 15px; color: #a7600c; background: #ffe4bd; }
.wallet-connect p { display: grid; gap: 4px; margin: 0; }
.wallet-connect p small { color: #d06c15; font-size: 7px; font-weight: 900; }
.wallet-connect h2 { margin: 0; font: 800 17px/1.1 "Space Grotesk", sans-serif; }
.wallet-connect p b { max-width: 660px; color: #7e7a74; font-size: 8px; font-weight: 500; line-height: 1.5; }
.wallet-connect aside { display: flex; gap: 8px; }
.wallet-connect aside button { min-height: 39px; padding: 0 12px; border: 1px solid #d9d5cf; border-radius: 9px; color: #222; background: #fff; font-size: 8px; font-weight: 800; cursor: pointer; }

.benefit-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 19px; }
.benefit-toolbar > div { display: flex; gap: 7px; }
.benefit-toolbar button, .category-chips button { min-height: 35px; padding: 0 13px; border: 1px solid #e1ded8; border-radius: 24px; color: #777; background: #fff; font-size: 8px; font-weight: 800; cursor: pointer; }
.benefit-toolbar button.active, .category-chips button.active { color: #fff; border-color: #ff6815; background: #ff6815; }
.benefit-toolbar label, .business-search { min-width: 270px; min-height: 40px; display: flex; align-items: center; gap: 9px; padding: 0 12px; border: 1px solid #e2ded7; border-radius: 10px; color: #8a8a8a; background: #fff; }
.benefit-toolbar input, .business-search input { min-width: 0; flex: 1; border: 0; outline: 0; background: transparent; font-size: 9px; }
.benefit-grid-full { display: grid; grid-template-columns: repeat(4,1fr); gap: 16px; }
.birthday-banner { min-height: 140px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 19px; margin-top: 22px; padding: 25px 29px; border-radius: 18px; color: #fff; background: linear-gradient(115deg,#6f2f7d,#a84b82); }
.birthday-banner > span { font-size: 43px; }
.birthday-banner small { color: #ffd8ec; font-size: 7px; font-weight: 900; letter-spacing: .8px; }
.birthday-banner h2 { margin: 5px 0 4px; font: 800 20px/1.1 "Space Grotesk", sans-serif; }
.birthday-banner p { margin: 0; color: #e5c4dc; font-size: 8px; }
.birthday-banner button { min-height: 40px; padding: 0 14px; border: 0; border-radius: 10px; color: #7b3478; background: #fff; font-size: 8px; font-weight: 900; cursor: pointer; }

.category-chips { display: flex; gap: 7px; margin-bottom: 16px; overflow-x: auto; }
.business-search { min-width: 310px; }
.business-directory { display: grid; gap: 9px; }
.business-directory article { min-height: 104px; display: grid; grid-template-columns: auto 1.25fr .8fr auto; align-items: center; gap: 16px; padding: 13px 16px; border: 1px solid #e6e2da; border-radius: 15px; background: #fff; transition: .2s ease; }
.business-directory article:hover { border-color: #e4ba84; box-shadow: 0 12px 30px rgba(69,49,25,.07); }
.business-brand { width: 75px; height: 75px; display: grid; place-items: center; border-radius: 16px; color: #fff; font: 800 15px/1 "Space Grotesk", sans-serif; }
.business-brand.mu { color: #ff6c17; background: #191a18; }.business-brand.virlly { background: #cf2b23; }.business-brand.jarras { color: #ffc440; background: #244c26; }.business-brand.oroverde { background: #6c8e42; }
.business-main > span { color: #e36a16; font-size: 7px; font-weight: 900; text-transform: uppercase; }
.business-main h2 { margin: 4px 0; font: 800 16px/1.1 "Space Grotesk", sans-serif; }
.business-main p { display: flex; align-items: center; gap: 4px; margin: 0; color: #888; font-size: 7px; }
.business-main > div { display: flex; align-items: center; gap: 5px; margin-top: 7px; color: #8b8b8b; font-size: 7px; }
.business-main > div i { width: 6px; height: 6px; border-radius: 50%; background: #aaa; }
.business-main > div i.open { background: #77a529; }
.business-reward { display: grid; gap: 3px; }
.business-reward small { color: #999; font-size: 6px; font-weight: 800; }
.business-reward strong { font-size: 9px; }
.business-reward span { color: #c66216; font-size: 7px; }
.business-directory article > button { min-width: 130px; min-height: 39px; display: flex; align-items: center; justify-content: center; gap: 5px; border: 1px solid #ff6815; border-radius: 9px; color: #fff; background: #ff6815; font-size: 8px; font-weight: 900; cursor: pointer; }
.business-directory article > button.joined { color: #e35f11; background: #fff; }

.consumer-modal-backdrop, .notification-backdrop { position: fixed; inset: 0; z-index: 90; display: grid; place-items: center; padding: 20px; background: rgba(25,20,14,.58); backdrop-filter: blur(8px); animation: consumer-fade .18s ease; }
@keyframes consumer-fade { from { opacity: 0; } }
.consumer-card-modal { position: relative; width: min(570px,100%); max-height: calc(100vh - 36px); overflow-y: auto; border-radius: 24px; background: #fff; box-shadow: 0 30px 90px rgba(31,21,10,.35); }
.consumer-modal-close { position: absolute; right: 15px; top: 15px; z-index: 3; width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.22); border-radius: 50%; color: #fff; background: rgba(0,0,0,.22); cursor: pointer; }
.consumer-card-modal > header { position: relative; min-height: 230px; overflow: hidden; padding: 27px; color: #fff; background: var(--brand-bg); }
.consumer-card-modal > header.mu { --brand-bg:#181917; --brand-accent:#ff6416; }.consumer-card-modal > header.virlly { --brand-bg:linear-gradient(135deg,#bd221d,#e24227); --brand-accent:#ffcfaa; }.consumer-card-modal > header.jarras { --brand-bg:linear-gradient(135deg,#173c1d,#315d27); --brand-accent:#ffc13b; }.consumer-card-modal > header.oroverde { --brand-bg:linear-gradient(135deg,#466537,#769a45); --brand-accent:#ffdf9e; }
.consumer-card-modal > header:after { content:""; position:absolute; right:-80px; top:-120px; width:300px; height:300px; border:45px solid rgba(255,255,255,.09); border-radius:50%; }
.consumer-card-modal > header .brand-lockup { width:max-content; justify-content:flex-start; }.consumer-card-modal > header .brand-lockup img { width:165px; height:62px; }
.consumer-card-modal > header > i { position:absolute; right:58px; top:26px; z-index:2; padding:5px 8px; border:1px solid rgba(255,255,255,.2); border-radius:20px; font-size:7px; font-style:normal; text-transform:uppercase; }
.consumer-card-modal > header > p { position:relative; z-index:2; display:grid; gap:3px; margin:25px 0 15px; }.consumer-card-modal > header > p small { color:rgba(255,255,255,.65); font-size:7px; }.consumer-card-modal > header > p strong { font:800 39px/1 "Space Grotesk",sans-serif; }.consumer-card-modal > header > p strong span { margin-left:6px; color:rgba(255,255,255,.65); font:600 8px/1 "Manrope",sans-serif; }
.consumer-card-modal > header > div:last-child { position:relative; z-index:2; height:7px; overflow:hidden; border-radius:20px; background:rgba(255,255,255,.14); }.consumer-card-modal > header > div:last-child b { display:block; height:100%; border-radius:inherit; background:var(--brand-accent); }
.consumer-card-modal-body { display:grid; grid-template-columns:170px 1fr; align-items:center; gap:22px; padding:25px; }
.modal-qr-wrap { padding:13px; border:1px solid #e3dfd7; border-radius:14px; box-shadow:0 9px 24px rgba(42,31,18,.08); }.modal-qr-wrap > span { display:block; margin-top:7px; color:#888; font-size:6px; letter-spacing:1px; text-align:center; }
.consumer-qr { display:grid; grid-template-columns:repeat(13,1fr); gap:2px; aspect-ratio:1; }.consumer-qr i { border-radius:1px; }.consumer-qr i.on { background:#1b1d1b; }
.active-qr { display:flex; align-items:center; gap:5px; color:#64871f; font-size:7px; font-weight:900; }.active-qr i { width:6px; height:6px; border-radius:50%; background:#76a323; }
.consumer-card-modal-body h2 { margin:9px 0 6px; font:800 18px/1.1 "Space Grotesk",sans-serif; }.consumer-card-modal-body p { margin:0; color:#7f7f7f; font-size:8px; line-height:1.5; }.consumer-card-modal-body button { display:flex; align-items:center; gap:5px; margin-top:13px; padding:8px 10px; border:1px solid #e0ddd7; border-radius:8px; background:#fff; font-size:7px; font-weight:900; cursor:pointer; }
.modal-reward-row { display:flex; align-items:center; gap:10px; margin:0 25px 20px; padding:13px; border-radius:12px; background:#fff5e5; }.modal-reward-row > span { width:37px; height:37px; display:grid; place-items:center; border-radius:10px; color:#a95e0d; background:#ffddb1; }.modal-reward-row p { flex:1; display:grid; gap:3px; margin:0; }.modal-reward-row small { color:#9d8c77; font-size:6px; }.modal-reward-row strong { font-size:9px; }.modal-reward-row > b { color:#c15c11; font-size:7px; }
.consumer-card-modal > footer { display:grid; grid-template-columns:1fr 1fr; border-top:1px solid #e8e4dd; }.consumer-card-modal > footer button { min-height:51px; display:flex; align-items:center; justify-content:center; gap:6px; border:0; color:#333; background:#fff; font-size:8px; font-weight:900; cursor:pointer; }.consumer-card-modal > footer button+button { border-left:1px solid #e8e4dd; }

.notification-backdrop { justify-items: end; padding: 0; }
.notification-drawer { width:min(420px,100%); height:100vh; overflow-y:auto; padding:24px; background:#fff; box-shadow:-20px 0 60px rgba(39,29,17,.2); animation:drawer-in .22s ease; }
@keyframes drawer-in { from { transform:translateX(100%); } }
.notification-drawer > header { display:flex; align-items:flex-start; justify-content:space-between; padding-bottom:19px; border-bottom:1px solid #ece7df; }.notification-drawer header span { color:#e06512; font-size:7px; font-weight:900; letter-spacing:1px; }.notification-drawer header h2 { margin:5px 0 0; font:800 23px/1.1 "Space Grotesk",sans-serif; }.notification-drawer header button { width:34px; height:34px; display:grid; place-items:center; border:1px solid #e2ded8; border-radius:50%; background:#fff; cursor:pointer; }
.notification-list { display:grid; }.notification-list > button { display:flex; align-items:flex-start; gap:11px; padding:16px 0; border:0; border-bottom:1px solid #eeeae4; color:#222; background:#fff; text-align:left; cursor:pointer; }.notification-list > button > span { width:39px; height:39px; display:grid; place-items:center; flex:0 0 auto; border-radius:11px; }.notification-list .orange{color:#af610f;background:#fff0d7}.notification-list .green{color:#63801d;background:#edf5d7}.notification-list .purple{color:#795aa0;background:#f0e9f7}.notification-list p { display:grid; gap:4px; margin:0; }.notification-list strong { font-size:9px; }.notification-list small,.notification-list time { color:#888; font-size:7px; }.notification-list time { margin-top:3px; }
.notification-drawer > section { display:grid; grid-template-columns:auto 1fr; gap:11px; margin-top:22px; padding:17px; border-radius:14px; background:#f3f6ec; }.notification-drawer > section > svg { color:#6a8820; }.notification-drawer section div { display:grid; gap:4px; }.notification-drawer section strong { font-size:9px; }.notification-drawer section p { margin:0; color:#72796f; font-size:7px; line-height:1.5; }.notification-drawer section button { grid-column:2; width:max-content; padding:8px 11px; border:0; border-radius:8px; color:#fff; background:#6f9223; font-size:7px; font-weight:900; cursor:pointer; }
.consumer-toast { position:fixed; z-index:110; left:50%; bottom:24px; display:flex; align-items:center; gap:9px; padding:8px 15px 8px 8px; border-radius:28px; color:#fff; background:#202320; box-shadow:0 18px 45px rgba(0,0,0,.28); font-size:8px; font-weight:800; transform:translateX(-50%); animation:consumer-toast-in .2s ease; }.consumer-toast > span { width:27px; height:27px; display:grid; place-items:center; border-radius:50%; color:#1d2617; background:#caff3d; }
@keyframes consumer-toast-in { from { opacity:0; transform:translate(-50%,7px); } }

.consumer-bottom-nav { display:none; }

.consumer-logo b,
.hero-copy h1,
.consumer-section-heading h2,
.brand-lockup > span,
.brand-lockup > b,
.program-card-consumer h3,
.benefit-card-consumer h3,
.level-medal span,
.level-copy h2,
.referral-card h2,
.smart-card h2,
.consumer-page-header h1,
.wallet-summary strong,
.wallet-connect h2,
.birthday-banner h2,
.business-brand,
.business-main h2,
.consumer-card-modal > header > p strong,
.consumer-card-modal-body h2,
.notification-drawer header h2 { font-family:"Bricolage Grotesque",sans-serif; }

@media(max-width:1100px){
  .consumer-header-inner { grid-template-columns:210px 1fr 190px; padding-inline:22px; }
  .consumer-header nav { gap:27px; }
  .profile-button { min-width:128px; }
  .consumer-content { padding-inline:20px; }
  .consumer-hero { padding-inline:38px; }
  .hero-layout { grid-template-columns:minmax(0,1fr) minmax(285px,.72fr); gap:24px; }
  .hero-copy h1 { font-size:clamp(45px,5.2vw,61px); }
  .hero-loyalty { right:2%; width:min(290px,94%); }
  .home-card-grid,.wallet-full-grid { gap:14px; padding-inline:12px; }
  .consumer-section-heading { margin-inline:12px; }
  .stamps-row { gap:4px; }.consumer-stamp { width:29px; height:29px; }
  .home-benefit-scroll { padding-inline:12px; gap:13px; }
  .member-level-strip,.home-two-col { margin-inline:12px; }
  .benefit-grid-full { grid-template-columns:repeat(2,1fr); }
  .wallet-connect { display:grid; }
}

@media(max-width:820px){
  .consumer-header-inner { height:67px; grid-template-columns:1fr auto; padding-inline:15px; }
  .consumer-header nav { display:none; }
  .consumer-logo b { font-size:23px; }.consumer-logo small { margin-top:6px; font-size:7px; letter-spacing:5px; }.banana-mark { transform:scale(.8) rotate(-8deg); margin-right:-3px; }
  .consumer-actions { gap:7px; }.profile-button { min-width:42px; width:42px; height:42px; padding:0; border-radius:50%; }.profile-button span,.profile-button svg:last-child { display:none; }
  .profile-dropdown { position:fixed; right:12px; top:72px; width:min(300px,calc(100vw - 24px)); }
  .consumer-content { padding:14px 12px 100px; }
  .consumer-hero { min-height:620px; align-items:flex-start; padding:31px 24px 60px; border-radius:20px; }
  .hero-layout { grid-template-columns:1fr; gap:5px; }
  .hero-copy { width:100%; }.hero-copy h1 { max-width:570px; font-size:clamp(43px,10.5vw,58px); letter-spacing:-2.8px; }.hero-copy > p { max-width:520px; margin-top:16px; font-size:12px; }
  .hero-kicker { margin-bottom:14px; }
  .hero-proof { margin-bottom:17px; }
  .hero-search { grid-template-columns:1fr; gap:9px; }.hero-search label { height:52px; }.hero-search button { min-height:49px; }
  .hero-showcase { height:190px; margin-top:4px; }
  .hero-loyalty { left:50%; right:auto; width:min(285px,80vw); height:78px; grid-template-columns:43px 1fr auto; padding:10px 12px; border-radius:17px; }
  .hero-loyalty > span { width:39px; height:39px; border-radius:12px; font-size:11px; }.hero-loyalty b { font-size:11px; }.hero-loyalty > i { min-width:32px; height:32px; }
  .mini-jarras { top:2px; transform:translateX(-44%) rotate(7deg) scale(.87); }.mini-virlly { top:52px; transform:translateX(-55%) rotate(-4deg) scale(.94); }.mini-mu { top:107px; transform:translateX(-48%) rotate(2deg); }
  .hero-pop.one { left:3%; top:40px; }.hero-pop.two { right:2%; bottom:0; }
  .hero-ticker { height:34px; }
  .hero-rings i { right:-95px; top:-210px; }.hero-rings i:nth-child(2){right:-160px}.hero-rings i:nth-child(3){right:-260px}.hero-leaves i { right:-10%; opacity:.62; }.hero-leaves i:nth-child(2){right:-24%;}
  .consumer-section-heading { margin:26px 3px 12px; }.consumer-section-heading h2 { font-size:20px; }.consumer-section-heading p { max-width:210px; line-height:1.35; }
  .home-card-grid { display:flex; gap:12px; margin-right:-12px; padding:2px 12px 20px 0; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; }.home-card-grid .program-card-consumer { min-width:min(86vw,390px); scroll-snap-align:start; transform:none; }
  .home-benefit-scroll { display:flex; gap:12px; margin-right:-12px; padding:2px 12px 18px 0; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; }.home-benefit-scroll .benefit-card-consumer { min-width:min(78vw,340px); scroll-snap-align:start; }
  .member-level-strip { grid-template-columns:auto 1fr; gap:14px; margin:20px 0 0; padding:22px 18px; }.level-progress { grid-column:1/-1; }.level-medal { width:62px; height:62px; border-radius:18px; }
  .home-two-col { grid-template-columns:1fr; margin:12px 0 0; }.referral-card,.smart-card { min-height:165px; padding:20px; }
  .consumer-page { padding:8px 0 0; }.consumer-page-header { display:grid; gap:17px; padding-bottom:23px; }.consumer-page-header h1 { font-size:37px; }.consumer-page-header > button,.consumer-page-header > label { width:100%; }
  .wallet-summary { grid-template-columns:1fr 1fr; }.wallet-summary > article { min-height:73px; padding:12px; }.wallet-summary > article:nth-child(3){border-top:1px solid #eee9e1}.wallet-summary > aside { grid-column:2; grid-row:1/3; align-items:flex-start; flex-direction:column; justify-content:center; }
  .wallet-full-grid { display:flex; gap:12px; margin-right:-12px; padding:2px 12px 18px 0; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; }.wallet-full-grid .program-card-consumer { min-width:min(86vw,390px); scroll-snap-align:start; }
  .wallet-connect { padding:21px; }.wallet-connect > div { align-items:flex-start; }.wallet-connect aside { display:grid; }
  .benefit-toolbar { display:grid; }.benefit-toolbar > div { margin-right:-12px; padding-right:12px; overflow-x:auto; scrollbar-width:none; }.benefit-toolbar label { min-width:0; width:100%; }.benefit-grid-full { grid-template-columns:1fr 1fr; gap:9px; }.birthday-banner { grid-template-columns:auto 1fr; padding:22px; }.birthday-banner button { grid-column:1/-1; }
  .business-search { min-width:0; }.business-directory article { grid-template-columns:auto 1fr auto; gap:11px; padding:11px; }.business-reward { display:none; }.business-brand { width:61px; height:61px; }.business-directory article > button { min-width:42px; width:42px; padding:0; font-size:0; }.business-directory article > button svg { width:17px; }
  .consumer-bottom-nav { position:fixed; left:10px; right:10px; bottom:9px; z-index:48; height:67px; display:grid; grid-template-columns:repeat(4,1fr); padding:6px; border:1px solid rgba(232,224,212,.9); border-radius:18px; background:rgba(255,255,255,.95); box-shadow:0 16px 45px rgba(56,39,18,.18); backdrop-filter:blur(16px); }.consumer-bottom-nav button { display:grid; place-items:center; align-content:center; gap:3px; border:0; border-radius:12px; color:#8d8d8d; background:transparent; font-size:7px; font-weight:800; }.consumer-bottom-nav button svg { width:20px; height:20px; }.consumer-bottom-nav button.active { color:#f46514; background:#fff2df; }
  .consumer-toast { bottom:87px; white-space:nowrap; }
}

@media(max-width:520px){
  .consumer-hero { min-height:625px; padding:27px 18px 57px; }.hero-copy h1 { font-size:43px; line-height:.9; letter-spacing:-2.3px; }.hero-copy > p { font-size:11px; }.hero-kicker { max-width:100%; font-size:7px; }.hero-proof { gap:9px; }.hero-proof b { font-size:13px; }.hero-search label { padding-inline:15px; }.hero-search input { font-size:11px; }
  .hero-showcase { height:182px; }.hero-loyalty { width:min(260px,79vw); }.hero-pop { padding:8px 10px; }.hero-pop.one { left:-1%; top:42px; }.hero-pop.two { right:-1%; bottom:0; }
  .program-card-consumer > header { height:112px; }.program-card-consumer > section { padding:15px; }.consumer-stamp { width:28px; height:28px; }.brand-lockup > b { font-size:21px; }
  .benefit-grid-full { grid-template-columns:1fr; }.benefit-card-consumer { min-height:245px; }
  .wallet-summary > aside { grid-column:1/-1; grid-row:auto; min-height:75px; flex-direction:row; align-items:center; }.wallet-summary > article:nth-child(3) { display:none; }
  .wallet-connect > div > span { display:none; }.wallet-connect aside button { width:100%; }
  .business-main p { max-width:160px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }.business-main h2 { font-size:14px; }
  .consumer-card-modal-body { grid-template-columns:1fr; padding:21px; text-align:center; }.modal-qr-wrap { width:180px; margin:0 auto; }.active-qr,.consumer-card-modal-body button { justify-content:center; margin-inline:auto; }.modal-reward-row > b { display:none; }.consumer-card-modal > footer { grid-template-columns:1fr; }.consumer-card-modal > footer button+button { border-left:0; border-top:1px solid #e8e4dd; }
}

/* ===== INGUIRI v5 · capas nuevas sobre la identidad v4 ===== */
:root{--inguiri-orange:#ff6a14;--inguiri-gold:#ffad22;--inguiri-lime:#caff3d;--inguiri-green:#7f9f2d;--inguiri-cream:#fff7e7;--inguiri-dark:#151817}
body{min-height:100vh;background:#fffdf9}.hidden{display:none!important}.boot{min-height:100vh;display:grid;place-items:center;align-content:center;gap:10px;background:#fffdf9;color:#222}.boot b{font:800 42px/1 "Bricolage Grotesque",sans-serif;color:#ff9d1a}.boot small{color:#8b8b83}.loader{width:38px;height:38px;border-radius:50%;border:4px solid #f1eadf;border-top-color:#ff7a16;animation:spin .75s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
.toast{position:fixed;right:22px;bottom:22px;z-index:200;max-width:360px;padding:14px 18px;border-radius:14px;color:#fff;background:#171a18;box-shadow:0 18px 50px #0003;opacity:0;transform:translateY(14px);pointer-events:none;transition:.25s}.toast.show{opacity:1;transform:none}

/* Public landing */
.landing{min-height:100vh;background:#fffaf0;color:#1e211e;font-family:"Plus Jakarta Sans",sans-serif}.landing-nav{position:sticky;top:0;z-index:60;height:82px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(20px,5vw,72px);border-bottom:1px solid rgba(32,29,20,.06);background:rgba(255,253,248,.9);backdrop-filter:blur(18px)}.landing-nav .consumer-logo{transform:scale(.92);transform-origin:left center}.landing-links{display:flex;align-items:center;gap:26px}.landing-links a{color:#383a37;text-decoration:none;font-size:13px;font-weight:700}.landing-actions{display:flex;gap:10px}.btn{min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:0 17px;border-radius:12px;border:1px solid #e4dfd5;background:#fff;color:#20231f;text-decoration:none;font-size:12px;font-weight:800;cursor:pointer;transition:.2s}.btn:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(40,32,12,.1)}.btn.primary{border-color:#ff7a16;background:#ff7a16;color:#fff}.btn.lime{border-color:#caff3d;background:#caff3d;color:#1e2810}.landing-hero{position:relative;overflow:hidden;min-height:680px;display:grid;grid-template-columns:minmax(0,1.02fr) minmax(450px,.98fr);gap:50px;align-items:center;padding:74px clamp(28px,6vw,100px) 92px;background:radial-gradient(circle at 84% 20%,#ffd77c 0,transparent 28%),linear-gradient(120deg,#fff8e7 0%,#fffdf9 46%,#ffefd0 100%)}.landing-hero:after{content:"";position:absolute;right:-180px;bottom:-220px;width:650px;height:650px;border:120px solid rgba(126,161,43,.08);border-radius:50%}.landing-copy{position:relative;z-index:2}.landing-copy .badge{width:max-content;display:flex;align-items:center;gap:8px;padding:8px 11px;border:1px solid #ead7b0;border-radius:999px;color:#97610f;background:#fff9ed;font-size:10px;font-weight:900;letter-spacing:1px}.landing-copy h1{max-width:760px;margin:18px 0 22px;font:800 clamp(56px,6.7vw,104px)/.84 "Bricolage Grotesque",sans-serif;letter-spacing:-5px}.landing-copy h1 em{display:block;color:#ff6a14;font-style:normal}.landing-copy p{max-width:650px;margin:0 0 27px;color:#62665f;font-size:16px;line-height:1.7}.landing-cta{display:flex;gap:11px;flex-wrap:wrap}.landing-proof{display:flex;gap:25px;margin-top:34px}.landing-proof div{display:grid;gap:2px}.landing-proof strong{font:800 22px/1 "Bricolage Grotesque",sans-serif}.landing-proof small{color:#777b74;font-size:10px}.landing-cards{position:relative;z-index:2;height:510px;perspective:1200px}.hero-program{position:absolute;left:50%;top:50%;width:min(420px,90%);height:240px;padding:25px;border-radius:28px;color:#fff;box-shadow:0 35px 75px rgba(47,25,2,.25);overflow:hidden;transition:.4s cubic-bezier(.2,.8,.2,1)}.hero-program:before{content:"";position:absolute;inset:-60% -90%;background:linear-gradient(105deg,transparent 44%,rgba(255,255,255,.42) 50%,transparent 56%);transform:translateX(-30%);animation:shine-card 5.5s ease-in-out infinite}.hero-program:nth-child(1){background:linear-gradient(135deg,#bd211c,#e84d2c);transform:translate(-63%,-78%) rotate(-8deg);z-index:1}.hero-program:nth-child(2){background:linear-gradient(135deg,#151817,#292c26);transform:translate(-37%,-45%) rotate(4deg);z-index:3}.hero-program:nth-child(3){background:linear-gradient(135deg,#de7811,#ffad22 52%,#638626);transform:translate(-58%,-12%) rotate(-4deg);z-index:2}.hero-program:hover{z-index:9;transform:translate(-50%,-50%) rotate(0) scale(1.06)!important;box-shadow:0 50px 100px rgba(37,21,2,.34)}@keyframes shine-card{0%,55%{transform:translateX(-45%)}85%,100%{transform:translateX(45%)}}.hero-program .brand-line{position:relative;z-index:2;display:flex;justify-content:space-between;align-items:flex-start}.hero-program .brand-line b{font:800 24px/1 "Bricolage Grotesque",sans-serif}.hero-program .brand-line img{height:55px;max-width:170px;object-fit:contain}.hero-program .brand-line span{padding:7px 10px;border:1px solid #ffffff45;border-radius:999px;font-size:9px;font-weight:800}.hero-program h3{position:relative;z-index:2;max-width:260px;margin:52px 0 6px;font:800 28px/1 "Bricolage Grotesque",sans-serif}.hero-program p{position:relative;z-index:2;margin:0;color:#ffffffc9;font-size:11px}.hero-program footer{position:absolute;z-index:2;left:25px;right:25px;bottom:22px;display:flex;justify-content:space-between;align-items:center}.hero-program footer strong{font-size:11px}.hero-program footer i{width:36px;height:36px;display:grid;place-items:center;border:1px solid #ffffff4d;border-radius:50%;font-style:normal}.landing-section{padding:90px clamp(24px,6vw,100px)}.landing-section.dark{color:#fff;background:#161817}.landing-section .section-copy{max-width:760px}.landing-section .section-copy span{color:#e87713;font-size:10px;font-weight:900;letter-spacing:1.8px}.landing-section h2{margin:9px 0 14px;font:800 clamp(38px,5vw,64px)/.95 "Bricolage Grotesque",sans-serif;letter-spacing:-2px}.landing-section .section-copy p{color:#74796f;line-height:1.7}.landing-section.dark .section-copy p{color:#9ca29c}.feature-orbit{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:45px}.feature-orbit article{min-height:190px;padding:24px;border:1px solid #ebe7df;border-radius:22px;background:#fff;transition:.25s}.feature-orbit article:hover{transform:translateY(-5px);box-shadow:0 18px 40px rgba(31,28,18,.08)}.feature-orbit span{width:45px;height:45px;display:grid;place-items:center;border-radius:14px;color:#884a08;background:#fff0d7;font-size:20px}.feature-orbit h3{margin:30px 0 8px;font-size:15px}.feature-orbit p{margin:0;color:#777d74;font-size:11px;line-height:1.65}.role-showcase{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-top:44px}.role-showcase article{min-height:290px;padding:25px;border:1px solid rgba(255,255,255,.08);border-radius:25px;background:linear-gradient(145deg,#1d201e,#111311)}.role-showcase small{color:#ffb13b;font-size:9px;font-weight:900;letter-spacing:1px}.role-showcase h3{margin:13px 0 8px;font:800 25px/1 "Bricolage Grotesque",sans-serif}.role-showcase p{color:#8f9690;font-size:11px;line-height:1.65}.role-showcase ul{display:grid;gap:9px;padding:0;margin:26px 0 0;list-style:none}.role-showcase li{display:flex;gap:8px;color:#c4c8c3;font-size:10px}.role-showcase li:before{content:"✓";color:#caff3d;font-weight:900}.landing-footer{padding:55px clamp(24px,6vw,100px);display:flex;align-items:center;justify-content:space-between;color:#777;background:#fff;border-top:1px solid #eee}.landing-footer p{font-size:10px}

/* Authentication */
.auth-screen{min-height:100vh;display:grid;grid-template-columns:minmax(360px,.9fr) minmax(440px,1.1fr);background:#fff}.auth-brand{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:center;padding:8vw;color:#fff;background:linear-gradient(145deg,#f6790d,#ffad22 58%,#789426)}.auth-brand:after{content:"";position:absolute;right:-120px;bottom:-130px;width:430px;height:430px;border:95px solid rgba(255,255,255,.12);border-radius:50%}.auth-brand>*{position:relative;z-index:2}.auth-brand h1{margin:30px 0 16px;font:800 clamp(48px,6vw,78px)/.88 "Bricolage Grotesque",sans-serif;letter-spacing:-3px}.auth-brand p{max-width:520px;color:#fff9;font-size:13px;line-height:1.7}.auth-panel{display:flex;align-items:center;justify-content:center;padding:50px}.auth-card{width:min(470px,100%)}.auth-card>a{color:#777;text-decoration:none;font-size:11px}.auth-card h2{margin:25px 0 8px;font:800 36px/1 "Bricolage Grotesque",sans-serif}.auth-card>p{margin:0 0 28px;color:#858a83;font-size:12px}.field{display:grid;gap:7px;margin:14px 0}.field label{font-size:10px;font-weight:800}.field input,.field select,.field textarea{width:100%;min-height:49px;padding:0 14px;border:1px solid #dedfd9;border-radius:12px;background:#fff;outline:none}.field textarea{min-height:110px;padding-top:12px;resize:vertical}.field input:focus,.field select:focus,.field textarea:focus{border-color:#ff9d1a;box-shadow:0 0 0 4px rgba(255,157,26,.12)}.auth-note{margin-top:18px;color:#7e827c;font-size:10px}.auth-note a{color:#e97010;font-weight:800}.demo-alert{margin:14px 0;padding:12px 14px;border:1px solid #e7ce92;border-radius:12px;color:#795c15;background:#fff8dc;font-size:10px;line-height:1.6}

/* App header additions */
.top-role-switch{display:flex;gap:4px;padding:4px;border:1px solid #e8e6df;border-radius:11px;background:#faf9f5}.top-role-switch button{min-height:31px;padding:0 10px;border:0;border-radius:8px;color:#727870;background:transparent;font-size:8px;font-weight:900;cursor:pointer}.top-role-switch button.active{color:#20231f;background:#ffad22}.consumer-header-inner.v5{grid-template-columns:220px 1fr auto}.consumer-actions .signout{border:0;background:transparent;color:#777;cursor:pointer;font-size:9px;font-weight:800}

/* Customer extensions */
.customer-dashboard-v5{max-width:1470px;margin:auto;padding:28px 30px 80px}.welcome-strip{display:grid;grid-template-columns:1.2fr .8fr;gap:16px;margin-bottom:22px}.welcome-main{position:relative;overflow:hidden;min-height:235px;padding:31px;border-radius:25px;color:#fff;background:linear-gradient(135deg,#f67b0f,#ffad22 60%,#809e2e)}.welcome-main:after{content:"";position:absolute;right:-100px;top:-90px;width:330px;height:330px;border:65px solid rgba(255,255,255,.1);border-radius:50%}.welcome-main>*{position:relative;z-index:2}.welcome-main small{font-size:9px;font-weight:900;letter-spacing:1.2px}.welcome-main h1{max-width:650px;margin:11px 0 10px;font:800 42px/.95 "Bricolage Grotesque",sans-serif;letter-spacing:-1.5px}.welcome-main p{max-width:630px;margin:0;color:#fffbd9;font-size:11px;line-height:1.65}.welcome-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:24px}.welcome-stats div{padding:13px;border:1px solid rgba(255,255,255,.18);border-radius:13px;background:rgba(255,255,255,.11)}.welcome-stats strong{display:block;font-size:18px}.welcome-stats span{font-size:8px;color:#fffbd3}.next-reward{padding:25px;border:1px solid #e9e6de;border-radius:25px;background:#fff;box-shadow:0 15px 40px rgba(36,31,20,.07)}.next-reward>span{color:#b46a0e;font-size:8px;font-weight:900;letter-spacing:1px}.next-reward h2{margin:10px 0 6px;font:800 24px/1 "Bricolage Grotesque",sans-serif}.next-reward p{color:#7c8279;font-size:10px}.next-reward .big-progress{height:11px;margin:25px 0 10px;border-radius:99px;background:#f1efe9;overflow:hidden}.next-reward .big-progress i{display:block;height:100%;width:70%;border-radius:99px;background:linear-gradient(90deg,#ff6a14,#ffad22)}.next-reward footer{display:flex;justify-content:space-between;font-size:9px}.network-missions{display:grid;grid-template-columns:1.2fr .8fr;gap:18px}.mission-card{position:relative;overflow:hidden;padding:23px;border-radius:22px;color:#fff;background:#171a18}.mission-card>span{color:#caff3d;font-size:8px;font-weight:900;letter-spacing:1px}.mission-card h3{margin:9px 0 8px;font-size:18px}.mission-card p{max-width:520px;color:#aeb3ae;font-size:10px}.mission-steps{display:flex;gap:8px;margin-top:18px}.mission-steps i{flex:1;height:7px;border-radius:10px;background:#333833}.mission-steps i.done{background:#caff3d}.mission-card b{display:block;margin-top:10px;color:#caff3d;font-size:9px}.voucher-ticket{position:relative;overflow:hidden;display:grid;grid-template-columns:1fr auto;gap:15px;align-items:center;padding:23px;border:1px solid #eadfc7;border-radius:22px;background:#fff7e6}.voucher-ticket:before,.voucher-ticket:after{content:"";position:absolute;right:92px;width:25px;height:25px;border-radius:50%;background:#fffdf9}.voucher-ticket:before{top:-13px}.voucher-ticket:after{bottom:-13px}.voucher-ticket span{color:#d16d0b;font-size:8px;font-weight:900}.voucher-ticket h3{margin:7px 0 5px}.voucher-ticket p{margin:0;color:#7d7e79;font-size:9px}.voucher-ticket button{min-height:42px;border:0;border-radius:12px;color:#fff;background:#ff7a16;font-size:9px;font-weight:900;cursor:pointer}.card-shell-shine{position:relative;overflow:hidden}.card-shell-shine:before{content:"";position:absolute;z-index:8;inset:-50% auto -50% -60%;width:22%;pointer-events:none;background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-18deg);transition:left .65s cubic-bezier(.2,.8,.2,1)}.card-shell-shine:hover:before{left:140%}

/* Lists, forms, modals */
.v5-page{max-width:1260px;margin:auto;padding:42px clamp(22px,4vw,62px) 80px}.v5-title{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;margin-bottom:28px}.v5-title span{color:#b56b10;font-size:8px;font-weight:900;letter-spacing:1.4px}.v5-title h1{margin:7px 0 8px;font:800 clamp(31px,4vw,47px)/.95 "Bricolage Grotesque",sans-serif;letter-spacing:-1.8px}.v5-title p{max-width:670px;margin:0;color:#727871;font-size:10px;line-height:1.65}.panel-v5{padding:21px;border:1px solid #e6e5df;border-radius:19px;background:#fff;box-shadow:0 13px 35px rgba(25,29,24,.05)}.grid-v5{display:grid;gap:15px}.grid-v5.two{grid-template-columns:1fr 1fr}.grid-v5.three{grid-template-columns:repeat(3,1fr)}.grid-v5.four{grid-template-columns:repeat(4,1fr)}.kpi-v5{padding:20px;border:1px solid #e6e5df;border-radius:18px;background:#fff}.kpi-v5 small{color:#7e847d;font-size:8px}.kpi-v5 strong{display:block;margin:8px 0 2px;font:800 27px/1 "Bricolage Grotesque",sans-serif}.kpi-v5 i{font-size:8px;font-style:normal;color:#5e9c31}.table-v5{overflow:hidden;border:1px solid #e5e4de;border-radius:18px;background:#fff}.table-v5 header,.table-v5 .tr{display:grid;grid-template-columns:1.3fr 1fr .75fr .75fr .45fr;gap:12px;align-items:center;padding:13px 16px}.table-v5 header{color:#7d837c;background:#f8f7f3;font-size:8px;font-weight:900;text-transform:uppercase;letter-spacing:.7px}.table-v5 .tr{border-top:1px solid #efeee9;font-size:9px}.table-v5 .tr strong{font-size:10px}.table-v5 .tr small{display:block;margin-top:3px;color:#868b85}.tag{width:max-content;padding:5px 8px;border-radius:999px;color:#5f6c41;background:#eff6df;font-size:7px;font-style:normal;font-weight:900}.tag.orange{color:#9b5c0e;background:#fff0d7}.tag.red{color:#9b2e28;background:#fde7e5}.tag.dark{color:#fff;background:#222}.toolbar-v5{display:flex;gap:9px;align-items:center;flex-wrap:wrap;margin:18px 0}.toolbar-v5 .search-box{flex:1;min-width:260px}.toolbar-v5 button{min-height:40px;padding:0 12px;border:1px solid #e0dfda;border-radius:10px;background:#fff;color:#555b55;font-size:8px;font-weight:800;cursor:pointer}.empty-v5{padding:50px 20px;text-align:center;color:#858a84}.empty-v5 b{display:block;margin-bottom:6px;color:#222}.timeline-v5{display:grid;gap:9px}.timeline-v5 article{display:grid;grid-template-columns:42px 1fr auto;gap:12px;align-items:center;padding:13px;border:1px solid #ebeae5;border-radius:14px;background:#fff}.timeline-v5>article>span{width:38px;height:38px;display:grid;place-items:center;border-radius:12px;background:#fff0d7;font-size:9px;font-weight:900}.timeline-v5 p{margin:0}.timeline-v5 strong{display:block;font-size:10px}.timeline-v5 small{color:#888e87;font-size:8px}.timeline-v5 b{font-size:10px}.modal-bg-v5{position:fixed;inset:0;z-index:160;display:grid;place-items:center;padding:20px;background:rgba(15,17,16,.62);backdrop-filter:blur(4px)}.modal-v5{width:min(650px,100%);max-height:88vh;overflow:auto;padding:25px;border-radius:24px;background:#fff;box-shadow:0 30px 90px #0005}.modal-v5 header{display:flex;justify-content:space-between;gap:16px}.modal-v5 header h2{margin:0;font:800 25px/1 "Bricolage Grotesque",sans-serif}.modal-v5 .x{width:35px;height:35px;border:0;border-radius:50%;background:#f0efeb;cursor:pointer}.modal-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:20px}.mini-button{min-height:36px;padding:0 11px;border:1px solid #e2e1dc;border-radius:9px;background:#fff;color:#4f554f;font-size:8px;font-weight:900;cursor:pointer}.mini-button.primary{border-color:#ff7a16;background:#ff7a16;color:#fff}.copy-code{display:flex;align-items:center;gap:8px}.copy-code code{padding:7px 9px;border-radius:8px;background:#f3f2ee;font-size:9px}.danger-note{padding:11px 13px;border:1px solid #f1c4bf;border-radius:12px;color:#932e25;background:#fff2f1;font-size:9px;line-height:1.5}

/* QR / Scanner */
.member-code-card{display:grid;grid-template-columns:220px 1fr;gap:24px;align-items:center}.qr-box{min-height:220px;display:grid;place-items:center;padding:16px;border:1px solid #ece8df;border-radius:20px;background:#fff}.qr-box canvas,.qr-box img{max-width:188px!important;max-height:188px!important}.member-code-info h2{margin:0 0 8px;font:800 27px/1 "Bricolage Grotesque",sans-serif}.member-code-info p{color:#747a73;font-size:10px;line-height:1.6}.member-code-info code{display:inline-block;margin:12px 0;padding:9px 12px;border-radius:9px;color:#8d570e;background:#fff0d7;font-size:12px;font-weight:900;letter-spacing:1px}.scanner-shell{display:grid;grid-template-columns:1fr 370px;gap:18px}.scanner-video{min-height:440px;display:grid;place-items:center;overflow:hidden;border-radius:24px;color:#fff;background:#151817}.scanner-video #qr-reader{width:100%;max-width:640px}.lookup-card{padding:22px;border:1px solid #e7e5df;border-radius:22px;background:#fff}.member-found{display:grid;gap:12px}.member-found>header{display:flex;align-items:center;gap:11px}.member-found .big-avatar{width:52px;height:52px;display:grid;place-items:center;border-radius:15px;color:#5d3a03;background:#ffe2ad;font-weight:900}.member-found h3{margin:0;font-size:16px}.member-found header small{color:#838983;font-size:8px}.quick-actions{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.quick-actions button{min-height:48px;border:1px solid #e3e2dc;border-radius:12px;background:#fff;font-size:9px;font-weight:900;cursor:pointer}.quick-actions button.primary{border-color:#ff7a16;color:#fff;background:#ff7a16}

/* Merchant and admin */
.console-v5{min-height:100vh;display:grid;grid-template-columns:260px minmax(0,1fr);background:#f5f4ef}.console-side{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;padding:23px 16px;color:#fff;background:#151817;overflow:auto}.console-side .consumer-logo{margin:3px 8px 22px;filter:saturate(.9)}.console-side .consumer-logo b{color:#ffad22}.console-side small.side-label{margin:16px 10px 7px;color:#666d67;font-size:7px;font-weight:900;letter-spacing:1px}.console-nav{display:grid;gap:3px}.console-nav a{min-height:42px;display:flex;align-items:center;gap:11px;padding:0 12px;border-radius:10px;color:#9fa59f;text-decoration:none;font-size:9px;font-weight:800}.console-nav a:hover{color:#fff;background:#ffffff0a}.console-nav a.active{color:#fff;background:#ffffff12}.console-nav a.active:before{content:"";width:6px;height:6px;border-radius:50%;background:#ffad22}.console-side footer{margin-top:auto;padding:15px 8px;border-top:1px solid #ffffff10}.console-side footer strong{display:block;font-size:9px}.console-side footer span{color:#747b75;font-size:7px}.console-main{min-width:0}.console-top{height:70px;display:flex;align-items:center;justify-content:space-between;padding:0 28px;border-bottom:1px solid #e7e5de;background:#fff}.console-top .crumb{font-size:9px;font-weight:800}.console-top .role-badge{padding:6px 9px;border-radius:999px;color:#855616;background:#fff0d7;font-size:7px;font-weight:900}.metric-chart{height:230px;display:flex;align-items:flex-end;gap:10px;padding:24px 10px 5px}.metric-chart i{flex:1;min-width:7px;border-radius:7px 7px 2px 2px;background:linear-gradient(#ffad22,#ff7a16);opacity:.78;transition:.2s}.metric-chart i:hover{opacity:1;transform:scaleY(1.03)}.campaign-builder{display:grid;grid-template-columns:1fr 330px;gap:18px}.audience-options{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.audience-options button{min-height:80px;padding:12px;border:1px solid #e7e5df;border-radius:13px;background:#fff;text-align:left;cursor:pointer}.audience-options button.active{border-color:#ffad22;box-shadow:0 0 0 3px #ffad2222}.audience-options strong{display:block;font-size:9px}.audience-options small{color:#868c85;font-size:7px;line-height:1.5}.health-grid{display:grid;grid-template-columns:270px 1fr;gap:18px}.health-score-v5{display:grid;place-items:center;align-content:center;min-height:280px;border-radius:22px;color:#fff;background:#151817}.health-score-v5 strong{font:800 75px/1 "Bricolage Grotesque",sans-serif;color:#caff3d}.health-score-v5 small{color:#9ca29c;font-size:9px}.check-list{display:grid;gap:9px}.check-list article{display:flex;align-items:center;gap:12px;padding:14px;border:1px solid #e7e6e0;border-radius:14px;background:#fff}.check-list article>span{width:35px;height:35px;display:grid;place-items:center;border-radius:10px;color:#4a7f24;background:#eef7df;font-weight:900}.check-list p{flex:1;margin:0}.check-list strong{display:block;font-size:9px}.check-list small{color:#838983;font-size:8px}.check-list i{font-size:8px;font-style:normal;color:#5f8c35}

/* Responsive */
@media(max-width:1080px){.landing-hero{grid-template-columns:1fr;padding-top:55px}.landing-cards{height:430px}.feature-orbit,.role-showcase{grid-template-columns:repeat(2,1fr)}.welcome-strip,.network-missions,.scanner-shell,.campaign-builder,.health-grid{grid-template-columns:1fr}.console-v5{grid-template-columns:220px 1fr}.grid-v5.four{grid-template-columns:repeat(2,1fr)}.member-code-card{grid-template-columns:1fr}.qr-box{min-height:200px}}
@media(max-width:800px){.landing-links{display:none}.landing-hero{padding-left:24px;padding-right:24px}.landing-copy h1{letter-spacing:-3px}.feature-orbit,.role-showcase,.grid-v5.two,.grid-v5.three,.grid-v5.four{grid-template-columns:1fr}.auth-screen{grid-template-columns:1fr}.auth-brand{display:none}.console-v5{display:block}.console-side{position:fixed;left:0;right:0;bottom:0;top:auto;z-index:100;width:auto;height:69px;display:block;padding:8px;background:rgba(21,24,23,.96);backdrop-filter:blur(18px)}.console-side>.consumer-logo,.console-side>small,.console-side>footer{display:none}.console-nav{display:flex;overflow-x:auto}.console-nav a{min-width:max-content}.console-main{padding-bottom:80px}.consumer-header-inner.v5{grid-template-columns:1fr auto;height:72px;padding:0 16px}.consumer-header-inner.v5>nav{display:none}.top-role-switch{display:none}.customer-dashboard-v5{padding:18px 14px 80px}.welcome-strip{grid-template-columns:1fr}.welcome-main h1{font-size:34px}.table-v5{overflow-x:auto}.table-v5 header,.table-v5 .tr{min-width:720px}.v5-title{display:grid}.landing-cards{transform:scale(.85);transform-origin:center top;margin-bottom:-50px}}
@media(max-width:520px){.landing-nav{padding:0 15px}.landing-actions .btn:not(.primary){display:none}.landing-hero{min-height:770px;gap:15px}.landing-copy h1{font-size:52px}.landing-cards{height:360px;transform:scale(.72);margin-left:-55px;margin-right:-55px}.landing-proof{gap:14px}.landing-proof strong{font-size:18px}.landing-section{padding:65px 18px}.feature-orbit,.role-showcase{grid-template-columns:1fr}.auth-panel{padding:28px 18px}.scanner-video{min-height:360px}.quick-actions{grid-template-columns:1fr}.customer-dashboard-v5{padding-left:12px;padding-right:12px}.welcome-stats{grid-template-columns:1fr}.member-code-card{display:block}.qr-box{margin-bottom:16px}}

/* v6 · wallet flip y scanner adaptados */
.stamp-grid{display:grid!important;grid-template-columns:repeat(var(--stamp-cols,5),minmax(26px,36px));grid-auto-rows:minmax(26px,36px);justify-content:center;align-content:center}
.wallet-flip-card{perspective:1200px;min-height:340px}.wallet-flip-card .wallet-card-front,.wallet-flip-card .wallet-card-back{transition:transform .62s cubic-bezier(.2,.8,.2,1),opacity .4s ease;backface-visibility:hidden}.wallet-flip-card .wallet-card-front>header{position:relative;height:126px;display:grid;place-items:center;overflow:hidden;border-bottom:6px solid var(--brand-accent);background:var(--brand-bg)}.wallet-flip-card .wallet-card-front>section{padding:16px 20px 20px;text-align:center}.wallet-card-back{position:absolute;inset:0;z-index:12;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;border-radius:22px;background:linear-gradient(145deg,#fffdf7,#fff);transform:rotateY(180deg);opacity:0}.wallet-flip-card.is-flipped .wallet-card-front{transform:rotateY(180deg);opacity:0}.wallet-flip-card.is-flipped .wallet-card-back{transform:rotateY(0);opacity:1}.wallet-card-back h3{margin:9px 0 13px;font-size:21px}.wallet-card-back code{margin-top:12px;padding:7px 10px;border-radius:8px;background:#f3eee4;font-size:9px;font-weight:900}.wallet-card-back small{max-width:220px;margin-top:10px;color:#747a73;text-align:center;font-size:8px;line-height:1.5}.wallet-card-close{position:absolute;right:14px;top:14px;width:34px;height:34px;border:0;border-radius:50%;background:#f1ede4;cursor:pointer}.wallet-mini-qr{width:155px;height:155px;display:grid;place-items:center;padding:10px;border:1px solid #ece6db;border-radius:16px;background:#fff}.wallet-mini-qr img,.wallet-mini-qr canvas{max-width:135px!important;max-height:135px!important}.wallet-card-actions{display:grid;grid-template-columns:1fr 44px;gap:8px}.wallet-card-actions>button{min-height:40px;border:1px solid var(--ink-accent);border-radius:9px;color:var(--ink-accent);background:#fff;font-size:10px;font-weight:900;cursor:pointer}.wallet-card-actions>.qr-mini{font-size:16px}.camera-select{width:100%;max-width:300px;margin:12px auto 0;padding:10px 12px;border:1px solid #484e49;border-radius:10px;color:#fff;background:#222724}.tag.lime{color:#577100;background:#eff8c9}.copy-code{display:flex;gap:7px;align-items:center;flex-wrap:wrap;padding:10px;border-radius:12px;background:#f7f4ee}.copy-code code{flex:1;min-width:180px;font-size:8px;overflow-wrap:anywhere}


/* ============================================================
   INGUIRI CLUB V7 · CUSTOMER EXPERIENCE
   Interfaz general clara + color INGUIRI. Las tarjetas conservan
   identidad de cada marca y reaccionan al toque.
   ============================================================ */
:root{
  --inguiri-coral:#f43f68;
  --inguiri-red:#ef4444;
  --inguiri-grape:#7137c8;
  --inguiri-violet:#8b5cf6;
  --inguiri-teal:#087f6b;
  --inguiri-cream:#fffaf5;
  --inguiri-ink:#17171c;
  --inguiri-soft:#f7f5f2;
}
body{background:#fffdf9}
.consumer-v7{min-height:100vh;color:var(--inguiri-ink);background:linear-gradient(180deg,#fffdf9 0,#fff 58%,#faf8f5 100%)}
.consumer-header{border-bottom:1px solid rgba(20,20,24,.06);background:rgba(255,253,249,.88);backdrop-filter:blur(20px)}
.consumer-header-inner.v7{max-width:1440px;height:78px;margin:auto;padding:0 28px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:34px}
.consumer-header-inner.v7>nav{display:flex;justify-content:center;gap:28px}
.consumer-header-inner.v7>nav a{position:relative;color:#66646b;text-decoration:none;font-size:12px;font-weight:800}
.consumer-header-inner.v7>nav a.active{color:var(--inguiri-coral)}
.consumer-header-inner.v7>nav a.active:after{content:"";position:absolute;left:25%;right:25%;bottom:-13px;height:3px;border-radius:9px;background:linear-gradient(90deg,var(--inguiri-coral),var(--inguiri-grape))}
.consumer-actions{display:flex;align-items:center;gap:9px}
.consumer-actions .profile-button{text-decoration:none}
.consumer-logo .banana-mark i{background:linear-gradient(180deg,var(--inguiri-coral),var(--inguiri-grape))}
.consumer-logo b{letter-spacing:-.5px}
.customer-v7-page{max-width:1280px;margin:auto;padding:34px 26px 110px}
.v7-greeting,.v7-page-head{display:flex;align-items:center;justify-content:space-between;gap:28px;margin-bottom:22px}
.v7-greeting>div>span,.v7-page-head>div>span{color:var(--inguiri-coral);font-size:9px;font-weight:900;letter-spacing:1.5px}
.v7-greeting h1,.v7-page-head h1{margin:7px 0 6px;font:800 clamp(30px,4vw,48px)/.98 "Bricolage Grotesque",sans-serif;letter-spacing:-1.8px}
.v7-greeting h1 i{font-style:normal;font-size:.7em}
.v7-greeting p,.v7-page-head p{margin:0;color:#77757c;font-size:11px;line-height:1.6}
.round-search{width:46px;height:46px;display:grid;place-items:center;border:1px solid #eee9e4;border-radius:50%;color:#1c1b20;background:#fff;text-decoration:none;box-shadow:0 9px 25px rgba(34,25,18,.08)}
.v7-reward-focus{position:relative;overflow:hidden;min-height:185px;display:grid;grid-template-columns:1fr auto;align-items:center;gap:20px;padding:28px 31px;margin:15px 0 29px;border:1px solid #eee1f2;border-radius:27px;background:radial-gradient(circle at 88% 15%,rgba(255,255,255,.7),transparent 25%),linear-gradient(135deg,#f5e8ff,#ffe4e7 58%,#fff1d7);box-shadow:0 18px 48px rgba(71,36,87,.07)}
.v7-reward-focus:before{content:"";position:absolute;right:-70px;bottom:-120px;width:280px;height:280px;border:45px solid rgba(244,63,104,.09);border-radius:50%}
.v7-reward-focus>*{position:relative;z-index:2}.v7-reward-focus small{font-size:9px;font-weight:900;letter-spacing:1px;color:#7137c8}.v7-reward-focus h2{margin:5px 0 2px;font:800 32px/1 "Bricolage Grotesque",sans-serif}.v7-reward-focus p{margin:0;color:#5f5d66;font-size:11px}.v7-reward-focus .focus-progress{width:min(460px,80vw);height:9px;margin:21px 0 8px;border-radius:99px;background:rgba(255,255,255,.76);overflow:hidden}.v7-reward-focus .focus-progress i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--inguiri-coral),#ff7a45,var(--inguiri-grape))}.v7-reward-focus span{font-size:9px;font-weight:800;color:#5e5364}.reward-orb{width:110px;height:110px;display:grid;place-items:center;border-radius:32px;color:#fff;background:linear-gradient(145deg,var(--inguiri-grape),var(--inguiri-coral));box-shadow:0 18px 45px rgba(113,55,200,.24);font-size:45px;transform:rotate(7deg)}
.v7-reward-focus.empty{background:linear-gradient(135deg,#f2f9f6,#f8efff)}
.v7-section-title{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin:25px 0 14px}.v7-section-title h2{margin:0 0 4px;font:800 22px/1 "Bricolage Grotesque",sans-serif}.v7-section-title p{margin:0;color:#88858d;font-size:9px}.v7-section-title>a,.v7-section-title .map-hint{color:var(--inguiri-grape);font-size:9px;font-weight:900;text-decoration:none}
.home-wallet-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.wallet-full-grid.v7{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.program-card-consumer{--card-ink:#fff;position:relative;min-height:310px;border:0!important;border-radius:25px!important;color:var(--card-ink);background:#25242a;box-shadow:0 22px 50px rgba(34,27,22,.15);transform-style:preserve-3d;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s,filter .35s;isolation:isolate}
.program-card-consumer:hover{transform:translateY(-5px) rotateX(1.2deg) rotateY(-1deg);box-shadow:0 30px 64px rgba(35,27,20,.22)}
.program-card-consumer.card-tapped{transform:translateY(-7px) scale(1.018);filter:saturate(1.12);box-shadow:0 35px 80px rgba(45,30,25,.28)}
.program-card-consumer.card-tapped:after{content:"✦";position:absolute;z-index:20;right:16%;top:13%;font-size:28px;color:white;text-shadow:0 0 15px currentColor;animation:v7spark .85s ease-out both;pointer-events:none}
@keyframes v7spark{0%{opacity:0;transform:scale(.2) rotate(-20deg)}35%{opacity:1;transform:scale(1.5) rotate(10deg)}100%{opacity:0;transform:translate(25px,-25px) scale(.7) rotate(35deg)}}
.program-card-consumer .brand-card-glow{position:absolute;inset:0;z-index:-1;opacity:.9;background:radial-gradient(circle at 80% 25%,rgba(255,255,255,.2),transparent 30%)}
.program-card-consumer.virlly{background:radial-gradient(circle at 84% 12%,#ff775d55,transparent 33%),linear-gradient(145deg,#981f22,#e52b24 54%,#ff6544)}
.program-card-consumer.mu{--card-ink:#111;background:radial-gradient(circle at 82% 12%,rgba(255,255,255,.72),transparent 24%),linear-gradient(145deg,#ffd91f,#ffba18 62%,#f19a0d)}
.program-card-consumer.jarras{background:radial-gradient(circle at 85% 20%,#ff9b3455,transparent 30%),linear-gradient(145deg,#0f5139,#126549 56%,#e77721)}
.program-card-consumer.agente{background:radial-gradient(circle at 80% 20%,#d8b69255,transparent 30%),linear-gradient(145deg,#33251d,#6a4936)}
.program-card-consumer.vao{background:radial-gradient(circle at 82% 18%,#a7f3d055,transparent 30%),linear-gradient(145deg,#433080,#724acb 55%,#0c8c84)}
.program-card-consumer.oroverde{background:linear-gradient(145deg,#7a3fc4,#e94f76)}
.program-card-consumer .wallet-card-front{position:relative;height:100%;padding:23px;backface-visibility:hidden}.program-card-consumer header{position:relative;z-index:3;display:flex;align-items:center;justify-content:space-between}.program-card-consumer .brand-lockup{display:flex;align-items:center;gap:9px}.program-card-consumer .brand-lockup img{max-width:100px;max-height:36px;object-fit:contain;filter:none}.program-card-consumer.mu .brand-lockup img{filter:brightness(0)}.program-card-consumer .brand-lockup>span{width:39px;height:39px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.28);border-radius:50%;background:rgba(255,255,255,.1);font-size:9px;font-weight:900}.program-card-consumer.mu .brand-lockup>span{border-color:#1112}.program-card-consumer .brand-lockup b{font-size:12px}.card-program-type{padding:6px 9px;border:1px solid rgba(255,255,255,.28);border-radius:999px;font-size:7px;font-weight:900;letter-spacing:.8px}.program-card-consumer.mu .card-program-type{border-color:#1113}.program-card-consumer section{position:relative;z-index:2;padding:19px 0 0!important}.program-card-consumer section>small{display:block!important;color:rgba(255,255,255,.72)!important;font-size:7px!important;font-weight:900!important;letter-spacing:.5px}.program-card-consumer.mu section>small{color:#3c3317!important}.program-card-consumer h3{max-width:70%;margin:5px 0 12px!important;color:inherit!important;font:800 22px/1.02 "Bricolage Grotesque",sans-serif!important}.card-balance{display:flex;align-items:baseline;gap:5px}.card-balance strong{font:800 31px/1 "Bricolage Grotesque",sans-serif}.card-balance span{font-size:9px;font-weight:800;opacity:.82}.loyalty-card-media{position:absolute;z-index:-1;right:-13px;bottom:5px;width:43%;height:46%;object-fit:cover;object-position:center;border-radius:24px;mix-blend-mode:normal;filter:saturate(1.05) contrast(1.03);opacity:.98;mask-image:linear-gradient(90deg,transparent 0,#000 30%)}.program-card-consumer.mu .loyalty-card-media{width:47%;height:50%}.program-card-consumer .points-progress{max-width:62%;margin:15px 0 8px}.program-card-consumer .points-progress i{display:block;height:8px;border-radius:99px;background:rgba(255,255,255,.24);overflow:hidden}.program-card-consumer .points-progress b{display:block;height:100%;border-radius:99px;background:#fff}.program-card-consumer.mu .points-progress i{background:#1112}.program-card-consumer.mu .points-progress b{background:#171717}.remaining-pill{display:inline-flex!important;align-items:center;gap:5px;margin-top:8px!important;padding:6px 9px!important;border:1px solid rgba(255,255,255,.18)!important;border-radius:999px!important;color:inherit!important;background:rgba(255,255,255,.10)!important;font-size:7px!important;font-weight:900!important}.program-card-consumer.mu .remaining-pill{border-color:#1112!important;background:#fff5!important}.wallet-card-actions{position:absolute!important;left:23px;right:23px;bottom:21px;display:flex!important;justify-content:space-between!important;align-items:center!important}.wallet-card-actions button{border:0!important;color:inherit!important;background:transparent!important;font-size:8px!important;font-weight:900!important;cursor:pointer}.wallet-card-actions .qr-mini{width:34px;height:34px;border:1px solid rgba(255,255,255,.25)!important;border-radius:50%!important;background:rgba(255,255,255,.08)!important}.program-card-consumer.mu .wallet-card-actions .qr-mini{border-color:#1113!important;background:#fff4!important}
.stamp-grid{max-width:64%;display:flex!important;flex-wrap:wrap!important;gap:6px!important;margin-top:12px!important}.consumer-stamp{width:24px!important;height:24px!important;border:1px solid rgba(255,255,255,.32)!important;border-radius:50%!important;background:rgba(255,255,255,.08)!important}.consumer-stamp.active{background:#fff!important;color:#d9272a!important;box-shadow:0 0 15px rgba(255,255,255,.34)}.program-card-consumer.mu .consumer-stamp{border-color:#1113!important}.program-card-consumer.mu .consumer-stamp.active{background:#111!important;color:#ffd51f!important}
.card-shell-shine:before{z-index:15!important;width:16%!important;background:linear-gradient(90deg,transparent,rgba(255,255,255,.72),transparent)!important;transition:left .72s cubic-bezier(.2,.8,.2,1)!important}.card-shell-shine:hover:before,.card-shell-shine.card-tapped:before{left:145%!important}
.wallet-empty-v7{min-height:240px;display:grid;place-items:center;align-content:center;gap:8px;padding:30px;border:1px dashed #dad5cf;border-radius:25px;background:#fff;text-align:center}.wallet-empty-v7>span{width:54px;height:54px;display:grid;place-items:center;border-radius:18px;color:var(--inguiri-grape);background:#f2ecff;font-size:22px}.wallet-empty-v7 h3{margin:3px 0 0;font-size:17px}.wallet-empty-v7 p{max-width:420px;margin:0;color:#85828a;font-size:10px;line-height:1.55}.wallet-empty-v7 a{margin-top:5px;color:var(--inguiri-coral);font-size:9px;font-weight:900;text-decoration:none}.wallet-empty-v7.large{grid-column:1/-1;min-height:330px}
.v7-owned-promo{position:relative;overflow:hidden;padding:25px;border-radius:22px;color:#0d4c3a;background:linear-gradient(135deg,#e4f5ef,#fff7ee);border:1px solid #dbeee5}.v7-owned-promo>span{font-size:8px;font-weight:900;letter-spacing:1px}.v7-owned-promo h3{margin:8px 0 5px;font:800 20px/1 "Bricolage Grotesque",sans-serif}.v7-owned-promo p{max-width:600px;color:#567069;font-size:10px}.v7-owned-promo a{color:#0d6f58;font-size:9px;font-weight:900;text-decoration:none}.v7-explore-cta{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:34px;padding:28px;border:1px solid #ece6f4;border-radius:25px;background:linear-gradient(135deg,#faf5ff,#fff8f4)}.v7-explore-cta span{color:var(--inguiri-grape);font-size:8px;font-weight:900;letter-spacing:1.2px}.v7-explore-cta h2{margin:7px 0 5px;font:800 23px/1 "Bricolage Grotesque",sans-serif}.v7-explore-cta p{max-width:680px;margin:0;color:#7e7a82;font-size:10px;line-height:1.6}.v7-explore-cta .btn{flex:0 0 auto;border-color:#ded3ec;color:#5b2ba8;background:#fff}
.qr-card-cta{min-width:245px;display:flex;align-items:center;gap:12px;padding:13px;border:1px solid #e5e0eb;border-radius:18px;color:#242127;background:linear-gradient(135deg,#f3ebff,#fff);text-decoration:none}.qr-card-cta>b{width:46px;height:46px;display:grid;place-items:center;border-radius:14px;color:#fff;background:linear-gradient(145deg,var(--inguiri-grape),var(--inguiri-coral));font-size:20px}.qr-card-cta span{display:grid;gap:3px}.qr-card-cta strong{font-size:10px}.qr-card-cta small{color:#88838d;font-size:8px}
.explore-v7 .v7-page-head.compact{align-items:flex-end}.search-box.v7{min-width:min(430px,45vw);border-radius:999px!important;background:#fff!important;box-shadow:0 8px 24px rgba(49,34,26,.06)}.explore-chips{display:flex;gap:8px;overflow-x:auto;padding:5px 0 13px;scrollbar-width:none}.explore-chips button{white-space:nowrap;padding:9px 14px;border:1px solid #ece8e4;border-radius:999px;color:#56535a;background:#fff;font-size:8px;font-weight:800;cursor:pointer}.explore-chips button.active{border-color:#4e2a89;color:#fff;background:linear-gradient(135deg,var(--inguiri-grape),#8c54dc)}.explore-grid-v7{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.explore-card-v7{overflow:hidden;border:1px solid #ece8e4;border-radius:20px;background:#fff;box-shadow:0 9px 25px rgba(30,25,20,.05);cursor:pointer;transition:.25s}.explore-card-v7:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(30,25,20,.11)}.explore-media{position:relative;height:165px;background-position:center;background-size:cover;background-color:#eee}.explore-card-v7.mu .explore-media{background-color:#ffd41f}.explore-card-v7.agente .explore-media{background:linear-gradient(145deg,#38291f,#9a775e)}.explore-card-v7.vao .explore-media{background:linear-gradient(145deg,#6c3ac4,#13a091)}.explore-media:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 35%,rgba(0,0,0,.35))}.explore-initial{position:absolute;z-index:2;left:15px;bottom:13px;width:45px;height:45px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.55);border-radius:50%;color:#fff;background:rgba(17,17,17,.42);backdrop-filter:blur(8px);font-size:9px;font-weight:900}.explore-card-v7.mu .explore-initial{color:#111;background:#ffd41f;border-color:#1111}.explore-media>i{position:absolute;z-index:3;right:10px;top:10px;padding:6px 8px;border-radius:999px;color:#0c684f;background:#e4fff4;font-size:7px;font-style:normal;font-weight:900}.explore-info{padding:14px}.explore-info>small{color:#99949d;font-size:7px}.explore-info h3{margin:3px 0 6px;font-size:14px}.explore-info p{min-height:32px;margin:0;color:#66626a;font-size:8px;line-height:1.5}.explore-info footer{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:12px}.explore-info footer>span{color:#858089;font-size:7px}.explore-info button{padding:7px 10px;border:0;border-radius:999px;color:#fff;background:var(--inguiri-coral);font-size:7px;font-weight:900;cursor:pointer}.explore-info button.joined{color:#0e6a52;background:#e3f7f0}
.explore-detail-v7{overflow:hidden;margin:-28px;border-radius:25px;background:#fff}.explore-detail-hero{position:relative;height:250px;display:grid;place-items:center;background-size:cover;background-position:center;background-color:#eee}.explore-detail-hero:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at center,transparent 0,transparent 25%,rgba(0,0,0,.2) 100%)}.explore-detail-v7.mu .explore-detail-hero{background-color:#ffd51f}.explore-detail-v7.agente .explore-detail-hero{background:linear-gradient(145deg,#38291f,#9a775e)}.explore-detail-v7.vao .explore-detail-hero{background:linear-gradient(145deg,#6c3ac4,#13a091)}.explore-detail-hero>span{position:relative;z-index:2;width:82px;height:82px;display:grid;place-items:center;border-radius:50%;color:#fff;background:rgba(18,18,18,.5);backdrop-filter:blur(9px);font-size:15px;font-weight:900}.explore-detail-v7.mu .explore-detail-hero>span{color:#111;background:#ffd51f}.explore-detail-hero>i{position:absolute;z-index:2;right:27px;top:24px;color:#fff;font-size:26px;font-style:normal}.x.floating{position:absolute;z-index:20;right:18px;top:18px;width:38px;height:38px;border:1px solid #ffffff55;border-radius:50%;color:#fff;background:#1118;cursor:pointer}.explore-detail-body{padding:25px}.explore-detail-body>small{color:var(--inguiri-coral);font-size:8px;font-weight:900}.explore-detail-body h2{margin:5px 0 7px;font:800 29px/1 "Bricolage Grotesque",sans-serif}.explore-detail-body>p{color:#77727b;font-size:10px;line-height:1.6}.program-rule-v7{display:flex;justify-content:space-between;gap:15px;margin:18px 0;padding:14px;border-radius:15px;background:#f7f3fb}.program-rule-v7 strong{color:#5f2aa6;font-size:10px}.program-rule-v7 span{font-size:9px}.detail-links-v7{display:grid;border-top:1px solid #eee}.detail-links-v7 button{display:flex;align-items:center;justify-content:space-between;padding:13px 0;border:0;border-bottom:1px solid #eee;background:transparent;text-align:left;font-size:9px;font-weight:800}.join-v7{width:100%;min-height:48px;margin-top:20px;border:0;border-radius:14px;color:#fff;background:linear-gradient(90deg,var(--inguiri-coral),#ff6649);font-size:10px;font-weight:900;cursor:pointer}.join-v7.joined{color:#11664f;background:#e5f5ef}.join-note{display:block!important;margin-top:9px;text-align:center;color:#aaa5ad!important;font-size:7px!important}
.voucher-v7{padding:22px;border:1px solid #ebe5df;border-radius:21px;background:#fff}.voucher-v7>span{color:var(--inguiri-coral);font-size:8px;font-weight:900}.voucher-v7 h3{margin:8px 0 5px}.voucher-v7 p{color:#77727b;font-size:9px;line-height:1.55}.voucher-v7 small{display:block;color:#aaa4ad;font-size:7px}.voucher-v7 button{width:100%;margin-top:17px;padding:10px;border:0;border-radius:12px;color:#fff;background:var(--inguiri-grape);font-size:8px;font-weight:900;cursor:pointer}
/* Landing keeps its dynamic cards, but MR MU owns yellow — INGUIRI itself does not. */
.hero-program:nth-child(2){background:linear-gradient(135deg,#ffd91f,#ffb515)!important;color:#111!important}.hero-program:nth-child(2) p{color:#342c15!important}.hero-program:nth-child(2) .brand-line img{filter:brightness(0)}.hero-program:nth-child(2) .brand-line span,.hero-program:nth-child(2) footer i{border-color:#1113!important;color:#111!important}
/* Mobile dock inspired by a clean consumer app, with the QR as the central action. */
.consumer-bottom-nav.v7{position:fixed;z-index:90;left:50%;bottom:0;transform:translateX(-50%);width:min(100%,760px);height:76px;display:grid;grid-template-columns:repeat(5,1fr);align-items:center;padding:6px 8px calc(6px + env(safe-area-inset-bottom));border:1px solid #eee8e2;border-bottom:0;border-radius:24px 24px 0 0;background:rgba(255,255,255,.96);box-shadow:0 -15px 40px rgba(32,26,21,.09);backdrop-filter:blur(18px)}.consumer-bottom-nav.v7 a{position:relative;min-width:0;display:grid;place-items:center;gap:3px;color:#7c7780;text-decoration:none;font-size:8px;font-weight:800}.consumer-bottom-nav.v7 a>span:first-child{font-size:18px}.consumer-bottom-nav.v7 a.active{color:var(--inguiri-grape)}.consumer-bottom-nav.v7 .qr-dock{width:61px;height:61px;justify-self:center;margin-top:-29px;border:6px solid #fff;border-radius:50%;color:#fff;background:linear-gradient(145deg,var(--inguiri-grape),var(--inguiri-coral));box-shadow:0 11px 30px rgba(113,55,200,.28)}.consumer-bottom-nav.v7 .qr-dock>span:first-child{font-size:24px}.consumer-bottom-nav.v7 .qr-dock>span:last-child{position:absolute;top:61px;color:#726e76;font-size:7px}
@media(min-width:801px){.consumer-bottom-nav.v7{display:none}}
@media(max-width:1080px){.home-wallet-row{grid-template-columns:repeat(2,minmax(0,1fr))}.explore-grid-v7{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:800px){.consumer-header-inner.v7{height:68px;padding:0 16px;grid-template-columns:1fr auto}.consumer-header-inner.v7>nav{display:none}.consumer-actions .profile-button{display:none}.customer-v7-page{padding:22px 14px 108px}.v7-greeting,.v7-page-head{align-items:flex-start}.v7-page-head{display:grid}.qr-card-cta{min-width:0;width:100%}.home-wallet-row,.wallet-full-grid.v7{grid-template-columns:1fr}.program-card-consumer{min-height:300px}.explore-v7 .v7-page-head.compact{display:grid}.search-box.v7{min-width:0;width:100%}.explore-grid-v7{grid-template-columns:repeat(2,minmax(0,1fr))}.v7-explore-cta{display:grid}.v7-reward-focus{min-height:165px;padding:23px}.reward-orb{width:78px;height:78px;border-radius:24px;font-size:30px}}
@media(max-width:520px){.v7-greeting h1,.v7-page-head h1{font-size:30px}.v7-greeting p,.v7-page-head p{font-size:9px}.v7-reward-focus{grid-template-columns:1fr auto}.v7-reward-focus .focus-progress{width:100%}.reward-orb{width:64px;height:64px;border-radius:20px}.program-card-consumer{min-height:285px}.program-card-consumer h3{font-size:20px!important}.loyalty-card-media{width:46%;height:42%}.explore-grid-v7{grid-template-columns:1fr 1fr;gap:10px}.explore-media{height:125px}.explore-info{padding:11px}.explore-info h3{font-size:12px}.explore-info p{font-size:7px}.consumer-bottom-nav.v7{width:100%;border-radius:20px 20px 0 0}}