.vendor-showcase{--vendor-accent:#c7ef48;--vendor-ink:#17251e;position:relative;overflow:hidden;margin:clamp(48px,7vw,96px) auto;padding:clamp(28px,5vw,64px);max-width:1480px;border:1px solid #e2e9df;border-radius:32px;background:radial-gradient(ellipse at 90% 0%,#eef4e7 0,transparent 42%),linear-gradient(145deg,#fbfcf8,#f2f6ed);color:var(--vendor-ink)}
.vendor-showcase-heading{max-width:800px;margin:0 auto 34px;text-align:center}
.vendor-showcase-heading .eyebrow{color:#738c45}
.vendor-showcase-heading h2{margin:10px 0 12px;font:800 clamp(2rem,4vw,3.35rem)/1.08 Manrope, sans-serif;letter-spacing:-.045em}
.vendor-showcase-heading p{margin:0 auto;max-width:700px;color:#637267;font-size:1.06rem;line-height:1.7}
.vendor-showcase-layout{max-width:1180px;margin:auto}
.vendor-preview-tabs{display:flex;gap:9px;flex-wrap:wrap;margin:0 0 14px}
.vendor-preview-tabs span{padding:10px 14px;border:1px solid #dce5d8;border-radius:999px;background:#fff;color:#526052;font-size:.83rem;font-weight:700}
.vendor-preview-tabs .is-active{border-color:var(--vendor-accent);background:#f3f9df;color:#26391e;box-shadow:inset 0 0 0 1px #c7ef48}
.vendor-dashboard-mock{display:grid;grid-template-columns:205px minmax(0,1fr);min-height:400px;overflow:hidden;border:1px solid #dbe3d8;border-radius:22px;background:#fff;box-shadow:0 24px 70px #1d302311}
.mock-sidebar{padding:22px 14px;background:#252832;color:#f5f4f7}
.mock-brand{display:flex;align-items:center;gap:9px;margin:0 0 30px;font-weight:800;font-size:1rem}
.mock-brand span{display:grid;place-items:center;width:30px;height:30px;border-radius:10px;background:var(--vendor-accent);color:#1c281b;font-size:.7rem}
.mock-sidebar>small{display:block;padding:0 10px 10px;color:#a4a8b0;font-size:.62rem;font-weight:800;letter-spacing:.13em}
.mock-nav{margin:3px 0;padding:10px;border-radius:10px;color:#d8d9df;font-size:.82rem}
.mock-nav.active{background:color-mix(in srgb,var(--vendor-accent) 25%,#373946);color:#fff;font-weight:800}
.mock-main{min-width:0;padding:0 24px 22px;background:#f8faf7}
.mock-topbar{height:56px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e7ebe5;color:#738076;font-size:.78rem}
.mock-user{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#eadfce;color:#503c2a;font-weight:800}
.mock-welcome{display:flex;align-items:flex-start;justify-content:space-between;gap:15px;padding:24px 0 18px}
.mock-welcome small,.mock-panel small{color:#7e8b7d;font-size:.62rem;font-weight:800;letter-spacing:.12em}
.mock-welcome h3{margin:7px 0 5px;font:800 clamp(1.35rem,2.5vw,1.8rem)/1.2 Manrope,sans-serif;letter-spacing:-.03em}
.mock-welcome p{margin:0;color:#778277;font-size:.85rem}
.mock-weather{white-space:nowrap;padding:8px 11px;border:1px solid #e8ece6;border-radius:12px;background:#fff;font-size:.8rem}
.mock-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.mock-stats>div{display:grid;gap:6px;min-width:0;padding:13px;border:1px solid #e5eae2;border-radius:13px;background:#fff}
.mock-stats small,.mock-stats span{color:#839083;font-size:.69rem}
.mock-stats b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.83rem}
.mock-lower{display:grid;grid-template-columns:1.3fr .8fr;gap:10px;margin-top:12px}
.mock-panel{display:grid;gap:8px;padding:14px;border:1px solid #e5eae2;border-radius:14px;background:#fff;font-size:.8rem}
.mock-panel p{display:flex;justify-content:space-between;gap:8px;margin:0;padding-top:7px;border-top:1px solid #eff1ed;color:#68746a;font-size:.73rem}
.mock-panel p span{color:#668544;font-weight:700}
.mock-focus{align-content:center;background:linear-gradient(140deg,#25372c,#374a38);color:#fff}
.mock-focus small{color:#c9e98b}
.mock-focus b{font:800 1.05rem Manrope,sans-serif}
.mock-focus>span{color:#d1d8cc;font-size:.73rem}
.mock-caption{grid-column:1/-1;display:flex;align-items:center;gap:12px;padding:14px 18px;border-top:1px solid #e7ebe5;background:#fff}
.mock-caption>span{font-size:1.45rem}
.mock-caption div{display:grid;gap:3px}
.mock-caption b{font-size:.84rem}
.mock-caption small{color:#7a867b;font-size:.72rem}
.mock-caption i{margin-left:auto;color:#899388;font-size:.68rem;font-style:normal}
.vendor-showcase-foot{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:16px}
.vendor-showcase-foot span{padding:10px 13px;border:1px solid #e0e7db;border-radius:12px;background:#ffffffb8;color:#58665a;font-size:.78rem}
.vendor-showcase-link{display:table;margin:22px auto 0;color:#344c2a;font-weight:800;text-decoration:none}
.vendor-showcase-link:hover{text-decoration:underline}
.vendor-style-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;max-width:1180px;margin:auto}
.vendor-style-card{--vendor-accent:#cf6840;overflow:hidden;border:1px solid #e1e8de;border-radius:20px;background:#fff;box-shadow:0 15px 38px #1d30220c}
.vendor-style-coffee{--vendor-accent:#a8764d}
.vendor-style-events{--vendor-accent:#7184b7}
.vendor-style-head{display:flex;align-items:center;gap:11px;padding:17px 17px 14px}
.vendor-style-head>span{display:grid;place-items:center;width:42px;height:42px;border-radius:14px;background:color-mix(in srgb,var(--vendor-accent) 14%,white);font-size:1.35rem}
.vendor-style-head div{display:grid;gap:3px}
.vendor-style-head b{font-size:.94rem}
.vendor-style-head small{color:#7a867c;font-size:.71rem}
.vendor-style-head i{margin-left:auto;color:#a3aaa1;font-size:.7rem;font-style:normal}
.vendor-mini-screen{margin:0 12px;border:1px solid #e5eae3;border-radius:14px;background:#f7f9f5;padding:12px}
.vendor-mini-top{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px;font-size:.72rem}
.vendor-mini-top span{color:#79857a;font-size:.65rem}
.vendor-mini-hero{display:grid;gap:4px;padding:14px;border-radius:12px;background:linear-gradient(125deg,color-mix(in srgb,var(--vendor-accent) 24%,#26332c),#293831);color:#fff}
.vendor-mini-hero small{color:#e4eddb;font-size:.56rem;font-weight:800;letter-spacing:.12em}
.vendor-mini-hero b{font:800 1.05rem Manrope,sans-serif}
.vendor-mini-hero span{color:#e0e5dc;font-size:.68rem}
.vendor-mini-tiles{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:9px}
.vendor-mini-tiles span{display:grid;gap:5px;padding:9px;border:1px solid #e5eae3;border-radius:10px;background:#fff;color:#68746a;font-size:.65rem}
.vendor-mini-tiles b{color:#344036;font-size:.68rem}
.vendor-style-card>p{min-height:60px;margin:0;padding:14px 17px 17px;color:#6c796e;font-size:.78rem;line-height:1.55}
.vendor-showcase-disclaimer{margin:20px 0 0;text-align:center;color:#788478;font-size:.75rem}
@media(max-width:900px){.vendor-style-grid{grid-template-columns:1fr 1fr}.vendor-style-card:last-child{grid-column:1/-1}.vendor-dashboard-mock{grid-template-columns:165px minmax(0,1fr)}}
@media(max-width:620px){.vendor-showcase{margin:38px 12px;padding:25px 14px;border-radius:23px}.vendor-showcase-heading{margin-bottom:24px}.vendor-showcase-heading h2{font-size:2rem}.vendor-showcase-heading p{font-size:.94rem}.vendor-preview-tabs{flex-wrap:nowrap;overflow-x:auto;padding-bottom:5px;scrollbar-width:thin}.vendor-preview-tabs span{flex:none}.vendor-dashboard-mock{grid-template-columns:1fr;min-height:0;border-radius:17px}.mock-sidebar{display:none}.mock-main{padding:0 13px 14px}.mock-topbar{height:45px}.mock-welcome{padding:17px 0 13px}.mock-welcome p{font-size:.75rem}.mock-stats{gap:6px}.mock-stats>div{padding:9px 7px}.mock-stats small,.mock-stats span{font-size:.6rem}.mock-stats b{font-size:.69rem}.mock-lower{grid-template-columns:1fr}.mock-focus{display:none}.mock-caption{padding:12px}.mock-caption i{display:none}.vendor-showcase-foot{display:grid;gap:7px}.vendor-showcase-foot span{font-size:.73rem}.vendor-style-grid{grid-template-columns:1fr}.vendor-style-card:last-child{grid-column:auto}.vendor-style-card>p{min-height:0}.vendor-showcase-features{margin-left:12px;margin-right:12px}}

/* Personalised vendor workspace shortcuts */
.vendor-theme-choice{margin:22px 0;padding:22px;border:1px solid #e2e9df;border-radius:20px;background:linear-gradient(135deg,#fbfcf8,#f2f6ed)}
.vendor-theme-choice h3{margin:6px 0;font:800 1.25rem Manrope,sans-serif;color:#1f3026}
.vendor-theme-choice p{max-width:700px;margin:0;color:#69776c;line-height:1.55}
.vendor-theme-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,205px),1fr));gap:9px;margin:17px 0 12px}
.vendor-theme-option{--pack-accent:#82916f;display:flex;align-items:center;gap:10px;width:100%;min-width:0;min-height:78px;padding:12px;border:1px solid #e1e8de;border-radius:14px;background:#fff;color:#27352c;text-align:left;cursor:pointer;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.vendor-theme-option>span:first-child{display:grid;place-items:center;flex:0 0 38px;width:38px;height:38px;border-radius:12px;background:color-mix(in srgb,var(--pack-accent) 15%,white);font-size:1.35rem}
.vendor-theme-option-copy{display:grid;flex:1 1 auto;gap:4px;min-width:0;align-content:center}.vendor-theme-option-copy>b{font-size:.83rem;line-height:1.25;overflow-wrap:anywhere}.vendor-theme-option-copy>small{color:#748176;font-size:.7rem;line-height:1.35;overflow-wrap:anywhere}.vendor-theme-option:before{content:"";align-self:stretch;width:4px;flex:0 0 4px;border-radius:4px;background:var(--pack-accent);opacity:.8}
.vendor-theme-option:hover,.vendor-theme-option.is-selected{transform:translateY(-1px);border-color:var(--pack-accent);box-shadow:0 5px 18px color-mix(in srgb,var(--pack-accent) 14%,transparent)}
.vendor-theme-option.is-selected{background:color-mix(in srgb,var(--pack-accent) 6%,white);box-shadow:inset 0 0 0 1px var(--pack-accent)}
.vendor-theme-option:focus-visible{outline:3px solid color-mix(in srgb,var(--pack-accent) 45%,white);outline-offset:2px}
.vendor-theme-skip{padding:7px 0;color:#526745;font-weight:700}
.vendor-dashboard-quick{--vendor-accent:var(--vendor-pack-accent,#82916f);position:relative;overflow:hidden;border-color:color-mix(in srgb,var(--vendor-accent) 35%,white)!important}
.vendor-dashboard-quick:before{content:"";position:absolute;inset:0 0 auto;height:5px;background:linear-gradient(90deg,var(--vendor-accent),color-mix(in srgb,var(--vendor-accent) 25%,white))}
.vendor-dashboard-quick .eyebrow{color:var(--vendor-accent)!important}
.vendor-dashboard-quick .dashboard-quick-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:18px}
.vendor-dashboard-quick .dashboard-quick-grid button{display:flex;align-items:center;gap:11px;min-width:0;padding:13px;border:1px solid color-mix(in srgb,var(--vendor-accent) 20%,#e5eae3);border-radius:14px;background:color-mix(in srgb,var(--vendor-accent) 5%,white);color:#27352c;text-align:left;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.vendor-dashboard-quick .dashboard-quick-grid button:hover{transform:translateY(-2px);border-color:var(--vendor-accent);box-shadow:0 8px 22px color-mix(in srgb,var(--vendor-accent) 14%,transparent)}
.vendor-dashboard-quick .dashboard-quick-grid button>span{display:grid;place-items:center;flex:0 0 38px;width:38px;height:38px;border-radius:12px;background:color-mix(in srgb,var(--vendor-accent) 17%,white);font-size:1.2rem}
.vendor-dashboard-quick .dashboard-quick-grid button>b{font-size:.83rem}
@media(max-width:720px){.vendor-dashboard-quick .dashboard-quick-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.vendor-theme-choice{padding:16px}.vendor-theme-options{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.vendor-theme-option{min-height:76px;padding:9px;gap:8px}.vendor-theme-option>span:first-child{flex-basis:32px;width:32px;height:32px;font-size:1.15rem}.vendor-theme-option-copy>b{font-size:.74rem}.vendor-theme-option-copy>small{font-size:.65rem}}
@media(max-width:420px){.vendor-dashboard-quick .dashboard-quick-grid button{padding:10px;gap:8px}.vendor-dashboard-quick .dashboard-quick-grid button>b{font-size:.75rem}}
@media(prefers-reduced-motion:reduce){.vendor-dashboard-quick .dashboard-quick-grid button{transition:none}.vendor-dashboard-quick .dashboard-quick-grid button:hover{transform:none}}