/* Tamm — Apple-style layer (loads last). Tokens, type, touch targets, motion. */
:root{
  --tamm-muted:#5a6a82; --tamm-radius:24px;
  --ap-ease:cubic-bezier(.28,.11,.32,1); --ap-spring:cubic-bezier(.34,1.4,.64,1);
  --ap-r-s:12px; --ap-r-m:20px; --ap-r-l:28px;
  --ap-glass:rgba(255,255,255,.72);
}
html{-webkit-text-size-adjust:100%;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
body{font-family:'IBM Plex Sans Arabic','Cairo',system-ui,sans-serif!important;font-size:16px;line-height:1.7}
h1,h2,h3{text-wrap:balance;letter-spacing:0!important}
p{text-wrap:pretty}
/* calm the decoration */
.bg-anim,.ambient,.hero-orb,.tamm-app::before{display:none!important}
.hero-section h1{font-weight:700!important;line-height:1.15!important;font-size:clamp(40px,6.4vw,72px)!important}
.hero-section p{font-size:clamp(16px,1.6vw,19px)!important;color:var(--tamm-muted)}
.eyebrow,.hero-kicker{font-size:13px!important}
/* header: translucent glass, hairline */
.site-header{background:var(--ap-glass)!important;-webkit-backdrop-filter:saturate(180%) blur(22px)!important;backdrop-filter:saturate(180%) blur(22px)!important;border-bottom:.5px solid rgba(15,32,64,.12)!important;box-shadow:none!important;transition:background .4s var(--ap-ease),box-shadow .4s var(--ap-ease)}
.site-header.is-scrolled{background:rgba(255,255,255,.86)!important;box-shadow:0 1px 0 rgba(15,32,64,.06),0 8px 30px rgba(15,32,64,.06)!important}
.announcement{font-size:13px!important}
/* touch targets 44px */
.nav-link,.account-button,.wishlist-button,.cart-button,.mobile-menu-button,.icon-button,.drawer-close,#notificationBell,.carousel-btn,.filter-tab,.wishlist-card-btn,.faq-toggle{min-width:44px;min-height:44px}
.quantity-control button{width:36px!important;height:36px!important}
.text-link{display:inline-flex;align-items:center;min-height:44px}
@media(max-width:640px){
  
  .hero-visual{display:none!important}
  .hero-section{padding-block:36px 28px!important}
  .account-chip-text{white-space:nowrap}
}
/* buttons & press feedback */
button,.btn,.product-card,.step-card,.faq-item{-webkit-tap-highlight-color:transparent}
.hero-primary,.hero-secondary,.btn,.add-button,.checkout-button,.package-order-btn,.filter-tab,.nav-link,.account-button,.cart-button,.wishlist-button,.icon-button{transition:transform .35s var(--ap-ease),background-color .3s var(--ap-ease),box-shadow .35s var(--ap-ease),color .25s!important}
.hero-primary,.btn-primary,.add-button,.checkout-button{border-radius:980px!important}
.hero-primary:active,.btn:active,.add-button:active,.checkout-button:active,.filter-tab:active,.cart-button:active,.account-button:active{transform:scale(.96)!important}
@media(hover:hover){.hero-primary:hover,.btn-primary:hover,.add-button:hover{transform:scale(1.03)}}
:where(a,button,input,select,textarea,[tabindex],.product-card):focus-visible{outline:3px solid rgba(25,87,166,.55)!important;outline-offset:3px!important;border-radius:var(--ap-r-s)}
/* product cards: calm, uniform, depth on hover */
.product-card{border-radius:var(--ap-r-m)!important;overflow:hidden;transition:transform .5s var(--ap-ease),box-shadow .5s var(--ap-ease)!important;will-change:transform}
.product-card [class*="media"],.product-card [class*="thumb"],.product-card [class*="cover"],.product-card [class*="image"]{background:linear-gradient(160deg,#eef3fa,#dfe8f4)!important}
.product-copy{padding:16px 18px!important}
@media(hover:hover){.product-card:hover{transform:translateY(-6px) scale(1.012);box-shadow:0 26px 60px rgba(15,32,64,.16)!important}}
.product-card:active{transform:scale(.97)}
.wishlist-card-btn{inset-inline-end:10px!important;inset-inline-start:auto!important;top:10px!important}
.product-price{font-weight:700}
/* sections, cards */
.section{padding-block:clamp(56px,9vw,120px)}
.card,.step-card,.stat-card,.special-card,.faq-item,.review-card{border-radius:var(--ap-r-m)!important}
.step-index{color:#8795ab!important}
.special-lines{display:none!important} /* skeleton-looking bars */
.faq-answer{transition:grid-template-rows .45s var(--ap-ease),opacity .35s}
.footer-cta{text-align:center;justify-content:center!important;flex-direction:column;align-items:center}
.site-footer .brand strong,.site-footer .brand-copy strong{color:#fff!important;-webkit-text-fill-color:#fff!important;background:none!important}
/* drawers & dialogs */
.cart-drawer{transition:transform .55s var(--ap-ease)!important;box-shadow:none!important;border-radius:0 var(--ap-r-l) var(--ap-r-l) 0}
.cart-drawer.is-open{box-shadow:0 0 80px rgba(9,26,50,.22)!important}
.drawer-backdrop{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:rgba(9,26,50,.28)!important;transition:opacity .4s var(--ap-ease)}
.empty-cart,.cart-empty{border:0!important;background:none!important}
.cart-item-copy strong{font-size:14px!important}.cart-item-copy>span{font-size:12px!important}
.account-chip-text,.drawer-account span{text-overflow:clip!important;overflow:visible!important}
/* scroll reveal */
.ap-reveal{opacity:0;transform:translateY(28px) scale(.985);transition:opacity .9s var(--ap-ease),transform .9s var(--ap-ease);transition-delay:var(--ap-d,0s)}
.ap-reveal.is-in{opacity:1;transform:none}
.hero-copy>*{animation:apUp 1s var(--ap-ease) both}
.hero-copy>:nth-child(2){animation-delay:.08s}.hero-copy>:nth-child(3){animation-delay:.16s}.hero-copy>:nth-child(4){animation-delay:.24s}.hero-copy>:nth-child(5){animation-delay:.32s}
.hero-visual{animation:apUp 1.2s var(--ap-ease) .2s both}
.hero-float-card{animation:apFloat 7s ease-in-out infinite}.hero-float-card--bottom{animation-delay:-3.5s}
@keyframes apUp{from{opacity:0;transform:translateY(32px)}to{opacity:1;transform:none}}
@keyframes apFloat{50%{transform:translateY(-8px)}}
.page-enter{animation:apUp .6s var(--ap-ease) both}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .ap-reveal{opacity:1;transform:none}
}

/* ===== v76: tab bar, Copa chat colors, extra motion ===== */
.ap-tabbar{display:none}
@media(max-width:820px){
  body{padding-bottom:calc(76px + env(safe-area-inset-bottom))!important}
  .wishlist-button,.cart-button,.account-button{display:none!important}
  #notificationBell{display:grid!important}
  .ap-tabbar{position:fixed;inset-inline:0;bottom:0;z-index:70;display:grid;grid-template-columns:repeat(6,1fr);
    padding:6px 6px calc(6px + env(safe-area-inset-bottom));background:rgba(255,255,255,.82);
    -webkit-backdrop-filter:saturate(180%) blur(24px);backdrop-filter:saturate(180%) blur(24px);
    border-top:.5px solid rgba(15,32,64,.14);animation:apTabIn .8s var(--ap-ease) .3s both}
  .ap-tab{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:56px;
    border:0;background:none;color:#5a6a82;font:600 12px/1.2 inherit;font-family:inherit;border-radius:16px;cursor:pointer;
    transition:color .3s var(--ap-ease),background-color .3s var(--ap-ease),transform .3s var(--ap-ease)}
  .ap-tab svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:transform .45s var(--ap-spring)}
  .ap-tab:active{transform:scale(.9)}
  .ap-tab.is-active{color:#1957a6;background:rgba(25,87,166,.09)}
  .ap-tab.is-active svg{transform:translateY(-2px) scale(1.12)}
  .ap-tab b{position:absolute;top:4px;inset-inline-end:calc(50% - 20px);min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:#e5484d;color:#fff;font-size:11px;line-height:18px;text-align:center;animation:apPop .5s var(--ap-spring)}
  .ap-tab b:empty,.ap-tab b[hidden]{display:none}
  .support-launcher,.tc-launcher{bottom:calc(88px + env(safe-area-inset-bottom))!important}
  .product-grid{gap:12px!important}
}
@keyframes apTabIn{from{transform:translateY(100%);opacity:0}to{transform:none;opacity:1}}
@keyframes apPop{from{transform:scale(.5);opacity:0}to{transform:none;opacity:1}}
/* Copa — readable chat colors */
.tc-head,.support-header{background:linear-gradient(135deg,#122b54,#1957a6)!important;color:#fff!important}
.tc-head strong,.support-header strong{color:#fff!important;font-size:16px!important}
.tc-head-text span,.support-header span{color:rgba(255,255,255,.88)!important;font-size:12px!important}
.tc-msg.tc-bot,.support-message-bot{background:#f0f4fa!important;color:#0f2040!important;font-size:14px!important;line-height:1.8}
.tc-msg:not(.tc-bot):not(.tc-quick),.support-message-user{background:#1957a6!important;color:#fff!important;font-size:14px!important}
.tc-quick button,.support-quick button{background:#fff!important;color:#0f2040!important;border:1px solid #d5dfec!important;font-size:13px!important;min-height:40px;transition:transform .3s var(--ap-ease),background-color .3s}
.tc-quick button:active,.support-quick button:active{transform:scale(.95)}
.tc-form input,.support-input-row input{background:#fff!important;color:#0f2040!important;font-size:15px!important}
.tc-form input::placeholder,.support-input-row input::placeholder{color:#6b7a90!important}
.tc-note,.support-powered,.support-human span,.support-welcome p{color:#53627a!important;font-size:12.5px!important}
.support-welcome h3,.support-welcome-chip{color:#0f2040!important}
.tc-msg{animation:apMsg .5s var(--ap-spring) both}
@keyframes apMsg{from{opacity:0;transform:translateY(12px) scale(.96)}to{opacity:1;transform:none}}
.support-widget,.tc-panel{transform-origin:bottom left;animation:apPanel .55s var(--ap-spring) both}
@keyframes apPanel{from{opacity:0;transform:scale(.88) translateY(20px)}to{opacity:1;transform:none}}
/* dialogs spring in; images settle; reveal gets a soft blur */
.modal-overlay.active>*,.dialog-layer>*{animation:apPanel .5s var(--ap-spring) both}
.ap-reveal{filter:blur(6px)}.ap-reveal.is-in{filter:none}
.product-card img{transition:transform .8s var(--ap-ease)}
@media(hover:hover){.product-card:hover img{transform:scale(1.06)}}
.faq-item{transition:box-shadow .4s var(--ap-ease),transform .4s var(--ap-ease)}
.faq-item:hover{box-shadow:0 10px 30px rgba(15,32,64,.08)}
.cart-badge,.wishlist-badge{animation:apPop .5s var(--ap-spring)}
