/* Latest on Animworks: the sheet under the banner and the New on Animworks pop-up.
   Every value from animworks-handoff HANDOFF.md 2b and the prototype markup. */
.awh-hero__row{position:relative;z-index:1}
.awh-hero__card{box-shadow:0 6px 18px rgba(0,0,0,0.7)}
.awh button.awlt-tab,.awlt-modal button.awlt-filter,.awlt-modal button.awlt-close,.awlt-modal button.awlt-item__row{all:unset;box-sizing:border-box;cursor:pointer;text-transform:none;letter-spacing:0;line-height:normal;-webkit-appearance:none;appearance:none}
.awh button.awlt-tab{display:block;width:calc(100% - 40px);margin:0 20px;text-align:left;border-radius:0 0 12px 12px;background:linear-gradient(180deg,#111111 0%,#1A1A1A 38%,#1A1A1A 100%);padding:14px 18px 12px;color:#F2F0EA;position:relative;z-index:0;transition:filter 120ms,transform 200ms cubic-bezier(0.22,1,0.36,1);box-shadow:inset 0 14px 18px -12px rgba(0,0,0,0.85)}
.awh button.awlt-tab:hover{filter:brightness(1.12);transform:translateY(2px)}
.awh button.awlt-tab:active{transform:translateY(1px)}
.awh button.awlt-tab:focus-visible,.awlt-modal button:focus-visible{outline:2px solid rgba(228,172,1,0.6);outline-offset:2px}
.awlt-tab__head{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.awlt-tab__eyebrow{font-family:'LM Pro','LEMON MILK Pro','Lemon Milk Pro','Montserrat',sans-serif;font-weight:700;font-size:12px;letter-spacing:0.12em;text-transform:uppercase;color:#E4AC01}
.awlt-tab__right{margin-left:auto;font-family:'Poppins',sans-serif;font-size:11px;font-weight:600;letter-spacing:0.1em;text-transform:uppercase;color:#8A8880}
.awlt-tab__rows{display:flex;flex-direction:column;gap:6px}
.awlt-tab__row{display:grid;grid-template-columns:8px minmax(0,1fr) auto;align-items:center;gap:12px}
.awlt-dot{width:6px;height:6px;border-radius:999px;display:block}
.awlt-tab__title{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:'Poppins',sans-serif;font-size:14px;color:#F2F0EA}
.awlt-tab__when{font-family:'Poppins',sans-serif;font-size:13px;font-weight:600;color:#8A8880;white-space:nowrap}
@media(max-width:640px){.awh button.awlt-tab{width:calc(100% - 24px);margin:0 12px;padding:12px 14px 10px}}

/* pop-up */
@keyframes awltFade{from{opacity:0}to{opacity:1}}
@keyframes awltPop{from{opacity:0;transform:scale(0.96)}to{opacity:1;transform:none}}
.awlt-modal{position:fixed;inset:0;z-index:10000;/* design says 200; the WoodMart header sits at 350, so the sheet goes above it */background:rgba(0,0,0,0.6);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;padding:24px;animation:awltFade 200ms cubic-bezier(0.22,1,0.36,1)}
.awlt-modal[hidden]{display:none}
.awlt-dialog{width:100%;max-width:640px;max-height:calc(100vh - 48px);background:#1C1C1C;border-radius:14px;box-shadow:0 24px 64px rgba(0,0,0,0.6);display:flex;flex-direction:column;overflow:hidden;animation:awltPop 220ms cubic-bezier(0.22,1,0.36,1);transform-origin:center}
.awlt-dialog__head{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:16px;padding:18px 20px;border-bottom:1px solid #262626}
/* the prototype's own render wraps its close button under the pills at 640px; here the eyebrow and close share row one and the pills take row two */
.awlt-dialog__brand{display:flex;align-items:center;gap:10px}
.awlt-filters{grid-column:1 / -1;justify-self:start;max-width:100%;display:flex;gap:2px;background:#141414;border-radius:999px;padding:3px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.awlt-filters::-webkit-scrollbar{display:none}
.awlt-dialog__brand{grid-column:1}
.awlt-modal button.awlt-close{grid-column:2;grid-row:1;justify-self:end}
.awlt-modal button.awlt-filter{display:inline-flex;align-items:center;justify-content:center;flex:none;height:26px;padding:0 12px;border-radius:999px;border:0;background:transparent;color:#8A8880;font-family:'Poppins',sans-serif;font-size:10px;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;cursor:pointer;transition:background 120ms,color 120ms}
.awlt-modal button.awlt-filter.is-on{background:#E4AC01;color:#141414}
.awlt-modal button.awlt-close{width:32px;height:32px;border-radius:999px;border:0;background:none;color:#8A8880;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:color 120ms,background 120ms}
.awlt-modal button.awlt-close:hover{color:#F2F0EA;background:#262626}
.awlt-dialog__body{overflow-y:auto;padding:6px 20px;min-height:0}
.awlt-item{border-bottom:1px solid #262626}
.awlt-item[hidden]{display:none}
.awlt-modal button.awlt-item__row{width:100%;display:grid;grid-template-columns:32px minmax(0,1fr) 20px;gap:14px;align-items:center;padding:14px 0;background:none;border:0;cursor:pointer;text-align:left;color:inherit;font:inherit}
.awlt-item__icon{width:32px;height:32px;border-radius:999px;background:#262626;display:flex;align-items:center;justify-content:center;color:#B0B0B0;overflow:hidden;flex:none}
.awlt-item__icon--img img{width:32px;height:32px;object-fit:cover;display:block}
.awlt-item__pic{display:block;border-radius:10px;overflow:hidden;background:#262626}
.awlt-item__pic--tall{width:min(100%,180px);aspect-ratio:7/10} /* product thumbnails are portrait 700x1000: shown whole, upright */
.awlt-item__pic--wide{width:min(100%,400px);aspect-ratio:16/9} /* article banners */
.awlt-item__pic img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 300ms cubic-bezier(0.22,1,0.36,1)}
.awlt-item__pic:hover img{transform:scale(1.03)}
.awlt-item__tile{width:64px;height:64px;border-radius:14px;background:#262626;display:flex;align-items:center;justify-content:center}
.awlt-item__text{min-width:0;display:flex;flex-direction:column;gap:4px}
.awlt-item__line{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.awlt-item__title{font-family:'Readex Pro','Poppins',sans-serif;font-weight:500;font-size:14px;color:#F2F0EA}
.awlt-pill{font-family:'Poppins',sans-serif;font-size:9px;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;border-radius:999px;padding:2px 7px}
.awlt-item__when{font-family:'Poppins',sans-serif;font-size:10px;font-weight:600;letter-spacing:0.1em;text-transform:uppercase;color:#6F6D67}
.awlt-item__chev{transition:transform 200ms cubic-bezier(0.22,1,0.36,1)}
.awlt-item.is-open .awlt-item__chev{transform:rotate(180deg)}
.awlt-item__detail{padding:0 0 16px 46px;display:flex;flex-direction:column;gap:12px;animation:awltFade 200ms cubic-bezier(0.22,1,0.36,1)}
.awlt-item__detail[hidden]{display:none}
.awlt-item__blurb{margin:0;font-family:'Poppins',sans-serif;font-size:14px;line-height:1.6;color:#C9C7C1;text-wrap:pretty}
.awlt-kv{display:flex;flex-direction:column;gap:6px}
.awlt-kv > div{display:flex;align-items:baseline;gap:10px;font-family:'Poppins',sans-serif;font-size:13px;line-height:1.5}
.awlt-kv__k{color:#6F6D67;min-width:80px;font-size:11px;font-weight:600;letter-spacing:0.08em;text-transform:uppercase}
.awlt-kv__v{color:#C9C7C1}
.awlt-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding-top:2px}
.awlt-btn{display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 16px;border-radius:999px;font-family:'Poppins',sans-serif;font-size:11px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;text-decoration:none;cursor:pointer;transition:background 120ms,color 120ms,border-color 120ms,transform 120ms cubic-bezier(0.22,1,0.36,1)}
.awlt-btn:active{transform:scale(0.97)}
.awlt-btn--cart{border:1px solid #E4AC01;background:transparent;color:#E4AC01}
.awlt-btn--cart:hover,.awlt-btn--cart.added,.awlt-btn--cart.is-in{background:#E4AC01;color:#141414}
.awlt-btn--cart.loading{opacity:0.7}
.awlt-btn__price{opacity:0.7}
.awlt-btn--link{gap:6px;border:1px solid #3A3A3A;color:#C9C7C1}
.awlt-btn--link:hover{border-color:#E4AC01;color:#E4AC01}
.awlt-by{margin-left:auto;font-family:'Poppins',sans-serif;font-size:12px;color:#6F6D67}
.awlt-empty{margin:0;padding:24px 0;font-family:'Poppins',sans-serif;font-size:14px;color:#8A8880;text-align:center}
.awlt-dialog__foot{padding:12px 20px;border-top:1px solid #262626;font-family:'Poppins',sans-serif;font-size:12px;color:#6F6D67}
body.awlt-locked{overflow:hidden}
@media(prefers-reduced-motion:reduce){.awlt-modal,.awlt-dialog,.awlt-item__detail{animation:awltFade 120ms linear}.awh button.awlt-tab,.awh button.awlt-tab:hover{transform:none}}
@media(prefers-reduced-transparency:reduce){.awlt-modal{backdrop-filter:none;-webkit-backdrop-filter:none;background:rgba(0,0,0,0.85)}}
