.shop-page { background:#f6f6f6; min-height:60vh; }
.shop-flash { padding:.9rem clamp(1.25rem,10vw,11rem); background:var(--lime); font-weight:700; }
.shop-flash-error { background:var(--pink); color:#a3270c; }
.shop-hero { position:relative; display:flex; min-height:clamp(500px,66vh,700px); align-items:center; isolation:isolate; background:linear-gradient(90deg,rgba(255,248,240,.97) 0%,rgba(255,248,240,.89) 43%,rgba(255,248,240,.16) 100%),url('../images/shop/intro-background.jpg') center/cover; }
.shop-hero-copy { max-width:680px; }
.shop-hero h1 { margin:.6rem 0 1.1rem; font-size:clamp(3.2rem,7vw,6.5rem); }
.shop-hero h1 em { color:var(--coral); }
.shop-hero-copy > p:not(.eyebrow):not(.shop-payment-note) { max-width:590px; font-size:clamp(1rem,1.5vw,1.2rem); line-height:1.65; }
.shop-hero-actions { display:flex; flex-wrap:wrap; align-items:center; gap:1.2rem; margin-top:1.5rem; }
.shop-text-link { display:inline-flex; align-items:center; gap:.5rem; color:var(--ink); font-size:.82rem; font-weight:800; text-decoration:underline; text-underline-offset:.25rem; }
.shop-payment-note { margin:1.4rem 0 0; color:#555; font-size:.75rem; }
.shop-values { display:grid; grid-template-columns:repeat(3,1fr); padding:0 clamp(1.25rem,10vw,11rem); background:var(--ink); color:#fff; }
.shop-values > div { position:relative; padding:1.6rem 1.5rem 1.65rem 0; }
.shop-values > div + div { padding-left:1.5rem; border-left:1px solid rgba(255,255,255,.22); }
.shop-values span { display:block; margin-bottom:.55rem; color:var(--sun); font:.65rem var(--mono); }
.shop-values strong { display:block; margin-bottom:.3rem; font:600 1.15rem var(--serif); }
.shop-values p { max-width:290px; margin:0; color:#dededc; font-size:.78rem; }
.shop-collection { background:#fbf8f2; }
.shop-section-heading { display:flex; align-items:end; justify-content:space-between; gap:2rem; margin-bottom:2rem; }
.shop-section-heading h2 { margin:.5rem 0 0; font-size:clamp(2.2rem,4.5vw,4.3rem); }
.shop-section-heading > p { max-width:390px; margin:0 0 .35rem; color:#535353; font-size:.92rem; line-height:1.65; }
.shop-collection-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.25rem; }
.shop-collection-card { display:flex; min-width:0; flex-direction:column; background:#fff; border:1px solid rgba(31,31,31,.14); transition:transform .25s ease,box-shadow .25s ease; }
.shop-collection-card:hover,.shop-collection-card:focus-within { transform:translateY(-5px); box-shadow:7px 7px 0 var(--coral); }
.shop-collection-image { position:relative; display:flex; align-items:center; justify-content:center; aspect-ratio:1.35; overflow:hidden; background:#f2eee7; }
.shop-collection-image img { width:100%; height:100%; padding:1.2rem; object-fit:contain; transition:transform .35s ease; }
.shop-collection-card:hover .shop-collection-image img,.shop-collection-image:focus-visible img { transform:scale(1.06); }
.shop-collection-number { position:absolute; top:.8rem; left:.8rem; display:grid; width:2rem; height:2rem; place-items:center; border-radius:50%; background:#fff; color:var(--ink); font:.6rem var(--mono); }
.shop-collection-caption { display:flex; flex:1; align-items:center; justify-content:space-between; gap:.8rem; padding:1rem 1.1rem 1.15rem; }
.shop-collection-caption h3 { margin:0 0 .35rem; font:600 1.1rem/1.15 var(--serif); }
.shop-collection-caption p { margin:0; color:#626262; font-size:.73rem; line-height:1.5; }
.shop-collection-caption > a { flex:0 0 auto; display:grid; width:2.2rem; height:2.2rem; place-items:center; border:1px solid var(--ink); border-radius:50%; color:var(--ink); text-decoration:none; transition:background .2s,color .2s; }
.shop-collection-caption > a:hover,.shop-collection-caption > a:focus-visible { background:var(--ink); color:#fff; }
.shop-collection-purchase { display:flex; align-items:center; justify-content:space-between; gap:.75rem; padding:.8rem 1.1rem; border-top:1px solid rgba(31,31,31,.12); }
.shop-collection-purchase > strong { font:600 1.1rem var(--serif); white-space:nowrap; }
.shop-collection-purchase .button { padding:.6rem .9rem; font-size:.72rem; }
.shop-inquire-link { color:var(--ink); font-size:.75rem; font-weight:800; text-decoration:underline; text-underline-offset:.2rem; }
.shop-grid-wrap { padding-top:clamp(3rem,6vw,5rem); }
.shop-products-heading { margin-bottom:2rem; }
.shop-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:1.5rem; }
.product-card { display:flex; flex-direction:column; background:#fff; border:1px solid rgba(31,31,31,.16); transition:transform .25s ease,box-shadow .25s ease; }
.product-card:hover,.product-card:focus-within { transform:translateY(-4px); box-shadow:6px 6px 0 rgba(255,87,50,.65); }
.product-card-image, .product-detail-image { display:flex; align-items:center; justify-content:center; aspect-ratio:1; background:#fff; overflow:hidden; color:#777; font:.75rem var(--mono); }
.product-card-image img, .product-detail-image img { width:100%; height:100%; padding:1rem; object-fit:contain; }
.product-card-body { display:flex; flex:1; flex-direction:column; gap:.6rem; padding:1.1rem; border-top:1px solid var(--ink); }
.product-card-body h2 { margin:0; font:600 1.35rem/1.15 var(--serif); }
.product-card-body p { margin:0; color:#555; font-size:.9rem; }
.product-card-foot { display:flex; align-items:center; justify-content:space-between; gap:.75rem; margin-top:auto; padding-top:.5rem; flex-wrap:wrap; }
.product-card-foot strong, .product-price { font:600 1.2rem var(--serif); }
.stock-out { color:#a3270c; font-weight:700; }
.stock-low { color:var(--coral); font-weight:700; }
.shop-empty { max-width:520px; padding:2rem; border:1px solid var(--ink); background:#fff; }
.shop-empty h2 { margin-top:0; }
.shop-empty h3 { margin-top:0; font:600 1.6rem var(--serif); }
.shop-empty a { font-weight:800; text-decoration:underline; }
.shop-empty .button { margin-top:1rem; }
.shop-partnership { position:relative; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:stretch; gap:0; overflow:hidden; padding:0; background:#20221e; color:#fff; }
.shop-partnership-image { position:relative; min-height:clamp(480px,42vw,680px); align-self:stretch; overflow:hidden; background:#343630; }
.shop-partnership-image img { position:absolute; inset:0; display:block; width:100%; height:100%; object-fit:cover; object-position:center; }
.shop-partnership-copy { max-width:820px; align-self:center; padding:clamp(3rem,6vw,6rem) clamp(1.5rem,8vw,8rem); }
.shop-partnership .eyebrow { color:var(--sun); }
.shop-partnership h2 { margin:.7rem 0 1rem; font-size:clamp(2.4rem,5vw,5rem); }
.shop-partnership h2 em { color:var(--sun); }
.shop-partnership-copy > p:not(.eyebrow) { max-width:620px; color:#dededc; line-height:1.7; }
.shop-partnership .shop-text-link { color:#fff; }

.product-detail { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(2rem,6vw,6rem); align-items:start; }
.product-detail-image { border:1px solid var(--ink); }
.product-detail-copy h1 { margin:1rem 0 .5rem; font-size:clamp(2.4rem,5vw,4rem); }
.product-description { margin:1.25rem 0; line-height:1.6; }
.add-form { display:flex; align-items:end; gap:1rem; margin-top:1.5rem; }
.add-form label, .cart-qty { font-weight:700; font-size:.8rem; }
.add-form input { display:block; width:90px; margin-top:.35rem; padding:.7rem; border:1px solid var(--ink); }

.cart-page h1, .checkout-page h1 { margin-bottom:2rem; }
.cart-lines { border-top:1px solid var(--ink); }
.cart-line { display:grid; grid-template-columns:72px 1fr auto auto auto; gap:1rem; align-items:center; padding:1rem 0; border-bottom:1px solid var(--line); }
.cart-line-image { width:72px; height:72px; background:#fff; border:1px solid var(--line); }
.cart-line-image img { width:100%; height:100%; object-fit:contain; }
.cart-line-info small { display:block; color:#666; }
.cart-qty { display:flex; align-items:center; gap:.6rem; }
.cart-qty input { width:70px; padding:.55rem; border:1px solid var(--ink); }
.cart-qty button, .cart-remove { background:none; border:0; cursor:pointer; font:inherit; }
.cart-remove { font-size:1.6rem; line-height:1; color:#777; }
.cart-remove:hover { color:var(--coral); }
.cart-summary { display:grid; gap:.9rem; width:100%; max-width:420px; margin:0 0 0 auto; padding:1.5rem; background:#fff; border:1px solid var(--ink); }
.cart-bottom { display:grid; grid-template-columns:minmax(0,1fr) minmax(300px,420px); gap:clamp(1.5rem,4vw,4rem); align-items:start; margin-top:2rem; }
.cart-bottom-empty { grid-template-columns:minmax(0,640px); }
.cart-recommend { padding:1.5rem; background:var(--pink); border:1px solid var(--ink); }
.cart-recommend h2 { margin:.4rem 0 .5rem; font:600 clamp(1.5rem,2.4vw,2.1rem)/1.1 var(--serif); }
.cart-recommend h2 em { color:var(--coral); }
.cart-recommend-lead { margin:0 0 1.2rem; color:#444; font-size:.9rem; }
.recommend-list { display:grid; gap:.75rem; }
.recommend-card { display:grid; grid-template-columns:72px 1fr auto; gap:1rem; align-items:center; padding:.7rem; background:#fff; border:1px solid var(--line); }
.recommend-image { display:block; width:72px; height:72px; background:#fff; }
.recommend-image img { width:100%; height:100%; object-fit:contain; }
.recommend-info { display:grid; gap:.15rem; }
.recommend-info small { color:#555; }
.recommend-badge { justify-self:start; padding:.1rem .5rem; background:var(--sun); font:.62rem var(--mono); text-transform:uppercase; letter-spacing:.06em; }
.recommend-card .button { padding:.55rem 1rem; font-size:.8rem; }
.cart-summary p, .checkout-summary p, .confirmation-card p { display:flex; justify-content:space-between; gap:1rem; margin:0; }
.cart-summary small, .checkout-summary small { color:#555; }

.checkout-grid { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(260px,1fr); gap:clamp(2rem,5vw,5rem); align-items:start; }
.checkout-form { display:grid; grid-template-columns:1fr; gap:1.4rem; }
.checkout-form fieldset { display:grid; gap:1rem; margin:0; padding:1.25rem; border:1px solid var(--ink); background:#fff; }
.checkout-form legend { padding:0 .5rem; font:.7rem var(--mono); text-transform:uppercase; letter-spacing:.08em; }
.checkout-form label { display:grid; gap:.35rem; font-weight:700; font-size:.82rem; }
.checkout-form input:not([type=radio]), .checkout-form select, .checkout-form textarea { width:100%; padding:.8rem; border:1px solid var(--ink); font:inherit; background:#fff; }
.radio-card { display:flex !important; align-items:flex-start; gap:.8rem; padding:.9rem; border:1px solid var(--line); cursor:pointer; }
.radio-card input { margin-top:.3rem; }
.radio-card small { display:block; font-weight:500; color:#555; }
.mpesa-instructions { padding:1rem 1.25rem; background:var(--lime); }
.mpesa-instructions ol { margin:0 0 1rem; padding-left:1.2rem; line-height:1.7; }
.mpesa-instructions[hidden] { display:none; }
.hp-field { position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.checkout-summary { position:sticky; top:1.5rem; display:grid; gap:.8rem; padding:1.5rem; background:#fff; border:1px solid var(--ink); }
.checkout-summary h2 { margin:0; font:600 1.4rem var(--serif); }
.checkout-total { padding-top:.8rem; border-top:1px solid var(--ink); font-weight:800; }

.confirmation-page { display:grid; gap:1.25rem; justify-items:start; }
.confirmation-card { width:min(520px,100%); display:grid; gap:.7rem; padding:1.5rem; background:#fff; border:1px solid var(--ink); }

.enterprise-shop-cta { margin-top:2.25rem; }
.enterprise-shop-cta .button { padding:.7rem 1.1rem; font-size:.82rem; }

.whatsapp-float { position:fixed; right:1.25rem; bottom:1.25rem; z-index:50; display:flex; align-items:center; gap:.55rem; padding:.8rem; border-radius:999px; background:#25d366; color:#fff; font-weight:800; font-size:.85rem; box-shadow:0 6px 18px rgba(0,0,0,.25); }
.whatsapp-float:hover { background:#1ebe5a; }
.whatsapp-float span { display:none; }
@media (min-width:700px) { .whatsapp-float { padding:.8rem 1.2rem .8rem .9rem; } .whatsapp-float span { display:inline; } }
.nav-cart-count { display:inline-grid; place-items:center; min-width:1.3rem; height:1.3rem; margin-left:.25rem; padding:0 .3rem; border-radius:999px; background:var(--coral); color:#fff; font-size:.7rem; }

@media (max-width:800px) {
    .shop-hero { min-height:560px; background-position:58% center; }
    .shop-values { grid-template-columns:1fr; padding:0 clamp(1.25rem,7vw,3rem); }
    .shop-values > div,.shop-values > div + div { padding:1.2rem 0; border-left:0; border-bottom:1px solid rgba(255,255,255,.22); }
    .shop-values > div:last-child { border-bottom:0; }
    .shop-section-heading { align-items:flex-start; flex-direction:column; gap:.75rem; }
    .shop-collection-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:.8rem; }
    .shop-collection-caption { align-items:flex-start; padding:.8rem; }
    .shop-collection-purchase { padding:.75rem .8rem; }
    .shop-collection-caption h3 { font-size:1rem; }
    .shop-partnership { grid-template-columns:1fr; }
    .shop-partnership-image { min-height:clamp(260px,65vw,420px); }
    .shop-partnership-copy { padding:clamp(2rem,7vw,3.5rem) clamp(1.25rem,7vw,3rem); }
    .product-detail, .checkout-grid { grid-template-columns:1fr; }
    .checkout-summary { position:static; }
    .cart-line { grid-template-columns:56px 1fr auto; }
    .cart-line-image { width:56px; height:56px; }
    .cart-qty { grid-column:1 / -1; }
    .cart-summary { max-width:none; }
    .cart-bottom { grid-template-columns:1fr; }
    .cart-bottom .cart-summary { order:-1; }
    .recommend-card { grid-template-columns:56px 1fr auto; }
    .recommend-image { width:56px; height:56px; }
}
@media (max-width:480px) {
    .shop-hero { min-height:540px; background-image:linear-gradient(90deg,rgba(255,248,240,.94),rgba(255,248,240,.76)),url('../images/shop/intro-background.jpg'); background-position:58% center; }
    .shop-hero h1 { font-size:clamp(3rem,13vw,4rem); }
    .shop-collection-grid { grid-template-columns:1fr; }
    .shop-collection-image { aspect-ratio:1.55; }
}
