/* ─── Store page-specific styles ─── */

/* Store grid — product category cards */
.store-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--card-gap)}
.store-card{background:var(--color-bg);border:1px solid var(--color-border);overflow:hidden;transition:box-shadow var(--transition);display:flex;flex-direction:column}
.store-card:hover{box-shadow:var(--shadow-md)}
.store-card-image{width:100%;height:250px;object-fit:cover}
.store-card-body{padding:28px;display:flex;flex-direction:column;flex:1}
.store-card-body h3{font-family:var(--font-heading);font-weight:700;font-size:1rem;text-transform:uppercase;letter-spacing:1.5px;margin-bottom:12px;color:var(--color-text)}
.store-card-body p{font-size:.9375rem;color:var(--color-text-light);line-height:1.7;margin-bottom:16px}
.store-card-body ul{margin-bottom:24px}
.store-card-body>.btn{margin-top:auto}
.store-card-body ul li{padding:6px 0 6px 22px;position:relative;font-size:.9375rem;color:var(--color-text-light)}
.store-card-body ul li::before{content:"\2713";position:absolute;left:0;color:var(--color-primary);font-weight:600;font-size:.875rem}

/* How to order — 3-column step grid */
.how-to-order{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--card-gap);margin-top:48px}
.how-to-order-step{text-align:center;padding:32px 24px}
.how-to-order-step .step-number{display:inline-flex;align-items:center;justify-content:center;width:56px;height:56px;border:2px solid var(--color-primary);color:var(--color-primary);font-family:var(--font-heading);font-weight:700;font-size:1.25rem;margin-bottom:20px}
.how-to-order-step h3{font-family:var(--font-heading);font-weight:600;font-size:.875rem;text-transform:uppercase;letter-spacing:1.5px;margin-bottom:10px}
.how-to-order-step p{font-size:.9375rem;color:var(--color-text-light);line-height:1.7}
.how-to-order-ctas{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;margin-top:48px}

/* Full product range — compact grid with popover */
.range-grid{display:flex;flex-direction:column;gap:32px;margin-top:48px}
.range-group-title{font-family:var(--font-heading);font-weight:700;font-size:.75rem;text-transform:uppercase;letter-spacing:2px;color:var(--color-primary);margin-bottom:12px;padding-bottom:8px;border-bottom:1px solid var(--color-border)}

/* Flat row (bars, boards, gear, foil assist) */
.range-pills{display:flex;flex-wrap:wrap;gap:8px}

/* Family columns (kites, foils, wings — tiers stacked vertically) */
.range-families{display:flex;flex-wrap:wrap;gap:12px 16px;align-items:flex-start}
.range-family{display:flex;flex-direction:column;gap:4px}

/* Individual pill */
.range-pill{background:var(--color-bg);border:1px solid var(--color-border);padding:8px 16px;font-family:var(--font-body);font-size:.875rem;color:var(--color-text);cursor:pointer;transition:all .2s ease;line-height:1.4;text-align:left;white-space:nowrap}
.range-pill:hover,.range-pill.active{background:var(--color-text);color:var(--color-bg);border-color:var(--color-text)}

/* Spare parts note */
.range-note{font-size:.875rem;color:var(--color-text-light);margin-top:32px;padding-top:16px;border-top:1px solid var(--color-border)}
.range-note a{color:var(--color-primary);text-decoration:underline}

/* Popover — fixed bottom sheet on all devices */
.range-popover{position:fixed;bottom:0;left:0;right:0;z-index:100;transform:translateY(100%);transition:transform .3s cubic-bezier(.4,0,.2,1);pointer-events:none}
.range-popover.visible{transform:translateY(0);pointer-events:auto}
.range-popover-inner{max-width:600px;margin:0 auto;background:var(--color-text);color:var(--color-bg);padding:20px 24px;box-shadow:0 -4px 24px rgba(0,0,0,.25);display:flex;gap:20px;align-items:flex-start}
.range-popover-img{width:120px;height:120px;object-fit:contain;flex-shrink:0;background:rgba(255,255,255,.08);display:none}
.range-popover-img.has-img{display:block}
.range-popover-body{flex:1;min-width:0}
.range-popover-name{font-family:var(--font-heading);font-weight:700;font-size:1rem;text-transform:uppercase;letter-spacing:1px;margin-bottom:4px}
.range-popover-tags{font-size:.75rem;text-transform:uppercase;letter-spacing:1px;color:var(--color-primary);margin-bottom:10px}
.range-popover-sizes{font-size:.8125rem;color:var(--color-primary);letter-spacing:.5px;margin-bottom:8px;display:none}
.range-popover-sizes.has-sizes{display:block}
.range-popover-desc{font-size:.9375rem;line-height:1.6;opacity:.85;margin-bottom:16px}
.range-popover-actions{display:flex;align-items:center;gap:8px}
.range-popover-cta{display:inline-block}
.range-popover-icon{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border:1px solid rgba(255,255,255,.2);color:rgba(255,255,255,.6);transition:all .2s ease}
.range-popover-icon:hover{color:#fff;border-color:rgba(255,255,255,.5);background:rgba(255,255,255,.1)}
.range-popover-icon svg{width:18px;height:18px}

/* Hide WhatsApp FAB when product popover is open (popover has its own CTA) */
.wa-widget.wa-raised{opacity:0;pointer-events:none;transition:opacity .3s ease}

/* Responsive overrides */
@media(max-width:768px){
  .store-grid{grid-template-columns:1fr}
  .how-to-order{grid-template-columns:1fr}
  .range-pill{padding:6px 12px;font-size:.8125rem}
  .range-families{gap:8px 10px}
  .range-popover-inner{padding:16px;gap:14px}
  .range-popover-img{width:80px;height:80px}
  .range-popover-name{font-size:.875rem}
  .range-popover-desc{font-size:.8125rem;margin-bottom:12px}
}
@media(min-width:769px) and (max-width:1024px){
  .store-grid{grid-template-columns:repeat(2,1fr)}
}