/* Eye-friendly typography shared by the storefront and AI assistant. */
:root{--muted:#c8bfb2;--line:#504538}
body{font-size:17px;line-height:1.6;letter-spacing:.005em}p{line-height:1.65}
.utility{height:38px;font-size:14px;color:#d4cbbf}
.search-wrap input{height:50px;font-size:16px}
.head-action small,.category-scroll a{font-size:14px;font-weight:600}
.cart-pill,.cart-pill strong{font-size:15px}
.hero p{font-size:17px;line-height:1.65;color:#f0eee2}.hero .eyebrow{font-size:13px;letter-spacing:.1em}.hero h1{font-size:clamp(38px,5vw,64px)}
.hero .btn,.btn{font-size:16px;min-height:44px;padding:11px 17px}
.trust-card b,.shortcut b{font-size:16px}.trust-card small,.shortcut small,.suggest-item small{font-size:14px;line-height:1.45}
.section-title h2{font-size:29px}.section-title a{font-size:15px;font-weight:700}
.filters h3{font-size:17px}.filter-block b,.filter-block label{font-size:15px;line-height:1.5}.filter-block label{padding:4px 0}
.sort{min-height:44px;font-size:15px;padding:10px 12px}.catalog-head p{font-size:15px}
.product-card{padding:13px}.product-card h3{font-size:17px;line-height:1.35;font-weight:700;white-space:normal;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;min-height:46px}
.product-meta,.price small{font-size:14px;line-height:1.45}.price{font-size:22px}.stock{font-size:14px;font-weight:700;line-height:1.4}.badge{font-size:14px;padding:4px 8px}
.add-row button{min-height:44px;font-size:15px;padding:10px 6px}.qty{min-height:44px}.qty button{width:42px;min-height:42px}.qty span{font-size:16px}.favorite{width:40px;height:40px;font-size:21px}
.cart-item h3{font-size:18px;line-height:1.4}.cart-item small{font-size:14px}.sum-row{font-size:16px}.sum-row.total{font-size:21px}
.detail-desc{font-size:17px;line-height:1.7}.step,.field label{font-size:15px;font-weight:600}.field input,.field select{min-height:48px;font-size:16px;padding:12px}
.account-card b{font-size:17px}.account-card small{font-size:14px}
.footer-grid b{font-size:15px}.footer-grid a,.footer-grid p,.footer-bottom{font-size:14px;line-height:1.6}.toast{font-size:15px}.mobile-nav small{font-size:13px;font-weight:600}

.ai-fab-tooltip{font-size:14px;padding:8px 14px}
.ai-header-info h3{font-size:17px}.ai-header-status{font-size:14px;color:#d0c7ba}.ai-btn-icon{min-width:44px;min-height:44px;font-size:18px}
.ai-welcome-box h4{font-size:19px}.ai-welcome-box p{font-size:15px;line-height:1.65;color:#d0c7ba}
.ai-chip{font-size:14px;line-height:1.4;min-height:40px;padding:9px 12px}
.ai-msg{font-size:16px;line-height:1.6;max-width:92%}.ai-bubble{padding:12px 15px}
.ai-action-badge{font-size:14px;line-height:1.4;padding:7px 10px}.ai-product-title{font-size:16px;line-height:1.4}.ai-product-price{font-size:14px;color:#d0c7ba}
.ai-product-btns button{font-size:14px;min-height:40px;padding:8px 10px}.ai-input{font-size:16px;min-height:48px}.ai-send-btn{min-width:48px;min-height:48px;font-size:18px}.ai-footer-note{font-size:14px;color:#c8bfb2}

a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--lime);outline-offset:3px}

@media(max-width:760px){body{font-size:16px}.utility{font-size:14px}.category-scroll a{font-size:14px}.hero h1{font-size:34px;line-height:1.12}.hero p{font-size:16px}.product-card h3{font-size:16px;min-height:44px}.product-meta,.price small{font-size:14px}.price{font-size:20px}.sort{font-size:14px}.mobile-nav a{min-width:56px;min-height:48px;justify-content:center}.mobile-nav small{font-size:14px}.ai-msg{font-size:15px;max-width:94%}.ai-chat-drawer{width:min(420px,calc(100vw - 20px))}}

/* Store card interaction: a clear lift and focus glow without layout shift. */
@media (hover:hover) and (pointer:fine){
  .product-card{isolation:isolate;transition:transform .28s cubic-bezier(.22,1,.36,1),border-color .28s ease,box-shadow .28s ease,background-color .28s ease}
  .product-card::after{content:"";position:absolute;inset:1px;border-radius:13px;pointer-events:none;z-index:-1;opacity:0;background:radial-gradient(circle at 50% 0,rgba(185,217,109,.15),transparent 58%);transform:scaleX(.78);transition:opacity .28s ease,transform .38s cubic-bezier(.22,1,.36,1)}
  .product-card:hover{border-color:#a3b96d;transform:translateY(-6px) scale(1.012);box-shadow:0 16px 30px rgba(0,0,0,.24),0 0 0 1px rgba(185,217,109,.08)}
  .product-card:hover::after{opacity:1;transform:scaleX(1)}
  .product-card .product-image{overflow:hidden}
  .product-card .product-image img{transition:transform .38s cubic-bezier(.22,1,.36,1),filter .28s ease}
  .product-card:hover .product-image img{transform:scale(1.07) translateY(-2px);filter:saturate(1.06)}
  .product-card .favorite{transition:transform .22s cubic-bezier(.22,1,.36,1),background-color .22s ease}
  .product-card:hover .favorite{transform:translateY(-2px) rotate(8deg)}
  .product-card .add-row button:not(:disabled){transition:transform .22s ease,box-shadow .22s ease,filter .22s ease}
  .product-card:hover .add-row button:not(:disabled){box-shadow:0 7px 14px rgba(185,217,109,.16);filter:brightness(1.04)}
}
@media (prefers-reduced-motion:reduce){.product-card,.product-card::after,.product-card .product-image img,.product-card .favorite,.product-card .add-row button:not(:disabled){transition-duration:.01ms!important}.product-card:hover{transform:none}.product-card:hover .product-image img{transform:none}}

.delivery-save-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:14px 0 4px;padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:var(--panel2)}
.save-delivery{display:flex;align-items:center;gap:9px;color:var(--ink);font-size:14px;font-weight:600;cursor:pointer}
.save-delivery input{width:18px;height:18px;accent-color:var(--lime)}
.clear-delivery{border:0;background:transparent;color:var(--muted);font-size:13px;text-decoration:underline;text-underline-offset:3px;padding:6px}
.clear-delivery:hover{color:var(--ink)}
.delivery-save-note{margin:0 0 18px;color:var(--muted);font-size:12px}
@media(max-width:560px){.delivery-save-row{align-items:flex-start;flex-direction:column}.clear-delivery{padding:0}}

.checkout-submit{position:relative;isolation:isolate;overflow:hidden;transform:translateZ(0);transition:transform .16s ease,filter .16s ease,box-shadow .22s ease}
.checkout-submit::before{content:"";position:absolute;z-index:-1;top:-45%;bottom:-45%;left:-32%;width:24%;background:rgba(255,255,255,.62);transform:translateX(-180%) skewX(-18deg);opacity:0}
.checkout-submit:active{transform:translateY(2px) scale(.985);filter:brightness(.94)}
.checkout-submit.is-clicked{animation:checkoutSubmitPulse .58s cubic-bezier(.22,1,.36,1)}
.checkout-submit.is-clicked::before{opacity:1;animation:checkoutSubmitShine .58s ease-out}
@keyframes checkoutSubmitPulse{0%{box-shadow:0 0 0 0 rgba(185,217,109,0)}35%{box-shadow:0 0 0 7px rgba(185,217,109,.18)}100%{box-shadow:0 8px 22px rgba(185,217,109,.2)}}
@keyframes checkoutSubmitShine{0%{transform:translateX(-180%) skewX(-18deg)}100%{transform:translateX(720%) skewX(-18deg)}}
@media (prefers-reduced-motion:reduce){.checkout-submit{transition:none}.checkout-submit.is-clicked{animation:none}.checkout-submit.is-clicked::before{animation:none;opacity:0}}

.cash-change-panel{margin:16px 0 4px;padding:14px;border:1px solid #b9d96d55;border-radius:12px;background:linear-gradient(135deg,#b9d96d0d,#ef8e4508)}
.cash-change-panel[hidden]{display:none}
.cash-change-panel .field{margin-bottom:7px}
.cash-change-panel select{width:100%;background:var(--panel);color:var(--ink);border:1px solid var(--line);border-radius:9px;padding:11px;min-height:48px}
.cash-change-summary{margin:0;color:var(--lime);font-size:14px;font-weight:700}
.cash-change-summary.is-error{color:var(--red)}

.order-placed-overlay{position:fixed;inset:0;z-index:90;display:grid;place-items:center;padding:20px;background:rgba(5,9,8,.72);backdrop-filter:blur(9px);animation:orderPlacedOverlayIn .28s ease both}
.order-placed-overlay.is-closing{animation:orderPlacedOverlayOut .36s ease both;pointer-events:none}
.order-placed-card{position:relative;isolation:isolate;width:min(100%,430px);overflow:hidden;padding:38px 28px 30px;border:1px solid rgba(185,217,109,.38);border-radius:24px;background:linear-gradient(145deg,#182019,#0f1714 70%);box-shadow:0 24px 70px rgba(0,0,0,.42),0 0 0 1px rgba(255,255,255,.04) inset;text-align:center;animation:orderPlacedCardIn .58s cubic-bezier(.22,1,.36,1) both}
.order-placed-card::before{content:"";position:absolute;z-index:-1;inset:-35% 15% auto;height:240px;background:radial-gradient(circle,rgba(185,217,109,.2),transparent 66%);pointer-events:none}
.order-placed-close{position:absolute;top:10px;right:12px;width:36px;height:36px;border:0;border-radius:50%;background:rgba(255,255,255,.07);color:var(--ink);font-size:24px;line-height:1;cursor:pointer;transition:background-color .2s ease,transform .2s ease}
.order-placed-close:hover{background:rgba(255,255,255,.14);transform:rotate(8deg) scale(1.05)}
.order-placed-check{display:grid;place-items:center;width:84px;height:84px;margin:0 auto 20px;border:1px solid rgba(185,217,109,.58);border-radius:50%;background:linear-gradient(145deg,#b9d96d,#789747);box-shadow:0 0 0 9px rgba(185,217,109,.1),0 12px 30px rgba(185,217,109,.2);color:#122014;animation:orderPlacedCheckIn .72s cubic-bezier(.22,1,.36,1) .08s both}
.order-placed-check span{font-size:46px;font-weight:900;line-height:1;transform:translateY(-2px)}
.order-placed-kicker{display:block;color:var(--lime);font-size:12px;font-weight:800;letter-spacing:.13em;text-transform:uppercase}
.order-placed-card h2{margin:8px 0 8px;color:var(--ink);font-size:clamp(28px,6vw,38px);line-height:1.05}
.order-placed-card p{margin:0 auto 9px;max-width:320px;color:var(--muted);font-size:15px;line-height:1.55}
.order-placed-number{display:block;margin:0 0 20px;color:var(--ink);font-size:14px;letter-spacing:.04em}
.order-placed-action{display:inline-flex;position:relative;z-index:1;align-items:center;justify-content:center;min-width:190px}
.order-placed-spark{position:absolute;z-index:-1;color:var(--lime);font-size:20px;pointer-events:none;animation:orderPlacedSpark 1.9s ease-in-out infinite}
.spark-one{top:24%;left:13%}.spark-two{top:31%;right:12%;font-size:16px;animation-delay:.35s}.spark-three{bottom:20%;left:18%;font-size:25px;animation-delay:.7s}.spark-four{bottom:24%;right:19%;font-size:22px;animation-delay:1s}
@keyframes orderPlacedOverlayIn{from{opacity:0}to{opacity:1}}
@keyframes orderPlacedOverlayOut{from{opacity:1}to{opacity:0}}
@keyframes orderPlacedCardIn{from{opacity:0;transform:translateY(22px) scale(.94)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes orderPlacedCheckIn{0%{opacity:0;transform:scale(.35) rotate(-20deg)}65%{opacity:1;transform:scale(1.1) rotate(5deg)}100%{transform:scale(1) rotate(0)}}
@keyframes orderPlacedSpark{0%,100%{opacity:.25;transform:translateY(3px) scale(.8) rotate(0)}50%{opacity:1;transform:translateY(-7px) scale(1.15) rotate(18deg)}}
@media (prefers-reduced-motion:reduce){.order-placed-overlay,.order-placed-overlay.is-closing,.order-placed-card,.order-placed-check,.order-placed-spark{animation:none}.order-placed-overlay.is-closing{opacity:0}.order-placed-close{transition:none}}
